@helsenorge/designsystem-react 13.0.0-beta.2 → 13.0.0-beta.5

package/lib/useFocusToggle.js

@@ -0,0 +1,26 @@
+import { t as useElementList } from "./useElementList.js";
+import { t as FOCUSABLE_SELECTORS } from "./useFocusableElements.js";
+import { useEffect } from "react";
+const useFocusToggle = (ref, allowFocus) => {
+	const focusableElementList = useElementList(ref, FOCUSABLE_SELECTORS, { attributes: false });
+	useEffect(() => {
+		const TABINDEX_ATTRIBUTE_NAME = "tabindex";
+		const PREVIOUS_TABINDEX_ATTRIBUTE_NAME = "data-tabindex";
+		if (allowFocus) focusableElementList?.forEach((el) => {
+			const prevTabIndex = el.getAttribute(PREVIOUS_TABINDEX_ATTRIBUTE_NAME);
+			if (prevTabIndex) el.setAttribute(TABINDEX_ATTRIBUTE_NAME, prevTabIndex);
+			else el.removeAttribute(TABINDEX_ATTRIBUTE_NAME);
+		});
+		else focusableElementList?.forEach((el) => {
+			if (el.hasAttribute(TABINDEX_ATTRIBUTE_NAME)) el.setAttribute(PREVIOUS_TABINDEX_ATTRIBUTE_NAME, `${el.tabIndex}`);
+			el.tabIndex = -1;
+		});
+	}, [
+		ref,
+		allowFocus,
+		focusableElementList
+	]);
+};
+export { useFocusToggle as t };
+
+//# sourceMappingURL=useFocusToggle.js.map

package/lib/useFocusToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusToggle.js","names":[],"sources":["../src/hooks/useFocusToggle.ts"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport { useElementList } from './useElementList';\nimport { FOCUSABLE_SELECTORS } from './useFocusableElements';\n\n/**\n * Skru av og på fokus på fokuserbare elementer slik at de kan være en del av DOMen, men samtidig\n * ikke kunne fokuseres/tabbes til med tastaturet.\n * @param ref Alle barn av dette elementet vil sjekkes for om de er fokuserbare\n * @param allowFocus Om elementene skal være fokuserbare eller ikke\n * @returns void\n */\nexport const useFocusToggle = (ref: React.RefObject<HTMLElement>, allowFocus?: boolean): void => {\n  // Kan ikke lytte på endringer i attributter, fordi det vil føre til en loop når vi endrer dem etterpå\n  const focusableElementList = useElementList(ref, FOCUSABLE_SELECTORS, { attributes: false });\n\n  useEffect(() => {\n    const TABINDEX_ATTRIBUTE_NAME = 'tabindex';\n    const PREVIOUS_TABINDEX_ATTRIBUTE_NAME = 'data-tabindex';\n    if (allowFocus) {\n      focusableElementList?.forEach(el => {\n        // Sett tabIndex tilbake til verdien den hadde før, eller fjern tabIndex\n        // slik at elementet kan tabbes til igjen.\n        const prevTabIndex = el.getAttribute(PREVIOUS_TABINDEX_ATTRIBUTE_NAME);\n        if (prevTabIndex) {\n          el.setAttribute(TABINDEX_ATTRIBUTE_NAME, prevTabIndex);\n        } else {\n          el.removeAttribute(TABINDEX_ATTRIBUTE_NAME);\n        }\n      });\n    } else {\n      focusableElementList?.forEach(el => {\n        // Hvis elementet allerede har tabIndex, ta vare på den før vi gjør det umulig å\n        // tabbe til det.\n        if (el.hasAttribute(TABINDEX_ATTRIBUTE_NAME)) {\n          el.setAttribute(PREVIOUS_TABINDEX_ATTRIBUTE_NAME, `${el.tabIndex}`);\n        }\n        el.tabIndex = -1;\n      });\n    }\n  }, [ref, allowFocus, focusableElementList]);\n};\n"],"mappings":";;;AAYA,MAAa,kBAAkB,KAAmC,eAA+B;CAE/F,MAAM,uBAAuB,eAAe,KAAK,qBAAqB,EAAE,YAAY,OAAO,CAAC;AAE5F,iBAAgB;EACd,MAAM,0BAA0B;EAChC,MAAM,mCAAmC;AACzC,MAAI,WACF,uBAAsB,SAAQ,OAAM;GAGlC,MAAM,eAAe,GAAG,aAAa,iCAAiC;AACtE,OAAI,aACF,IAAG,aAAa,yBAAyB,aAAa;OAEtD,IAAG,gBAAgB,wBAAwB;IAE7C;MAEF,uBAAsB,SAAQ,OAAM;AAGlC,OAAI,GAAG,aAAa,wBAAwB,CAC1C,IAAG,aAAa,kCAAkC,GAAG,GAAG,WAAW;AAErE,MAAG,WAAW;IACd;IAEH;EAAC;EAAK;EAAY;EAAqB,CAAC"}

package/lib/useFocusTrap.js

@@ -0,0 +1,34 @@
+import { n as useFocusableElements } from "./useFocusableElements.js";
+import { t as getDocumentActiveElement } from "./focus.js";
+import { useEffect } from "react";
+const useFocusTrap = (ref, trapFocus = true) => {
+	const focusableElementList = useFocusableElements(ref);
+	const handleKeyboardEvent = (e) => {
+		if (trapFocus && ref.current && focusableElementList?.length && e.key === "Tab") {
+			const activeElement = getDocumentActiveElement(ref.current);
+			const firstElement = focusableElementList[0];
+			const lastElement = focusableElementList.length === 1 ? firstElement : focusableElementList[focusableElementList.length - 1];
+			if (e.shiftKey && activeElement === firstElement) {
+				lastElement.focus();
+				e.preventDefault();
+			} else if (!e.shiftKey && activeElement === lastElement) {
+				firstElement.focus();
+				e.preventDefault();
+			}
+		}
+	};
+	useEffect(() => {
+		ref.current?.addEventListener("keydown", handleKeyboardEvent);
+		return () => {
+			ref.current?.removeEventListener("keydown", handleKeyboardEvent);
+		};
+	}, [
+		ref,
+		trapFocus,
+		focusableElementList
+	]);
+};
+var useFocusTrap_default = useFocusTrap;
+export { useFocusTrap_default as n, useFocusTrap as t };
+
+//# sourceMappingURL=useFocusTrap.js.map

package/lib/useFocusTrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusTrap.js","names":[],"sources":["../src/hooks/useFocusTrap.ts"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport { useFocusableElements } from './useFocusableElements';\nimport { getDocumentActiveElement } from '../utils/focus';\n\n/**\n * Lås fokus til et bestemt element. Bruker vil bare kunne tabbe mellom fokuserbare elementer innenfor elementet.\n * @param ref Alle barn av dette elementet vil være fokuserbare, elementer utenfor vil ikke det\n * @param trapFocus Om fokus skal \"trappes\" innenfor elementet eller ikke. Default=true.\n */\nexport const useFocusTrap = (ref: React.RefObject<HTMLElement>, trapFocus = true): void => {\n  const focusableElementList = useFocusableElements(ref);\n\n  const handleKeyboardEvent = (e: KeyboardEvent): void => {\n    if (trapFocus && ref.current && focusableElementList?.length && e.key === 'Tab') {\n      const activeElement = getDocumentActiveElement(ref.current);\n      const firstElement = focusableElementList[0];\n      const lastElement = focusableElementList.length === 1 ? firstElement : focusableElementList[focusableElementList.length - 1];\n\n      if (e.shiftKey && activeElement === firstElement) {\n        /* shift + tab */\n        lastElement.focus();\n        e.preventDefault();\n      } else if (!e.shiftKey && activeElement === lastElement) {\n        /* tab */\n        firstElement.focus();\n        e.preventDefault();\n      }\n    }\n  };\n\n  useEffect(() => {\n    ref.current?.addEventListener('keydown', handleKeyboardEvent);\n\n    return (): void => {\n      ref.current?.removeEventListener('keydown', handleKeyboardEvent);\n    };\n  }, [ref, trapFocus, focusableElementList]); // focusableElementList må være med som dependency for at handleKeyboardEvent skal få oppdatert state\n};\n\nexport default useFocusTrap;\n"],"mappings":";;;AAUA,MAAa,gBAAgB,KAAmC,YAAY,SAAe;CACzF,MAAM,uBAAuB,qBAAqB,IAAI;CAEtD,MAAM,uBAAuB,MAA2B;AACtD,MAAI,aAAa,IAAI,WAAW,sBAAsB,UAAU,EAAE,QAAQ,OAAO;GAC/E,MAAM,gBAAgB,yBAAyB,IAAI,QAAQ;GAC3D,MAAM,eAAe,qBAAqB;GAC1C,MAAM,cAAc,qBAAqB,WAAW,IAAI,eAAe,qBAAqB,qBAAqB,SAAS;AAE1H,OAAI,EAAE,YAAY,kBAAkB,cAAc;AAEhD,gBAAY,OAAO;AACnB,MAAE,gBAAgB;cACT,CAAC,EAAE,YAAY,kBAAkB,aAAa;AAEvD,iBAAa,OAAO;AACpB,MAAE,gBAAgB;;;;AAKxB,iBAAgB;AACd,MAAI,SAAS,iBAAiB,WAAW,oBAAoB;AAE7D,eAAmB;AACjB,OAAI,SAAS,oBAAoB,WAAW,oBAAoB;;IAEjE;EAAC;EAAK;EAAW;EAAqB,CAAC;;AAG5C,IAAA,uBAAe"}

