twombly 0.4.0 → 0.4.1

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/dist/cli.js CHANGED
@@ -33,6 +33,7 @@ var FORBIDDEN = [
33
33
  { test: /\.map$/i, code: "SOURCE_MAP", what: "a source map", fix: "Source maps publish original source code. Turn them off in the build or delete the .map files." },
34
34
  { test: /(^|\/)\.next\/(server|cache)(\/|$)/, code: "SERVER_CODE", what: "server output from Next.js", fix: 'Use a static export (output: "export") and add its output folder.' },
35
35
  { test: /\.(php|rb|py|go|rs|java|cs|sh|bash|zsh|exe|dll|so|dylib)$/i, code: "SERVER_CODE", what: "server or native code" },
36
+ { test: /\.(zip|7z|rar|tar|tgz|dmg|pkg|mpkg|msi|msix|appx|apk|aab|ipa|jar|deb|rpm|appimage|iso|bat|cmd|ps1|vbs|scr|xpi|crx)$/i, code: "DOWNLOAD_FILE", what: "an installer or archive", fix: "Frames show a design; they don't hand out files. Delete it from the folder." },
36
37
  { test: /(^|\/)(package(-lock)?\.json|pnpm-lock\.yaml|yarn\.lock|bun\.lockb?|tsconfig\.json|wrangler\.(toml|jsonc?)|dockerfile|docker-compose\.ya?ml)$/i, code: "PROJECT_FILE", what: "a project file", fix: "That looks like a project folder. Build first and add the output folder only." }
37
38
  ];
38
39
  function checkPath(path) {
@@ -198,7 +199,7 @@ function frameCsp(ancestors) {
198
199
  `frame-ancestors ${ancestors.join(" ")}`
199
200
  ].join("; ");
200
201
  }
201
- var FRAME_SANDBOX = "allow-scripts allow-same-origin allow-forms allow-modals allow-pointer-lock allow-downloads";
202
+ var FRAME_SANDBOX = "allow-scripts allow-same-origin allow-forms allow-modals allow-pointer-lock";
202
203
  var FRAME_BRIDGE_PATH = "/__twombly/bridge.js";
203
204
  var FRAME_POSTER_PATH = "/__twombly/poster.png";
