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

package/theme/currys/spacing.js

@@ -1,42 +1,3 @@
-import { spacers } from "../spacers.js";
-const mapSpacerValue = (spacerSize) => {
-  switch (spacerSize) {
-    case "4xs":
-      return spacers[1];
-    case "3xs":
-      return spacers[2];
-    case "2xs":
-      return spacers[3];
-    case "xs":
-      return spacers[4];
-    case "s":
-      return spacers[5];
-    case "m":
-      return spacers[6];
-    case "l":
-      return spacers[7];
-    case "xl":
-      return spacers[8];
-    case "2xl":
-      return spacers[9];
-    case "3xl":
-      return spacers[10];
-    case "4xl":
-      return spacers[11];
-    case "5xl":
-      return spacers[12];
-    case "6xl":
-      return spacers[13];
-    default:
-      return spacers[5];
-  }
-};
-const getSpacer = (spacerSize) => {
-  const spacerValue = mapSpacerValue(spacerSize);
-  return `${spacerValue}rem`;
-};
-export {
-  getSpacer,
-  mapSpacerValue
-};
-//# sourceMappingURL=spacing.js.map
+import "../../spacers.js";
+import { n as mapSpacerValue, t as getSpacer } from "../../spacing.js";
+export { getSpacer, mapSpacerValue };

package/theme/grid.js

@@ -1,27 +1,2 @@
-const breakpoints = {
-  xxs: 0,
-  xs: 360,
-  sm: 564,
-  md: 768,
-  lg: 1088,
-  xl: 1450
-};
-const containerMaxWidths = {
-  sm: 528,
-  md: 612,
-  lg: 1056
-};
-const screen = {
-  xxs: `(min-width: ${breakpoints.xxs}px)`,
-  xs: `(min-width: ${breakpoints.xs}px)`,
-  sm: `(min-width: ${breakpoints.sm}px)`,
-  md: `(min-width: ${breakpoints.md}px)`,
-  lg: `(min-width: ${breakpoints.lg}px)`,
-  xl: `(min-width: ${breakpoints.xl}px)`
-};
-export {
-  breakpoints,
-  containerMaxWidths,
-  screen
-};
-//# sourceMappingURL=grid.js.map
+import { n as containerMaxWidths, r as screen, t as breakpoints } from "../grid.js";
+export { breakpoints, containerMaxWidths, screen };

package/theme/index.js

@@ -1,14 +1,5 @@
-import { breakpoints, screen } from "./grid.js";
-import { palette } from "./palette.js";
-import { spacers, spacer } from "./spacers.js";
-const theme = {
-  spacer,
-  spacers,
-  palette,
-  screen,
-  breakpoints
-};
-export {
-  theme
-};
-//# sourceMappingURL=index.js.map
+import "../grid.js";
+import "../palette.js";
+import "../spacers.js";
+import { t as theme } from "../theme.js";
+export { theme };

package/theme/palette.js