package/lib/useFocusableElements.js

@@ -0,0 +1,26 @@
+import { t as useElementList } from "./useElementList.js";
+const FOCUSABLE_SELECTORS = [
+	"a[href]:not([tabindex^=\"-\"])",
+	"area[href]:not([tabindex^=\"-\"])",
+	"input:not([type=\"hidden\"]):not([type=\"radio\"]):not([disabled]):not([tabindex^=\"-\"])",
+	"input[type=\"radio\"]:not([disabled]):not([tabindex^=\"-\"])",
+	"select:not([disabled]):not([tabindex^=\"-\"])",
+	"textarea:not([disabled]):not([tabindex^=\"-\"])",
+	"button:not([disabled]):not([tabindex^=\"-\"])",
+	"iframe:not([tabindex^=\"-\"])",
+	"audio[controls]:not([tabindex^=\"-\"])",
+	"video[controls]:not([tabindex^=\"-\"])",
+	"[contenteditable]:not([tabindex^=\"-\"])",
+	"[tabindex]:not([tabindex^=\"-\"])"
+].join(",");
+const useFocusableElements = (ref) => useElementList(ref, FOCUSABLE_SELECTORS, { attributeFilter: [
+	"href",
+	"tabindex",
+	"type",
+	"disabled",
+	"controls",
+	"contenteditable"
+] });
+export { useFocusableElements as n, FOCUSABLE_SELECTORS as t };
+
+//# sourceMappingURL=useFocusableElements.js.map

package/lib/useFocusableElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusableElements.js","names":[],"sources":["../src/hooks/useFocusableElements.ts"],"sourcesContent":["import { useElementList } from './useElementList';\n\n// Fra https://github.com/KittyGiraudel/focusable-selectors\nexport const FOCUSABLE_SELECTORS = [\n  'a[href]:not([tabindex^=\"-\"])',\n  'area[href]:not([tabindex^=\"-\"])',\n  'input:not([type=\"hidden\"]):not([type=\"radio\"]):not([disabled]):not([tabindex^=\"-\"])',\n  'input[type=\"radio\"]:not([disabled]):not([tabindex^=\"-\"])',\n  'select:not([disabled]):not([tabindex^=\"-\"])',\n  'textarea:not([disabled]):not([tabindex^=\"-\"])',\n  'button:not([disabled]):not([tabindex^=\"-\"])',\n  'iframe:not([tabindex^=\"-\"])',\n  'audio[controls]:not([tabindex^=\"-\"])',\n  'video[controls]:not([tabindex^=\"-\"])',\n  '[contenteditable]:not([tabindex^=\"-\"])',\n  '[tabindex]:not([tabindex^=\"-\"])',\n].join(',');\n\n/**\n * Overvåk et element og finn alle fokuserbare elementer inne i elementet. Bruker MutationObserver slik at eventuelle\n * nye elementer som legges til også vil inkluderes i listen.\n * @param ref Element som skal observeres\n * @returns Liste med fokuserbare HTML-elementer\n */\nexport const useFocusableElements = (ref: React.RefObject<HTMLElement>): NodeListOf<HTMLElement> | undefined =>\n  useElementList(ref, FOCUSABLE_SELECTORS, { attributeFilter: ['href', 'tabindex', 'type', 'disabled', 'controls', 'contenteditable'] });\n"],"mappings":";AAGA,MAAa,sBAAsB;CACjC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,CAAC,KAAK,IAAI;AAQX,MAAa,wBAAwB,QACnC,eAAe,KAAK,qBAAqB,EAAE,iBAAiB;CAAC;CAAQ;CAAY;CAAQ;CAAY;CAAY;CAAkB,EAAE,CAAC"}

package/lib/useIcons.js

@@ -0,0 +1,26 @@
+import { t as Icon_default } from "./Icon.js";
+import { t as LazyIcon_default } from "./LazyIcon.js";
+import { t as isComponent } from "./component.js";
+const useIcons = (children) => {
+	let leftIcon = null;
+	let rightIcon = null;
+	const firstChild = children[0];
+	if (isComponent(firstChild, Icon_default) || isComponent(firstChild, LazyIcon_default)) {
+		leftIcon = firstChild;
+		children.shift();
+	}
+	const lastChild = children[children.length - 1];
+	if (isComponent(lastChild, Icon_default) || isComponent(lastChild, LazyIcon_default)) {
+		rightIcon = lastChild;
+		children.pop();
+	}
+	const restChildren = children.filter((child) => child);
+	return [
+		leftIcon,
+		rightIcon,
+		restChildren.length > 0 ? restChildren : null
+	];
+};
+export { useIcons as t };
+
+//# sourceMappingURL=useIcons.js.map

package/lib/useIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIcons.js","names":["leftIcon: BaseIconElement | null","rightIcon: BaseIconElement | null"],"sources":["../src/hooks/useIcons.ts"],"sourcesContent":["import Icon, { BaseIconProps, IconProps } from '../components/Icon';\nimport LazyIcon, { LazyIconProps } from '../components/LazyIcon';\nimport { isComponent } from '../utils/component';\n\nexport type BaseIconElement = React.ReactElement<BaseIconProps>;\n\nexport const useIcons = (children: React.ReactNode[]): [BaseIconElement | null, BaseIconElement | null, React.ReactNode[] | null] => {\n  let leftIcon: BaseIconElement | null = null;\n  let rightIcon: BaseIconElement | null = null;\n\n  const firstChild = children[0];\n  if (isComponent<IconProps>(firstChild, Icon) || isComponent<LazyIconProps>(firstChild, LazyIcon)) {\n    leftIcon = firstChild;\n    children.shift();\n  }\n\n  const lastChild = children[children.length - 1];\n  if (isComponent<IconProps>(lastChild, Icon) || isComponent<LazyIconProps>(lastChild, LazyIcon)) {\n    rightIcon = lastChild;\n    children.pop();\n  }\n  const restChildren = children.filter(child => child);\n\n  return [leftIcon, rightIcon, restChildren.length > 0 ? restChildren : null];\n};\n"],"mappings":";;;AAMA,MAAa,YAAY,aAA4G;CACnI,IAAIA,WAAmC;CACvC,IAAIC,YAAoC;CAExC,MAAM,aAAa,SAAS;AAC5B,KAAI,YAAuB,YAAY,aAAK,IAAI,YAA2B,YAAY,iBAAS,EAAE;AAChG,aAAW;AACX,WAAS,OAAO;;CAGlB,MAAM,YAAY,SAAS,SAAS,SAAS;AAC7C,KAAI,YAAuB,WAAW,aAAK,IAAI,YAA2B,WAAW,iBAAS,EAAE;AAC9F,cAAY;AACZ,WAAS,KAAK;;CAEhB,MAAM,eAAe,SAAS,QAAO,UAAS,MAAM;AAEpD,QAAO;EAAC;EAAU;EAAW,aAAa,SAAS,IAAI,eAAe;EAAK"}

package/lib/useIdWithFallback.js

@@ -0,0 +1,8 @@
+import { useId } from "react";
+const useIdWithFallback = (initial) => {
+	const fallbackId = useId();
+	return initial || fallbackId;
+};
+export { useIdWithFallback as t };
+
+//# sourceMappingURL=useIdWithFallback.js.map

