@uoguelph/react-components 1.3.13 → 1.4.0

package/dist/checkbox.js

@@ -1,85 +1,85 @@
 "use client";
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import { d as p } from "./regular-DmWV6rTj.js";
 import { FontAwesomeIcon as y } from "@fortawesome/react-fontawesome";
 import { Field as w, Checkbox as v, Label as N, Description as $ } from "@headlessui/react";
 import { useState as C } from "react";
 import { tv as j } from "tailwind-variants";
 function F({
-  checked: g = !1,
-  label: c,
-  description: u,
-  color: l = "yellow",
-  disabled: i = !1,
-  onChange: o,
-  ...r
+  checked: r = !1,
+  label: o,
+  description: i,
+  color: a = "yellow",
+  disabled: t = !1,
+  onChange: c,
+  ...n
 }) {
-  const [a, n] = C(g), b = j({
+  const [b, u] = C(r), h = j({
     slots: {
-      base: "uog:flex uog:flex-col uog:gap-0.5 uog:cursor-pointer",
-      container: "uog:flex uog:items-center uog:gap-2",
-      box: "uog:group uog:rounded uog:flex uog:size-4 uog:items-center uog:justify-center uog:border uog:bg-white uog:p-3 uog:transition-colors uog:focus-visible:ring-2 uog:focus-visible:ring-offset-2 uog:focus-visible:outline-none",
-      check: "uog:h-5 uog:w-5 uog:opacity-0 uog:transition-opacity uog:group-ui-checked:opacity-100 uog:user-select-none",
-      label: "uog:text-body-copy",
-      description: "uog:text-sm uog:text-grey-dark"
+      base: "flex cursor-pointer flex-col gap-0.5",
+      container: "flex items-center gap-2",
+      box: "group flex size-4 items-center justify-center rounded border bg-white p-3 transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
+      check: "group-ui-checked:opacity-100 user-select-none h-5 w-5 opacity-0 transition-opacity",
+      label: "text-body-copy",
+      description: "text-sm text-grey-dark"
     },
     variants: {
       color: {
         yellow: {
-          box: "uog:focus-visible:ring-yellow uog:ui-checked:bg-yellow",
-          check: "uog:text-yellow-contrast"
+          box: "ui-checked:bg-yellow focus-visible:ring-yellow",
+          check: "text-yellow-contrast"
         },
         blue: {
-          box: "uog:focus-visible:ring-blue uog:ui-checked:bg-blue",
-          check: "uog:text-blue-contrast"
+          box: "ui-checked:bg-blue focus-visible:ring-blue",
+          check: "text-blue-contrast"
         },
         green: {
-          box: "uog:focus-visible:ring-green uog:ui-checked:bg-green",
-          check: "uog:text-green-contrast"
+          box: "ui-checked:bg-green focus-visible:ring-green",
+          check: "text-green-contrast"
         },
         black: {
-          box: "uog:focus-visible:ring-black uog:ui-checked:bg-black",
-          check: "uog:text-black-contrast"
+          box: "ui-checked:bg-black focus-visible:ring-black",
+          check: "text-black-contrast"
         },
         white: {
-          box: "uog:focus-visible:ring-white uog:ui-checked:bg-white",
-          check: "uog:text-white-contrast"
+          box: "ui-checked:bg-white focus-visible:ring-white",
+          check: "text-white-contrast"
         }
       },
       disabled: {
         true: {
-          base: "uog:opacity-60",
-          label: "uog:text-grey-dark"
+          base: "opacity-60",
+          label: "text-grey-dark"
         },
         false: {}
       }
     }
   }), {
-    base: h,
-    container: x,
-    box: f,
-    check: k,
-    label: d,
+    base: x,
+    container: f,
+    box: k,
+    check: d,
+    label: g,
     description: m
-  } = b({ color: l, disabled: i });
-  return /* @__PURE__ */ s(w, { className: `uofg-checkbox-field ${h()}`, children: [
-    /* @__PURE__ */ s("div", { className: `uofg-checkbox-container ${x()}`, children: [
+  } = h({ color: a, disabled: t });
+  return /* @__PURE__ */ l(w, { className: `uofg-checkbox-field ${x()}`, children: [
+    /* @__PURE__ */ l("div", { className: `uofg-checkbox-container ${f()}`, children: [
       /* @__PURE__ */ e(
         v,
         {
-          checked: a,
-          onChange: (t) => {
-            n(t), o == null || o(t);
+          checked: b,
+          onChange: (s) => {
+            u(s), c == null || c(s);
           },
-          disabled: i,
-          className: `uofg-checkbox ${f()}`,
-          ...r,
-          children: /* @__PURE__ */ e(y, { className: `uofg-checkbox-icon ${k()}`, icon: p })
+          disabled: t,
+          className: `uofg-checkbox ${k()}`,
+          ...n,
+          children: /* @__PURE__ */ e(y, { className: `uofg-checkbox-icon ${d()}`, icon: p })
         }
       ),
-      c && /* @__PURE__ */ e(N, { className: `uofg-checkbox-label ${d()}`, children: c })
+      o && /* @__PURE__ */ e(N, { className: `uofg-checkbox-label ${g()}`, children: o })
     ] }),
-    u && /* @__PURE__ */ e($, { className: `uofg-checkbox-description ${m()}`, children: u })
+    i && /* @__PURE__ */ e($, { className: `uofg-checkbox-description ${m()}`, children: i })
   ] });
 }
 F.displayName = "Checkbox";

package/dist/contact-email.js

@@ -2,12 +2,12 @@ import { jsxs as a, jsx as t } from "react/jsx-runtime";
 import { g as r } from "./regular-DmWV6rTj.js";
 import { FontAwesomeIcon as s } from "@fortawesome/react-fontawesome";
 import { twMerge as l } from "tailwind-merge";
-import { tv as u } from "tailwind-variants";
-function m({ email: o, className: n }) {
-  const i = u({
+import { tv as m } from "tailwind-variants";
+function f({ email: o, className: n }) {
+  const i = m({
     slots: {
-      container: "uog:flex uog:items-center uog:gap-1",
-      link: "uog:underline uog:decoration-current uog:hocus-visible:decoration-transparent uog:transition-colors uog:text-body-copy-link-on-light uog:focus-visible:ring-2 uog:focus-visible:ring-offset-2 uog:focus-visible:outline-none"
+      container: "flex items-center gap-1",
+      link: "text-body-copy-link-on-light underline decoration-current transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none hocus-visible:decoration-transparent"
     }
   }), { container: e, link: c } = i();
   return /* @__PURE__ */ a("div", { className: `uofg-contact-email-container ${l(e(), n)}`, children: [
@@ -15,7 +15,7 @@ function m({ email: o, className: n }) {
     /* @__PURE__ */ t("a", { className: `uofg-contact-email ${c()}`, href: `mailto:${o}`, children: o })
   ] });
 }
-m.displayName = "ContactEmail";
+f.displayName = "ContactEmail";
 export {
-  m as ContactEmail
+  f as ContactEmail
 };

package/dist/contact-name.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
 import { twMerge as e } from "tailwind-merge";
 function m({ children: o, className: t }) {
-  const a = e("uog:text-body-copy-bold-on-light uog:font-bold", t);
+  const a = e("font-bold text-body-copy-bold-on-light", t);
   return /* @__PURE__ */ n("span", { className: `uofg-contact-name ${a}`, children: o });
 }
 m.displayName = "ContactName";

package/dist/contact-phone.js

@@ -1,17 +1,17 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import { d as a } from "./solid-D19hAF5t.js";
-import { FontAwesomeIcon as u } from "@fortawesome/react-fontawesome";
-import { twMerge as l } from "tailwind-merge";
-import { tv as g } from "tailwind-variants";
-function f({ number: o, extension: n, className: i }) {
-  const c = g({
+import { FontAwesomeIcon as l } from "@fortawesome/react-fontawesome";
+import { twMerge as f } from "tailwind-merge";
+import { tv as m } from "tailwind-variants";
+function p({ number: o, extension: n, className: i }) {
+  const c = m({
     slots: {
-      container: "uog:flex uog:items-center uog:gap-1",
-      link: "uog:underline uog:decoration-current uog:hocus-visible:decoration-transparent uog:transition-colors uog:text-body-copy-link-on-light uog:focus-visible:ring-2 uog:focus-visible:ring-offset-2 uog:focus-visible:outline-none"
+      container: "flex items-center gap-1",
+      link: "text-body-copy-link-on-light underline decoration-current transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none hocus-visible:decoration-transparent"
     }
   }), { container: r, link: s } = c();
-  return /* @__PURE__ */ t("div", { className: `uofg-contact-phone-container ${l(r(), i)}`, children: [
-    /* @__PURE__ */ e(u, { icon: a, className: "uofg-contact-phone-icon" }),
+  return /* @__PURE__ */ t("div", { className: `uofg-contact-phone-container ${f(r(), i)}`, children: [
+    /* @__PURE__ */ e(l, { icon: a, className: "uofg-contact-phone-icon" }),
     /* @__PURE__ */ e("a", { className: `uofg-contact-phone ${s()}`, href: `tel:${o}`, children: o }),
     n && /* @__PURE__ */ t("span", { className: "uofg-contact-phone-extension", children: [
       " - Ext. ",
@@ -19,7 +19,7 @@ function f({ number: o, extension: n, className: i }) {
     ] })
   ] });
 }
-f.displayName = "ContactPhone";
+p.displayName = "ContactPhone";
 export {
-  f as ContactPhone
+  p as ContactPhone
 };

package/dist/contact-title.js

@@ -1,7 +1,7 @@
 import { jsx as i } from "react/jsx-runtime";
 import { twMerge as n } from "tailwind-merge";
 function a({ children: t, className: o }) {
-  const e = n("uog:text-body-copy-on-light", o);
+  const e = n("text-body-copy-on-light", o);
   return /* @__PURE__ */ i("span", { className: `uofg-contact-title ${e}`, children: t });
 }
 a.displayName = "ContactTitle";

package/dist/contact.js

@@ -1,21 +1,18 @@
 import { jsx as r } from "react/jsx-runtime";
 import { twMerge as c } from "tailwind-merge";
-import { ContactEmail as p } from "./contact-email.js";
-import { ContactName as l } from "./contact-name.js";
-import { ContactPhone as x } from "./contact-phone.js";
-import { ContactTitle as s } from "./contact-title.js";
-function a({ children: o, className: t }) {
-  const e = c(
-    "uog:bg-grey-light-bg uog:mb-2 uog:flex uog:flex-col uog:p-4 uog:text-body-copy-on-light",
-    t
-  );
-  return /* @__PURE__ */ r("div", { className: `uofg-contact ${e}`, children: o });
+import { ContactEmail as i } from "./contact-email.js";
+import { ContactName as x } from "./contact-name.js";
+import { ContactPhone as C } from "./contact-phone.js";
+import { ContactTitle as b } from "./contact-title.js";
+function a({ children: t, className: o }) {
+  const e = c("mb-2 flex flex-col bg-grey-light-bg p-4 text-body-copy-on-light", o);
+  return /* @__PURE__ */ r("div", { className: `uofg-contact ${e}`, children: t });
 }
 a.displayName = "Contact";
 export {
   a as Contact,
-  p as ContactEmail,
-  l as ContactName,
-  x as ContactPhone,
-  s as ContactTitle
+  i as ContactEmail,
+  x as ContactName,
+  C as ContactPhone,
+  b as ContactTitle
 };

package/dist/container.js

@@ -1,16 +1,16 @@
-import { jsx as a } from "react/jsx-runtime";
-import { twMerge as m } from "tailwind-merge";
-const s = "div";
-function g({
-  as: o,
-  children: t,
+import { jsx as m } from "react/jsx-runtime";
+import { twMerge as s } from "tailwind-merge";
+const i = "div";
+function p({
+  as: t,
+  children: o,
   className: e,
   ...n
 }) {
-  const r = o ?? s, u = m("uog:max-w-[137rem] uog:w-full uog:px-4 uog:pt-2 uog:pb-4 uog:mx-auto", e);
-  return /* @__PURE__ */ a(r, { ...n, className: `uofg-container ${u}`, children: t });
+  const r = t ?? i, a = s("mx-auto w-full max-w-[137rem] px-4 pt-2 pb-4", e);
+  return /* @__PURE__ */ m(r, { ...n, className: `uofg-container ${a}`, children: o });
 }
-g.displayName = "Container";
+p.displayName = "Container";
 export {
-  g as Container
+  p as Container
 };

package/dist/dismissible-alert.js

@@ -797,13 +797,13 @@ var xr = Br();
 const Lr = /* @__PURE__ */ Ar(xr);
 function Or({ alert: O }) {
   const [sr, _] = hr(!0), C = pr(() => O ? Lr(O) : void 0, [O]), { dismissed: U, dismiss: S } = gr("app-armor-alert", C, "session");
-  return O && !U ? /* @__PURE__ */ Z(br, { open: sr, onClose: () => _(!1), children: /* @__PURE__ */ Z(wr, { className: "uog:max-w-[80rem]! uog:p-0", children: /* @__PURE__ */ tr(yr, { children: [
+  return O && !U ? /* @__PURE__ */ Z(br, { open: sr, onClose: () => _(!1), children: /* @__PURE__ */ Z(wr, { className: "max-w-[80rem]! p-0", children: /* @__PURE__ */ tr(yr, { children: [
     /* @__PURE__ */ Z(vr, { children: "University of Guelph Alert" }),
     /* @__PURE__ */ tr(_r, { children: [
       /* @__PURE__ */ Z(Er, { children: O.title }),
       O.description
     ] }),
-    /* @__PURE__ */ tr(Ir, { className: "uog:flex uog:flex-col uog:gap-4", children: [
+    /* @__PURE__ */ tr(Ir, { className: "flex flex-col gap-4", children: [
       /* @__PURE__ */ tr("span", { children: [
         "Last Updated: ",
         O.timestamp

package/dist/divider.js

@@ -1,30 +1,30 @@
-import { jsxs as e, Fragment as u, jsx as o } from "react/jsx-runtime";
-import { tv as c } from "tailwind-variants";
-const t = () => {
-  const l = c({
+import { jsxs as l, Fragment as i, jsx as e } from "react/jsx-runtime";
+import { tv as m } from "tailwind-variants";
+const n = () => {
+  const s = m({
     slots: {
-      base: "uog:mx-auto uog:my-7 uog:h-1 uog:w-3/4 uog:border-0 uog:flex",
-      red: "uog:bg-red",
-      yellow: "uog:bg-yellow",
-      black: "uog:bg-black",
-      hr: "uog:border-0"
+      base: "mx-auto my-7 flex h-1 w-3/4 border-0",
+      red: "bg-red",
+      yellow: "bg-yellow",
+      black: "bg-black",
+      hr: "border-0"
     },
     compoundSlots: [
       {
         slots: ["red", "yellow", "black"],
-        class: "uog:flex-1 uog:h-full"
+        class: "h-full flex-1"
       }
     ]
-  }), { base: s, red: r, yellow: a, black: d, hr: g } = l();
-  return /* @__PURE__ */ e(u, { children: [
-    /* @__PURE__ */ e("div", { className: `uofg-divider ${s()}`, children: [
-      /* @__PURE__ */ o("div", { className: r() }),
-      /* @__PURE__ */ o("div", { className: a() }),
-      /* @__PURE__ */ o("div", { className: d() })
+  }), { base: r, red: o, yellow: a, black: d, hr: c } = s();
+  return /* @__PURE__ */ l(i, { children: [
+    /* @__PURE__ */ l("div", { className: `uofg-divider ${r()}`, children: [
+      /* @__PURE__ */ e("div", { className: o() }),
+      /* @__PURE__ */ e("div", { className: a() }),
+      /* @__PURE__ */ e("div", { className: d() })
     ] }),
-    /* @__PURE__ */ o("hr", { className: g() })
+    /* @__PURE__ */ e("hr", { className: c() })
   ] });
 };
 export {
-  t as Divider
+  n as Divider
 };

package/dist/embedded-video-modal-button.js

@@ -1,26 +1,26 @@
 "use client";
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { g as i } from "./solid-D19hAF5t.js";
-import { FontAwesomeIcon as s } from "@fortawesome/react-fontawesome";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { g as s } from "./solid-D19hAF5t.js";
+import { FontAwesomeIcon as u } from "@fortawesome/react-fontawesome";
 import { useContext as m } from "react";
 import { twMerge as l } from "tailwind-merge";
 import { Button as a } from "./button.js";
-import { EmbeddedVideoContext as g } from "./embedded-video-context.js";
-function f({ type: t, children: r, className: u }) {
-  const o = m(g);
+import { EmbeddedVideoContext as f } from "./embedded-video-context.js";
+function c({ type: t, children: d, className: r }) {
+  const o = m(f);
   if (t === "play-button") {
-    const d = l(
-      "uog:flex uog:aspect-square uog:w-24 uog:items-center uog:justify-center uog:rounded-full uog:bg-red uog:text-4xl uog:text-white uog:transition-colors uog:hover:bg-red-focus uog:focus:bg-red-focus",
-      u
+    const n = l(
+      "flex aspect-square w-24 items-center justify-center rounded-full bg-red text-4xl text-white transition-colors hover:bg-red-focus focus:bg-red-focus",
+      r
     );
-    return /* @__PURE__ */ n(
+    return /* @__PURE__ */ i(
       "button",
       {
         type: "button",
-        className: `uofg-embedded-video-play-button ${d}`,
+        className: `uofg-embedded-video-play-button ${n}`,
         onClick: () => o == null ? void 0 : o.setModalOpen(!0),
         children: [
-          /* @__PURE__ */ e(s, { icon: i }),
+          /* @__PURE__ */ e(u, { icon: s }),
           /* @__PURE__ */ e("span", { className: "sr-only", children: "Show Video" })
         ]
       }
@@ -31,13 +31,13 @@ function f({ type: t, children: r, className: u }) {
     {
       type: "button",
       color: t,
-      className: `uofg-embedded-video-play-button ${u}`,
+      className: `uofg-embedded-video-play-button ${r}`,
       onClick: () => o == null ? void 0 : o.setModalOpen(!0),
-      children: r
+      children: d
     }
   );
 }
-f.displayName = "EmbeddedVideoModalButton";
+c.displayName = "EmbeddedVideoModalButton";
 export {
-  f as EmbeddedVideoModalButton
+  c as EmbeddedVideoModalButton
 };

package/dist/embedded-video.js

@@ -1,13 +1,13 @@
 "use client";
-import { jsxs as c, Fragment as p, jsx as n } from "react/jsx-runtime";
-import { useState as w } from "react";
+import { jsxs as m, Fragment as w, jsx as n } from "react/jsx-runtime";
+import { useState as g } from "react";
 import { twMerge as f } from "tailwind-merge";
-import { tv as g } from "tailwind-variants";
+import { tv as b } from "tailwind-variants";
 import { Button as h } from "./button.js";
 import { Modal as x } from "./modal.js";
 import { EmbeddedVideoContext as y } from "./embedded-video-context.js";
 import { EmbeddedVideoModalButton as D } from "./embedded-video-modal-button.js";
-function b(l) {
+function v(l) {
   var t;
   if (!(l instanceof URL))
     return null;
@@ -23,7 +23,7 @@ function b(l) {
     case "live":
       return (e == null ? void 0 : e[1]) ?? null;
     case "oembed":
-      return b(new URL(decodeURIComponent(l.searchParams.get("url") ?? "")));
+      return v(new URL(decodeURIComponent(l.searchParams.get("url") ?? "")));
     case "attribution_link":
       return null;
     default:
@@ -39,24 +39,24 @@ function N(l) {
   let e = null, t = null;
   try {
     const o = new URL(l);
-    o != null && o.hostname.includes("youtube") || o != null && o.hostname.includes("youtu.be") ? (e = "youtube", t = b(o)) : o != null && o.hostname.includes("vimeo") && (e = "vimeo", t = V(o));
+    o != null && o.hostname.includes("youtube") || o != null && o.hostname.includes("youtu.be") ? (e = "youtube", t = v(o)) : o != null && o.hostname.includes("vimeo") && (e = "vimeo", t = V(o));
   } catch {
   }
   return { type: e, id: t };
 }
-function m({ src: l, title: e, transcript: t, className: o }) {
-  const { id: i, type: d } = N(l), u = g({
+function u({ src: l, title: e, transcript: t, className: o }) {
+  const { id: i, type: d } = N(l), r = b({
     slots: {
-      base: f("uog:flex uog:flex-col", o),
-      iframe: "uog:w-full uog:h-full uog:aspect-video",
-      transcriptButton: "uog:p-3 uog:w-full"
+      base: f("flex flex-col", o),
+      iframe: "aspect-video h-full w-full",
+      transcriptButton: "w-full p-3"
     }
-  }), { base: s, iframe: r, transcriptButton: a } = u();
-  return /* @__PURE__ */ c("div", { className: s(), children: [
+  }), { base: a, iframe: s, transcriptButton: c } = r();
+  return /* @__PURE__ */ m("div", { className: a(), children: [
     d === "youtube" && i && /* @__PURE__ */ n(
       "iframe",
       {
-        className: r(),
+        className: s(),
         allowFullScreen: !0,
         src: `https://www.youtube.com/embed/${i}`,
         title: e ?? "YouTube Embedded Video Player"
@@ -65,42 +65,42 @@ function m({ src: l, title: e, transcript: t, className: o }) {
     d === "vimeo" && i && /* @__PURE__ */ n(
       "iframe",
       {
-        className: r(),
+        className: s(),
         allowFullScreen: !0,
         src: `https://player.vimeo.com/video/${i}`,
         title: e ?? "Vimeo Embedded Video Player"
       }
     ),
-    t && /* @__PURE__ */ n(h, { as: "a", color: "black", className: a(), href: t, download: !0, children: "Download Transcript" })
+    t && /* @__PURE__ */ n(h, { as: "a", color: "black", className: c(), href: t, download: !0, children: "Download Transcript" })
   ] });
 }
 function E({ src: l, title: e, transcript: t, className: o, children: i }) {
-  const [d, u] = w(!1);
+  const [d, r] = g(!1);
   if (i) {
-    const s = g({
+    const a = b({
       slots: {
-        container: "uog:bg-grey-dark-bg uog:flex uog:w-screen uog:max-w-6xl uog:lg:max-w-7xl uog:flex-col uog:gap-4 uog:p-4 uog:text-grey-dark-contrast",
-        video: "uog:w-full",
-        title: "uog:text-xl uog:font-bold"
+        container: "flex w-screen max-w-6xl flex-col gap-4 bg-grey-dark-bg p-4 text-grey-dark-contrast lg:max-w-7xl",
+        video: "w-full",
+        title: "text-xl font-bold"
       }
-    }), { container: r, video: a, title: v } = s();
-    return /* @__PURE__ */ c(p, { children: [
-      /* @__PURE__ */ n(y.Provider, { value: { modalOpen: d, setModalOpen: u }, children: i }),
-      /* @__PURE__ */ n(x, { open: d, onClose: () => u(!1), children: /* @__PURE__ */ c("div", { className: `uofg-embedded-video-container ${r()}`, children: [
-        /* @__PURE__ */ n("span", { className: `uofg-embedded-video-title ${v()}`, children: e }),
+    }), { container: s, video: c, title: p } = a();
+    return /* @__PURE__ */ m(w, { children: [
+      /* @__PURE__ */ n(y.Provider, { value: { modalOpen: d, setModalOpen: r }, children: i }),
+      /* @__PURE__ */ n(x, { open: d, onClose: () => r(!1), children: /* @__PURE__ */ m("div", { className: `uofg-embedded-video-container ${s()}`, children: [
+        /* @__PURE__ */ n("span", { className: `uofg-embedded-video-title ${p()}`, children: e }),
         /* @__PURE__ */ n(
-          m,
+          u,
           {
             src: l,
             title: e,
             transcript: t,
-            className: `uofg-embedded-video ${f(a(), o)}`
+            className: `uofg-embedded-video ${f(c(), o)}`
           }
         )
       ] }) })
     ] });
   }
-  return /* @__PURE__ */ n(m, { src: l, title: e, transcript: t, className: `uofg-embedded-video ${o}` });
+  return /* @__PURE__ */ n(u, { src: l, title: e, transcript: t, className: `uofg-embedded-video ${o}` });
 }
 E.displayName = "EmbeddedVideo";
 export {

package/dist/hero-caption.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as t } from "react/jsx-runtime";
 function r({ children: o, className: e }) {
-  return /* @__PURE__ */ t("p", { className: `uofg-hero-caption uog:text-xl ${e}`, children: o });
+  return /* @__PURE__ */ t("p", { className: `uofg-hero-caption text-xl ${e}`, children: o });
 }
 r.displayName = "HeroCaption";
 export {

package/dist/hero-content.js

@@ -1,48 +1,48 @@
 "use client";
-import { jsx as t } from "react/jsx-runtime";
-import { useContext as n } from "react";
-import { tv as i } from "tailwind-variants";
-import { Container as m } from "./container.js";
-import { HeroContext as s } from "./hero-context.js";
-function p({ children: e, alignment: u = "left" }) {
-  const o = n(s), r = i({
+import { jsx as e } from "react/jsx-runtime";
+import { useContext as m } from "react";
+import { tv as s } from "tailwind-variants";
+import { Container as g } from "./container.js";
+import { HeroContext as p } from "./hero-context.js";
+function c({ children: r, alignment: l = "left" }) {
+  const t = m(p), o = s({
     slots: {
       base: "",
-      wrapper: "uog:lg:bg-black/80 uog:lg:backdrop-blur uog:flex uog:w-full uog:bg-black uog:p-7 uog:text-white",
-      container: "uog:mx-auto uog:flex uog:flex-col uog:gap-5"
+      wrapper: "flex w-full bg-black p-7 text-white lg:bg-black/80 lg:backdrop-blur",
+      container: "mx-auto flex flex-col gap-5"
     },
     variants: {
       variant: {
         spotlight: {
-          base: "uog:w-full uog:lg:absolute uog:lg:bottom-0 uog:lg:left-1/2 uog:lg:max-w-[137rem] uog:lg:-translate-x-1/2 uog:lg:p-4 uog:flex uog:items-center"
+          base: "flex w-full items-center lg:absolute lg:bottom-0 lg:left-1/2 lg:max-w-[137rem] lg:-translate-x-1/2 lg:p-4"
         },
         basic: {
-          base: "uog:absolute uog:bottom-0 uog:left-1/2 uog:w-full uog:-translate-x-1/2 uog:p-0 uog:flex uog:h-full uog:items-end"
+          base: "absolute bottom-0 left-1/2 flex h-full w-full -translate-x-1/2 items-end p-0"
         }
       },
       alignment: {
         left: {
-          wrapper: "uog:mr-auto uog:lg:max-w-[50%]"
+          wrapper: "mr-auto lg:max-w-[50%]"
         },
         center: {
-          wrapper: "uog:mx-auto uog:lg:max-w-[50%]",
-          container: "uog:lg:text-center uog:lg:items-center",
-          link: "uog:lg:mx-auto"
+          wrapper: "mx-auto lg:max-w-[50%]",
+          container: "lg:items-center lg:text-center",
+          link: "lg:mx-auto"
         },
         right: {
-          wrapper: "uog:ml-auto uog:lg:max-w-[50%]",
-          container: "uog:lg:text-right uog:lg:items-end",
-          link: "uog:lg:ml-auto"
+          wrapper: "ml-auto lg:max-w-[50%]",
+          container: "lg:items-end lg:text-right",
+          link: "lg:ml-auto"
         },
         fullWidth: {
-          wrapper: "uog:mx-auto"
+          wrapper: "mx-auto"
         }
       }
     }
-  }), { base: g, wrapper: a, container: l } = r({ alignment: u, variant: o == null ? void 0 : o.variant });
-  return (o == null ? void 0 : o.variant) === "spotlight" ? /* @__PURE__ */ t("div", { className: `uofg-hero-content ${g()}`, children: /* @__PURE__ */ t("div", { className: `uofg-hero-content-wrapper ${a()}`, children: /* @__PURE__ */ t("div", { className: `uofg-hero-content-container ${l()}`, children: e }) }) }) : /* @__PURE__ */ t(m, { className: `uofg-hero-content ${g()}`, children: e });
+  }), { base: a, wrapper: n, container: i } = o({ alignment: l, variant: t == null ? void 0 : t.variant });
+  return (t == null ? void 0 : t.variant) === "spotlight" ? /* @__PURE__ */ e("div", { className: `uofg-hero-content ${a()}`, children: /* @__PURE__ */ e("div", { className: `uofg-hero-content-wrapper ${n()}`, children: /* @__PURE__ */ e("div", { className: `uofg-hero-content-container ${i()}`, children: r }) }) }) : /* @__PURE__ */ e(g, { className: `uofg-hero-content ${a()}`, children: r });
 }
-p.displayName = "HeroContent";
+c.displayName = "HeroContent";
 export {
-  p as HeroContent
+  c as HeroContent
 };

package/dist/hero-link.js

@@ -16,7 +16,7 @@ function l({
       as: o ?? "a",
       color: "yellow",
       href: e,
-      className: `uofg-hero-link ${m("uog:p-3 uog:w-fit", t)}`,
+      className: `uofg-hero-link ${m("w-fit p-3", t)}`,
       children: r
     }
   );