@draftlab/auth 0.0.3 → 0.0.4

package/dist/themes/theme.d.ts

@@ -1,2 +1,209 @@
-import { ColorScheme, THEME_DRAFTAUTH, THEME_SST, THEME_SUPABASE, THEME_TERMINAL, THEME_VERCEL, Theme, getTheme, setTheme } from "../theme-C9by7VXf.js";
+//#region src/themes/theme.d.ts
+/**
+ * Use one of the built-in themes.
+ *
+ * @example
+ *
+ * ```ts
+ * import { THEME_SST } from "@draftauth/core/themes/theme"
+ *
+ * export default issuer({
+ *   theme: THEME_SST,
+ *   // ...
+ * })
+ * ```
+ *
+ * Or define your own.
+ *
+ * ```ts
+ * import type { Theme } from "@draftauth/core/themes/theme"
+ *
+ * const MY_THEME: Theme = {
+ *   title: "Acne",
+ *   radius: "none",
+ *   favicon: "https://www.example.com/favicon.svg",
+ *   // ...
+ * }
+ *
+ * export default issuer({
+ *   theme: MY_THEME,
+ *   // ...
+ * })
+ * ```
+ *
+ * @packageDocumentation
+ */
+/**
+ * A type to define values for light and dark mode.
+ *
+ * @example
+ * ```ts
+ * {
+ *   light: "#FFF",
+ *   dark: "#000"
+ * }
+ * ```
+ */
+interface ColorScheme {
+  /**
+   * The value for dark mode.
+   */
+  dark: string;
+  /**
+   * The value for light mode.
+   */
+  light: string;
+}
+/**
+ * A type to define your custom theme.
+ */
+interface Theme {
+  /**
+   * The name of your app. Also used as the title of the page.
+   *
+   * @example
+   * ```ts
+   * {
+   *   title: "Acne"
+   * }
+   * ```
+   */
+  title?: string;
+  /**
+   * A URL to the favicon of your app.
+   *
+   * @example
+   * ```ts
+   * {
+   *   favicon: "https://www.example.com/favicon.svg"
+   * }
+   * ```
+   */
+  favicon?: string;
+  /**
+   * The border radius of the UI elements.
+   *
+   * @example
+   * ```ts
+   * {
+   *   radius: "none"
+   * }
+   * ```
+   */
+  radius?: "none" | "sm" | "md" | "lg" | "full";
+  /**
+   * The primary color of the theme.
+   *
+   * Takes a color or both light and dark colors.
+   *
+   * @example
+   * ```ts
+   * {
+   *   primary: "#FF5E00"
+   * }
+   * ```
+   */
+  primary: string | ColorScheme;
+  /**
+   * The background color of the theme.
+   *
+   * Takes a color or both light and dark colors.
+   *
+   * @example
+   * ```ts
+   * {
+   *   background: "#FFF"
+   * }
+   * ```
+   */
+  background?: string | ColorScheme;
+  /**
+   * A URL to the logo of your app.
+   *
+   * Takes a single image or both light and dark mode versions.
+   *
+   * @example
+   * ```ts
+   * {
+   *   logo: "https://www.example.com/logo.svg"
+   * }
+   * ```
+   */
+  logo?: string | ColorScheme;
+  /**
+   * The font family and scale of the theme.
+   */
+  font?: {
+    /**
+     * The font family of the theme.
+     *
+     * @example
+     * ```ts
+     * {
+     *   font: {
+     *     family: "Geist Mono, monospace"
+     *   }
+     * }
+     * ```
+     */
+    family?: string;
+    /**
+     * The font scale of the theme. Can be used to increase or decrease the font sizes across
+     * the UI.
+     *
+     * @default "1"
+     * @example
+     * ```ts
+     * {
+     *   font: {
+     *     scale: "1.25"
+     *   }
+     * }
+     * ```
+     */
+    scale?: string;
+  };
+  /**
+   * Custom CSS that's added to the page in a `<style>` tag.
+   *
+   * This can be used to import custom fonts.
+   *
+   * @example
+   * ```ts
+   * {
+   *   css: `@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@100;200;300;400;500;600;700;800;900&display=swap');`
+   * }
+   * ```
+   */
+  css?: string;
+}
+/**
+ * Built-in default Draft Auth theme.
+ */
+declare const THEME_DRAFTAUTH: Theme;
+/**
+ * Built-in theme based on [Terminal](https://terminal.shop).
+ */
+declare const THEME_TERMINAL: Theme;
+/**
+ * Built-in theme based on [SST](https://sst.dev).
+ */
+declare const THEME_SST: Theme;
+/**
+ * Built-in theme based on [Supabase](https://supabase.com).
+ */
+declare const THEME_SUPABASE: Theme;
+/**
+ * Built-in theme based on [Vercel](https://vercel.com).
+ */
+declare const THEME_VERCEL: Theme;
+/**
+ * @internal
+ */
+declare const setTheme: (value: Theme) => void;
+/**
+ * @internal
+ */
+declare const getTheme: () => any;
+//#endregion
 export { ColorScheme, THEME_DRAFTAUTH, THEME_SST, THEME_SUPABASE, THEME_TERMINAL, THEME_VERCEL, Theme, getTheme, setTheme };