package/lib/useIdWithFallback.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIdWithFallback.js","names":[],"sources":["../src/hooks/useIdWithFallback.ts"],"sourcesContent":["import { useId } from 'react';\n\n/**\n * Returner unik id som ikke endrer seg for hver render\n * @param initial id som vil overstyre react sin useId\n * @returns stable id-string\n */\nexport const useIdWithFallback = (initial?: string): string => {\n  const fallbackId = useId();\n\n  return initial || fallbackId;\n};\n"],"mappings":";AAOA,MAAa,qBAAqB,YAA6B;CAC7D,MAAM,aAAa,OAAO;AAE1B,QAAO,WAAW"}

package/lib/useIntersectionObserver.js

@@ -0,0 +1,14 @@
+import { useEffect } from "react";
+const useIntersectionObserver = (ref, callback, options) => {
+	useEffect(() => {
+		const intersectionObserver = new IntersectionObserver(callback, options);
+		if (ref?.current) intersectionObserver.observe(ref.current);
+		return () => {
+			if (ref?.current) intersectionObserver.unobserve(ref.current);
+			else intersectionObserver.disconnect();
+		};
+	}, [ref, options]);
+};
+export { useIntersectionObserver as t };
+
+//# sourceMappingURL=useIntersectionObserver.js.map

package/lib/useIntersectionObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIntersectionObserver.js","names":[],"sources":["../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { useEffect } from 'react';\n\n/**\n * Lytt på endringer i synligheten (intersection) til et HTML-element. F.eks. kan du bruke denne til å kalle en callback\n * når elementet er i ferd med å forsvinne ut av vinduet.\n *\n * @param ref Element som skal observeres\n * @param callback Kalles når en endring i intersection er observert\n * @param options Objekt med options for IntersectionObserver, f.eks. threshold for å bestemme når callbacken skal fyres\n */\n\nexport const useIntersectionObserver = (\n  ref: React.RefObject<Element>,\n  callback: IntersectionObserverCallback,\n  options?: IntersectionObserverInit\n): void => {\n  useEffect(() => {\n    const intersectionObserver = new IntersectionObserver(callback, options);\n\n    if (ref?.current) {\n      intersectionObserver.observe(ref.current);\n    }\n\n    return (): void => {\n      if (ref?.current) {\n        intersectionObserver.unobserve(ref.current);\n      } else {\n        intersectionObserver.disconnect();\n      }\n    };\n  }, [ref, options]);\n};\n"],"mappings":";AAWA,MAAa,2BACX,KACA,UACA,YACS;AACT,iBAAgB;EACd,MAAM,uBAAuB,IAAI,qBAAqB,UAAU,QAAQ;AAExE,MAAI,KAAK,QACP,sBAAqB,QAAQ,IAAI,QAAQ;AAG3C,eAAmB;AACjB,OAAI,KAAK,QACP,sBAAqB,UAAU,IAAI,QAAQ;OAE3C,sBAAqB,YAAY;;IAGpC,CAAC,KAAK,QAAQ,CAAC"}

package/lib/useIsMobileBreakpoint.js

@@ -0,0 +1,8 @@
+import { t as breakpoints } from "./grid.js";
+import { n as useBreakpoint } from "./useBreakpoint.js";
+const useIsMobileBreakpoint = () => {
+	return useBreakpoint() < breakpoints.md;
+};
+export { useIsMobileBreakpoint as t };
+
+//# sourceMappingURL=useIsMobileBreakpoint.js.map

package/lib/useIsMobileBreakpoint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsMobileBreakpoint.js","names":[],"sources":["../src/hooks/useIsMobileBreakpoint.ts"],"sourcesContent":["import { useBreakpoint } from './useBreakpoint';\nimport { breakpoints } from '../theme/grid';\n\nexport const useIsMobileBreakpoint = (): boolean => {\n  const breakpoint = useBreakpoint();\n  return breakpoint < breakpoints.md;\n};\n"],"mappings":";;AAGA,MAAa,8BAAuC;AAElD,QADmB,eAAe,GACd,YAAY"}

package/lib/useIsServerSide.js

@@ -0,0 +1,11 @@
+import { useEffect, useState } from "react";
+const useIsServerSide = () => {
+	const [isServerSide, setIsServerSide] = useState(true);
+	useEffect(() => {
+		setIsServerSide(false);
+	}, []);
+	return isServerSide;
+};
+export { useIsServerSide as t };
+
+//# sourceMappingURL=useIsServerSide.js.map

package/lib/useIsServerSide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsServerSide.js","names":[],"sources":["../src/hooks/useIsServerSide.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\n\n/**\n * Sjekk om React kjører på server, eller ikke. (useEffect kjører ikke på server)\n *\n * @returns true dersom koden kjører på server\n */\nexport const useIsServerSide = (): boolean => {\n  const [isServerSide, setIsServerSide] = useState(true);\n\n  useEffect(() => {\n    setIsServerSide(false);\n  }, []);\n\n  return isServerSide;\n};\n"],"mappings":";AAOA,MAAa,wBAAiC;CAC5C,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;AAEtD,iBAAgB;AACd,kBAAgB,MAAM;IACrB,EAAE,CAAC;AAEN,QAAO"}

package/lib/useIsVisible.js

@@ -0,0 +1,16 @@
+import { t as useIntersectionObserver } from "./useIntersectionObserver.js";
+import { useState } from "react";
+const useIsVisible = (ref, threshold = 1, options, initial = false) => {
+	const [isVisible, setIsVisible] = useState(initial);
+	const handleIntersectChange = (entries) => {
+		setIsVisible(threshold === 0 ? entries[0].intersectionRatio !== threshold : entries[0].intersectionRatio >= threshold);
+	};
+	useIntersectionObserver(ref, handleIntersectChange, {
+		threshold,
+		...options
+	});
+	return isVisible;
+};
+export { useIsVisible as t };
+
+//# sourceMappingURL=useIsVisible.js.map

package/lib/useIsVisible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsVisible.js","names":["handleIntersectChange: IntersectionObserverCallback"],"sources":["../src/hooks/useIsVisible.ts"],"sourcesContent":["import { useState } from 'react';\n\nimport { useIntersectionObserver } from './useIntersectionObserver';\n\n/**\n * Sjekk om et HTML-element er synlig i vinduet, eller ikke.\n *\n * @param ref Element som skal observeres\n * @param threshold Hvor synlig må elementet være? Default = 1 (helt synlig)\n * @param options Objekt med options for IntersectionObserver, f.eks. threshold for å bestemme når callbacken skal fyres\n * @param initial Om elementet default skal antas å være synlig eller ikke. Default: ikke synlig\n * @returns true hvis objektet er synlig lik threshold eller mer, false hvis ikke\n */\nexport const useIsVisible = (\n  ref: React.RefObject<Element>,\n  threshold = 1,\n  options?: IntersectionObserverInit,\n  initial = false\n): boolean => {\n  const [isVisible, setIsVisible] = useState(initial);\n\n  const handleIntersectChange: IntersectionObserverCallback = entries => {\n    setIsVisible(threshold === 0 ? entries[0].intersectionRatio !== threshold : entries[0].intersectionRatio >= threshold);\n  };\n\n  useIntersectionObserver(ref, handleIntersectChange, { threshold, ...options });\n\n  return isVisible;\n};\n"],"mappings":";;AAaA,MAAa,gBACX,KACA,YAAY,GACZ,SACA,UAAU,UACE;CACZ,MAAM,CAAC,WAAW,gBAAgB,SAAS,QAAQ;CAEnD,MAAMA,yBAAsD,YAAW;AACrE,eAAa,cAAc,IAAI,QAAQ,GAAG,sBAAsB,YAAY,QAAQ,GAAG,qBAAqB,UAAU;;AAGxH,yBAAwB,KAAK,uBAAuB;EAAE;EAAW,GAAG;EAAS,CAAC;AAE9E,QAAO"}

package/lib/useKeyboardEvent.js

@@ -0,0 +1,20 @@
+import { useEffect } from "react";
+const useKeyboardEvent = (ref, callback, key, events = ["keydown"]) => {
+	useEffect(() => {
+		const handleKeyboardEvent = (event) => {
+			if (event.key === key || Array.isArray(key) && key.includes(event.key)) callback(event);
+		};
+		events.forEach((eventName) => ref.current?.addEventListener(eventName, handleKeyboardEvent));
+		return () => {
+			events.forEach((eventName) => ref.current?.removeEventListener(eventName, handleKeyboardEvent));
+		};
+	}, [
+		ref,
+		callback,
+		events,
+		key
+	]);
+};
+export { useKeyboardEvent as t };
+
+//# sourceMappingURL=useKeyboardEvent.js.map

