{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "modal",
  "title": "Modal",
  "description": "Polaris-styled Modal component.",
  "dependencies": [],
  "devDependencies": [
    "@shopify/polaris-types"
  ],
  "registryDependencies": [
    "@polaris-shadcn/theme",
    "@polaris-shadcn/utils"
  ],
  "files": [
    {
      "path": "registry/templates/components/ui/modal.tsx",
      "content": "import * as React from \"react\";\nimport { cn } from \"../../lib/utils\";\n\ntype SModalProps = React.ComponentPropsWithoutRef<\"s-modal\">;\ntype SButtonProps = React.ComponentPropsWithoutRef<\"s-button\">;\n\nexport type ModalSize = \"sm\" | \"default\" | \"lg\" | \"xl\";\n\nexport interface ModalProps extends Omit<SModalProps, \"size\"> {\n  className?: string;\n  size?: ModalSize;\n  primaryAction?: React.ReactElement<{ slot?: string }>;\n  secondaryActions?:\n    | React.ReactElement<{ slot?: string }>\n    | React.ReactElement<{ slot?: string }>[];\n}\n\nexport interface ModalTriggerProps extends Omit<SButtonProps, \"children\"> {\n  className?: string;\n  modalId?: string;\n  children: React.ReactElement;\n}\n\nexport interface ModalCloseProps extends Omit<SButtonProps, \"children\"> {\n  className?: string;\n  modalId?: string;\n  children: React.ReactElement;\n}\n\n/** Props injected onto the cloned trigger/close child element. */\ntype ModalCommandChildProps = SButtonProps & {\n  className?: string;\n  ref?: React.ForwardedRef<HTMLElement>;\n};\n\nconst sizeMap: Record<ModalSize, SModalProps[\"size\"]> = {\n  sm: \"small-100\",\n  default: \"base\",\n  lg: \"large\",\n  xl: \"large-100\",\n};\n\nconst Modal = React.forwardRef<HTMLElementTagNameMap[\"s-modal\"], ModalProps>(\n  (\n    {\n      id,\n      className,\n      heading,\n      size = \"default\",\n      padding = \"base\",\n      accessibilityLabel,\n      children,\n      primaryAction,\n      secondaryActions,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedSize = sizeMap[size] ?? sizeMap.default;\n\n    return (\n      <s-modal\n        ref={ref}\n        id={id}\n        {...({ className: cn(className) } as SModalProps)}\n        heading={heading}\n        size={resolvedSize}\n        padding={padding}\n        accessibilityLabel={accessibilityLabel}\n        {...props}\n      >\n        {children}\n        {primaryAction && React.cloneElement(primaryAction, { slot: \"primary-action\" })}\n        {secondaryActions &&\n          React.Children.map(secondaryActions, (action) =>\n            React.cloneElement(action, { slot: \"secondary-actions\" }),\n          )}\n      </s-modal>\n    );\n  },\n);\nModal.displayName = \"Modal\";\n\nconst ModalTrigger = React.forwardRef<HTMLElement, ModalTriggerProps>(\n  ({ modalId, command = \"--show\", children, ...props }, ref) => {\n    return React.cloneElement(children as React.ReactElement<ModalCommandChildProps>, {\n      ref,\n      commandFor: modalId,\n      command,\n      ...props,\n    });\n  },\n);\nModalTrigger.displayName = \"ModalTrigger\";\n\nconst ModalClose = React.forwardRef<HTMLElement, ModalCloseProps>(\n  ({ modalId, children, ...props }, ref) => {\n    return React.cloneElement(children as React.ReactElement<ModalCommandChildProps>, {\n      ref,\n      commandFor: modalId,\n      command: \"--hide\",\n      ...props,\n    });\n  },\n);\nModalClose.displayName = \"ModalClose\";\n\nexport { Modal, ModalTrigger, ModalClose };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}