@@ -1,86 +1,2 @@
-const banana = {
-  banana50: "#FDF8DF",
-  banana100: "#FCF2BF",
-  banana200: "#F9EA9F",
-  banana300: "#F5E080",
-  banana400: "#EBC840",
-  banana500: "#DDAB06",
-  banana600: "#C59302",
-  banana700: "#AB7C00",
-  banana800: "#916500",
-  banana900: "#764F00"
-};
-const blueberry = {
-  blueberry50: "#E4F7F9",
-  blueberry100: "#CAE7ED",
-  blueberry200: "#AFDAE3",
-  blueberry300: "#7ABECC",
-  blueberry400: "#58AABB",
-  blueberry500: "#188097",
-  blueberry600: "#126F87",
-  blueberry700: "#08667C",
-  blueberry800: "#06596C",
-  blueberry900: "#084350"
-};
-const cherry = {
-  cherry50: "#FFF2EA",
-  cherry100: "#F7E1D2",
-  cherry200: "#EEC0A5",
-  cherry300: "#E39376",
-  cherry400: "#D56147",
-  cherry500: "#C83521",
-  cherry600: "#B62E1C",
-  cherry700: "#A31F0E",
-  cherry800: "#912112",
-  cherry900: "#7E1C0E"
-};
-const kiwi = {
-  kiwi50: "#E6F8EE",
-  kiwi100: "#C2EDD6",
-  kiwi200: "#9DE2BF",
-  kiwi300: "#79D6AA",
-  kiwi400: "#56CA96",
-  kiwi500: "#33BE84",
-  kiwi600: "#10B172",
-  kiwi700: "#0CA161",
-  kiwi800: "#099150",
-  kiwi900: "#078141"
-};
-const neutral = {
-  neutral50: "#F5F3F3",
-  neutral100: "#EAE7E7",
-  neutral200: "#D6D4D3",
-  neutral300: "#BDBAB9",
-  neutral400: "#AAA8A6",
-  neutral500: "#989693",
-  neutral600: "#7D7C79",
-  neutral700: "#62625F",
-  neutral800: "#474745",
-  neutral900: "#2B2C2B"
-};
-const plum = {
-  plum50: "#EFE4FD",
-  plum100: "#D7BDF9",
-  plum200: "#BF98F3",
-  plum300: "#A875EB",
-  plum400: "#9153E2",
-  plum500: "#7A33D7",
-  plum600: "#6A2ABF",
-  plum700: "#5B22A6",
-  plum800: "#4C1B8C",
-  plum900: "#3C1471"
-};
-const palette = {
-  ...banana,
-  ...blueberry,
-  ...cherry,
-  ...kiwi,
-  ...neutral,
-  ...plum,
-  black: "#000000",
-  white: "#ffffff"
-};
-export {
-  palette
-};
-//# sourceMappingURL=palette.js.map
+import { t as palette } from "../palette.js";
+export { palette };

package/theme/spacers.js

@@ -1,22 +1,2 @@
-const spacer = 1;
-const spacers = {
-  0: 0,
-  1: spacer / 8,
-  2: spacer / 4,
-  3: spacer / 2,
-  4: spacer * 0.75,
-  5: spacer * 1,
-  6: spacer * 1.5,
-  7: spacer * 2,
-  8: spacer * 3,
-  9: spacer * 4,
-  10: spacer * 5,
-  11: spacer * 6,
-  12: spacer * 7,
-  13: spacer * 8
-};
-export {
-  spacer,
-  spacers
-};
-//# sourceMappingURL=spacers.js.map
+import { n as spacers, t as spacer } from "../spacers.js";
+export { spacer, spacers };

package/theme.js

@@ -0,0 +1,13 @@
+import { r as screen, t as breakpoints } from "./grid.js";
+import { t as palette } from "./palette.js";
+import { n as spacers, t as spacer } from "./spacers.js";
+const theme = {
+	spacer: 1,
+	spacers,
+	palette,
+	screen,
+	breakpoints
+};
+export { theme as t };
+
+//# sourceMappingURL=theme.js.map

package/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","names":[],"sources":["../src/theme/index.ts"],"sourcesContent":["import { screen, breakpoints } from './grid';\nimport { palette } from './palette';\nimport { spacer, spacers } from './spacers';\n\nexport const theme = {\n  spacer,\n  spacers,\n  palette,\n  screen,\n  breakpoints,\n};\n"],"mappings":";;;AAIA,MAAa,QAAQ;CACnB,QAAA;CACA;CACA;CACA;CACA;CACD"}

package/useBreakpoint.js