package/lib/useKeyboardEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKeyboardEvent.js","names":[],"sources":["../src/hooks/useKeyboardEvent.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ntype KeyboardEvents = keyof PickByValue<HTMLElementEventMap, KeyboardEvent>;\n\n/**\n * Kjør en callback når bruker skriver på tastaturet.\n * @param ref Element som skal lyttes på.\n * @param callback Callback som kjøres når det skjer en event.\n * @param key Knapp, eller liste med knapper, som skal trigge callback\n * @param events Liste med keyboard-events som skal trigge callback. Default: \"keydown\"\n */\nexport const useKeyboardEvent = (\n  ref: React.RefObject<HTMLElement>,\n  callback: (event: HTMLElementEventMap[KeyboardEvents]) => void,\n  key: string | string[],\n  events: KeyboardEvents[] = ['keydown']\n): void => {\n  useEffect(() => {\n    const handleKeyboardEvent = (event: HTMLElementEventMap[KeyboardEvents]): void => {\n      if (event.key === key || (Array.isArray(key) && key.includes(event.key))) {\n        callback(event);\n      }\n    };\n\n    events.forEach(eventName => ref.current?.addEventListener(eventName, handleKeyboardEvent));\n\n    return (): void => {\n      events.forEach(eventName => ref.current?.removeEventListener(eventName, handleKeyboardEvent));\n    };\n  }, [ref, callback, events, key]);\n};\n"],"mappings":";AAWA,MAAa,oBACX,KACA,UACA,KACA,SAA2B,CAAC,UAAU,KAC7B;AACT,iBAAgB;EACd,MAAM,uBAAuB,UAAqD;AAChF,OAAI,MAAM,QAAQ,OAAQ,MAAM,QAAQ,IAAI,IAAI,IAAI,SAAS,MAAM,IAAI,CACrE,UAAS,MAAM;;AAInB,SAAO,SAAQ,cAAa,IAAI,SAAS,iBAAiB,WAAW,oBAAoB,CAAC;AAE1F,eAAmB;AACjB,UAAO,SAAQ,cAAa,IAAI,SAAS,oBAAoB,WAAW,oBAAoB,CAAC;;IAE9F;EAAC;EAAK;EAAU;EAAQ;EAAI,CAAC"}

package/lib/useLayoutEvent.js

@@ -0,0 +1,21 @@
+import { t as debounce } from "./debounce.js";
+import { useEffect } from "react";
+const useLayoutEvent = (callback, events = [
+	"layoutchange",
+	"resize",
+	"orientationchange"
+], debounceMs = 10) => {
+	useEffect(() => {
+		if (typeof window !== "object") return;
+		const [debouncedCallback, teardown] = debounce(callback, debounceMs);
+		events.forEach((eventName) => window.addEventListener(eventName, debouncedCallback));
+		debouncedCallback();
+		return () => {
+			teardown();
+			events.forEach((eventName) => window.removeEventListener(eventName, debouncedCallback));
+		};
+	}, []);
+};
+export { useLayoutEvent as t };
+
+//# sourceMappingURL=useLayoutEvent.js.map

package/lib/useLayoutEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLayoutEvent.js","names":[],"sources":["../src/hooks/useLayoutEvent.ts"],"sourcesContent":["import { useEffect } from 'react';\n\nimport { debounce } from '../utils/debounce';\n\n/**\n * Lytt på ulike layout-events som har betydning for rendring og størrelse på elementer.\n *\n * @param callback Kalles for hver event\n * @param events Liste med events som skal lyttes på\n * @param debounceMs Begrens kall til callback til x antall ms\n */\nexport const useLayoutEvent = (callback: () => void, events = ['layoutchange', 'resize', 'orientationchange'], debounceMs = 10): void => {\n  useEffect(() => {\n    if (typeof window !== 'object') return;\n    const [debouncedCallback, teardown] = debounce(callback, debounceMs);\n\n    events.forEach(eventName => window.addEventListener(eventName, debouncedCallback));\n\n    debouncedCallback();\n\n    return (): void => {\n      teardown();\n      events.forEach(eventName => window.removeEventListener(eventName, debouncedCallback));\n    };\n  }, []);\n};\n"],"mappings":";;AAWA,MAAa,kBAAkB,UAAsB,SAAS;CAAC;CAAgB;CAAU;CAAoB,EAAE,aAAa,OAAa;AACvI,iBAAgB;AACd,MAAI,OAAO,WAAW,SAAU;EAChC,MAAM,CAAC,mBAAmB,YAAY,SAAS,UAAU,WAAW;AAEpE,SAAO,SAAQ,cAAa,OAAO,iBAAiB,WAAW,kBAAkB,CAAC;AAElF,qBAAmB;AAEnB,eAAmB;AACjB,aAAU;AACV,UAAO,SAAQ,cAAa,OAAO,oBAAoB,WAAW,kBAAkB,CAAC;;IAEtF,EAAE,CAAC"}

package/lib/useOutsideEvent.js

@@ -0,0 +1,20 @@
+import { useEffect } from "react";
+const useOutsideEvent = (ref, callback, events = ["mousedown"]) => {
+	const refArray = Array.isArray(ref) ? ref : [ref];
+	const handleOutsideEvent = (event) => {
+		if (refArray.every((ref$1) => ref$1.current && !event.composedPath().includes(ref$1.current))) callback(event);
+	};
+	useEffect(() => {
+		events.forEach((eventName) => document.addEventListener(eventName, handleOutsideEvent));
+		return () => {
+			events.forEach((eventName) => document.removeEventListener(eventName, handleOutsideEvent));
+		};
+	}, [
+		refArray,
+		callback,
+		events
+	]);
+};
+export { useOutsideEvent as t };
+
+//# sourceMappingURL=useOutsideEvent.js.map

package/lib/useOutsideEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOutsideEvent.js","names":[],"sources":["../src/hooks/useOutsideEvent.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ntype OutsideEvents = keyof PickByValue<HTMLElementEventMap, MouseEvent | FocusEvent>;\n\n/**\n * Custom hook for klikk eller fokus utenfor et gitt element (eller flere elementer)\n * @param ref Sjekker om det klikkes utenfor dette elementet/elementene\n * @param callback Callback-funksjon ved klikk utenfor elementet/elementene\n * @param events Type eventer å lytte på. Default: mousedown\n */\nexport const useOutsideEvent = (\n  ref: React.RefObject<HTMLElement> | React.RefObject<HTMLElement>[],\n  callback: (event: HTMLElementEventMap[OutsideEvents]) => void,\n  events: OutsideEvents[] = ['mousedown']\n): void => {\n  const refArray = Array.isArray(ref) ? ref : [ref];\n\n  const handleOutsideEvent = (event: HTMLElementEventMap[OutsideEvents]): void => {\n    if (refArray.every(ref => ref.current && !event.composedPath().includes(ref.current))) {\n      callback(event);\n    }\n  };\n\n  useEffect(() => {\n    events.forEach(eventName => document.addEventListener(eventName, handleOutsideEvent));\n\n    return (): void => {\n      events.forEach(eventName => document.removeEventListener(eventName, handleOutsideEvent));\n    };\n  }, [refArray, callback, events]);\n};\n"],"mappings":";AAUA,MAAa,mBACX,KACA,UACA,SAA0B,CAAC,YAAY,KAC9B;CACT,MAAM,WAAW,MAAM,QAAQ,IAAI,GAAG,MAAM,CAAC,IAAI;CAEjD,MAAM,sBAAsB,UAAoD;AAC9E,MAAI,SAAS,OAAM,UAAO,MAAI,WAAW,CAAC,MAAM,cAAc,CAAC,SAAS,MAAI,QAAQ,CAAC,CACnF,UAAS,MAAM;;AAInB,iBAAgB;AACd,SAAO,SAAQ,cAAa,SAAS,iBAAiB,WAAW,mBAAmB,CAAC;AAErF,eAAmB;AACjB,UAAO,SAAQ,cAAa,SAAS,oBAAoB,WAAW,mBAAmB,CAAC;;IAEzF;EAAC;EAAU;EAAU;EAAO,CAAC"}

package/lib/usePrevious.js