package/dist/themes/theme.js

@@ -1,3 +1,120 @@
-import { THEME_DRAFTAUTH, THEME_SST, THEME_SUPABASE, THEME_TERMINAL, THEME_VERCEL, getTheme, setTheme } from "../theme-CswaLtbW.js";
+//#region src/themes/theme.ts
+/**
+* Built-in default Draft Auth theme.
+*/
+const THEME_DRAFTAUTH = {
+	title: "Draft Auth",
+	radius: "none",
+	background: {
+		dark: "black",
+		light: "white"
+	},
+	primary: {
+		dark: "white",
+		light: "black"
+	},
+	font: { family: "IBM Plex Sans, sans-serif" },
+	css: `
+    @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@100;200;300;400;500;600;700&display=swap');
+  `
+};
+/**
+* Built-in theme based on [Terminal](https://terminal.shop).
+*/
+const THEME_TERMINAL = {
+	title: "terminal",
+	radius: "none",
+	favicon: "https://www.terminal.shop/favicon.svg",
+	logo: {
+		dark: "https://www.terminal.shop/images/logo-white.svg",
+		light: "https://www.terminal.shop/images/logo-black.svg"
+	},
+	primary: "#ff5e00",
+	background: {
+		dark: "rgb(0, 0, 0)",
+		light: "rgb(255, 255, 255)"
+	},
+	font: { family: "Geist Mono, monospace" },
+	css: `
+    @import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100;200;300;400;500;600;700;800;900&display=swap');
+  `
+};
+/**
+* Built-in theme based on [SST](https://sst.dev).
+*/
+const THEME_SST = {
+	title: "SST",
+	favicon: "https://sst.dev/favicon.svg",
+	logo: {
+		dark: "https://sst.dev/favicon.svg",
+		light: "https://sst.dev/favicon.svg"
+	},
+	background: {
+		dark: "#1a1a2d",
+		light: "rgb(255, 255, 255)"
+	},
+	primary: "#f3663f",
+	font: { family: "Rubik, sans-serif" },
+	css: `
+    @import url('https://fonts.googleapis.com/css2?family=Rubik:wght@100;200;300;400;500;600;700;800;900&display=swap');
+  `
+};
+/**
+* Built-in theme based on [Supabase](https://supabase.com).
+*/
+const THEME_SUPABASE = {
+	title: "Supabase",
+	logo: {
+		dark: "https://supabase.com/dashboard/_next/image?url=%2Fdashboard%2Fimg%2Fsupabase-dark.svg&w=128&q=75",
+		light: "https://supabase.com/dashboard/_next/image?url=%2Fdashboard%2Fimg%2Fsupabase-light.svg&w=128&q=75"
+	},
+	background: {
+		dark: "#171717",
+		light: "#f8f8f8"
+	},
+	primary: {
+		dark: "#006239",
+		light: "#72e3ad"
+	},
+	font: { family: "Varela Round, sans-serif" },
+	css: `
+    @import url('https://fonts.googleapis.com/css2?family=Varela+Round:wght@100;200;300;400;500;600;700;800;900&display=swap');
+  `
+};
+/**
+* Built-in theme based on [Vercel](https://vercel.com).
+*/
+const THEME_VERCEL = {
+	title: "Vercel",
+	logo: {
+		dark: "https://vercel.com/mktng/_next/static/media/vercel-logotype-dark.e8c0a742.svg",
+		light: "https://vercel.com/mktng/_next/static/media/vercel-logotype-light.700a8d26.svg"
+	},
+	background: {
+		dark: "black",
+		light: "white"
+	},
+	primary: {
+		dark: "white",
+		light: "black"
+	},
+	font: { family: "Geist, sans-serif" },
+	css: `
+    @import url('https://fonts.googleapis.com/css2?family=Geist:wght@100;200;300;400;500;600;700;800;900&display=swap');
+  `
+};
+/**
+* @internal
+*/
+const setTheme = (value) => {
+	globalThis.DRAFTAUTH_THEME = value;
+};
+/**
+* @internal
+*/
+const getTheme = () => {
+	return globalThis.DRAFTAUTH_THEME || THEME_DRAFTAUTH;
+};
 
+//#endregion
 export { THEME_DRAFTAUTH, THEME_SST, THEME_SUPABASE, THEME_TERMINAL, THEME_VERCEL, getTheme, setTheme };