@voltro/ui-shadcn 0.1.0

package/dist/brand.d.ts

@@ -0,0 +1,73 @@
+import { CSSProperties } from 'react';
+import { ReactNode } from 'react';
+import { SVGProps } from 'react';
+
+/** Raw bolt path data, for apps that need to compose their own SVG. */
+export declare const VOLTRO_BOLT_PATH: {
+    readonly full: "M28 5 13 27 22 26 20 43 35 21 26 22Z";
+    readonly front: "M28 5 13 27 22 26 20 43Z";
+    readonly back: "M28 5 20 43 35 21 26 22Z";
+};
+
+/** Brand violet — the canonical primary. Exposed for ad-hoc usage. */
+export declare const VOLTRO_VIOLET = "#7C3AED";
+
+/**
+ * The app / advertising icon: the bolt centred on a rounded square with
+ * its own background, so it stands on a home screen, store listing, or
+ * ad placement regardless of the surface behind it.
+ */
+export declare const VoltroIcon: ({ size, tone, radius, title, className, style, }: VoltroIconProps) => ReactNode;
+
+export declare interface VoltroIconProps {
+    /** Pixel size (square). Default 40. */
+    readonly size?: number;
+    /** `brand` (violet squircle + white bolt — works on any surface) · `dark` (near-black squircle + glowing violet bolt). */
+    readonly tone?: VoltroIconTone;
+    /** Corner radius as a fraction of size. Default 0.225 (iOS-style squircle look). */
+    readonly radius?: number;
+    readonly title?: string;
+    readonly className?: string;
+    readonly style?: CSSProperties;
+}
+
+export declare type VoltroIconTone = 'brand' | 'dark';
+
+/** The bolt mark on a transparent background. */
+export declare const VoltroMark: ({ size, variant, title, className, ...rest }: VoltroMarkProps) => ReactNode;
+
+export declare interface VoltroMarkProps extends Omit<SVGProps<SVGSVGElement>, 'width' | 'height' | 'viewBox' | 'fill' | 'xmlns' | 'children' | 'ref' | 'role' | 'aria-label' | 'aria-hidden'> {
+    /** Pixel size (square). Default 32. Pass a string like '1em' to track font-size. */
+    readonly size?: number | string;
+    /** `gradient` (default, two-facet violet) · `mono` (currentColor) · `white`. */
+    readonly variant?: VoltroMarkVariant;
+    /** Accessible label. Omit + set `aria-hidden` when paired with a text label. */
+    readonly title?: string;
+}
+
+export declare type VoltroMarkVariant = 'gradient' | 'mono' | 'white';
+
+/**
+ * Mark + wordmark lock-up for headers / marketing. The text is real
+ * type set in the surrounding font and `currentColor`, so it inherits
+ * the app's typography and is correct in light + dark automatically.
+ */
+export declare const VoltroWordmark: ({ size, markVariant, label, className, style, }: VoltroWordmarkProps) => ReactNode;
+
+export declare interface VoltroWordmarkProps {
+    /** Mark height in px; the wordmark text scales with it. Default 28. */
+    readonly size?: number;
+    readonly markVariant?: VoltroMarkVariant;
+    /** Wordmark label. Default "Voltro". */
+    readonly label?: string;
+    readonly className?: string;
+    readonly style?: CSSProperties;
+}
+
+export { }
+
+
+declare global {
+    var __voltroShikiHighlighter: Highlighter | null | undefined;
+    var __voltroShikiHighlighterPromise: Promise<Highlighter | null> | null | undefined;
+}

package/dist/brand.js

