@rainlanguage/ui-components 0.0.1-alpha.10

package/dist/components/deployment/FieldDefinitionsSection.svelte

@@ -0,0 +1,9 @@
+<script>import FieldDefinitionInput from "./FieldDefinitionInput.svelte";
+import {} from "@rainlanguage/orderbook/js_api";
+export let allFieldDefinitions;
+export let gui;
+</script>
+
+{#each allFieldDefinitions as fieldDefinition}
+	<FieldDefinitionInput {fieldDefinition} {gui} />
+{/each}

package/dist/components/deployment/FieldDefinitionsSection.svelte.d.ts

@@ -0,0 +1,20 @@
+import { SvelteComponent } from "svelte";
+import { type DotrainOrderGui, type GuiFieldDefinitionCfg } from '@rainlanguage/orderbook/js_api';
+declare const __propDef: {
+    props: {
+        allFieldDefinitions: GuiFieldDefinitionCfg[];
+        gui: DotrainOrderGui;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type FieldDefinitionsSectionProps = typeof __propDef.props;
+export type FieldDefinitionsSectionEvents = typeof __propDef.events;
+export type FieldDefinitionsSectionSlots = typeof __propDef.slots;
+export default class FieldDefinitionsSection extends SvelteComponent<FieldDefinitionsSectionProps, FieldDefinitionsSectionEvents, FieldDefinitionsSectionSlots> {
+}
+export {};

package/dist/components/deployment/InvalidStrategiesSection.svelte

@@ -0,0 +1,19 @@
+<script>export let strategiesWithErrors;
+</script>
+
+<div
+	class="flex flex-col gap-4 rounded-xl bg-red-100 p-6 dark:bg-red-900"
+	data-testid="invalid-strategies"
+>
+	<h2 class="text-xl font-semibold text-gray-900 dark:text-white">
+		Invalid Strategies in registry
+	</h2>
+	<div class="flex flex-col gap-2">
+		{#each strategiesWithErrors as strategy}
+			<div class="flex flex-col gap-1">
+				<span class="font-medium">{strategy.name}</span>
+				<span class="text-red-600 dark:text-red-400">{strategy.error}</span>
+			</div>
+		{/each}
+	</div>
+</div>

package/dist/components/deployment/InvalidStrategiesSection.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+import type { InvalidStrategyDetail } from '../../types/strategy';
+declare const __propDef: {
+    props: {
+        strategiesWithErrors: InvalidStrategyDetail[];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type InvalidStrategiesSectionProps = typeof __propDef.props;
+export type InvalidStrategiesSectionEvents = typeof __propDef.events;
+export type InvalidStrategiesSectionSlots = typeof __propDef.slots;
+export default class InvalidStrategiesSection extends SvelteComponent<InvalidStrategiesSectionProps, InvalidStrategiesSectionEvents, InvalidStrategiesSectionSlots> {
+}
+export {};

package/dist/components/deployment/SelectToken.svelte

@@ -0,0 +1,88 @@
+<script>import { Input } from "flowbite-svelte";
+import { CheckCircleSolid, CloseCircleSolid } from "flowbite-svelte-icons";
+import { Spinner } from "flowbite-svelte";
+import { onMount } from "svelte";
+export let token;
+export let gui;
+export let onSelectTokenSelect;
+let inputValue = null;
+let tokenInfo = null;
+let error = "";
+let checking = false;
+onMount(async () => {
+  try {
+    tokenInfo = await gui?.getTokenInfo(token.key);
+    if (tokenInfo?.address) {
+      inputValue = tokenInfo.address;
+    }
+  } catch {
+  }
+});
+async function getInfoForSelectedToken() {
+  error = "";
+  try {
+    tokenInfo = await gui.getTokenInfo(token.key);
+    error = "";
+  } catch {
+    return error = "No token exists at this address.";
+  }
+}
+async function handleInput(event) {
+  tokenInfo = null;
+  const currentTarget = event.currentTarget;
+  if (currentTarget instanceof HTMLInputElement) {
+    inputValue = currentTarget.value;
+    if (!inputValue) {
+      error = "";
+    }
+    checking = true;
+    try {
+      await gui.saveSelectToken(token.key, currentTarget.value);
+      await getInfoForSelectedToken();
+    } catch (e) {
+      const errorMessage = e.message ? e.message : "Invalid token address.";
+      error = errorMessage;
+    }
+  }
+  checking = false;
+  onSelectTokenSelect();
+}
+</script>
+
+<div class="flex w-full flex-col">
+	<div class="flex flex-col gap-2">
+		<div class="flex flex-col justify-start gap-4 lg:flex-row lg:items-center lg:justify-between">
+			{#if token.name || token.description}
+				<div class="flex flex-col">
+					{#if token.name}
+						<h1 class="break-words text-xl font-semibold text-gray-900 lg:text-xl dark:text-white">
+							{token.name}
+						</h1>
+					{/if}
+					{#if token.description}
+						<p class="text-sm font-light text-gray-600 lg:text-base dark:text-gray-400">
+							{token.description}
+						</p>
+					{/if}
+				</div>
+			{/if}
+			{#if checking}
+				<div class="flex h-5 flex-row items-center gap-2">
+					<Spinner class="h-5 w-5" />
+					<span>Checking...</span>
+				</div>
+			{:else if tokenInfo}
+				<div class="flex h-5 flex-row items-center gap-2">
+					<CheckCircleSolid class="h-5 w-5" color="green" />
+					<span>{tokenInfo.name}</span>
+				</div>
+			{:else if error}
+				<div class="flex h-5 flex-row items-center gap-2" data-testid="error">
+					<CloseCircleSolid class="h-5 w-5" color="red" />
+					<span>{error}</span>
+				</div>
+			{/if}
+		</div>
+		<Input type="text" size="lg" on:input={handleInput} bind:value={inputValue} />
+	</div>
+</div>

package/dist/components/deployment/SelectToken.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+import type { DotrainOrderGui, GuiSelectTokensCfg } from '@rainlanguage/orderbook/js_api';
+declare const __propDef: {
+    props: {
+        token: GuiSelectTokensCfg;
+        gui: DotrainOrderGui;
+        onSelectTokenSelect: () => void;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type SelectTokenProps = typeof __propDef.props;
+export type SelectTokenEvents = typeof __propDef.events;
+export type SelectTokenSlots = typeof __propDef.slots;
+export default class SelectToken extends SvelteComponent<SelectTokenProps, SelectTokenEvents, SelectTokenSlots> {
+}
+export {};

package/dist/components/deployment/SelectTokensSection.svelte

@@ -0,0 +1,17 @@
+<script>import DeploymentSectionHeader from "./DeploymentSectionHeader.svelte";
+import SelectToken from "./SelectToken.svelte";
+import { DotrainOrderGui } from "@rainlanguage/orderbook/js_api";
+export let gui;
+export let selectTokens;
+export let onSelectTokenSelect;
+</script>
+
+<div class="flex w-full flex-col gap-4">
+	<DeploymentSectionHeader
+		title="Select Tokens"
+		description="Select the tokens that you want to use in your order."
+	/>
+	{#each selectTokens as token}
+		<SelectToken {token} bind:gui {onSelectTokenSelect} />
+	{/each}
+</div>

package/dist/components/deployment/SelectTokensSection.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+import { DotrainOrderGui, type SelectTokens } from '@rainlanguage/orderbook/js_api';
+declare const __propDef: {
+    props: {
+        gui: DotrainOrderGui;
+        selectTokens: SelectTokens;
+        onSelectTokenSelect: () => void;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type SelectTokensSectionProps = typeof __propDef.props;
+export type SelectTokensSectionEvents = typeof __propDef.events;
+export type SelectTokensSectionSlots = typeof __propDef.slots;
+export default class SelectTokensSection extends SvelteComponent<SelectTokensSectionProps, SelectTokensSectionEvents, SelectTokensSectionSlots> {
+}
+export {};

package/dist/components/deployment/ShareChoicesButton.svelte

@@ -0,0 +1,26 @@
+<script>import { Button } from "flowbite-svelte";
+import { fade } from "svelte/transition";
+export let handleShareChoices;
+let showCopiedMessage = false;
+const handleClick = () => {
+  handleShareChoices();
+  showCopiedMessage = true;
+  setTimeout(() => {
+    showCopiedMessage = false;
+  }, 2e3);
+};
+</script>
+
+<div class="relative">
+	{#if showCopiedMessage}
+		<div
+			transition:fade
+			class="absolute -top-16 left-1/2 z-[200] -translate-x-1/2 whitespace-nowrap rounded-full border border-gray-200 bg-white px-8 py-4 text-sm dark:border-gray-600 dark:bg-gray-800 dark:text-white"
+		>
+			Shareable URL copied to clipboard
+		</div>
+	{/if}
+	<Button color="light" size="lg" data-testid="review-choices-button" on:click={handleClick}
+		>Share these choices</Button
+	>
+</div>

package/dist/components/deployment/ShareChoicesButton.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        handleShareChoices: () => void;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type ShareChoicesButtonProps = typeof __propDef.props;
+export type ShareChoicesButtonEvents = typeof __propDef.events;
+export type ShareChoicesButtonSlots = typeof __propDef.slots;
+export default class ShareChoicesButton extends SvelteComponent<ShareChoicesButtonProps, ShareChoicesButtonEvents, ShareChoicesButtonSlots> {
+}
+export {};

package/dist/components/deployment/StrategyPage.svelte

@@ -0,0 +1,70 @@
+<script>import { fade } from "svelte/transition";
+import { DotrainOrderGui } from "@rainlanguage/orderbook/js_api";
+import DeploymentsSection from "./DeploymentsSection.svelte";
+import SvelteMarkdown from "svelte-markdown";
+export let strategyName = "";
+export let dotrain = "";
+let markdownContent = "";
+let error;
+const isMarkdownUrl = (url) => {
+  return url.trim().toLowerCase().endsWith(".md");
+};
+const fetchMarkdownContent = async (url) => {
+  try {
+    const response = await fetch(url);
+    if (response.ok) {
+      markdownContent = await response.text();
+    }
+  } catch {
+    error = `Failed to fetch markdown`;
+  }
+};
+const getStrategyWithMarkdown = async () => {
+  try {
+    const strategyDetails = await DotrainOrderGui.getStrategyDetails(dotrain);
+    if (strategyDetails.description && isMarkdownUrl(strategyDetails.description)) {
+      await fetchMarkdownContent(strategyDetails.description);
+    }
+    return strategyDetails;
+  } catch {
+    throw new Error("Failed to get strategy details");
+  }
+};
+</script>
+
+{#await getStrategyWithMarkdown() then strategyDetails}
+	<div>
+		<div in:fade class="flex flex-col gap-8">
+			<div class="flex max-w-2xl flex-col gap-3 text-start lg:gap-6">
+				<h1 class="text-4xl font-semibold text-gray-900 lg:text-6xl dark:text-white">
+					{strategyDetails.name}
+				</h1>
+				{#if markdownContent}
+					<div data-testid="markdown-content" class="prose dark:prose-invert">
+						<SvelteMarkdown source={markdownContent} />
+					</div>
+				{:else}
+					<div class="flex flex-col gap-2">
+						{#if error}
+							<p data-testid="markdown-error" class="text-red-500">{error}</p>
+						{/if}
+						<p
+							data-testid="plain-description"
+							class="text-base text-gray-600 lg:text-lg dark:text-gray-400"
+						>
+							{strategyDetails.description}
+						</p>
+					</div>
+				{/if}
+			</div>
+			<div class="u flex flex-col gap-4">
+				<h2 class="text-3xl font-semibold text-gray-900 dark:text-white">Deployments</h2>
+				<DeploymentsSection {dotrain} {strategyName} />
+			</div>
+		</div>
+	</div>
+{:catch error}
+	<div>
+		<p class="text-red-500">{error}</p>
+	</div>
+{/await}

package/dist/components/deployment/StrategyPage.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        strategyName?: string;
+        dotrain?: string;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type StrategyPageProps = typeof __propDef.props;
+export type StrategyPageEvents = typeof __propDef.events;
+export type StrategyPageSlots = typeof __propDef.slots;
+export default class StrategyPage extends SvelteComponent<StrategyPageProps, StrategyPageEvents, StrategyPageSlots> {
+}
+export {};

package/dist/components/deployment/TokenIOInput.svelte

@@ -0,0 +1,62 @@
+<script>import { Input } from "flowbite-svelte";
+import {
+} from "@rainlanguage/orderbook/js_api";
+import DeploymentSectionHeader from "./DeploymentSectionHeader.svelte";
+import { onMount } from "svelte";
+export let i;
+export let label;
+export let vault;
+export let gui;
+let tokenInfo = null;
+let inputValue = "";
+let error = "";
+onMount(() => {
+  const vaultIds = gui.getVaultIds();
+  if (label === "Input") {
+    inputValue = vaultIds.get("input")?.[i];
+  } else if (label === "Output") {
+    inputValue = vaultIds.get("output")?.[i];
+  }
+});
+const handleGetTokenInfo = async () => {
+  if (!vault.token?.key) return;
+  try {
+    tokenInfo = await gui?.getTokenInfo(vault.token?.key);
+  } catch (e) {
+    const errorMessage = e.message ? e.message : "Error getting token info.";
+    error = errorMessage;
+  }
+};
+const handleInput = async () => {
+  const isInput = label === "Input";
+  error = "";
+  try {
+    gui?.setVaultId(isInput, i, inputValue);
+  } catch (e) {
+    const errorMessage = e.message ? e.message : "Error setting vault ID.";
+    error = errorMessage;
+  }
+};
+$: if (vault.token?.key) {
+  handleGetTokenInfo();
+}
+</script>
+
+<div class="flex w-full flex-col gap-6">
+	<DeploymentSectionHeader
+		title={`${label} ${i + 1} ${tokenInfo?.symbol ? `(${tokenInfo.symbol})` : ''}`}
+		description={`${tokenInfo?.symbol} vault ID`}
+	/>
+	<div class="flex flex-col gap-2">
+		<Input
+			size="lg"
+			type="text"
+			placeholder="Enter vault ID"
+			bind:value={inputValue}
+			on:input={handleInput}
+		/>
+		{#if error}
+			<p class="text-red-500">{error}</p>
+		{/if}
+	</div>
+</div>

package/dist/components/deployment/TokenIOInput.svelte.d.ts

@@ -0,0 +1,22 @@
+import { SvelteComponent } from "svelte";
+import { type OrderIOCfg, type DotrainOrderGui } from '@rainlanguage/orderbook/js_api';
+declare const __propDef: {
+    props: {
+        i: number;
+        label: "Input" | "Output";
+        vault: OrderIOCfg;
+        gui: DotrainOrderGui;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type TokenIoInputProps = typeof __propDef.props;
+export type TokenIoInputEvents = typeof __propDef.events;
+export type TokenIoInputSlots = typeof __propDef.slots;
+export default class TokenIoInput extends SvelteComponent<TokenIoInputProps, TokenIoInputEvents, TokenIoInputSlots> {
+}
+export {};

package/dist/components/deployment/TokenIOSection.svelte

@@ -0,0 +1,17 @@
+<script>import TokenIOInput from "./TokenIOInput.svelte";
+export let allTokenInputs = [];
+export let allTokenOutputs = [];
+export let gui;
+</script>
+
+{#if allTokenInputs.length > 0}
+	{#each allTokenInputs as input, i}
+		<TokenIOInput {i} label="Input" vault={input} {gui} />
+	{/each}
+{/if}
+
+{#if allTokenOutputs.length > 0}
+	{#each allTokenOutputs as output, i}
+		<TokenIOInput {i} label="Output" vault={output} {gui} />
+	{/each}
+{/if}

package/dist/components/deployment/TokenIOSection.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+import type { DotrainOrderGui, OrderIOCfg } from '@rainlanguage/orderbook/js_api';
+declare const __propDef: {
+    props: {
+        allTokenInputs?: OrderIOCfg[];
+        allTokenOutputs?: OrderIOCfg[];
+        gui: DotrainOrderGui;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type TokenIoSectionProps = typeof __propDef.props;
+export type TokenIoSectionEvents = typeof __propDef.events;
+export type TokenIoSectionSlots = typeof __propDef.slots;
+export default class TokenIoSection extends SvelteComponent<TokenIoSectionProps, TokenIoSectionEvents, TokenIoSectionSlots> {
+}
+export {};

package/dist/components/deployment/ValidStrategiesSection.svelte

@@ -0,0 +1,25 @@
+<script>import { onMount } from "svelte";
+import { page } from "$app/stores";
+export let strategies;
+let customRegistryParam = "";
+onMount(async () => {
+  customRegistryParam = $page.url.searchParams.get("registry") ? `?registry=${$page.url.searchParams.get("registry")}` : "";
+});
+</script>
+
+<div class="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3" data-testid="valid-strategies">
+	{#each strategies as strategy}
+		<a
+			href={`/deploy/${strategy.name}${customRegistryParam}`}
+			data-testid="strategy-short-tile"
+			class="flex flex-col gap-y-2 rounded-xl border border-gray-200 p-4 hover:bg-gray-50 dark:border-gray-800 dark:hover:bg-gray-900"
+		>
+			<h3 class="text-2xl font-semibold text-gray-900 dark:text-white">
+				{strategy.details.name}
+			</h3>
+			<p class="text-lg text-gray-600 dark:text-gray-400">
+				{strategy.details.short_description}
+			</p>
+		</a>
+	{/each}
+</div>

package/dist/components/deployment/ValidStrategiesSection.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+import type { ValidStrategyDetail } from '../../types/strategy';
+declare const __propDef: {
+    props: {
+        strategies: ValidStrategyDetail[];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type ValidStrategiesSectionProps = typeof __propDef.props;
+export type ValidStrategiesSectionEvents = typeof __propDef.events;
+export type ValidStrategiesSectionSlots = typeof __propDef.slots;
+export default class ValidStrategiesSection extends SvelteComponent<ValidStrategiesSectionProps, ValidStrategiesSectionEvents, ValidStrategiesSectionSlots> {
+}
+export {};

package/dist/components/deployment/getDeploymentTransactionArgs.d.ts

@@ -0,0 +1,17 @@
+import type { Config } from '@wagmi/core';
+import type { DepositAndAddOrderCalldataResult, DotrainOrderGui } from '@rainlanguage/orderbook/js_api';
+import type { Hex } from 'viem';
+import type { ExtendedApprovalCalldata } from '../../stores/transactionStore';
+export declare enum AddOrderErrors {
+    ADD_ORDER_FAILED = "Failed to add order",
+    MISSING_GUI = "Order GUI is required",
+    MISSING_CONFIG = "Wagmi config is required",
+    NO_WALLET = "No wallet address found"
+}
+export interface HandleAddOrderResult {
+    approvals: ExtendedApprovalCalldata[];
+    deploymentCalldata: DepositAndAddOrderCalldataResult;
+    orderbookAddress: Hex;
+    chainId: number;
+}
+export declare function getDeploymentTransactionArgs(gui: DotrainOrderGui, wagmiConfig: Config | undefined): Promise<HandleAddOrderResult>;

package/dist/components/deployment/getDeploymentTransactionArgs.js

@@ -0,0 +1,24 @@
+import { getAccount } from '@wagmi/core';
+export var AddOrderErrors;
+(function (AddOrderErrors) {
+    AddOrderErrors["ADD_ORDER_FAILED"] = "Failed to add order";
+    AddOrderErrors["MISSING_GUI"] = "Order GUI is required";
+    AddOrderErrors["MISSING_CONFIG"] = "Wagmi config is required";
+    AddOrderErrors["NO_WALLET"] = "No wallet address found";
+})(AddOrderErrors || (AddOrderErrors = {}));
+export async function getDeploymentTransactionArgs(gui, wagmiConfig) {
+    if (!wagmiConfig) {
+        throw new Error(AddOrderErrors.MISSING_CONFIG);
+    }
+    const { address } = getAccount(wagmiConfig);
+    if (!address) {
+        throw new Error(AddOrderErrors.NO_WALLET);
+    }
+    const { approvals, deploymentCalldata, orderbookAddress, chainId } = await gui.getDeploymentTransactionArgs(address);
+    return {
+        approvals,
+        deploymentCalldata,
+        orderbookAddress: orderbookAddress,
+        chainId
+    };
+}

package/dist/components/detail/DepositOrWithdrawButtons.svelte

@@ -0,0 +1,44 @@
+<script>import { Button } from "flowbite-svelte";
+import { ArrowDownOutline, ArrowUpOutline } from "flowbite-svelte-icons";
+export let handleDepositOrWithdrawModal;
+export let vault;
+export let chainId;
+export let rpcUrl;
+export let query;
+export let subgraphUrl;
+</script>
+
+<Button
+	data-testid="depositOrWithdrawButton"
+	color="light"
+	size="xs"
+	on:click={() =>
+		handleDepositOrWithdrawModal({
+			open: true,
+			args: {
+				vault,
+				onDepositOrWithdraw: $query.refetch,
+				action: 'deposit',
+				chainId,
+				rpcUrl,
+				subgraphUrl
+			}
+		})}><ArrowUpOutline size="xs" /></Button
+>
+<Button
+	data-testid="depositOrWithdrawButton"
+	color="light"
+	size="xs"
+	on:click={() =>
+		handleDepositOrWithdrawModal({
+			open: true,
+			args: {
+				vault,
+				onDepositOrWithdraw: $query.refetch,
+				action: 'withdraw',
+				chainId,
+				rpcUrl,
+				subgraphUrl
+			}
+		})}><ArrowDownOutline size="xs" /></Button
+>

package/dist/components/detail/DepositOrWithdrawButtons.svelte.d.ts

@@ -0,0 +1,26 @@
+import { SvelteComponent } from "svelte";
+import type { SgVault } from '@rainlanguage/orderbook/js_api';
+import type { CreateQueryResult } from '@tanstack/svelte-query';
+import type { DepositOrWithdrawModalProps } from '../../types/modal';
+declare const __propDef: {
+    props: {
+        handleDepositOrWithdrawModal: (props: DepositOrWithdrawModalProps) => void;
+        vault: SgVault;
+        chainId: number;
+        rpcUrl: string;
+        query: CreateQueryResult;
+        subgraphUrl: string;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type DepositOrWithdrawButtonsProps = typeof __propDef.props;
+export type DepositOrWithdrawButtonsEvents = typeof __propDef.events;
+export type DepositOrWithdrawButtonsSlots = typeof __propDef.slots;
+export default class DepositOrWithdrawButtons extends SvelteComponent<DepositOrWithdrawButtonsProps, DepositOrWithdrawButtonsEvents, DepositOrWithdrawButtonsSlots> {
+}
+export {};