51: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/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52: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/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:Tf25,/* @jsxImportSource @opentui/react */ import React, { useState, useEffect, useCallback } from "react"; import { useTheme } from "@/hooks/use-theme"; export interface ClockProps { format?: "12h" | "24h"; showSeconds?: boolean; showDate?: boolean; timezone?: string; color?: string; size?: "sm" | "lg"; } const BIG_DIGITS: Record = { " ": [" ", " ", " ", " ", " "], "0": ["╔═╗", "║ ║", "║ ║", "║ ║", "╚═╝"], "1": [" ╗ ", " ║ ", " ║ ", " ║ ", " ╩ "], "2": ["╔═╗", " ║", "╔═╝", "║ ", "╚══"], "3": ["╔═╗", " ║", " ═╣", " ║", "╚═╝"], "4": ["╗ ╗", "║ ║", "╚═╣", " ║", " ╩"], "5": ["╔══", "║ ", "╚═╗", " ║", "╚═╝"], "6": ["╔══", "║ ", "╠═╗", "║ ║", "╚═╝"], "7": ["╔═╗", " ║", " ║", " ║", " ╩"], "8": ["╔═╗", "║ ║", "╠═╣", "║ ║", "╚═╝"], "9": ["╔═╗", "║ ║", "╚═╣", " ║", "╚═╝"], ":": [" ", " ● ", " ", " ● ", " "], }; const renderBigText = (str: string, color: string): React.ReactElement => { const rows: string[] = ["", "", "", "", ""]; for (const ch of str) { const segs = BIG_DIGITS[ch] ?? BIG_DIGITS[" "] ?? []; for (let r = 0; r < 5; r += 1) { rows[r] += segs[r]; } } return ( {rows.map((row, i) => ( {row} ))} ); }; const padNum = (n: number) => String(n).padStart(2, "0"); const getTimeParts = ( format: "12h" | "24h", showSeconds: boolean, timezone?: string ) => { const now = timezone ? new Date(new Date().toLocaleString("en-US", { timeZone: timezone })) : new Date(); let hours = now.getHours(); const minutes = now.getMinutes(); const seconds = now.getSeconds(); let ampm = ""; if (format === "12h") { ampm = hours >= 12 ? " PM" : " AM"; hours = hours % 12 || 12; } const time = showSeconds ? `${padNum(hours)}:${padNum(minutes)}:${padNum(seconds)}` : `${padNum(hours)}:${padNum(minutes)}`; return { ampm, time }; }; const getDateString = (timezone?: string): string => { const now = timezone ? new Date(new Date().toLocaleString("en-US", { timeZone: timezone })) : new Date(); return now.toLocaleDateString("en-US", { day: "numeric", month: "short", weekday: "short", year: "numeric", }); }; export const Clock = ({ format = "24h", showSeconds = true, showDate = false, timezone, color, size = "sm", }: ClockProps) => { const theme = useTheme(); const resolvedColor = color ?? theme.colors.primary; const [_tick, setTick] = useState(0); const tick = useCallback(() => setTick((t) => t + 1), []); useEffect(() => { const id = setInterval(tick, 1000); return () => clearInterval(id); }, [tick]); const { time, ampm } = getTimeParts(format, showSeconds, timezone); if (size === "lg") { return ( {showDate && ( {getDateString(timezone)} )} {renderBigText(time, resolvedColor)} {ampm && ( {ampm} )} ); } return ( {showDate && ( {getDateString(timezone)} )} {time} {ampm && {ampm}} ); }; 50:["$","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","@opentui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40opentui%2Freact","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":"@opentui/react"}]]}]}]]}],["$","$L51",null,{"namespace":"@termcn","registryDependencies":["https://termcn.dev/r/opentui/use-theme.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/opentui/ui/clock.tsx","content":"$53","type":"registry:ui","target":"components/ui/clock.tsx"}],"className":"h-[70svh] min-h-80"}]]}]