@voidzero-dev/vitepress-theme 0.0.18 → 0.1.33

package/dist/index34.js

@@ -0,0 +1,297 @@
+import { defineComponent as _, ref as h, onMounted as y, onUnmounted as k, createElementBlock as c, openBlock as d, createElementVNode as t, Fragment as j, renderList as V, normalizeClass as i, createTextVNode as C, toDisplayString as z, createVNode as m, createCommentVNode as x } from "vue";
+import u from "./index68.js";
+import I from "./index6.js";
+import A from "./index69.js";
+import E from "./index70.js";
+import R from "./index71.js";
+import T from "./index72.js";
+import S from "./index73.js";
+import N from "./index74.js";
+import O from "./index75.js";
+import J from "./index76.js";
+import P from "./index77.js";
+import B from "./index78.js";
+import X from "./index79.js";
+const $ = { class: "wrapper wrapper--ticks border-t flex" }, D = { class: "w-72 p-10 sticky top-0 self-start hidden md:flex flex-col" }, H = { class: "flex flex-col gap-4" }, M = ["onClick"], F = ["src", "alt"], L = { class: "w-full md:border-l border-nickel" }, U = { class: "flex flex-col p-10 justify-between gap-20" }, q = { class: "flex flex-col gap-5 max-w-[20rem]" }, G = ["href"], K = { class: "flex flex-col min-h-[22rem] sm:min-h-[30rem]" }, Q = { class: "relative pl-10 h-full flex flex-col justify-center overflow-clip" }, W = ["src"], Y = { class: "flex flex-col p-10 justify-between gap-20" }, Z = { class: "flex flex-col gap-5 max-w-[20rem]" }, tt = ["href"], et = { class: "flex flex-col min-h-[22rem] sm:min-h-[30rem]" }, ot = { class: "relative pl-10 h-full flex flex-col justify-end overflow-clip pt-10 sm:pt-0" }, st = ["src"], lt = { class: "flex flex-col p-10 justify-between gap-20" }, it = { class: "flex flex-col gap-5 max-w-[20rem]" }, rt = ["href"], nt = { class: "flex flex-col min-h-[22rem] sm:min-h-[30rem]" }, at = { class: "relative pl-10 h-full flex flex-col justify-center overflow-clip py-10 sm:py-0" }, ct = ["src"], dt = { class: "flex flex-col p-10 justify-between gap-20" }, mt = { class: "flex flex-col gap-5 max-w-[20rem]" }, ft = ["href"], ut = { class: "flex flex-col min-h-[22rem] sm:min-h-[30rem]" }, pt = { class: "relative pl-10 h-full flex flex-col justify-center overflow-clip" }, Et = /* @__PURE__ */ _({
+  __name: "OpenSourceSectionProjects",
+  setup(xt) {
+    const l = h(0), r = h([]);
+    let p = null;
+    const s = [
+      {
+        id: "vite",
+        name: "Vite",
+        url: "https://vite.dev",
+        icon: A,
+        terminal: S,
+        animation: J
+      },
+      {
+        id: "vitest",
+        name: "Vitest",
+        url: "https://vitest.dev",
+        icon: E,
+        terminal: N,
+        animation: P
+      },
+      {
+        id: "rolldown",
+        name: "Rolldown",
+        url: "https://rolldown.rs",
+        icon: R,
+        terminal: O,
+        animation: B
+      },
+      {
+        id: "oxc",
+        name: "OXC",
+        url: "https://oxc.rs",
+        icon: T,
+        terminal: null,
+        // OXC uses Rive animation instead
+        animation: X
+      }
+    ], w = (n) => {
+      const e = r.value[n];
+      e && e.scrollIntoView({ behavior: "smooth", block: "center" });
+    };
+    return y(() => {
+      p = new IntersectionObserver(
+        () => {
+          const n = window.innerHeight / 2;
+          let e = 0, o = 1 / 0;
+          r.value.forEach((a, v) => {
+            if (!a) return;
+            const f = a.getBoundingClientRect();
+            if (f.bottom < 0 || f.top > window.innerHeight) return;
+            const g = f.top + f.height / 2, b = Math.abs(g - n);
+            b < o && (o = b, e = v);
+          }), l.value = e;
+        },
+        { threshold: [0, 0.1, 0.5, 1] }
+      ), r.value.forEach((n) => {
+        n && p?.observe(n);
+      });
+    }), k(() => {
+      p?.disconnect();
+    }), (n, e) => (d(), c("section", $, [
+      t("div", D, [
+        t("ul", H, [
+          (d(), c(j, null, V(s, (o, a) => t("li", {
+            key: o.id,
+            class: i(["transition-all duration-500 ease-out", l.value === a ? "" : "opacity-40 grayscale"])
+          }, [
+            t("button", {
+              type: "button",
+              class: "flex gap-4 text-base cursor-pointer bg-transparent border-none p-0",
+              onClick: (v) => w(a)
+            }, [
+              t("img", {
+                src: o.icon,
+                alt: o.name,
+                class: "size-6"
+              }, null, 8, F),
+              C(" " + z(o.name), 1)
+            ], 8, M)
+          ], 2)), 64))
+        ])
+      ]),
+      t("div", L, [
+        t("div", {
+          class: "grid md:grid-cols-2 w-full",
+          ref: (o) => r.value[0] = o,
+          "data-project": "0"
+        }, [
+          t("div", U, [
+            t("div", q, [
+              e[0] || (e[0] = t("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "Vite", -1)),
+              e[1] || (e[1] = t("h4", { class: "text-white text-pretty" }, "The build tool for the web", -1)),
+              e[2] || (e[2] = t("p", { class: "text-white/70 text-base max-w-[25rem] text-pretty" }, "Vite is a blazing fast frontend build tool powering the next generation of web applications.", -1)),
+              t("a", {
+                href: s[0].url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "button button--sm inline-block w-fit mt-5"
+              }, "Explore Vite", 8, G)
+            ]),
+            m(u, {
+              href: "https://github.com/vitejs/vite",
+              stars: "75.0k",
+              contributors: "1,161"
+            })
+          ]),
+          t("div", K, [
+            t("div", Q, [
+              t("div", {
+                class: i([
+                  "absolute inset-0 bg-vite transition-opacity duration-700 ease-out",
+                  l.value === 0 ? "opacity-100" : "opacity-0"
+                ])
+              }, null, 2),
+              t("div", {
+                class: i([
+                  "block p-2 relative bg-slate rounded-tl rounded-bl outline-1 outline-offset-[2px] outline-white/20 transition-transform duration-700 ease-out z-10",
+                  l.value === 0 ? "translate-x-0" : "translate-x-10"
+                ])
+              }, [
+                s[0].terminal ? (d(), c("img", {
+                  key: 0,
+                  loading: "lazy",
+                  src: s[0].terminal,
+                  alt: "terminal"
+                }, null, 8, W)) : x("", !0)
+              ], 2)
+            ])
+          ])
+        ], 512),
+        t("div", {
+          class: "grid md:grid-cols-2 w-full border-t border-nickel",
+          ref: (o) => r.value[1] = o,
+          "data-project": "1"
+        }, [
+          t("div", Y, [
+            t("div", Z, [
+              e[3] || (e[3] = t("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "Vitest", -1)),
+              e[4] || (e[4] = t("h4", { class: "text-white text-pretty" }, "Next-generation test runner", -1)),
+              e[5] || (e[5] = t("p", { class: "text-white/70 text-base max-w-[25rem] text-pretty" }, "A Vite-native testing framework. It's fast!", -1)),
+              t("a", {
+                href: s[1].url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "button button--sm inline-block w-fit mt-5"
+              }, "Explore Vitest", 8, tt)
+            ]),
+            m(u, {
+              href: "https://github.com/vitest-dev/vitest",
+              stars: "14.9k",
+              contributors: "631"
+            })
+          ]),
+          t("div", et, [
+            t("div", ot, [
+              t("div", {
+                class: i([
+                  "absolute inset-0 bg-vitest transition-opacity duration-700 ease-out",
+                  l.value === 1 ? "opacity-100" : "opacity-0"
+                ])
+              }, null, 2),
+              t("div", {
+                class: i([
+                  "block p-2 relative bg-slate rounded-tl outline-1 outline-offset-[2px] outline-white/20 transition-transform duration-700 ease-out z-10",
+                  l.value === 1 ? "translate-x-0" : "translate-x-10"
+                ])
+              }, [
+                s[1].terminal ? (d(), c("img", {
+                  key: 0,
+                  loading: "lazy",
+                  src: s[1].terminal,
+                  alt: "terminal"
+                }, null, 8, st)) : x("", !0)
+              ], 2)
+            ])
+          ])
+        ], 512),
+        t("div", {
+          class: "grid md:grid-cols-2 w-full border-t border-nickel",
+          ref: (o) => r.value[2] = o,
+          "data-project": "2"
+        }, [
+          t("div", lt, [
+            t("div", it, [
+              e[6] || (e[6] = t("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "Rolldown", -1)),
+              e[7] || (e[7] = t("h4", { class: "text-white text-pretty" }, "The fastest JavaScript bundler", -1)),
+              e[8] || (e[8] = t("p", { class: "text-white/70 text-base max-w-[25rem] text-pretty" }, "A Rust-based bundler for Javascript with Rollup-compatible API", -1)),
+              t("a", {
+                href: s[2].url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "button button--sm inline-block w-fit mt-5"
+              }, "Explore Rolldown", 8, rt)
+            ]),
+            m(u, {
+              href: "https://github.com/rolldown/rolldown",
+              stars: "12.2k",
+              contributors: "148"
+            })
+          ]),
+          t("div", nt, [
+            t("div", at, [
+              t("div", {
+                class: i([
+                  "absolute inset-0 bg-rolldown transition-opacity duration-700 ease-out",
+                  l.value === 2 ? "opacity-100" : "opacity-0"
+                ])
+              }, null, 2),
+              t("div", {
+                class: i([
+                  "block p-2 relative bg-slate rounded-tl rounded-bl outline-1 outline-offset-[2px] outline-white/20 transition-transform duration-700 ease-out z-10",
+                  l.value === 2 ? "translate-x-0" : "translate-x-10"
+                ])
+              }, [
+                s[2].terminal ? (d(), c("img", {
+                  key: 0,
+                  loading: "lazy",
+                  src: s[2].terminal,
+                  alt: "terminal"
+                }, null, 8, ct)) : x("", !0)
+              ], 2)
+            ])
+          ])
+        ], 512),
+        t("div", {
+          class: "grid md:grid-cols-2 w-full border-t border-nickel",
+          ref: (o) => r.value[3] = o,
+          "data-project": "3"
+        }, [
+          t("div", dt, [
+            t("div", mt, [
+              e[9] || (e[9] = t("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "OXC", -1)),
+              e[10] || (e[10] = t("h4", { class: "text-white text-pretty" }, "The fastest JavaScript language toolchain", -1)),
+              e[11] || (e[11] = t("p", { class: "text-white/70 text-base max-w-[25rem] text-pretty" }, "A collection of JavaScript tools written in Rust", -1)),
+              t("a", {
+                href: s[3].url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "button button--sm inline-block w-fit mt-5"
+              }, "Explore OXC", 8, ft)
+            ]),
+            m(u, {
+              href: "https://github.com/oxc-project/oxc",
+              stars: "17.2k",
+              contributors: "268"
+            })
+          ]),
+          t("div", ut, [
+            t("div", pt, [
+              t("div", {
+                class: i([
+                  "absolute inset-0 bg-oxc transition-opacity duration-700 ease-out",
+                  l.value === 3 ? "opacity-100" : "opacity-0"
+                ])
+              }, null, 2),
+              t("div", {
+                class: i([
+                  "relative transition-transform duration-700 ease-out z-10",
+                  l.value === 3 ? "translate-x-0" : "translate-x-10"
+                ])
+              }, [
+                m(I, {
+                  "desktop-src": s[3].animation,
+                  "mobile-src": s[3].animation,
+                  "desktop-width": 480,
+                  "desktop-height": 480,
+                  "mobile-width": 480,
+                  "mobile-height": 480,
+                  "canvas-class": "w-full"
+                }, null, 8, ["desktop-src", "mobile-src"])
+              ], 2)
+            ])
+          ])
+        ], 512)
+      ])
+    ]));
+  }
+});
+export {
+  Et as default
+};

package/dist/index36.js

@@ -0,0 +1,149 @@
+import { defineComponent as I, ref as v, onMounted as M, onUnmounted as A, createElementBlock as o, openBlock as s, createElementVNode as e, Fragment as m, renderList as p, normalizeClass as _, toDisplayString as g, createCommentVNode as V } from "vue";
+import f from "./index80.js";
+import B from "./index81.js";
+import c from "./index82.js";
+import y from "./index69.js";
+import w from "./index70.js";
+import x from "./index71.js";
+import k from "./index72.js";
+const F = { class: "wrapper" }, L = { class: "bg-wine case-study-background" }, D = { class: "flex py-20" }, H = ["src", "alt"], P = { class: "text-white text-balance max-w-[20rem] pt-5" }, j = { class: "absolute bottom-0 left-0 right-0 flex gap-4 px-10 py-4 border-t border-slate items-center" }, z = ["href"], O = { class: "project-icon" }, $ = ["src", "alt"], E = {
+  key: 0,
+  class: "text-grey text-xs font-mono uppercase tracking-wide"
+}, N = { class: "embla-thumbs bg-primary" }, X = { class: "embla-thumbs__wrapper" }, U = { class: "embla-thumbs__container" }, q = ["onClick"], G = ["src", "alt"], oe = /* @__PURE__ */ I({
+  __name: "CaseStudySlider",
+  setup(J) {
+    const b = v([
+      {
+        id: 1,
+        title: "How PLAID Cut Build Times by 97% Migrating From Rollup To Rolldown",
+        thumbnail: c,
+        projects: [
+          { name: "Vite", logo: y, url: "https://vite.dev/" },
+          { name: "Rolldown", logo: x, url: "https://rolldown.rs/" }
+        ]
+      },
+      {
+        id: 2,
+        title: "How PLAID Cut Build Times by 97% Migrating From Rollup To Rolldown",
+        thumbnail: c,
+        projects: [
+          { name: "Vitest", logo: w, url: "https://vitest.dev/" },
+          { name: "Rolldown", logo: x, url: "https://rolldown.rs/" }
+        ]
+      },
+      {
+        id: 3,
+        title: "How PLAID Cut Build Times by 97% Migrating From Rollup To Rolldown",
+        thumbnail: c,
+        projects: [
+          { name: "Vite", logo: y, url: "https://vite.dev/" },
+          { name: "OXC", logo: k, url: "https://oxc.rs/" }
+        ]
+      },
+      {
+        id: 4,
+        title: "How PLAID Cut Build Times by 97% Migrating From Rollup To Rolldown",
+        thumbnail: c,
+        projects: [
+          { name: "Vitest", logo: w, url: "https://vitest.dev/" },
+          { name: "OXC", logo: k, url: "https://oxc.rs/" }
+        ]
+      }
+    ]), i = v(0), [C, t] = f(
+      { loop: !0 },
+      [B()]
+    ), [R, d] = f({
+      containScroll: "keepSnaps",
+      dragFree: !0
+    }), S = (h) => {
+      t.value && t.value.scrollTo(h);
+    }, r = () => {
+      !t.value || !d.value || (i.value = t.value.selectedScrollSnap(), d.value.scrollTo(t.value.selectedScrollSnap()));
+    };
+    return M(() => {
+      !t.value || !d.value || (r(), t.value.on("select", r), t.value.on("reInit", r));
+    }), A(() => {
+      t.value && (t.value.off("select", r), t.value.off("reInit", r));
+    }), (h, u) => (s(), o("section", F, [
+      e("div", L, [
+        e("div", {
+          class: "overflow-hidden",
+          ref_key: "emblaMainRef",
+          ref: C
+        }, [
+          e("div", D, [
+            (s(!0), o(m, null, p(b.value, (l, n) => (s(), o("div", {
+              key: l.id,
+              class: _(["embla__slide p-10 w-[55rem] rounded-lg relative", n === i.value ? "bg-primary" : "bg-primary/75"])
+            }, [
+              e("div", {
+                class: _(["embla__slide__content", { "embla__slide__content--active": n === i.value }])
+              }, [
+                e("img", {
+                  src: l.thumbnail,
+                  alt: l.title,
+                  class: "absolute top-10 right-10 h-5"
+                }, null, 8, H),
+                u[1] || (u[1] = e("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "Case Study", -1)),
+                e("h5", P, g(l.title), 1),
+                e("div", j, [
+                  u[0] || (u[0] = e("span", { class: "text-grey text-xs font-mono uppercase tracking-wide" }, "OSS", -1)),
+                  (s(!0), o(m, null, p(l.projects, (a, T) => (s(), o(m, {
+                    key: a.name
+                  }, [
+                    e("a", {
+                      href: a.url,
+                      target: "_blank"
+                    }, [
+                      e("figure", O, [
+                        e("img", {
+                          loading: "lazy",
+                          class: "size-5",
+                          src: a.logo,
+                          alt: a.name
+                        }, null, 8, $),
+                        e("figcaption", null, g(a.name), 1)
+                      ])
+                    ], 8, z),
+                    T < l.projects.length - 1 ? (s(), o("span", E, "//")) : V("", !0)
+                  ], 64))), 128))
+                ])
+              ], 2)
+            ], 2))), 128))
+          ])
+        ], 512)
+      ]),
+      e("div", N, [
+        e("div", X, [
+          e("div", {
+            class: "overflow-hidden",
+            ref_key: "emblaThumbRef",
+            ref: R
+          }, [
+            e("div", U, [
+              (s(!0), o(m, null, p(b.value, (l, n) => (s(), o("div", {
+                key: `thumb-${l.id}`,
+                class: _(["embla-thumbs__slide", { "embla-thumbs__slide--selected": n === i.value }])
+              }, [
+                e("button", {
+                  type: "button",
+                  class: "embla-thumbs__slide__button",
+                  onClick: (a) => S(n)
+                }, [
+                  e("img", {
+                    src: l.thumbnail,
+                    alt: `Slide ${n + 1}`,
+                    class: "embla-thumbs__slide__img"
+                  }, null, 8, G)
+                ], 8, q)
+              ], 2))), 128))
+            ])
+          ], 512)
+        ])
+      ])
+    ]));
+  }
+});
+export {
+  oe as default
+};

package/dist/index38.js

@@ -0,0 +1,116 @@
+import { defineComponent as x, ref as l, computed as g, onMounted as y, onUnmounted as h, createElementBlock as w, openBlock as b, Fragment as k, createElementVNode as t, createStaticVNode as c, createTextVNode as C, createVNode as S, unref as f } from "vue";
+import _ from "./index61.js";
+import "./index62.js";
+import "./index63.js";
+import A from "./index64.js";
+import B from "./index65.js";
+import { Chart as F } from "./index66.js";
+import { continuous as N } from "./index67.js";
+const P = { class: "wrapper wrapper--ticks border-t grid grid-cols-2 divide-x divide-ceramic" }, T = { class: "p-10 flex flex-col justify-between" }, z = /* @__PURE__ */ x({
+  __name: "Statistics",
+  props: {
+    statsUrl: { default: "/stats.json" }
+  },
+  setup(v) {
+    const u = v, a = l([]), i = l({
+      datasets: []
+    }), s = l(null), m = g(() => a.value.slice().reverse().find((d) => d.y > 0)?.y || 0);
+    return y(async () => {
+      const n = (await (await fetch(u.statsUrl)).json()).map((p) => ({
+        x: A(p.x).valueOf(),
+        y: p.y
+      }));
+      n.pop(), a.value = n;
+      const r = document.getElementById("chart-canvas"), o = r.getContext("2d").createLinearGradient(0, 0, -50, 400);
+      o.addColorStop(0, "#AA3BFF"), o.addColorStop(1, "#AA3BFF"), i.value = {
+        datasets: [
+          {
+            data: a.value,
+            /*fill: {
+              target: 'origin',
+              above: 'rgba(0, 0, 0, 0.02)'
+            },*/
+            pointStyle: !1,
+            borderWidth: 3,
+            borderColor: o,
+            stepped: !1
+          }
+        ]
+      }, s.value = new F(r, {
+        type: "line",
+        options: {
+          scales: {
+            x: {
+              type: "time",
+              time: {
+                unit: "week"
+              },
+              display: !1,
+              alignToPixels: !0,
+              ticks: { padding: 0 },
+              border: {
+                display: !1
+              }
+            },
+            y: {
+              min: 0,
+              display: !1,
+              ticks: { padding: 0 },
+              alignToPixels: !0,
+              border: {
+                display: !1
+              }
+            }
+          },
+          plugins: {
+            legend: {
+              display: !1
+            },
+            tooltip: {
+              enabled: !1
+            }
+          },
+          layout: {
+            autoPadding: !1,
+            padding: {
+              left: 0,
+              right: 0,
+              top: 0,
+              bottom: 100
+            }
+          },
+          aspectRatio: 5 / 3.5
+        },
+        data: {
+          datasets: i.value.datasets
+        }
+      });
+    }), h(() => {
+      s.value && s.value.destroy();
+    }), (d, e) => (b(), w(k, null, [
+      t("section", P, [
+        t("div", T, [
+          e[0] || (e[0] = t("h6", { class: "flex gap-2 items-center" }, [
+            t("img", {
+              src: _,
+              class: "size-8",
+              alt: "Vite"
+            }),
+            C(" Weekly downloads")
+          ], -1)),
+          t("h1", null, [
+            S(f(B), {
+              plugins: [f(N)],
+              value: m.value
+            }, null, 8, ["plugins", "value"])
+          ])
+        ]),
+        e[1] || (e[1] = c('<div class="relative aspect-[5/3.5]" data-v-5e416fd5><canvas id="chart-canvas" width="200" height="200" data-v-5e416fd5></canvas><div class="flex justify-between absolute bottom-10 left-10 right-10" data-v-5e416fd5><p class="font-mono text-sm text-nickel" data-v-5e416fd5>April 2020</p><p class="font-mono text-sm text-nickel" data-v-5e416fd5>Today</p></div></div>', 1))
+      ]),
+      e[2] || (e[2] = c('<section class="wrapper wrapper--ticks border-t grid grid-cols-3 divide-x divide-ceramic" data-v-5e416fd5><div class="flex flex-col gap-2 p-10" data-v-5e416fd5><h2 data-v-5e416fd5>30m+</h2><p class="lead" data-v-5e416fd5>Weekly NPM downloads</p></div><div class="flex flex-col gap-2 p-10" data-v-5e416fd5><h2 data-v-5e416fd5>118k+</h2><p class="lead" data-v-5e416fd5>Total GitHub Stars</p></div><div class="flex flex-col gap-2 p-10" data-v-5e416fd5><h2 data-v-5e416fd5>6.2m+</h2><p class="lead" data-v-5e416fd5>GitHub Dependents</p></div></section>', 1))
+    ], 64));
+  }
+});
+export {
+  z as default
+};