@uoguelph/react-components 1.2.1 → 1.2.3

package/dist/select-button.js

@@ -0,0 +1,40 @@
+import { jsx as t, jsxs as m, Fragment as c } from "react/jsx-runtime";
+import { h as a } from "./solid-D4xgBves.js";
+import { FontAwesomeIcon as f } from "@fortawesome/react-fontawesome";
+import { ListboxButton as p } from "@headlessui/react";
+import { twMerge as l } from "tailwind-merge";
+import { tv as b } from "tailwind-variants";
+function d({ children: o, className: e, ...n }) {
+  const r = b({
+    slots: {
+      button: [
+        "uofg-select-button",
+        "ui-open:rounded-b-none",
+        "ui-open:border-blue",
+        "flex",
+        "w-full",
+        "items-center",
+        "justify-between",
+        "rounded-md",
+        "border",
+        "border-gray-300",
+        "bg-white",
+        "px-4",
+        "py-2",
+        "shadow-sm",
+        "transition-colors",
+        "group-focus-within:border-blue",
+        "group-focus-within:outline-none"
+      ],
+      icon: "ui-open:rotate-180 h-5 w-5 text-gray-400 transition-transform"
+    }
+  }), { button: s, icon: i } = r();
+  return /* @__PURE__ */ t(p, { ...n, className: l(s(), e), children: (u) => /* @__PURE__ */ m(c, { children: [
+    typeof o == "function" ? o(u) : o,
+    /* @__PURE__ */ t(f, { className: i(), icon: a })
+  ] }) });
+}
+d.displayName = "SelectButton";
+export {
+  d as SelectButton
+};

package/dist/select-option.d.ts

@@ -0,0 +1,2 @@
+export * from './components/select/select-option'
+export {}

package/dist/select-option.js

@@ -0,0 +1,48 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { d as l } from "./regular-23gOebKJ.js";
+import { FontAwesomeIcon as m } from "@fortawesome/react-fontawesome";
+import { ListboxOption as p } from "@headlessui/react";
+import { twMerge as f } from "tailwind-merge";
+import { tv as b } from "tailwind-variants";
+function x({ children: o, className: r, ...i }) {
+  const s = b({
+    slots: {
+      option: [
+        "uofg-select-option",
+        "uog:relative",
+        "uog:cursor-pointer",
+        "uog:select-none",
+        "uog:border-b",
+        "uog:border-gray-300",
+        "uog:px-4",
+        "uog:py-2",
+        "uog:text-gray-900",
+        "uog:transition-colors",
+        "uog:last:border-b-0",
+        "uog:hover:bg-gray-100",
+        "uog:focus:bg-gray-100",
+        "uog:focus:outline-none",
+        "uog:ui-active:bg-gray-100"
+      ],
+      icon: "uog:h-5 uog:w-5 uog:text-blue-600"
+    },
+    variants: {
+      selected: {
+        true: {
+          icon: "uog:visible"
+        },
+        false: {
+          icon: "uog:invisible"
+        }
+      }
+    }
+  }), { option: n, icon: u } = s();
+  return /* @__PURE__ */ e(p, { ...i, className: f(n(), r), children: ({ focus: g, selected: t, ...c }) => /* @__PURE__ */ a("div", { className: "flex items-center", children: [
+    /* @__PURE__ */ e("span", { className: "flex-1", children: typeof o == "function" ? o({ focus: g, selected: t, ...c }) : o }),
+    /* @__PURE__ */ e(m, { icon: l, className: u({ selected: t }) })
+  ] }) });
+}
+x.displayName = "SelectOptions";
+export {
+  x as SelectOption
+};

package/dist/select-options.d.ts

@@ -0,0 +1,2 @@
+export * from './components/select/select-options'
+export {}

package/dist/select-options.js

@@ -0,0 +1,31 @@
+import { jsx as t } from "react/jsx-runtime";
+import { ListboxOptions as g } from "@headlessui/react";
+import { twMerge as i } from "tailwind-merge";
+function s({ children: o, className: u, ...e }) {
+  const r = i(
+    "uog:z-10",
+    "uog:max-h-[20rem]",
+    "uog:w-full",
+    "uog:overflow-auto",
+    "uog:rounded-b-md",
+    "uog:border",
+    "uog:border-t-0",
+    "uog:border-gray-300",
+    "uog:bg-white",
+    "uog:shadow-md",
+    "uog:group-focus-within:border-blue",
+    "uog:group-focus-within:outline-none",
+    "uog:ui-open:border-blue",
+    "uog:md:absolute",
+    "uog:transition",
+    "uog:duration-300",
+    "uog:ease-out",
+    "uog:data-[closed]:opacity-0",
+    u
+  );
+  return /* @__PURE__ */ t(g, { ...e, className: r, children: o });
+}
+s.displayName = "SelectOptions";
+export {
+  s as SelectOptions
+};