@@ -0,0 +1,49 @@
+import { r as screen, t as breakpoints } from "./grid.js";
+import { useEffect, useState } from "react";
+let Breakpoint = /* @__PURE__ */ function(Breakpoint$1) {
+	Breakpoint$1[Breakpoint$1["xxs"] = breakpoints.xxs] = "xxs";
+	Breakpoint$1[Breakpoint$1["xs"] = breakpoints.xs] = "xs";
+	Breakpoint$1[Breakpoint$1["sm"] = breakpoints.sm] = "sm";
+	Breakpoint$1[Breakpoint$1["md"] = breakpoints.md] = "md";
+	Breakpoint$1[Breakpoint$1["lg"] = breakpoints.lg] = "lg";
+	Breakpoint$1[Breakpoint$1["xl"] = breakpoints.xl] = "xl";
+	return Breakpoint$1;
+}({});
+function getCurrentBreakpoint() {
+	return Object.entries(screen).reverse().map(([size, mediaQuery]) => {
+		return {
+			breakpoint: Breakpoint[size],
+			mq: window.matchMedia(mediaQuery)
+		};
+	}).find((entry) => entry.mq.matches)?.breakpoint ?? Breakpoint.xxs;
+}
+const useBreakpoint = () => {
+	const [breakpoint, setBreakpoint] = useState(Breakpoint.xxs);
+	useEffect(() => {
+		setBreakpoint(getCurrentBreakpoint());
+	}, []);
+	useEffect(() => {
+		const mediaQueryList = Object.values(screen).map((mediaQuery) => {
+			const mq = window.matchMedia(mediaQuery);
+			const handler = () => {
+				setBreakpoint(getCurrentBreakpoint());
+			};
+			if (mq.addEventListener) mq.addEventListener("change", handler);
+			else if (mq.addListener) mq.addListener(handler);
+			return {
+				mq,
+				handler
+			};
+		});
+		return () => {
+			mediaQueryList.forEach(({ mq, handler }) => {
+				if (mq.removeEventListener) mq.removeEventListener("change", handler);
+				else if (mq.removeListener) mq.removeListener(handler);
+			});
+		};
+	}, []);
+	return breakpoint;
+};
+export { useBreakpoint as n, Breakpoint as t };
+
+//# sourceMappingURL=useBreakpoint.js.map

