@tulipfarm/sprout 0.1.0 → 0.3.0

package/dist/internal/brand-glyphs.d.ts

@@ -37,6 +37,34 @@ export declare const brandGlyphs: {
             readonly evenOdd: true;
         }];
     };
+    readonly gemini: {
+        readonly viewBox: "0 0 24 24";
+        readonly paths: readonly [{
+            readonly d: "M20.616 10.835a14.147 14.147 0 01-4.45-3.001 14.111 14.111 0 01-3.678-6.452.503.503 0 00-.975 0 14.134 14.134 0 01-3.679 6.452 14.155 14.155 0 01-4.45 3.001c-.65.28-1.318.505-2.002.678a.502.502 0 000 .975c.684.172 1.35.397 2.002.677a14.147 14.147 0 014.45 3.001 14.112 14.112 0 013.679 6.453.502.502 0 00.975 0c.172-.685.397-1.351.677-2.003a14.145 14.145 0 013.001-4.45 14.113 14.113 0 016.453-3.678.503.503 0 000-.975 13.245 13.245 0 01-2.003-.678z";
+            readonly evenOdd: true;
+        }];
+    };
+    readonly mistral: {
+        readonly viewBox: "0 0 24 24";
+        readonly paths: readonly [{
+            readonly d: "M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z";
+            readonly evenOdd: true;
+        }];
+    };
+    readonly meta: {
+        readonly viewBox: "0 0 24 24";
+        readonly paths: readonly [{
+            readonly d: "M6.897 4c1.915 0 3.516.932 5.43 3.376l.282-.373c.19-.246.383-.484.58-.71l.313-.35C14.588 4.788 15.792 4 17.225 4c1.273 0 2.469.557 3.491 1.516l.218.213c1.73 1.765 2.917 4.71 3.053 8.026l.011.392.002.25c0 1.501-.28 2.759-.818 3.7l-.14.23-.108.153c-.301.42-.664.758-1.086 1.009l-.265.142-.087.04a3.493 3.493 0 01-.302.118 4.117 4.117 0 01-1.33.208c-.524 0-.996-.067-1.438-.215-.614-.204-1.163-.56-1.726-1.116l-.227-.235c-.753-.812-1.534-1.976-2.493-3.586l-1.43-2.41-.544-.895-1.766 3.13-.343.592C7.597 19.156 6.227 20 4.356 20c-1.21 0-2.205-.42-2.936-1.182l-.168-.184c-.484-.573-.837-1.311-1.043-2.189l-.067-.32a8.69 8.69 0 01-.136-1.288L0 14.468c.002-.745.06-1.49.174-2.23l.1-.573c.298-1.53.828-2.958 1.536-4.157l.209-.34c1.177-1.83 2.789-3.053 4.615-3.16L6.897 4zm-.033 2.615l-.201.01c-.83.083-1.606.673-2.252 1.577l-.138.199-.01.018c-.67 1.017-1.185 2.378-1.456 3.845l-.004.022a12.591 12.591 0 00-.207 2.254l.002.188c.004.18.017.36.04.54l.043.291c.092.503.257.908.486 1.208l.117.137c.303.323.698.492 1.17.492 1.1 0 1.796-.676 3.696-3.641l2.175-3.4.454-.701-.139-.198C9.11 7.3 8.084 6.616 6.864 6.616zm10.196-.552l-.176.007c-.635.048-1.223.359-1.82.933l-.196.198c-.439.462-.887 1.064-1.367 1.807l.266.398c.18.274.362.56.55.858l.293.475 1.396 2.335.695 1.114c.583.926 1.03 1.6 1.408 2.082l.213.262c.282.326.529.54.777.673l.102.05c.227.1.457.138.718.138.176.002.35-.023.518-.073.338-.104.61-.32.813-.637l.095-.163.077-.162c.194-.459.29-1.06.29-1.785l-.006-.449c-.08-2.871-.938-5.372-2.2-6.798l-.176-.189c-.67-.683-1.444-1.074-2.27-1.074z";
+            readonly evenOdd: true;
+        }];
+    };
+    readonly qwen: {
+        readonly viewBox: "0 0 24 24";
+        readonly paths: readonly [{
+            readonly d: "M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z";
+            readonly evenOdd: true;
+        }];
+    };
     readonly google: {
         readonly viewBox: "0 0 24 24";
         readonly paths: readonly [{

package/dist/internal/brand-glyphs.js

@@ -34,6 +34,30 @@ export const brandGlyphs = {
             { "d": "M11.065 11.199l7.257-7.2c.137-.136.06-.41-.116-.41H14.3a.164.164 0 00-.117.051l-7.82 7.756c-.122.12-.302.013-.302-.179V3.82c0-.127-.083-.23-.185-.23H3.186c-.103 0-.186.103-.186.23V19.77c0 .128.083.23.186.23h2.69c.103 0 .186-.102.186-.23v-3.25c0-.069.025-.135.069-.178l2.424-2.406a.158.158 0 01.205-.023l6.484 4.772a7.677 7.677 0 003.453 1.283c.108.012.2-.095.2-.23v-3.06c0-.117-.07-.212-.164-.227a5.028 5.028 0 01-2.027-.807l-5.613-4.064c-.117-.078-.132-.279-.028-.381z", "evenOdd": true },
         ],
     },
+    "gemini": {
+        viewBox: "0 0 24 24",
+        paths: [
+            { "d": "M20.616 10.835a14.147 14.147 0 01-4.45-3.001 14.111 14.111 0 01-3.678-6.452.503.503 0 00-.975 0 14.134 14.134 0 01-3.679 6.452 14.155 14.155 0 01-4.45 3.001c-.65.28-1.318.505-2.002.678a.502.502 0 000 .975c.684.172 1.35.397 2.002.677a14.147 14.147 0 014.45 3.001 14.112 14.112 0 013.679 6.453.502.502 0 00.975 0c.172-.685.397-1.351.677-2.003a14.145 14.145 0 013.001-4.45 14.113 14.113 0 016.453-3.678.503.503 0 000-.975 13.245 13.245 0 01-2.003-.678z", "evenOdd": true },
+        ],
+    },
+    "mistral": {
+        viewBox: "0 0 24 24",
+        paths: [
+            { "d": "M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z", "evenOdd": true },
+        ],
+    },
+    "meta": {
+        viewBox: "0 0 24 24",
+        paths: [
+            { "d": "M6.897 4c1.915 0 3.516.932 5.43 3.376l.282-.373c.19-.246.383-.484.58-.71l.313-.35C14.588 4.788 15.792 4 17.225 4c1.273 0 2.469.557 3.491 1.516l.218.213c1.73 1.765 2.917 4.71 3.053 8.026l.011.392.002.25c0 1.501-.28 2.759-.818 3.7l-.14.23-.108.153c-.301.42-.664.758-1.086 1.009l-.265.142-.087.04a3.493 3.493 0 01-.302.118 4.117 4.117 0 01-1.33.208c-.524 0-.996-.067-1.438-.215-.614-.204-1.163-.56-1.726-1.116l-.227-.235c-.753-.812-1.534-1.976-2.493-3.586l-1.43-2.41-.544-.895-1.766 3.13-.343.592C7.597 19.156 6.227 20 4.356 20c-1.21 0-2.205-.42-2.936-1.182l-.168-.184c-.484-.573-.837-1.311-1.043-2.189l-.067-.32a8.69 8.69 0 01-.136-1.288L0 14.468c.002-.745.06-1.49.174-2.23l.1-.573c.298-1.53.828-2.958 1.536-4.157l.209-.34c1.177-1.83 2.789-3.053 4.615-3.16L6.897 4zm-.033 2.615l-.201.01c-.83.083-1.606.673-2.252 1.577l-.138.199-.01.018c-.67 1.017-1.185 2.378-1.456 3.845l-.004.022a12.591 12.591 0 00-.207 2.254l.002.188c.004.18.017.36.04.54l.043.291c.092.503.257.908.486 1.208l.117.137c.303.323.698.492 1.17.492 1.1 0 1.796-.676 3.696-3.641l2.175-3.4.454-.701-.139-.198C9.11 7.3 8.084 6.616 6.864 6.616zm10.196-.552l-.176.007c-.635.048-1.223.359-1.82.933l-.196.198c-.439.462-.887 1.064-1.367 1.807l.266.398c.18.274.362.56.55.858l.293.475 1.396 2.335.695 1.114c.583.926 1.03 1.6 1.408 2.082l.213.262c.282.326.529.54.777.673l.102.05c.227.1.457.138.718.138.176.002.35-.023.518-.073.338-.104.61-.32.813-.637l.095-.163.077-.162c.194-.459.29-1.06.29-1.785l-.006-.449c-.08-2.871-.938-5.372-2.2-6.798l-.176-.189c-.67-.683-1.444-1.074-2.27-1.074z", "evenOdd": true },
+        ],
+    },
+    "qwen": {
+        viewBox: "0 0 24 24",
+        paths: [
+            { "d": "M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z", "evenOdd": true },
+        ],
+    },
     "google": {
         viewBox: "0 0 24 24",
         paths: [

package/dist/internal/code-tokens.d.ts

@@ -0,0 +1,4 @@
+import type { ThemedToken } from "shiki/core";
+import type { CodeLanguage } from "./languages.js";
+export declare function useCodeTokens(code: string, language: CodeLanguage | null): ThemedToken[][] | null;
+export declare function tokenClass(token: ThemedToken): string | undefined;

package/dist/internal/code-tokens.js

@@ -0,0 +1,34 @@
+import { useEffect, useMemo, useState } from "react";
+import { codeTokens, embeddedLanguages, isLanguageReady, loadCodeLanguage, maxHighlightedLength, } from "./syntax.js";
+export function useCodeTokens(code, language) {
+    const [loaded, setLoaded] = useState(0);
+    const highlightable = language !== null && code.length <= maxHighlightedLength;
+    const needed = useMemo(() => highlightable ? [language, ...embeddedLanguages(code, language)] : [], [code, language, highlightable]);
+    const missing = needed.filter((name) => !isLanguageReady(name));
+    const key = missing.join(" ");
+    useEffect(() => {
+        if (!key)
+            return;
+        let live = true;
+        void Promise.all(key.split(" ").map((name) => loadCodeLanguage(name))).then(() => live && setLoaded((value) => value + 1), () => undefined);
+        return () => {
+            live = false;
+        };
+    }, [key]);
+    return useMemo(() => (highlightable ? codeTokens(code, language) : null), 
+    // `loaded` and `key` re-run this once the grammars arrive.
+    [code, language, highlightable, loaded, key]);
+}
+const fontStyleClasses = [
+    [1, "sprout-syntax-italic"],
+    [2, "sprout-syntax-bold"],
+    [4, "sprout-syntax-underline"],
+];
+export function tokenClass(token) {
+    const role = /--sprout-syntax-(?:token-)?([a-z-]+)/.exec(token.color ?? "")?.[1];
+    const classes = role && role !== "foreground" ? [`sprout-syntax-${role}`] : [];
+    for (const [flag, name] of fontStyleClasses)
+        if ((token.fontStyle ?? 0) & flag)
+            classes.push(name);
+    return classes.length ? classes.join(" ") : undefined;
+}

package/dist/internal/flow.d.ts

@@ -0,0 +1,22 @@
+import { type FitViewOptions, type Node } from "@xyflow/react";
+import { type KeyboardEvent } from "react";
+export declare const flowMinZoom = 0.2;
+export declare const flowMaxZoom = 1.5;
+export declare function useViewportMobile(): boolean;
+export declare const motion: (ms: number) => number;
+/**
+ * Refits whenever the pane resizes or the nodes change. The canvas panel
+ * animates open, so the first fit sees a narrower pane than the final one.
+ */
+export declare function FitOnResize({ nodes, fit, }: {
+    nodes: readonly Node[];
+    fit: FitViewOptions;
+}): null;
+export declare function ZoomControls({ position, fit, className, slot, }: {
+    position: "top-right" | "bottom-right";
+    fit: FitViewOptions;
+    className: string;
+    slot: string;
+}): import("react").JSX.Element;
+/** Arrow keys pan, plus and minus zoom, and 0 fits, from the pane or a node. */
+export declare function useKeyboardView(fit: FitViewOptions): (event: KeyboardEvent<HTMLDivElement>) => void;

package/dist/internal/flow.js

@@ -0,0 +1,82 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Panel, useNodesInitialized, useReactFlow, useStore, } from "@xyflow/react";
+import { useEffect, useSyncExternalStore } from "react";
+import { Add } from "reicon-react/icons/Add";
+import { Minus } from "reicon-react/icons/Minus";
+import { Scan } from "reicon-react/icons/Scan";
+import { Button } from "../components/button.js";
+export const flowMinZoom = 0.2;
+export const flowMaxZoom = 1.5;
+const panStep = 48;
+const mobileQuery = "(max-width: 767px)";
+const motionQuery = "(prefers-reduced-motion: reduce)";
+function subscribeMobile(callback) {
+    const media = window.matchMedia(mobileQuery);
+    media.addEventListener("change", callback);
+    return () => media.removeEventListener("change", callback);
+}
+export function useViewportMobile() {
+    return useSyncExternalStore(subscribeMobile, () => window.matchMedia(mobileQuery).matches, () => false);
+}
+export const motion = (ms) => typeof window !== "undefined" && window.matchMedia(motionQuery).matches
+    ? 0
+    : ms;
+/**
+ * Refits whenever the pane resizes or the nodes change. The canvas panel
+ * animates open, so the first fit sees a narrower pane than the final one.
+ */
+export function FitOnResize({ nodes, fit, }) {
+    const { fitView } = useReactFlow();
+    const width = useStore((state) => state.width);
+    const height = useStore((state) => state.height);
+    const measured = useNodesInitialized();
+    useEffect(() => {
+        if (!measured)
+            return;
+        const frame = requestAnimationFrame(() => void fitView(fit));
+        return () => cancelAnimationFrame(frame);
+    }, [fitView, fit, width, height, measured, nodes]);
+    return null;
+}
+export function ZoomControls({ position, fit, className, slot, }) {
+    const { zoomIn, zoomOut, fitView } = useReactFlow();
+    const zoom = useStore((state) => state.transform[2]);
+    return (_jsxs(Panel, { position: position, className: className, "data-slot": slot, role: "toolbar", "aria-label": "Diagram view", "aria-orientation": "vertical", children: [_jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Zoom in", title: "Zoom in", disabled: zoom >= flowMaxZoom, onClick: () => void zoomIn({ duration: motion(160) }), children: _jsx(Add, { size: 16, "aria-hidden": "true" }) }), _jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Zoom out", title: "Zoom out", disabled: zoom <= flowMinZoom, onClick: () => void zoomOut({ duration: motion(160) }), children: _jsx(Minus, { size: 16, "aria-hidden": "true" }) }), _jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Fit to view", title: "Fit to view", onClick: () => void fitView({ ...fit, duration: motion(180) }), children: _jsx(Scan, { size: 16, "aria-hidden": "true" }) })] }));
+}
+/** Arrow keys pan, plus and minus zoom, and 0 fits, from the pane or a node. */
+export function useKeyboardView(fit) {
+    const { getViewport, setViewport, zoomIn, zoomOut, fitView } = useReactFlow();
+    return (event) => {
+        const target = event.target;
+        if (event.altKey || event.ctrlKey || event.metaKey)
+            return;
+        if (target !== event.currentTarget &&
+            !target.classList.contains("react-flow__node"))
+            return;
+        const step = panStep * (event.shiftKey ? 4 : 1);
+        const pan = {
+            ArrowLeft: [step, 0],
+            ArrowRight: [-step, 0],
+            ArrowUp: [0, step],
+            ArrowDown: [0, -step],
+        };
+        const move = pan[event.key];
+        if (move) {
+            const { x, y, zoom } = getViewport();
+            void setViewport({ x: x + move[0], y: y + move[1], zoom }, { duration: motion(120) });
+        }
+        else if (event.key === "+" || event.key === "=") {
+            void zoomIn({ duration: motion(160) });
+        }
+        else if (event.key === "-" || event.key === "_") {
+            void zoomOut({ duration: motion(160) });
+        }
+        else if (event.key === "0") {
+            void fitView({ ...fit, duration: motion(180) });
+        }
+        else
+            return;
+        event.preventDefault();
+    };
+}

package/dist/styles/accordion.css

@@ -40,8 +40,8 @@
     text-decoration-line: underline;
   }
   .sprout-accordion-trigger:focus-visible {
-    outline: 2px solid var(--sprout-focus);
-    outline-offset: 2px;
+    outline: var(--sprout-focus-width) solid var(--sprout-focus-ring);
+    outline-offset: 0;
   }
   .sprout-accordion-trigger[data-disabled] {
     cursor: not-allowed;