@atom-learning/components 6.5.4 → 6.5.5

package/dist/components/navigation/NavigationMenu.js

@@ -1,69 +1,83 @@
-import { styled as e } from "../../styled.js";
-import { colorSchemes as t } from "./NavigationMenu.colorscheme.config.js";
-import { NavigationMenuContext as n } from "./NavigationMenuContext.js";
-import { NavigationMenuDropdownContent as r } from "./NavigationMenuDropdownContent.js";
-import { NavigationMenuDropdownTrigger as i } from "./NavigationMenuDropdownTrigger.js";
-import { NavigationMenuDropdown as a } from "./NavigationMenuDropdown.js";
-import { NavigationMenuLink as o } from "./NavigationMenuLink.js";
-import { NavigationMenuDropdownItem as s, NavigationMenuDropdownItemTitle as c } from "./NavigationMenuDropdownItem.js";
-import l from "clsx";
-import u from "react";
-import * as d from "@radix-ui/react-navigation-menu";
+import { styled } from "../../styled.js";
+import { colorSchemes } from "./NavigationMenu.colorscheme.config.js";
+import { NavigationMenuContext } from "./NavigationMenuContext.js";
+import { NavigationMenuDropdownContent } from "./NavigationMenuDropdownContent.js";
+import { NavigationMenuDropdownTrigger } from "./NavigationMenuDropdownTrigger.js";
+import { NavigationMenuDropdown } from "./NavigationMenuDropdown.js";
+import { NavigationMenuLink } from "./NavigationMenuLink.js";
+import { NavigationMenuDropdownItem, NavigationMenuDropdownItemTitle } from "./NavigationMenuDropdownItem.js";
+import clsx from "clsx";
+import React from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 //#region src/components/navigation/NavigationMenu.tsx
-var f = e(d.Root, { base: [
+var StyledMenu = styled(NavigationMenuPrimitive.Root, { base: [
 	"flex",
 	"justify-center",
 	"relative"
-] }), p = e(d.List, { base: [
+] });
+var StyledList = styled(NavigationMenuPrimitive.List, { base: [
 	"flex",
 	"justify-center",
 	"items-center",
-	"gap-1"
-] }), m = e(d.Viewport, { base: ["z-2147483647"] }), h = e("div", { base: [
+	"gap-1",
+	"list-none"
+] });
+var StyledViewport = styled(NavigationMenuPrimitive.Viewport, { base: ["z-2147483647"] });
+var ViewportPosition = styled("div", { base: [
 	"absolute",
 	"left-0",
 	"top-full",
 	"w-full",
 	"flex",
 	"justify-center"
-] }), g = ({ children: e, className: r, ...i }) => {
-	let [a, o] = u.useState(), [s, c] = u.useState(), [d, g] = u.useState(0), _ = u.useRef(null);
-	return u.useLayoutEffect(() => {
-		_.current && g(_.current.offsetWidth);
-	}, [u.Children.toArray(e).length]), u.useEffect(() => {
-		let e;
-		return s === "" && (e = setTimeout(() => o(null), 200)), () => {
-			e !== null && clearTimeout(e);
+] });
+var NavigationMenuComponent = ({ children, className, ...props }) => {
+	const [offset, setOffset] = React.useState();
+	const [activeItem, setActiveItem] = React.useState();
+	const [listWidth, setListWidth] = React.useState(0);
+	const listRef = React.useRef(null);
+	React.useLayoutEffect(() => {
+		if (listRef.current) setListWidth(listRef.current.offsetWidth);
+	}, [React.Children.toArray(children).length]);
+	React.useEffect(() => {
+		let timer;
+		if (activeItem === "") timer = setTimeout(() => setOffset(null), 200);
+		return () => {
+			if (timer !== null) clearTimeout(timer);
 		};
-	}, [s]), /* @__PURE__ */ u.createElement(n.Provider, { value: { onNodeUpdate: (e, t) => {
-		if (e && d && s === t) {
-			let t = d / 2, n = d - e.offsetLeft - e.offsetWidth + e.offsetWidth / 2;
-			o(Math.round(t - n));
+	}, [activeItem]);
+	const onNodeUpdate = (trigger, itemValue) => {
+		if (trigger && listWidth && activeItem === itemValue) {
+			const listCenter = listWidth / 2;
+			const triggerOffsetRight = listWidth - trigger.offsetLeft - trigger.offsetWidth + trigger.offsetWidth / 2;
+			setOffset(Math.round(listCenter - triggerOffsetRight));
 		}
-		return e;
-	} } }, /* @__PURE__ */ u.createElement(f, {
-		className: l(r),
-		style: t.light,
-		onValueChange: c,
-		...i
-	}, /* @__PURE__ */ u.createElement(p, { ref: _ }, e), /* @__PURE__ */ u.createElement(h, null, /* @__PURE__ */ u.createElement(m, {
-		style: { "--navigation-menu-viewport-offset": `${a || 0}px` },
-		className: l([
+		return trigger;
+	};
+	return /* @__PURE__ */ React.createElement(NavigationMenuContext.Provider, { value: { onNodeUpdate } }, /* @__PURE__ */ React.createElement(StyledMenu, {
+		className: clsx(className),
+		style: colorSchemes["light"],
+		onValueChange: setActiveItem,
+		...props
+	}, /* @__PURE__ */ React.createElement(StyledList, { ref: listRef }, children), /* @__PURE__ */ React.createElement(ViewportPosition, null, /* @__PURE__ */ React.createElement(StyledViewport, {
+		style: { "--navigation-menu-viewport-offset": `${offset || 0}px` },
+		className: clsx([
 			"data-[state=open]:animate-fade-in",
 			"data-[state=closed]:animate-fade-out",
 			"translate-x-(--navigation-menu-viewport-offset)"
 		])
 	}))));
-}, _ = Object.assign(g, {
-	Link: o,
-	Dropdown: a,
-	DropdownContent: r,
-	DropdownItem: s,
-	DropdownItemTitle: c,
-	DropdownTrigger: i
+};
+var NavigationMenu = Object.assign(NavigationMenuComponent, {
+	Link: NavigationMenuLink,
+	Dropdown: NavigationMenuDropdown,
+	DropdownContent: NavigationMenuDropdownContent,
+	DropdownItem: NavigationMenuDropdownItem,
+	DropdownItemTitle: NavigationMenuDropdownItemTitle,
+	DropdownTrigger: NavigationMenuDropdownTrigger
 });
-g.displayName = "NavigationMenu";
+NavigationMenuComponent.displayName = "NavigationMenu";
 //#endregion
-export { _ as NavigationMenu };
+export { NavigationMenu };
 
 //# sourceMappingURL=NavigationMenu.js.map

package/dist/components/navigation/NavigationMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { colorSchemes as navigationMenuColorSchemes } from './NavigationMenu.colorscheme.config'\nimport { NavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdown } from './NavigationMenuDropdown'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport {\n  NavigationMenuDropdownItem,\n  NavigationMenuDropdownItemTitle\n} from './NavigationMenuDropdownItem'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\nimport { NavigationMenuLink } from './NavigationMenuLink'\n\nconst StyledMenu = styled(NavigationMenuPrimitive.Root, {\n  base: ['flex', 'justify-center', 'relative']\n})\n\nconst StyledList = styled(NavigationMenuPrimitive.List, {\n  base: ['flex', 'justify-center', 'items-center', 'gap-1']\n})\n\nconst StyledViewport = styled(NavigationMenuPrimitive.Viewport, {\n  base: ['z-2147483647']\n})\n\nconst ViewportPosition = styled('div', {\n  base: ['absolute', 'left-0', 'top-full', 'w-full', 'flex', 'justify-center']\n})\n\nconst NavigationMenuComponent = ({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<typeof StyledMenu>) => {\n  const [offset, setOffset] = React.useState<number | null | undefined>()\n  const [activeItem, setActiveItem] = React.useState<string | undefined>()\n  const [listWidth, setListWidth] = React.useState(0)\n  const listRef = React.useRef<HTMLUListElement>(null)\n\n  React.useLayoutEffect(() => {\n    if (listRef.current) {\n      setListWidth(listRef.current.offsetWidth)\n    }\n  }, [React.Children.toArray(children).length])\n\n  React.useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>\n\n    // Delay transitioning back to initial position\n    // to allow enough time for fadeOut animation to complete\n    if (activeItem === '') {\n      timer = setTimeout(() => setOffset(null), 200)\n    }\n\n    return () => {\n      if (timer !== null) {\n        clearTimeout(timer)\n      }\n    }\n  }, [activeItem])\n\n  // https://github.com/radix-ui/primitives/issues/1462\n  const onNodeUpdate = (trigger: HTMLButtonElement, itemValue: string) => {\n    if (trigger && listWidth && activeItem === itemValue) {\n      const listCenter = listWidth / 2\n\n      const triggerOffsetRight =\n        listWidth -\n        trigger.offsetLeft -\n        trigger.offsetWidth +\n        trigger.offsetWidth / 2\n\n      setOffset(Math.round(listCenter - triggerOffsetRight))\n    }\n\n    return trigger\n  }\n\n  return (\n    <NavigationMenuContext.Provider value={{ onNodeUpdate }}>\n      <StyledMenu\n        className={clsx(className)}\n        style={navigationMenuColorSchemes['light']}\n        onValueChange={setActiveItem}\n        {...props}\n      >\n        <StyledList ref={listRef}>{children}</StyledList>\n        <ViewportPosition>\n          <StyledViewport\n            style={{ '--navigation-menu-viewport-offset': `${offset || 0}px` }}\n            className={clsx([\n              'data-[state=open]:animate-fade-in',\n              'data-[state=closed]:animate-fade-out',\n              'translate-x-(--navigation-menu-viewport-offset)'\n            ])}\n          />\n        </ViewportPosition>\n      </StyledMenu>\n    </NavigationMenuContext.Provider>\n  )\n}\n\nexport const NavigationMenu = Object.assign(NavigationMenuComponent, {\n  Link: NavigationMenuLink,\n  Dropdown: NavigationMenuDropdown,\n  DropdownContent: NavigationMenuDropdownContent,\n  DropdownItem: NavigationMenuDropdownItem,\n  DropdownItemTitle: NavigationMenuDropdownItemTitle,\n  DropdownTrigger: NavigationMenuDropdownTrigger\n})\n\nNavigationMenuComponent.displayName = 'NavigationMenu'\n"],"mappings":";;;;;;;;;;;;AAiBA,IAAM,IAAa,EAAO,EAAwB,MAAM,EACtD,MAAM;CAAC;CAAQ;CAAkB;CAAW,EAC7C,CAAC,EAEI,IAAa,EAAO,EAAwB,MAAM,EACtD,MAAM;CAAC;CAAQ;CAAkB;CAAgB;CAAQ,EAC1D,CAAC,EAEI,IAAiB,EAAO,EAAwB,UAAU,EAC9D,MAAM,CAAC,eAAe,EACvB,CAAC,EAEI,IAAmB,EAAO,OAAO,EACrC,MAAM;CAAC;CAAY;CAAU;CAAY;CAAU;CAAQ;CAAiB,EAC7E,CAAC,EAEI,KAA2B,EAC/B,aACA,cACA,GAAG,QAC0C;CAC7C,IAAM,CAAC,GAAQ,KAAa,EAAM,UAAqC,EACjE,CAAC,GAAY,KAAiB,EAAM,UAA8B,EAClE,CAAC,GAAW,KAAgB,EAAM,SAAS,EAAE,EAC7C,IAAU,EAAM,OAAyB,KAAK;AAyCpD,QAvCA,EAAM,sBAAsB;AAC1B,EAAI,EAAQ,WACV,EAAa,EAAQ,QAAQ,YAAY;IAE1C,CAAC,EAAM,SAAS,QAAQ,EAAS,CAAC,OAAO,CAAC,EAE7C,EAAM,gBAAgB;EACpB,IAAI;AAQJ,SAJI,MAAe,OACjB,IAAQ,iBAAiB,EAAU,KAAK,EAAE,IAAI,SAGnC;AACX,GAAI,MAAU,QACZ,aAAa,EAAM;;IAGtB,CAAC,EAAW,CAAC,EAoBd,kBAAA,cAAC,EAAsB,UAAvB,EAAgC,OAAO,EAAE,eAjBrB,GAA4B,MAAsB;AACtE,MAAI,KAAW,KAAa,MAAe,GAAW;GACpD,IAAM,IAAa,IAAY,GAEzB,IACJ,IACA,EAAQ,aACR,EAAQ,cACR,EAAQ,cAAc;AAExB,KAAU,KAAK,MAAM,IAAa,EAAmB,CAAC;;AAGxD,SAAO;IAIgD,EAmBtB,EAlB/B,kBAAA,cAAC,GAAD;EACE,WAAW,EAAK,EAAU;EAC1B,OAAO,EAA2B;EAClC,eAAe;EACf,GAAI;EAaO,EAXX,kBAAA,cAAC,GAAD,EAAY,KAAK,GAAgC,EAAtB,EAAsB,EACjD,kBAAA,cAAC,GAAA,MACC,kBAAA,cAAC,GAAD;EACE,OAAO,EAAE,qCAAqC,GAAG,KAAU,EAAE,KAAK;EAClE,WAAW,EAAK;GACd;GACA;GACA;GACD,CAAC;EACF,CAAA,CACe,CACR,CACkB;GAIxB,IAAiB,OAAO,OAAO,GAAyB;CACnE,MAAM;CACN,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,mBAAmB;CACnB,iBAAiB;CAClB,CAAC;AAEF,EAAwB,cAAc"}
+{"version":3,"file":"NavigationMenu.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { colorSchemes as navigationMenuColorSchemes } from './NavigationMenu.colorscheme.config'\nimport { NavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdown } from './NavigationMenuDropdown'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport {\n  NavigationMenuDropdownItem,\n  NavigationMenuDropdownItemTitle\n} from './NavigationMenuDropdownItem'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\nimport { NavigationMenuLink } from './NavigationMenuLink'\n\nconst StyledMenu = styled(NavigationMenuPrimitive.Root, {\n  base: ['flex', 'justify-center', 'relative']\n})\n\nconst StyledList = styled(NavigationMenuPrimitive.List, {\n  base: ['flex', 'justify-center', 'items-center', 'gap-1', 'list-none']\n})\n\nconst StyledViewport = styled(NavigationMenuPrimitive.Viewport, {\n  base: ['z-2147483647']\n})\n\nconst ViewportPosition = styled('div', {\n  base: ['absolute', 'left-0', 'top-full', 'w-full', 'flex', 'justify-center']\n})\n\nconst NavigationMenuComponent = ({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<typeof StyledMenu>) => {\n  const [offset, setOffset] = React.useState<number | null | undefined>()\n  const [activeItem, setActiveItem] = React.useState<string | undefined>()\n  const [listWidth, setListWidth] = React.useState(0)\n  const listRef = React.useRef<HTMLUListElement>(null)\n\n  React.useLayoutEffect(() => {\n    if (listRef.current) {\n      setListWidth(listRef.current.offsetWidth)\n    }\n  }, [React.Children.toArray(children).length])\n\n  React.useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>\n\n    // Delay transitioning back to initial position\n    // to allow enough time for fadeOut animation to complete\n    if (activeItem === '') {\n      timer = setTimeout(() => setOffset(null), 200)\n    }\n\n    return () => {\n      if (timer !== null) {\n        clearTimeout(timer)\n      }\n    }\n  }, [activeItem])\n\n  // https://github.com/radix-ui/primitives/issues/1462\n  const onNodeUpdate = (trigger: HTMLButtonElement, itemValue: string) => {\n    if (trigger && listWidth && activeItem === itemValue) {\n      const listCenter = listWidth / 2\n\n      const triggerOffsetRight =\n        listWidth -\n        trigger.offsetLeft -\n        trigger.offsetWidth +\n        trigger.offsetWidth / 2\n\n      setOffset(Math.round(listCenter - triggerOffsetRight))\n    }\n\n    return trigger\n  }\n\n  return (\n    <NavigationMenuContext.Provider value={{ onNodeUpdate }}>\n      <StyledMenu\n        className={clsx(className)}\n        style={navigationMenuColorSchemes['light']}\n        onValueChange={setActiveItem}\n        {...props}\n      >\n        <StyledList ref={listRef}>{children}</StyledList>\n        <ViewportPosition>\n          <StyledViewport\n            style={{ '--navigation-menu-viewport-offset': `${offset || 0}px` }}\n            className={clsx([\n              'data-[state=open]:animate-fade-in',\n              'data-[state=closed]:animate-fade-out',\n              'translate-x-(--navigation-menu-viewport-offset)'\n            ])}\n          />\n        </ViewportPosition>\n      </StyledMenu>\n    </NavigationMenuContext.Provider>\n  )\n}\n\nexport const NavigationMenu = Object.assign(NavigationMenuComponent, {\n  Link: NavigationMenuLink,\n  Dropdown: NavigationMenuDropdown,\n  DropdownContent: NavigationMenuDropdownContent,\n  DropdownItem: NavigationMenuDropdownItem,\n  DropdownItemTitle: NavigationMenuDropdownItemTitle,\n  DropdownTrigger: NavigationMenuDropdownTrigger\n})\n\nNavigationMenuComponent.displayName = 'NavigationMenu'\n"],"mappings":";;;;;;;;;;;;AAiBA,IAAM,aAAa,OAAO,wBAAwB,MAAM,EACtD,MAAM;CAAC;CAAQ;CAAkB;CAAW,EAC7C,CAAC;AAEF,IAAM,aAAa,OAAO,wBAAwB,MAAM,EACtD,MAAM;CAAC;CAAQ;CAAkB;CAAgB;CAAS;CAAY,EACvE,CAAC;AAEF,IAAM,iBAAiB,OAAO,wBAAwB,UAAU,EAC9D,MAAM,CAAC,eAAe,EACvB,CAAC;AAEF,IAAM,mBAAmB,OAAO,OAAO,EACrC,MAAM;CAAC;CAAY;CAAU;CAAY;CAAU;CAAQ;CAAiB,EAC7E,CAAC;AAEF,IAAM,2BAA2B,EAC/B,UACA,WACA,GAAG,YAC0C;CAC7C,MAAM,CAAC,QAAQ,aAAa,MAAM,UAAqC;CACvE,MAAM,CAAC,YAAY,iBAAiB,MAAM,UAA8B;CACxE,MAAM,CAAC,WAAW,gBAAgB,MAAM,SAAS,EAAE;CACnD,MAAM,UAAU,MAAM,OAAyB,KAAK;AAEpD,OAAM,sBAAsB;AAC1B,MAAI,QAAQ,QACV,cAAa,QAAQ,QAAQ,YAAY;IAE1C,CAAC,MAAM,SAAS,QAAQ,SAAS,CAAC,OAAO,CAAC;AAE7C,OAAM,gBAAgB;EACpB,IAAI;AAIJ,MAAI,eAAe,GACjB,SAAQ,iBAAiB,UAAU,KAAK,EAAE,IAAI;AAGhD,eAAa;AACX,OAAI,UAAU,KACZ,cAAa,MAAM;;IAGtB,CAAC,WAAW,CAAC;CAGhB,MAAM,gBAAgB,SAA4B,cAAsB;AACtE,MAAI,WAAW,aAAa,eAAe,WAAW;GACpD,MAAM,aAAa,YAAY;GAE/B,MAAM,qBACJ,YACA,QAAQ,aACR,QAAQ,cACR,QAAQ,cAAc;AAExB,aAAU,KAAK,MAAM,aAAa,mBAAmB,CAAC;;AAGxD,SAAO;;AAGT,QACE,sBAAA,cAAC,sBAAsB,UAAvB,EAAgC,OAAO,EAAE,cAAc,EAmBtB,EAlB/B,sBAAA,cAAC,YAAD;EACE,WAAW,KAAK,UAAU;EAC1B,OAAO,aAA2B;EAClC,eAAe;EACf,GAAI;EAaO,EAXX,sBAAA,cAAC,YAAD,EAAY,KAAK,SAAgC,EAAtB,SAAsB,EACjD,sBAAA,cAAC,kBAAA,MACC,sBAAA,cAAC,gBAAD;EACE,OAAO,EAAE,qCAAqC,GAAG,UAAU,EAAE,KAAK;EAClE,WAAW,KAAK;GACd;GACA;GACA;GACD,CAAC;EACF,CAAA,CACe,CACR,CACkB;;AAIrC,IAAa,iBAAiB,OAAO,OAAO,yBAAyB;CACnE,MAAM;CACN,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,mBAAmB;CACnB,iBAAiB;CAClB,CAAC;AAEF,wBAAwB,cAAc"}

package/dist/components/navigation/NavigationMenu.styles.js

@@ -1,5 +1,5 @@
 //#region src/components/navigation/NavigationMenu.styles.ts
-var e = [
+var navigationMenuBaseItemStyles = [
 	"relative",
 	"text-(--text)",
 	"outline-none",
@@ -18,7 +18,8 @@ var e = [
 	"disabled:cursor-default",
 	"disabled:opacity-[30%]",
 	"disabled:text-(--text)"
-], t = [
+];
+var navigationMenuActiveItemStyles = [
 	"font-semibold",
 	"text-item-(--background-selected)",
 	"after:-translate-x-1/2",
@@ -33,6 +34,6 @@ var e = [
 	"after:w-6"
 ];
 //#endregion
-export { t as navigationMenuActiveItemStyles, e as navigationMenuBaseItemStyles };
+export { navigationMenuActiveItemStyles, navigationMenuBaseItemStyles };
 
 //# sourceMappingURL=NavigationMenu.styles.js.map

package/dist/components/navigation/NavigationMenu.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.styles.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.styles.ts"],"sourcesContent":["export const navigationMenuBaseItemStyles = [\n  'relative',\n  'text-(--text)',\n  'outline-none',\n  'cursor-pointer',\n  'font-body',\n  'select-none',\n  'p-3',\n  'rounded-md',\n  'bg-(--background)',\n  'hover:bg-(--background-hover)',\n  'hover:text-(--text-hover)',\n  'active:bg-(--background-active)',\n  'active:text-(--text-active)',\n  'focus-visible:inset-shadow-[0_0_0_2px_var(--color-primary-800)]',\n  'disabled:bg-none',\n  'disabled:cursor-default',\n  'disabled:opacity-[30%]',\n  'disabled:text-(--text)'\n]\n\nexport const navigationMenuActiveItemStyles = [\n  'font-semibold',\n  'text-item-(--background-selected)',\n  'after:-translate-x-1/2',\n  'after:absolute',\n  'after:bg-item-(--background-selected)',\n  'after:block',\n  'after:bottom-0',\n  'after:h-0.5',\n  'after:left-1/2',\n  'after:rounded-md',\n  'after:translate-y-0',\n  'after:w-6'\n]\n"],"mappings":";AAAA,IAAa,IAA+B;CAC1C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAEY,IAAiC;CAC5C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}
+{"version":3,"file":"NavigationMenu.styles.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.styles.ts"],"sourcesContent":["export const navigationMenuBaseItemStyles = [\n  'relative',\n  'text-(--text)',\n  'outline-none',\n  'cursor-pointer',\n  'font-body',\n  'select-none',\n  'p-3',\n  'rounded-md',\n  'bg-(--background)',\n  'hover:bg-(--background-hover)',\n  'hover:text-(--text-hover)',\n  'active:bg-(--background-active)',\n  'active:text-(--text-active)',\n  'focus-visible:inset-shadow-[0_0_0_2px_var(--color-primary-800)]',\n  'disabled:bg-none',\n  'disabled:cursor-default',\n  'disabled:opacity-[30%]',\n  'disabled:text-(--text)'\n]\n\nexport const navigationMenuActiveItemStyles = [\n  'font-semibold',\n  'text-item-(--background-selected)',\n  'after:-translate-x-1/2',\n  'after:absolute',\n  'after:bg-item-(--background-selected)',\n  'after:block',\n  'after:bottom-0',\n  'after:h-0.5',\n  'after:left-1/2',\n  'after:rounded-md',\n  'after:translate-y-0',\n  'after:w-6'\n]\n"],"mappings":";AAAA,IAAa,+BAA+B;CAC1C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAa,iCAAiC;CAC5C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}

package/dist/components/navigation/NavigationMenuContext.js

@@ -1,11 +1,12 @@
-import e from "react";
+import React from "react";
 //#region src/components/navigation/NavigationMenuContext.tsx
-var t = e.createContext(void 0), n = () => {
-	let n = e.useContext(t);
-	if (n === void 0) throw Error("useNavigationMenuContext must be used within a NavigationMenuContextProvider");
-	return n;
+var NavigationMenuContext = React.createContext(void 0);
+var useNavigationMenuContext = () => {
+	const context = React.useContext(NavigationMenuContext);
+	if (context === void 0) throw new Error("useNavigationMenuContext must be used within a NavigationMenuContextProvider");
+	return context;
 };
 //#endregion
-export { t as NavigationMenuContext, n as useNavigationMenuContext };
+export { NavigationMenuContext, useNavigationMenuContext };
 
 //# sourceMappingURL=NavigationMenuContext.js.map

package/dist/components/navigation/NavigationMenuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuContext.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuContext.tsx"],"sourcesContent":["import React from 'react'\n\ninterface NavigationMenuContextValue {\n  onNodeUpdate: (\n    trigger: HTMLButtonElement,\n    itemValue: string\n  ) => HTMLButtonElement\n}\n\nexport const NavigationMenuContext = React.createContext<\n  NavigationMenuContextValue | undefined\n>(undefined)\n\nexport const useNavigationMenuContext = (): NavigationMenuContextValue => {\n  const context = React.useContext(NavigationMenuContext)\n\n  if (context === undefined) {\n    throw new Error(\n      'useNavigationMenuContext must be used within a NavigationMenuContextProvider'\n    )\n  }\n\n  return context\n}\n"],"mappings":";;AASA,IAAa,IAAwB,EAAM,cAEzC,KAAA,EAAU,EAEC,UAA6D;CACxE,IAAM,IAAU,EAAM,WAAW,EAAsB;AAEvD,KAAI,MAAY,KAAA,EACd,OAAU,MACR,+EACD;AAGH,QAAO"}
+{"version":3,"file":"NavigationMenuContext.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuContext.tsx"],"sourcesContent":["import React from 'react'\n\ninterface NavigationMenuContextValue {\n  onNodeUpdate: (\n    trigger: HTMLButtonElement,\n    itemValue: string\n  ) => HTMLButtonElement\n}\n\nexport const NavigationMenuContext = React.createContext<\n  NavigationMenuContextValue | undefined\n>(undefined)\n\nexport const useNavigationMenuContext = (): NavigationMenuContextValue => {\n  const context = React.useContext(NavigationMenuContext)\n\n  if (context === undefined) {\n    throw new Error(\n      'useNavigationMenuContext must be used within a NavigationMenuContextProvider'\n    )\n  }\n\n  return context\n}\n"],"mappings":";;AASA,IAAa,wBAAwB,MAAM,cAEzC,KAAA,EAAU;AAEZ,IAAa,iCAA6D;CACxE,MAAM,UAAU,MAAM,WAAW,sBAAsB;AAEvD,KAAI,YAAY,KAAA,EACd,OAAM,IAAI,MACR,+EACD;AAGH,QAAO"}

package/dist/components/navigation/NavigationMenuDropdown.js

@@ -1,22 +1,23 @@
-import { useNavigationMenuContext as e } from "./NavigationMenuContext.js";
-import { NavigationMenuDropdownContent as t } from "./NavigationMenuDropdownContent.js";
-import { NavigationMenuDropdownTrigger as n } from "./NavigationMenuDropdownTrigger.js";
-import r from "react";
-import * as i from "@radix-ui/react-navigation-menu";
+import { useNavigationMenuContext } from "./NavigationMenuContext.js";
+import { NavigationMenuDropdownContent } from "./NavigationMenuDropdownContent.js";
+import { NavigationMenuDropdownTrigger } from "./NavigationMenuDropdownTrigger.js";
+import React from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 //#region src/components/navigation/NavigationMenuDropdown.tsx
-var a = ({ children: a, id: o, ...s }) => {
-	let { onNodeUpdate: c } = e();
-	return /* @__PURE__ */ r.createElement(i.Item, { value: o }, r.Children.map(a, (e) => {
-		let i = r.isValidElement(e) && e.type === n, a = r.isValidElement(e) && e.type === t;
-		if (!i && !a) throw Error("Only NavigationMenu.Trigger and NavigationMenu.Content can be the passed as a \"children\" of NavigationMenu.Dropdown");
-		return i ? r.cloneElement(e, {
-			...s,
-			ref: (e) => c(e, o)
-		}) : e;
+var NavigationMenuDropdown = ({ children, id, ...props }) => {
+	const { onNodeUpdate } = useNavigationMenuContext();
+	return /* @__PURE__ */ React.createElement(NavigationMenuPrimitive.Item, { value: id }, React.Children.map(children, (child) => {
+		const isTrigger = React.isValidElement(child) && child.type === NavigationMenuDropdownTrigger;
+		const isContent = React.isValidElement(child) && child.type === NavigationMenuDropdownContent;
+		if (!isTrigger && !isContent) throw new Error("Only NavigationMenu.Trigger and NavigationMenu.Content can be the passed as a \"children\" of NavigationMenu.Dropdown");
+		return isTrigger ? React.cloneElement(child, {
+			...props,
+			ref: (node) => onNodeUpdate(node, id)
+		}) : child;
 	}));
 };
-a.displayName = "NavigationMenuDropdown";
+NavigationMenuDropdown.displayName = "NavigationMenuDropdown";
 //#endregion
-export { a as NavigationMenuDropdown };
+export { NavigationMenuDropdown };
 
 //# sourceMappingURL=NavigationMenuDropdown.js.map

package/dist/components/navigation/NavigationMenuDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuDropdown.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdown.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React, { ComponentProps, ReactElement } from 'react'\n\nimport { useNavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\n\ntype NavigationMenuDropdownProps = {\n  active?: boolean\n  className?: string\n  id: string\n} & React.HTMLProps<HTMLButtonElement>\n\ntype DropdownTriggerProps = ComponentProps<typeof NavigationMenuDropdownTrigger>\n\nexport const NavigationMenuDropdown = ({\n  children,\n  id,\n  ...props\n}: NavigationMenuDropdownProps) => {\n  const { onNodeUpdate } = useNavigationMenuContext()\n\n  return (\n    <NavigationMenuPrimitive.Item value={id}>\n      {React.Children.map(children, (child) => {\n        const isTrigger =\n          React.isValidElement(child) &&\n          child.type === NavigationMenuDropdownTrigger\n        const isContent =\n          React.isValidElement(child) &&\n          child.type === NavigationMenuDropdownContent\n\n        if (!isTrigger && !isContent) {\n          throw new Error(\n            'Only NavigationMenu.Trigger and NavigationMenu.Content can be the passed as a \"children\" of NavigationMenu.Dropdown'\n          )\n        }\n        return isTrigger\n          ? React.cloneElement(\n              child as ReactElement<DropdownTriggerProps>,\n              {\n                ...props,\n                ref: (node: HTMLButtonElement) => onNodeUpdate(node, id)\n              } as React.PropsWithRef<DropdownTriggerProps>\n            )\n          : child\n      })}\n    </NavigationMenuPrimitive.Item>\n  )\n}\n\nNavigationMenuDropdown.displayName = 'NavigationMenuDropdown'\n"],"mappings":";;;;;;AAeA,IAAa,KAA0B,EACrC,aACA,OACA,GAAG,QAC8B;CACjC,IAAM,EAAE,oBAAiB,GAA0B;AAEnD,QACE,kBAAA,cAAC,EAAwB,MAAzB,EAA8B,OAAO,GAwBN,EAvB5B,EAAM,SAAS,IAAI,IAAW,MAAU;EACvC,IAAM,IACJ,EAAM,eAAe,EAAM,IAC3B,EAAM,SAAS,GACX,IACJ,EAAM,eAAe,EAAM,IAC3B,EAAM,SAAS;AAEjB,MAAI,CAAC,KAAa,CAAC,EACjB,OAAU,MACR,wHACD;AAEH,SAAO,IACH,EAAM,aACJ,GACA;GACE,GAAG;GACH,MAAM,MAA4B,EAAa,GAAM,EAAG;GACzD,CACF,GACD;GACJ,CAC2B;;AAInC,EAAuB,cAAc"}
+{"version":3,"file":"NavigationMenuDropdown.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdown.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React, { ComponentProps, ReactElement } from 'react'\n\nimport { useNavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\n\ntype NavigationMenuDropdownProps = {\n  active?: boolean\n  className?: string\n  id: string\n} & React.HTMLProps<HTMLButtonElement>\n\ntype DropdownTriggerProps = ComponentProps<typeof NavigationMenuDropdownTrigger>\n\nexport const NavigationMenuDropdown = ({\n  children,\n  id,\n  ...props\n}: NavigationMenuDropdownProps) => {\n  const { onNodeUpdate } = useNavigationMenuContext()\n\n  return (\n    <NavigationMenuPrimitive.Item value={id}>\n      {React.Children.map(children, (child) => {\n        const isTrigger =\n          React.isValidElement(child) &&\n          child.type === NavigationMenuDropdownTrigger\n        const isContent =\n          React.isValidElement(child) &&\n          child.type === NavigationMenuDropdownContent\n\n        if (!isTrigger && !isContent) {\n          throw new Error(\n            'Only NavigationMenu.Trigger and NavigationMenu.Content can be the passed as a \"children\" of NavigationMenu.Dropdown'\n          )\n        }\n        return isTrigger\n          ? React.cloneElement(\n              child as ReactElement<DropdownTriggerProps>,\n              {\n                ...props,\n                ref: (node: HTMLButtonElement) => onNodeUpdate(node, id)\n              } as React.PropsWithRef<DropdownTriggerProps>\n            )\n          : child\n      })}\n    </NavigationMenuPrimitive.Item>\n  )\n}\n\nNavigationMenuDropdown.displayName = 'NavigationMenuDropdown'\n"],"mappings":";;;;;;AAeA,IAAa,0BAA0B,EACrC,UACA,IACA,GAAG,YAC8B;CACjC,MAAM,EAAE,iBAAiB,0BAA0B;AAEnD,QACE,sBAAA,cAAC,wBAAwB,MAAzB,EAA8B,OAAO,IAwBN,EAvB5B,MAAM,SAAS,IAAI,WAAW,UAAU;EACvC,MAAM,YACJ,MAAM,eAAe,MAAM,IAC3B,MAAM,SAAS;EACjB,MAAM,YACJ,MAAM,eAAe,MAAM,IAC3B,MAAM,SAAS;AAEjB,MAAI,CAAC,aAAa,CAAC,UACjB,OAAM,IAAI,MACR,wHACD;AAEH,SAAO,YACH,MAAM,aACJ,OACA;GACE,GAAG;GACH,MAAM,SAA4B,aAAa,MAAM,GAAG;GACzD,CACF,GACD;GACJ,CAC2B;;AAInC,uBAAuB,cAAc"}

package/dist/components/navigation/NavigationMenuDropdownContent.js

@@ -1,21 +1,22 @@
-import { styled as e } from "../../styled.js";
-import { preventEvent as t } from "../../utilities/event/preventEvent.js";
-import n from "react";
-import * as r from "@radix-ui/react-navigation-menu";
+import { styled } from "../../styled.js";
+import { preventEvent } from "../../utilities/event/preventEvent.js";
+import React from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 //#region src/components/navigation/NavigationMenuDropdownContent.tsx
-var i = e(r.Content, { base: [
+var StyledContent = styled(NavigationMenuPrimitive.Content, { base: [
 	"p-3",
 	"bg-(--dropdown-background)",
 	"mt-1",
 	"shadow-md",
 	"rounded-md"
-] }), a = ({ children: e, ...r }) => /* @__PURE__ */ n.createElement(i, {
-	onPointerMove: t,
-	onPointerLeave: t,
-	...r
-}, /* @__PURE__ */ n.createElement("ul", null, e));
-a.displayName = "NavigationMenuDropdownContent";
+] });
+var NavigationMenuDropdownContent = ({ children, ...rest }) => /* @__PURE__ */ React.createElement(StyledContent, {
+	onPointerMove: preventEvent,
+	onPointerLeave: preventEvent,
+	...rest
+}, /* @__PURE__ */ React.createElement("ul", null, children));
+NavigationMenuDropdownContent.displayName = "NavigationMenuDropdownContent";
 //#endregion
-export { a as NavigationMenuDropdownContent };
+export { NavigationMenuDropdownContent };
 
 //# sourceMappingURL=NavigationMenuDropdownContent.js.map

package/dist/components/navigation/NavigationMenuDropdownContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuDropdownContent.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownContent.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\n\nconst StyledContent = styled(NavigationMenuPrimitive.Content, {\n  base: ['p-3', 'bg-(--dropdown-background)', 'mt-1', 'shadow-md', 'rounded-md']\n})\n\ntype NavigationMenuDropdownContentProps = React.ComponentProps<\n  typeof StyledContent\n>\n\nexport const NavigationMenuDropdownContent = ({\n  children,\n  ...rest\n}: NavigationMenuDropdownContentProps) => (\n  <StyledContent\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n    {...rest}\n  >\n    <ul>{children}</ul>\n  </StyledContent>\n)\n\nNavigationMenuDropdownContent.displayName = 'NavigationMenuDropdownContent'\n"],"mappings":";;;;;AAMA,IAAM,IAAgB,EAAO,EAAwB,SAAS,EAC5D,MAAM;CAAC;CAAO;CAA8B;CAAQ;CAAa;CAAa,EAC/E,CAAC,EAMW,KAAiC,EAC5C,aACA,GAAG,QAEH,kBAAA,cAAC,GAAD;CACE,eAAe;CACf,gBAAgB;CAChB,GAAI;CAGU,EADd,kBAAA,cAAC,MAAA,MAAI,EAAc,CACL;AAGlB,EAA8B,cAAc"}
+{"version":3,"file":"NavigationMenuDropdownContent.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownContent.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\n\nconst StyledContent = styled(NavigationMenuPrimitive.Content, {\n  base: ['p-3', 'bg-(--dropdown-background)', 'mt-1', 'shadow-md', 'rounded-md']\n})\n\ntype NavigationMenuDropdownContentProps = React.ComponentProps<\n  typeof StyledContent\n>\n\nexport const NavigationMenuDropdownContent = ({\n  children,\n  ...rest\n}: NavigationMenuDropdownContentProps) => (\n  <StyledContent\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n    {...rest}\n  >\n    <ul>{children}</ul>\n  </StyledContent>\n)\n\nNavigationMenuDropdownContent.displayName = 'NavigationMenuDropdownContent'\n"],"mappings":";;;;;AAMA,IAAM,gBAAgB,OAAO,wBAAwB,SAAS,EAC5D,MAAM;CAAC;CAAO;CAA8B;CAAQ;CAAa;CAAa,EAC/E,CAAC;AAMF,IAAa,iCAAiC,EAC5C,UACA,GAAG,WAEH,sBAAA,cAAC,eAAD;CACE,eAAe;CACf,gBAAgB;CAChB,GAAI;CAGU,EADd,sBAAA,cAAC,MAAA,MAAI,SAAc,CACL;AAGlB,8BAA8B,cAAc"}

package/dist/components/navigation/NavigationMenuDropdownItem.js

@@ -1,15 +1,19 @@
-import { styled as e } from "../../styled.js";
-import { Text as t } from "../text/Text.js";
-import { NavigationMenuLink as n } from "./NavigationMenuLink.js";
-import r from "react";
+import { styled } from "../../styled.js";
+import { Text } from "../text/Text.js";
+import { NavigationMenuLink } from "./NavigationMenuLink.js";
+import React from "react";
 //#region src/components/navigation/NavigationMenuDropdownItem.tsx
-var i = r.forwardRef((e, t) => /* @__PURE__ */ r.createElement(n, {
-	ref: t,
-	variant: "dropdownItem",
-	...e
-})), a = e(t, { base: ["text-grey-900", "font-semibold"] });
-i.displayName = "NavigationMenuDropdownItem", a.displayName = "NavigationMenuDropdownItemTitle";
+var NavigationMenuDropdownItem = React.forwardRef((props, forwardedRef) => {
+	return /* @__PURE__ */ React.createElement(NavigationMenuLink, {
+		ref: forwardedRef,
+		variant: "dropdownItem",
+		...props
+	});
+});
+var NavigationMenuDropdownItemTitle = styled(Text, { base: ["text-grey-900", "font-semibold"] });
+NavigationMenuDropdownItem.displayName = "NavigationMenuDropdownItem";
+NavigationMenuDropdownItemTitle.displayName = "NavigationMenuDropdownItemTitle";
 //#endregion
-export { i as NavigationMenuDropdownItem, a as NavigationMenuDropdownItemTitle };
+export { NavigationMenuDropdownItem, NavigationMenuDropdownItemTitle };
 
 //# sourceMappingURL=NavigationMenuDropdownItem.js.map

package/dist/components/navigation/NavigationMenuDropdownItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuDropdownItem.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text/Text'\nimport { NavigationMenuLink } from './NavigationMenuLink'\n\nexport const NavigationMenuDropdownItem = React.forwardRef<\n  HTMLAnchorElement,\n  React.PropsWithChildren<React.ComponentProps<typeof NavigationMenuLink>>\n>((props, forwardedRef) => {\n  return (\n    <NavigationMenuLink ref={forwardedRef} variant=\"dropdownItem\" {...props} />\n  )\n})\n\nexport const NavigationMenuDropdownItemTitle = styled(Text, {\n  base: ['text-grey-900', 'font-semibold']\n})\n\nNavigationMenuDropdownItem.displayName = 'NavigationMenuDropdownItem'\nNavigationMenuDropdownItemTitle.displayName = 'NavigationMenuDropdownItemTitle'\n"],"mappings":";;;;;AAOA,IAAa,IAA6B,EAAM,YAG7C,GAAO,MAEN,kBAAA,cAAC,GAAD;CAAoB,KAAK;CAAc,SAAQ;CAAe,GAAI;CAAS,CAAA,CAE7E,EAEW,IAAkC,EAAO,GAAM,EAC1D,MAAM,CAAC,iBAAiB,gBAAgB,EACzC,CAAC;AAEF,EAA2B,cAAc,8BACzC,EAAgC,cAAc"}
+{"version":3,"file":"NavigationMenuDropdownItem.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text/Text'\nimport { NavigationMenuLink } from './NavigationMenuLink'\n\nexport const NavigationMenuDropdownItem = React.forwardRef<\n  HTMLAnchorElement,\n  React.PropsWithChildren<React.ComponentProps<typeof NavigationMenuLink>>\n>((props, forwardedRef) => {\n  return (\n    <NavigationMenuLink ref={forwardedRef} variant=\"dropdownItem\" {...props} />\n  )\n})\n\nexport const NavigationMenuDropdownItemTitle = styled(Text, {\n  base: ['text-grey-900', 'font-semibold']\n})\n\nNavigationMenuDropdownItem.displayName = 'NavigationMenuDropdownItem'\nNavigationMenuDropdownItemTitle.displayName = 'NavigationMenuDropdownItemTitle'\n"],"mappings":";;;;;AAOA,IAAa,6BAA6B,MAAM,YAG7C,OAAO,iBAAiB;AACzB,QACE,sBAAA,cAAC,oBAAD;EAAoB,KAAK;EAAc,SAAQ;EAAe,GAAI;EAAS,CAAA;EAE7E;AAEF,IAAa,kCAAkC,OAAO,MAAM,EAC1D,MAAM,CAAC,iBAAiB,gBAAgB,EACzC,CAAC;AAEF,2BAA2B,cAAc;AACzC,gCAAgC,cAAc"}

package/dist/components/navigation/NavigationMenuDropdownTrigger.js

@@ -1,35 +1,36 @@
-import { styled as e } from "../../styled.js";
-import { Icon as t } from "../icon/Icon.js";
-import { preventEvent as n } from "../../utilities/event/preventEvent.js";
-import { navigationMenuActiveItemStyles as r, navigationMenuBaseItemStyles as i } from "./NavigationMenu.styles.js";
-import a from "clsx";
-import o from "react";
-import { ChevronDown as s } from "@atom-learning/icons";
-import * as c from "@radix-ui/react-navigation-menu";
+import { styled } from "../../styled.js";
+import { Icon } from "../icon/Icon.js";
+import { preventEvent } from "../../utilities/event/preventEvent.js";
+import { navigationMenuActiveItemStyles, navigationMenuBaseItemStyles } from "./NavigationMenu.styles.js";
+import clsx from "clsx";
+import React from "react";
+import { ChevronDown } from "@atom-learning/icons";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 //#region src/components/navigation/NavigationMenuDropdownTrigger.tsx
-var l = e(c.Trigger, {
+var StyledTrigger = styled(NavigationMenuPrimitive.Trigger, {
 	base: [
-		...i,
+		...navigationMenuBaseItemStyles,
 		"flex",
 		"items-center",
 		"rounded-md",
 		"justify-between",
 		"data-[state=open]:bg-(--trigger-background-open)"
 	],
-	variants: { active: { true: r } }
-}), u = o.forwardRef(({ children: e, active: r, ...i }, c) => /* @__PURE__ */ o.createElement(l, {
-	active: r,
-	...i,
-	ref: c,
-	onPointerMove: n,
-	onPointerLeave: n
-}, e, /* @__PURE__ */ o.createElement(t, {
-	is: s,
+	variants: { active: { true: navigationMenuActiveItemStyles } }
+});
+var NavigationMenuDropdownTrigger = React.forwardRef(({ children, active, ...props }, forwardedRef) => /* @__PURE__ */ React.createElement(StyledTrigger, {
+	active,
+	...props,
+	ref: forwardedRef,
+	onPointerMove: preventEvent,
+	onPointerLeave: preventEvent
+}, children, /* @__PURE__ */ React.createElement(Icon, {
+	is: ChevronDown,
 	size: "sm",
-	className: a("ml-1", "in-data-[state=open]:-rotate-180", "motion-safe:duration-200", "motion-safe:ease-in", "motion-safe:transition-transform")
+	className: clsx("ml-1", "in-data-[state=open]:-rotate-180", "motion-safe:duration-200", "motion-safe:ease-in", "motion-safe:transition-transform")
 })));
-u.displayName = "NavigationMenuDropdownTrigger";
+NavigationMenuDropdownTrigger.displayName = "NavigationMenuDropdownTrigger";
 //#endregion
-export { u as NavigationMenuDropdownTrigger };
+export { NavigationMenuDropdownTrigger };
 
 //# sourceMappingURL=NavigationMenuDropdownTrigger.js.map

package/dist/components/navigation/NavigationMenuDropdownTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuDropdownTrigger.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\n\nimport { Icon } from '../icon/Icon'\nimport {\n  navigationMenuActiveItemStyles,\n  navigationMenuBaseItemStyles\n} from './NavigationMenu.styles'\n\nconst StyledTrigger = styled(NavigationMenuPrimitive.Trigger, {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'flex',\n    'items-center',\n    'rounded-md',\n    'justify-between',\n    'data-[state=open]:bg-(--trigger-background-open)'\n  ],\n  variants: {\n    active: {\n      true: navigationMenuActiveItemStyles\n    }\n  }\n})\n\nexport const NavigationMenuDropdownTrigger = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof StyledTrigger>\n>(({ children, active, ...props }, forwardedRef) => (\n  <StyledTrigger\n    active={active}\n    {...props}\n    ref={forwardedRef}\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n  >\n    {children}\n    <Icon\n      is={ChevronDown}\n      size=\"sm\"\n      className={clsx(\n        'ml-1',\n        'in-data-[state=open]:-rotate-180',\n        'motion-safe:duration-200',\n        'motion-safe:ease-in',\n        'motion-safe:transition-transform'\n      )}\n    />\n  </StyledTrigger>\n))\n\nNavigationMenuDropdownTrigger.displayName = 'NavigationMenuDropdownTrigger'\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAgB,EAAO,EAAwB,SAAS;CAC5D,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,QAAQ,EACN,MAAM,GACP,EACF;CACF,CAAC,EAEW,IAAgC,EAAM,YAGhD,EAAE,aAAU,WAAQ,GAAG,KAAS,MACjC,kBAAA,cAAC,GAAD;CACU;CACR,GAAI;CACJ,KAAK;CACL,eAAe;CACf,gBAAgB;CAcF,EAZb,GACD,kBAAA,cAAC,GAAD;CACE,IAAI;CACJ,MAAK;CACL,WAAW,EACT,QACA,oCACA,4BACA,uBACA,mCACD;CACD,CAAA,CACY,CAChB;AAEF,EAA8B,cAAc"}
+{"version":3,"file":"NavigationMenuDropdownTrigger.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuDropdownTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\n\nimport { Icon } from '../icon/Icon'\nimport {\n  navigationMenuActiveItemStyles,\n  navigationMenuBaseItemStyles\n} from './NavigationMenu.styles'\n\nconst StyledTrigger = styled(NavigationMenuPrimitive.Trigger, {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'flex',\n    'items-center',\n    'rounded-md',\n    'justify-between',\n    'data-[state=open]:bg-(--trigger-background-open)'\n  ],\n  variants: {\n    active: {\n      true: navigationMenuActiveItemStyles\n    }\n  }\n})\n\nexport const NavigationMenuDropdownTrigger = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof StyledTrigger>\n>(({ children, active, ...props }, forwardedRef) => (\n  <StyledTrigger\n    active={active}\n    {...props}\n    ref={forwardedRef}\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n  >\n    {children}\n    <Icon\n      is={ChevronDown}\n      size=\"sm\"\n      className={clsx(\n        'ml-1',\n        'in-data-[state=open]:-rotate-180',\n        'motion-safe:duration-200',\n        'motion-safe:ease-in',\n        'motion-safe:transition-transform'\n      )}\n    />\n  </StyledTrigger>\n))\n\nNavigationMenuDropdownTrigger.displayName = 'NavigationMenuDropdownTrigger'\n"],"mappings":";;;;;;;;;AAcA,IAAM,gBAAgB,OAAO,wBAAwB,SAAS;CAC5D,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,QAAQ,EACN,MAAM,gCACP,EACF;CACF,CAAC;AAEF,IAAa,gCAAgC,MAAM,YAGhD,EAAE,UAAU,QAAQ,GAAG,SAAS,iBACjC,sBAAA,cAAC,eAAD;CACU;CACR,GAAI;CACJ,KAAK;CACL,eAAe;CACf,gBAAgB;CAcF,EAZb,UACD,sBAAA,cAAC,MAAD;CACE,IAAI;CACJ,MAAK;CACL,WAAW,KACT,QACA,oCACA,4BACA,uBACA,mCACD;CACD,CAAA,CACY,CAChB;AAEF,8BAA8B,cAAc"}

package/dist/components/navigation/NavigationMenuLink.js

@@ -1,18 +1,20 @@
-import { styled as e } from "../../styled.js";
-import { getExternalAnchorProps as t } from "../../utilities/uri/index.js";
-import { navigationMenuBaseItemStyles as n } from "./NavigationMenu.styles.js";
-import r from "react";
-import * as i from "@radix-ui/react-navigation-menu";
+import { styled } from "../../styled.js";
+import { getExternalAnchorProps } from "../../utilities/uri/index.js";
+import { navigationMenuBaseItemStyles } from "./NavigationMenu.styles.js";
+import React from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 //#region src/components/navigation/NavigationMenuLink.tsx
-var a = e("button", { base: [
-	...n,
+var DisabledButton = styled("button", { base: [
+	...navigationMenuBaseItemStyles,
 	"disabled:bg-none",
 	"disabled:cursor-default",
 	"disabled:opacity-30",
 	"disabled:text-text"
-] }), o = i.Item, s = e(i.Link, {
+] });
+var ListItem = NavigationMenuPrimitive.Item;
+var StyledLink = styled(NavigationMenuPrimitive.Link, {
 	base: [
-		...n,
+		...navigationMenuBaseItemStyles,
 		"block",
 		"no-underline",
 		"leading-none"
@@ -43,19 +45,20 @@ var a = e("button", { base: [
 			"data-active:after:w-6"
 		]
 	} }
-}), c = r.forwardRef(({ children: e, href: n, disabled: i, className: c, variant: l = "link", ref: u, ...d }, f) => /* @__PURE__ */ r.createElement(o, null, i ? /* @__PURE__ */ r.createElement(a, {
-	disabled: !0,
-	className: c
-}, e) : /* @__PURE__ */ r.createElement(s, {
-	href: n,
-	ref: f,
-	elementType: l,
-	className: c,
-	...t(n),
-	...d
-}, e)));
-c.displayName = "NavigationMenuLink";
+});
+var NavigationMenuLink = React.forwardRef(({ children, href, disabled, className, variant = "link", ref: _ref, ...props }, forwardedRef) => /* @__PURE__ */ React.createElement(ListItem, null, disabled ? /* @__PURE__ */ React.createElement(DisabledButton, {
+	disabled: true,
+	className
+}, children) : /* @__PURE__ */ React.createElement(StyledLink, {
+	href,
+	ref: forwardedRef,
+	elementType: variant,
+	className,
+	...getExternalAnchorProps(href),
+	...props
+}, children)));
+NavigationMenuLink.displayName = "NavigationMenuLink";
 //#endregion
-export { c as NavigationMenuLink };
+export { NavigationMenuLink };
 
 //# sourceMappingURL=NavigationMenuLink.js.map

package/dist/components/navigation/NavigationMenuLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuLink.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuLink.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuBaseItemStyles } from './NavigationMenu.styles'\n\nconst DisabledButton = styled('button', {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'disabled:bg-none',\n    'disabled:cursor-default',\n    'disabled:opacity-30',\n    'disabled:text-text'\n  ]\n})\n\nconst ListItem = NavigationMenuPrimitive.Item\n\nconst StyledLink = styled(NavigationMenuPrimitive.Link, {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'block',\n    'no-underline',\n    'leading-none'\n  ],\n  variants: {\n    elementType: {\n      dropdownItem: [\n        'data-active:bg-background-selected',\n        'data-active:text-text-selected',\n        'data-active:hover:bg-background-selected-hover',\n        'data-active:hover:text-text-selected-hover',\n        'data-active:active:bg-background-selected-pressed',\n        'data-active:active:text-text-selected-pressed',\n        'data-active:focus-visible:shadow-[0_0_0_2px_var(--color-primary-800)]',\n        'data-active:focus-visible:text-text-selected-focus'\n      ],\n      link: [\n        'data-active:font-semibold',\n        'data-active:text-item-(--background-selected)',\n        'data-active:after:-translate-x-1/2',\n        'data-active:after:absolute',\n        'data-active:after:bg-item-(--background-selected)',\n        'data-active:after:block',\n        'data-active:after:bottom-0',\n        'data-active:after:h-0.5',\n        'data-active:after:left-1/2',\n        'data-active:after:rounded-md',\n        'data-active:after:translate-y-0',\n        'data-active:after:w-6'\n      ]\n    }\n  }\n})\n\nexport const NavigationMenuLink = React.forwardRef<\n  HTMLAnchorElement,\n  Omit<React.ComponentProps<typeof StyledLink>, 'elementType'> & {\n    disabled?: boolean\n    variant?: React.ComponentProps<typeof StyledLink>['elementType']\n  }\n>(\n  (\n    {\n      children,\n      href,\n      disabled,\n      className,\n      variant = 'link',\n      ref: _ref,\n      ...props\n    },\n    forwardedRef\n  ) => (\n    <ListItem>\n      {disabled ? (\n        <DisabledButton disabled className={className}>\n          {children}\n        </DisabledButton>\n      ) : (\n        <StyledLink\n          href={href}\n          ref={forwardedRef as any}\n          elementType={variant}\n          className={className}\n          {...getExternalAnchorProps(href)}\n          {...props}\n        >\n          {children}\n        </StyledLink>\n      )}\n    </ListItem>\n  )\n)\n\nNavigationMenuLink.displayName = 'NavigationMenuLink'\n"],"mappings":";;;;;;AAQA,IAAM,IAAiB,EAAO,UAAU,EACtC,MAAM;CACJ,GAAG;CACH;CACA;CACA;CACA;CACD,EACF,CAAC,EAEI,IAAW,EAAwB,MAEnC,IAAa,EAAO,EAAwB,MAAM;CACtD,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACD;CACD,UAAU,EACR,aAAa;EACX,cAAc;GACZ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACD,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACF,EACF;CACF,CAAC,EAEW,IAAqB,EAAM,YAQpC,EACE,aACA,SACA,aACA,cACA,aAAU,QACV,KAAK,GACL,GAAG,KAEL,MAEA,kBAAA,cAAC,GAAA,MACE,IACC,kBAAA,cAAC,GAAD;CAAgB,UAAA;CAAoB;CAEnB,EADd,EACc,GAEjB,kBAAA,cAAC,GAAD;CACQ;CACN,KAAK;CACL,aAAa;CACF;CACX,GAAI,EAAuB,EAAK;CAChC,GAAI;CAGO,EADV,EACU,CAEN,CAEd;AAED,EAAmB,cAAc"}
+{"version":3,"file":"NavigationMenuLink.js","names":[],"sources":["../../../src/components/navigation/NavigationMenuLink.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuBaseItemStyles } from './NavigationMenu.styles'\n\nconst DisabledButton = styled('button', {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'disabled:bg-none',\n    'disabled:cursor-default',\n    'disabled:opacity-30',\n    'disabled:text-text'\n  ]\n})\n\nconst ListItem = NavigationMenuPrimitive.Item\n\nconst StyledLink = styled(NavigationMenuPrimitive.Link, {\n  base: [\n    ...navigationMenuBaseItemStyles,\n    'block',\n    'no-underline',\n    'leading-none'\n  ],\n  variants: {\n    elementType: {\n      dropdownItem: [\n        'data-active:bg-background-selected',\n        'data-active:text-text-selected',\n        'data-active:hover:bg-background-selected-hover',\n        'data-active:hover:text-text-selected-hover',\n        'data-active:active:bg-background-selected-pressed',\n        'data-active:active:text-text-selected-pressed',\n        'data-active:focus-visible:shadow-[0_0_0_2px_var(--color-primary-800)]',\n        'data-active:focus-visible:text-text-selected-focus'\n      ],\n      link: [\n        'data-active:font-semibold',\n        'data-active:text-item-(--background-selected)',\n        'data-active:after:-translate-x-1/2',\n        'data-active:after:absolute',\n        'data-active:after:bg-item-(--background-selected)',\n        'data-active:after:block',\n        'data-active:after:bottom-0',\n        'data-active:after:h-0.5',\n        'data-active:after:left-1/2',\n        'data-active:after:rounded-md',\n        'data-active:after:translate-y-0',\n        'data-active:after:w-6'\n      ]\n    }\n  }\n})\n\nexport const NavigationMenuLink = React.forwardRef<\n  HTMLAnchorElement,\n  Omit<React.ComponentProps<typeof StyledLink>, 'elementType'> & {\n    disabled?: boolean\n    variant?: React.ComponentProps<typeof StyledLink>['elementType']\n  }\n>(\n  (\n    {\n      children,\n      href,\n      disabled,\n      className,\n      variant = 'link',\n      ref: _ref,\n      ...props\n    },\n    forwardedRef\n  ) => (\n    <ListItem>\n      {disabled ? (\n        <DisabledButton disabled className={className}>\n          {children}\n        </DisabledButton>\n      ) : (\n        <StyledLink\n          href={href}\n          ref={forwardedRef as any}\n          elementType={variant}\n          className={className}\n          {...getExternalAnchorProps(href)}\n          {...props}\n        >\n          {children}\n        </StyledLink>\n      )}\n    </ListItem>\n  )\n)\n\nNavigationMenuLink.displayName = 'NavigationMenuLink'\n"],"mappings":";;;;;;AAQA,IAAM,iBAAiB,OAAO,UAAU,EACtC,MAAM;CACJ,GAAG;CACH;CACA;CACA;CACA;CACD,EACF,CAAC;AAEF,IAAM,WAAW,wBAAwB;AAEzC,IAAM,aAAa,OAAO,wBAAwB,MAAM;CACtD,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACD;CACD,UAAU,EACR,aAAa;EACX,cAAc;GACZ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACD,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACF,EACF;CACF,CAAC;AAEF,IAAa,qBAAqB,MAAM,YAQpC,EACE,UACA,MACA,UACA,WACA,UAAU,QACV,KAAK,MACL,GAAG,SAEL,iBAEA,sBAAA,cAAC,UAAA,MACE,WACC,sBAAA,cAAC,gBAAD;CAAgB,UAAA;CAAoB;CAEnB,EADd,SACc,GAEjB,sBAAA,cAAC,YAAD;CACQ;CACN,KAAK;CACL,aAAa;CACF;CACX,GAAI,uBAAuB,KAAK;CAChC,GAAI;CAGO,EADV,SACU,CAEN,CAEd;AAED,mBAAmB,cAAc"}

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.colorscheme.config.js

@@ -1,4 +1,4 @@
-var e = { light: {
+var colorSchemes = { light: {
 	"--text": "var(--foreground)",
 	"--background": "var(--base-1)",
 	"--background-hover": "var(--base-2)",
@@ -7,6 +7,6 @@ var e = { light: {
 	"--background-selected": "var(--accent-2)"
 } };
 //#endregion
-export { e as colorSchemes };
+export { colorSchemes };
 
 //# sourceMappingURL=NavigationMenuVertical.colorscheme.config.js.map

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.colorscheme.config.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuVertical.colorscheme.config.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVertical.colorscheme.config.ts"],"sourcesContent":["const light = {\n  '--text': 'var(--foreground)',\n  '--background': 'var(--base-1)',\n  '--background-hover': 'var(--base-2)',\n  '--background-active': 'var(--base-3)',\n  '--text-selected': 'var(--accent-9)',\n  '--background-selected': 'var(--accent-2)'\n}\n\nexport const colorSchemes = {\n  light\n}\n"],"mappings":"AASA,IAAa,IAAe,EAC1B,OAVY;CACZ,UAAU;CACV,gBAAgB;CAChB,sBAAsB;CACtB,uBAAuB;CACvB,mBAAmB;CACnB,yBAAyB;CAC1B,EAIA"}
+{"version":3,"file":"NavigationMenuVertical.colorscheme.config.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVertical.colorscheme.config.ts"],"sourcesContent":["const light = {\n  '--text': 'var(--foreground)',\n  '--background': 'var(--base-1)',\n  '--background-hover': 'var(--base-2)',\n  '--background-active': 'var(--base-3)',\n  '--text-selected': 'var(--accent-9)',\n  '--background-selected': 'var(--accent-2)'\n}\n\nexport const colorSchemes = {\n  light\n}\n"],"mappings":"AASA,IAAa,eAAe,EAC1B,OAVY;CACZ,UAAU;CACV,gBAAgB;CAChB,sBAAsB;CACtB,uBAAuB;CACvB,mBAAmB;CACnB,yBAAyB;CAC1B,EAIA"}