package/useBreakpoint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBreakpoint.js","names":[],"sources":["../src/hooks/useBreakpoint.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { breakpoints, screen } from '../theme/grid';\n\nexport enum Breakpoint {\n  xxs = breakpoints.xxs,\n  xs = breakpoints.xs,\n  sm = breakpoints.sm,\n  md = breakpoints.md,\n  lg = breakpoints.lg,\n  xl = breakpoints.xl,\n}\n\nfunction getCurrentBreakpoint(): Breakpoint {\n  // We read from largest -> smallest or vice versa\n  // so that the first match is the \"highest\" one that applies\n  const mediaQueryList = Object.entries(screen)\n    .reverse() // e.g. check xl, lg, md, etc. in descending order\n    .map(([size, mediaQuery]) => {\n      return {\n        breakpoint: Breakpoint[size as keyof typeof Breakpoint],\n        mq: window.matchMedia(mediaQuery),\n      };\n    });\n\n  const matched = mediaQueryList.find(entry => entry.mq.matches);\n  return matched?.breakpoint ?? Breakpoint.xxs;\n}\n\nexport const useBreakpoint = (): Breakpoint => {\n  const [breakpoint, setBreakpoint] = useState<Breakpoint>(Breakpoint.xxs);\n\n  useEffect(() => {\n    // Oppdater breakpoint i useEffect for å støtte server side rendering\n    setBreakpoint(getCurrentBreakpoint());\n  }, []);\n\n  useEffect(() => {\n    const mediaQueryList = Object.values(screen).map(mediaQuery => {\n      const mq = window.matchMedia(mediaQuery);\n      // iOS <=13 har ikke støtte for addEventListener/removeEventListener på MediaQueryList,\n      // men har støtte for addListener\n      const handler = (): void => {\n        setBreakpoint(getCurrentBreakpoint());\n      };\n\n      if (mq.addEventListener) {\n        mq.addEventListener('change', handler);\n      } else if (mq.addListener) {\n        mq.addListener(handler);\n      }\n      return { mq, handler };\n    });\n\n    return (): void => {\n      mediaQueryList.forEach(({ mq, handler }) => {\n        if (mq.removeEventListener) {\n          mq.removeEventListener('change', handler);\n        } else if (mq.removeListener) {\n          mq.removeListener(handler);\n        }\n      });\n    };\n  }, []);\n\n  return breakpoint;\n};\n"],"mappings":";;AAIA,IAAY,aAAA,yBAAA,cAAL;AACL,cAAA,aAAA,SAAM,YAAY,OAAA;AAClB,cAAA,aAAA,QAAK,YAAY,MAAA;AACjB,cAAA,aAAA,QAAK,YAAY,MAAA;AACjB,cAAA,aAAA,QAAK,YAAY,MAAA;AACjB,cAAA,aAAA,QAAK,YAAY,MAAA;AACjB,cAAA,aAAA,QAAK,YAAY,MAAA;;;AAGnB,SAAS,uBAAmC;AAa1C,QAVuB,OAAO,QAAQ,OAAO,CAC1C,SAAS,CACT,KAAK,CAAC,MAAM,gBAAgB;AAC3B,SAAO;GACL,YAAY,WAAW;GACvB,IAAI,OAAO,WAAW,WAAW;GAClC;GACD,CAE2B,MAAK,UAAS,MAAM,GAAG,QAAQ,EAC9C,cAAc,WAAW;;AAG3C,MAAa,sBAAkC;CAC7C,MAAM,CAAC,YAAY,iBAAiB,SAAqB,WAAW,IAAI;AAExE,iBAAgB;AAEd,gBAAc,sBAAsB,CAAC;IACpC,EAAE,CAAC;AAEN,iBAAgB;EACd,MAAM,iBAAiB,OAAO,OAAO,OAAO,CAAC,KAAI,eAAc;GAC7D,MAAM,KAAK,OAAO,WAAW,WAAW;GAGxC,MAAM,gBAAsB;AAC1B,kBAAc,sBAAsB,CAAC;;AAGvC,OAAI,GAAG,iBACL,IAAG,iBAAiB,UAAU,QAAQ;YAC7B,GAAG,YACZ,IAAG,YAAY,QAAQ;AAEzB,UAAO;IAAE;IAAI;IAAS;IACtB;AAEF,eAAmB;AACjB,kBAAe,SAAS,EAAE,IAAI,cAAc;AAC1C,QAAI,GAAG,oBACL,IAAG,oBAAoB,UAAU,QAAQ;aAChC,GAAG,eACZ,IAAG,eAAe,QAAQ;KAE5B;;IAEH,EAAE,CAAC;AAEN,QAAO"}

package/useElementList.js

@@ -0,0 +1,25 @@
+import { useEffect, useState } from "react";
+const useElementList = (ref, selectors, options) => {
+	const [elementList, setElementList] = useState();
+	useEffect(() => {
+		const handleMutationChange = () => {
+			const elements = ref.current?.querySelectorAll(selectors);
+			setElementList(elements);
+		};
+		const mutationObserver = new MutationObserver(handleMutationChange);
+		if (ref?.current) mutationObserver.observe(ref.current, {
+			subtree: true,
+			childList: true,
+			attributes: true,
+			...options
+		});
+		handleMutationChange();
+		return () => {
+			mutationObserver.disconnect();
+		};
+	}, [ref, selectors]);
+	return elementList;
+};
+export { useElementList as t };
+
+//# sourceMappingURL=useElementList.js.map

package/useElementList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useElementList.js","names":[],"sources":["../src/hooks/useElementList.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\n\n/**\n * Hent ut en liste med HTML-elementer. Bruker MutationObserver-APIet.\n * @param ref Element som skal observeres\n * @param selectors Selektorer som sendes til querySelectorAll for å hente ut liste med elementer\n * @param options MutationObserver-options. Default er å lytte på endringer på child-elementer og deres attributter.\n * @returns Liste med HTML-elementer\n */\nexport const useElementList = (\n  ref: React.RefObject<HTMLElement>,\n  selectors: string,\n  options?: MutationObserverInit\n): NodeListOf<HTMLElement> | undefined => {\n  const [elementList, setElementList] = useState<NodeListOf<HTMLElement>>();\n\n  useEffect(() => {\n    const handleMutationChange = (): void => {\n      const elements = ref.current?.querySelectorAll<HTMLElement>(selectors);\n      setElementList(elements);\n    };\n\n    const mutationObserver = new MutationObserver(handleMutationChange);\n    if (ref?.current) {\n      mutationObserver.observe(ref.current, { subtree: true, childList: true, attributes: true, ...options });\n    }\n\n    handleMutationChange();\n\n    return (): void => {\n      mutationObserver.disconnect();\n    };\n  }, [ref, selectors]);\n\n  return elementList;\n};\n"],"mappings":";AASA,MAAa,kBACX,KACA,WACA,YACwC;CACxC,MAAM,CAAC,aAAa,kBAAkB,UAAmC;AAEzE,iBAAgB;EACd,MAAM,6BAAmC;GACvC,MAAM,WAAW,IAAI,SAAS,iBAA8B,UAAU;AACtE,kBAAe,SAAS;;EAG1B,MAAM,mBAAmB,IAAI,iBAAiB,qBAAqB;AACnE,MAAI,KAAK,QACP,kBAAiB,QAAQ,IAAI,SAAS;GAAE,SAAS;GAAM,WAAW;GAAM,YAAY;GAAM,GAAG;GAAS,CAAC;AAGzG,wBAAsB;AAEtB,eAAmB;AACjB,oBAAiB,YAAY;;IAE9B,CAAC,KAAK,UAAU,CAAC;AAEpB,QAAO"}

package/useExpand.js

@@ -0,0 +1,16 @@
+import { t as usePrevious } from "./usePrevious.js";
+import { useEffect, useState } from "react";
+const useExpand = (expanded, onExpand) => {
+	const [isExpanded, setIsExpanded] = useState(expanded);
+	const previousIsExpanded = usePrevious(isExpanded);
+	useEffect(() => {
+		if (expanded !== isExpanded) setIsExpanded(expanded);
+	}, [expanded]);
+	useEffect(() => {
+		if (onExpand && isExpanded !== !!previousIsExpanded) onExpand(isExpanded);
+	}, [isExpanded, onExpand]);
+	return [isExpanded, setIsExpanded];
+};
+export { useExpand as t };
+
+//# sourceMappingURL=useExpand.js.map

package/useExpand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useExpand.js","names":[],"sources":["../src/hooks/useExpand.ts"],"sourcesContent":["import { Dispatch, SetStateAction, useEffect, useState } from 'react';\n\nimport { usePrevious } from './usePrevious';\n\nexport const useExpand = (expanded: boolean, onExpand?: (isExpanded: boolean) => void): [boolean, Dispatch<SetStateAction<boolean>>] => {\n  const [isExpanded, setIsExpanded] = useState(expanded);\n  const previousIsExpanded = usePrevious(isExpanded);\n\n  useEffect(() => {\n    if (expanded !== isExpanded) {\n      setIsExpanded(expanded);\n    }\n  }, [expanded]);\n\n  useEffect(() => {\n    if (onExpand && isExpanded !== !!previousIsExpanded) {\n      onExpand(isExpanded);\n    }\n  }, [isExpanded, onExpand]);\n\n  return [isExpanded, setIsExpanded];\n};\n"],"mappings":";;AAIA,MAAa,aAAa,UAAmB,aAA2F;CACtI,MAAM,CAAC,YAAY,iBAAiB,SAAS,SAAS;CACtD,MAAM,qBAAqB,YAAY,WAAW;AAElD,iBAAgB;AACd,MAAI,aAAa,WACf,eAAc,SAAS;IAExB,CAAC,SAAS,CAAC;AAEd,iBAAgB;AACd,MAAI,YAAY,eAAe,CAAC,CAAC,mBAC/B,UAAS,WAAW;IAErB,CAAC,YAAY,SAAS,CAAC;AAE1B,QAAO,CAAC,YAAY,cAAc"}

package/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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/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"}