@agg-build/ui 2.4.9 → 2.5.2

package/dist/chunk-AHQA3B7D.mjs

@@ -0,0 +1,947 @@
+"use client";
+import {
+  AGG_TERMS_OF_SERVICE_URL,
+  BestPricesIcon,
+  Button,
+  CheckCircleIcon,
+  ChevronRightIcon,
+  CreateAccountIcon,
+  Icon,
+  LinkAccountsIcon,
+  Modal,
+  ProfileIcon,
+  RemoteImage,
+  StayInControlIcon,
+  VenueLogo,
+  WarningIcon,
+  __async,
+  __spreadProps,
+  __spreadValues,
+  cn
+} from "./chunk-FMYYPNZZ.mjs";
+
+// src/geo-block-banner/index.tsx
+import { useLabels } from "@agg-build/hooks";
+import { jsx, jsxs } from "react/jsx-runtime";
+var GeoBlockBanner = ({
+  venue,
+  termsUrl = AGG_TERMS_OF_SERVICE_URL,
+  className
+}) => {
+  const labels = useLabels();
+  const message = venue ? labels.trading.geoBlockVenueMessage(venue) : labels.trading.geoBlockGenericMessage;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex items-center gap-5 rounded-agg-lg bg-agg-secondary-hover p-3", className),
+      role: "status",
+      children: [
+        /* @__PURE__ */ jsxs("p", { className: "min-w-0 flex-1 text-agg-xs leading-agg-4 text-agg-foreground", children: [
+          message,
+          /* @__PURE__ */ jsx("a", { href: termsUrl, className: "underline", target: "_blank", rel: "noreferrer noopener", children: labels.trading.geoBlockTermsLink }),
+          labels.trading.geoBlockMessageSuffix
+        ] }),
+        /* @__PURE__ */ jsx(Icon, { name: "internet-security", className: "h-6 w-6 shrink-0 text-agg-muted-foreground" })
+      ]
+    }
+  );
+};
+GeoBlockBanner.displayName = "GeoBlockBanner";
+
+// src/onboarding/steps/how-it-works.tsx
+import { useCallback, useRef, useState } from "react";
+import { useLabels as useLabels2 } from "@agg-build/hooks";
+
+// src/onboarding/onboarding-modal.constants.ts
+import { isVenueActive, Venue } from "@agg-build/sdk";
+var HOW_IT_WORKS_FEATURE_KEYS = [
+  "createAccount",
+  "linkAccounts",
+  "bestPrices",
+  "stayInControl"
+];
+var ONBOARDING_STEPS = {
+  HOW_IT_WORKS: 0,
+  PROFILE_SETUP: 1,
+  CONNECT_ACCOUNTS: 2
+};
+var ONCHAIN_VENUES = [
+  Venue.polymarket,
+  Venue.opinion,
+  Venue.predict
+].filter(isVenueActive);
+
+// src/onboarding/steps/how-it-works.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var defaultIcons = {
+  createAccount: /* @__PURE__ */ jsx2(CreateAccountIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
+  linkAccounts: /* @__PURE__ */ jsx2(LinkAccountsIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
+  bestPrices: /* @__PURE__ */ jsx2(BestPricesIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
+  stayInControl: /* @__PURE__ */ jsx2(StayInControlIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" })
+};
+var HowItWorksStep = ({ onContinue, icons }) => {
+  const labels = useLabels2();
+  const scrollRef = useRef(null);
+  const [showTopGradient, setShowTopGradient] = useState(false);
+  const [showBottomGradient, setShowBottomGradient] = useState(true);
+  const handleScroll = useCallback(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    setShowTopGradient(el.scrollTop > 0);
+    setShowBottomGradient(el.scrollTop + el.clientHeight < el.scrollHeight - 1);
+  }, []);
+  return /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-6 h-[600px] sm:h-auto", children: [
+    /* @__PURE__ */ jsx2("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.howItWorks.title }),
+    /* @__PURE__ */ jsxs2("div", { className: "relative flex-1 min-h-0 sm:flex-initial", children: [
+      /* @__PURE__ */ jsx2(
+        "div",
+        {
+          ref: scrollRef,
+          onScroll: handleScroll,
+          className: "flex flex-col gap-4 overflow-y-auto sm:overflow-visible h-full",
+          children: HOW_IT_WORKS_FEATURE_KEYS.map((featureKey) => {
+            var _a;
+            const icon = (_a = icons == null ? void 0 : icons[featureKey]) != null ? _a : defaultIcons[featureKey];
+            const feature = labels.onboarding.howItWorks.features[featureKey];
+            return /* @__PURE__ */ jsxs2(
+              "div",
+              {
+                className: cn(
+                  "flex items-center gap-4 py-4 px-5 sm:px-4",
+                  "rounded-agg-md",
+                  "bg-agg-secondary-hover"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxs2("div", { className: "flex flex-col flex-1 min-w-0 gap-[6px]", children: [
+                    /* @__PURE__ */ jsx2("p", { className: "text-agg-base font-agg-bold leading-agg-6 text-agg-foreground", children: feature.title }),
+                    /* @__PURE__ */ jsx2("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: feature.description })
+                  ] }),
+                  icon ? /* @__PURE__ */ jsx2("div", { className: "hidden shrink-0 items-center justify-center text-agg-muted-foreground sm:flex", children: icon }) : null
+                ]
+              },
+              featureKey
+            );
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        "div",
+        {
+          className: cn(
+            "pointer-events-none absolute inset-x-0 top-0 h-20",
+            "bg-gradient-to-b from-agg-secondary to-transparent",
+            "sm:hidden transition-opacity",
+            showTopGradient ? "opacity-100" : "opacity-0"
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        "div",
+        {
+          className: cn(
+            "pointer-events-none absolute inset-x-0 bottom-0 h-20",
+            "bg-gradient-to-t from-agg-secondary to-transparent",
+            "sm:hidden transition-opacity",
+            showBottomGradient ? "opacity-100" : "opacity-0"
+          )
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2(Button, { variant: "primary", size: "large", className: "w-full", onClick: onContinue, children: labels.onboarding.howItWorks.continue })
+  ] });
+};
+HowItWorksStep.displayName = "HowItWorksStep";
+
+// src/onboarding/steps/profile-setup.tsx
+import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
+import { useLabels as useLabels3 } from "@agg-build/hooks";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var ProfileSetupStep = ({ onContinue }) => {
+  const labels = useLabels3();
+  const [username, setUsername] = useState2("");
+  const [avatarFile, setAvatarFile] = useState2();
+  const [avatarPreview, setAvatarPreview] = useState2();
+  const fileInputRef = useRef2(null);
+  const handleAvatarClick = useCallback2(() => {
+    var _a;
+    (_a = fileInputRef.current) == null ? void 0 : _a.click();
+  }, []);
+  const handleFileChange = useCallback2((e) => {
+    var _a;
+    const file = (_a = e.target.files) == null ? void 0 : _a[0];
+    if (!file) return;
+    setAvatarFile(file);
+    const reader = new FileReader();
+    reader.onload = (event) => {
+      var _a2;
+      setAvatarPreview((_a2 = event.target) == null ? void 0 : _a2.result);
+    };
+    reader.readAsDataURL(file);
+  }, []);
+  const handleContinue = useCallback2(() => {
+    onContinue({
+      username,
+      avatarFile,
+      avatarPreview
+    });
+  }, [username, avatarFile, avatarPreview, onContinue]);
+  return /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-7", children: [
+    /* @__PURE__ */ jsx3("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.profileSetup.title }),
+    /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-5 items-center w-full", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "flex justify-center", children: [
+        /* @__PURE__ */ jsxs3(
+          "button",
+          {
+            type: "button",
+            onClick: handleAvatarClick,
+            className: cn(
+              "group relative flex items-center justify-center",
+              "h-[80px] w-[80px]",
+              "rounded-agg-full",
+              "bg-agg-secondary-hover",
+              !avatarPreview && "hover:bg-agg-tertiary",
+              "transition-colors cursor-pointer",
+              "overflow-hidden"
+            ),
+            "aria-label": labels.onboarding.profileSetup.uploadProfilePictureAria,
+            children: [
+              !avatarPreview ? /* @__PURE__ */ jsx3(
+                "svg",
+                {
+                  "aria-hidden": true,
+                  viewBox: "0 0 80 80",
+                  className: "pointer-events-none absolute inset-0 h-full w-full text-agg-separator group-hover:text-agg-muted-foreground",
+                  children: /* @__PURE__ */ jsx3(
+                    "circle",
+                    {
+                      cx: "40",
+                      cy: "40",
+                      r: "39.5",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "1",
+                      strokeDasharray: "8 8"
+                    }
+                  )
+                }
+              ) : null,
+              avatarPreview ? /* @__PURE__ */ jsx3(
+                RemoteImage,
+                {
+                  src: avatarPreview,
+                  alt: labels.onboarding.profileSetup.profilePreviewAlt,
+                  className: "h-full w-full object-cover"
+                }
+              ) : /* @__PURE__ */ jsx3(ProfileIcon, { className: "h-7 w-7 text-agg-muted-foreground" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            accept: "image/*",
+            onChange: handleFileChange,
+            className: "hidden",
+            "aria-hidden": "true"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-2 w-full", children: [
+        /* @__PURE__ */ jsx3(
+          "label",
+          {
+            htmlFor: "onboarding-username",
+            className: "text-agg-sm font-agg-bold text-agg-foreground",
+            children: labels.onboarding.profileSetup.usernameLabel
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          "input",
+          {
+            id: "onboarding-username",
+            type: "text",
+            value: username,
+            onChange: (e) => setUsername(e.target.value),
+            placeholder: labels.onboarding.profileSetup.usernamePlaceholder,
+            className: cn(
+              "w-full px-3 py-2.5",
+              "rounded-[4px]",
+              "border border-agg-separator",
+              "bg-agg-secondary text-agg-foreground",
+              "placeholder:text-agg-muted-foreground",
+              "outline-none",
+              "hover:bg-agg-secondary-hover",
+              "focus:border-agg-primary focus:ring-1 focus:ring-agg-primary",
+              "transition-colors",
+              "text-agg-sm sm:text-agg-base"
+            )
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx3(Button, { variant: "primary", size: "large", className: "w-full", onClick: handleContinue, children: labels.onboarding.profileSetup.continue })
+  ] });
+};
+ProfileSetupStep.displayName = "ProfileSetupStep";
+
+// src/onboarding/steps/connect-accounts.tsx
+import { useLabels as useLabels4 } from "@agg-build/hooks";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var OnchainVenueLogos = () => {
+  return /* @__PURE__ */ jsx4("div", { className: "flex gap-1 sm:gap-0 sm:-space-x-5", children: ONCHAIN_VENUES.map((venue, index) => /* @__PURE__ */ jsx4("div", { style: { zIndex: ONCHAIN_VENUES.length - index }, children: /* @__PURE__ */ jsx4(VenueLogo, { venue, variant: "logo", size: "medium", className: "sm:h-8 sm:w-8" }) }, venue)) });
+};
+var VenueCard = ({
+  logos,
+  title,
+  mobileTitle,
+  description,
+  mobileDescription,
+  onConnect,
+  connected = false
+}) => {
+  const labels = useLabels4();
+  const action = connected ? /* @__PURE__ */ jsx4(CheckCircleIcon, { className: "h-6 w-6 text-agg-success" }) : /* @__PURE__ */ jsx4(
+    Button,
+    {
+      variant: "tertiary",
+      size: "large",
+      className: "!h-auto !px-0 !py-0 text-agg-primary hover:bg-transparent hover:text-agg-primary-hover",
+      onClick: onConnect,
+      children: labels.onboarding.connectAccounts.connect
+    }
+  );
+  const mobileAction = connected ? /* @__PURE__ */ jsx4(CheckCircleIcon, { className: "h-6 w-6 text-agg-success" }) : /* @__PURE__ */ jsx4(
+    Button,
+    {
+      variant: "tertiary",
+      size: "medium",
+      className: "!h-auto !px-0 !py-0 text-agg-primary hover:bg-transparent hover:text-agg-primary-hover",
+      onClick: onConnect,
+      suffix: /* @__PURE__ */ jsx4(ChevronRightIcon, { className: "h-4 w-4" }),
+      children: labels.onboarding.connectAccounts.connectAccount
+    }
+  );
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: cn(
+        "rounded-agg-md p-5 transition-colors",
+        connected ? "bg-agg-success/5" : "bg-agg-secondary-hover hover:bg-agg-tertiary"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs4("div", { className: "hidden sm:flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-5", children: [
+            /* @__PURE__ */ jsx4("div", { className: "shrink-0", children: logos }),
+            /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-[2px]", children: [
+              /* @__PURE__ */ jsx4("p", { className: "text-agg-base font-agg-bold text-agg-foreground", children: title }),
+              /* @__PURE__ */ jsx4("p", { className: "text-agg-sm text-agg-foreground", children: description })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx4("div", { className: "shrink-0", children: action })
+        ] }),
+        /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3 sm:hidden", children: [
+          /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3", children: [
+            /* @__PURE__ */ jsx4("div", { className: "shrink-0", children: logos }),
+            /* @__PURE__ */ jsx4("p", { className: "text-agg-lg font-agg-bold text-agg-foreground", children: mobileTitle != null ? mobileTitle : title })
+          ] }),
+          /* @__PURE__ */ jsxs4("div", { className: "flex flex-col items-start gap-2", children: [
+            /* @__PURE__ */ jsx4("p", { className: "text-agg-base text-agg-foreground", children: mobileDescription != null ? mobileDescription : description }),
+            mobileAction
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+var ConnectAccountsStep = ({
+  onConnectOnchain,
+  onContinue,
+  connectedOnchain = false
+}) => {
+  const labels = useLabels4();
+  const canContinue = connectedOnchain;
+  return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsx4("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.connectAccounts.title }),
+    /* @__PURE__ */ jsx4("div", { className: "flex flex-col gap-4", children: /* @__PURE__ */ jsx4(
+      VenueCard,
+      {
+        logos: /* @__PURE__ */ jsx4(OnchainVenueLogos, {}),
+        title: labels.onboarding.connectAccounts.onchainTitle,
+        mobileTitle: labels.onboarding.connectAccounts.onchainMobileTitle(
+          ONCHAIN_VENUES.length - 1
+        ),
+        description: labels.onboarding.connectAccounts.onchainDescription,
+        mobileDescription: labels.onboarding.connectAccounts.onchainMobileDescription,
+        onConnect: onConnectOnchain,
+        connected: connectedOnchain
+      }
+    ) }),
+    /* @__PURE__ */ jsx4(
+      Button,
+      {
+        variant: "primary",
+        size: "large",
+        className: "w-full",
+        onClick: onContinue,
+        disabled: !canContinue,
+        children: labels.onboarding.connectAccounts.continue
+      }
+    )
+  ] });
+};
+ConnectAccountsStep.displayName = "ConnectAccountsStep";
+
+// src/onboarding/steps/connect-onchain-modal.tsx
+import { useCallback as useCallback3, useState as useState3 } from "react";
+import { useLabels as useLabels5 } from "@agg-build/hooks";
+import * as Dialog from "@radix-ui/react-dialog";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var ConnectOnchainModal = ({
+  open,
+  onOpenChange,
+  onConnect
+}) => {
+  const labels = useLabels5();
+  const [connecting, setConnecting] = useState3(false);
+  const [error, setError] = useState3();
+  const handleCancel = useCallback3(() => {
+    onOpenChange(false);
+  }, [onOpenChange]);
+  const handleConnect = useCallback3(() => __async(null, null, function* () {
+    if (connecting) return;
+    setConnecting(true);
+    setError(void 0);
+    try {
+      yield onConnect();
+      onOpenChange(false);
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : labels.onboarding.connectOnchainModal.fallbackError
+      );
+    } finally {
+      setConnecting(false);
+    }
+  }), [connecting, labels.onboarding.connectOnchainModal.fallbackError, onConnect, onOpenChange]);
+  const handleOpenChange = useCallback3(
+    (value) => {
+      if (value) {
+        setError(void 0);
+        setConnecting(false);
+      }
+      onOpenChange(value);
+    },
+    [onOpenChange]
+  );
+  return /* @__PURE__ */ jsx5(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs5(
+    Modal.Container,
+    {
+      maxWidth: "600px",
+      "aria-label": labels.onboarding.connectOnchainModal.ariaLabel,
+      classNames: { container: "!rounded-agg-lg" },
+      children: [
+        /* @__PURE__ */ jsx5(Dialog.Title, { className: "sr-only", children: labels.onboarding.connectOnchainModal.title }),
+        /* @__PURE__ */ jsx5(
+          Modal.Header,
+          {
+            hideClose: false,
+            hideBorder: true,
+            classNames: {
+              root: "!min-h-0",
+              container: "!py-[18px] !px-8"
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx5(Modal.Body, { classNames: { root: "!px-5 !pt-0 !pb-[60px] sm:!px-8" }, children: /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-8 items-center", children: [
+          /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-4 items-center text-center", children: [
+            /* @__PURE__ */ jsx5("h2", { className: "text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.connectOnchainModal.title }),
+            /* @__PURE__ */ jsx5("p", { className: "text-agg-base text-center leading-agg-6 text-agg-foreground whitespace-pre-line", children: labels.onboarding.connectOnchainModal.description })
+          ] }),
+          /* @__PURE__ */ jsxs5("div", { className: "flex w-full flex-col items-center gap-4 rounded-agg-xl bg-agg-secondary-hover p-6", children: [
+            /* @__PURE__ */ jsx5("p", { className: "text-agg-sm font-agg-bold uppercase leading-agg-5 text-agg-muted-foreground", children: labels.onboarding.connectOnchainModal.supportedVenuesLabel }),
+            /* @__PURE__ */ jsx5("div", { className: "flex flex-wrap items-center justify-center gap-x-4 gap-y-3", children: ONCHAIN_VENUES.map((venue, index) => /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-[6px]", children: [
+              index > 0 && /* @__PURE__ */ jsx5("span", { className: "mr-2.5 h-3 w-px bg-agg-separator" }),
+              /* @__PURE__ */ jsx5(VenueLogo, { venue, size: "medium" }),
+              /* @__PURE__ */ jsx5("span", { className: "text-agg-base text-agg-foreground", children: labels.venues[venue] })
+            ] }, venue)) })
+          ] }),
+          /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-6 items-center", children: [
+            /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-3 items-center", children: [
+              error ? /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx5(WarningIcon, { className: "h-3.5 w-3.5 shrink-0 text-agg-error" }),
+                /* @__PURE__ */ jsx5("p", { className: "text-agg-sm leading-agg-5 text-agg-error", children: error })
+              ] }) : null,
+              /* @__PURE__ */ jsx5(
+                Button,
+                {
+                  variant: "primary",
+                  size: "large",
+                  onClick: handleConnect,
+                  isLoading: connecting,
+                  children: labels.onboarding.connectOnchainModal.connect
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx5(
+              Button,
+              {
+                variant: "tertiary",
+                size: "medium",
+                className: "!h-auto !px-0 !py-0 text-agg-primary hover:bg-transparent hover:text-agg-primary-hover",
+                onClick: handleCancel,
+                children: labels.onboarding.connectOnchainModal.cancel
+              }
+            )
+          ] })
+        ] }) })
+      ]
+    }
+  ) });
+};
+ConnectOnchainModal.displayName = "ConnectOnchainModal";
+
+// src/onboarding/steps/connect-kalshi-modal.tsx
+import { getVenueAvailabilityState, useAppConfig, useLabels as useLabels6 } from "@agg-build/hooks";
+import { Venue as Venue2 } from "@agg-build/sdk";
+import * as Dialog2 from "@radix-ui/react-dialog";
+import { useCallback as useCallback4, useEffect, useId, useMemo, useRef as useRef3, useState as useState4 } from "react";
+import { z } from "zod";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var kalshiCredentialsSchema = z.object({
+  apiKeyId: z.string().trim().min(1),
+  privateKey: z.string().trim().min(1)
+});
+var getSafeConnectionError = ({
+  apiKeyId,
+  error,
+  fallback,
+  privateKey
+}) => {
+  if (!(error instanceof Error) || !error.message.trim()) return fallback;
+  return [apiKeyId, privateKey].filter(Boolean).reduce(
+    (message, sensitiveValue) => message.split(sensitiveValue).join("[redacted]"),
+    error.message
+  ).trim();
+};
+var ConnectKalshiModal = ({
+  open,
+  onOpenChange,
+  onVerify
+}) => {
+  const labels = useLabels6();
+  const { disabledVenues, isLoading: isAppConfigLoading } = useAppConfig();
+  const apiKeyInputRef = useRef3(null);
+  const errorId = useId();
+  const [apiKeyId, setApiKeyId] = useState4("");
+  const [privateKey, setPrivateKey] = useState4("");
+  const [isVerifying, setIsVerifying] = useState4(false);
+  const [isConnected, setIsConnected] = useState4(false);
+  const [error, setError] = useState4();
+  const availabilityState = getVenueAvailabilityState({
+    venueId: Venue2.kalshi,
+    disabledVenues,
+    isConfigLoading: isAppConfigLoading
+  });
+  const parsedCredentials = useMemo(
+    () => kalshiCredentialsSchema.safeParse({ apiKeyId, privateKey }),
+    [apiKeyId, privateKey]
+  );
+  useEffect(() => {
+    if (!open) return;
+    setApiKeyId("");
+    setPrivateKey("");
+    setError(void 0);
+    setIsVerifying(false);
+    setIsConnected(false);
+    const animationFrame = window.requestAnimationFrame(() => {
+      var _a;
+      return (_a = apiKeyInputRef.current) == null ? void 0 : _a.focus();
+    });
+    return () => window.cancelAnimationFrame(animationFrame);
+  }, [open]);
+  const handleOpenChange = useCallback4(
+    (nextOpen) => {
+      if (isVerifying && !nextOpen) return;
+      onOpenChange(nextOpen);
+    },
+    [isVerifying, onOpenChange]
+  );
+  const handleVerify = useCallback4(() => __async(null, null, function* () {
+    if (!parsedCredentials.success || isVerifying || isConnected) return;
+    const credentials = parsedCredentials.data;
+    setIsVerifying(true);
+    setError(void 0);
+    try {
+      yield onVerify(credentials);
+      setApiKeyId("");
+      setPrivateKey("");
+      setIsConnected(true);
+    } catch (verificationError) {
+      setError(
+        getSafeConnectionError(__spreadProps(__spreadValues({}, credentials), {
+          error: verificationError,
+          fallback: labels.onboarding.connectKalshiModal.fallbackError
+        }))
+      );
+    } finally {
+      setIsVerifying(false);
+    }
+  }), [
+    isConnected,
+    isVerifying,
+    labels.onboarding.connectKalshiModal.fallbackError,
+    onVerify,
+    parsedCredentials
+  ]);
+  const handleSubmit = useCallback4(
+    (event) => {
+      event.preventDefault();
+      void handleVerify();
+    },
+    [handleVerify]
+  );
+  if (availabilityState === "hidden") return null;
+  return /* @__PURE__ */ jsx6(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs6(
+    Modal.Container,
+    {
+      maxWidth: "600px",
+      "aria-label": labels.onboarding.connectKalshiModal.ariaLabel,
+      classNames: { container: "!rounded-agg-2xl" },
+      children: [
+        /* @__PURE__ */ jsx6("div", { className: "flex h-[60px] shrink-0 items-center justify-end px-8", children: /* @__PURE__ */ jsx6(
+          Dialog2.Close,
+          {
+            "aria-label": labels.common.close,
+            className: "flex size-10 cursor-pointer items-center justify-center rounded-agg-full text-agg-secondary transition-colors hover:bg-agg-quaternary hover:text-agg-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-accent disabled:cursor-default disabled:opacity-50",
+            disabled: isVerifying,
+            children: /* @__PURE__ */ jsx6(Icon, { name: "close", size: "medium" })
+          }
+        ) }),
+        /* @__PURE__ */ jsx6(Modal.Body, { classNames: { root: "!px-5 !pb-12 !pt-0 sm:!px-10" }, children: isConnected ? /* @__PURE__ */ jsxs6(
+          "div",
+          {
+            className: "flex flex-col items-center gap-8 pb-3 text-center",
+            role: "status",
+            "aria-live": "polite",
+            children: [
+              /* @__PURE__ */ jsx6("div", { className: "flex size-[60px] items-center justify-center rounded-agg-full bg-agg-success", children: /* @__PURE__ */ jsx6(
+                Icon,
+                {
+                  name: "success-check",
+                  className: "size-7 text-agg-on-primary",
+                  "aria-hidden": "true"
+                }
+              ) }),
+              /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center gap-4", children: [
+                /* @__PURE__ */ jsx6(Dialog2.Title, { className: "text-agg-2xl font-agg-bold leading-agg-8 text-agg-foreground", children: labels.onboarding.connectKalshiModal.success.title }),
+                /* @__PURE__ */ jsx6(Dialog2.Description, { className: "max-w-[480px] text-agg-base leading-agg-6 text-agg-foreground", children: labels.onboarding.connectKalshiModal.success.description })
+              ] }),
+              /* @__PURE__ */ jsx6(
+                Button,
+                {
+                  variant: "primary",
+                  size: "large",
+                  className: "min-w-[120px]",
+                  onClick: () => handleOpenChange(false),
+                  children: labels.onboarding.connectKalshiModal.success.done
+                }
+              )
+            ]
+          }
+        ) : /* @__PURE__ */ jsxs6("form", { className: "flex flex-col items-center gap-8", onSubmit: handleSubmit, children: [
+          /* @__PURE__ */ jsx6(VenueLogo, { venue: Venue2.kalshi, variant: "logo", size: "large", className: "size-[60px]" }),
+          /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center gap-4 text-center", children: [
+            /* @__PURE__ */ jsx6(Dialog2.Title, { className: "text-agg-2xl font-agg-bold leading-agg-8 text-agg-foreground", children: labels.onboarding.connectKalshiModal.title }),
+            /* @__PURE__ */ jsx6(Dialog2.Description, { className: "max-w-[520px] text-agg-base leading-agg-6 text-agg-foreground", children: labels.onboarding.connectKalshiModal.description })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "flex w-full flex-col gap-4", children: [
+            /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-3 rounded-agg-xl bg-agg-secondary-hover p-4", children: [
+              /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-1", children: [
+                /* @__PURE__ */ jsx6("p", { className: "text-agg-xs font-agg-bold uppercase leading-agg-4 text-agg-muted-foreground", children: labels.onboarding.connectKalshiModal.stepOne.label }),
+                /* @__PURE__ */ jsx6("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepOne.title })
+              ] }),
+              /* @__PURE__ */ jsxs6("div", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: [
+                /* @__PURE__ */ jsx6("p", { children: labels.onboarding.connectKalshiModal.stepOne.instructions.signIn }),
+                /* @__PURE__ */ jsxs6("p", { children: [
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.goToProfilePrefix,
+                  " ",
+                  /* @__PURE__ */ jsx6("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.profileText }),
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.goToProfileSeparator,
+                  " ",
+                  /* @__PURE__ */ jsx6(
+                    "a",
+                    {
+                      href: labels.onboarding.connectKalshiModal.stepOne.instructions.profileUrl,
+                      target: "_blank",
+                      rel: "noreferrer",
+                      className: "cursor-pointer underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary",
+                      children: labels.onboarding.connectKalshiModal.stepOne.instructions.profileUrl
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs6("p", { children: [
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.clickCreateKeyPrefix,
+                  " ",
+                  /* @__PURE__ */ jsx6("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.createKeyText }),
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.clickCreateKeySuffix
+                ] }),
+                /* @__PURE__ */ jsxs6("p", { children: [
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.selectPermissionsPrefix,
+                  " ",
+                  /* @__PURE__ */ jsx6("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.readWriteText }),
+                  labels.onboarding.connectKalshiModal.stepOne.instructions.selectPermissionsSuffix
+                ] }),
+                /* @__PURE__ */ jsx6("p", { children: labels.onboarding.connectKalshiModal.stepOne.instructions.createKey })
+              ] }),
+              /* @__PURE__ */ jsxs6("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: [
+                labels.onboarding.connectKalshiModal.stepOne.footerLineOne,
+                /* @__PURE__ */ jsx6("br", {}),
+                labels.onboarding.connectKalshiModal.stepOne.footerLineTwo
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-3 rounded-agg-xl bg-agg-secondary-hover p-4", children: [
+              /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-1", children: [
+                /* @__PURE__ */ jsx6("p", { className: "text-agg-xs font-agg-bold uppercase leading-agg-4 text-agg-muted-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.label }),
+                /* @__PURE__ */ jsx6("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.title })
+              ] }),
+              /* @__PURE__ */ jsx6("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.description }),
+              /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
+                /* @__PURE__ */ jsx6(
+                  "label",
+                  {
+                    htmlFor: "kalshi-api-key-id",
+                    className: "text-agg-sm font-agg-bold text-agg-foreground",
+                    children: labels.onboarding.connectKalshiModal.stepTwo.apiKeyIdLabel
+                  }
+                ),
+                /* @__PURE__ */ jsx6(
+                  "input",
+                  {
+                    ref: apiKeyInputRef,
+                    id: "kalshi-api-key-id",
+                    type: "text",
+                    autoComplete: "off",
+                    value: apiKeyId,
+                    onChange: (event) => setApiKeyId(event.target.value),
+                    placeholder: labels.onboarding.connectKalshiModal.stepTwo.apiKeyIdPlaceholder,
+                    disabled: isVerifying,
+                    "aria-invalid": !!error,
+                    "aria-describedby": error ? errorId : void 0,
+                    className: cn(
+                      "h-10 w-full rounded-agg-md border border-agg-separator bg-agg-secondary px-3 py-2.5",
+                      "text-agg-base text-agg-foreground placeholder:text-agg-muted-foreground",
+                      "outline-none transition-colors focus:border-agg-primary focus:ring-1 focus:ring-agg-primary",
+                      "disabled:cursor-not-allowed disabled:opacity-60"
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
+                /* @__PURE__ */ jsx6(
+                  "label",
+                  {
+                    htmlFor: "kalshi-private-key",
+                    className: "text-agg-sm font-agg-bold text-agg-foreground",
+                    children: labels.onboarding.connectKalshiModal.stepTwo.privateKeyLabel
+                  }
+                ),
+                /* @__PURE__ */ jsx6(
+                  "textarea",
+                  {
+                    id: "kalshi-private-key",
+                    autoComplete: "off",
+                    value: privateKey,
+                    onChange: (event) => setPrivateKey(event.target.value),
+                    placeholder: labels.onboarding.connectKalshiModal.stepTwo.privateKeyPlaceholder,
+                    rows: 3,
+                    disabled: isVerifying,
+                    "aria-invalid": !!error,
+                    "aria-describedby": error ? errorId : void 0,
+                    className: cn(
+                      "w-full resize-none rounded-agg-md border border-agg-separator bg-agg-secondary px-3 py-2.5",
+                      "text-agg-base text-agg-foreground placeholder:text-agg-muted-foreground",
+                      "outline-none transition-colors focus:border-agg-primary focus:ring-1 focus:ring-agg-primary",
+                      "disabled:cursor-not-allowed disabled:opacity-60"
+                    )
+                  }
+                )
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "flex w-full items-center justify-between gap-4", children: [
+            /* @__PURE__ */ jsx6("p", { className: "text-agg-base text-agg-foreground", children: labels.onboarding.connectKalshiModal.help.label }),
+            /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-2 text-agg-base font-agg-bold text-agg-primary", children: [
+                /* @__PURE__ */ jsx6(Icon, { name: "document", size: "small", className: "size-4 text-agg-primary" }),
+                labels.onboarding.connectKalshiModal.help.docsLinkLabel
+              ] }),
+              /* @__PURE__ */ jsx6("span", { className: "h-3 w-px bg-agg-separator" }),
+              /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-2 text-agg-base font-agg-bold text-agg-primary", children: [
+                /* @__PURE__ */ jsx6(Icon, { name: "play-square", size: "small", className: "size-4 text-agg-primary" }),
+                labels.onboarding.connectKalshiModal.help.tutorialLinkLabel
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center gap-5", children: [
+            error ? /* @__PURE__ */ jsxs6(
+              "div",
+              {
+                id: errorId,
+                className: "flex items-center gap-2",
+                role: "alert",
+                "aria-live": "assertive",
+                children: [
+                  /* @__PURE__ */ jsx6(Icon, { name: "warning", size: "small", className: "size-3.5 text-agg-error" }),
+                  /* @__PURE__ */ jsx6("p", { className: "text-agg-sm leading-agg-5 text-agg-error", children: error })
+                ]
+              }
+            ) : null,
+            /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-center gap-3", children: [
+              /* @__PURE__ */ jsx6(
+                Button,
+                {
+                  variant: "secondary",
+                  size: "large",
+                  onClick: () => handleOpenChange(false),
+                  disabled: isVerifying,
+                  children: labels.onboarding.connectKalshiModal.actions.cancel
+                }
+              ),
+              /* @__PURE__ */ jsx6(
+                Button,
+                {
+                  type: "submit",
+                  variant: "primary",
+                  size: "large",
+                  disabled: !parsedCredentials.success || isVerifying,
+                  isLoading: isVerifying,
+                  children: labels.onboarding.connectKalshiModal.actions.verifyConnection
+                }
+              )
+            ] })
+          ] })
+        ] }) })
+      ]
+    }
+  ) });
+};
+ConnectKalshiModal.displayName = "ConnectKalshiModal";
+
+// src/onboarding/index.tsx
+import { useCallback as useCallback5, useEffect as useEffect2, useState as useState5 } from "react";
+import { useLabels as useLabels7 } from "@agg-build/hooks";
+import * as Dialog3 from "@radix-ui/react-dialog";
+import { Fragment, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+var OnboardingModal = ({
+  open,
+  onOpenChange,
+  onProfileSubmit,
+  onConnectOnchain,
+  onComplete,
+  howItWorksIcons,
+  connectedOnchain = false
+}) => {
+  var _a;
+  const labels = useLabels7();
+  const [step, setStep] = useState5(ONBOARDING_STEPS.HOW_IT_WORKS);
+  const stepLabels = {
+    [ONBOARDING_STEPS.HOW_IT_WORKS]: labels.onboarding.modal.stepHowItWorks,
+    [ONBOARDING_STEPS.PROFILE_SETUP]: labels.onboarding.modal.stepProfileSetup,
+    [ONBOARDING_STEPS.CONNECT_ACCOUNTS]: labels.onboarding.modal.stepConnectAccounts
+  };
+  const resolvedTitle = (_a = stepLabels[step]) != null ? _a : labels.onboarding.modal.title;
+  const [onchainModalOpen, setOnchainModalOpen] = useState5(false);
+  const [onchainConnected, setOnchainConnected] = useState5(false);
+  useEffect2(() => {
+    if (open) {
+      setStep(ONBOARDING_STEPS.HOW_IT_WORKS);
+      setOnchainConnected(false);
+    }
+  }, [open]);
+  const handleHowItWorksContinue = useCallback5(() => {
+    setStep(ONBOARDING_STEPS.PROFILE_SETUP);
+  }, []);
+  const handleProfileContinue = useCallback5(
+    (data) => {
+      onProfileSubmit == null ? void 0 : onProfileSubmit(data);
+      setStep(ONBOARDING_STEPS.CONNECT_ACCOUNTS);
+    },
+    [onProfileSubmit]
+  );
+  const handleConnectContinue = useCallback5(() => {
+    onComplete == null ? void 0 : onComplete();
+  }, [onComplete]);
+  const handleOpenOnchainModal = useCallback5(() => {
+    setOnchainModalOpen(true);
+  }, []);
+  const handleOnchainConnect = useCallback5(() => __async(null, null, function* () {
+    yield onConnectOnchain == null ? void 0 : onConnectOnchain();
+    setOnchainConnected(true);
+  }), [onConnectOnchain]);
+  return /* @__PURE__ */ jsxs7(Fragment, { children: [
+    /* @__PURE__ */ jsx7(Modal, { open, onOpenChange, children: /* @__PURE__ */ jsxs7(
+      Modal.Container,
+      {
+        maxWidth: "600px",
+        "aria-label": resolvedTitle,
+        classNames: { container: "!rounded-agg-lg" },
+        children: [
+          /* @__PURE__ */ jsx7(Dialog3.Title, { className: "sr-only", children: resolvedTitle }),
+          /* @__PURE__ */ jsxs7(Modal.Body, { classNames: { root: "px-5 py-6 sm:px-10 sm:py-8" }, children: [
+            step === ONBOARDING_STEPS.HOW_IT_WORKS && /* @__PURE__ */ jsx7(HowItWorksStep, { onContinue: handleHowItWorksContinue, icons: howItWorksIcons }),
+            step === ONBOARDING_STEPS.PROFILE_SETUP && /* @__PURE__ */ jsx7(ProfileSetupStep, { onContinue: handleProfileContinue }),
+            step === ONBOARDING_STEPS.CONNECT_ACCOUNTS && /* @__PURE__ */ jsx7(
+              ConnectAccountsStep,
+              {
+                onConnectOnchain: handleOpenOnchainModal,
+                onContinue: handleConnectContinue,
+                connectedOnchain: connectedOnchain || onchainConnected
+              }
+            )
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx7(
+      ConnectOnchainModal,
+      {
+        open: onchainModalOpen,
+        onOpenChange: setOnchainModalOpen,
+        onConnect: handleOnchainConnect
+      }
+    )
+  ] });
+};
+OnboardingModal.displayName = "OnboardingModal";
+
+// src/notifications/deposit-notification-events.ts
+var AGG_DEPOSIT_NOTIFICATION_EVENT = "agg:deposit-notification";
+var dispatchAggDepositNotification = (detail) => {
+  if (typeof window === "undefined") return;
+  window.dispatchEvent(new CustomEvent(AGG_DEPOSIT_NOTIFICATION_EVENT, { detail }));
+};
+var subscribeAggDepositNotification = (handler) => {
+  if (typeof window === "undefined") return () => {
+  };
+  const handleDepositNotification = (event) => {
+    if (!(event instanceof CustomEvent)) return;
+    handler(event.detail);
+  };
+  window.addEventListener(AGG_DEPOSIT_NOTIFICATION_EVENT, handleDepositNotification);
+  return () => {
+    window.removeEventListener(AGG_DEPOSIT_NOTIFICATION_EVENT, handleDepositNotification);
+  };
+};
+
+export {
+  dispatchAggDepositNotification,
+  subscribeAggDepositNotification,
+  GeoBlockBanner,
+  HowItWorksStep,
+  ProfileSetupStep,
+  ConnectAccountsStep,
+  ConnectOnchainModal,
+  ConnectKalshiModal,
+  OnboardingModal
+};