@@ -0,0 +1,11 @@
+import { useEffect, useRef } from "react";
+const usePrevious = (value) => {
+	const ref = useRef();
+	useEffect(() => {
+		ref.current = value;
+	}, [value]);
+	return ref.current;
+};
+export { usePrevious as t };
+
+//# sourceMappingURL=usePrevious.js.map

package/lib/usePrevious.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePrevious.js","names":[],"sources":["../src/hooks/usePrevious.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\n/**\n * Brukes f.eks. i forbindelse med useState for å kunne sammenlikne ny verdi med gammel.\n * @param value Verdi du ønsker å ta vare på\n * @returns Forrige verdi\n */\nexport const usePrevious = <T>(value: T): T | undefined => {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n};\n"],"mappings":";AAOA,MAAa,eAAkB,UAA4B;CACzD,MAAM,MAAM,QAAW;AAEvB,iBAAgB;AACd,MAAI,UAAU;IACb,CAAC,MAAM,CAAC;AAEX,QAAO,IAAI"}

package/lib/usePseudoClasses.js

@@ -0,0 +1,46 @@
+import { useEffect, useRef, useState } from "react";
+const usePseudoClasses = (ref) => {
+	const internalRef = useRef(null);
+	const refObject = ref ?? internalRef;
+	const [isHovered, setIsHovered] = useState(false);
+	const [isFocused, setIsFocused] = useState(false);
+	const [isActive, setIsActive] = useState(false);
+	useEffect(() => {
+		const handleMouseEnter = () => setIsHovered(true);
+		const handleMouseLeave = () => setIsHovered(false);
+		const handleFocusIn = () => setIsFocused(true);
+		const handleFocusOut = () => setIsFocused(false);
+		const handlePointerDown = () => setIsActive(true);
+		const handlePointerUp = () => setIsActive(false);
+		const handlePointerLeave = () => setIsActive(false);
+		refObject.current?.addEventListener("mouseenter", handleMouseEnter);
+		refObject.current?.addEventListener("mouseleave", handleMouseLeave);
+		refObject.current?.addEventListener("pointerenter", handleMouseEnter);
+		refObject.current?.addEventListener("pointerleave", handleMouseLeave);
+		refObject.current?.addEventListener("focusin", handleFocusIn);
+		refObject.current?.addEventListener("focusout", handleFocusOut);
+		refObject.current?.addEventListener("pointerdown", handlePointerDown);
+		refObject.current?.addEventListener("pointerup", handlePointerUp);
+		refObject.current?.addEventListener("pointerleave", handlePointerLeave);
+		return () => {
+			refObject.current?.removeEventListener("mouseenter", handleMouseEnter);
+			refObject.current?.removeEventListener("mouseleave", handleMouseLeave);
+			refObject.current?.removeEventListener("pointerenter", handleMouseEnter);
+			refObject.current?.removeEventListener("pointerleave", handleMouseLeave);
+			refObject.current?.removeEventListener("focusin", handleFocusIn);
+			refObject.current?.removeEventListener("focusout", handleFocusOut);
+			refObject.current?.removeEventListener("pointerdown", handlePointerDown);
+			refObject.current?.removeEventListener("pointerup", handlePointerUp);
+			refObject.current?.removeEventListener("pointerleave", handlePointerLeave);
+		};
+	}, [refObject]);
+	return {
+		refObject,
+		isHovered,
+		isFocused,
+		isActive
+	};
+};
+export { usePseudoClasses as t };
+
+//# sourceMappingURL=usePseudoClasses.js.map

package/lib/usePseudoClasses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePseudoClasses.js","names":[],"sources":["../src/hooks/usePseudoClasses.ts"],"sourcesContent":["import { useRef, useEffect, useState, RefObject, MutableRefObject } from 'react';\n\n/**\n * Få vite når et element hovres over eller mottar fokus.\n * @param ref Element som skal observeres\n * @returns Objekt med ref og om objekt er hovered/focused\n */\nexport const usePseudoClasses = <T extends HTMLElement | SVGElement>(\n  ref?: RefObject<T> | MutableRefObject<T> | null\n): { refObject: RefObject<T> | MutableRefObject<T>; isHovered: boolean; isFocused: boolean; isActive: boolean } => {\n  const internalRef = useRef<T | null>(null);\n  const refObject = ref ?? internalRef;\n  const [isHovered, setIsHovered] = useState(false);\n  const [isFocused, setIsFocused] = useState(false);\n  const [isActive, setIsActive] = useState(false);\n\n  useEffect(() => {\n    const handleMouseEnter = (): void => setIsHovered(true);\n    const handleMouseLeave = (): void => setIsHovered(false);\n    const handleFocusIn = (): void => setIsFocused(true);\n    const handleFocusOut = (): void => setIsFocused(false);\n    const handlePointerDown = (): void => setIsActive(true);\n    const handlePointerUp = (): void => setIsActive(false);\n    const handlePointerLeave = (): void => setIsActive(false);\n\n    refObject.current?.addEventListener('mouseenter', handleMouseEnter);\n    refObject.current?.addEventListener('mouseleave', handleMouseLeave);\n    refObject.current?.addEventListener('pointerenter', handleMouseEnter);\n    refObject.current?.addEventListener('pointerleave', handleMouseLeave);\n    refObject.current?.addEventListener('focusin', handleFocusIn);\n    refObject.current?.addEventListener('focusout', handleFocusOut);\n    refObject.current?.addEventListener('pointerdown', handlePointerDown);\n    refObject.current?.addEventListener('pointerup', handlePointerUp);\n    refObject.current?.addEventListener('pointerleave', handlePointerLeave);\n\n    return (): void => {\n      refObject.current?.removeEventListener('mouseenter', handleMouseEnter);\n      refObject.current?.removeEventListener('mouseleave', handleMouseLeave);\n      refObject.current?.removeEventListener('pointerenter', handleMouseEnter);\n      refObject.current?.removeEventListener('pointerleave', handleMouseLeave);\n      refObject.current?.removeEventListener('focusin', handleFocusIn);\n      refObject.current?.removeEventListener('focusout', handleFocusOut);\n      refObject.current?.removeEventListener('pointerdown', handlePointerDown);\n      refObject.current?.removeEventListener('pointerup', handlePointerUp);\n      refObject.current?.removeEventListener('pointerleave', handlePointerLeave);\n    };\n  }, [refObject]);\n\n  return { refObject, isHovered, isFocused, isActive };\n};\n"],"mappings":";AAOA,MAAa,oBACX,QACiH;CACjH,MAAM,cAAc,OAAiB,KAAK;CAC1C,MAAM,YAAY,OAAO;CACzB,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;AAE/C,iBAAgB;EACd,MAAM,yBAA+B,aAAa,KAAK;EACvD,MAAM,yBAA+B,aAAa,MAAM;EACxD,MAAM,sBAA4B,aAAa,KAAK;EACpD,MAAM,uBAA6B,aAAa,MAAM;EACtD,MAAM,0BAAgC,YAAY,KAAK;EACvD,MAAM,wBAA8B,YAAY,MAAM;EACtD,MAAM,2BAAiC,YAAY,MAAM;AAEzD,YAAU,SAAS,iBAAiB,cAAc,iBAAiB;AACnE,YAAU,SAAS,iBAAiB,cAAc,iBAAiB;AACnE,YAAU,SAAS,iBAAiB,gBAAgB,iBAAiB;AACrE,YAAU,SAAS,iBAAiB,gBAAgB,iBAAiB;AACrE,YAAU,SAAS,iBAAiB,WAAW,cAAc;AAC7D,YAAU,SAAS,iBAAiB,YAAY,eAAe;AAC/D,YAAU,SAAS,iBAAiB,eAAe,kBAAkB;AACrE,YAAU,SAAS,iBAAiB,aAAa,gBAAgB;AACjE,YAAU,SAAS,iBAAiB,gBAAgB,mBAAmB;AAEvE,eAAmB;AACjB,aAAU,SAAS,oBAAoB,cAAc,iBAAiB;AACtE,aAAU,SAAS,oBAAoB,cAAc,iBAAiB;AACtE,aAAU,SAAS,oBAAoB,gBAAgB,iBAAiB;AACxE,aAAU,SAAS,oBAAoB,gBAAgB,iBAAiB;AACxE,aAAU,SAAS,oBAAoB,WAAW,cAAc;AAChE,aAAU,SAAS,oBAAoB,YAAY,eAAe;AAClE,aAAU,SAAS,oBAAoB,eAAe,kBAAkB;AACxE,aAAU,SAAS,oBAAoB,aAAa,gBAAgB;AACpE,aAAU,SAAS,oBAAoB,gBAAgB,mBAAmB;;IAE3E,CAAC,UAAU,CAAC;AAEf,QAAO;EAAE;EAAW;EAAW;EAAW;EAAU"}

