@uoguelph/react-components 1.2.11 → 1.2.13

package/dist/radio-group.js

@@ -1,11 +1,11 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import { RadioGroup as d } from "@headlessui/react";
-import { useState as c, useMemo as f } from "react";
+import { useState as f, useMemo as c } from "react";
 import { tv as n } from "tailwind-variants";
 import { RadioContext as x } from "./radio-context.js";
-import { Radio as y } from "./radio.js";
-function R({ name: s, inline: a = !1, onChange: o, children: i }) {
-  const [l, e] = c(null), m = f(() => ({ setSelected: e }), [e]), u = n({
+import { Radio as j } from "./radio.js";
+function R({ name: a, inline: s = !1, onChange: o, children: i }) {
+  const [l, e] = f(null), u = c(() => ({ setSelected: e }), [e]), m = n({
     slots: {
       base: "uog:flex uog:gap-2"
     },
@@ -16,22 +16,22 @@ function R({ name: s, inline: a = !1, onChange: o, children: i }) {
         }
       }
     }
-  }), { base: p } = u({ inline: a });
-  return /* @__PURE__ */ r(
+  }), { base: p } = m({ inline: s });
+  return /* @__PURE__ */ t(
     d,
     {
-      name: s,
+      name: a,
       value: l,
-      onChange: (t) => {
-        e(t), o == null || o(t);
+      onChange: (r) => {
+        e(r), o == null || o(r);
       },
-      className: p(),
-      children: /* @__PURE__ */ r(x.Provider, { value: m, children: i })
+      className: `uofg-radio-group ${p()}`,
+      children: /* @__PURE__ */ t(x.Provider, { value: u, children: i })
     }
   );
 }
 R.displayName = "RadioGroup";
 export {
-  y as Radio,
+  j as Radio,
   R as RadioGroup
 };

package/dist/radio.js

@@ -1,9 +1,9 @@
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import { Field as n, Radio as d, Label as f } from "@headlessui/react";
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { Field as d, Radio as f, Label as n } from "@headlessui/react";
 import { useContext as m, useEffect as b, Fragment as p } from "react";
 import { tv as h } from "tailwind-variants";
 import { RadioContext as x } from "./radio-context.js";
-function k({ selected: i, children: u, value: r }) {
+function j({ selected: i, children: u, value: r }) {
   const o = m(x);
   b(() => {
     i && (o == null || o.setSelected(r));
@@ -25,12 +25,12 @@ function k({ selected: i, children: u, value: r }) {
         }
       }
     }
-  }), { field: l, radio: g, circle: t } = a();
-  return /* @__PURE__ */ c(n, { className: l(), children: [
-    /* @__PURE__ */ e(d, { value: r, as: p, children: ({ checked: s }) => /* @__PURE__ */ e("span", { className: g({ checked: s }), children: /* @__PURE__ */ e("span", { className: t({ checked: s }) }) }) }),
-    /* @__PURE__ */ e(f, { children: u })
+  }), { field: l, radio: g, circle: c } = a();
+  return /* @__PURE__ */ t(d, { className: `uofg-radio-field ${l()}`, children: [
+    /* @__PURE__ */ e(f, { value: r, as: p, children: ({ checked: s }) => /* @__PURE__ */ e("span", { className: `uofg-radio ${g({ checked: s })}`, children: /* @__PURE__ */ e("span", { className: `uofg-radio-circle ${c({ checked: s })}` }) }) }),
+    /* @__PURE__ */ e(n, { className: "uofg-radio-label", children: u })
   ] });
 }
 export {
-  k as Radio
+  j as Radio
 };

package/dist/statistics-item-image.js

@@ -10,8 +10,18 @@ function f({
   className: o,
   ...c
 }) {
-  const n = e ?? g, l = r("uofg-statistics-item-image uog:w-full", o);
-  return /* @__PURE__ */ t("dd", { className: "contents", children: /* @__PURE__ */ t(n, { src: s, alt: m, width: a, height: i, className: l, ...c }) });
+  const n = e ?? g, l = r("uog:w-full", o);
+  return /* @__PURE__ */ t("dd", { className: "contents", children: /* @__PURE__ */ t(
+    n,
+    {
+      src: s,
+      alt: m,
+      width: a,
+      height: i,
+      className: `uofg-statistics-item-image ${l}`,
+      ...c
+    }
+  ) });
 }
 f.displayName = "StatisticsItemImage";
 export {

package/dist/statistics-item-represents.js

@@ -1,11 +1,8 @@
 import { jsx as o } from "react/jsx-runtime";
 import { twMerge as r } from "tailwind-merge";
 function i({ children: t, className: e }) {
-  const s = r(
-    "uofg-statistics-item-represents uog:text-normal uog:p-6 uog:pt-0 uog:text-lg uog:font-normal",
-    e
-  );
-  return /* @__PURE__ */ o("dd", { className: s, children: t });
+  const s = r("uog:text-normal uog:p-6 uog:pt-0 uog:text-lg uog:font-normal", e);
+  return /* @__PURE__ */ o("dd", { className: `uofg-statistics-item-represents ${s}`, children: t });
 }
 i.displayName = "StatisticsItemRepresents";
 export {

package/dist/statistics-item-value.js

@@ -1,11 +1,8 @@
 import { jsx as s } from "react/jsx-runtime";
 import { twMerge as a } from "tailwind-merge";
 function i({ children: t, className: o }) {
-  const e = a(
-    "uofg-statistics-item-value uog:break-auto uog:p-6 uog:pb-0 uog:text-3xl uog:leading-tight uog:font-bold",
-    o
-  );
-  return /* @__PURE__ */ s("dt", { className: e, children: t });
+  const e = a("uog:break-auto uog:p-6 uog:pb-0 uog:text-3xl uog:leading-tight uog:font-bold", o);
+  return /* @__PURE__ */ s("dt", { className: `uofg-statistics-item-value ${e}`, children: t });
 }
 i.displayName = "StatisticsItemValue";
 export {

package/dist/statistics-item.js

@@ -9,7 +9,7 @@ function n({ children: t, className: r }) {
     o == null || o.incrementCount();
   }, []);
   const e = a({
-    base: "uofg-statistics-item uog:relative uog:flex uog:flex-1 uog:flex-col uog:justify-around uog:gap-2",
+    base: "uog:relative uog:flex uog:flex-1 uog:flex-col uog:justify-around uog:gap-2",
     variants: {
       variant: {
         "solid-colors-full": [
@@ -53,7 +53,7 @@ function n({ children: t, className: r }) {
       }
     ]
   });
-  return /* @__PURE__ */ l("div", { className: s(e({ variant: o == null ? void 0 : o.variant }), r), children: t });
+  return /* @__PURE__ */ l("div", { className: `uofg-statistics-item ${s(e({ variant: o == null ? void 0 : o.variant }), r)}`, children: t });
 }
 n.displayName = "StatisticsItem";
 export {

package/dist/statistics.js

@@ -1,16 +1,16 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useState as d } from "react";
-import { twMerge as a } from "tailwind-merge";
-import { tv as m } from "tailwind-variants";
-import { u as f } from "./use-resize-observer-DmddO4OQ.js";
-import { StatisticsContext as n } from "./statistics-context.js";
-import { StatisticsItem as T } from "./statistics-item.js";
+import { jsx as e } from "react/jsx-runtime";
+import { useState as a } from "react";
+import { twMerge as m } from "tailwind-merge";
+import { tv as f } from "tailwind-variants";
+import { u as n } from "./use-resize-observer-DmddO4OQ.js";
+import { StatisticsContext as p } from "./statistics-context.js";
+import { StatisticsItem as I } from "./statistics-item.js";
 import { StatisticsItemImage as F } from "./statistics-item-image.js";
-import { StatisticsItemRepresents as R } from "./statistics-item-represents.js";
-import { StatisticsItemValue as V } from "./statistics-item-value.js";
-function p({ children: e, variant: o, className: r }) {
-  const [i, l] = d(0), [u, s] = f(), g = m({
-    base: "uofg-statistics uog:mx-auto uog:my-0 uog:flex uog:flex-col uog:flex-wrap uog:sm:flex-row",
+import { StatisticsItemRepresents as N } from "./statistics-item-represents.js";
+import { StatisticsItemValue as j } from "./statistics-item-value.js";
+function v({ children: t, variant: o, className: r }) {
+  const [s, l] = a(0), [u, i] = n(), g = f({
+    base: "uog:mx-auto uog:my-0 uog:flex uog:flex-col uog:flex-wrap uog:sm:flex-row",
     variants: {
       divisibleByTwo: {
         true: ""
@@ -46,42 +46,42 @@ function p({ children: e, variant: o, className: r }) {
         class: "uog:grid uog:grid-cols-1 uog:sm:grid-cols-3"
       }
     ]
-  });
-  return /* @__PURE__ */ t(
-    n.Provider,
+  }), c = m(
+    g({
+      variant: o,
+      divisibleByTwo: s % 2 === 0,
+      divisibleByThree: s % 3 === 0,
+      divisibleByFour: s % 4 === 0
+    }),
+    r
+  );
+  return /* @__PURE__ */ e(
+    p.Provider,
     {
       value: {
         variant: o,
-        incrementCount: () => l((c) => c + 1)
+        incrementCount: () => l((d) => d + 1)
       },
-      children: /* @__PURE__ */ t(
+      children: /* @__PURE__ */ e(
         "dl",
         {
-          className: a(
-            g({
-              variant: o,
-              divisibleByTwo: i % 2 === 0,
-              divisibleByThree: i % 3 === 0,
-              divisibleByFour: i % 4 === 0
-            }),
-            r
-          ),
+          className: `uofg-statistics ${c}`,
           style: (
             /* @ts-expect-error TypeScript doesn't like CSS Variables */
-            o === "solid-colors-full" ? { "--statistic-bg-width": (s == null ? void 0 : s.contentRect.width) + "px" } : void 0
+            o === "solid-colors-full" ? { "--statistic-bg-width": (i == null ? void 0 : i.contentRect.width) + "px" } : void 0
           ),
           ref: u,
-          children: e
+          children: t
         }
       )
     }
   );
 }
-p.displayName = "Statistics";
+v.displayName = "Statistics";
 export {
-  p as Statistics,
-  T as StatisticsItem,
+  v as Statistics,
+  I as StatisticsItem,
   F as StatisticsItemImage,
-  R as StatisticsItemRepresents,
-  V as StatisticsItemValue
+  N as StatisticsItemRepresents,
+  j as StatisticsItemValue
 };

package/dist/story-background-image.js

@@ -10,8 +10,18 @@ function f({
   className: n,
   ...s
 }) {
-  const a = o ?? l, m = c("uofg-story-background-image uog:h-full uog:w-full uog:brightness-50", n);
-  return /* @__PURE__ */ u(a, { ...s, src: t, alt: e, width: r, height: g, className: m });
+  const a = o ?? l, m = c("uog:h-full uog:w-full uog:brightness-50", n);
+  return /* @__PURE__ */ u(
+    a,
+    {
+      ...s,
+      src: t,
+      alt: e,
+      width: r,
+      height: g,
+      className: `uofg-story-background-image ${m}`
+    }
+  );
 }
 f.displayName = "StoryBackgroundImage";
 export {

package/dist/story-background.js

@@ -1,8 +1,8 @@
 import { jsx as t } from "react/jsx-runtime";
 import { twMerge as a } from "tailwind-merge";
 function g({ children: o, className: u }) {
-  const r = a("uofg-story-background uog:absolute uog:z-0 uog:h-full uog:max-h-full uog:w-full", u);
-  return /* @__PURE__ */ t("div", { className: r, children: o });
+  const r = a("uog:absolute uog:z-0 uog:h-full uog:max-h-full uog:w-full", u);
+  return /* @__PURE__ */ t("div", { className: `uofg-story-background ${r}`, children: o });
 }
 g.displayName = "StoryBackground";
 export {

package/dist/story-body.js

@@ -2,10 +2,10 @@ import { jsx as t } from "react/jsx-runtime";
 import { twMerge as s } from "tailwind-merge";
 function u({ children: o, className: e }) {
   const r = s(
-    "uofg-story-body uog:relative uog:flex uog:w-full uog:items-center uog:justify-center uog:overflow-hidden",
+    "uog:relative uog:flex uog:w-full uog:items-center uog:justify-center uog:overflow-hidden",
     e
   );
-  return /* @__PURE__ */ t("div", { className: r, children: o });
+  return /* @__PURE__ */ t("div", { className: `uofg-story-body ${r}`, children: o });
 }
 u.displayName = "StoryBody";
 export {

package/dist/story-footer.js

@@ -5,11 +5,11 @@ import { Container as g } from "./container.js";
 function c({ children: t, className: e }) {
   const r = i({
     slots: {
-      base: "uofg-story-footer uog:flex uog:w-full uog:items-center uog:justify-center uog:bg-black uog:p-4 uog:text-white",
-      container: "uofg-story-footer-container uog:flex uog:items-center uog:justify-center uog:p-2 uog:text-xl"
+      base: "uog:flex uog:w-full uog:items-center uog:justify-center uog:bg-black uog:p-4 uog:text-white",
+      container: "uog:flex uog:items-center uog:justify-center uog:p-2 uog:text-xl"
     }
   }), { base: s, container: u } = r();
-  return /* @__PURE__ */ o("div", { className: n(s(), e), children: /* @__PURE__ */ o(g, { className: u(), children: t }) });
+  return /* @__PURE__ */ o("div", { className: `uofg-story-footer ${n(s(), e)}`, children: /* @__PURE__ */ o(g, { className: `uofg-story-footer-container ${u()}`, children: t }) });
 }
 c.displayName = "StoryFooter";
 export {

package/dist/story-foreground-content.js

@@ -1,11 +1,8 @@
 import { jsx as e } from "react/jsx-runtime";
 import { twMerge as n } from "tailwind-merge";
 function u({ children: o, className: r }) {
-  const t = n(
-    "uofg-story-foreground-content uog:flex uog:w-full uog:justify-center uog:px-8 uog:lg:w-1/2 uog:lg:p-0",
-    r
-  );
-  return /* @__PURE__ */ e("div", { className: t, children: o });
+  const t = n("uog:flex uog:w-full uog:justify-center uog:px-8 uog:lg:w-1/2 uog:lg:p-0", r);
+  return /* @__PURE__ */ e("div", { className: `uofg-story-foreground-content ${t}`, children: o });
 }
 u.displayName = "StoryForegroundContent";
 export {

package/dist/story-foreground-image.js

@@ -13,11 +13,21 @@ function p({
 }) {
   const a = e ?? d, n = c({
     slots: {
-      base: "uofg-story-foreground-image-container uog:flex uog:w-full uog:justify-center uog:lg:mt-auto uog:lg:w-1/2",
-      image: "uofg-story-foreground-image uog:w-full uog:h-full"
+      base: "uog:flex uog:w-full uog:justify-center uog:lg:mt-auto uog:lg:w-1/2",
+      image: "uog:w-full uog:h-full"
     }
   }), { base: l, image: f } = n();
-  return /* @__PURE__ */ o("div", { className: l(), children: /* @__PURE__ */ o(a, { ...m, src: r, alt: t, width: g, height: u, className: i(f(), s) }) });
+  return /* @__PURE__ */ o("div", { className: `uofg-story-foreground-image-container ${l()}`, children: /* @__PURE__ */ o(
+    a,
+    {
+      ...m,
+      src: r,
+      alt: t,
+      width: g,
+      height: u,
+      className: `uofg-story-foreground-image ${i(f(), s)}`
+    }
+  ) });
 }
 p.displayName = "StoryForegroundImage";
 export {

package/dist/story-foreground.js

@@ -2,10 +2,10 @@ import { jsx as g } from "react/jsx-runtime";
 import { twMerge as u } from "tailwind-merge";
 function t({ children: o, className: r }) {
   const e = u(
-    "uofg-story-foreground uog:max-w-[137rem] uog:z-10 uog:flex uog:w-full uog:flex-col uog:items-center uog:gap-6 uog:px-4 uog:lg:flex-row",
+    "uog:max-w-[137rem] uog:z-10 uog:flex uog:w-full uog:flex-col uog:items-center uog:gap-6 uog:px-4 uog:lg:flex-row",
     r
   );
-  return /* @__PURE__ */ g("div", { className: e, children: o });
+  return /* @__PURE__ */ g("div", { className: `uofg-story-foreground ${e}`, children: o });
 }
 t.displayName = "StoryForeground";
 export {

package/dist/story.js

@@ -8,8 +8,8 @@ import { StoryForeground as i } from "./story-foreground.js";
 import { StoryForegroundContent as B } from "./story-foreground-content.js";
 import { StoryForegroundImage as w } from "./story-foreground-image.js";
 function f({ children: o, className: r }) {
-  const t = m("uofg-story uog:flex uog:w-full uog:flex-col", r);
-  return /* @__PURE__ */ e("div", { className: t, children: o });
+  const t = m("uog:flex uog:w-full uog:flex-col", r);
+  return /* @__PURE__ */ e("div", { className: `uofg-story ${t}`, children: o });
 }
 f.displayName = "Story";
 export {

package/dist/tab-list.js

@@ -1,12 +1,12 @@
-import { jsx as t } from "react/jsx-runtime";
-import { TabList as e } from "@headlessui/react";
-import { twMerge as a } from "tailwind-merge";
-function l({ children: o, className: r }) {
-  const s = a(
+import { jsx as s } from "react/jsx-runtime";
+import { TabList as a } from "@headlessui/react";
+import { twMerge as e } from "tailwind-merge";
+function l({ children: o, className: t }) {
+  const r = e(
     "uofg-tab-list uog:flex uog:gap-1 uog:border-b-4 uog:border-yellow uog:w-full uog:flex-col uog:md:flex-row",
-    r
+    t
   );
-  return /* @__PURE__ */ t(e, { className: s, children: o });
+  return /* @__PURE__ */ s(a, { className: `uofg-tab-list ${r}`, children: o });
 }
 l.displayName = "TabList";
 export {

package/dist/tab-panel.js

@@ -1,11 +1,11 @@
-import { jsx as r } from "react/jsx-runtime";
-import { TabPanel as n } from "@headlessui/react";
-import { twMerge as s } from "tailwind-merge";
-function t({ children: a, className: e }) {
-  const o = s("uofg-tab-panel uog:py-4", e);
-  return /* @__PURE__ */ r(n, { className: o, children: a });
+import { jsx as n } from "react/jsx-runtime";
+import { TabPanel as r } from "@headlessui/react";
+import { twMerge as t } from "tailwind-merge";
+function l({ children: a, className: e }) {
+  const o = t("uofg-tab-panel uog:py-4", e);
+  return /* @__PURE__ */ n(r, { className: `uofg-tab-panel ${o}`, children: a });
 }
-t.displayName = "TabPanel";
+l.displayName = "TabPanel";
 export {
-  t as TabPanel
+  l as TabPanel
 };

package/dist/tab-panels.js

@@ -1,9 +1,9 @@
 import { jsx as o } from "react/jsx-runtime";
-import { TabPanels as r } from "@headlessui/react";
-import { twMerge as n } from "tailwind-merge";
+import { TabPanels as n } from "@headlessui/react";
+import { twMerge as r } from "tailwind-merge";
 function t({ children: a, className: s }) {
-  const e = n("uofg-tab-panels", s);
-  return /* @__PURE__ */ o(r, { className: e, children: a });
+  const e = r("uofg-tab-panels", s);
+  return /* @__PURE__ */ o(n, { className: `uofg-tab-panels ${e}`, children: a });
 }
 t.displayName = "TabPanels";
 export {

package/dist/tab.js

@@ -23,7 +23,7 @@ function r({ children: o, className: e }) {
     "uog:flex-1",
     e
   );
-  return /* @__PURE__ */ u(t, { className: g, children: o });
+  return /* @__PURE__ */ u(t, { className: `uofg-tab ${g}`, children: o });
 }
 r.displayName = "Tab";
 export {

package/dist/tabs.js

@@ -1,19 +1,19 @@
 import { jsx as t } from "react/jsx-runtime";
-import { TabGroup as e } from "@headlessui/react";
-import { twMerge as s } from "tailwind-merge";
+import { TabGroup as s } from "@headlessui/react";
+import { twMerge as e } from "tailwind-merge";
 import { Tab as n } from "./tab.js";
 import { TabList as l } from "./tab-list.js";
-import { TabPanel as u } from "./tab-panel.js";
+import { TabPanel as c } from "./tab-panel.js";
 import { TabPanels as N } from "./tab-panels.js";
 function m({ children: o, className: r }) {
-  const a = s("uofg-tabs", r);
-  return /* @__PURE__ */ t(e, { className: a, children: o });
+  const a = e("uofg-tabs", r);
+  return /* @__PURE__ */ t(s, { className: `uofg-tabs ${a}`, children: o });
 }
 m.displayName = "Tabs";
 export {
   n as Tab,
   l as TabList,
-  u as TabPanel,
+  c as TabPanel,
   N as TabPanels,
   m as Tabs
 };

package/dist/text-input.js

@@ -1,18 +1,18 @@
-import { jsxs as s, jsx as u } from "react/jsx-runtime";
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import { h as w } from "./regular-DmWV6rTj.js";
 import { FontAwesomeIcon as h } from "@fortawesome/react-fontawesome";
 import { Field as v, Label as y, Input as N } from "@headlessui/react";
-import { useState as j, useRef as B } from "react";
-import { tv as E } from "tailwind-variants";
-function T({
-  initialValue: i = "",
+import { useState as $, useRef as j } from "react";
+import { tv as B } from "tailwind-variants";
+function O({
+  initialValue: s = "",
   type: c = "text",
   placeholder: a = "",
   onInput: n,
-  children: l,
+  children: i,
   ...g
 }) {
-  const [r, p] = j(i), e = B(null), m = E({
+  const [u, p] = $(s), e = j(null), f = B({
     slots: {
       base: "uog:flex uog:flex-col uog:gap-0.5",
       wrapper: "uog:text-input uog:border-grey-light uog:flex uog:rounded-md uog:border uog:px-4 uog:py-2 uog:transition-colors uog:focus-within:border-blue uog:focus:outline-none uog:bg-white",
@@ -26,41 +26,41 @@ function T({
         }
       }
     }
-  }), { base: f, wrapper: b, input: d, clearButton: x } = m({ empty: (r == null ? void 0 : r.length) === 0 });
-  return /* @__PURE__ */ s(v, { className: f(), children: [
-    l && /* @__PURE__ */ u(y, { children: l }),
-    /* @__PURE__ */ s("div", { className: b(), children: [
-      /* @__PURE__ */ u(
+  }), { base: m, wrapper: x, input: b, clearButton: d } = f({ empty: (u == null ? void 0 : u.length) === 0 });
+  return /* @__PURE__ */ l(v, { className: `uofg-text-input-field ${m()}`, children: [
+    i && /* @__PURE__ */ r(y, { className: "uofg-text-input-label", children: i }),
+    /* @__PURE__ */ l("div", { className: `uofg-text-input-wrapper ${x()}`, children: [
+      /* @__PURE__ */ r(
         N,
         {
           ...g,
           ref: e,
-          value: r,
+          value: u,
           type: c,
           placeholder: a,
           onInput: (t) => {
             var o;
             p((o = t == null ? void 0 : t.target) == null ? void 0 : o.value), n == null || n(t);
           },
-          className: d()
+          className: `uofg-text-input ${b()}`
         }
       ),
-      /* @__PURE__ */ u(
+      /* @__PURE__ */ r(
         "button",
         {
-          className: x(),
+          className: `uofg-text-input-clear-button ${d()}`,
           onClick: () => {
             var o;
             if (!e.current) return;
             const t = (o = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")) == null ? void 0 : o.set;
             t == null || t.call(e.current, ""), e.current.dispatchEvent(new Event("input", { bubbles: !0 })), e.current.focus();
           },
-          children: /* @__PURE__ */ u(h, { icon: w })
+          children: /* @__PURE__ */ r(h, { icon: w })
         }
       )
     ] })
   ] });
 }
 export {
-  T as TextInput
+  O as TextInput
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uoguelph/react-components",
-  "version": "1.2.11",
+  "version": "1.2.13",
   "description": "University of Guelph React Components Library",
   "type": "module",
   "scripts": {
@@ -40,7 +40,7 @@
     "react-animate-height": "^3.2.3",
     "react-dom": "^19.0.0",
     "tailwind-merge": "^3.0.1",
-    "tailwind-variants": "^0.3.1"
+    "tailwind-variants": "^1.0.0"
   },
   "devDependencies": {
     "@awesome.me/kit-7993323d0c": "^1.0.10",
@@ -68,7 +68,7 @@
     "react-animate-height": "^3.2.3",
     "react-dom": "^19.0.0",
     "tailwind-merge": "^3.0.1",
-    "tailwind-variants": "^0.3.1",
+    "tailwind-variants": "^1.0.0",
     "tailwindcss": "^4.0.6",
     "typescript": "~5.7.2",
     "typescript-eslint": "^8.22.0",
@@ -84,5 +84,5 @@
   "bugs": {
     "url": "https://github.com/ccswbs/uofg-components/issues"
   },
-  "gitHead": "25cd4b14ea6a4c36b417aac1a2b002a88e5ea120"
+  "gitHead": "d6c612240262aa418ea533d8abf435ab8b172036"
 }