@coin-voyage/swapkit 0.1.0-beta.0 → 0.1.0-beta.1

package/dist/styles/root.d.ts

@@ -0,0 +1,5 @@
+import type { SwapKitMode, SwapKitTheme } from "../types";
+export declare const SwapKitRoot: import("styled-components").StyledComponent<"div", any, {
+    $mode: SwapKitMode;
+    $customTheme: Partial<SwapKitTheme>;
+}, never>;

package/dist/styles/root.js

@@ -0,0 +1,75 @@
+import { css } from "styled-components";
+import styled from "./styled";
+import { darkTheme, lightTheme } from "./theme";
+function variables(theme) {
+    return css `
+    --sk-font-family: ${theme.fontFamily};
+    --sk-background: ${theme.background};
+    --sk-surface: ${theme.surface};
+    --sk-surface-elevated: ${theme.surfaceElevated};
+    --sk-border: ${theme.border};
+    --sk-text: ${theme.text};
+    --sk-text-muted: ${theme.textMuted};
+    --sk-accent: ${theme.accent};
+    --sk-accent-hover: ${theme.accentHover};
+    --sk-accent-text: ${theme.accentText};
+    --sk-danger: ${theme.danger};
+    --sk-warning: ${theme.warning};
+    --sk-success: ${theme.success};
+    --sk-overlay: ${theme.overlay};
+    --sk-shadow: ${theme.shadow};
+    --sk-radius: ${theme.radius};
+  `;
+}
+function modeVariables(mode, customTheme) {
+    const light = { ...lightTheme, ...customTheme };
+    const dark = { ...darkTheme, ...customTheme };
+    if (mode === "light")
+        return variables(light);
+    if (mode === "dark")
+        return variables(dark);
+    return css `
+    ${variables(light)}
+    @media (prefers-color-scheme: dark) {
+      ${variables(dark)}
+    }
+  `;
+}
+export const SwapKitRoot = styled.div `
+  ${({ $mode, $customTheme }) => modeVariables($mode, $customTheme)}
+
+  all: initial;
+  display: block;
+  width: 100%;
+  color: var(--sk-text);
+  background: var(--sk-background);
+  font-family: var(--sk-font-family);
+  font-size: 16px;
+  text-align: left;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+
+  &,
+  * {
+    box-sizing: border-box;
+    font-family: var(--sk-font-family);
+  }
+
+  button,
+  input {
+    font-family: var(--sk-font-family);
+  }
+
+  button:focus-visible,
+  input:focus-visible,
+  a:focus-visible {
+    outline: 2px solid var(--sk-accent);
+    outline-offset: 2px;
+  }
+
+  img,
+  svg {
+    display: block;
+    max-width: 100%;
+  }
+`;

package/dist/styles/styled.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("styled-components").StyledInterface;
+export default _default;

package/dist/styles/styled.js

@@ -0,0 +1,3 @@
+import styled from "styled-components";
+const styledWithDefault = styled;
+export default typeof styled.div === "function" ? styled : (styledWithDefault.default ?? styled);

package/dist/styles/theme.d.ts

@@ -0,0 +1,3 @@
+import type { SwapKitTheme } from "../types";
+export declare const lightTheme: SwapKitTheme;
+export declare const darkTheme: SwapKitTheme;

package/dist/styles/theme.js

@@ -0,0 +1,36 @@
+export const lightTheme = {
+    fontFamily: `Roboto, Arial, Helvetica, sans-serif`,
+    background: "#f4f5f7",
+    surface: "#ffffff",
+    surfaceElevated: "#f7f8fa",
+    border: "#e4e7ec",
+    text: "#15181e",
+    textMuted: "#697386",
+    accent: "#866cff",
+    accentHover: "#7559f0",
+    accentText: "#ffffff",
+    danger: "#dc2626",
+    warning: "#d97706",
+    success: "#16a34a",
+    overlay: "rgba(15, 18, 25, 0.58)",
+    shadow: "0 18px 50px rgba(15, 18, 25, 0.16)",
+    radius: "12px",
+};
+export const darkTheme = {
+    fontFamily: lightTheme.fontFamily,
+    background: "hsl(180 6% 9%)",
+    surface: "hsl(180 5% 11%)",
+    surfaceElevated: "hsl(180 6% 9%)",
+    border: "hsl(180 7% 14%)",
+    text: "hsl(0 0% 100%)",
+    textMuted: "hsl(171 6% 53%)",
+    accent: "hsl(332 83% 60%)",
+    accentHover: "hsl(332 83% 56%)",
+    accentText: "#ffffff",
+    danger: "#f87171",
+    warning: "#fbbf24",
+    success: "#4ade80",
+    overlay: "rgba(0, 0, 0, 0.72)",
+    shadow: "0 18px 50px rgba(0, 0, 0, 0.5)",
+    radius: "12px",
+};

package/dist/types.d.ts

@@ -0,0 +1,44 @@
+import type { APIEnvironment } from "@coin-voyage/shared/api";
+import type { CurrencyBase } from "@coin-voyage/shared/types";
+import type { ReactNode } from "react";
+export type SwapKitMode = "light" | "dark" | "auto";
+export interface SwapKitTheme {
+    fontFamily: string;
+    background: string;
+    surface: string;
+    surfaceElevated: string;
+    border: string;
+    text: string;
+    textMuted: string;
+    accent: string;
+    accentHover: string;
+    accentText: string;
+    danger: string;
+    warning: string;
+    success: string;
+    overlay: string;
+    shadow: string;
+    radius: string;
+}
+export interface SwapKitProviderProps {
+    apiKey: string;
+    environment?: APIEnvironment;
+    mode?: SwapKitMode;
+    theme?: Partial<SwapKitTheme>;
+    children: ReactNode;
+}
+export interface SwapCompleteResult {
+    orderId: string;
+    transactionHash: string;
+}
+export interface SwapError {
+    message: string;
+}
+export type SwapCurrency = CurrencyBase;
+export interface SwapProps {
+    defaultSourceCurrency?: SwapCurrency;
+    defaultDestinationCurrency?: SwapCurrency;
+    defaultSlippageBps?: number;
+    onComplete?: (result: SwapCompleteResult) => void;
+    onError?: (error: SwapError) => void;
+}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coin-voyage/swapkit",
   "description": "A reusable cross-chain swap component for CoinVoyage.",
-  "version": "0.1.0-beta.0",
+  "version": "0.1.0-beta.1",
   "private": false,
   "sideEffects": false,
   "author": "Lars <lars@coinvoyage.io>",
@@ -61,7 +61,7 @@
     "clean": "rm -rf dist tsconfig.tsbuildinfo coverage",
     "pre:release": "pnpm version prerelease --preid=beta",
     "pre:publish": "pnpm publish --access public --tag beta --no-git-checks",
-    "pre:steps": "pnpm pre:release && pnpm release:build && pnpm pre:publish",
+    "pre:steps": "pnpm pre:release && pnpm pre:publish",
     "release:build": "pnpm clean && pnpm build",
     "release": "pnpm publish --access public --no-git-checks",
     "type-check": "tsc --noEmit"