4a:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4b:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4c:T427e,"use client"; import type * as React from "react"; import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore, } from "react"; import { createPortal } from "react-dom"; import { renderHandBitmap, type BitmapSource } from "./dither"; import { ensureHandStyles } from "./styles"; import { useTheme } from "next-themes"; import { Moon, Sun } from "lucide-react"; import type { ThemeController } from "./theme"; export interface HandThemeToggleProps { leftImage?: string; rightImage?: string; columns?: number; cellSize?: number; lightColor?: string; darkColor?: string; travelDistance?: number; gap?: number; className?: string; triggerClassName?: string; children?: React.ReactNode; onToggle?: (isDark: boolean) => void; isDark?: boolean; } const SLIDE_IN_SECONDS = 0.35; const HOLD_SECONDS = 1.25; const SLIDE_OUT_SECONDS = 0.4; const TOTAL_SECONDS = SLIDE_IN_SECONDS + HOLD_SECONDS + SLIDE_OUT_SECONDS; const KEYFRAME_TIMES = [ 0, SLIDE_IN_SECONDS / TOTAL_SECONDS, (SLIDE_IN_SECONDS + HOLD_SECONDS) / TOTAL_SECONDS, 1, ] as const; const EASE_ENTRY = "cubic-bezier(0.65, 0, 0.35, 1)"; const EASE_EXIT = "cubic-bezier(0.55, 0, 0.85, 0.35)"; const MIN_SCALE = 0.16; function runHandTimeline(el: HTMLCanvasElement, fromX: number): Animation { return el.animate( [ { transform: `translateX(${fromX}px)`, easing: EASE_ENTRY }, { transform: "translateX(0px)", offset: KEYFRAME_TIMES[1], easing: "linear" }, { transform: "translateX(0px)", offset: KEYFRAME_TIMES[2], easing: EASE_EXIT }, { transform: `translateX(${fromX}px)` }, ], { duration: TOTAL_SECONDS * 1000, fill: "both" }, ); } function usePrefersReducedMotion(): boolean { const [reduced, setReduced] = useState( () => typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches, ); useEffect(() => { const query = window.matchMedia("(prefers-reduced-motion: reduce)"); const onChange = () => setReduced(query.matches); query.addEventListener("change", onChange); return () => query.removeEventListener("change", onChange); }, []); return reduced; } function computeScale(columns = 100, cellSize = 10, gap = 10, innerWidth?: number): number { if (typeof window === "undefined" && innerWidth == null) return 1; const w = innerWidth ?? window.innerWidth; const unscaledPairWidth = columns * cellSize * 2 + gap; return Math.min(1, Math.max(MIN_SCALE, w / unscaledPairWidth)); } function computePairWidth(columns: number, cellSize: number, gap: number, scale: number): number { return (columns * cellSize * 2 + gap) * scale; } function computeTravel( travelDistance: number | undefined, pairWidth: number, innerWidth?: number, ): number { if (travelDistance != null) return travelDistance; if (typeof window === "undefined" && innerWidth == null) return 300; const w = innerWidth ?? window.innerWidth; return w / 2 + pairWidth; } function createFallbackHand(mirror: boolean): BitmapSource { const width = 200; const height = 280; const canvas = document.createElement("canvas"); canvas.width = width; canvas.height = height; const ctx = canvas.getContext("2d")!; if (mirror) { ctx.translate(width, 0); ctx.scale(-1, 1); } ctx.fillStyle = "#000000"; ctx.strokeStyle = "#000000"; ctx.beginPath(); ctx.roundRect(58, 150, 88, 112, 32); ctx.fill(); ctx.lineCap = "round"; const fingers = [ { x: 74, tip: 88 }, { x: 97, tip: 66 }, { x: 120, tip: 76 }, { x: 141, tip: 100 }, ]; for (const finger of fingers) { ctx.lineWidth = 21; ctx.beginPath(); ctx.moveTo(finger.x, 168); ctx.lineTo(finger.x, finger.tip); ctx.stroke(); } ctx.lineWidth = 24; ctx.beginPath(); ctx.moveTo(72, 196); ctx.lineTo(34, 164); ctx.stroke(); return { source: canvas, width, height }; } interface HandAsset { variants: { dark: HTMLCanvasElement; light: HTMLCanvasElement }; } function blitHand( canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D, asset: HandAsset, isDark: boolean, ) { const variant = isDark ? asset.variants.dark : asset.variants.light; ctx.save(); ctx.setTransform(1, 0, 0, 1, 0, 0); ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.drawImage(variant, 0, 0); ctx.restore(); } function parkHand(left: HTMLElement, right: HTMLElement, travel: number) { left.style.transform = `translateX(${-travel}px)`; right.style.transform = `translateX(${travel}px)`; } let clientMounted = false; const mountListeners = new Set<() => void>(); function subscribeToMount(callback: () => void) { mountListeners.add(callback); if (!clientMounted) { clientMounted = true; queueMicrotask(() => { for (const listener of mountListeners) listener(); }); } return () => { mountListeners.delete(callback); }; } function getClientMountSnapshot() { return clientMounted; } function getServerMountSnapshot() { return false; } function useHasMounted() { return useSyncExternalStore(subscribeToMount, getClientMountSnapshot, getServerMountSnapshot); } export function HandThemeToggle({ leftImage = "/left.png", rightImage = "/right.png", columns = 100, cellSize = 10, lightColor = "#111111", darkColor = "#eaeaea", travelDistance, gap = 10, className, triggerClassName, children, onToggle, isDark: isDarkProp, }: HandThemeToggleProps) { const hasMounted = useHasMounted(); const { resolvedTheme, setTheme } = useTheme(); const internalController = useMemo( () => ({ isDark: resolvedTheme === "dark", setDark: (next: boolean) => setTheme(next ? "dark" : "light"), }), [resolvedTheme, setTheme], ); const prefersReducedMotion = usePrefersReducedMotion(); const isDark = isDarkProp ?? internalController.isDark; const setNextTheme = useCallback( (nextIsDark: boolean) => { if (isDarkProp == null) internalController.setDark(nextIsDark); onToggle?.(nextIsDark); }, [isDarkProp, internalController, onToggle], ); const leftRef = useRef(null); const rightRef = useRef(null); const leftCtxRef = useRef(null); const rightCtxRef = useRef(null); const leftSrcRef = useRef(null); const rightSrcRef = useRef(null); const leftAssetRef = useRef(null); const rightAssetRef = useRef(null); const [phase, setPhase] = useState<"idle" | "running">("idle"); const phaseRef = useRef<"idle" | "running">("idle"); const needsSyncRef = useRef(false); const activeAnimationsRef = useRef([]); const rebuildGenerationRef = useRef(0); const builtSignatureRef = useRef<{ left: string | null; right: string | null }>({ left: null, right: null, }); const swapTimerRef = useRef(null); const travelRef = useRef(300); const buttonIsDark = hasMounted && isDark; const isDarkRef = useRef(isDark); useEffect(() => { isDarkRef.current = isDark; }, [isDark]); const [innerWidth, setInnerWidth] = useState(() => typeof window !== "undefined" ? window.innerWidth : 0, ); const [scale, setScale] = useState(() => computeScale(columns, cellSize, gap, typeof window !== "undefined" ? window.innerWidth : undefined), ); const scaleRef = useRef(scale); const innerWidthRef = useRef(innerWidth); useEffect(() => { scaleRef.current = scale; }, [scale]); useEffect(() => { innerWidthRef.current = innerWidth; }, [innerWidth]); const stopActiveAnimations = useCallback(() => { for (const a of activeAnimationsRef.current) a.cancel(); activeAnimationsRef.current = []; }, []); const invalidateRebuilds = useCallback(() => { rebuildGenerationRef.current++; builtSignatureRef.current = { left: null, right: null }; }, []); const rebuild = useCallback(async () => { const generation = ++rebuildGenerationRef.current; const s = scaleRef.current; const sides = [ { key: "left" as const, src: leftSrcRef.current, canvas: leftRef.current, ctxOut: leftCtxRef, assetOut: leftAssetRef }, { key: "right" as const, src: rightSrcRef.current, canvas: rightRef.current, ctxOut: rightCtxRef, assetOut: rightAssetRef }, ]; for (const side of sides) { if (!side.src || !side.canvas) continue; const dpr = Math.min(window.devicePixelRatio || 1, 2); const w = Math.round(columns * cellSize * s); const h = Math.round((side.src.height / side.src.width) * w); const dw = Math.round(w * dpr); const dh = Math.round(h * dpr); const signature = `${dw}x${dh}|${darkColor}|${lightColor}`; if (builtSignatureRef.current[side.key] === signature) continue; if (side.canvas.width !== dw) side.canvas.width = dw; if (side.canvas.height !== dh) side.canvas.height = dh; side.canvas.style.width = `${w}px`; side.canvas.style.height = `${h}px`; const ctx = side.canvas.getContext("2d")!; side.ctxOut.current = ctx; const dark = renderHandBitmap(side.src, darkColor, true, dw, dh); if (generation !== rebuildGenerationRef.current) return; const light = renderHandBitmap(side.src, lightColor, false, dw, dh); if (generation !== rebuildGenerationRef.current) return; side.assetOut.current = { variants: { dark, light } }; blitHand(side.canvas, ctx, side.assetOut.current, isDarkRef.current); builtSignatureRef.current[side.key] = signature; await new Promise((resolve) => { if ("requestIdleCallback" in window) { requestIdleCallback(() => resolve(), { timeout: 200 }); } else { requestAnimationFrame(() => resolve()); } }); if (generation !== rebuildGenerationRef.current) return; } }, [columns, cellSize, darkColor, lightColor]); const repark = useCallback(() => { const left = leftRef.current; const right = rightRef.current; if (!left || !right) return; const pw = computePairWidth(columns, cellSize, gap, scaleRef.current); const travel = computeTravel(travelDistance, pw, innerWidthRef.current); travelRef.current = travel; parkHand(left, right, travel); }, [columns, cellSize, gap, travelDistance]); useEffect(() => { if (!hasMounted) return; let cancelled = false; const loadImage = (src: string, mirror: boolean, onReady: (src: BitmapSource) => void) => { if (!src) { onReady(createFallbackHand(mirror)); return; } const img = new Image(); img.crossOrigin = "anonymous"; const handleLoad = () => { if (cancelled) return; onReady({ source: img, width: img.naturalWidth, height: img.naturalHeight }); }; const handleError = () => { if (cancelled) return; onReady(createFallbackHand(mirror)); }; img.onload = handleLoad; img.onerror = handleError; img.src = src; if (img.complete && img.naturalWidth) handleLoad(); if (img.complete && !img.naturalWidth) handleError(); }; loadImage(leftImage, false, (src) => { leftSrcRef.current = src; void rebuild(); }); loadImage(rightImage, true, (src) => { rightSrcRef.current = src; void rebuild(); }); return () => { cancelled = true; }; }, [hasMounted, leftImage, rightImage, rebuild]); useEffect(() => { if (!hasMounted) return; ensureHandStyles(); document.documentElement.style.setProperty("--hvt-duration", `${HOLD_SECONDS}s`); document.documentElement.style.setProperty("--hvt-easing", "var(--hvt-ease-expo-out)"); return () => { invalidateRebuilds(); stopActiveAnimations(); if (swapTimerRef.current != null) { window.clearTimeout(swapTimerRef.current); swapTimerRef.current = null; } }; }, [hasMounted, stopActiveAnimations, invalidateRebuilds]); useLayoutEffect(() => { if (!hasMounted) return; repark(); }, [hasMounted, repark]); useEffect(() => { if (!hasMounted) return; let frame: number | null = null; const onResize = () => { if (frame != null) return; frame = requestAnimationFrame(() => { setInnerWidth(window.innerWidth); setScale(computeScale(columns, cellSize, gap, window.innerWidth)); frame = null; }); }; onResize(); window.addEventListener("resize", onResize); window.visualViewport?.addEventListener("resize", onResize); return () => { if (frame != null) cancelAnimationFrame(frame); window.removeEventListener("resize", onResize); window.visualViewport?.removeEventListener("resize", onResize); }; }, [hasMounted, columns, cellSize, gap]); useEffect(() => { if (!hasMounted) return; if (phaseRef.current === "running") { needsSyncRef.current = true; return; } void rebuild(); repark(); }, [hasMounted, scale, innerWidth, rebuild, repark]); useEffect(() => { if (!hasMounted) return; if (phaseRef.current === "running") { needsSyncRef.current = true; return; } const left = leftRef.current; const right = rightRef.current; if (left && leftCtxRef.current && leftAssetRef.current) { blitHand(left, leftCtxRef.current, leftAssetRef.current, isDark); } if (right && rightCtxRef.current && rightAssetRef.current) { blitHand(right, rightCtxRef.current, rightAssetRef.current, isDark); } }, [hasMounted, isDark]); const handleToggle = useCallback(async () => { if (phaseRef.current !== "idle") return; const left = leftRef.current; const right = rightRef.current; const leftAsset = leftAssetRef.current; const rightAsset = rightAssetRef.current; const leftCtx = leftCtxRef.current; const rightCtx = rightCtxRef.current; if (!left || !right || !leftAsset || !rightAsset || !leftCtx || !rightCtx) return; const nextIsDark = !isDark; const applySwap = () => { setNextTheme(nextIsDark); blitHand(left, leftCtx, leftAsset, nextIsDark); blitHand(right, rightCtx, rightAsset, nextIsDark); }; if (prefersReducedMotion) { if (document.startViewTransition) { document.startViewTransition(applySwap); } else { applySwap(); } return; } phaseRef.current = "running"; setPhase("running"); for (const a of activeAnimationsRef.current) a.cancel(); activeAnimationsRef.current = []; const travel = travelRef.current; swapTimerRef.current = window.setTimeout(() => { swapTimerRef.current = null; if (document.startViewTransition) { const transition = document.startViewTransition(applySwap); transition.finished.catch(() => {}); } else { applySwap(); } }, SLIDE_IN_SECONDS * 1000); try { const animations = [ runHandTimeline(left, -travel), runHandTimeline(right, travel), ]; activeAnimationsRef.current = animations; await Promise.all(animations.map((a) => a.finished.catch(() => {}))); } finally { for (const a of activeAnimationsRef.current) a.cancel(); activeAnimationsRef.current = []; if (swapTimerRef.current != null) { window.clearTimeout(swapTimerRef.current); swapTimerRef.current = null; } if (needsSyncRef.current) { needsSyncRef.current = false; void rebuild(); } repark(); phaseRef.current = "idle"; setPhase("idle"); } }, [isDark, prefersReducedMotion, setNextTheme, rebuild, repark]); const overlay = hasMounted ? createPortal(

, document.body, ) : null; return ( <> {overlay} ); } 4d:Tc63,export interface BitmapSource { source: CanvasImageSource; width: number; height: number; } const BAYER_8X8 = [ 0, 32, 8, 40, 2, 34, 10, 42, 48, 16, 56, 24, 50, 18, 58, 26, 12, 44, 4, 36, 14, 46, 6, 38, 60, 28, 52, 20, 62, 30, 54, 22, 3, 35, 11, 43, 1, 33, 9, 41, 51, 19, 59, 27, 49, 17, 57, 25, 15, 47, 7, 39, 13, 45, 5, 37, 63, 31, 55, 23, 61, 29, 53, 21, ]; export function renderHandBitmap( src: BitmapSource, colorHex: string, isDark: boolean, outWidth: number, outHeight: number, ): HTMLCanvasElement { const canvas = document.createElement("canvas"); canvas.width = outWidth; canvas.height = outHeight; const ctx = canvas.getContext("2d", { willReadFrequently: true })!; ctx.drawImage(src.source, 0, 0, outWidth, outHeight); const imageData = ctx.getImageData(0, 0, outWidth, outHeight); const pixels = imageData.data; const count = outWidth * outHeight; const luminance = new Float32Array(count); const opaque = new Uint8Array(count); for (let p = 0, i = 0; p < count; p++, i += 4) { if (pixels[i + 3] < 128) continue; opaque[p] = 1; luminance[p] = 0.299 * pixels[i] + 0.587 * pixels[i + 1] + 0.114 * pixels[i + 2]; } if (isDark) { ditherOrdered(luminance, opaque, outWidth, outHeight); } else { ditherAtkinson(luminance, opaque, outWidth, outHeight); } const r = parseInt(colorHex.slice(1, 3), 16); const g = parseInt(colorHex.slice(3, 5), 16); const b = parseInt(colorHex.slice(5, 7), 16); for (let p = 0, i = 0; p < count; p++, i += 4) { if (!opaque[p]) { pixels[i + 3] = 0; continue; } if (luminance[p] > 127) { pixels[i + 3] = 0; } else { pixels[i] = r; pixels[i + 1] = g; pixels[i + 2] = b; pixels[i + 3] = 255; } } ctx.putImageData(imageData, 0, 0); return canvas; } function ditherOrdered( lum: Float32Array, opaque: Uint8Array, w: number, h: number, ): void { for (let y = 0; y < h; y++) { const matrixRow = (y & 7) * 8; for (let x = 0; x < w; x++) { const p = y * w + x; if (!opaque[p]) continue; const threshold = ((BAYER_8X8[matrixRow + (x & 7)] + 0.5) / 64) * 255; lum[p] = lum[p] > threshold ? 255 : 0; } } } function ditherAtkinson( lum: Float32Array, opaque: Uint8Array, w: number, h: number, ): void { for (let y = 0; y < h; y++) { for (let x = 0; x < w; x++) { const p = y * w + x; if (!opaque[p]) continue; const old = lum[p]; const next = old > 127 ? 255 : 0; lum[p] = next; const error = (old - next) / 8; spread(lum, opaque, x + 1, y, w, h, error); spread(lum, opaque, x + 2, y, w, h, error); spread(lum, opaque, x - 1, y + 1, w, h, error); spread(lum, opaque, x, y + 1, w, h, error); spread(lum, opaque, x + 1, y + 1, w, h, error); spread(lum, opaque, x, y + 2, w, h, error); } } } function spread( lum: Float32Array, opaque: Uint8Array, x: number, y: number, w: number, h: number, error: number, ): void { if (x < 0 || x >= w || y >= h) return; const p = y * w + x; if (!opaque[p]) return; lum[p] += error; } 4e:T926,const STYLE_ID = "hand-toggle-styles"; const CSS = ` :root { --hvt-ease-expo-out: linear( 0 0%, 0.1684 2.66%, 0.3165 5.49%, 0.446 8.52%, 0.5581 11.78%, 0.6535 15.29%, 0.7341 19.11%, 0.8011 23.3%, 0.8557 27.93%, 0.8962 32.68%, 0.9283 38.01%, 0.9529 44.08%, 0.9711 51.14%, 0.9833 59.06%, 0.9915 68.74%, 1 100% ); } @keyframes hvt-circle-reveal { from { clip-path: circle(0% at 50% 50%); } to { clip-path: circle(100% at 50% 50%); } } ::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; } ::view-transition-new(root) { animation: hvt-circle-reveal var(--hvt-duration, 1.25s) var(--hvt-easing, var(--hvt-ease-expo-out)); animation-fill-mode: both; } ::view-transition-old(root), .dark::view-transition-old(root) { z-index: -1; } @media (prefers-reduced-motion: reduce) { ::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; transition: none !important; } .hvt-trigger { transition: none !important; } } .hvt-trigger { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 9999px; border: none; background: transparent; color: inherit; font-size: 1rem; line-height: 1; cursor: pointer; outline: none; transition: background-color 0.15s ease; } .hvt-trigger:hover { background-color: color-mix(in srgb, currentColor 8%, transparent); } .hvt-trigger:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } .hvt-trigger[disabled] { opacity: 0.6; cursor: not-allowed; } .hvt-trigger[aria-busy="true"] { pointer-events: none; } .hvt-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; overflow: hidden; pointer-events: none; visibility: hidden; } .hvt-overlay[data-running="true"] { visibility: visible; } .hvt-canvas { will-change: transform; image-rendering: pixelated; } `; export function ensureHandStyles(): void { if (typeof document === "undefined") return; if (document.getElementById(STYLE_ID)) return; const style = document.createElement("style"); style.id = STYLE_ID; style.textContent = CSS; document.head.appendChild(style); } 49:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","next-themes",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/next-themes","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"next-themes"}]]}]}],["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L4a",null,{"namespace":"@knot-ui","registryDependencies":[]}]]}],null]}],["$","$L4b",null,{"files":[{"path":"components/library/hand-toggle/index.ts","content":"export { HandThemeToggle, type HandThemeToggleProps } from \"./hand-toggle\";\nexport type { ThemeController } from \"./theme\";\n","type":"registry:component"},{"path":"components/library/hand-toggle/hand-toggle.tsx","content":"$4c","type":"registry:component"},{"path":"components/library/hand-toggle/dither.ts","content":"$4d","type":"registry:component"},{"path":"components/library/hand-toggle/styles.ts","content":"$4e","type":"registry:component"},{"path":"components/library/hand-toggle/theme.ts","content":"export interface ThemeController {\n isDark: boolean;\n setDark(next: boolean): void;\n}\n","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]