package/lib/useResizeObserver.js

@@ -0,0 +1,23 @@
+import { useEffect, useRef, useState } from "react";
+const useResizeObserver = (ref) => {
+	const ticking = useRef(false);
+	const [size, setSize] = useState();
+	useEffect(() => {
+		const resizeObserver = new ResizeObserver((entries) => {
+			if (!ticking.current) window.requestAnimationFrame(() => {
+				setSize(entries[0].target.getBoundingClientRect());
+				ticking.current = false;
+			});
+			ticking.current = true;
+		});
+		if (ref?.current) resizeObserver.observe(ref?.current);
+		return () => {
+			if (ref?.current) resizeObserver.unobserve(ref.current);
+			else resizeObserver.disconnect();
+		};
+	}, [ref]);
+	return size;
+};
+export { useResizeObserver as t };
+
+//# sourceMappingURL=useResizeObserver.js.map

package/lib/useResizeObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizeObserver.js","names":[],"sources":["../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\n/**\n * Lytt på endringer i størrelse på et element. Bruker ResizeObserver-APIet.\n *\n * @param ref Element som skal observeres.\n * @returns Object med høyde, bredde, x og y til elementet\n */\nexport const useResizeObserver = (ref?: React.RefObject<HTMLElement>): DOMRect | undefined => {\n  const ticking = useRef(false);\n  const [size, setSize] = useState<DOMRect>();\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver(entries => {\n      if (!ticking.current) {\n        window.requestAnimationFrame(() => {\n          setSize(entries[0].target.getBoundingClientRect());\n          ticking.current = false;\n        });\n      }\n      ticking.current = true;\n    });\n    if (ref?.current) {\n      resizeObserver.observe(ref?.current);\n    }\n\n    return (): void => {\n      if (ref?.current) {\n        resizeObserver.unobserve(ref.current);\n      } else {\n        resizeObserver.disconnect();\n      }\n    };\n  }, [ref]);\n\n  return size;\n};\n"],"mappings":";AAQA,MAAa,qBAAqB,QAA4D;CAC5F,MAAM,UAAU,OAAO,MAAM;CAC7B,MAAM,CAAC,MAAM,WAAW,UAAmB;AAC3C,iBAAgB;EACd,MAAM,iBAAiB,IAAI,gBAAe,YAAW;AACnD,OAAI,CAAC,QAAQ,QACX,QAAO,4BAA4B;AACjC,YAAQ,QAAQ,GAAG,OAAO,uBAAuB,CAAC;AAClD,YAAQ,UAAU;KAClB;AAEJ,WAAQ,UAAU;IAClB;AACF,MAAI,KAAK,QACP,gBAAe,QAAQ,KAAK,QAAQ;AAGtC,eAAmB;AACjB,OAAI,KAAK,QACP,gBAAe,UAAU,IAAI,QAAQ;OAErC,gBAAe,YAAY;;IAG9B,CAAC,IAAI,CAAC;AAET,QAAO"}

package/lib/useReturnFocusOnUnmount.js

@@ -0,0 +1,16 @@
+import { t as getDocumentActiveElement } from "./focus.js";
+import { t as deepContains } from "./deepContains.js";
+import { useEffect, useRef } from "react";
+const useReturnFocusOnUnmount = (ref) => {
+	const previouslyFocusedElementRef = useRef(null);
+	useEffect(() => {
+		const activeElement = ref.current ? getDocumentActiveElement(ref.current) : null;
+		if (activeElement instanceof HTMLElement) previouslyFocusedElementRef.current = activeElement;
+		return () => {
+			if (previouslyFocusedElementRef.current instanceof HTMLElement && deepContains(document, previouslyFocusedElementRef.current)) previouslyFocusedElementRef.current.focus();
+		};
+	}, []);
+};
+export { useReturnFocusOnUnmount as t };
+
+//# sourceMappingURL=useReturnFocusOnUnmount.js.map