@@ -0,0 +1,177 @@
+import { cn as e } from "./cn.js";
+import { useId as t } from "react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/brand/voltroLogo.tsx
+var a = "M28 5 13 27 22 26 20 43 35 21 26 22Z", o = "M28 5 13 27 22 26 20 43Z", s = "M28 5 20 43 35 21 26 22Z", c = "#7C3AED", l = ({ size: c = 32, variant: l = "gradient", title: u, className: d, ...f }) => {
+	let p = t(), m = `vmF-${p}`, h = `vmB-${p}`;
+	return /* @__PURE__ */ r("svg", {
+		width: c,
+		height: c,
+		viewBox: "0 0 48 48",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...u === void 0 ? { "aria-hidden": !0 } : {
+			role: "img",
+			"aria-label": u
+		},
+		className: e("inline-block shrink-0", d),
+		...f,
+		children: l === "gradient" ? /* @__PURE__ */ i(n, { children: [
+			/* @__PURE__ */ i("defs", { children: [/* @__PURE__ */ i("linearGradient", {
+				id: m,
+				x1: "13",
+				y1: "5",
+				x2: "33",
+				y2: "43",
+				gradientUnits: "userSpaceOnUse",
+				children: [/* @__PURE__ */ r("stop", { stopColor: "#A874FF" }), /* @__PURE__ */ r("stop", {
+					offset: "1",
+					stopColor: "#7C3AED"
+				})]
+			}), /* @__PURE__ */ i("linearGradient", {
+				id: h,
+				x1: "22",
+				y1: "5",
+				x2: "35",
+				y2: "43",
+				gradientUnits: "userSpaceOnUse",
+				children: [/* @__PURE__ */ r("stop", { stopColor: "#6D28D9" }), /* @__PURE__ */ r("stop", {
+					offset: "1",
+					stopColor: "#4C1D95"
+				})]
+			})] }),
+			/* @__PURE__ */ r("path", {
+				d: o,
+				fill: `url(#${m})`
+			}),
+			/* @__PURE__ */ r("path", {
+				d: s,
+				fill: `url(#${h})`
+			})
+		] }) : /* @__PURE__ */ r("path", {
+			d: a,
+			fill: l === "white" ? "#FFFFFF" : "currentColor"
+		})
+	});
+}, u = ({ size: a = 40, tone: c = "brand", radius: l = .225, title: u = "Voltro", className: d, style: f }) => {
+	let p = t(), m = `viBg-${p}`, h = `viGlow-${p}`, g = `viF-${p}`, _ = `viB-${p}`, v = (64 * l).toFixed(2);
+	return /* @__PURE__ */ i("svg", {
+		width: a,
+		height: a,
+		viewBox: "0 0 64 64",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		role: "img",
+		"aria-label": u,
+		className: e("inline-block shrink-0", d),
+		style: f,
+		children: [
+			/* @__PURE__ */ i("defs", { children: [
+				/* @__PURE__ */ r("linearGradient", {
+					id: m,
+					x1: "0",
+					y1: "0",
+					x2: "64",
+					y2: "64",
+					gradientUnits: "userSpaceOnUse",
+					children: c === "brand" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("stop", { stopColor: "#8B5CFF" }), /* @__PURE__ */ r("stop", {
+						offset: "1",
+						stopColor: "#6D28D9"
+					})] }) : /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("stop", { stopColor: "#1B1726" }), /* @__PURE__ */ r("stop", {
+						offset: "1",
+						stopColor: "#120F1A"
+					})] })
+				}),
+				c === "dark" ? /* @__PURE__ */ i("radialGradient", {
+					id: h,
+					cx: "0.5",
+					cy: "0.46",
+					r: "0.5",
+					children: [/* @__PURE__ */ r("stop", {
+						stopColor: "#7C3AED",
+						stopOpacity: "0.55"
+					}), /* @__PURE__ */ r("stop", {
+						offset: "1",
+						stopColor: "#7C3AED",
+						stopOpacity: "0"
+					})]
+				}) : null,
+				/* @__PURE__ */ i("linearGradient", {
+					id: g,
+					x1: "13",
+					y1: "5",
+					x2: "33",
+					y2: "43",
+					gradientUnits: "userSpaceOnUse",
+					children: [/* @__PURE__ */ r("stop", { stopColor: "#C4A6FF" }), /* @__PURE__ */ r("stop", {
+						offset: "1",
+						stopColor: "#9D5BFF"
+					})]
+				}),
+				/* @__PURE__ */ i("linearGradient", {
+					id: _,
+					x1: "22",
+					y1: "5",
+					x2: "35",
+					y2: "43",
+					gradientUnits: "userSpaceOnUse",
+					children: [/* @__PURE__ */ r("stop", { stopColor: "#A874FF" }), /* @__PURE__ */ r("stop", {
+						offset: "1",
+						stopColor: "#7C3AED"
+					})]
+				})
+			] }),
+			/* @__PURE__ */ r("rect", {
+				width: "64",
+				height: "64",
+				rx: v,
+				fill: `url(#${m})`
+			}),
+			c === "brand" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("path", {
+				transform: "translate(8 8)",
+				d: o,
+				fill: "#FFFFFF"
+			}), /* @__PURE__ */ r("path", {
+				transform: "translate(8 8)",
+				d: s,
+				fill: "#D7C4FF"
+			})] }) : /* @__PURE__ */ i(n, { children: [
+				/* @__PURE__ */ r("ellipse", {
+					cx: "32",
+					cy: "30",
+					rx: "26",
+					ry: "26",
+					fill: `url(#${h})`
+				}),
+				/* @__PURE__ */ r("path", {
+					transform: "translate(8 8)",
+					d: o,
+					fill: `url(#${g})`
+				}),
+				/* @__PURE__ */ r("path", {
+					transform: "translate(8 8)",
+					d: s,
+					fill: `url(#${_})`
+				})
+			] })
+		]
+	});
+}, d = ({ size: t = 28, markVariant: n = "gradient", label: a = "Voltro", className: o, style: s }) => /* @__PURE__ */ i("span", {
+	className: e("inline-flex items-center font-semibold tracking-tight leading-none", o),
+	style: {
+		gap: t * .28,
+		fontSize: t * .74,
+		...s
+	},
+	children: [/* @__PURE__ */ r(l, {
+		size: Math.round(t * 1.18),
+		variant: n,
+		"aria-hidden": !0
+	}), /* @__PURE__ */ r("span", { children: a })]
+}), f = {
+	full: a,
+	front: o,
+	back: s
+};
+//#endregion
+export { f as VOLTRO_BOLT_PATH, c as VOLTRO_VIOLET, u as VoltroIcon, l as VoltroMark, d as VoltroWordmark };

package/dist/cn.d.ts

@@ -0,0 +1,11 @@
+import { ClassValue } from 'clsx';
+
+export declare const cn: (...inputs: ClassValue[]) => string;
+
+export { }
+
+
+declare global {
+    var __voltroShikiHighlighter: Highlighter | null | undefined;
+    var __voltroShikiHighlighterPromise: Promise<Highlighter | null> | null | undefined;
+}

package/dist/cn.js

@@ -0,0 +1,6 @@
+import { clsx as e } from "clsx";
+import { twMerge as t } from "tailwind-merge";
+//#region src/cn.ts
+var n = (...n) => t(e(n));
+//#endregion
+export { n as cn };