204
205
  var FRAME_BRIDGE_JS = `(() => {
@@ -244,6 +245,9 @@ function cleanStroke(input) {
244
245
  }
245
246
  var WORKING_MS = 3 * 6e4;
246
247
  var WORKING_TAIL_MS = 3e4;
248
+ function cleanSettings(value) {
249
+ return { invertScroll: value?.invertScroll === true, theme: value?.theme === "light" || value?.theme === "dark" ? value.theme : void 0 };
250
+ }
247
251
  var COLORS = ["#F24822", "#FF7A00", "#14AE5C", "#0D99FF", "#9747FF", "#E5277B", "#00B5B8", "#7B61FF"];
248
252
  function colorOf(id) {
249
253
  let h = 0;
@@ -593,7 +597,7 @@ var checkedAt = 0;
593
597
  function interfaceFolders() {
594
598
  if (OVERRIDE) return [OVERRIDE];
595
599
  const folder = (released) => join5(STORE, String(released));
596
- return [...saved.filter((released) => released > 1793918977725).map(folder), BUNDLED, ...saved.filter((released) => released <= 1793918977725).map(folder)];
600
+ return [...saved.filter((released) => released > 1793935262296).map(folder), BUNDLED, ...saved.filter((released) => released <= 1793935262296).map(folder)];
597
601
  }
598
602
  function unpack(body) {
599
603
  const { payload, signature } = JSON.parse(body);
@@ -627,7 +631,7 @@ async function check() {
627
631
  const release = unpack(body);
628
632
  if (!release) return;
629
633
  etag = response.headers.get("etag") || "";
630
- if (release.released > Math.max(saved[0] ?? 0, 1793918977725)) await install(release.released, release.files);
634
+ if (release.released > Math.max(saved[0] ?? 0, 1793935262296)) await install(release.released, release.files);
631
635
  }
632
636
  function startCheck() {
633
637
  if (checking) return;
@@ -783,8 +787,7 @@ import { mkdir as mkdir5, readFile as readFile4, rename as rename3, writeFile as
783
787
  import { join as join7 } from "node:path";
784
788
  var FILE = join7(HOME, "settings.json");
785
789
  async function readSettings() {
786
- const saved2 = await readFile4(FILE, "utf8").then(JSON.parse).catch(() => null);
787
- return { invertScroll: saved2?.invertScroll === true, theme: saved2?.theme === "light" || saved2?.theme === "dark" ? saved2.theme : void 0 };
790
+ return cleanSettings(await readFile4(FILE, "utf8").then(JSON.parse).catch(() => null));
788
791
  }
789
792
  async function writeSettings(settings2) {
790
793
  await mkdir5(HOME, { recursive: true });
@@ -845,7 +848,7 @@ async function flush() {
845
848
  save();
846
849
  if (!usageOn() || !Object.values(counts).some(Boolean)) return;
847
850
  const canvases2 = Object.keys(await readRegistry()).length;
848
- await post("/api/usage", { install: state.install, day, version: "0.4.0", platform: process.platform, counts: { ...counts, canvases: canvases2 } }).catch(() => {
851
+ await post("/api/usage", { install: state.install, day, version: "0.4.1", platform: process.platform, counts: { ...counts, canvases: canvases2 } }).catch(() => {
849
852
  });
850
853
  }
851
854
  async function startUsage() {
@@ -863,7 +866,7 @@ function reportError(error, source = "tool") {
863
866
  source,
864
867
  mode: "local",
865
868
  install: state?.install,
866
- version: "0.4.0",
869
+ version: "0.4.1",
867
870
  type: String(error.type || "Error").slice(0, 80),
868
871
  message: scrub(String(error.message), 500),
869
872
  stack: scrub(String(error.stack || ""), 4e3)
@@ -898,6 +901,7 @@ function loginUrl() {
898
901
  function setCredential(next) {
899
902
  credential = next;
900
903
  for (const canvas of canvases.values()) canvas.event({ t: "auth", me: next?.me || null });
904
+ if (next) syncSettings();
901
905
  }
902
906
  async function edge(path, init = {}) {
903
907
  if (!credential) throw new Failure(401, "Sign in first");
@@ -914,6 +918,23 @@ async function edge(path, init = {}) {
914
918
  if (!response.ok) throw new Failure(response.status, data.error || `The server answered ${response.status}`, data.problems ? { problems: data.problems } : void 0);
915
919
  return data;
916
920
  }
921
+ async function useSettings(next) {
922
+ if (JSON.stringify(next) === JSON.stringify(settings)) return;
923
+ settings = next;
924
+ await writeSettings(settings);
925
+ for (const canvas of canvases.values()) canvas.event({ t: "settings", settings });
926
+ }
927
+ var settingsChosen = 0;
928
+ function syncSettings() {
929
+ if (!credential) return;
930
+ const chosen = settingsChosen;
931
+ edge("/api/settings").then(({ settings: account }) => {
932
+ if (chosen !== settingsChosen) return;
933
+ if (account) return useSettings(account);
934
+ if (settings.invertScroll || settings.theme) return edge("/api/settings", { method: "POST", body: JSON.stringify(settings) });
935
+ }).catch(() => {
936
+ });
937
+ }
917
938
  var STROKE_UPLOAD = 40;
918
939
  var THREAD_UPLOAD_CHARS = 5e5;
919
940
  var THREAD_ID = /^[a-z0-9]{8,32}$/;
@@ -1674,7 +1695,7 @@ async function servePreview(response, canvasId, frameId) {
1674
1695
  async function route(request, response) {
1675
1696
  const url = new URL(request.url || "/", DAEMON_ORIGIN);
1676
1697
  const path = url.pathname, method = request.method || "GET";
1677
- if (path === "/health") return reply(response, 200, { ok: true, build: "0.4.0+1793918977725", api: TOOL_API, pid: process.pid });
1698
+ if (path === "/health") return reply(response, 200, { ok: true, build: "0.4.1+1793935262296", api: TOOL_API, pid: process.pid });
1678
1699
  if (path.startsWith("/cli/") && method === "POST") return reply(response, 200, await command(path.slice(5), await readBody(request)));
1679
1700
  if (path === "/auth/callback" && method === "GET") {
1680
1701
  const code = url.searchParams.get("code"), state2 = url.searchParams.get("state");
@@ -1696,6 +1717,7 @@ async function route(request, response) {
1696
1717
  const canvas = id ? await canvasById(id).catch(() => null) : null;
1697
1718
  if (canvas?.data.remote) await canvas.pull().catch(() => {
1698
1719
  });
1720
+ syncSettings();
1699
1721
  const body = {
1700
1722
  mode: "local",
1701
1723
  me: credential?.me || null,
@@ -1707,10 +1729,13 @@ async function route(request, response) {
1707
1729
  if (path === "/api/login" && method === "POST") return reply(response, 200, await command("login", {}));
1708
1730
  if (path === "/api/settings" && method === "POST") {
1709
1731
  const { invertScroll, theme } = await readBody(request);
1710
- if (typeof invertScroll === "boolean") settings = { ...settings, invertScroll };
1711
- if (theme === "light" || theme === "dark") settings = { ...settings, theme };
1712
- await writeSettings(settings);
1713
- for (const canvas of canvases.values()) canvas.event({ t: "settings", settings });
1732
+ let next = settings;
1733
+ settingsChosen++;
1734
+ if (typeof invertScroll === "boolean") next = { ...next, invertScroll };
1735
+ if (theme === "light" || theme === "dark") next = { ...next, theme };
1736
+ await useSettings(next);
1737
+ if (credential) await edge("/api/settings", { method: "POST", body: JSON.stringify(next) }).catch(() => {
1738
+ });
1714
1739
  return reply(response, 200, settings);
1715
1740
  }
1716
1741
  const match = path.match(/^\/api\/canvases\/([a-z0-9]+)\/(ticket|share|unshare)$/);
@@ -1752,6 +1777,7 @@ function touch() {
1752
1777
  async function runDaemon() {
1753
1778
  credential = await readCredential();
1754
1779
  settings = await readSettings();
1780
+ syncSettings();
1755
1781
  const server = createServer2(async (request, response) => {
1756
1782
  if (!trusted(request)) {
1757
1783
  response.writeHead(403, JSON_HEADERS);
@@ -2000,7 +2026,7 @@ async function runGates(folder, options) {
2000
2026
  }
2001
2027
 
2002
2028
  // src/cli.ts
2003
- var HELP = `twombly ${"0.4.0"}: put design explorations on a shared canvas.
2029
+ var HELP = `twombly ${"0.4.1"}: put design explorations on a shared canvas.
2004
2030
 
2005
2031
  init [--name "Name"] [--no-open] create or join this folder's canvas
2006
2032
  init --canvas "Name" [--no-open] create or join a separate named canvas in this folder
@@ -2102,12 +2128,12 @@ async function health() {
2102
2128
  var builtAt = (build) => Number(build.split("+")[1]) || 0;
2103
2129
  var sleep = (ms) => new Promise((done) => setTimeout(done, ms));
2104
2130
  var IDLE_WAIT_MS = 6e4;
2105
- var usable = (running) => !!running && (running.build === "0.4.0+1793918977725" || running.api === TOOL_API && builtAt(running.build) > builtAt("0.4.0+1793918977725"));
2131
+ var usable = (running) => !!running && (running.build === "0.4.1+1793935262296" || running.api === TOOL_API && builtAt(running.build) > builtAt("0.4.1+1793935262296"));
2106
2132
  async function ensureDaemon() {
2107
2133
  const running = await health();
2108
2134
  if (usable(running)) return;
2109
2135
  if (running) {
2110
- if (builtAt(running.build) > builtAt("0.4.0+1793918977725")) fail("A newer twombly is running on this machine. Run this with twombly@latest.");
2136
+ if (builtAt(running.build) > builtAt("0.4.1+1793935262296")) fail("A newer twombly is running on this machine. Run this with twombly@latest.");
2111
2137
  let stopped = false;
2112
2138
  for (const end = Date.now() + IDLE_WAIT_MS; !stopped && Date.now() < end; ) {
2113
2139
  const answer = await fetch(`${DAEMON_ORIGIN}/cli/stop`, { method: "POST", body: '{"ifIdle":true}' }).then((response) => response.json()).catch(() => ({ stopped: true }));
@@ -2328,7 +2354,7 @@ async function main() {
2328
2354
  return;
2329
2355
  case "--version":
2330
2356
  case "version":
2331
- process.stdout.write("0.4.0\n");
2357
+ process.stdout.write("0.4.1\n");
2332
2358
  return;
2333
2359
  case "guide":
2334
2360
  process.stdout.write(SKILL_default);
@@ -0,0 +1 @@
1
+ body:has(.landing){text-wrap:balance;overflow:auto}.landing{isolation:isolate;min-height:100%;color:var(--text);--text:oklch(0% 0 0);--muted:oklch(0% 0 0/.6);--solid:oklch(0% 0 0);--on-solid:oklch(100% 0 0);--surface-2:oklch(100% 0 0/.45);--surface-pressed:oklch(100% 0 0/.7);--signal:#06f;flex-direction:column;font-size:15px;line-height:1.4;display:flex;position:relative;overflow-x:clip}.landing[data-dark]{--text:oklch(98.5% 0 0);--muted:oklch(98.5% 0 0/.72);--solid:oklch(100% 0 0);--on-solid:oklch(0% 0 0);--surface-2:oklch(100% 0 0/.12);--surface-pressed:oklch(100% 0 0/.2)}.window-light{z-index:-1;background:linear-gradient(90deg, var(--lit), var(--shade));pointer-events:none;width:100vw;height:100lvh;position:fixed;top:0;left:0}.landing a:not(.wordmark){text-decoration:none}@property --text{syntax:"<color>";inherits:true;initial-value:#0000}@property --muted{syntax:"<color>";inherits:true;initial-value:#0000}@property --solid{syntax:"<color>";inherits:true;initial-value:#0000}@property --on-solid{syntax:"<color>";inherits:true;initial-value:#0000}@property --surface{syntax:"<color>";inherits:true;initial-value:#0000}@property --surface-2{syntax:"<color>";inherits:true;initial-value:#0000}@property --surface-hover{syntax:"<color>";inherits:true;initial-value:#0000}@property --surface-pressed{syntax:"<color>";inherits:true;initial-value:#0000}@property --secondary{syntax:"<color>";inherits:true;initial-value:#0000}@property --canvas{syntax:"<color>";inherits:true;initial-value:#0000}@property --line{syntax:"<color>";inherits:true;initial-value:#0000}@property --line-subtle{syntax:"<color>";inherits:true;initial-value:#0000}@property --signal-soft{syntax:"<color>";inherits:true;initial-value:#0000}@property --shadow-near{syntax:"<color>";inherits:true;initial-value:#0000}@property --shadow-far{syntax:"<color>";inherits:true;initial-value:#0000}@property --live{syntax:"<color>";inherits:true;initial-value:#0000}@property --lit{syntax:"<color>";inherits:true;initial-value:#0000}@property --shade{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-bar{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-chat{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-control{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-composer{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-ink{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-ink-2{syntax:"<color>";inherits:true;initial-value:#0000}@property --ls-ink-3{syntax:"<color>";inherits:true;initial-value:#0000}@property --icon-muted{syntax:"<number>";inherits:true;initial-value:1}@property --icon-secondary{syntax:"<number>";inherits:true;initial-value:1}.landing{--shift:var(--shift-ms) var(--shift-ease);transition:--text var(--shift), --muted var(--shift), --solid var(--shift), --on-solid var(--shift), --surface-2 var(--shift), --surface-pressed var(--shift)}.landing[data-glide]{transition:--text var(--shift), --muted var(--shift), --solid var(--shift), --on-solid var(--shift), --surface-2 var(--shift), --surface-pressed var(--shift), --lit var(--shift), --shade var(--shift)}.landing[data-shifting] :is(.landing-sign-in,.tool,.canvas-name){transition-duration:0s}.landing[data-shifting] .landing-button{transition-duration:.16s,0s,0s}.landing-nav{justify-content:space-between;align-items:center;width:100%;max-width:1248px;margin:0 auto;padding:20px 24px;display:flex}.landing-nav .wordmark svg{height:18px}.landing-nav-end{align-items:center;gap:8px;display:flex}.landing-sign-in{border-radius:var(--pill);background:var(--surface-2);align-items:center;height:40px;padding:0 16px;font-weight:500;transition:background-color .2s;display:inline-flex}.landing-sign-in:hover{background:var(--surface-pressed)}.landing-hero{text-align:center;flex-direction:column;flex:1;align-items:center;width:100%;max-width:1248px;margin:0 auto;padding:72px 24px 0;display:flex}.landing-title{perspective:1200px;letter-spacing:-.02em;margin:0;font-size:clamp(40px,6.6vw,76px);font-weight:700;line-height:.95}.landing-word{animation:landing-word var(--word-ms) var(--word-ease) var(--delay) both;display:inline-block}.landing-actions{animation:landing-rise var(--rise-ms) var(--rise-ease) .55s both;justify-content:center;margin-top:32px;display:flex}.landing-slot{transform-origin:50% 0;animation:landing-window var(--rise-ms) var(--rise-ease) .65s both}.landing-magnet{flex:none;display:inline-flex}.landing-cta{border-radius:var(--pill);will-change:transform;flex:none}.landing-button{border-radius:var(--pill);background:var(--solid);height:52px;color:var(--on-solid);white-space:nowrap;cursor:pointer;justify-content:center;align-items:center;padding:0 26px;font-size:15px;font-weight:500;transition:transform .16s ease-out;display:inline-flex}.landing-button:active{transform:scale(.97)}.landing-swap{justify-items:center;display:inline-grid}.landing-swap>span{grid-area:1/1;transition:opacity .15s}.landing-swap>[data-shown=false]{opacity:0}.landing-foot{width:100%;max-width:1248px;color:var(--muted);justify-content:space-between;gap:24px;margin:0 auto;padding:48px 24px 32px;font-size:13px;display:flex}.landing-foot nav{gap:24px;display:flex}.landing-foot a:hover{color:var(--text)}.ld-shell{background:var(--canvas);text-align:left;text-wrap:initial;flex:none;width:100%;margin-top:64px;font-size:13px;line-height:18px;animation:2.6s cubic-bezier(.22,1,.36,1) both ld-settle,1.6s ease-out both ld-focus,.9s .5s both ld-fill;position:relative;overflow:hidden;box-shadow:0 40px 100px -40px #00000024,0 12px 32px -16px #0000000f}.ld-draw{z-index:2;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.ld-draw path{fill:none;stroke:var(--line);stroke-width:1px;stroke-dasharray:1;stroke-dashoffset:1px;animation:1.4s cubic-bezier(.65,0,.35,1) both ld-trace}.ld-stage{transform-origin:0 0;position:absolute;top:0;left:0;overflow:hidden}.ld-scene{position:absolute;inset:0}.ld-rise{animation:.9s cubic-bezier(.2,.8,.2,1) 1.1s both ld-rise}.ld-stage .shell{position:absolute}.ld-stage .top-left{max-width:none;padding-left:3px;top:6px;left:6px}.ld-stage .top-right{top:6px;right:6px}.ld-stage .toolbar{top:6px;left:50%;transform:translate(-50%)}.ld-stage .toolbar-clip{width:auto}.ld-stage .zoom{bottom:6px;right:6px}.ld-stage .canvas-name{line-height:32px}.ld-stage .zoom-value{justify-content:center;align-items:center;display:inline-flex}.ld-stage .tool-slider{top:0}.ld-stage .tool[aria-pressed=true]{color:var(--signal);position:relative}.ld-stage .tool[aria-pressed=true] svg{opacity:1}.ld-stage .face-button{transform-origin:50%;display:inline-flex}.ld-copied{align-items:center;gap:4px;display:inline-flex}.share-split[data-copied] .ld-copy,.share-split:not([data-copied]) .ld-copied{display:none}.ld-strokes{pointer-events:none;position:absolute;inset:0}.ld-pin{z-index:3;transform-origin:0 100%}.ld-cursors{pointer-events:none;z-index:6;position:absolute;inset:0}.ld-cursor{opacity:0;will-change:transform;transition:none;top:-4px;left:-3px}.ld-cursor svg{transform-origin:3px 4px}.ld-frame{transform-origin:50%}.ld-design{color:#111;background:#f3f2ef;flex-direction:column;gap:10px;height:100%;padding:22px;font:13px/18px -apple-system,system-ui,sans-serif;display:flex;overflow:hidden}.ld-design h1{margin:0 0 2px;font-size:14px;font-weight:600;line-height:20px}.ld-n{background:#fff;border-radius:12px;flex:none;align-items:flex-start;gap:12px;padding:11px 12px;display:flex;box-shadow:0 1px 2px #00000014}.ld-av{color:#fff;border-radius:50%;flex:none;place-items:center;width:32px;height:32px;font-size:11px;font-weight:600;display:grid}.ld-t{font-weight:600}.ld-d{color:#666}.ld-w{color:#999;flex:none;margin-left:auto;font-size:11px}.ld-design[data-v="2"]{color:#eee;background:#101114}.ld-design[data-v="2"] .ld-n{box-shadow:none;background:#1b1d22}.ld-design[data-v="2"] .ld-d{color:#9aa}.ld-design[data-v="3"]{background:#fff;gap:0}.ld-design[data-v="3"] .ld-n{box-shadow:none;background:0 0;border-bottom:1px solid #ddd;border-radius:0;padding:11px 0}.ld-design[data-v="4"]{gap:6px;padding:16px}.ld-design[data-v="4"] .ld-n{border-radius:8px;align-items:center;padding:10px}.ld-design[data-v="4"] .ld-av{width:22px;height:22px;font-size:9px}.ld-design[data-v="4"] .ld-d{display:none}.ld-design[data-v="5"]{background:linear-gradient(160deg,#ffe8d6,#f6d6ff)}.ld-design[data-v="5"] .ld-n{box-shadow:none;background:#fff9;border-radius:18px}.ld-design[data-v="6"]{background:#fffbe9}.ld-design[data-v="6"] .ld-n{border:1.5px solid #111;border-radius:6px;box-shadow:3px 3px #111}.ld-design[data-v="6"] .ld-av{color:#111;border:1.5px solid #111;border-radius:6px;background:0 0!important}@keyframes landing-word{0%{opacity:0;transform:translateY(45%)rotateX(-40deg)}}@keyframes landing-window{0%{opacity:0;transform:translateY(48px)scale(.96)}}@keyframes landing-rise{0%{opacity:0;filter:blur(12px);transform:translateY(10px)}}@keyframes ld-settle{0%{transform:translateY(40px) scale(var(--ld-from,1.3))}}@keyframes ld-focus{0%{filter:blur(6px);opacity:0}40%{opacity:1}}@keyframes ld-fill{0%{background-color:#0000;box-shadow:0 40px 100px -40px #0000,0 12px 32px -16px #0000}}@keyframes ld-trace{to{stroke-dashoffset:0}}@keyframes ld-rise{0%{opacity:0}}@media (width<=640px){.landing-nav{padding:12px 16px}.landing-hero{padding:40px 16px 0}.landing-foot{padding-inline:16px}.landing-title br{display:none}.ld-shell{margin-top:40px}}@media (prefers-reduced-motion:reduce){.landing{--shift:0s}.landing-word,.landing-actions,.landing-slot,.ld-shell,.ld-rise{animation:none}.ld-draw path{stroke-dashoffset:0;animation:none}}.landing .landing-button{position:relative}.landing-states{place-items:center;display:grid}.landing-state{white-space:nowrap;grid-area:1/1;align-items:center;gap:10px;display:inline-flex}.landing-marks{align-items:center;gap:6px;display:inline-flex}.landing-marks svg{width:16px;height:16px;display:block}.landing-sr{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.landing-marks svg,.landing-label,.landing-check,.landing-done{transition:opacity .18s ease-out,translate .32s cubic-bezier(.34,1.56,.64,1),scale .32s cubic-bezier(.34,1.56,.64,1),filter .18s ease-out}.landing-marks svg:nth-child(2){transition-delay:45ms}.landing-label{transition-delay:70ms;transition-timing-function:ease-out,cubic-bezier(.22,1,.36,1),ease-out,ease-out}.landing-button[data-copied] .landing-marks svg,.landing-button[data-copied] .landing-label{opacity:0;filter:blur(3px);transition:opacity .12s ease-in,translate .16s ease-in,scale .16s ease-in,filter .12s ease-in;translate:0 -10px;scale:.8}.landing-button[data-copied] .landing-marks svg:first-child{transition-delay:40ms}.landing-button[data-copied] .landing-label{translate:0 -8px;scale:1}.landing-check,.landing-done{opacity:0;filter:blur(3px);transition-duration:.12s;translate:0 10px}.landing-button[data-copied] .landing-check,.landing-button[data-copied] .landing-done{opacity:1;filter:blur();transition:opacity .18s ease-out 70ms,translate .36s cubic-bezier(.34,1.56,.64,1) 70ms,filter .18s ease-out 70ms;translate:0}.landing-check{fill:none;stroke:currentColor;stroke-width:2.25px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px;display:block}.landing-check path{stroke-dasharray:1;stroke-dashoffset:1px;transition:stroke-dashoffset .1s ease-in}.landing-button[data-copied] .landing-check path{stroke-dashoffset:0;transition:stroke-dashoffset .3s cubic-bezier(.65,0,.35,1) .12s}.landing-button[data-copied]{animation:.48s cubic-bezier(.22,1,.36,1) landing-copied}@keyframes landing-copied{0%{scale:.97}45%{scale:1.035}to{scale:1}}@media (prefers-reduced-motion:reduce){.landing-marks svg,.landing-label,.landing-check,.landing-done,.landing-button[data-copied] .landing-marks svg,.landing-button[data-copied] .landing-label,.landing-button[data-copied] .landing-check,.landing-button[data-copied] .landing-done{filter:none;transition:opacity .15s;translate:none;scale:none}.landing-check path,.landing-button[data-copied] .landing-check path{stroke-dashoffset:0;transition:none}.landing-button[data-copied]{animation:none}}.landing-body{max-width:560px;color:var(--muted);animation:landing-rise var(--rise-ms) var(--rise-ease) .5s both;margin:24px 0 0;font-size:18px;line-height:1.45}@media (width<=640px){.landing-body{margin-top:16px;font-size:16px}}.landing-body{text-wrap:balance}@media (prefers-reduced-motion:reduce){.landing-body{animation:none}}.landing .landing-button{transition:transform .16s ease-out,background-color .2s ease-out,color .2s ease-out}.landing .landing-button[data-copied]{color:#fff;background:#06f}@media (width>=769px){.landing{--h:max(100svh, 850px);height:var(--h)}.landing-nav{padding-block:clamp(10px, calc(var(--h) * .022), 20px);flex:none}.landing-hero{min-height:0;padding-top:clamp(4px, calc(var(--h) * .024), 72px);justify-content:center}.landing-title{font-size:clamp(40px, min(6.6vw, calc(var(--h) * .062)), 76px)}.landing-body{margin-top:clamp(10px, calc(var(--h) * .02), 24px)}.landing-actions{margin-top:clamp(14px, calc(var(--h) * .024), 32px)}.landing-foot{padding-block:clamp(6px, calc(var(--h) * .011), 32px);flex:none}.landing-slot{width:100%;min-height:456px;max-height:760px;margin-top:clamp(8px, calc(var(--h) * .018), 40px);flex:1 1 0;justify-content:center;display:flex;container-type:size}.landing-slot .ls{flex:none;width:min(100cqw,157.895cqh);margin:0}}@media (width<=768px){.landing-nav{padding-block:12px}.landing-hero{padding-top:48px}.landing-body{margin-top:16px}.landing-actions{margin-top:28px}.landing-slot{width:100%;margin-top:48px}.landing-slot .ls{margin:0}.landing-foot{padding-block:48px 32px}}.light-switch{--open:196px;--end:40px;flex:none;width:40px;height:40px;position:relative}.light-pill{border-radius:var(--pill);background:var(--surface-2);align-items:center;width:40px;height:40px;transition:width .32s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;top:0;right:0;overflow:hidden}.light-switch[data-open] .light-pill{width:var(--open)}.light-toggle{width:var(--end);border-radius:var(--pill);height:40px;color:var(--text);cursor:pointer;background:0 0;border:0;place-items:center;padding:0;display:grid;position:absolute;right:0}.light-toggle:focus-visible,.light-track:focus-visible{outline:2px solid var(--signal);outline-offset:-2px}.light-track{left:18px;right:var(--end);cursor:pointer;touch-action:none;opacity:0;transition:opacity .16s ease-out;position:absolute;top:0;bottom:0}.light-switch[data-open] .light-track{opacity:1;transition-delay:.1s}.light-track:before{content:"";background:linear-gradient(90deg,#f6c7a8,#fff 40%,#fbe3c4 62%,#e9a27c 75%,#8f7fa6 85%,#2a3755);border-radius:2px;height:4px;margin-top:-2px;position:absolute;top:50%;left:0;right:0;box-shadow:inset 0 0 0 .5px #00000024}.light-dot{top:50%;left:calc(var(--x) * 100%);background:var(--text);width:14px;height:14px;box-shadow:0 0 0 2px var(--lit), 0 1px 4px #0003;border-radius:50%;margin:-7px 0 0 -7px;transition:left .3s cubic-bezier(.2,.8,.2,1);position:absolute}.light-switch[data-dragging] .light-dot{transition:none}.light-switch[data-dragging] .light-track{cursor:grabbing}.light-glyph{width:18px;height:18px;overflow:visible}.light-glyph g,.light-glyph circle,.light-glyph path{transform-box:view-box;transform-origin:12px 12px;transition:transform var(--shift), opacity var(--shift)}@media (prefers-reduced-motion:reduce){.light-pill,.light-dot,.light-glyph *{transition:none}}
@@ -0,0 +1,111 @@
1
+ const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/LandingStage-u99Kd45d.js","assets/rolldown-runtime-WkwZ5CU-.js","assets/agentPrompt-osLcSdHt.js","assets/index-Dk5KUFe_.js","assets/index-DHQst-JO.css","assets/LandingStage-BcivO6Eh.css"])))=>i.map(i=>d[i]);
2
+ import{n as e}from"./rolldown-runtime-WkwZ5CU-.js";import{Ct as t,D as n,E as r,Lt as i,N as a,Rt as o,S as s,St as c,T as l,i as u,j as d,o as f,p,s as m,t as h,u as g,w as ee}from"./agentPrompt-osLcSdHt.js";import{n as _,r as v,t as y}from"./index-Dk5KUFe_.js";var b=e(o(),1),x=a();function te(){return(0,x.jsxs)(`span`,{className:`landing-marks`,"aria-hidden":`true`,children:[(0,x.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,children:(0,x.jsx)(`path`,{d:`m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z`})}),(0,x.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,children:(0,x.jsx)(`path`,{d:`M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z`})})]})}var S=`twombly:show-copied`,C=.41960295031576633,w=.15,T=.2765523188064277,E=.5783555327868779,D=-44*Math.PI/180,O={x:Math.sin(D),y:-Math.cos(D)},k=(e,t=0,n=1)=>Math.min(n,Math.max(t,e)),A=(e,t,n)=>({x:e.x+t.x*n,y:e.y+t.y*n}),j=e=>Math.hypot(e.x,e.y),M=e=>{let t=j(e);return t<.001?{x:1,y:0}:{x:e.x/t,y:e.y/t}},N=(e,t,n,r)=>({start:e,outgoing:t,incoming:n,end:r});function P(e,t){let n=1-t;return{x:n**3*e.start.x+3*n*n*t*e.outgoing.x+3*n*t*t*e.incoming.x+t**3*e.end.x,y:n**3*e.start.y+3*n*n*t*e.outgoing.y+3*n*t*t*e.incoming.y+t**3*e.end.y}}function F(e,t){let n=k(t),r=Math.min(e.curves.length-1,Math.floor(n*e.curves.length)),i=n===1?1:n*e.curves.length-r,a=e.curves[r],o=1-i,s={x:3*(o*o*(a.outgoing.x-a.start.x)+2*o*i*(a.incoming.x-a.outgoing.x)+i*i*(a.end.x-a.incoming.x))*e.curves.length,y:3*(o*o*(a.outgoing.y-a.start.y)+2*o*i*(a.incoming.y-a.outgoing.y)+i*i*(a.end.y-a.incoming.y))*e.curves.length},c=M(s),l=1-(1-k((n-.99)/.01))**3,u=M({x:c.x*(1-l)+O.x*l,y:c.y*(1-l)+O.y*l});return{point:P(a,i),derivative:s,heading:u}}function I(e,t){let n=e=>!t||e.x>=t.x+20&&e.x<t.x+t.width-20&&e.y>=t.y+20&&e.y<t.y+t.height-20,r=e[0].start,i,a=0,o=0,s=0,c=0,l=n(r);for(let t of e)for(let e=1;e<=24;e++){let u=P(t,e/24),d=u.x-r.x,f=u.y-r.y,p=Math.hypot(d,f);if(a+=p,l&&=n(u),p>.01){let e=Math.atan2(f,d);if(i!==void 0){let t=Math.atan2(Math.sin(e-i),Math.cos(e-i));o+=t*t,s+=Math.abs(t),c=Math.max(c,Math.abs(t))}i=e}r=u}return{length:a,turnEnergy:o,totalTurn:s,sharpestTurn:c,inBounds:l}}function L(e,t,n){let r={x:t.x-e.x,y:t.y-e.y},i=j(r),a=M(r),o=[];if(i<=10)o.push([N(e,A(e,r,1/3),A(e,r,2/3),t)]);else{let n=Math.min(i*C,i*.9,640),r=Math.min(i*w,i*.9,640),s=A(e,O,n),c=A(t,O,-r);o.push([N(e,s,c,t)]),o.push([N(e,A(e,O,n*.65),A(t,O,-r*.65),t)]);let l=O.x*a.y-O.y*a.x<0?-1:1,u={x:a.y*l,y:-a.x*l},d=A({x:(e.x+t.x)/2,y:(e.y+t.y)/2},O,n*.16),f=Math.min(i*T,520),p=Math.min(i*E,440);for(let n of[.55,.8,1.05])for(let r of[.65,1,1.35])for(let i of[1,-1]){let l=A(d,u,f*n*i);o.push([N(e,s,A(l,a,-p*r),l),N(l,A(l,a,p*r),c,t)])}}let s=k((-.08-O.x*a.x-O.y*a.y)/.92);return o.map(e=>{let t=I(e,n),r=Math.max(0,t.length/Math.max(1,i)-1),a=e.length>1,o=t.length+320*r+140*t.turnEnergy+180*t.sharpestTurn+18*t.totalTurn+(a?45:0)+90*s,c=k(.42*k(r/.55)+.38*k(t.totalTurn/(1.4*Math.PI))+.2*k(t.turnEnergy/1.25))*.12,l=k((a?.9:1)*.9*((a?.04:0)+.28*s+.22*k((t.length-180)/760)+.42+c),.12,2.2);return{curves:e,...t,score:o,response:l}})}function ne(e,t,n){let r=L(e,t,n),i=r.filter(e=>e.inBounds);return(i.length?i:r).reduce((e,t)=>t.score<e.score?t:e)}var R=(e=0)=>({value:e,velocity:0}),re=Math.atan2(O.y,O.x)*180/Math.PI,ie=1600;function z(e,t,n,r,i){let a=2*Math.PI/n,o=r*a,s=a*Math.sqrt(1-r*r),c=e.value-t,l=(e.velocity+o*c)/s,u=Math.cos(s*i),d=Math.sin(s*i),f=Math.exp(-o*i);e.value=t+f*(c*u+l*d),e.velocity=f*(-o*(c*u+l*d)+s*(-c*d+l*u))}function B(e,t){return e+Math.atan2(Math.sin((t-e)*Math.PI/180),Math.cos((t-e)*Math.PI/180))*180/Math.PI}var ae=class{position;velocity={x:0,y:0};kind=`idle`;target;path;pathScale=1;progress=R();horizontal;vertical;axis=R();baseRotation=R();lean=R();stretch=R();heading=0;constructor(e){this.position={...e},this.target={...e},this.horizontal=R(e.x),this.vertical=R(e.y)}moveTo(e,t,n=!1){if(!Number.isFinite(e.x)||!Number.isFinite(e.y))return;if(this.target={...e},n){this.jumpTo(e);return}this.pathScale=Math.max(.001,t.z);let r=Math.hypot(e.x-this.position.x,e.y-this.position.y)*this.pathScale;if(r<.01&&Math.hypot(this.velocity.x,this.velocity.y)*this.pathScale<12){this.jumpTo(e);return}if(this.horizontal={value:this.position.x,velocity:this.velocity.x},this.vertical={value:this.position.y,velocity:this.velocity.y},this.kind=r<=196?`scoot`:`curve`,this.kind===`scoot`){this.path=void 0;return}let i=e=>({x:e.x*this.pathScale,y:e.y*this.pathScale});this.path=ne(i(this.position),i(e),{x:-t.x,y:-t.y,width:t.width,height:t.height});let{derivative:a}=F(this.path,0),o=a.x**2+a.y**2,s=o?(this.velocity.x*a.x+this.velocity.y*a.y)*this.pathScale/o:0;this.progress={value:0,velocity:k(s,0,5/this.path.response)}}jumpTo(e){Object.assign(this.position,e),this.target={...e},this.velocity.x=this.velocity.y=0,this.horizontal=R(e.x),this.vertical=R(e.y),this.axis=R(),this.baseRotation=R(),this.lean=R(),this.stretch=R(),this.progress=R(),this.path=void 0,this.heading=0,this.kind=`idle`}translateBy(e,t){if(Number.isFinite(e)&&Number.isFinite(t)&&(e||t)&&(this.position.x+=e,this.position.y+=t,this.target.x+=e,this.target.y+=t,this.horizontal.value+=e,this.vertical.value+=t,this.path)){let n=n=>({x:n.x+e*this.pathScale,y:n.y+t*this.pathScale});this.path.curves=this.path.curves.map(e=>({start:n(e.start),outgoing:n(e.outgoing),incoming:n(e.incoming),end:n(e.end)}))}}advance(e,t=this.pathScale){if(!(e>0)||!Number.isFinite(e)||this.kind===`idle`&&this.deformationSettled())return!1;if(this.kind===`scoot`)z(this.horizontal,this.target.x,.24,.84,e),z(this.vertical,this.target.y,.24,.84,e),this.position.x=this.horizontal.value,this.position.y=this.vertical.value,this.velocity.x=this.horizontal.velocity,this.velocity.y=this.vertical.velocity;else if(this.kind===`curve`&&this.path){z(this.progress,1,this.path.response,.9,e);let{point:t,derivative:n,heading:r}=F(this.path,this.progress.value);this.position.x=t.x/this.pathScale,this.position.y=t.y/this.pathScale;let i=this.progress.value>=1?0:this.progress.velocity/this.pathScale;this.velocity.x=n.x*i,this.velocity.y=n.y*i,this.heading=B(this.heading,Math.atan2(r.y,r.x)*180/Math.PI-re)}let n=Math.hypot(this.velocity.x,this.velocity.y)*t,r=this.kind===`scoot`?k(n/ie):0,i=n>12?Math.atan2(this.velocity.y,this.velocity.x)*180/Math.PI:this.axis.value;z(this.axis,B(this.axis.value,i),.07,.82,e),z(this.baseRotation,this.kind===`curve`?this.heading:B(this.baseRotation.value,0),.09,.86,e),z(this.stretch,r,.095,.72,e);let a=n>12?k(this.velocity.x*t/n*76*r,-76,76):0;return z(this.lean,a,.055,.76,e),Math.hypot(this.target.x-this.position.x,this.target.y-this.position.y)*t<.05&&n<12&&(this.kind!==`curve`||Math.abs(this.progress.value-1)<.001)&&(Object.assign(this.position,this.target),this.velocity.x=this.velocity.y=0,this.kind=`idle`,this.path=void 0),this.kind===`idle`&&this.deformationSettled()&&(this.baseRotation=R(),this.lean=R(),this.stretch=R()),!0}deformationSettled(){let e=B(0,this.baseRotation.value);return Math.abs(e)<.01&&Math.abs(this.baseRotation.velocity)<.1&&Math.abs(this.lean.value)<.01&&Math.abs(this.lean.velocity)<.1&&Math.abs(this.stretch.value)<1e-4&&Math.abs(this.stretch.velocity)<.001}get bodyTransform(){let e=k(this.stretch.value,0,1);return`rotate(${this.baseRotation.value+this.lean.value}deg) rotate(${this.axis.value}deg) scale(${1+.38*e}, ${1-.18*e}) rotate(${-this.axis.value}deg)`}},oe={wide:{width:1280,height:720,columns:3},narrow:{width:640,height:760,columns:2}},V=440,H=340,U={top:84,right:64,bottom:64,left:64},W=[1,2,3,4,5,6],G=[{name:`Avery Kim`,color:`#3b82f6`},{name:`Mo Rivera`,color:`#10b981`},{name:`Jules Sato`,color:`#f59e0b`}],se=[[`AK`,`#3b82f6`,`Avery Kim`,`commented on Checkout redesign`,`2m`],[`MR`,`#10b981`,`Mo Rivera`,`approved your pull request`,`14m`],[`JS`,`#f59e0b`,`Jules Sato`,`shared Q4 roadmap with you`,`1h`],[`TN`,`#ef4444`,`Tess Novak`,`mentioned you in Launch plan`,`3h`],[`RO`,`#8b5cf6`,`Rae Okafor`,`invited you to Brand review`,`5h`],[`LB`,`#0ea5e9`,`Lee Brandt`,`resolved your comment`,`1d`],[`NH`,`#ec4899`,`Noor Haddad`,`added you to Onboarding`,`2d`],[`IC`,`#14b8a6`,`Ines Costa`,`replied to your comment`,`2d`],[`DV`,`#f97316`,`Dev Varma`,`shared Pricing page with you`,`3d`]],ce=`#e5484d`,le=5,ue=t(.45,.28),de=t(1.1,0),fe=t(.3,0),K=(e,t)=>({x:e%t*496,y:Math.floor(e/t)*412});function pe(e,t,n){let r=.5,i=e-.5,a=t-.5;return`M ${r+n} ${r} H ${i-n} A ${n} ${n} 0 0 1 ${i} ${r+n} V ${a-n} A ${n} ${n} 0 0 1 ${i-n} ${a} H ${r+n} A ${n} ${n} 0 0 1 ${r} ${a-n} V ${r+n} A ${n} ${n} 0 0 1 ${r+n} ${r} Z`}function me({version:e,rows:t=4}){return(0,x.jsxs)(`div`,{className:`ld-design`,"data-v":e,children:[(0,x.jsx)(`h1`,{children:`Notifications`}),se.slice(0,t).map(([e,t,n,r,i])=>(0,x.jsxs)(`div`,{className:`ld-n`,children:[(0,x.jsx)(`span`,{className:`ld-av`,style:{background:t},children:e}),(0,x.jsxs)(`div`,{children:[(0,x.jsx)(`div`,{className:`ld-t`,children:n}),(0,x.jsx)(`div`,{className:`ld-d`,children:r})]}),(0,x.jsx)(`span`,{className:`ld-w`,children:i})]},n))]})}function q({color:e,name:t,id:n}){return(0,x.jsxs)(`div`,{className:`cursor ld-cursor`,"data-cursor":n,style:{color:e},children:[(0,x.jsx)(`svg`,{width:`22`,height:`22`,viewBox:`0 0 24 24`,children:(0,x.jsx)(`path`,{d:u,fill:`currentColor`,stroke:`#fff`,strokeWidth:`1.5`,strokeLinejoin:`round`})}),t&&(0,x.jsx)(`span`,{className:`cursor-label`,style:{background:e},children:t})]})}function he({id:e,person:t,text:n}){let{name:r,color:i}=G[t];return(0,x.jsxs)(`div`,{className:`comment-pin ld-pin`,"data-pin":e,children:[(0,x.jsx)(d,{name:r,picture:null,color:i}),(0,x.jsxs)(`span`,{className:`comment-pin-preview`,children:[(0,x.jsxs)(`span`,{className:`comment-pin-head`,children:[(0,x.jsx)(`b`,{children:r}),` `,(0,x.jsx)(`span`,{className:`muted`,children:`now`})]}),(0,x.jsx)(`span`,{className:`comment-pin-text`,children:n})]})]})}function ge(e,n){let r=oe[n],i=t=>e.querySelector(t),a=i(`.ld-world`),o=i(`[data-zoom]`),s=i(`.ld-scene`),c=i(`.faces`),l=i(`.share-button`),u=i(`.share-sharing`),d=i(`.share-sharing i`),f=i(`.share-split`),p=i(`.ld-strokes path`),m=[...e.querySelectorAll(`.ld-frame`)],h=[...c.children],g={a:i(`[data-pin="a"]`),b:i(`[data-pin="b"]`)},ee={width:r.width,height:r.height,x:0,y:0,z:1},_=new Set,y=0,b=0,x=!1,te=e=>{y=requestAnimationFrame(te);let t=Math.min(50,e-b);b=e;for(let e of _)e(t)||_.delete(e)},S=e=>{e!==x&&(x=e,cancelAnimationFrame(y),e&&(b=performance.now(),y=requestAnimationFrame(te)))},C=e=>new Promise(t=>{let n=e;_.add(e=>(n-=e,n>0||(t(),!1)))}),w=(e,t)=>new Promise(n=>{let r=0;_.add(i=>(r+=i,r<e.ms?(t(e.at(r)),!0):(t(1),n(),!1)))}),T=(e,t)=>w({ms:e,at:t=>t/e,css:``},t),E={x:0,y:0,z:1},D=e=>{E=e,a.style.transform=`translate(${e.x}px, ${e.y}px) scale(${e.z})`,a.style.setProperty(`--inv`,String(1/e.z)),a.style.setProperty(`--zoom`,String(e.z)),o.textContent=`${Math.round(e.z*100)}%`},O=e=>{let t=W.slice(0,e).map((e,t)=>K(t,r.columns)),n=Math.max(...t.map(e=>e.x))+V,i=Math.max(...t.map(e=>e.y))+H,a={width:r.width-U.left-U.right,height:r.height-U.top-U.bottom},o=Math.min(1,a.width/n,a.height/i);return{z:o,x:U.left+(a.width-n*o)/2,y:U.top+(a.height-i*o)/2}},k=e=>{let t=E;return w(de,n=>D({x:t.x+(e.x-t.x)*n,y:t.y+(e.y-t.y)*n,z:t.z+(e.z-t.z)*n}))},A=(e,t,n,i=O(W.length))=>{let a=K(e-1,r.columns);return{x:i.x+(a.x+V*t)*i.z,y:i.y+(a.y+H*n)*i.z}},j=e=>{let t=i(`[data-cursor="${e}"]`),n=t.querySelector(`svg`),r=new ae({x:0,y:0}),a=()=>{t.style.transform=`translate3d(${r.position.x}px, ${r.position.y}px, 0)`,n.style.transform=r.bodyTransform};return _.add(e=>(r.advance(e/1e3,1),a(),!0)),{el:t,place(e){r.jumpTo(e),t.style.opacity=`1`,a()},hide(){t.style.opacity=`0`},move(e){return r.moveTo(e,ee),new Promise(e=>_.add(()=>r.kind!==`idle`||(e(),!1)))}}},M=j(`you`),N=[j(`0`),j(`1`),j(`2`)],P=e=>w(ue,t=>{e.style.opacity=String(Math.min(1,t*1.6)),e.style.scale=String(.6+.4*t)}),F=async e=>{await T(90,t=>{e.style.scale=String(1-.05*t)}),await T(120,t=>{e.style.scale=String(.95+.05*t)})},I=e=>(c.style.display=``,e.style.display=``,P(e)),L=(e,t)=>{e.style.left=`${t.x}px`,e.style.top=`${t.y}px`},ne=()=>{let e=A(3,.5,.5),t=O(W.length),n=V*t.z*.56,r=H*t.z*.58;return Array.from({length:110},(t,i)=>{let a=i/109,o=-2.4+a*1.85*Math.PI*2,s=1+.06*Math.sin(a*9)+a*.05;return[e.x+Math.cos(o)*n*s+a*8,e.y+Math.sin(o)*r*s-a*6,.5]})},R=()=>{for(let e of m)e.style.opacity=`0`,e.style.scale=`0.6`;for(let e of h)e.style.opacity=`0`,e.style.scale=`0.6`,e.style.display=`none`;c.style.display=`none`;for(let e of Object.values(g))e.style.opacity=`0`,e.style.scale=`0.6`,e.classList.remove(`expanded`);for(let e of[M,...N])e.hide();l.style.display=``,u.style.display=`none`,f.style.display=`none`,p.setAttribute(`d`,``),s.style.opacity=`1`,c.style.opacity=`1`,D(O(1))},re=()=>{for(let e of[...m,...h,...Object.values(g)])e.style.opacity=`1`,e.style.scale=`1`;for(let e of h)e.style.display=``;c.style.display=``,L(g.a,A(2,.72,.34)),L(g.b,A(5,.3,.36)),g.b.classList.add(`expanded`),D(O(W.length)),p.setAttribute(`d`,v({points:ne(),size:le})),N[0].place(A(2,.34,.8)),N[1].place(A(5,.86,.7)),N[2].place(A(3,.92,.9))},ie=async()=>{let n=1500;for(;;){R(),await C(n),n=500;for(let e=0;e<m.length;e++)P(m[e]),e&&k(O(e+1)),await C(e?720:1e3);await C(700),M.place({x:r.width*.74,y:r.height+30});let i=e.getBoundingClientRect(),a=i.width/r.width;await M.move((e=>{let t=e.getBoundingClientRect();return{x:(t.left+t.width/2-i.left)/a,y:(t.top+t.height/2-i.top)/a}})(l)),await F(l),l.style.display=`none`,u.style.display=``,d.style.width=`6%`,await w(t(1,0),e=>{d.style.width=`${6+94*e}%`}),u.style.display=`none`,f.style.display=``,f.dataset.copied=``,M.move(A(1,.8,1.08)),await C(1e3),delete f.dataset.copied,N[0].place({x:-30,y:r.height*.42}),I(h[2]),await N[0].move(A(2,.72,.34)),N[1].place({x:r.width*.3,y:r.height+30}),I(h[1]),L(g.a,A(2,.72,.34)),P(g.a),N[0].move(A(2,.34,.8)),await N[1].move(A(5,.3,.36)),L(g.b,A(5,.3,.36)),await P(g.b),await C(250),g.b.classList.add(`expanded`),N[1].move(A(5,.86,.7));let o=ne();N[2].place({x:r.width+30,y:r.height*.3}),I(h[0]),await N[2].move({x:o[0][0],y:o[0][1]}),await T(1500,e=>{let t=Math.max(2,Math.ceil(e*o.length));p.setAttribute(`d`,v({points:o.slice(0,t),size:le}));let[n,r]=o[t-1];N[2].place({x:n,y:r})}),await C(400),N[2].move(A(3,.92,.9)),await C(1400),N[0].move(A(1,.5,.42)),await C(1100),N[1].move(A(4,.72,.62)),await C(2200),await T(420,e=>{s.style.opacity=String(1-e),c.style.opacity=String(1-e)}),await w(fe,()=>{})}};if(matchMedia(`(prefers-reduced-motion: reduce)`).matches)return R(),re(),()=>{};ie();let z=new IntersectionObserver(([e])=>S(e.isIntersecting));return z.observe(e),()=>{z.disconnect(),S(!1),_.clear()}}function _e(){let e=(0,b.useRef)(null),t=(0,b.useRef)(null),[i,a]=(0,b.useState)(0),o=i&&i<720?`narrow`:`wide`,c=oe[o];(0,b.useLayoutEffect)(()=>{let t=new ResizeObserver(([e])=>a(e.contentRect.width));return t.observe(e.current),()=>t.disconnect()},[]),(0,b.useEffect)(()=>{if(i)return ge(t.current,o)},[o,i>0]);let u=i/c.width,h=25*u,[_]=(0,b.useState)(()=>window.innerWidth*1.15/Math.min(1200,window.innerWidth-32)),v=(0,b.useMemo)(()=>W.map((e,t)=>K(t,c.columns)),[c.columns]);return(0,x.jsxs)(`div`,{ref:e,className:`ld-shell`,style:{height:i?c.height*u:void 0,borderRadius:h,"--ld-from":_},"aria-hidden":`true`,children:[i>0&&(0,x.jsx)(`svg`,{className:`ld-draw`,children:(0,x.jsx)(`path`,{d:pe(i,c.height*u,h-.5),pathLength:`1`})}),i>0&&(0,x.jsxs)(`div`,{ref:t,className:`ld-stage ld-${o}`,style:{width:c.width,height:c.height,transform:`scale(${u})`},children:[(0,x.jsxs)(`div`,{className:`ld-scene`,children:[(0,x.jsx)(`div`,{className:`world ld-world`,children:W.map((e,t)=>(0,x.jsxs)(`div`,{className:`frame ld-frame`,style:{left:v[t].x,top:v[t].y,width:V,height:H},children:[(0,x.jsx)(`div`,{className:`frame-title`,children:(0,x.jsxs)(`span`,{children:[`V`,e]})}),(0,x.jsx)(`div`,{className:`frame-surface`,children:(0,x.jsx)(me,{version:e})})]},e))}),(0,x.jsx)(`svg`,{className:`ld-strokes`,width:c.width,height:c.height,children:(0,x.jsx)(`path`,{fill:ce})}),(0,x.jsx)(he,{id:`a`,person:0,text:``}),(0,x.jsx)(he,{id:`b`,person:1,text:`Can we try this one darker?`})]}),(0,x.jsx)(`div`,{className:`chrome shell top-left ld-rise`,children:(0,x.jsx)(`span`,{className:`canvas-name`,children:`Notification Explorations`})}),(0,x.jsx)(`div`,{className:`chrome shell toolbar ld-rise`,children:(0,x.jsx)(`div`,{className:`toolbar-clip`,children:(0,x.jsxs)(`div`,{className:`toolbar-row`,children:[(0,x.jsx)(`span`,{className:`tool-slider`,style:{width:50}}),(0,x.jsx)(`span`,{className:`tool`,"aria-pressed":`true`,children:(0,x.jsx)(ee,{size:18})}),(0,x.jsx)(`span`,{className:`tool`,children:(0,x.jsx)(p,{size:18})}),(0,x.jsx)(`span`,{className:`tool`,children:(0,x.jsx)(g,{size:18})}),(0,x.jsx)(`span`,{className:`shell-divider`}),(0,x.jsx)(`span`,{className:`tool`,children:(0,x.jsx)(l,{size:18})})]})})}),(0,x.jsxs)(`div`,{className:`chrome shell top-right ld-rise`,children:[(0,x.jsx)(`div`,{className:`faces`,children:[2,1,0].map(e=>(0,x.jsx)(`span`,{className:`face-button`,children:(0,x.jsx)(d,{name:G[e].name,picture:null,color:G[e].color})},e))}),(0,x.jsx)(`span`,{className:`primary-button share-button`,children:`Share`}),(0,x.jsxs)(`span`,{className:`primary-button share-sharing`,style:{display:`none`},children:[(0,x.jsx)(`i`,{}),(0,x.jsx)(`span`,{children:`Share`})]}),(0,x.jsxs)(`span`,{className:`share-split`,style:{display:`none`},children:[(0,x.jsxs)(`span`,{className:`primary-button`,children:[(0,x.jsxs)(`span`,{className:`ld-copied`,children:[(0,x.jsx)(f,{size:14}),`Copied`]}),(0,x.jsx)(`span`,{className:`ld-copy`,children:`Copy link`})]}),(0,x.jsx)(`span`,{className:`primary-button`,children:(0,x.jsx)(m,{size:14})})]})]}),(0,x.jsxs)(`div`,{className:`chrome shell zoom ld-rise`,children:[(0,x.jsx)(`span`,{className:`icon-button`,children:(0,x.jsx)(n,{})}),(0,x.jsx)(`span`,{className:`shell-divider`}),(0,x.jsx)(`span`,{className:`icon-button`,children:(0,x.jsx)(s,{})}),(0,x.jsx)(`span`,{className:`zoom-value`,"data-zoom":!0,children:`100%`}),(0,x.jsx)(`span`,{className:`icon-button`,children:(0,x.jsx)(r,{})})]}),(0,x.jsxs)(`div`,{className:`ld-cursors`,children:[(0,x.jsx)(q,{id:`0`,color:G[0].color,name:G[0].name}),(0,x.jsx)(q,{id:`1`,color:G[1].color,name:G[1].name}),(0,x.jsx)(q,{id:`2`,color:G[2].color,name:G[2].name}),(0,x.jsx)(q,{id:`you`,color:`#000`})]})]},o)]})}var J=[[0,6],[.4,13],[.75,19],[.88,20.2],[1,22]],ve=J[1][0],ye=e=>Math.min(1,Math.max(0,e)),be=e=>{let t=Math.max(1,J.findIndex(([t])=>t>=e)),[n,r]=J[t-1],[i,a]=J[t];return r+(e-n)/(i-n)*(a-r)},xe=e=>{if(e<J[0][1]||e>=J[J.length-1][1])return 1;let t=J.findIndex(([,t])=>t>=e);if(t<=0)return 0;let[n,r]=J[t-1],[i,a]=J[t];return n+(e-r)/(a-r)*(i-n)},Se=[[0,0],[.12,.5],[.28,1],[.58,.5],[.72,0],[.84,null]],Ce=e=>[...Se].reverse().find(([t])=>e>=t)[1],we=Array.from({length:8},(e,t)=>{let n=t*Math.PI/4,r=e=>`${(12+Math.cos(n)*e).toFixed(2)} ${(12+Math.sin(n)*e).toFixed(2)}`;return`M${r(8.2)}L${r(10.6)}`}).join(``);function Te({rays:e}){let t=(0,b.useId)(),n=e===null;return(0,x.jsxs)(`svg`,{className:`light-glyph`,viewBox:`0 0 24 24`,"aria-hidden":`true`,children:[(0,x.jsxs)(`mask`,{id:t,children:[(0,x.jsx)(`rect`,{x:`-4`,y:`-4`,width:`32`,height:`32`,fill:`#fff`}),(0,x.jsx)(`circle`,{className:`light-cut`,cx:`6.5`,cy:`17.5`,r:`8`,fill:`#000`,style:{transform:n?`none`:`translate(-9px, 9px)`}})]}),(0,x.jsxs)(`g`,{className:`light-turn`,style:{transform:`rotate(${n?180:0}deg)`},children:[(0,x.jsx)(`circle`,{className:`light-core`,cx:`12`,cy:`12`,r:`9`,fill:`currentColor`,mask:`url(#${t})`,style:{transform:`scale(${n?1:.56})`,opacity:n?1:.7+.3*e}}),(0,x.jsx)(`path`,{className:`light-rays`,d:we,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,style:{transform:n?`rotate(-90deg) scale(0.5)`:`scale(${.74+.26*e})`,opacity:n?0:.55+.45*e}})]})]})}function Ee({hour:e,onHour:t}){let[n,r]=(0,b.useState)(!1),[i,a]=(0,b.useState)(!1),[o,s]=(0,b.useState)(!1),c=(0,b.useRef)(null),l=n||i||o,u=xe(e),d=e=>{let n=c.current.getBoundingClientRect();t(be(ye((e.clientX-n.left)/n.width)))},f=e=>{e.currentTarget.setPointerCapture(e.pointerId),s(!0),d(e)},p=e=>{let n={ArrowLeft:-.05,ArrowDown:-.05,ArrowRight:.05,ArrowUp:.05}[e.key];n!==void 0&&(e.preventDefault(),t(be(ye(u+n))))},m=u>.85;return(0,x.jsx)(`div`,{className:`light-switch`,"data-open":l||void 0,"data-dragging":o||void 0,style:{"--x":u},onPointerEnter:e=>e.pointerType===`mouse`&&r(!0),onPointerLeave:e=>e.pointerType===`mouse`&&r(!1),onFocus:e=>e.target.matches(`:focus-visible`)&&a(!0),onBlur:()=>a(!1),children:(0,x.jsxs)(`div`,{className:`light-pill`,children:[(0,x.jsx)(`div`,{ref:c,className:`light-track`,role:`slider`,"aria-label":`Time of day`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(u*100),"aria-valuetext":m?`Night`:u<ve?`Morning`:`Evening`,tabIndex:0,onPointerDown:f,onPointerMove:e=>o&&d(e),onPointerUp:()=>s(!1),onPointerCancel:()=>s(!1),onKeyDown:p,children:(0,x.jsx)(`span`,{className:`light-dot`})}),(0,x.jsx)(`button`,{type:`button`,className:`light-toggle`,"aria-label":m?`Switch to day`:`Switch to night`,onClick:()=>t(be(m?ve:1),!0),children:(0,x.jsx)(Te,{rays:Ce(u)})})]})})}var Y={ms:800,ease:[.45,0,.55,1]},De=c(...Y.ease),Oe=[[0,`#1f283c`,`#0f1421`,`#2a3755`,`#0c1220`],[4.5,`#1a2132`,`#0d111d`,`#25304c`,`#0a0f1b`],[5.5,`#555b7c`,`#2c3149`,`#8f91b4`,`#3a4252`],[6.5,`#efc4ae`,`#8a7a84`,`#ffe1c9`,`#a79a78`],[7.5,`#f8e2c8`,`#a89c94`,`#fff5e4`,`#b9c39a`],[10,`#fcfaf4`,`#adaca6`,`#ffffff`,`#c9d8bb`],[13,`#ffffff`,`#acadac`,`#ffffff`,`#d3e0c8`],[16,`#faf2e3`,`#aaa193`,`#fffbf1`,`#c7d0a7`],[18,`#e9bd95`,`#a07f62`,`#ffdcb2`,`#a89a62`],[19,`#da9570`,`#7a5a50`,`#ffb78c`,`#6d5f4b`],[19.75,`#84678a`,`#4a4262`,`#b78fa8`,`#3b3550`],[20.75,`#2f3756`,`#1a1f33`,`#3f4a70`,`#141a2c`],[24,`#1f283c`,`#0f1421`,`#2a3755`,`#0c1220`]],ke=e=>[1,3,5].map(t=>(parseInt(e.slice(t,t+2),16)/255)**2.2),Ae=e=>`#${e.map(e=>Math.round(e**(1/2.2)*255).toString(16).padStart(2,`0`)).join(``)}`,je=new URLSearchParams(location.search).get(`hour`),Me=()=>{if(je!==null)return Number(je);let e=new Date;return e.getHours()+e.getMinutes()/60};function Ne(){let[e,t]=(0,b.useState)(Me);return(0,b.useEffect)(()=>{let e=()=>t(Me()),n=window.setInterval(e,3e4);return document.addEventListener(`visibilitychange`,e),()=>{window.clearInterval(n),document.removeEventListener(`visibilitychange`,e)}},[]),e}function Pe(e){let{lit:t,shade:n}=Fe(e),[r,i,a]=t.map((e,t)=>n[t]+(e-n[t])*.6);return{lit:Ae(t),shade:Ae(n),dark:.2126*r+.7152*i+.0722*a<.18}}function Fe(e){let t=Math.max(1,Oe.findIndex(([t])=>t>=e)),[n,...r]=Oe[t-1],[i,...a]=Oe[t],o=(e-n)/(i-n),s=o*o*(3-2*o),[c,l,u,d]=r.map((e,t)=>{let n=ke(a[t]);return ke(e).map((e,t)=>e+(n[t]-e)*s)}),f=2*Math.PI*(e-12.5)/24,p=(9+36*Math.abs(Math.cos(f)))*Math.PI/180,m=Math.sin(f)*52*Math.PI/180;return{lit:c,shade:l,sky:u,leaf:d,sun:[-Math.cos(p)*Math.cos(m),Math.sin(p),Math.cos(p)*Math.sin(m)]}}var X={wind:1.1,gust:1,flutter:1.65,leafSize:1,shadow:.55,softness:1,sun:.61,skyLeaves:.29},Ie=`#version 300 es
3
+ in vec2 a;
4
+ void main() { gl_Position = vec4(a, 0., 1.); }`,Le=`#version 300 es
5
+ precision highp float;
6
+ out vec4 fragColor;
7
+ uniform vec2 uRes;
8
+ uniform float uTime;
9
+ uniform vec3 uSun, uLit, uShade, uSky, uLeaf;
10
+ uniform sampler2D uLeaves;
11
+ // Tuning, from LIGHT below.
12
+ uniform float uGust, uFlutter, uLeafSize, uShadow, uSoft, uSunStrength, uSkyLeaves;
13
+
14
+ // How far the corners melt. Lower is softer.
15
+ const float CORNER = 5.5;
16
+ // Half the height of the box, and how much of the screen its far wall fills.
17
+ const float HALF = 3.;
18
+ const float FAR_WALL = .5;
19
+
20
+ float dither(vec2 p) {
21
+ vec3 h = fract(p.xyx * .1031);
22
+ h += dot(h, h.yzx + 33.33);
23
+ return fract((h.x + h.y) * h.z);
24
+ }
25
+
26
+ float band(float x, float a, float b, float soft) {
27
+ return smoothstep(a - soft, a + soft, x) * (1. - smoothstep(b - soft, b + soft, x));
28
+ }
29
+
30
+ // Wind moving through the trees: gusts travel along the canopy, leaning the branches as they pass,
31
+ // stirring the leaves and opening small gaps that let more light through.
32
+ float foliage(vec2 zy) {
33
+ float t = uTime;
34
+ float gust = sin(t * .42 - zy.x * .3) + .6 * sin(t * .67 - zy.x * .5 + zy.y * .2 + 1.3);
35
+ float stir = (.12 + .2 * abs(gust)) * uFlutter;
36
+ vec2 lean = .6 * gust * uGust * vec2(1., .3);
37
+ vec2 flutter = stir * vec2(sin(t * 1.3 + zy.y * 1.7), cos(t * 1.1 + zy.x * 1.5));
38
+ float near = texture(uLeaves, (zy + lean + flutter) * .21 / uLeafSize + vec2(.17, .31)).r;
39
+ float far = texture(uLeaves, (zy + lean * .4 + flutter * .3) * .09 / uLeafSize + vec2(.61, .09)).r;
40
+ float gap = .03 * gust;
41
+ return max(smoothstep(.1 + gap, .42 + gap, near), .75 * smoothstep(.1, .4, far));
42
+ }
43
+
44
+ // Sun reaching a point through a tall opening down the left side, then through the leaves.
45
+ // The further the light has travelled from the opening, the wider its edges.
46
+ float sunlight(vec3 p, float wall) {
47
+ vec3 hit = p + uSun * ((-wall - p.x) / uSun.x);
48
+ float soft = (.25 + .07 * length(hit - p)) * uSoft;
49
+ float open = band(hit.y, -HALF + .3, HALF - .3, soft) * band(hit.z, -30., 60., soft);
50
+ float bar = mod(hit.z, 4.) - 2.;
51
+ open *= 1. - min(1., .22 / soft) * exp(-bar * bar / (soft * soft));
52
+ vec3 leaf = p + uSun * ((-wall - 3. - p.x) / uSun.x);
53
+ return open * (1. - uShadow * foliage(leaf.zy));
54
+ }
55
+
56
+ void main() {
57
+ float aspect = uRes.x / uRes.y;
58
+ vec2 p = (gl_FragCoord.xy - uRes * .5) / uRes.y;
59
+
60
+ // The far wall has the same shape as the screen, so the corners run straight to the screen's corners.
61
+ vec2 back = vec2(aspect, 1.) * .5 * FAR_WALL;
62
+ float wall = HALF * aspect;
63
+ float depth = HALF / back.y;
64
+
65
+ // How far past the far wall's outline this pixel is, and how much it belongs to each face.
66
+ vec2 reach = abs(p) / back;
67
+ vec3 weights = exp(CORNER * vec3(reach, 1.));
68
+ weights /= weights.x + weights.y + weights.z;
69
+ float besides = weights.x;
70
+ float above = weights.y;
71
+ float ahead = weights.z;
72
+
73
+ float leftFace = besides * (1. - smoothstep(-.1, .1, p.x / back.x));
74
+ float rightFace = besides - leftFace;
75
+ float floorFace = above * (1. - smoothstep(-.1, .1, p.y / back.y));
76
+ float ceilingFace = above - floorFace;
77
+
78
+ // Points on each face, for the sun.
79
+ float tWall = min(wall / max(abs(p.x), .01), depth);
80
+ float tFlat = min(HALF / max(abs(p.y), .01), depth);
81
+ vec3 onRight = vec3(wall, p.y * tWall, tWall);
82
+ vec3 onLeft = vec3(-wall, p.y * tWall, tWall);
83
+ vec3 onFloor = vec3(p.x * tFlat, -HALF, tFlat);
84
+ vec3 onBack = vec3(p.x * depth, p.y * depth, depth);
85
+
86
+ // Daylight fills the box from the left, thinning toward the right.
87
+ float x = p.x / (back.x * 2.);
88
+ float fill = 1. - .55 * smoothstep(-1.2, 1.5, x);
89
+ fill *= leftFace + floorFace + ahead * .9 + ceilingFace * .74 + rightFace * .8;
90
+
91
+ // The corners are only a slight gathering of shade where two faces meet.
92
+ float crease = 1. - max(besides, max(above, ahead));
93
+ fill *= 1. - crease * .3;
94
+ vec3 color = mix(uShade, uLit, fill);
95
+
96
+ // Sun.
97
+ vec3 s = uSun;
98
+ float sun = 0.;
99
+ if (floorFace > .02) sun += floorFace * sunlight(onFloor, wall) * min(1., s.y * 3.);
100
+ if (ahead > .02) sun += ahead * sunlight(onBack, wall) * min(1., max(-s.z, 0.) * 2.5);
101
+ if (rightFace > .02) sun += rightFace * sunlight(onRight, wall) * min(1., -s.x * 2.);
102
+ color += uLit * sun * uSunStrength;
103
+
104
+ // The left side is the light itself: bright sky with trees far out of focus.
105
+ color = mix(color, mix(uSky, uLeaf, foliage(onLeft.zy) * uSkyLeaves), leftFace);
106
+
107
+ color = pow(min(color, vec3(1.)), vec3(1. / 2.2));
108
+ // A single level of 8-bit noise: invisible, but it stops the gradients from banding.
109
+ color += (dither(gl_FragCoord.xy + 17.) - .5) / 255.;
110
+ fragColor = vec4(color, 1.);
111
+ }`;function Re(){let e=1024,t=document.createElement(`canvas`);t.width=t.height=e;let n=t.getContext(`2d`),r=606,i=()=>(r=r*16807%2147483647)/2147483647;n.fillStyle=`#000`,n.fillRect(0,0,e,e),n.fillStyle=n.strokeStyle=`#fff`,n.lineCap=`round`;for(let t=0;t<22;t++){let t=i()*e,r=i()*e,a=i()*Math.PI*2,o=260+i()*460;for(let e=0;e<o;e+=14){a+=(i()-.5)*.3;let s=t+Math.cos(a)*14,c=r+Math.sin(a)*14;if(n.lineWidth=Math.max(1.5,6*(1-e/o)),n.beginPath(),n.moveTo(t,r),n.lineTo(s,c),n.stroke(),t=s,r=c,!(i()>.42))for(let e of[-1,1]){if(i()>.8)continue;let o=a+e*(.5+i()*.7),s=34+i()*40;n.save(),n.translate(t+Math.cos(o)*s*.55,r+Math.sin(o)*s*.55),n.rotate(o),n.beginPath(),n.ellipse(0,0,s*.55,s*.2,0,0,Math.PI*2),n.fill(),n.restore()}}}return ze(t)}function ze(e){let t=document.createElement(`canvas`);t.width=t.height=128;let n=t.getContext(`2d`,{willReadFrequently:!0});n.drawImage(e,0,0,128,128);let r=n.getImageData(0,0,128,128),i=Float32Array.from({length:16384},(e,t)=>r.data[t*4]);for(let e=0;e<6;e++){let t=new Float32Array(16384);for(let n=0;n<128;n++)for(let r=0;r<128;r++){let a=0;for(let t=-13;t<=13;t++){let o=e%2?(n+t+128)%128*128+r:n*128+(r+t+128)%128;a+=i[o]}t[n*128+r]=a/27}i=t}return i.forEach((e,t)=>{r.data[t*4]=r.data[t*4+1]=r.data[t*4+2]=e}),n.putImageData(r,0,0),t}function Be({hour:e,glide:t}){let n=(0,b.useRef)(null),r=(0,b.useRef)(e),i=(0,b.useRef)(e),a=(0,b.useRef)(null),o=(0,b.useRef)(null);return(0,b.useEffect)(()=>{a.current=t?{from:i.current,at:performance.now()}:null,r.current=e,o.current?.()},[e]),(0,b.useEffect)(()=>{let e=n.current,t=e.getContext(`webgl2`,{antialias:!1,alpha:!1});if(!t)return;let s=t.createProgram();for(let[e,n]of[[t.VERTEX_SHADER,Ie],[t.FRAGMENT_SHADER,Le]]){let r=t.createShader(e);t.shaderSource(r,n),t.compileShader(r),t.attachShader(s,r)}t.bindAttribLocation(s,0,`a`),t.linkProgram(s),t.useProgram(s),t.bindBuffer(t.ARRAY_BUFFER,t.createBuffer()),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,3,-1,-1,3]),t.STATIC_DRAW),t.enableVertexAttribArray(0),t.vertexAttribPointer(0,2,t.FLOAT,!1,0,0),t.bindTexture(t.TEXTURE_2D,t.createTexture()),t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,Re()),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,t.LINEAR),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,t.REPEAT),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,t.REPEAT);let c=e=>t.getUniformLocation(s,e),l=(n,r)=>{let{clientWidth:i,clientHeight:a}=e;(e.width!==i||e.height!==a)&&(e.width=i,e.height=a,t.viewport(0,0,i,a));let o=Fe(r);t.uniform2f(c(`uRes`),i,a),t.uniform1f(c(`uTime`),n),t.uniform1f(c(`uGust`),X.gust),t.uniform1f(c(`uFlutter`),X.flutter),t.uniform1f(c(`uLeafSize`),X.leafSize),t.uniform1f(c(`uShadow`),X.shadow),t.uniform1f(c(`uSoft`),X.softness),t.uniform1f(c(`uSunStrength`),X.sun),t.uniform1f(c(`uSkyLeaves`),X.skyLeaves),t.uniform3fv(c(`uSun`),o.sun),t.uniform3fv(c(`uLit`),o.lit),t.uniform3fv(c(`uShade`),o.shade),t.uniform3fv(c(`uSky`),o.sky),t.uniform3fv(c(`uLeaf`),o.leaf),t.drawArrays(t.TRIANGLES,0,3)};if(matchMedia(`(prefers-reduced-motion: reduce)`).matches){o.current=()=>l(0,r.current);let t=new ResizeObserver(()=>l(0,r.current));return t.observe(e),()=>{o.current=null,t.disconnect()}}let u=performance.now(),d=u/1e3,f=requestAnimationFrame(function e(t){let n=a.current;if(n){let e=Math.min(1,Math.max(0,(t-n.at)/Y.ms));i.current=n.from+(r.current-n.from)*De(e),e===1&&(a.current=null)}else i.current+=(r.current-i.current)*(1-Math.exp((u-t)*.002));d+=(t-u)/1e3*X.wind,u=t,l(d,i.current),f=requestAnimationFrame(e)});return()=>cancelAnimationFrame(f)},[]),(0,x.jsx)(`canvas`,{ref:n,className:`window-light`,"aria-hidden":`true`})}var Ve=new URLSearchParams(location.search).get(`hero`)!==`1`,He=(0,b.lazy)(()=>y(()=>import(`./LandingStage-u99Kd45d.js`),__vite__mapDeps([0,1,2,3,4,5]))),Ue=[[`A`,`canvas`,`for`,`your`],[`agent’s`,`explorations`]],We=t(.8,0),Ge=t(1.1,0),Ke=.1,qe=3,Je=.14,Z=8,Ye=500,Q=32,Xe=1500,Ze=(()=>{let e=crypto.getRandomValues(new Uint8Array(16)),t=Date.now();for(let n=5;n>=0;n--)e[n]=t%256,t=Math.floor(t/256);e[6]=e[6]&15|112,e[8]=e[8]&63|128;let n=Array.from(e,e=>e.toString(16).padStart(2,`0`)).join(``);return`${n.slice(0,8)}-${n.slice(8,12)}-${n.slice(12,16)}-${n.slice(16,20)}-${n.slice(20)}`})(),$=(e,t={})=>i(`/api/events`,{event:e,visit:Ze,...t});function Qe(){let e=(0,b.useRef)(null),t=(0,b.useRef)(null);return(0,b.useEffect)(()=>{if(matchMedia(`(prefers-reduced-motion: reduce)`).matches)return;let n=[0,0,0,0],r=[0,0,0,0],i=0,a=!1,o=()=>{let e=!0;r.forEach((t,i)=>{r[i]=t+(n[i]-t)*Je,Math.abs(n[i]-r[i])>.01&&(e=!1)}),e&&r.splice(0,4,...n);let[a,s,c,l]=r.map(e=>e.toFixed(2));t.current&&(t.current.style.transform=r.some(Boolean)?`perspective(${Ye}px) translate(${a}px, ${s}px) rotateX(${c}deg) rotateY(${l}deg)`:``),i=e?0:requestAnimationFrame(o)},s=()=>{i||=requestAnimationFrame(o)},c=(e,t)=>Math.max(-t,Math.min(t,e)),l=()=>{a&&(a=!1,n.fill(0),s())},u=t=>{if(t.pointerType!==`mouse`||!e.current)return;let r=e.current.getBoundingClientRect();if(t.clientX<=r.left-Q||t.clientX>=r.right+Q||t.clientY<=r.top-Q||t.clientY>=r.bottom+Q)return l();a=!0;let i=t.clientX-r.left-r.width/2,o=t.clientY-r.top-r.height/2;n[0]=c(i*Ke,qe),n[1]=c(o*Ke,qe),n[2]=c(-o/(r.height/2)*Z,Z),n[3]=c(i/(r.width/2)*Z,Z),s()};return window.addEventListener(`pointermove`,u),document.documentElement.addEventListener(`pointerleave`,l),()=>{cancelAnimationFrame(i),window.removeEventListener(`pointermove`,u),document.documentElement.removeEventListener(`pointerleave`,l)}},[]),[e,t]}function $e(){let[e,t]=(0,b.useState)(!1),n=(0,b.useRef)(0);(0,b.useEffect)(()=>()=>window.clearTimeout(n.current),[]);let r=()=>{t(!0),window.clearTimeout(n.current),n.current=window.setTimeout(()=>t(!1),Xe)};return[e,e=>{navigator.clipboard?.writeText(e).then(()=>{$(`prompt_copied`),r()}).catch(()=>{})},r]}function et(){let[e,t,n]=$e(),[r,i]=Qe();return(0,b.useEffect)(()=>(window.addEventListener(S,n),()=>window.removeEventListener(S,n)),[]),(0,x.jsx)(`span`,{ref:r,className:`landing-magnet`,children:(0,x.jsx)(`div`,{ref:i,className:`landing-cta`,children:(0,x.jsxs)(`button`,{type:`button`,className:`landing-button`,"data-copied":e||void 0,onClick:()=>t(h),children:[(0,x.jsxs)(`span`,{className:`landing-states`,children:[(0,x.jsxs)(`span`,{className:`landing-state`,children:[(0,x.jsx)(te,{}),(0,x.jsx)(`span`,{className:`landing-label`,children:`Copy agent prompt`})]}),(0,x.jsxs)(`span`,{className:`landing-state`,"aria-hidden":`true`,children:[(0,x.jsx)(`svg`,{className:`landing-check`,viewBox:`0 0 18 18`,children:(0,x.jsx)(`path`,{d:`M3.5 9.5 7.25 13.25 14.5 5`,pathLength:`1`})}),(0,x.jsx)(`span`,{className:`landing-done`,children:`Copied`})]})]}),(0,x.jsx)(`span`,{className:`landing-sr`,"aria-live":`polite`,children:e?`Copied`:``})]})})})}function tt(){let e=0;return(0,x.jsx)(`h1`,{className:`landing-title`,children:Ue.map((t,n)=>(0,x.jsxs)(b.Fragment,{children:[n>0&&(0,x.jsx)(`br`,{}),t.map(t=>(0,x.jsxs)(b.Fragment,{children:[(0,x.jsx)(`span`,{className:`landing-word`,style:{"--delay":`${100+e++*80}ms`},children:t}),` `]},t))]},n))})}function nt(){(0,b.useEffect)(()=>{$(`landing_viewed`,{url:location.href,referrer:document.referrer})},[]);let e=Ne(),[t,n]=(0,b.useState)(null),[r,i]=(0,b.useState)(!1),a=(e,t=!1)=>{n(e),i(t)},o=t??e,{lit:s,shade:c,dark:l}=Pe(o),[u,d]=(0,b.useState)(!1),f=(0,b.useRef)(l);return(0,b.useEffect)(()=>{if(f.current===l)return;f.current=l,d(!0);let e=window.setTimeout(()=>d(!1),Y.ms);return()=>window.clearTimeout(e)},[l]),(0,b.useEffect)(()=>{document.body.style.background=s,document.body.style.colorScheme=l?`dark`:`light`},[s,l]),(0,x.jsxs)(`div`,{className:`landing`,"data-dark":l||void 0,"data-shifting":u||void 0,"data-glide":r||void 0,style:{"--lit":s,"--shade":c,"--shift-ms":`${Y.ms}ms`,"--shift-ease":`cubic-bezier(${Y.ease.join(`, `)})`,"--word-ease":We.css,"--word-ms":`${We.ms}ms`,"--rise-ease":Ge.css,"--rise-ms":`${Ge.ms}ms`},children:[(0,x.jsx)(Be,{hour:o,glide:r}),(0,x.jsxs)(`nav`,{className:`landing-nav`,"aria-label":`Main`,children:[(0,x.jsx)(`a`,{className:`wordmark`,href:`/`,children:(0,x.jsx)(_,{})}),(0,x.jsxs)(`div`,{className:`landing-nav-end`,children:[(0,x.jsx)(Ee,{hour:o,onHour:a}),(0,x.jsx)(`a`,{className:`landing-sign-in`,href:`/auth/google/start?next=/`,onClick:()=>$(`sign_in_clicked`),children:`Sign in`})]})]}),(0,x.jsxs)(`main`,{className:`landing-hero`,children:[(0,x.jsx)(tt,{}),(0,x.jsx)(`p`,{className:`landing-body`,children:`Then share, comment, and huddle with one link.`}),(0,x.jsx)(`div`,{className:`landing-actions`,children:(0,x.jsx)(et,{})}),Ve?(0,x.jsx)(`div`,{className:`landing-slot`,children:(0,x.jsx)(b.Suspense,{fallback:null,children:(0,x.jsx)(He,{dark:l})})}):(0,x.jsx)(_e,{})]}),(0,x.jsxs)(`footer`,{className:`landing-foot`,children:[(0,x.jsxs)(`span`,{children:[`© Materic, Inc. `,new Date().getFullYear()]}),(0,x.jsxs)(`nav`,{children:[(0,x.jsx)(`a`,{href:`/privacy`,children:`Privacy`}),(0,x.jsx)(`a`,{href:`/terms`,children:`Terms`})]})]})]})}export{nt as Landing,S as t};