@uoguelph/react-components 1.10.1-rc.0 → 1.10.2-rc.0

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.
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
  import { jsxs as c, jsx as o } from "react/jsx-runtime";
3
3
  import { c as u, d as l } from "./regular-Dfv3Fzq0.js";
4
- import { FontAwesomeIcon as a } from "@fortawesome/react-fontawesome";
5
- import { DisclosureButton as b } from "@headlessui/react";
4
+ import { FontAwesomeIcon as b } from "@fortawesome/react-fontawesome";
5
+ import { DisclosureButton as a } from "@headlessui/react";
6
6
  import { useContext as f } from "react";
7
7
  import { twMerge as m } from "tailwind-merge";
8
8
  import { tv as p } from "tailwind-variants";
9
9
  import { AccordionContext as g } from "./accordion-context.js";
10
- function x({ children: n, className: e }) {
10
+ function x({ children: e, className: n }) {
11
11
  const t = f(g), i = p({
12
12
  slots: {
13
13
  button: "group mb-1 inline-flex w-full cursor-pointer items-center justify-between gap-2 p-2.5 px-5 text-left text-xl transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-blue focus-visible:ring-offset-2 hocus-visible:bg-blue hocus-visible:text-blue-contrast",
@@ -26,16 +26,23 @@ function x({ children: n, className: e }) {
26
26
  }
27
27
  }
28
28
  }), { button: s, icon: r } = i({ open: t?.isOpen });
29
- return /* @__PURE__ */ c(b, { className: `uofg-accordion-button ${m(e, s())}`, children: [
30
- /* @__PURE__ */ o("span", { className: "uofg-accordion-button-content", children: n }),
31
- /* @__PURE__ */ o(
32
- a,
33
- {
34
- icon: t?.isOpen ? u : l,
35
- className: `uofg-accordion-button-icon ${r()}`
36
- }
37
- )
38
- ] });
29
+ return /* @__PURE__ */ c(
30
+ a,
31
+ {
32
+ ref: t?.buttonRef,
33
+ className: `uofg-accordion-button ${m(n, s())}`,
34
+ children: [
35
+ /* @__PURE__ */ o("span", { className: "uofg-accordion-button-content", children: e }),
36
+ /* @__PURE__ */ o(
37
+ b,
38
+ {
39
+ icon: t?.isOpen ? u : l,
40
+ className: `uofg-accordion-button-icon ${r()}`
41
+ }
42
+ )
43
+ ]
44
+ }
45
+ );
39
46
  }
40
47
  x.displayName = "AccordionButton";
41
48
  export {
@@ -1,5 +1,5 @@
1
1
  import { createContext as o } from "react";
2
- const e = o(void 0);
2
+ const e = o(null);
3
3
  export {
4
4
  e as AccordionContext
5
5
  };
package/dist/accordion.js CHANGED
@@ -1,17 +1,29 @@
1
1
  "use client";
2
- import { jsx as o } from "react/jsx-runtime";
3
- import { Disclosure as e } from "@headlessui/react";
4
- import { twMerge as m } from "tailwind-merge";
5
- import { AccordionContext as d } from "./accordion-context.js";
6
- import { AccordionButton as A } from "./accordion-button.js";
7
- import { AccordionContent as v } from "./accordion-content.js";
8
- function p({ id: r, children: c, className: i }) {
9
- const n = m("my-2 [&_p:last-child]:mb-0", i);
10
- return /* @__PURE__ */ o(e, { children: ({ open: t }) => /* @__PURE__ */ o("div", { id: r, className: `uofg-accordion ${n}`, children: /* @__PURE__ */ o(d.Provider, { value: { isOpen: t }, children: c }) }) });
2
+ import { jsx as n } from "react/jsx-runtime";
3
+ import { Disclosure as m } from "@headlessui/react";
4
+ import { twMerge as l } from "tailwind-merge";
5
+ import { AccordionContext as u } from "./accordion-context.js";
6
+ import { useRef as d, useEffect as f } from "react";
7
+ import { AccordionButton as O } from "./accordion-button.js";
8
+ import { AccordionContent as B } from "./accordion-content.js";
9
+ function h({ id: e, children: c, className: i }) {
10
+ const s = l("my-2 [&_p:last-child]:mb-0", i), t = d(null);
11
+ return f(() => {
12
+ if (!e) return;
13
+ const o = () => {
14
+ if (window.location.hash.replace(/^#/, "") !== e) return;
15
+ const r = document.getElementById(e);
16
+ if (!r) return;
17
+ r.querySelector("[data-open]") !== null || t.current?.click(), r.scrollIntoView({ block: "start" });
18
+ }, a = setTimeout(o, 0);
19
+ return window.addEventListener("hashchange", o), () => {
20
+ clearTimeout(a), window.removeEventListener("hashchange", o);
21
+ };
22
+ }, [e]), /* @__PURE__ */ n(m, { children: ({ open: o }) => /* @__PURE__ */ n("div", { id: e, className: `uofg-accordion ${s}`, children: /* @__PURE__ */ n(u.Provider, { value: { isOpen: o, buttonRef: t }, children: c }) }) });
11
23
  }
12
- p.displayName = "Accordion";
24
+ h.displayName = "Accordion";
13
25
  export {
14
- p as Accordion,
15
- A as AccordionButton,
16
- v as AccordionContent
26
+ h as Accordion,
27
+ O as AccordionButton,
28
+ B as AccordionContent
17
29
  };
@@ -1,4 +1,6 @@
1
+ import { RefObject } from 'react';
1
2
  export type AccordionContextValue = {
2
3
  isOpen: boolean;
4
+ buttonRef: RefObject<HTMLButtonElement | null>;
3
5
  };
4
- export declare const AccordionContext: import('react').Context<AccordionContextValue | undefined>;
6
+ export declare const AccordionContext: import('react').Context<AccordionContextValue | null>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uoguelph/react-components",
3
- "version": "1.10.1-rc.0",
3
+ "version": "1.10.2-rc.0",
4
4
  "description": "University of Guelph React Components Library",
5
5
  "type": "module",
6
6
  "scripts": {