{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "deposit",
  "type": "registry:block",
  "title": "Stridge Deposit",
  "description": "Providers + deposit flow only. Drops `components/stridge/providers.tsx` and the deposit composition stubs.",
  "dependencies": [
    "@stridge/kit"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "components/stridge/providers.tsx",
      "content": "\"use client\";\n\nimport { StridgeProvider } from \"@stridge/kit\";\nimport type { ReactNode } from \"react\";\n\ninterface Props {\n    children: ReactNode;\n}\n\n/**\n * Fail fast at module load when the workspace's gateway key is missing — without it every\n * driver call dies later with an opaque 4xx and integrators waste time chasing a misconfigured\n * env var. Pull yours from `Developer → Gateway Kit → Connection` in the Stridge dashboard.\n *\n * Wrapped in a function so TypeScript narrows `gatewayKey` to `string` past the assertion —\n * a top-level `throw` doesn't propagate the narrowing to subsequent module statements.\n */\nfunction requireGatewayKey(): string {\n    const key = process.env.NEXT_PUBLIC_STRIDGE_GATEWAY_KEY;\n    if (!key) {\n        throw new Error(\n            \"NEXT_PUBLIC_STRIDGE_GATEWAY_KEY is not set — add it to .env.local before mounting <StridgeAppProvider>.\",\n        );\n    }\n    return key;\n}\n\nconst gatewayKey = requireGatewayKey();\n\n/**\n * Wrap your app's root layout with this provider once. Every flow (deposit, withdraw, …) reads\n * its config off here — fill in the `TODO`s with your gateway key, settlement destination, and\n * any per-flow tuning you need.\n */\nexport function StridgeAppProvider({ children }: Props) {\n    return (\n        <StridgeProvider\n            environment=\"staging\"\n            gatewayKey={gatewayKey}\n            asset={{ networkId: \"1\", symbol: \"USDC\" }}\n            flows={{\n                deposit: {\n                    destination: { address: \"0x0000000000000000000000000000000000000000\" },\n                },\n                withdraw: {\n                    owner: { address: \"0x0000000000000000000000000000000000000000\" },\n                },\n            }}\n        >\n            {children}\n        </StridgeProvider>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/providers.tsx"
    },
    {
      "path": "components/stridge/deposit/deposit.tsx",
      "content": "\"use client\";\n\nimport { useDeposit, useDepositState } from \"@stridge/kit\";\nimport { Deposit } from \"@stridge/kit/deposit/compound\";\nimport { Dialog } from \"@stridge/kit/ui\";\n\nimport { StridgeDepositActivityDetail } from \"./activity-detail\";\nimport { StridgeDepositActivityList } from \"./activity-list\";\nimport { StridgeDepositAmountEntry } from \"./amount-entry\";\nimport { StridgeDepositAssetPicker } from \"./asset-picker\";\nimport { StridgeDepositConfirm } from \"./confirm\";\nimport { StridgeDepositError } from \"./error\";\nimport { StridgeDepositMethods } from \"./methods\";\nimport { StridgeDepositProcessing } from \"./processing\";\nimport { StridgeDepositStatusBanner } from \"./status-banner\";\nimport { StridgeDepositSuccess } from \"./success\";\nimport { StridgeDepositTransferCrypto } from \"./transfer-crypto\";\n\n/**\n * Default deposit composition. Mount once anywhere inside `<StridgeAppProvider>`; open it from\n * elsewhere with `useDeposit().open(...)`. The dialog is a pure composition of compound parts:\n *\n * - `<Deposit.Boundary>` catches render crashes and pipes recovery through `useDeposit().close()`.\n * - `<Deposit.Guards>` cascades the wallet-required / bootstrap-fatal / bootstrap-loading gates.\n * - `<Deposit.Steps>` routes the FSM state to the matching `<Deposit.Step>` child.\n * - `<StridgeDepositStatusBanner />` mounts alongside every screen, gated internally.\n *\n * Interleave your own elements between any two parts, or replace a single `<Deposit.Step>`\n * child with your own panel — the wiring stays inside the kit.\n */\nexport function StridgeDeposit() {\n    const state = useDepositState();\n    const { close } = useDeposit();\n    return (\n        <Dialog\n            open={state.name !== \"closed\"}\n            onOpenChange={(next: boolean) => {\n                if (!next) close();\n            }}\n        >\n            <Dialog.Content>\n                <Deposit.Boundary>\n                    <Deposit.Guards>\n                        <Deposit.Steps>\n                            <Deposit.Step name=\"deposit\">\n                                <StridgeDepositMethods />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"assetPicker\">\n                                <StridgeDepositAssetPicker />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"amountEntry\">\n                                <StridgeDepositAmountEntry />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"confirmDeposit\">\n                                <StridgeDepositConfirm />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"transferCrypto\">\n                                <StridgeDepositTransferCrypto />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"processing\">\n                                <StridgeDepositProcessing />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"success\">\n                                <StridgeDepositSuccess />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"error\">\n                                <StridgeDepositError />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"activityList\">\n                                <StridgeDepositActivityList />\n                            </Deposit.Step>\n                            <Deposit.Step name=\"activityDetail\">\n                                <StridgeDepositActivityDetail />\n                            </Deposit.Step>\n                        </Deposit.Steps>\n                    </Deposit.Guards>\n                    <StridgeDepositStatusBanner />\n                </Deposit.Boundary>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/deposit.tsx"
    },
    {
      "path": "components/stridge/deposit/methods.tsx",
      "content": "\"use client\";\n\nimport { Deposit } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Method-picker screen. `Deposit.Methods` is what the user lands on when the FSM is `deposit` —\n * the kit reads the connected wallet, brand, and per-chain deposit-address list off the driver\n * and renders the canonical method list. Edit the children below to interleave your own elements\n * between parts, drop parts you don't want, or replace the composition entirely.\n */\nexport function StridgeDepositMethods() {\n    return (\n        <Deposit>\n            <Deposit.Header />\n            <Deposit.Body>\n                <Deposit.Methods />\n            </Deposit.Body>\n        </Deposit>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/methods.tsx"
    },
    {
      "path": "components/stridge/deposit/asset-picker.tsx",
      "content": "\"use client\";\n\nimport { AssetPicker } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Asset-picker screen. The kit reads the source-asset list from the driver and feeds the picker;\n * each sub-part below reads from that context. Interleave your own elements between parts to\n * customize the layout.\n */\nexport function StridgeDepositAssetPicker() {\n    return (\n        <AssetPicker>\n            <AssetPicker.Header />\n            <AssetPicker.Body>\n                <AssetPicker.List />\n            </AssetPicker.Body>\n            <AssetPicker.Footer />\n        </AssetPicker>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/asset-picker.tsx"
    },
    {
      "path": "components/stridge/deposit/amount-entry.tsx",
      "content": "\"use client\";\n\nimport { AmountEntry } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Amount-entry screen. The validation hint (min / max / insufficient-balance) is driven by the\n * orchestrated widget and rendered via `<AmountEntry.Notice />` — interleave your own elements\n * around it freely.\n */\nexport function StridgeDepositAmountEntry() {\n    return (\n        <AmountEntry>\n            <AmountEntry.Header />\n            <AmountEntry.Body>\n                <AmountEntry.Hero />\n                <AmountEntry.Pills />\n                <AmountEntry.Flow />\n                <AmountEntry.Notice />\n            </AmountEntry.Body>\n            <AmountEntry.Footer />\n        </AmountEntry>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/amount-entry.tsx"
    },
    {
      "path": "components/stridge/deposit/confirm.tsx",
      "content": "\"use client\";\n\nimport { ConfirmDeposit } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Confirm-deposit screen. The orchestrated `ConfirmDeposit` widget reads its data\n * (`transfer`, `breakdown`, `heroAmountUsd`, `phase`, `quoteTotalSeconds`, …) from the deposit\n * driver and feeds context to every sub-part — the composition below is the canonical default.\n *\n * Edit the children to interleave your own elements between parts, drop parts you don't want,\n * or replace the composition entirely. The widget keeps owning the wiring; you own the layout.\n *\n * Example — drop your own promo banner between the hero and the meta row:\n *\n * ```tsx\n * <ConfirmDeposit>\n *   <ConfirmDeposit.Header />\n *   <ConfirmDeposit.Body>\n *     <ConfirmDeposit.Hero />\n *     <YourPromoBanner />\n *     <ConfirmDeposit.Meta />\n *     <ConfirmDeposit.Amounts />\n *     <ConfirmDeposit.Breakdown />\n *     <ConfirmDeposit.Disclaimer />\n *   </ConfirmDeposit.Body>\n *   <ConfirmDeposit.Footer />\n * </ConfirmDeposit>\n * ```\n */\nexport function StridgeDepositConfirm() {\n    return (\n        <ConfirmDeposit>\n            <ConfirmDeposit.Header />\n            <ConfirmDeposit.Body>\n                <ConfirmDeposit.Hero />\n                <ConfirmDeposit.Meta />\n                <ConfirmDeposit.Amounts />\n                <ConfirmDeposit.Breakdown />\n                <ConfirmDeposit.Disclaimer />\n            </ConfirmDeposit.Body>\n            <ConfirmDeposit.Footer />\n        </ConfirmDeposit>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/confirm.tsx"
    },
    {
      "path": "components/stridge/deposit/transfer-crypto.tsx",
      "content": "\"use client\";\n\nimport { TransferCrypto } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Transfer-crypto screen. The kit reads the per-chain deposit address list and the active token /\n * chain picker state from the driver; sub-parts pull from that context. Interleave your own\n * elements between parts to customize the layout.\n */\nexport function StridgeDepositTransferCrypto() {\n    return (\n        <TransferCrypto>\n            <TransferCrypto.Header />\n            <TransferCrypto.Body>\n                <TransferCrypto.Selectors />\n                <TransferCrypto.QrCode />\n                <TransferCrypto.Summary />\n                <TransferCrypto.Address />\n                <TransferCrypto.Disclosure />\n            </TransferCrypto.Body>\n        </TransferCrypto>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/transfer-crypto.tsx"
    },
    {
      "path": "components/stridge/deposit/processing.tsx",
      "content": "\"use client\";\n\nimport { ProcessingState } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Processing screen — surfaces the in-flight deposit while the indexer confirms the source-chain\n * tx. Sub-parts read their data from the driver context.\n */\nexport function StridgeDepositProcessing() {\n    return (\n        <ProcessingState>\n            <ProcessingState.Header />\n            <ProcessingState.Body>\n                <ProcessingState.Hero />\n                <ProcessingState.StatusPill />\n                <ProcessingState.Details>\n                    <ProcessingState.SourceRow />\n                    <ProcessingState.SourceTxRow />\n                    <ProcessingState.SubmittedAtRow />\n                    <ProcessingState.DetectedAtRow />\n                </ProcessingState.Details>\n            </ProcessingState.Body>\n        </ProcessingState>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/processing.tsx"
    },
    {
      "path": "components/stridge/deposit/success.tsx",
      "content": "\"use client\";\n\nimport { SuccessState } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Success screen. Each row self-gates when its data is absent; `<MoreDetails>` only renders\n * when at least one of its rows would. Compose freely — interleave your own elements anywhere\n * inside the body.\n */\nexport function StridgeDepositSuccess() {\n    return (\n        <SuccessState>\n            <SuccessState.Header />\n            <SuccessState.Body>\n                <SuccessState.Headline />\n                <SuccessState.Details>\n                    <SuccessState.FillStatusRow />\n                    <SuccessState.TotalTimeRow />\n                    <SuccessState.SourceRow />\n                    <SuccessState.DestinationRow />\n                    <SuccessState.YouReceiveRow />\n                    <SuccessState.MoreDetails>\n                        <SuccessState.DepositTxRow />\n                        <SuccessState.CompletionTxRow />\n                        <SuccessState.SubmittedAtRow />\n                        <SuccessState.FilledAtRow />\n                    </SuccessState.MoreDetails>\n                </SuccessState.Details>\n            </SuccessState.Body>\n            <SuccessState.Actions />\n        </SuccessState>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/success.tsx"
    },
    {
      "path": "components/stridge/deposit/error.tsx",
      "content": "\"use client\";\n\nimport { ErrorState } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Error screen. Sub-parts self-gate based on context — settlement-derived failures fill the\n * rows + `<MoreDetails>`, FSM-derived failures (no settlement) render only `<Hero />` and\n * `<Actions />` while the empty rows drop themselves. Compose freely.\n */\nexport function StridgeDepositError() {\n    return (\n        <ErrorState>\n            <ErrorState.Header />\n            <ErrorState.Body>\n                <ErrorState.Hero />\n                <ErrorState.Details>\n                    <ErrorState.FillStatusRow />\n                    <ErrorState.SourceRow />\n                    <ErrorState.DestinationRow />\n                    <ErrorState.YouReceiveRow />\n                    <ErrorState.MoreDetails>\n                        <ErrorState.DepositTxRow />\n                        <ErrorState.SubmittedAtRow />\n                        <ErrorState.FailedAtRow />\n                    </ErrorState.MoreDetails>\n                </ErrorState.Details>\n                <ErrorState.HelpInfo />\n            </ErrorState.Body>\n            <ErrorState.Actions />\n        </ErrorState>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/error.tsx"
    },
    {
      "path": "components/stridge/deposit/activity-list.tsx",
      "content": "\"use client\";\n\nimport { DepositActivityList } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Activity activity list step. Mounts the deposit-orchestrated list wrapper with the\n * compound's default composition — `<Header /> + <List />`. Interleave your own elements\n * between the sub-parts to customise.\n */\nexport function StridgeDepositActivityList() {\n    return (\n        <DepositActivityList>\n            <DepositActivityList.Header />\n            <DepositActivityList.List />\n        </DepositActivityList>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/activity-list.tsx"
    },
    {
      "path": "components/stridge/deposit/activity-detail.tsx",
      "content": "\"use client\";\n\nimport { DepositActivityDetail } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Activity activity per-settlement detail step. Mounts all three per-kind parts of the\n * deposit-orchestrated detail wrapper; each gates internally on the resolved payload's\n * `kind`, so only the matching one renders. Each part composes its corresponding state\n * compound (success / error / processing) with the same default composition the active-flow\n * widgets use — minus the action callbacks (activity detail is read-only).\n */\nexport function StridgeDepositActivityDetail() {\n    return (\n        <DepositActivityDetail>\n            <DepositActivityDetail.Processing />\n            <DepositActivityDetail.Succeeded />\n            <DepositActivityDetail.Failed />\n        </DepositActivityDetail>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/activity-detail.tsx"
    },
    {
      "path": "components/stridge/deposit/status-banner.tsx",
      "content": "\"use client\";\n\nimport { DepositStatusBanner } from \"@stridge/kit/deposit/widgets\";\n\n/**\n * Settlement banner — mounted alongside every deposit screen. The widget itself gates\n * visibility (only mounted when there's a fresh settlement to surface that hasn't been acked\n * and the active step doesn't already paint it full size); inside that gate, the composition\n * below renders.\n */\nexport function StridgeDepositStatusBanner() {\n    return (\n        <DepositStatusBanner>\n            <DepositStatusBanner.Body>\n                <DepositStatusBanner.Hero />\n                <DepositStatusBanner.Close />\n            </DepositStatusBanner.Body>\n            <DepositStatusBanner.Details>\n                <DepositStatusBanner.DepositTxRow />\n                <DepositStatusBanner.CompletionTxRow />\n                <DepositStatusBanner.SubmittedAtRow />\n                <DepositStatusBanner.FilledAtRow />\n            </DepositStatusBanner.Details>\n            <DepositStatusBanner.Footer>\n                <DepositStatusBanner.Toggle />\n                <DepositStatusBanner.PrimaryAction />\n            </DepositStatusBanner.Footer>\n        </DepositStatusBanner>\n    );\n}\n",
      "type": "registry:component",
      "target": "components/stridge/deposit/status-banner.tsx"
    }
  ]
}