package/dist/select.d.ts

@@ -0,0 +1,2 @@
+export * from './components/select/select'
+export {}

package/dist/select.js

@@ -0,0 +1,9 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Listbox as r } from "@headlessui/react";
+function i({ children: t, ...e }) {
+  return /* @__PURE__ */ o(r, { ...e, children: t });
+}
+i.displayName = "Select";
+export {
+  i as Select
+};

package/dist/{solid-DM6GVhkF.js → solid-D4xgBves.js}

@@ -38,7 +38,17 @@ var a = {
     "f00d",
     "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"
   ]
-}, f = c, s = {
+}, f = c, o = {
+  prefix: "fas",
+  iconName: "chevron-down",
+  icon: [
+    512,
+    512,
+    [],
+    "f078",
+    "M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"
+  ]
+}, s = {
   prefix: "fas",
   iconName: "play",
   icon: [
@@ -58,7 +68,7 @@ var a = {
     "f10e",
     "M448 296c0 66.3-53.7 120-120 120l-8 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l8 0c30.9 0 56-25.1 56-56l0-8-64 0c-35.3 0-64-28.7-64-64l0-64c0-35.3 28.7-64 64-64l64 0c35.3 0 64 28.7 64 64l0 32 0 32 0 72zm-256 0c0 66.3-53.7 120-120 120l-8 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l8 0c30.9 0 56-25.1 56-56l0-8-64 0c-35.3 0-64-28.7-64-64l0-64c0-35.3 28.7-64 64-64l64 0c35.3 0 64 28.7 64 64l0 32 0 32 0 72z"
   ]
-}, o = {
+}, r = {
   prefix: "fas",
   iconName: "phone",
   icon: [
@@ -73,8 +83,9 @@ export {
   i as a,
   l as b,
   a as c,
-  o as d,
-  s as e,
+  r as d,
+  f as e,
   e as f,
-  f as g
+  s as g,
+  o as h
 };

package/dist/statistics.js

@@ -1,24 +1,14 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useState as c, useRef as d, useEffect as g } from "react";
-import { tv as a } from "tailwind-variants";
-import { StatisticsContext as f } from "./statistics-context.js";
-import { StatisticsItem as w } from "./statistics-item.js";
-import { StatisticsItemImage as T } from "./statistics-item-image.js";
-import { StatisticsItemRepresents as R } from "./statistics-item-represents.js";
+import { jsx as t } from "react/jsx-runtime";
+import { useState as g } from "react";
+import { tv as d } from "tailwind-variants";
+import { u as a } from "./use-resize-observer-DmddO4OQ.js";
+import { StatisticsContext as m } from "./statistics-context.js";
+import { StatisticsItem as h } from "./statistics-item.js";
+import { StatisticsItemImage as w } from "./statistics-item-image.js";
+import { StatisticsItemRepresents as I } from "./statistics-item-represents.js";
 import { StatisticsItemValue as C } from "./statistics-item-value.js";
-function m() {
-  const [i, s] = c(null), e = d(null);
-  return g(() => {
-    if (!e.current) return;
-    const o = new ResizeObserver((l, t) => {
-      const r = l[0];
-      r && s(r);
-    });
-    return o.observe(e.current), () => o.disconnect();
-  }, [e.current]), [e, i];
-}
-function v({ children: i, variant: s }) {
-  const [e, o] = c(0), [l, t] = m(), r = a({
+function f({ children: e, variant: o }) {
+  const [i, r] = g(0), [l, s] = a(), u = d({
     base: "uofg-statistics uog:mx-auto uog:my-4 uog:flex uog:flex-col uog:flex-wrap uog:sm:flex-row",
     variants: {
       divisibleByTwo: {
@@ -56,38 +46,38 @@ function v({ children: i, variant: s }) {
       }
     ]
   });
-  return /* @__PURE__ */ u(
-    f.Provider,
+  return /* @__PURE__ */ t(
+    m.Provider,
     {
       value: {
-        variant: s,
-        incrementCount: () => o((n) => n + 1)
+        variant: o,
+        incrementCount: () => r((c) => c + 1)
       },
-      children: /* @__PURE__ */ u(
+      children: /* @__PURE__ */ t(
         "dl",
         {
-          className: r({
-            variant: s,
-            divisibleByTwo: e % 2 === 0,
-            divisibleByThree: e % 3 === 0,
-            divisibleByFour: e % 4 === 0
+          className: u({
+            variant: o,
+            divisibleByTwo: i % 2 === 0,
+            divisibleByThree: i % 3 === 0,
+            divisibleByFour: i % 4 === 0
           }),
           style: (
             /* @ts-expect-error TypeScript doesn't like CSS Variables */
-            s === "solid-colors-full" ? { "--statistic-bg-width": (t == null ? void 0 : t.contentRect.width) + "px" } : void 0
+            o === "solid-colors-full" ? { "--statistic-bg-width": (s == null ? void 0 : s.contentRect.width) + "px" } : void 0
           ),
           ref: l,
-          children: i
+          children: e
         }
       )
     }
   );
 }
-v.displayName = "Statistics";
+f.displayName = "Statistics";
 export {
-  v as Statistics,
-  w as StatisticsItem,
-  T as StatisticsItemImage,
-  R as StatisticsItemRepresents,
+  f as Statistics,
+  h as StatisticsItem,
+  w as StatisticsItemImage,
+  I as StatisticsItemRepresents,
   C as StatisticsItemValue
 };

package/dist/text-input.js

@@ -1,5 +1,5 @@
 import { jsxs as s, jsx as u } from "react/jsx-runtime";
-import { h as v } from "./regular-BRNZck7j.js";
+import { h as v } from "./regular-23gOebKJ.js";
 import { FontAwesomeIcon as w } from "@fortawesome/react-fontawesome";
 import { Field as h, Label as y, Input as N } from "@headlessui/react";
 import { useState as j, useRef as B } from "react";

package/dist/use-dismissible-CWEoUQGp.js

@@ -0,0 +1,26 @@
+import { useState as l, useEffect as c } from "react";
+const w = (r, t, m = "local") => {
+  const s = `${r}-use-dismissible-hash`, e = typeof window == "object" ? m === "session" ? window.sessionStorage : window.localStorage : null, [u, i] = l(!0);
+  return c(() => {
+    const o = (d) => {
+      d.key === s && e !== null && i(e.getItem(s) === t);
+    };
+    if (!t)
+      return;
+    const n = e == null ? void 0 : e.getItem(s);
+    return i(n === t), n && n !== t && (e == null || e.removeItem(s)), window.addEventListener("storage", o), () => {
+      window.removeEventListener("storage", o);
+    };
+  }, [t, s, e]), {
+    dismissed: u,
+    dismiss: () => {
+      t && (i(!0), e == null || e.setItem(s, t));
+    },
+    clear: () => {
+      i(!1), e == null || e.removeItem(s);
+    }
+  };
+};
+export {
+  w as u
+};

package/dist/use-resize-observer-DmddO4OQ.js

@@ -0,0 +1,15 @@
+import { useState as o, useRef as c, useEffect as f } from "react";
+function v() {
+  const [n, s] = o(null), e = c(null);
+  return f(() => {
+    if (!e.current) return;
+    const r = new ResizeObserver((u, i) => {
+      const t = u[0];
+      t && s(t);
+    });
+    return r.observe(e.current), () => r.disconnect();
+  }, [e.current]), [e, n];
+}
+export {
+  v as u
+};

package/dist/utils/use-dismissible.d.ts

@@ -0,0 +1,5 @@
+export declare const useDismissible: (id: string, hash?: string, container?: "local" | "session") => {
+    dismissed: boolean;
+    dismiss: () => void;
+    clear: () => void;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uoguelph/react-components",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "University of Guelph React Components Library",
   "type": "module",
   "scripts": {
@@ -35,6 +35,7 @@
     "@fortawesome/react-fontawesome": "^0.2.2",
     "@headlessui/react": "^2.2.0",
     "@headlessui/tailwindcss": "^0.2.2",
+    "object-hash": "^3.0.0",
     "react": "^19.0.0",
     "react-animate-height": "^3.2.3",
     "react-dom": "^19.0.0",
@@ -46,6 +47,7 @@
     "@eslint/js": "^9.19.0",
     "@tailwindcss/vite": "^4.0.9",
     "@types/node": "^22.13.1",
+    "@types/object-hash": "^3.0.6",
     "@types/react": "^19.0.8",
     "@types/react-dom": "^19.0.3",
     "@uoguelph/tailwind-theme": "^1.0.0",
@@ -72,5 +74,5 @@
   "bugs": {
     "url": "https://github.com/ccswbs/uofg-components/issues"
   },
-  "gitHead": "00ec867ce6959ba82234651e9214960b9c4088e4"
+  "gitHead": "70f7986f7c6dec6a462009594c4c76640a5b2c5e"
 }