package/lib/useReturnFocusOnUnmount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useReturnFocusOnUnmount.js","names":[],"sources":["../src/hooks/useReturnFocusOnUnmount.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport { deepContains } from '../utils/deepContains';\nimport { getDocumentActiveElement } from '../utils/focus';\n\n/**\n * A hook that stores the currently focused element when the component mounts,\n * and returns focus to it when the component unmounts.\n */\nexport const useReturnFocusOnUnmount = (ref: React.RefObject<HTMLElement>): void => {\n  const previouslyFocusedElementRef = useRef<HTMLElement | null>(null);\n\n  useEffect(() => {\n    // Captures which element was focused on mount\n    // const activeElement = document.activeElement;\n    const activeElement = ref.current ? getDocumentActiveElement(ref.current) : null;\n    if (activeElement instanceof HTMLElement) {\n      previouslyFocusedElementRef.current = activeElement;\n    }\n\n    // Restores focus to the stored element on unmount\n    return (): void => {\n      if (previouslyFocusedElementRef.current instanceof HTMLElement && deepContains(document, previouslyFocusedElementRef.current)) {\n        previouslyFocusedElementRef.current.focus();\n      }\n    };\n  }, []);\n};\n"],"mappings":";;;AASA,MAAa,2BAA2B,QAA4C;CAClF,MAAM,8BAA8B,OAA2B,KAAK;AAEpE,iBAAgB;EAGd,MAAM,gBAAgB,IAAI,UAAU,yBAAyB,IAAI,QAAQ,GAAG;AAC5E,MAAI,yBAAyB,YAC3B,6BAA4B,UAAU;AAIxC,eAAmB;AACjB,OAAI,4BAA4B,mBAAmB,eAAe,aAAa,UAAU,4BAA4B,QAAQ,CAC3H,6BAA4B,QAAQ,OAAO;;IAG9C,EAAE,CAAC"}

package/lib/useRovingFocus.js

@@ -0,0 +1,44 @@
+import { o as KeyboardEventKey } from "./constants2.js";
+import { t as useKeyboardEvent } from "./useKeyboardEvent.js";
+import { useEffect } from "react";
+const useRovingFocus = (handleNewIndex, inputRefList, containerRef, leftRightNavigation) => {
+	leftRightNavigation = leftRightNavigation ?? false;
+	useEffect(() => {
+		if (!inputRefList.current) return;
+		inputRefList.current.forEach((ref) => {
+			ref.current?.setAttribute("tabIndex", "-1");
+		});
+		inputRefList.current[0]?.current?.setAttribute("tabIndex", "0");
+	}, []);
+	const handleKeyboardNavigation = (event) => {
+		if (event.key === KeyboardEventKey.Tab) return;
+		event.preventDefault();
+		if (!inputRefList.current) return;
+		const index = inputRefList.current.findIndex((x) => x.current === event.target);
+		let nextIndex = index;
+		if (event.key === KeyboardEventKey.Home) nextIndex = 0;
+		else if (event.key === KeyboardEventKey.End) nextIndex = inputRefList.current.length - 1;
+		else if ((event.key === KeyboardEventKey.ArrowDown || event.key === KeyboardEventKey.ArrowRight) && index < inputRefList.current.length - 1) nextIndex = index + 1;
+		else if ((event.key === KeyboardEventKey.ArrowUp || event.key === KeyboardEventKey.ArrowLeft) && index > 0) nextIndex = index - 1;
+		else if (event.key === KeyboardEventKey.Enter || event.key === KeyboardEventKey.Space) nextIndex = index;
+		if (nextIndex !== -1) {
+			inputRefList.current?.forEach((ref, i) => {
+				if (ref.current) ref.current.tabIndex = i === nextIndex ? 0 : -1;
+			});
+			inputRefList.current[nextIndex]?.current?.focus();
+			inputRefList.current[nextIndex]?.current?.click?.();
+			handleNewIndex(nextIndex);
+		}
+	};
+	const commonKeys = [
+		KeyboardEventKey.End,
+		KeyboardEventKey.Enter,
+		KeyboardEventKey.Escape,
+		KeyboardEventKey.Home
+	];
+	const arrowKeys = leftRightNavigation ? [KeyboardEventKey.ArrowRight, KeyboardEventKey.ArrowLeft] : [KeyboardEventKey.ArrowUp, KeyboardEventKey.ArrowDown];
+	useKeyboardEvent(containerRef, handleKeyboardNavigation, [...commonKeys, ...arrowKeys]);
+};
+export { useRovingFocus as t };
+
+//# sourceMappingURL=useRovingFocus.js.map

package/lib/useRovingFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRovingFocus.js","names":[],"sources":["../src/hooks/useRovingFocus.tsx"],"sourcesContent":["// Inspiration from https://www.joshuawootonn.com/react-roving-tabindex\nimport { useEffect } from 'react';\n\nimport { useKeyboardEvent } from './useKeyboardEvent';\nimport { KeyboardEventKey } from '../constants';\n\nexport const useRovingFocus = (\n  /** Function to run when new index is set */\n  handleNewIndex: (index: number) => void,\n  /** List of elements that should have rocing focus */\n  inputRefList: React.MutableRefObject<React.RefObject<HTMLElement>[] | null | undefined>,\n  /** Ref of container that should have the keyboard event handler */\n  containerRef: React.RefObject<HTMLElement>,\n  /** Indicated wether right/left or up/down arrows should be used for navigation. Default is up/down. */\n  leftRightNavigation?: boolean\n): void => {\n  leftRightNavigation = leftRightNavigation ?? false;\n\n  // Initialize only first index to be tabbable\n  useEffect(() => {\n    if (!inputRefList.current) {\n      return;\n    }\n    inputRefList.current.forEach(ref => {\n      ref.current?.setAttribute('tabIndex', '-1');\n    });\n    inputRefList.current[0]?.current?.setAttribute('tabIndex', '0');\n  }, []);\n\n  const handleKeyboardNavigation = (event: KeyboardEvent): void => {\n    if (event.key === KeyboardEventKey.Tab) {\n      return;\n    }\n    event.preventDefault();\n\n    if (!inputRefList.current) {\n      return;\n    }\n    const index = inputRefList.current.findIndex(x => x.current === event.target);\n    let nextIndex = index;\n\n    if (event.key === KeyboardEventKey.Home) {\n      nextIndex = 0;\n    } else if (event.key === KeyboardEventKey.End) {\n      nextIndex = inputRefList.current.length - 1;\n    } else if (\n      (event.key === KeyboardEventKey.ArrowDown || event.key === KeyboardEventKey.ArrowRight) &&\n      index < inputRefList.current.length - 1\n    ) {\n      nextIndex = index + 1;\n    } else if ((event.key === KeyboardEventKey.ArrowUp || event.key === KeyboardEventKey.ArrowLeft) && index > 0) {\n      nextIndex = index - 1;\n    } else if (event.key === KeyboardEventKey.Enter || event.key === KeyboardEventKey.Space) {\n      nextIndex = index;\n    }\n\n    if (nextIndex !== -1) {\n      inputRefList.current?.forEach((ref, i) => {\n        if (ref.current) {\n          ref.current.tabIndex = i === nextIndex ? 0 : -1;\n        }\n      });\n      inputRefList.current[nextIndex]?.current?.focus();\n      inputRefList.current[nextIndex]?.current?.click?.();\n      handleNewIndex(nextIndex);\n    }\n  };\n\n  const commonKeys = [KeyboardEventKey.End, KeyboardEventKey.Enter, KeyboardEventKey.Escape, KeyboardEventKey.Home];\n\n  const arrowKeys = leftRightNavigation\n    ? [KeyboardEventKey.ArrowRight, KeyboardEventKey.ArrowLeft]\n    : [KeyboardEventKey.ArrowUp, KeyboardEventKey.ArrowDown];\n\n  useKeyboardEvent(containerRef, handleKeyboardNavigation, [...commonKeys, ...arrowKeys]);\n};\n"],"mappings":";;;AAMA,MAAa,kBAEX,gBAEA,cAEA,cAEA,wBACS;AACT,uBAAsB,uBAAuB;AAG7C,iBAAgB;AACd,MAAI,CAAC,aAAa,QAChB;AAEF,eAAa,QAAQ,SAAQ,QAAO;AAClC,OAAI,SAAS,aAAa,YAAY,KAAK;IAC3C;AACF,eAAa,QAAQ,IAAI,SAAS,aAAa,YAAY,IAAI;IAC9D,EAAE,CAAC;CAEN,MAAM,4BAA4B,UAA+B;AAC/D,MAAI,MAAM,QAAQ,iBAAiB,IACjC;AAEF,QAAM,gBAAgB;AAEtB,MAAI,CAAC,aAAa,QAChB;EAEF,MAAM,QAAQ,aAAa,QAAQ,WAAU,MAAK,EAAE,YAAY,MAAM,OAAO;EAC7E,IAAI,YAAY;AAEhB,MAAI,MAAM,QAAQ,iBAAiB,KACjC,aAAY;WACH,MAAM,QAAQ,iBAAiB,IACxC,aAAY,aAAa,QAAQ,SAAS;YAEzC,MAAM,QAAQ,iBAAiB,aAAa,MAAM,QAAQ,iBAAiB,eAC5E,QAAQ,aAAa,QAAQ,SAAS,EAEtC,aAAY,QAAQ;YACV,MAAM,QAAQ,iBAAiB,WAAW,MAAM,QAAQ,iBAAiB,cAAc,QAAQ,EACzG,aAAY,QAAQ;WACX,MAAM,QAAQ,iBAAiB,SAAS,MAAM,QAAQ,iBAAiB,MAChF,aAAY;AAGd,MAAI,cAAc,IAAI;AACpB,gBAAa,SAAS,SAAS,KAAK,MAAM;AACxC,QAAI,IAAI,QACN,KAAI,QAAQ,WAAW,MAAM,YAAY,IAAI;KAE/C;AACF,gBAAa,QAAQ,YAAY,SAAS,OAAO;AACjD,gBAAa,QAAQ,YAAY,SAAS,SAAS;AACnD,kBAAe,UAAU;;;CAI7B,MAAM,aAAa;EAAC,iBAAiB;EAAK,iBAAiB;EAAO,iBAAiB;EAAQ,iBAAiB;EAAK;CAEjH,MAAM,YAAY,sBACd,CAAC,iBAAiB,YAAY,iBAAiB,UAAU,GACzD,CAAC,iBAAiB,SAAS,iBAAiB,UAAU;AAE1D,kBAAiB,cAAc,0BAA0B,CAAC,GAAG,YAAY,GAAG,UAAU,CAAC"}

package/lib/useSize.js

@@ -0,0 +1,42 @@
+import { t as debounce } from "./debounce.js";
+import { useEffect, useRef, useState } from "react";
+const useSize = (ref) => {
+	const ticking = useRef(false);
+	const [size, setSize] = useState();
+	useEffect(() => {
+		if (typeof ResizeObserver !== "undefined") {
+			const resizeObserver = new ResizeObserver((entries) => {
+				if (!ticking.current) window.requestAnimationFrame(() => {
+					setSize(entries[0].target.getBoundingClientRect());
+					ticking.current = false;
+				});
+				ticking.current = true;
+			});
+			if (ref?.current) resizeObserver.observe(ref?.current);
+			return () => {
+				if (ref?.current) resizeObserver.unobserve(ref.current);
+				else resizeObserver.disconnect();
+			};
+		} else if (typeof window === "object") {
+			const handleLayoutEvent = () => {
+				if (ref?.current) setSize(ref.current.getBoundingClientRect());
+			};
+			const events = [
+				"layoutchange",
+				"resize",
+				"orientationchange"
+			];
+			const [debouncedCallback, teardown] = debounce(handleLayoutEvent, 10);
+			events.forEach((eventName) => window.addEventListener(eventName, debouncedCallback));
+			debouncedCallback();
+			return () => {
+				teardown();
+				events.forEach((eventName) => window.removeEventListener(eventName, debouncedCallback));
+			};
+		}
+	}, [ref?.current]);
+	return size;
+};
+export { useSize as t };
+
+//# sourceMappingURL=useSize.js.map

package/lib/useSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSize.js","names":[],"sources":["../src/hooks/useSize.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport { debounce } from '../utils/debounce';\n\n/**\n * Lytt på endringer i størrelse på et element\n *\n * @param ref Element som skal observeres.\n * @returns Object med høyde, bredde, x og y til elementet. Merk at objektet bare oppdates når høyde eller bredde endres, ikke når\n * posisjonen (x og y) endres.\n */\nexport const useSize = (ref?: React.RefObject<HTMLElement>): DOMRect | undefined => {\n  const ticking = useRef(false);\n  const [size, setSize] = useState<DOMRect>();\n  useEffect(() => {\n    if (typeof ResizeObserver !== 'undefined') {\n      const resizeObserver = new ResizeObserver(entries => {\n        if (!ticking.current) {\n          window.requestAnimationFrame(() => {\n            setSize(entries[0].target.getBoundingClientRect());\n            ticking.current = false;\n          });\n        }\n        ticking.current = true;\n      });\n      if (ref?.current) {\n        resizeObserver.observe(ref?.current);\n      }\n      return (): void => {\n        if (ref?.current) {\n          resizeObserver.unobserve(ref.current);\n        } else {\n          resizeObserver.disconnect();\n        }\n      };\n    } else if (typeof window === 'object') {\n      // For nettlesere som ikke støtter ResizeObserver (iOS 13 og lavere)\n      const handleLayoutEvent = (): void => {\n        if (ref?.current) setSize(ref.current.getBoundingClientRect());\n      };\n\n      const events = ['layoutchange', 'resize', 'orientationchange'];\n      const debounceMs = 10;\n\n      const [debouncedCallback, teardown] = debounce(handleLayoutEvent, debounceMs);\n\n      events.forEach(eventName => window.addEventListener(eventName, debouncedCallback));\n\n      debouncedCallback();\n\n      return (): void => {\n        teardown();\n        events.forEach(eventName => window.removeEventListener(eventName, debouncedCallback));\n      };\n    }\n  }, [ref?.current]);\n\n  return size;\n};\n"],"mappings":";;AAWA,MAAa,WAAW,QAA4D;CAClF,MAAM,UAAU,OAAO,MAAM;CAC7B,MAAM,CAAC,MAAM,WAAW,UAAmB;AAC3C,iBAAgB;AACd,MAAI,OAAO,mBAAmB,aAAa;GACzC,MAAM,iBAAiB,IAAI,gBAAe,YAAW;AACnD,QAAI,CAAC,QAAQ,QACX,QAAO,4BAA4B;AACjC,aAAQ,QAAQ,GAAG,OAAO,uBAAuB,CAAC;AAClD,aAAQ,UAAU;MAClB;AAEJ,YAAQ,UAAU;KAClB;AACF,OAAI,KAAK,QACP,gBAAe,QAAQ,KAAK,QAAQ;AAEtC,gBAAmB;AACjB,QAAI,KAAK,QACP,gBAAe,UAAU,IAAI,QAAQ;QAErC,gBAAe,YAAY;;aAGtB,OAAO,WAAW,UAAU;GAErC,MAAM,0BAAgC;AACpC,QAAI,KAAK,QAAS,SAAQ,IAAI,QAAQ,uBAAuB,CAAC;;GAGhE,MAAM,SAAS;IAAC;IAAgB;IAAU;IAAoB;GAG9D,MAAM,CAAC,mBAAmB,YAAY,SAAS,mBAF5B,GAE0D;AAE7E,UAAO,SAAQ,cAAa,OAAO,iBAAiB,WAAW,kBAAkB,CAAC;AAElF,sBAAmB;AAEnB,gBAAmB;AACjB,cAAU;AACV,WAAO,SAAQ,cAAa,OAAO,oBAAoB,WAAW,kBAAkB,CAAC;;;IAGxF,CAAC,KAAK,QAAQ,CAAC;AAElB,QAAO"}

package/lib/useToggle.js

@@ -0,0 +1,22 @@
+import { t as usePrevious } from "./usePrevious.js";
+import { useEffect, useState } from "react";
+const useToggle = (initialValue, callback) => {
+	const [value, setValue] = useState(initialValue);
+	const previousValue = usePrevious(value);
+	const toggleValue = () => {
+		setValue(!value);
+	};
+	useEffect(() => {
+		if (initialValue !== value) setValue(initialValue);
+	}, [initialValue]);
+	useEffect(() => {
+		if (callback && value !== !!previousValue) callback(value);
+	}, [value, callback]);
+	return {
+		value,
+		toggleValue
+	};
+};
+export { useToggle as t };
+
+//# sourceMappingURL=useToggle.js.map

package/lib/useToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToggle.js","names":[],"sources":["../src/hooks/useToggle.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { usePrevious } from './usePrevious';\n\n/**\n * Hook for å toggle en boolean og kjøre en callback når verdien endres\n *\n * @param initialValue Initiell verdi for boolean\n * @param callback Funksjon som kalles når value endrer verdi (optional)\n * @returns Objekt med nåværende verdi og funksjon som kan kalles for å toggle verdien\n */\nexport const useToggle = (initialValue: boolean, callback?: (value: boolean) => void): { value: boolean; toggleValue: () => void } => {\n  const [value, setValue] = useState(initialValue);\n  const previousValue = usePrevious(value);\n\n  const toggleValue = (): void => {\n    setValue(!value);\n  };\n\n  useEffect(() => {\n    if (initialValue !== value) {\n      setValue(initialValue);\n    }\n  }, [initialValue]);\n\n  useEffect(() => {\n    if (callback && value !== !!previousValue) {\n      callback(value);\n    }\n  }, [value, callback]);\n\n  return { value, toggleValue };\n};\n"],"mappings":";;AAWA,MAAa,aAAa,cAAuB,aAAqF;CACpI,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAChD,MAAM,gBAAgB,YAAY,MAAM;CAExC,MAAM,oBAA0B;AAC9B,WAAS,CAAC,MAAM;;AAGlB,iBAAgB;AACd,MAAI,iBAAiB,MACnB,UAAS,aAAa;IAEvB,CAAC,aAAa,CAAC;AAElB,iBAAgB;AACd,MAAI,YAAY,UAAU,CAAC,CAAC,cAC1B,UAAS,MAAM;IAEhB,CAAC,OAAO,SAAS,CAAC;AAErB,QAAO;EAAE;EAAO;EAAa"}

package/lib/usestopPropagation.js

@@ -0,0 +1,11 @@
+import { useEffect } from "react";
+const useStopPropagation = (ref, events) => {
+	const handleEvent = (e) => e.stopPropagation();
+	useEffect(() => {
+		events.forEach((name) => ref?.current?.addEventListener(name, handleEvent));
+		return () => events.forEach((name) => ref.current?.removeEventListener(name, handleEvent));
+	}, [ref]);
+};
+export { useStopPropagation as t };
+
+//# sourceMappingURL=usestopPropagation.js.map

package/lib/usestopPropagation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usestopPropagation.js","names":[],"sources":["../src/hooks/usestopPropagation.ts"],"sourcesContent":["import { useEffect } from 'react';\n\n/**\n * Stopp eventer fra å boble opp videre i DOMen\n * @param ref Element som skal overvåkes\n * @param events Navn på eventer som ikke skal boble opp\n */\nexport const useStopPropagation = (ref: React.RefObject<HTMLElement>, events: string[]): void => {\n  const handleEvent = (e: Event): void => e.stopPropagation();\n\n  useEffect(() => {\n    events.forEach(name => ref?.current?.addEventListener(name, handleEvent));\n\n    return (): void => events.forEach(name => ref.current?.removeEventListener(name, handleEvent));\n  }, [ref]);\n};\n"],"mappings":";AAOA,MAAa,sBAAsB,KAAmC,WAA2B;CAC/F,MAAM,eAAe,MAAmB,EAAE,iBAAiB;AAE3D,iBAAgB;AACd,SAAO,SAAQ,SAAQ,KAAK,SAAS,iBAAiB,MAAM,YAAY,CAAC;AAEzE,eAAmB,OAAO,SAAQ,SAAQ,IAAI,SAAS,oBAAoB,MAAM,YAAY,CAAC;IAC7F,CAAC,IAAI,CAAC"}

package/lib/utils/accessibility.js

@@ -0,0 +1,2 @@
+import { n as getAriaLabelAttributes, t as getAriaDescribedBy } from "../accessibility.js";
+export { getAriaDescribedBy, getAriaLabelAttributes };

package/lib/utils/component.js

@@ -0,0 +1,2 @@
+import { n as isComponentWithChildren, r as isComponentWithDisplayName, t as isComponent } from "../component.js";
+export { isComponent, isComponentWithChildren, isComponentWithDisplayName };

package/lib/utils/debounce.js

@@ -0,0 +1,2 @@
+import { t as debounce } from "../debounce.js";
+export { debounce };

package/lib/utils/deepContains.js

@@ -0,0 +1,2 @@
+import { t as deepContains } from "../deepContains.js";
+export { deepContains };