@steez-ui/ui 0.1.7 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/components/DottedHaloCard.d.ts +11 -0
- package/dist/components/DottedHaloCard.d.ts.map +1 -0
- package/dist/components/DottedHaloCard.js +12 -0
- package/dist/components/DottedHaloCard.js.map +1 -0
- package/dist/components/DottedHaloCard.module.css +43 -0
- package/dist/components/LoadingScreen.d.ts +2 -1
- package/dist/components/LoadingScreen.d.ts.map +1 -1
- package/dist/components/LoadingScreen.js +2 -2
- package/dist/components/LoadingScreen.js.map +1 -1
- package/dist/components/LoadingScreen.module.css +14 -1
- package/dist/components/SignalTrailBackdrop.d.ts +18 -0
- package/dist/components/SignalTrailBackdrop.d.ts.map +1 -0
- package/dist/components/SignalTrailBackdrop.js +211 -0
- package/dist/components/SignalTrailBackdrop.js.map +1 -0
- package/dist/components/SignalTrailBackdrop.module.css +11 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/package.json +4 -3
package/README.md
CHANGED
|
@@ -101,9 +101,9 @@ GitHub Actions mirror the same CI, npm publish, and Cloudflare Pages deploy path
|
|
|
101
101
|
|
|
102
102
|
## Current Packages
|
|
103
103
|
|
|
104
|
-
- `@steez-ui/theme@0.1.
|
|
105
|
-
- `@steez-ui/icons@0.1.
|
|
106
|
-
- `@steez-ui/ui@0.1.
|
|
104
|
+
- `@steez-ui/theme@0.1.10`
|
|
105
|
+
- `@steez-ui/icons@0.1.10`
|
|
106
|
+
- `@steez-ui/ui@0.1.10`
|
|
107
107
|
|
|
108
108
|
## External Setup
|
|
109
109
|
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface DottedHaloCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
3
|
+
title?: React.ReactNode;
|
|
4
|
+
bodyClassName?: string;
|
|
5
|
+
patternInset?: string;
|
|
6
|
+
patternSize?: string;
|
|
7
|
+
patternDotSize?: string;
|
|
8
|
+
}
|
|
9
|
+
export declare function DottedHaloCard({ title, children, className, bodyClassName, patternInset, patternSize, patternDotSize, style, ...props }: DottedHaloCardProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export default DottedHaloCard;
|
|
11
|
+
//# sourceMappingURL=DottedHaloCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DottedHaloCard.d.ts","sourceRoot":"","sources":["../../src/components/DottedHaloCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC3D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,SAAc,EACd,aAAkB,EAClB,YAAY,EACZ,WAAW,EACX,cAAc,EACd,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAkBrB;AAED,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styles from "./DottedHaloCard.module.css";
|
|
3
|
+
export function DottedHaloCard({ title, children, className = "", bodyClassName = "", patternInset, patternSize, patternDotSize, style, ...props }) {
|
|
4
|
+
return (_jsxs("div", { className: `${styles.root} ${className}`.trim(), style: {
|
|
5
|
+
"--dotted-halo-inset": patternInset,
|
|
6
|
+
"--dotted-halo-pattern-size": patternSize,
|
|
7
|
+
"--dotted-halo-dot-size": patternDotSize,
|
|
8
|
+
...style,
|
|
9
|
+
}, ...props, children: [title ? _jsx("h3", { className: styles.title, children: title }) : null, _jsx("div", { className: `${styles.body} ${bodyClassName}`.trim(), children: children })] }));
|
|
10
|
+
}
|
|
11
|
+
export default DottedHaloCard;
|
|
12
|
+
//# sourceMappingURL=DottedHaloCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DottedHaloCard.js","sourceRoot":"","sources":["../../src/components/DottedHaloCard.tsx"],"names":[],"mappings":";AAEA,OAAO,MAAM,MAAM,6BAA6B,CAAC;AAWjD,MAAM,UAAU,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,aAAa,GAAG,EAAE,EAClB,YAAY,EACZ,WAAW,EACX,cAAc,EACd,KAAK,EACL,GAAG,KAAK,EACY;IACpB,OAAO,CACL,eACE,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,EAC/C,KAAK,EACH;YACE,qBAAqB,EAAE,YAAY;YACnC,4BAA4B,EAAE,WAAW;YACzC,wBAAwB,EAAE,cAAc;YACxC,GAAG,KAAK;SACc,KAEtB,KAAK,aAER,KAAK,CAAC,CAAC,CAAC,aAAI,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAM,CAAC,CAAC,CAAC,IAAI,EACzD,cAAK,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,aAAa,EAAE,CAAC,IAAI,EAAE,YAAG,QAAQ,GAAO,IACtE,CACP,CAAC;AACJ,CAAC;AAED,eAAe,cAAc,CAAC","sourcesContent":["import React from \"react\";\n\nimport styles from \"./DottedHaloCard.module.css\";\n\nexport interface DottedHaloCardProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n title?: React.ReactNode;\n bodyClassName?: string;\n patternInset?: string;\n patternSize?: string;\n patternDotSize?: string;\n}\n\nexport function DottedHaloCard({\n title,\n children,\n className = \"\",\n bodyClassName = \"\",\n patternInset,\n patternSize,\n patternDotSize,\n style,\n ...props\n}: DottedHaloCardProps) {\n return (\n <div\n className={`${styles.root} ${className}`.trim()}\n style={\n {\n \"--dotted-halo-inset\": patternInset,\n \"--dotted-halo-pattern-size\": patternSize,\n \"--dotted-halo-dot-size\": patternDotSize,\n ...style,\n } as React.CSSProperties\n }\n {...props}\n >\n {title ? <h3 className={styles.title}>{title}</h3> : null}\n <div className={`${styles.body} ${bodyClassName}`.trim()}>{children}</div>\n </div>\n );\n}\n\nexport default DottedHaloCard;\n"]}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
.root {
|
|
2
|
+
position: relative;
|
|
3
|
+
z-index: 0;
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: column;
|
|
6
|
+
gap: 0.85rem;
|
|
7
|
+
padding: 1.5rem 2rem;
|
|
8
|
+
border: 1px solid var(--text-primary);
|
|
9
|
+
border-radius: 1rem;
|
|
10
|
+
background: var(--bg-primary);
|
|
11
|
+
color: var(--text-primary);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.root::before {
|
|
15
|
+
content: "";
|
|
16
|
+
position: absolute;
|
|
17
|
+
z-index: -1;
|
|
18
|
+
inset: calc(var(--dotted-halo-inset, 1.35rem) * -1);
|
|
19
|
+
border-radius: calc(1rem + var(--dotted-halo-inset, 1.35rem));
|
|
20
|
+
background-image: radial-gradient(
|
|
21
|
+
color-mix(in srgb, var(--text-primary) 76%, transparent)
|
|
22
|
+
var(--dotted-halo-dot-size, 1px),
|
|
23
|
+
transparent 0
|
|
24
|
+
);
|
|
25
|
+
background-position: center;
|
|
26
|
+
background-repeat: repeat;
|
|
27
|
+
background-size: var(--dotted-halo-pattern-size, 5px)
|
|
28
|
+
var(--dotted-halo-pattern-size, 5px);
|
|
29
|
+
opacity: 0.7;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.title {
|
|
33
|
+
margin: 0;
|
|
34
|
+
font-family: var(--font-mono);
|
|
35
|
+
font-size: 1rem;
|
|
36
|
+
font-weight: 600;
|
|
37
|
+
line-height: 1.3;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.body {
|
|
41
|
+
color: var(--text-secondary);
|
|
42
|
+
line-height: 1.7;
|
|
43
|
+
}
|
|
@@ -4,11 +4,12 @@ export interface LoadingScreenProps {
|
|
|
4
4
|
message?: string;
|
|
5
5
|
logo?: React.ReactNode;
|
|
6
6
|
title?: React.ReactNode;
|
|
7
|
+
footerBrand?: React.ReactNode;
|
|
7
8
|
audioFeedback?: boolean;
|
|
8
9
|
fullscreen?: boolean;
|
|
9
10
|
themeMode?: "auto" | "light" | "dark";
|
|
10
11
|
}
|
|
11
|
-
export declare function LoadingScreen({ progress, message, logo, title, audioFeedback, fullscreen, themeMode, }: LoadingScreenProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function LoadingScreen({ progress, message, logo, title, footerBrand, audioFeedback, fullscreen, themeMode, }: LoadingScreenProps): import("react/jsx-runtime").JSX.Element;
|
|
12
13
|
export type LoadingStage = "init" | "auth" | "agent" | "config" | "ready";
|
|
13
14
|
export declare function useLoadingProgress(isLoading: boolean, _phase?: string, stage?: LoadingStage): {
|
|
14
15
|
progress: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingScreen.d.ts","sourceRoot":"","sources":["../../src/components/LoadingScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;CACvC;AAmCD,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,aAAqB,EACrB,UAAiB,EACjB,SAAkB,GACnB,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"LoadingScreen.d.ts","sourceRoot":"","sources":["../../src/components/LoadingScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;CACvC;AAmCD,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,WAAW,EACX,aAAqB,EACrB,UAAiB,EACjB,SAAkB,GACnB,EAAE,kBAAkB,2CAwPpB;AAED,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAkB1E,wBAAgB,kBAAkB,CAChC,SAAS,EAAE,OAAO,EAClB,MAAM,CAAC,EAAE,MAAM,EACf,KAAK,GAAE,YAAqB;;;EAgD7B"}
|
|
@@ -19,7 +19,7 @@ function resolveIsLightMode(themeMode) {
|
|
|
19
19
|
return (document.documentElement.getAttribute("data-theme") === "light" ||
|
|
20
20
|
window.localStorage.getItem("theme") === "light");
|
|
21
21
|
}
|
|
22
|
-
export function LoadingScreen({ progress, message, logo, title = "LOADING", audioFeedback = false, fullscreen = true, themeMode = "auto", }) {
|
|
22
|
+
export function LoadingScreen({ progress, message, logo, title = "LOADING", footerBrand, audioFeedback = false, fullscreen = true, themeMode = "auto", }) {
|
|
23
23
|
const [displayProgress, setDisplayProgress] = React.useState(0);
|
|
24
24
|
const [ellipsisCount, setEllipsisCount] = React.useState(0);
|
|
25
25
|
const [crosses, setCrosses] = React.useState([]);
|
|
@@ -190,7 +190,7 @@ export function LoadingScreen({ progress, message, logo, title = "LOADING", audi
|
|
|
190
190
|
if (event.animationName === "crossFall") {
|
|
191
191
|
event.currentTarget.classList.add(styles.crossLanded);
|
|
192
192
|
}
|
|
193
|
-
}, children: _jsx("div", { className: styles.crossSvg, children: _jsx(LightCrossIcon, { className: styles.crossShape }) }) }, cross.id))), _jsxs("div", { className: styles.centerStack, children: [logo ? _jsx("div", { className: styles.logoWrap, children: logo }) : null, _jsx("div", { className: styles.title, children: title })] }), _jsx(LoadingProgressBar, { progress: displayProgress, className: styles.progressRow }), _jsxs("div", { className: styles.footerMessage, children: [cleanMessage, ellipsis] })] }));
|
|
193
|
+
}, children: _jsx("div", { className: styles.crossSvg, children: _jsx(LightCrossIcon, { className: styles.crossShape }) }) }, cross.id))), _jsxs("div", { className: styles.centerStack, children: [logo ? _jsx("div", { className: styles.logoWrap, children: logo }) : null, _jsx("div", { className: styles.title, children: title })] }), _jsx(LoadingProgressBar, { progress: displayProgress, className: styles.progressRow }), _jsxs("div", { className: styles.footerStack, children: [footerBrand ? (_jsx("div", { className: styles.footerBrand, children: footerBrand })) : null, _jsxs("div", { className: styles.footerMessage, children: [cleanMessage, ellipsis] })] })] }));
|
|
194
194
|
}
|
|
195
195
|
const STAGE_PROGRESS = {
|
|
196
196
|
init: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingScreen.js","sourceRoot":"","sources":["../../src/components/LoadingScreen.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\n\nimport { LightCrossIcon } from \"@steez-ui/icons\";\n\nimport {\n LoadingProgressBar,\n LOADING_PROGRESS_SEGMENT_COUNT,\n} from \"./LoadingProgressBar.js\";\nimport styles from \"./LoadingScreen.module.css\";\n\nexport interface LoadingScreenProps {\n progress: number;\n message?: string;\n logo?: React.ReactNode;\n title?: React.ReactNode;\n audioFeedback?: boolean;\n fullscreen?: boolean;\n themeMode?: \"auto\" | \"light\" | \"dark\";\n}\n\ninterface Cross {\n id: number;\n x: number;\n rotation: number;\n scale: number;\n groundOffset: number;\n delay: number;\n opacity: number;\n}\n\nfunction randomFloat() {\n return Math.random();\n}\n\nfunction resolveIsLightMode(themeMode: LoadingScreenProps[\"themeMode\"]) {\n if (themeMode === \"light\") {\n return true;\n }\n\n if (themeMode === \"dark\") {\n return false;\n }\n\n if (typeof window === \"undefined\") {\n return false;\n }\n\n return (\n document.documentElement.getAttribute(\"data-theme\") === \"light\" ||\n window.localStorage.getItem(\"theme\") === \"light\"\n );\n}\n\nexport function LoadingScreen({\n progress,\n message,\n logo,\n title = \"LOADING\",\n audioFeedback = false,\n fullscreen = true,\n themeMode = \"auto\",\n}: LoadingScreenProps) {\n const [displayProgress, setDisplayProgress] = React.useState(0);\n const [ellipsisCount, setEllipsisCount] = React.useState(0);\n const [crosses, setCrosses] = React.useState<Cross[]>([]);\n const [bounds, setBounds] = React.useState({ width: 0, height: 0 });\n const prevFilledBars = React.useRef(0);\n const crossIdRef = React.useRef(0);\n const isLoadingRef = React.useRef(true);\n const audioCtxRef = React.useRef<AudioContext | null>(null);\n const audioEnabledRef = React.useRef(false);\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const updateBounds = React.useCallback(() => {\n const nextWidth =\n containerRef.current?.clientWidth || window.innerWidth || 0;\n const nextHeight =\n containerRef.current?.clientHeight || window.innerHeight || 0;\n\n setBounds((current) => {\n if (current.width === nextWidth && current.height === nextHeight) {\n return current;\n }\n\n return {\n width: nextWidth,\n height: nextHeight,\n };\n });\n }, []);\n\n const spawnCross = React.useCallback(() => {\n if (!isLoadingRef.current || typeof window === \"undefined\") {\n return;\n }\n\n const tilt = (randomFloat() - 0.5) * 6;\n const availableWidth = Math.max(bounds.width || window.innerWidth, 160);\n const nextCross: Cross = {\n id: crossIdRef.current += 1,\n x: randomFloat() * Math.max(availableWidth - 120, 24),\n rotation: tilt,\n scale: 0.4 + randomFloat() * 0.4,\n groundOffset: randomFloat() * 30,\n delay: 0,\n opacity: 0.4 + randomFloat() * 0.3,\n };\n setCrosses((current) => [...current.slice(-17), nextCross]);\n }, [bounds.width]);\n\n React.useEffect(() => {\n if (typeof window === \"undefined\") {\n return undefined;\n }\n\n updateBounds();\n window.addEventListener(\"resize\", updateBounds);\n\n const observer =\n typeof ResizeObserver === \"undefined\" || !containerRef.current\n ? null\n : new ResizeObserver(() => {\n updateBounds();\n });\n\n if (observer && containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n window.removeEventListener(\"resize\", updateBounds);\n observer?.disconnect();\n };\n }, [updateBounds]);\n\n React.useEffect(() => {\n isLoadingRef.current = true;\n\n const scheduleNextCross = () => {\n const delay = 400 + randomFloat() * 300;\n return setTimeout(() => {\n spawnCross();\n if (isLoadingRef.current) {\n scheduleNextCross();\n }\n }, delay);\n };\n\n const timeoutId = scheduleNextCross();\n return () => {\n clearTimeout(timeoutId);\n isLoadingRef.current = false;\n };\n }, [spawnCross]);\n\n React.useEffect(() => {\n if (!audioFeedback) {\n return undefined;\n }\n\n const enableAudio = async () => {\n const AudioContextClass =\n window.AudioContext || (window as Window & { webkitAudioContext?: typeof AudioContext }).webkitAudioContext;\n if (!AudioContextClass) {\n return;\n }\n\n try {\n const ctx = audioCtxRef.current ?? new AudioContextClass();\n audioCtxRef.current = ctx;\n if (ctx.state === \"suspended\") {\n await ctx.resume();\n }\n audioEnabledRef.current = ctx.state === \"running\";\n } catch {\n audioEnabledRef.current = false;\n }\n };\n\n window.addEventListener(\"pointerdown\", enableAudio, {\n once: true,\n passive: true,\n });\n window.addEventListener(\"keydown\", enableAudio, { once: true });\n\n return () => {\n window.removeEventListener(\"pointerdown\", enableAudio);\n window.removeEventListener(\"keydown\", enableAudio);\n if (audioCtxRef.current) {\n void audioCtxRef.current.close().catch(() => undefined);\n audioCtxRef.current = null;\n }\n audioEnabledRef.current = false;\n };\n }, [audioFeedback]);\n\n React.useEffect(() => {\n if (!audioFeedback) {\n return undefined;\n }\n\n const playBeep = () => {\n const audioCtx = audioCtxRef.current;\n if (!audioCtx || !audioEnabledRef.current) {\n return;\n }\n\n const osc = audioCtx.createOscillator();\n const gain = audioCtx.createGain();\n osc.type = \"triangle\";\n osc.frequency.value = 523.25;\n gain.gain.setValueAtTime(0.15, audioCtx.currentTime);\n gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.08);\n osc.connect(gain);\n gain.connect(audioCtx.destination);\n osc.start();\n osc.stop(audioCtx.currentTime + 0.08);\n };\n\n const filledBars = Math.round(\n (displayProgress / 100) * LOADING_PROGRESS_SEGMENT_COUNT,\n );\n if (filledBars > prevFilledBars.current) {\n playBeep();\n prevFilledBars.current = filledBars;\n }\n\n return undefined;\n }, [audioFeedback, displayProgress]);\n\n React.useEffect(() => {\n const ellipsisInterval = setInterval(() => {\n setEllipsisCount((count) => (count + 1) % 4);\n }, 400);\n return () => clearInterval(ellipsisInterval);\n }, []);\n\n React.useEffect(() => {\n const timeout = setTimeout(() => {\n setDisplayProgress(progress);\n }, 50);\n return () => clearTimeout(timeout);\n }, [progress]);\n\n const ellipsis = \".\".repeat(ellipsisCount);\n const cleanMessage = message ? message.replace(/\\.+$/, \"\") : \"\";\n const isLightMode = resolveIsLightMode(themeMode);\n const screenWidth =\n bounds.width || (typeof window === \"undefined\" ? 0 : window.innerWidth);\n const screenHeight =\n bounds.height || (typeof window === \"undefined\" ? 0 : window.innerHeight);\n\n return (\n <div\n ref={containerRef}\n className={`${styles.screen} ${fullscreen ? styles.fullscreen : styles.contained} ${\n isLightMode ? styles.lightTheme : styles.darkTheme\n }`.trim()}\n style={\n {\n \"--screen-height\": `${screenHeight}px`,\n \"--screen-width\": `${screenWidth}px`,\n } as React.CSSProperties\n }\n >\n {crosses.map((cross) => (\n <div\n key={cross.id}\n className={styles.crossContainer}\n style={\n {\n \"--cross-left\": `${cross.x}px`,\n \"--cross-delay\": `${cross.delay}ms`,\n \"--rotation\": `${cross.rotation}deg`,\n \"--ground\": `${cross.groundOffset}%`,\n \"--cross-scale\": String(cross.scale),\n \"--cross-opacity\": String(cross.opacity),\n } as React.CSSProperties\n }\n onAnimationEnd={(event) => {\n if (event.animationName === \"crossFall\") {\n event.currentTarget.classList.add(styles.crossLanded);\n }\n }}\n >\n <div className={styles.crossSvg}>\n <LightCrossIcon className={styles.crossShape} />\n </div>\n </div>\n ))}\n\n <div className={styles.centerStack}>\n {logo ? <div className={styles.logoWrap}>{logo}</div> : null}\n <div className={styles.title}>{title}</div>\n </div>\n\n <LoadingProgressBar progress={displayProgress} className={styles.progressRow} />\n\n <div className={styles.footerMessage}>\n {cleanMessage}\n {ellipsis}\n </div>\n </div>\n );\n}\n\nexport type LoadingStage = \"init\" | \"auth\" | \"agent\" | \"config\" | \"ready\";\n\nconst STAGE_PROGRESS: Record<LoadingStage, number> = {\n init: 0,\n auth: 25,\n agent: 50,\n config: 75,\n ready: 100,\n};\n\nconst STAGE_MESSAGES: Record<LoadingStage, string> = {\n init: \"Initializing...\",\n auth: \"Authenticating...\",\n agent: \"Loading agent...\",\n config: \"Loading configuration...\",\n ready: \"Preparing interface...\",\n};\n\nexport function useLoadingProgress(\n isLoading: boolean,\n _phase?: string,\n stage: LoadingStage = \"init\",\n) {\n const [progress, setProgress] = React.useState(0);\n const [currentMessage, setCurrentMessage] = React.useState(\"Initializing...\");\n const progressRef = React.useRef(0);\n\n React.useEffect(() => {\n progressRef.current = progress;\n }, [progress]);\n\n React.useEffect(() => {\n if (!isLoading) {\n setProgress(100);\n progressRef.current = 100;\n setCurrentMessage(\"Complete!\");\n return undefined;\n }\n\n const targetProgress = STAGE_PROGRESS[stage];\n const targetMessage = STAGE_MESSAGES[stage];\n setCurrentMessage(targetMessage);\n\n const currentProgressSnapshot = progressRef.current;\n const diff = targetProgress - currentProgressSnapshot;\n const steps = 20;\n const stepDuration = 100;\n let step = 0;\n\n const interval = setInterval(() => {\n step += 1;\n const easedStep = step / steps;\n const easedProgress = diff * easedStep;\n const nextProgress = Math.min(\n currentProgressSnapshot + easedProgress,\n targetProgress,\n );\n progressRef.current = nextProgress;\n setProgress(nextProgress);\n\n if (step >= steps) {\n clearInterval(interval);\n }\n }, stepDuration);\n\n return () => clearInterval(interval);\n }, [isLoading, stage]);\n\n return { progress, message: currentMessage };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"LoadingScreen.js","sourceRoot":"","sources":["../../src/components/LoadingScreen.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\n\nimport { LightCrossIcon } from \"@steez-ui/icons\";\n\nimport {\n LoadingProgressBar,\n LOADING_PROGRESS_SEGMENT_COUNT,\n} from \"./LoadingProgressBar.js\";\nimport styles from \"./LoadingScreen.module.css\";\n\nexport interface LoadingScreenProps {\n progress: number;\n message?: string;\n logo?: React.ReactNode;\n title?: React.ReactNode;\n footerBrand?: React.ReactNode;\n audioFeedback?: boolean;\n fullscreen?: boolean;\n themeMode?: \"auto\" | \"light\" | \"dark\";\n}\n\ninterface Cross {\n id: number;\n x: number;\n rotation: number;\n scale: number;\n groundOffset: number;\n delay: number;\n opacity: number;\n}\n\nfunction randomFloat() {\n return Math.random();\n}\n\nfunction resolveIsLightMode(themeMode: LoadingScreenProps[\"themeMode\"]) {\n if (themeMode === \"light\") {\n return true;\n }\n\n if (themeMode === \"dark\") {\n return false;\n }\n\n if (typeof window === \"undefined\") {\n return false;\n }\n\n return (\n document.documentElement.getAttribute(\"data-theme\") === \"light\" ||\n window.localStorage.getItem(\"theme\") === \"light\"\n );\n}\n\nexport function LoadingScreen({\n progress,\n message,\n logo,\n title = \"LOADING\",\n footerBrand,\n audioFeedback = false,\n fullscreen = true,\n themeMode = \"auto\",\n}: LoadingScreenProps) {\n const [displayProgress, setDisplayProgress] = React.useState(0);\n const [ellipsisCount, setEllipsisCount] = React.useState(0);\n const [crosses, setCrosses] = React.useState<Cross[]>([]);\n const [bounds, setBounds] = React.useState({ width: 0, height: 0 });\n const prevFilledBars = React.useRef(0);\n const crossIdRef = React.useRef(0);\n const isLoadingRef = React.useRef(true);\n const audioCtxRef = React.useRef<AudioContext | null>(null);\n const audioEnabledRef = React.useRef(false);\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const updateBounds = React.useCallback(() => {\n const nextWidth =\n containerRef.current?.clientWidth || window.innerWidth || 0;\n const nextHeight =\n containerRef.current?.clientHeight || window.innerHeight || 0;\n\n setBounds((current) => {\n if (current.width === nextWidth && current.height === nextHeight) {\n return current;\n }\n\n return {\n width: nextWidth,\n height: nextHeight,\n };\n });\n }, []);\n\n const spawnCross = React.useCallback(() => {\n if (!isLoadingRef.current || typeof window === \"undefined\") {\n return;\n }\n\n const tilt = (randomFloat() - 0.5) * 6;\n const availableWidth = Math.max(bounds.width || window.innerWidth, 160);\n const nextCross: Cross = {\n id: crossIdRef.current += 1,\n x: randomFloat() * Math.max(availableWidth - 120, 24),\n rotation: tilt,\n scale: 0.4 + randomFloat() * 0.4,\n groundOffset: randomFloat() * 30,\n delay: 0,\n opacity: 0.4 + randomFloat() * 0.3,\n };\n setCrosses((current) => [...current.slice(-17), nextCross]);\n }, [bounds.width]);\n\n React.useEffect(() => {\n if (typeof window === \"undefined\") {\n return undefined;\n }\n\n updateBounds();\n window.addEventListener(\"resize\", updateBounds);\n\n const observer =\n typeof ResizeObserver === \"undefined\" || !containerRef.current\n ? null\n : new ResizeObserver(() => {\n updateBounds();\n });\n\n if (observer && containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n window.removeEventListener(\"resize\", updateBounds);\n observer?.disconnect();\n };\n }, [updateBounds]);\n\n React.useEffect(() => {\n isLoadingRef.current = true;\n\n const scheduleNextCross = () => {\n const delay = 400 + randomFloat() * 300;\n return setTimeout(() => {\n spawnCross();\n if (isLoadingRef.current) {\n scheduleNextCross();\n }\n }, delay);\n };\n\n const timeoutId = scheduleNextCross();\n return () => {\n clearTimeout(timeoutId);\n isLoadingRef.current = false;\n };\n }, [spawnCross]);\n\n React.useEffect(() => {\n if (!audioFeedback) {\n return undefined;\n }\n\n const enableAudio = async () => {\n const AudioContextClass =\n window.AudioContext || (window as Window & { webkitAudioContext?: typeof AudioContext }).webkitAudioContext;\n if (!AudioContextClass) {\n return;\n }\n\n try {\n const ctx = audioCtxRef.current ?? new AudioContextClass();\n audioCtxRef.current = ctx;\n if (ctx.state === \"suspended\") {\n await ctx.resume();\n }\n audioEnabledRef.current = ctx.state === \"running\";\n } catch {\n audioEnabledRef.current = false;\n }\n };\n\n window.addEventListener(\"pointerdown\", enableAudio, {\n once: true,\n passive: true,\n });\n window.addEventListener(\"keydown\", enableAudio, { once: true });\n\n return () => {\n window.removeEventListener(\"pointerdown\", enableAudio);\n window.removeEventListener(\"keydown\", enableAudio);\n if (audioCtxRef.current) {\n void audioCtxRef.current.close().catch(() => undefined);\n audioCtxRef.current = null;\n }\n audioEnabledRef.current = false;\n };\n }, [audioFeedback]);\n\n React.useEffect(() => {\n if (!audioFeedback) {\n return undefined;\n }\n\n const playBeep = () => {\n const audioCtx = audioCtxRef.current;\n if (!audioCtx || !audioEnabledRef.current) {\n return;\n }\n\n const osc = audioCtx.createOscillator();\n const gain = audioCtx.createGain();\n osc.type = \"triangle\";\n osc.frequency.value = 523.25;\n gain.gain.setValueAtTime(0.15, audioCtx.currentTime);\n gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.08);\n osc.connect(gain);\n gain.connect(audioCtx.destination);\n osc.start();\n osc.stop(audioCtx.currentTime + 0.08);\n };\n\n const filledBars = Math.round(\n (displayProgress / 100) * LOADING_PROGRESS_SEGMENT_COUNT,\n );\n if (filledBars > prevFilledBars.current) {\n playBeep();\n prevFilledBars.current = filledBars;\n }\n\n return undefined;\n }, [audioFeedback, displayProgress]);\n\n React.useEffect(() => {\n const ellipsisInterval = setInterval(() => {\n setEllipsisCount((count) => (count + 1) % 4);\n }, 400);\n return () => clearInterval(ellipsisInterval);\n }, []);\n\n React.useEffect(() => {\n const timeout = setTimeout(() => {\n setDisplayProgress(progress);\n }, 50);\n return () => clearTimeout(timeout);\n }, [progress]);\n\n const ellipsis = \".\".repeat(ellipsisCount);\n const cleanMessage = message ? message.replace(/\\.+$/, \"\") : \"\";\n const isLightMode = resolveIsLightMode(themeMode);\n const screenWidth =\n bounds.width || (typeof window === \"undefined\" ? 0 : window.innerWidth);\n const screenHeight =\n bounds.height || (typeof window === \"undefined\" ? 0 : window.innerHeight);\n\n return (\n <div\n ref={containerRef}\n className={`${styles.screen} ${fullscreen ? styles.fullscreen : styles.contained} ${\n isLightMode ? styles.lightTheme : styles.darkTheme\n }`.trim()}\n style={\n {\n \"--screen-height\": `${screenHeight}px`,\n \"--screen-width\": `${screenWidth}px`,\n } as React.CSSProperties\n }\n >\n {crosses.map((cross) => (\n <div\n key={cross.id}\n className={styles.crossContainer}\n style={\n {\n \"--cross-left\": `${cross.x}px`,\n \"--cross-delay\": `${cross.delay}ms`,\n \"--rotation\": `${cross.rotation}deg`,\n \"--ground\": `${cross.groundOffset}%`,\n \"--cross-scale\": String(cross.scale),\n \"--cross-opacity\": String(cross.opacity),\n } as React.CSSProperties\n }\n onAnimationEnd={(event) => {\n if (event.animationName === \"crossFall\") {\n event.currentTarget.classList.add(styles.crossLanded);\n }\n }}\n >\n <div className={styles.crossSvg}>\n <LightCrossIcon className={styles.crossShape} />\n </div>\n </div>\n ))}\n\n <div className={styles.centerStack}>\n {logo ? <div className={styles.logoWrap}>{logo}</div> : null}\n <div className={styles.title}>{title}</div>\n </div>\n\n <LoadingProgressBar progress={displayProgress} className={styles.progressRow} />\n\n <div className={styles.footerStack}>\n {footerBrand ? (\n <div className={styles.footerBrand}>{footerBrand}</div>\n ) : null}\n <div className={styles.footerMessage}>\n {cleanMessage}\n {ellipsis}\n </div>\n </div>\n </div>\n );\n}\n\nexport type LoadingStage = \"init\" | \"auth\" | \"agent\" | \"config\" | \"ready\";\n\nconst STAGE_PROGRESS: Record<LoadingStage, number> = {\n init: 0,\n auth: 25,\n agent: 50,\n config: 75,\n ready: 100,\n};\n\nconst STAGE_MESSAGES: Record<LoadingStage, string> = {\n init: \"Initializing...\",\n auth: \"Authenticating...\",\n agent: \"Loading agent...\",\n config: \"Loading configuration...\",\n ready: \"Preparing interface...\",\n};\n\nexport function useLoadingProgress(\n isLoading: boolean,\n _phase?: string,\n stage: LoadingStage = \"init\",\n) {\n const [progress, setProgress] = React.useState(0);\n const [currentMessage, setCurrentMessage] = React.useState(\"Initializing...\");\n const progressRef = React.useRef(0);\n\n React.useEffect(() => {\n progressRef.current = progress;\n }, [progress]);\n\n React.useEffect(() => {\n if (!isLoading) {\n setProgress(100);\n progressRef.current = 100;\n setCurrentMessage(\"Complete!\");\n return undefined;\n }\n\n const targetProgress = STAGE_PROGRESS[stage];\n const targetMessage = STAGE_MESSAGES[stage];\n setCurrentMessage(targetMessage);\n\n const currentProgressSnapshot = progressRef.current;\n const diff = targetProgress - currentProgressSnapshot;\n const steps = 20;\n const stepDuration = 100;\n let step = 0;\n\n const interval = setInterval(() => {\n step += 1;\n const easedStep = step / steps;\n const easedProgress = diff * easedStep;\n const nextProgress = Math.min(\n currentProgressSnapshot + easedProgress,\n targetProgress,\n );\n progressRef.current = nextProgress;\n setProgress(nextProgress);\n\n if (step >= steps) {\n clearInterval(interval);\n }\n }, stepDuration);\n\n return () => clearInterval(interval);\n }, [isLoading, stage]);\n\n return { progress, message: currentMessage };\n}\n"]}
|
|
@@ -97,11 +97,24 @@
|
|
|
97
97
|
z-index: 10;
|
|
98
98
|
}
|
|
99
99
|
|
|
100
|
-
.
|
|
100
|
+
.footerStack {
|
|
101
101
|
position: absolute;
|
|
102
102
|
right: 40px;
|
|
103
103
|
bottom: 40px;
|
|
104
104
|
z-index: 10;
|
|
105
|
+
display: flex;
|
|
106
|
+
flex-direction: column;
|
|
107
|
+
align-items: flex-end;
|
|
108
|
+
gap: 0.85rem;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.footerBrand {
|
|
112
|
+
display: flex;
|
|
113
|
+
align-items: center;
|
|
114
|
+
justify-content: flex-end;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.footerMessage {
|
|
105
118
|
opacity: 0.5;
|
|
106
119
|
font-family: var(--font-mono);
|
|
107
120
|
font-size: 14px;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export interface SignalTrailBackdropProps {
|
|
2
|
+
className?: string;
|
|
3
|
+
color?: string;
|
|
4
|
+
linesCount?: number;
|
|
5
|
+
segments?: number;
|
|
6
|
+
lineSpeed?: number;
|
|
7
|
+
signalDensity?: number;
|
|
8
|
+
trailLength?: number;
|
|
9
|
+
shapeSize?: number;
|
|
10
|
+
amplitude?: number;
|
|
11
|
+
tiltX?: number;
|
|
12
|
+
tiltY?: number;
|
|
13
|
+
baseOpacity?: number;
|
|
14
|
+
shapeOpacity?: number;
|
|
15
|
+
}
|
|
16
|
+
export declare function SignalTrailBackdrop({ className, color, linesCount, segments, lineSpeed, signalDensity, trailLength, shapeSize, amplitude, tiltX, tiltY, baseOpacity, shapeOpacity, }: SignalTrailBackdropProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export default SignalTrailBackdrop;
|
|
18
|
+
//# sourceMappingURL=SignalTrailBackdrop.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SignalTrailBackdrop.d.ts","sourceRoot":"","sources":["../../src/components/SignalTrailBackdrop.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,wBAAwB;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AA0ID,wBAAgB,mBAAmB,CAAC,EAClC,SAAc,EACd,KAAiB,EACjB,UAAgB,EAChB,QAAc,EACd,SAAgB,EAChB,aAAoB,EACpB,WAAkB,EAClB,SAAe,EACf,SAAgB,EAChB,KAAY,EACZ,KAAa,EACb,WAAkB,EAClB,YAAkB,GACnB,EAAE,wBAAwB,2CAqG1B;AAED,eAAe,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import * as THREE from "three";
|
|
4
|
+
import styles from "./SignalTrailBackdrop.module.css";
|
|
5
|
+
const VERTEX_SHADER = `
|
|
6
|
+
uniform float uTime;
|
|
7
|
+
uniform float uSize;
|
|
8
|
+
uniform float uAmplitude;
|
|
9
|
+
uniform float uRotZ;
|
|
10
|
+
uniform float uScaleX;
|
|
11
|
+
|
|
12
|
+
varying vec2 vUv;
|
|
13
|
+
varying float vZ;
|
|
14
|
+
varying float vLineIndex;
|
|
15
|
+
varying float vHeightNorm;
|
|
16
|
+
|
|
17
|
+
vec2 rotate2d(vec2 value, float angle) {
|
|
18
|
+
float s = sin(angle);
|
|
19
|
+
float c = cos(angle);
|
|
20
|
+
return mat2(c, -s, s, c) * value;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
float ellipseHeight(vec2 point, vec2 radii, float weight) {
|
|
24
|
+
vec2 normalized = point / radii;
|
|
25
|
+
float q = dot(normalized, normalized);
|
|
26
|
+
if (q >= 1.0) return 0.0;
|
|
27
|
+
return sqrt(1.0 - q) * weight;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
float getFigureHeight(vec2 point, float size) {
|
|
31
|
+
float head = ellipseHeight(point - vec2(0.0, size * 0.72), vec2(size * 0.16, size * 0.18), size * 0.34);
|
|
32
|
+
float shoulders = ellipseHeight(point - vec2(0.0, size * 0.34), vec2(size * 0.46, size * 0.14), size * 0.22);
|
|
33
|
+
float torso = ellipseHeight(point - vec2(0.0, size * 0.04), vec2(size * 0.28, size * 0.50), size * 0.64);
|
|
34
|
+
float hips = ellipseHeight(point - vec2(0.0, -size * 0.44), vec2(size * 0.24, size * 0.24), size * 0.36);
|
|
35
|
+
float legLeft = ellipseHeight(point - vec2(-size * 0.09, -size * 0.94), vec2(size * 0.11, size * 0.40), size * 0.22);
|
|
36
|
+
float legRight = ellipseHeight(point - vec2(size * 0.09, -size * 0.94), vec2(size * 0.11, size * 0.40), size * 0.22);
|
|
37
|
+
return max(max(max(head, shoulders), max(torso, hips)), max(legLeft, legRight));
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
void main() {
|
|
41
|
+
vUv = uv;
|
|
42
|
+
vLineIndex = uv.y;
|
|
43
|
+
|
|
44
|
+
vec3 positionNext = position;
|
|
45
|
+
vec2 point = positionNext.xy;
|
|
46
|
+
point.x /= uScaleX;
|
|
47
|
+
point = rotate2d(point, -uRotZ);
|
|
48
|
+
|
|
49
|
+
float height = getFigureHeight(point, uSize);
|
|
50
|
+
float transition = smoothstep(0.0, 0.08, abs(height) + 0.01);
|
|
51
|
+
positionNext.z += height * transition * uAmplitude;
|
|
52
|
+
|
|
53
|
+
vZ = positionNext.z;
|
|
54
|
+
vHeightNorm = smoothstep(0.0, uSize * 0.55 * uAmplitude, abs(height));
|
|
55
|
+
|
|
56
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(positionNext, 1.0);
|
|
57
|
+
}
|
|
58
|
+
`;
|
|
59
|
+
const FRAGMENT_SHADER = `
|
|
60
|
+
uniform float uTime;
|
|
61
|
+
uniform float uTrailLength;
|
|
62
|
+
uniform float uDensity;
|
|
63
|
+
uniform float uBaseOpacity;
|
|
64
|
+
uniform float uShapeOpacity;
|
|
65
|
+
uniform vec3 uColor;
|
|
66
|
+
|
|
67
|
+
varying vec2 vUv;
|
|
68
|
+
varying float vZ;
|
|
69
|
+
varying float vLineIndex;
|
|
70
|
+
varying float vHeightNorm;
|
|
71
|
+
|
|
72
|
+
float randomValue(vec2 value) {
|
|
73
|
+
return fract(sin(dot(value.xy, vec2(12.9898, 78.233))) * 43758.5453123);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
void main() {
|
|
77
|
+
float seed = floor(vLineIndex * 3000.0);
|
|
78
|
+
float speed = 0.55 + randomValue(vec2(seed, 11.0)) * 0.95;
|
|
79
|
+
float offset = randomValue(vec2(seed, 21.0)) * 24.0;
|
|
80
|
+
float visibility = step(1.0 - uDensity, randomValue(vec2(seed, 31.0)));
|
|
81
|
+
|
|
82
|
+
float baseStrength = mix(uBaseOpacity, uShapeOpacity, vHeightNorm);
|
|
83
|
+
vec3 finalColor = uColor * baseStrength;
|
|
84
|
+
|
|
85
|
+
if (visibility > 0.5) {
|
|
86
|
+
float phase = fract(vUv.x * 4.75 - uTime * speed + offset);
|
|
87
|
+
float trailStart = 1.0 - max(uTrailLength, 0.002);
|
|
88
|
+
float trail = smoothstep(trailStart, 1.0, phase);
|
|
89
|
+
float brightness = pow(trail, 12.0) * 2.8;
|
|
90
|
+
|
|
91
|
+
if (phase < trailStart) {
|
|
92
|
+
brightness = 0.0;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
finalColor += uColor * brightness;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
float contour = smoothstep(0.12, 1.0, abs(vZ)) * 0.18;
|
|
99
|
+
finalColor += uColor * contour;
|
|
100
|
+
|
|
101
|
+
float alpha = clamp(baseStrength * 0.75 + contour, 0.0, 1.0);
|
|
102
|
+
gl_FragColor = vec4(finalColor, alpha);
|
|
103
|
+
}
|
|
104
|
+
`;
|
|
105
|
+
function createGeometry(linesCount, segments) {
|
|
106
|
+
const width = 32;
|
|
107
|
+
const height = 24;
|
|
108
|
+
const geometry = new THREE.BufferGeometry();
|
|
109
|
+
const positions = [];
|
|
110
|
+
const uvs = [];
|
|
111
|
+
const indices = [];
|
|
112
|
+
for (let lineIndex = 0; lineIndex < linesCount; lineIndex += 1) {
|
|
113
|
+
const y = (lineIndex / (linesCount - 1)) * height - height / 2;
|
|
114
|
+
for (let segmentIndex = 0; segmentIndex <= segments; segmentIndex += 1) {
|
|
115
|
+
const x = (segmentIndex / segments) * width - width / 2;
|
|
116
|
+
positions.push(x, y, 0);
|
|
117
|
+
uvs.push(segmentIndex / segments, lineIndex / Math.max(linesCount - 1, 1));
|
|
118
|
+
if (segmentIndex < segments) {
|
|
119
|
+
const index = lineIndex * (segments + 1) + segmentIndex;
|
|
120
|
+
indices.push(index, index + 1);
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
geometry.setAttribute("position", new THREE.Float32BufferAttribute(positions, 3));
|
|
125
|
+
geometry.setAttribute("uv", new THREE.Float32BufferAttribute(uvs, 2));
|
|
126
|
+
geometry.setIndex(indices);
|
|
127
|
+
return geometry;
|
|
128
|
+
}
|
|
129
|
+
export function SignalTrailBackdrop({ className = "", color = "#7ae4ff", linesCount = 110, segments = 800, lineSpeed = 0.22, signalDensity = 0.24, trailLength = 0.16, shapeSize = 4.1, amplitude = 1.05, tiltX = -0.2, tiltY = -0.28, baseOpacity = 0.12, shapeOpacity = 0.2, }) {
|
|
130
|
+
const containerRef = React.useRef(null);
|
|
131
|
+
React.useEffect(() => {
|
|
132
|
+
const container = containerRef.current;
|
|
133
|
+
if (!container) {
|
|
134
|
+
return undefined;
|
|
135
|
+
}
|
|
136
|
+
const scene = new THREE.Scene();
|
|
137
|
+
const camera = new THREE.PerspectiveCamera(45, 1, 0.1, 100);
|
|
138
|
+
camera.position.set(-10, 0, 15);
|
|
139
|
+
const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
|
|
140
|
+
renderer.setClearColor(0x000000, 0);
|
|
141
|
+
renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));
|
|
142
|
+
renderer.domElement.className = styles.canvas;
|
|
143
|
+
container.appendChild(renderer.domElement);
|
|
144
|
+
const material = new THREE.ShaderMaterial({
|
|
145
|
+
vertexShader: VERTEX_SHADER,
|
|
146
|
+
fragmentShader: FRAGMENT_SHADER,
|
|
147
|
+
uniforms: {
|
|
148
|
+
uTime: { value: 0 },
|
|
149
|
+
uColor: { value: new THREE.Color(color) },
|
|
150
|
+
uSize: { value: shapeSize },
|
|
151
|
+
uAmplitude: { value: amplitude },
|
|
152
|
+
uRotZ: { value: 0 },
|
|
153
|
+
uScaleX: { value: 1.05 },
|
|
154
|
+
uTrailLength: { value: trailLength },
|
|
155
|
+
uDensity: { value: signalDensity },
|
|
156
|
+
uBaseOpacity: { value: baseOpacity },
|
|
157
|
+
uShapeOpacity: { value: shapeOpacity },
|
|
158
|
+
},
|
|
159
|
+
transparent: true,
|
|
160
|
+
depthTest: false,
|
|
161
|
+
blending: THREE.AdditiveBlending,
|
|
162
|
+
});
|
|
163
|
+
const mesh = new THREE.LineSegments(createGeometry(linesCount, segments), material);
|
|
164
|
+
mesh.rotation.x = tiltX;
|
|
165
|
+
mesh.rotation.y = tiltY;
|
|
166
|
+
scene.add(mesh);
|
|
167
|
+
const clock = new THREE.Clock();
|
|
168
|
+
let animationFrame = 0;
|
|
169
|
+
const resize = () => {
|
|
170
|
+
const width = Math.max(container.clientWidth, 1);
|
|
171
|
+
const height = Math.max(container.clientHeight, 1);
|
|
172
|
+
camera.aspect = width / height;
|
|
173
|
+
camera.updateProjectionMatrix();
|
|
174
|
+
renderer.setSize(width, height, false);
|
|
175
|
+
};
|
|
176
|
+
resize();
|
|
177
|
+
const resizeObserver = new ResizeObserver(resize);
|
|
178
|
+
resizeObserver.observe(container);
|
|
179
|
+
const animate = () => {
|
|
180
|
+
animationFrame = window.requestAnimationFrame(animate);
|
|
181
|
+
material.uniforms.uTime.value +=
|
|
182
|
+
clock.getDelta() * Math.max(lineSpeed, 0.01);
|
|
183
|
+
renderer.render(scene, camera);
|
|
184
|
+
};
|
|
185
|
+
animate();
|
|
186
|
+
return () => {
|
|
187
|
+
window.cancelAnimationFrame(animationFrame);
|
|
188
|
+
resizeObserver.disconnect();
|
|
189
|
+
mesh.geometry.dispose();
|
|
190
|
+
material.dispose();
|
|
191
|
+
renderer.dispose();
|
|
192
|
+
container.removeChild(renderer.domElement);
|
|
193
|
+
};
|
|
194
|
+
}, [
|
|
195
|
+
amplitude,
|
|
196
|
+
baseOpacity,
|
|
197
|
+
color,
|
|
198
|
+
lineSpeed,
|
|
199
|
+
linesCount,
|
|
200
|
+
segments,
|
|
201
|
+
shapeOpacity,
|
|
202
|
+
shapeSize,
|
|
203
|
+
signalDensity,
|
|
204
|
+
tiltX,
|
|
205
|
+
tiltY,
|
|
206
|
+
trailLength,
|
|
207
|
+
]);
|
|
208
|
+
return (_jsx("div", { ref: containerRef, className: `${styles.root} ${className}`.trim(), "aria-hidden": "true" }));
|
|
209
|
+
}
|
|
210
|
+
export default SignalTrailBackdrop;
|
|
211
|
+
//# sourceMappingURL=SignalTrailBackdrop.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SignalTrailBackdrop.js","sourceRoot":"","sources":["../../src/components/SignalTrailBackdrop.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport * as THREE from \"three\";\n\nimport styles from \"./SignalTrailBackdrop.module.css\";\n\nexport interface SignalTrailBackdropProps {\n className?: string;\n color?: string;\n linesCount?: number;\n segments?: number;\n lineSpeed?: number;\n signalDensity?: number;\n trailLength?: number;\n shapeSize?: number;\n amplitude?: number;\n tiltX?: number;\n tiltY?: number;\n baseOpacity?: number;\n shapeOpacity?: number;\n}\n\nconst VERTEX_SHADER = `\n uniform float uTime;\n uniform float uSize;\n uniform float uAmplitude;\n uniform float uRotZ;\n uniform float uScaleX;\n\n varying vec2 vUv;\n varying float vZ;\n varying float vLineIndex;\n varying float vHeightNorm;\n\n vec2 rotate2d(vec2 value, float angle) {\n float s = sin(angle);\n float c = cos(angle);\n return mat2(c, -s, s, c) * value;\n }\n\n float ellipseHeight(vec2 point, vec2 radii, float weight) {\n vec2 normalized = point / radii;\n float q = dot(normalized, normalized);\n if (q >= 1.0) return 0.0;\n return sqrt(1.0 - q) * weight;\n }\n\n float getFigureHeight(vec2 point, float size) {\n float head = ellipseHeight(point - vec2(0.0, size * 0.72), vec2(size * 0.16, size * 0.18), size * 0.34);\n float shoulders = ellipseHeight(point - vec2(0.0, size * 0.34), vec2(size * 0.46, size * 0.14), size * 0.22);\n float torso = ellipseHeight(point - vec2(0.0, size * 0.04), vec2(size * 0.28, size * 0.50), size * 0.64);\n float hips = ellipseHeight(point - vec2(0.0, -size * 0.44), vec2(size * 0.24, size * 0.24), size * 0.36);\n float legLeft = ellipseHeight(point - vec2(-size * 0.09, -size * 0.94), vec2(size * 0.11, size * 0.40), size * 0.22);\n float legRight = ellipseHeight(point - vec2(size * 0.09, -size * 0.94), vec2(size * 0.11, size * 0.40), size * 0.22);\n return max(max(max(head, shoulders), max(torso, hips)), max(legLeft, legRight));\n }\n\n void main() {\n vUv = uv;\n vLineIndex = uv.y;\n\n vec3 positionNext = position;\n vec2 point = positionNext.xy;\n point.x /= uScaleX;\n point = rotate2d(point, -uRotZ);\n\n float height = getFigureHeight(point, uSize);\n float transition = smoothstep(0.0, 0.08, abs(height) + 0.01);\n positionNext.z += height * transition * uAmplitude;\n\n vZ = positionNext.z;\n vHeightNorm = smoothstep(0.0, uSize * 0.55 * uAmplitude, abs(height));\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(positionNext, 1.0);\n }\n`;\n\nconst FRAGMENT_SHADER = `\n uniform float uTime;\n uniform float uTrailLength;\n uniform float uDensity;\n uniform float uBaseOpacity;\n uniform float uShapeOpacity;\n uniform vec3 uColor;\n\n varying vec2 vUv;\n varying float vZ;\n varying float vLineIndex;\n varying float vHeightNorm;\n\n float randomValue(vec2 value) {\n return fract(sin(dot(value.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n }\n\n void main() {\n float seed = floor(vLineIndex * 3000.0);\n float speed = 0.55 + randomValue(vec2(seed, 11.0)) * 0.95;\n float offset = randomValue(vec2(seed, 21.0)) * 24.0;\n float visibility = step(1.0 - uDensity, randomValue(vec2(seed, 31.0)));\n\n float baseStrength = mix(uBaseOpacity, uShapeOpacity, vHeightNorm);\n vec3 finalColor = uColor * baseStrength;\n\n if (visibility > 0.5) {\n float phase = fract(vUv.x * 4.75 - uTime * speed + offset);\n float trailStart = 1.0 - max(uTrailLength, 0.002);\n float trail = smoothstep(trailStart, 1.0, phase);\n float brightness = pow(trail, 12.0) * 2.8;\n\n if (phase < trailStart) {\n brightness = 0.0;\n }\n\n finalColor += uColor * brightness;\n }\n\n float contour = smoothstep(0.12, 1.0, abs(vZ)) * 0.18;\n finalColor += uColor * contour;\n\n float alpha = clamp(baseStrength * 0.75 + contour, 0.0, 1.0);\n gl_FragColor = vec4(finalColor, alpha);\n }\n`;\n\nfunction createGeometry(linesCount: number, segments: number): THREE.BufferGeometry {\n const width = 32;\n const height = 24;\n const geometry = new THREE.BufferGeometry();\n const positions: number[] = [];\n const uvs: number[] = [];\n const indices: number[] = [];\n\n for (let lineIndex = 0; lineIndex < linesCount; lineIndex += 1) {\n const y = (lineIndex / (linesCount - 1)) * height - height / 2;\n for (let segmentIndex = 0; segmentIndex <= segments; segmentIndex += 1) {\n const x = (segmentIndex / segments) * width - width / 2;\n positions.push(x, y, 0);\n uvs.push(\n segmentIndex / segments,\n lineIndex / Math.max(linesCount - 1, 1),\n );\n\n if (segmentIndex < segments) {\n const index = lineIndex * (segments + 1) + segmentIndex;\n indices.push(index, index + 1);\n }\n }\n }\n\n geometry.setAttribute(\n \"position\",\n new THREE.Float32BufferAttribute(positions, 3),\n );\n geometry.setAttribute(\"uv\", new THREE.Float32BufferAttribute(uvs, 2));\n geometry.setIndex(indices);\n return geometry;\n}\n\nexport function SignalTrailBackdrop({\n className = \"\",\n color = \"#7ae4ff\",\n linesCount = 110,\n segments = 800,\n lineSpeed = 0.22,\n signalDensity = 0.24,\n trailLength = 0.16,\n shapeSize = 4.1,\n amplitude = 1.05,\n tiltX = -0.2,\n tiltY = -0.28,\n baseOpacity = 0.12,\n shapeOpacity = 0.2,\n}: SignalTrailBackdropProps) {\n const containerRef = React.useRef<HTMLDivElement | null>(null);\n\n React.useEffect(() => {\n const container = containerRef.current;\n if (!container) {\n return undefined;\n }\n\n const scene = new THREE.Scene();\n const camera = new THREE.PerspectiveCamera(45, 1, 0.1, 100);\n camera.position.set(-10, 0, 15);\n\n const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });\n renderer.setClearColor(0x000000, 0);\n renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));\n renderer.domElement.className = styles.canvas;\n container.appendChild(renderer.domElement);\n\n const material = new THREE.ShaderMaterial({\n vertexShader: VERTEX_SHADER,\n fragmentShader: FRAGMENT_SHADER,\n uniforms: {\n uTime: { value: 0 },\n uColor: { value: new THREE.Color(color) },\n uSize: { value: shapeSize },\n uAmplitude: { value: amplitude },\n uRotZ: { value: 0 },\n uScaleX: { value: 1.05 },\n uTrailLength: { value: trailLength },\n uDensity: { value: signalDensity },\n uBaseOpacity: { value: baseOpacity },\n uShapeOpacity: { value: shapeOpacity },\n },\n transparent: true,\n depthTest: false,\n blending: THREE.AdditiveBlending,\n });\n\n const mesh = new THREE.LineSegments(\n createGeometry(linesCount, segments),\n material,\n );\n mesh.rotation.x = tiltX;\n mesh.rotation.y = tiltY;\n scene.add(mesh);\n\n const clock = new THREE.Clock();\n let animationFrame = 0;\n\n const resize = () => {\n const width = Math.max(container.clientWidth, 1);\n const height = Math.max(container.clientHeight, 1);\n camera.aspect = width / height;\n camera.updateProjectionMatrix();\n renderer.setSize(width, height, false);\n };\n\n resize();\n const resizeObserver = new ResizeObserver(resize);\n resizeObserver.observe(container);\n\n const animate = () => {\n animationFrame = window.requestAnimationFrame(animate);\n material.uniforms.uTime.value +=\n clock.getDelta() * Math.max(lineSpeed, 0.01);\n renderer.render(scene, camera);\n };\n\n animate();\n\n return () => {\n window.cancelAnimationFrame(animationFrame);\n resizeObserver.disconnect();\n mesh.geometry.dispose();\n material.dispose();\n renderer.dispose();\n container.removeChild(renderer.domElement);\n };\n }, [\n amplitude,\n baseOpacity,\n color,\n lineSpeed,\n linesCount,\n segments,\n shapeOpacity,\n shapeSize,\n signalDensity,\n tiltX,\n tiltY,\n trailLength,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={`${styles.root} ${className}`.trim()}\n aria-hidden=\"true\"\n />\n );\n}\n\nexport default SignalTrailBackdrop;\n"]}
|
package/dist/index.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export { CyberpunkSlider, type CyberpunkSliderProps, } from "./components/Cyberp
|
|
|
10
10
|
export { CyberpunkTextarea, type CyberpunkTextareaProps, } from "./components/CyberpunkTextarea.js";
|
|
11
11
|
export { CyberpunkTile, type CyberpunkTileProps } from "./components/CyberpunkTile.js";
|
|
12
12
|
export { CornerBracketCard, type CornerBracketCardProps } from "./components/CornerBracketCard.js";
|
|
13
|
+
export { DottedHaloCard, type DottedHaloCardProps, } from "./components/DottedHaloCard.js";
|
|
13
14
|
export { ErrorMessage, type ErrorMessageProps } from "./components/ErrorMessage.js";
|
|
14
15
|
export { HeartbeatIndicator, HeartbeatPulse, type HeartbeatIndicatorProps, type HeartbeatPulseProps, } from "./components/HeartbeatPulse.js";
|
|
15
16
|
export { HexagonGrid, type HexagonGridProps } from "./components/HexagonGrid.js";
|
|
@@ -25,6 +26,7 @@ export { QuickInfoCard, type QuickInfoCardProps, type QuickInfoItem, type Storag
|
|
|
25
26
|
export { RuntimeOrbitDiagram, type RuntimeOrbitDiagramProps, type RuntimeOrbitNode, } from "./components/RuntimeOrbitDiagram.js";
|
|
26
27
|
export { Section, type SectionProps } from "./components/Section.js";
|
|
27
28
|
export { SectionHeader, type SectionHeaderProps, } from "./components/SectionHeader.js";
|
|
29
|
+
export { SignalTrailBackdrop, type SignalTrailBackdropProps, } from "./components/SignalTrailBackdrop.js";
|
|
28
30
|
export { SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, } from "./components/SegmentedControl.js";
|
|
29
31
|
export { StatCard, type StatCardProps } from "./components/StatCard.js";
|
|
30
32
|
export { StatusMessage, type StatusMessageProps } from "./components/StatusMessage.js";
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -10,6 +10,7 @@ export { CyberpunkSlider, } from "./components/CyberpunkSlider.js";
|
|
|
10
10
|
export { CyberpunkTextarea, } from "./components/CyberpunkTextarea.js";
|
|
11
11
|
export { CyberpunkTile } from "./components/CyberpunkTile.js";
|
|
12
12
|
export { CornerBracketCard } from "./components/CornerBracketCard.js";
|
|
13
|
+
export { DottedHaloCard, } from "./components/DottedHaloCard.js";
|
|
13
14
|
export { ErrorMessage } from "./components/ErrorMessage.js";
|
|
14
15
|
export { HeartbeatIndicator, HeartbeatPulse, } from "./components/HeartbeatPulse.js";
|
|
15
16
|
export { HexagonGrid } from "./components/HexagonGrid.js";
|
|
@@ -25,6 +26,7 @@ export { QuickInfoCard, } from "./components/QuickInfoCard.js";
|
|
|
25
26
|
export { RuntimeOrbitDiagram, } from "./components/RuntimeOrbitDiagram.js";
|
|
26
27
|
export { Section } from "./components/Section.js";
|
|
27
28
|
export { SectionHeader, } from "./components/SectionHeader.js";
|
|
29
|
+
export { SignalTrailBackdrop, } from "./components/SignalTrailBackdrop.js";
|
|
28
30
|
export { SegmentedControl, } from "./components/SegmentedControl.js";
|
|
29
31
|
export { StatCard } from "./components/StatCard.js";
|
|
30
32
|
export { StatusMessage } from "./components/StatusMessage.js";
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,SAAS,EAAuB,MAAM,2BAA2B,CAAC;AAC3E,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAA+B,MAAM,mCAAmC,CAAC;AACnG,OAAO,EACL,cAAc,GAEf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,cAAc,EACd,mBAAmB,GAGpB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,eAAe,GAGhB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EACL,eAAe,GAEhB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EACL,iBAAiB,GAElB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,aAAa,EAA2B,MAAM,+BAA+B,CAAC;AACvF,OAAO,EAAE,iBAAiB,EAA+B,MAAM,mCAAmC,CAAC;AACnG,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,kBAAkB,EAClB,cAAc,GAGf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EACL,yBAAyB,GAE1B,MAAM,2CAA2C,CAAC;AACnD,OAAO,EACL,8BAA8B,EAC9B,kBAAkB,GAEnB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EACL,aAAa,EAGb,kBAAkB,GACnB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,aAAa,GAEd,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,YAAY,GAEb,MAAM,8BAA8B,CAAC;AACtC,OAAO,EACL,aAAa,GAId,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,mBAAmB,GAGpB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAqB,MAAM,yBAAyB,CAAC;AACrE,OAAO,EACL,aAAa,GAEd,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,gBAAgB,GAGjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,aAAa,EAA2B,MAAM,+BAA+B,CAAC;AACvF,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,WAAW,EAA8C,MAAM,6BAA6B,CAAC;AACtG,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,UAAU,EAAyC,MAAM,4BAA4B,CAAC","sourcesContent":["export { AvatarStage, type AvatarStageProps } from \"./components/AvatarStage.js\";\nexport { BlinkText, type BlinkTextProps } from \"./components/BlinkText.js\";\nexport { Button, type ButtonProps } from \"./components/Button.js\";\nexport { CopyButton, type CopyButtonProps } from \"./components/CopyButton.js\";\nexport { CyberpunkCheckbox, type CyberpunkCheckboxProps } from \"./components/CyberpunkCheckbox.js\";\nexport {\n CyberpunkInput,\n type CyberpunkInputProps,\n} from \"./components/CyberpunkInput.js\";\nexport {\n CyberpunkRadio,\n CyberpunkRadioGroup,\n type CyberpunkRadioGroupProps,\n type CyberpunkRadioProps,\n} from \"./components/CyberpunkRadio.js\";\nexport {\n CyberpunkSelect,\n type CyberpunkSelectOption,\n type CyberpunkSelectProps,\n} from \"./components/CyberpunkSelect.js\";\nexport {\n CyberpunkSlider,\n type CyberpunkSliderProps,\n} from \"./components/CyberpunkSlider.js\";\nexport {\n CyberpunkTextarea,\n type CyberpunkTextareaProps,\n} from \"./components/CyberpunkTextarea.js\";\nexport { CyberpunkTile, type CyberpunkTileProps } from \"./components/CyberpunkTile.js\";\nexport { CornerBracketCard, type CornerBracketCardProps } from \"./components/CornerBracketCard.js\";\nexport { ErrorMessage, type ErrorMessageProps } from \"./components/ErrorMessage.js\";\nexport {\n HeartbeatIndicator,\n HeartbeatPulse,\n type HeartbeatIndicatorProps,\n type HeartbeatPulseProps,\n} from \"./components/HeartbeatPulse.js\";\nexport { HexagonGrid, type HexagonGridProps } from \"./components/HexagonGrid.js\";\nexport {\n LoadingOverlayCrystalline,\n type LoadingOverlayCrystallineProps,\n} from \"./components/LoadingOverlayCrystalline.js\";\nexport {\n LOADING_PROGRESS_SEGMENT_COUNT,\n LoadingProgressBar,\n type LoadingProgressBarProps,\n} from \"./components/LoadingProgressBar.js\";\nexport {\n LoadingScreen,\n type LoadingScreenProps,\n type LoadingStage,\n useLoadingProgress,\n} from \"./components/LoadingScreen.js\";\nexport { MarqueeStrip, type MarqueeStripProps } from \"./components/MarqueeStrip.js\";\nexport {\n OverlayButton,\n type OverlayButtonProps,\n} from \"./components/OverlayButton.js\";\nexport { PageHeader, type PageHeaderProps } from \"./components/PageHeader.js\";\nexport { PageTemplate, type PageTemplateProps } from \"./components/PageTemplate.js\";\nexport {\n PixelTooltip,\n type PixelTooltipProps,\n} from \"./components/PixelTooltip.js\";\nexport {\n QuickInfoCard,\n type QuickInfoCardProps,\n type QuickInfoItem,\n type StorageProgress,\n} from \"./components/QuickInfoCard.js\";\nexport {\n RuntimeOrbitDiagram,\n type RuntimeOrbitDiagramProps,\n type RuntimeOrbitNode,\n} from \"./components/RuntimeOrbitDiagram.js\";\nexport { Section, type SectionProps } from \"./components/Section.js\";\nexport {\n SectionHeader,\n type SectionHeaderProps,\n} from \"./components/SectionHeader.js\";\nexport {\n SegmentedControl,\n type SegmentedControlOption,\n type SegmentedControlProps,\n} from \"./components/SegmentedControl.js\";\nexport { StatCard, type StatCardProps } from \"./components/StatCard.js\";\nexport { StatusMessage, type StatusMessageProps } from \"./components/StatusMessage.js\";\nexport { StrokedText, type StrokedTextProps } from \"./components/StrokedText.js\";\nexport { TabbedPanel, type TabbedPanelProps, type TabbedPanelTab } from \"./components/TabbedPanel.js\";\nexport { ThemedCard, type ThemedCardProps } from \"./components/ThemedCard.js\";\nexport { ThemeToggle, type ThemeToggleProps } from \"./components/ThemeToggle.js\";\nexport { WidgetCard, type WidgetCardProps, type WidgetSize } from \"./components/WidgetCard.js\";\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,SAAS,EAAuB,MAAM,2BAA2B,CAAC;AAC3E,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAA+B,MAAM,mCAAmC,CAAC;AACnG,OAAO,EACL,cAAc,GAEf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,cAAc,EACd,mBAAmB,GAGpB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,eAAe,GAGhB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EACL,eAAe,GAEhB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EACL,iBAAiB,GAElB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,aAAa,EAA2B,MAAM,+BAA+B,CAAC;AACvF,OAAO,EAAE,iBAAiB,EAA+B,MAAM,mCAAmC,CAAC;AACnG,OAAO,EACL,cAAc,GAEf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,kBAAkB,EAClB,cAAc,GAGf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EACL,yBAAyB,GAE1B,MAAM,2CAA2C,CAAC;AACnD,OAAO,EACL,8BAA8B,EAC9B,kBAAkB,GAEnB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EACL,aAAa,EAGb,kBAAkB,GACnB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,aAAa,GAEd,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,YAAY,EAA0B,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,YAAY,GAEb,MAAM,8BAA8B,CAAC;AACtC,OAAO,EACL,aAAa,GAId,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,mBAAmB,GAGpB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAqB,MAAM,yBAAyB,CAAC;AACrE,OAAO,EACL,aAAa,GAEd,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,mBAAmB,GAEpB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EACL,gBAAgB,GAGjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,aAAa,EAA2B,MAAM,+BAA+B,CAAC;AACvF,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,WAAW,EAA8C,MAAM,6BAA6B,CAAC;AACtG,OAAO,EAAE,UAAU,EAAwB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,WAAW,EAAyB,MAAM,6BAA6B,CAAC;AACjF,OAAO,EAAE,UAAU,EAAyC,MAAM,4BAA4B,CAAC","sourcesContent":["export { AvatarStage, type AvatarStageProps } from \"./components/AvatarStage.js\";\nexport { BlinkText, type BlinkTextProps } from \"./components/BlinkText.js\";\nexport { Button, type ButtonProps } from \"./components/Button.js\";\nexport { CopyButton, type CopyButtonProps } from \"./components/CopyButton.js\";\nexport { CyberpunkCheckbox, type CyberpunkCheckboxProps } from \"./components/CyberpunkCheckbox.js\";\nexport {\n CyberpunkInput,\n type CyberpunkInputProps,\n} from \"./components/CyberpunkInput.js\";\nexport {\n CyberpunkRadio,\n CyberpunkRadioGroup,\n type CyberpunkRadioGroupProps,\n type CyberpunkRadioProps,\n} from \"./components/CyberpunkRadio.js\";\nexport {\n CyberpunkSelect,\n type CyberpunkSelectOption,\n type CyberpunkSelectProps,\n} from \"./components/CyberpunkSelect.js\";\nexport {\n CyberpunkSlider,\n type CyberpunkSliderProps,\n} from \"./components/CyberpunkSlider.js\";\nexport {\n CyberpunkTextarea,\n type CyberpunkTextareaProps,\n} from \"./components/CyberpunkTextarea.js\";\nexport { CyberpunkTile, type CyberpunkTileProps } from \"./components/CyberpunkTile.js\";\nexport { CornerBracketCard, type CornerBracketCardProps } from \"./components/CornerBracketCard.js\";\nexport {\n DottedHaloCard,\n type DottedHaloCardProps,\n} from \"./components/DottedHaloCard.js\";\nexport { ErrorMessage, type ErrorMessageProps } from \"./components/ErrorMessage.js\";\nexport {\n HeartbeatIndicator,\n HeartbeatPulse,\n type HeartbeatIndicatorProps,\n type HeartbeatPulseProps,\n} from \"./components/HeartbeatPulse.js\";\nexport { HexagonGrid, type HexagonGridProps } from \"./components/HexagonGrid.js\";\nexport {\n LoadingOverlayCrystalline,\n type LoadingOverlayCrystallineProps,\n} from \"./components/LoadingOverlayCrystalline.js\";\nexport {\n LOADING_PROGRESS_SEGMENT_COUNT,\n LoadingProgressBar,\n type LoadingProgressBarProps,\n} from \"./components/LoadingProgressBar.js\";\nexport {\n LoadingScreen,\n type LoadingScreenProps,\n type LoadingStage,\n useLoadingProgress,\n} from \"./components/LoadingScreen.js\";\nexport { MarqueeStrip, type MarqueeStripProps } from \"./components/MarqueeStrip.js\";\nexport {\n OverlayButton,\n type OverlayButtonProps,\n} from \"./components/OverlayButton.js\";\nexport { PageHeader, type PageHeaderProps } from \"./components/PageHeader.js\";\nexport { PageTemplate, type PageTemplateProps } from \"./components/PageTemplate.js\";\nexport {\n PixelTooltip,\n type PixelTooltipProps,\n} from \"./components/PixelTooltip.js\";\nexport {\n QuickInfoCard,\n type QuickInfoCardProps,\n type QuickInfoItem,\n type StorageProgress,\n} from \"./components/QuickInfoCard.js\";\nexport {\n RuntimeOrbitDiagram,\n type RuntimeOrbitDiagramProps,\n type RuntimeOrbitNode,\n} from \"./components/RuntimeOrbitDiagram.js\";\nexport { Section, type SectionProps } from \"./components/Section.js\";\nexport {\n SectionHeader,\n type SectionHeaderProps,\n} from \"./components/SectionHeader.js\";\nexport {\n SignalTrailBackdrop,\n type SignalTrailBackdropProps,\n} from \"./components/SignalTrailBackdrop.js\";\nexport {\n SegmentedControl,\n type SegmentedControlOption,\n type SegmentedControlProps,\n} from \"./components/SegmentedControl.js\";\nexport { StatCard, type StatCardProps } from \"./components/StatCard.js\";\nexport { StatusMessage, type StatusMessageProps } from \"./components/StatusMessage.js\";\nexport { StrokedText, type StrokedTextProps } from \"./components/StrokedText.js\";\nexport { TabbedPanel, type TabbedPanelProps, type TabbedPanelTab } from \"./components/TabbedPanel.js\";\nexport { ThemedCard, type ThemedCardProps } from \"./components/ThemedCard.js\";\nexport { ThemeToggle, type ThemeToggleProps } from \"./components/ThemeToggle.js\";\nexport { WidgetCard, type WidgetCardProps, type WidgetSize } from \"./components/WidgetCard.js\";\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@steez-ui/ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.10",
|
|
4
4
|
"description": "React primitives authored with CSS modules for Steez UI.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -12,8 +12,9 @@
|
|
|
12
12
|
"react-dom": ">=18"
|
|
13
13
|
},
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@steez-ui/icons": "^0.1.
|
|
16
|
-
"@steez-ui/theme": "^0.1.
|
|
15
|
+
"@steez-ui/icons": "^0.1.10",
|
|
16
|
+
"@steez-ui/theme": "^0.1.10",
|
|
17
|
+
"three": "^0.179.1"
|
|
17
18
|
},
|
|
18
19
|
"exports": {
|
|
19
20
|
".": {
|