@helsenorge/designsystem-react 9.4.0 → 9.4.3

package/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n  XXSmall = 24,\n  XSmall = 38,\n  Small = 48,\n  Medium = 64,\n  Large = 80,\n  XLarge = 130,\n}\n\nexport enum ZIndex {\n  Modal = 1300000,\n  PopOver = 11000,\n  // TODO: Skille mellom ExpanderTrigger isSticky og isHovered? Skulle tro isHovered trenger vesentlig mindre z-index\n  ExpanderTrigger = 10000,\n  OverlayScreen = 9999,\n  LightBoxButtons = 1000,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n  autoFocus?: boolean;\n  disabled?: boolean;\n  form?: string;\n  formAction?: string;\n  formEncType?: string;\n  formMethod?: string;\n  formNoValidate?: boolean;\n  formTarget?: string;\n  name?: string;\n  type?: 'submit' | 'reset' | 'button' | string;\n  value?: string | string[] | number;\n  id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n  download?: string;\n  href?: string;\n  hrefLang?: string;\n  media?: string;\n  ping?: string;\n  rel?: AnchorTarget;\n  target?: string;\n  referrerPolicy?:\n    | ''\n    | 'same-origin'\n    | 'no-referrer'\n    | 'no-referrer-when-downgrade'\n    | 'origin'\n    | 'origin-when-cross-origin'\n    | 'strict-origin'\n    | 'strict-origin-when-cross-origin'\n    | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormOnColor {\n  onwhite = 'onwhite',\n  ongrey = 'ongrey',\n  onblueberry = 'onblueberry',\n  ondark = 'ondark',\n  oninvalid = 'oninvalid',\n}\n\nexport enum FormSize {\n  medium = 'medium',\n  large = 'large',\n}\n\nexport enum AnalyticsId {\n  AnchorLink = 'anchor-link',\n  Avatar = 'avatar',\n  Badge = 'badge',\n  Button = 'button',\n  Checkbox = 'checkbox',\n  Chip = 'chip',\n  Close = 'close',\n  DictionaryTrigger = 'dictionary-trigger',\n  Dropdown = 'dropdown',\n  Duolist = 'duolist',\n  EmptyState = 'empty-state',\n  Expander = 'expander',\n  ExpanderHierarchy = 'expander-hierarchy',\n  ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n  ExpanderList = 'expander-list',\n  ExpanderListExpander = 'expander-list-expander',\n  EyebrowHeader = 'eyebrow-header',\n  FormGroup = 'form-group',\n  FormLayout = 'form-layout',\n  HelpBubble = 'help-bubble',\n  HelpQuestion = 'help-question',\n  HighlightPanel = 'highlight-panel',\n  Icon = 'icon',\n  Illustration = 'Illustration',\n  Input = 'input',\n  Label = 'label',\n  Link = 'link',\n  LinkList = 'link-list',\n  List = 'list',\n  Loader = 'loader',\n  Logo = 'logo',\n  Modal = 'modal',\n  NotificationPanel = 'notification-panel',\n  Panel = 'panel',\n  PanelList = 'panel-list',\n  PopMenu = 'pop-menu',\n  PopOver = 'pop-over',\n  Portal = 'portal',\n  PromoPanel = 'promo-panel',\n  RadioButton = 'radio-button',\n  Select = 'select',\n  SharingStatus = 'sharing-status',\n  Slider = 'slider',\n  Spacer = 'spacer',\n  StatusDot = 'status-dot',\n  Step = 'step',\n  StepButtons = 'step-buttons',\n  Stepper = 'stepper',\n  Sublabel = 'sublabel',\n  Table = 'table',\n  Tag = 'tag',\n  TagList = 'tag-list',\n  Textarea = 'textarea',\n  Tile = 'tile',\n  Title = 'title',\n  Toggle = 'toggle',\n  Tooltip = 'tooltip',\n  Trigger = 'trigger',\n  Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n  Enter = 'Enter',\n  Escape = 'Escape',\n  ArrowDown = 'ArrowDown',\n  ArrowUp = 'ArrowUp',\n  ArrowRight = 'ArrowRight',\n  ArrowLeft = 'ArrowLeft',\n  Home = 'Home',\n  End = 'End',\n  Space = ' ',\n  Tab = 'Tab',\n}\n"],"names":["IconSize","ZIndex","AVERAGE_CHARACTER_WIDTH_PX","FormOnColor","FormSize","AnalyticsId","KeyboardEventKey"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAAA,EAAA,UAAU,EAAV,IAAA,WACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,GAAT,IAAA,UANUA,IAAAA,KAAA,CAAA,CAAA,GASAC,sBAAAA,OACVA,EAAAA,EAAA,QAAQ,IAAR,IAAA,SACAA,EAAAA,EAAA,UAAU,IAAV,IAAA,WAEAA,EAAAA,EAAA,kBAAkB,GAAlB,IAAA,mBACAA,EAAAA,EAAA,gBAAgB,IAAhB,IAAA,iBACAA,EAAAA,EAAA,kBAAkB,GAAlB,IAAA,mBANUA,IAAAA,KAAA,CAAA,CAAA;AASL,MAAMC,IAA6B;AAyC9B,IAAAC,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,SAAS,UACTA,EAAA,cAAc,eACdA,EAAA,SAAS,UACTA,EAAA,YAAY,aALFA,IAAAA,KAAA,CAAA,CAAA,GAQAC,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA,GAKAC,sBAAAA,OACVA,EAAA,aAAa,eACbA,EAAA,SAAS,UACTA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,WAAW,YACXA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,WAAW,YACXA,EAAA,UAAU,WACVA,EAAA,aAAa,eACbA,EAAA,WAAW,YACXA,EAAA,oBAAoB,sBACpBA,EAAA,4BAA4B,+BAC5BA,EAAA,eAAe,iBACfA,EAAA,uBAAuB,0BACvBA,EAAA,gBAAgB,kBAChBA,EAAA,YAAY,cACZA,EAAA,aAAa,eACbA,EAAA,aAAa,eACbA,EAAA,eAAe,iBACfA,EAAA,iBAAiB,mBACjBA,EAAA,OAAO,QACPA,EAAA,eAAe,gBACfA,EAAA,QAAQ,SACRA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,WAAW,aACXA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,QAAQ,SACRA,EAAA,YAAY,cACZA,EAAA,UAAU,YACVA,EAAA,UAAU,YACVA,EAAA,SAAS,UACTA,EAAA,aAAa,eACbA,EAAA,cAAc,gBACdA,EAAA,SAAS,UACTA,EAAA,gBAAgB,kBAChBA,EAAA,SAAS,UACTA,EAAA,SAAS,UACTA,EAAA,YAAY,cACZA,EAAA,OAAO,QACPA,EAAA,cAAc,gBACdA,EAAA,UAAU,WACVA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,MAAM,OACNA,EAAA,UAAU,YACVA,EAAA,WAAW,YACXA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,aAAa,cA3DHA,IAAAA,KAAA,CAAA,CAAA,GA8DAC,sBAAAA,OACVA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,YAAY,aACZA,EAAA,UAAU,WACVA,EAAA,aAAa,cACbA,EAAA,YAAY,aACZA,EAAA,OAAO,QACPA,EAAA,MAAM,OACNA,EAAA,QAAQ,KACRA,EAAA,MAAM,OAVIA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n  XXSmall = 24,\n  XSmall = 38,\n  Small = 48,\n  Medium = 64,\n  Large = 80,\n  XLarge = 130,\n}\n\nexport enum ZIndex {\n  Modal = 1300000,\n  PopOver = 11000,\n  // TODO: Skille mellom ExpanderTrigger isSticky og isHovered? Skulle tro isHovered trenger vesentlig mindre z-index\n  ExpanderTrigger = 10000,\n  OverlayScreen = 9999,\n  LightBoxButtons = 1000,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n  autoFocus?: boolean;\n  disabled?: boolean;\n  form?: string;\n  formAction?: string;\n  formEncType?: string;\n  formMethod?: string;\n  formNoValidate?: boolean;\n  formTarget?: string;\n  name?: string;\n  type?: 'submit' | 'reset' | 'button' | string;\n  value?: string | string[] | number;\n  id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n  download?: string;\n  href?: string;\n  hrefLang?: string;\n  media?: string;\n  ping?: string;\n  rel?: AnchorTarget;\n  target?: string;\n  referrerPolicy?:\n    | ''\n    | 'same-origin'\n    | 'no-referrer'\n    | 'no-referrer-when-downgrade'\n    | 'origin'\n    | 'origin-when-cross-origin'\n    | 'strict-origin'\n    | 'strict-origin-when-cross-origin'\n    | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormOnColor {\n  onwhite = 'onwhite',\n  ongrey = 'ongrey',\n  onblueberry = 'onblueberry',\n  ondark = 'ondark',\n  oninvalid = 'oninvalid',\n}\n\nexport enum FormSize {\n  medium = 'medium',\n  large = 'large',\n}\n\nexport enum AnalyticsId {\n  AnchorLink = 'anchor-link',\n  Avatar = 'avatar',\n  Badge = 'badge',\n  Button = 'button',\n  Checkbox = 'checkbox',\n  Chip = 'chip',\n  Close = 'close',\n  DictionaryTrigger = 'dictionary-trigger',\n  Dropdown = 'dropdown',\n  Duolist = 'duolist',\n  EmptyState = 'empty-state',\n  Expander = 'expander',\n  ExpanderHierarchy = 'expander-hierarchy',\n  ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n  ExpanderList = 'expander-list',\n  ExpanderListExpander = 'expander-list-expander',\n  EyebrowHeader = 'eyebrow-header',\n  FormGroup = 'form-group',\n  FormLayout = 'form-layout',\n  HelpBubble = 'help-bubble',\n  HelpQuestion = 'help-question',\n  HighlightPanel = 'highlight-panel',\n  Icon = 'icon',\n  Illustration = 'Illustration',\n  Input = 'input',\n  Label = 'label',\n  Link = 'link',\n  LinkList = 'link-list',\n  List = 'list',\n  Loader = 'loader',\n  Logo = 'logo',\n  Modal = 'modal',\n  NotificationPanel = 'notification-panel',\n  Panel = 'panel',\n  PanelList = 'panel-list',\n  PopMenu = 'pop-menu',\n  PopOver = 'pop-over',\n  Portal = 'portal',\n  PromoPanel = 'promo-panel',\n  RadioButton = 'radio-button',\n  Select = 'select',\n  SharingStatus = 'sharing-status',\n  Slider = 'slider',\n  Spacer = 'spacer',\n  StatusDot = 'status-dot',\n  Step = 'step',\n  StepButtons = 'step-buttons',\n  Stepper = 'stepper',\n  Sublabel = 'sublabel',\n  Table = 'table',\n  Tag = 'tag',\n  TagList = 'tag-list',\n  Textarea = 'textarea',\n  Tile = 'tile',\n  Title = 'title',\n  Toggle = 'toggle',\n  Tooltip = 'tooltip',\n  Trigger = 'trigger',\n  Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n  Enter = 'Enter',\n  Escape = 'Escape',\n  ArrowDown = 'ArrowDown',\n  ArrowUp = 'ArrowUp',\n  ArrowRight = 'ArrowRight',\n  ArrowLeft = 'ArrowLeft',\n  Home = 'Home',\n  End = 'End',\n  Space = ' ',\n  Tab = 'Tab',\n}\n"],"names":["IconSize","ZIndex","FormOnColor","FormSize","AnalyticsId","KeyboardEventKey"],"mappings":"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"}

package/docs/ButtonWithModal/ButtonWithModal.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { ModalProps } from '../../components/Modal';
 interface ModalWithButtonProps extends ModalProps {
     /** Text of the button */

package/docs/ButtonWithModal/index.d.ts

@@ -1,3 +1,3 @@
-import ButtonWithModal from './ButtonWithModal';
+import { default as ButtonWithModal } from './ButtonWithModal';
 export * from './ButtonWithModal';
 export default ButtonWithModal;

package/docs/FormExample/index.d.ts

@@ -1,3 +1,3 @@
-import FormExample from './FormExample';
+import { default as FormExample } from './FormExample';
 export * from './FormExample';
 export default FormExample;

package/docs/GridExample/GridExample.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 type GridLayout = 'helsenorge' | 'padding' | 'none';
 interface GridExampleProps {
     gridLayout: GridLayout;

package/docs/GridExample/index.d.ts

@@ -1,3 +1,3 @@
-import GridExample from './GridExample';
+import { default as GridExample } from './GridExample';
 export * from './GridExample';
 export default GridExample;

package/docs/HelpBubbleExample/HelpBubbleExample.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { HelpBubbleProps } from '../../components/HelpBubble';
 declare const HelpBubbleExample: React.FC<HelpBubbleProps>;
 export default HelpBubbleExample;

package/docs/HelpBubbleExample/index.d.ts

@@ -1,3 +1,3 @@
-import HelpBubbleExample from './HelpBubbleExample';
+import { default as HelpBubbleExample } from './HelpBubbleExample';
 export * from './HelpBubbleExample';
 export default HelpBubbleExample;

package/docs/TooltipExample/TooltipExample.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { TooltipProps } from '../../components/Tooltip';
 declare const TooltipExample: React.FC<TooltipProps>;
 export default TooltipExample;

package/docs/TooltipExample/index.d.ts

@@ -1,3 +1,3 @@
-import TooltipExample from './TooltipExample';
+import { default as TooltipExample } from './TooltipExample';
 export * from './TooltipExample';
 export default TooltipExample;

package/hoc/withBreakpoint/index.d.ts

@@ -1,3 +1,3 @@
-import withBreakpoint from './withBreakpoint';
+import { default as withBreakpoint } from './withBreakpoint';
 export * from './withBreakpoint';
 export default withBreakpoint;

package/hoc/withBreakpoint/index.js

@@ -1,6 +1,6 @@
-import { withBreakpoint as o } from "./withBreakpoint.js";
+import { withBreakpoint } from "./withBreakpoint.js";
 export {
-  o as default,
-  o as withBreakpoint
+  withBreakpoint as default,
+  withBreakpoint
 };
 //# sourceMappingURL=index.js.map

package/hoc/withBreakpoint/withBreakpoint.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { Breakpoint } from '../../hooks/useBreakpoint';
 export interface BreakpointProps {
     breakpoint: Breakpoint;

package/hoc/withBreakpoint/withBreakpoint.js

@@ -1,14 +1,14 @@
-import { jsx as i } from "react/jsx-runtime";
-import n from "react";
-import { useBreakpoint as a } from "../../hooks/useBreakpoint.js";
-function u(r) {
-  return n.forwardRef((t, o) => {
-    const e = a();
-    return /* @__PURE__ */ i(r, { ref: o, ...t, breakpoint: e });
+import { jsx } from "react/jsx-runtime";
+import React from "react";
+import { useBreakpoint } from "../../hooks/useBreakpoint.js";
+function withBreakpoint(Component) {
+  return React.forwardRef((props, ref) => {
+    const breakpoint = useBreakpoint();
+    return /* @__PURE__ */ jsx(Component, { ref, ...props, breakpoint });
   });
 }
 export {
-  u as default,
-  u as withBreakpoint
+  withBreakpoint as default,
+  withBreakpoint
 };
 //# sourceMappingURL=withBreakpoint.js.map

package/hoc/withBreakpoint/withBreakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"withBreakpoint.js","sources":["../../../src/hoc/withBreakpoint/withBreakpoint.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\n\nexport interface BreakpointProps {\n  breakpoint: Breakpoint;\n}\n\n// Hentet fra https://github.com/DefinitelyTyped/DefinitelyTyped/issues/35834#issuecomment-497605842\nexport function withBreakpoint<P extends BreakpointProps, C extends React.ComponentClass<P>>(\n  Component: C & React.ComponentType<P>\n): React.ForwardRefExoticComponent<Omit<React.ComponentPropsWithoutRef<C> & { ref?: React.Ref<InstanceType<C>> }, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps & { ref?: React.Ref<unknown> }>(\n  Component: React.ForwardRefExoticComponent<P>\n): React.ForwardRefExoticComponent<Omit<P, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps>(\n  Component: React.FunctionComponent<P>\n): React.ForwardRefExoticComponent<Omit<P, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps>(Component: React.ComponentType<P>) {\n  return React.forwardRef((props, ref) => {\n    const breakpoint = useBreakpoint();\n    return <Component ref={ref} {...(props as P)} breakpoint={breakpoint} />;\n  });\n}\n\nexport default withBreakpoint;\n"],"names":["withBreakpoint","Component","React","props","ref","breakpoint","useBreakpoint","jsx"],"mappings":";;;AAqBO,SAASA,EAA0CC,GAAmC;AAC3F,SAAOC,EAAM,WAAW,CAACC,GAAOC,MAAQ;AACtC,UAAMC,IAAaC;AACnB,WAAQ,gBAAAC,EAAAN,GAAA,EAAU,KAAAG,GAAW,GAAID,GAAa,YAAAE,EAAwB,CAAA;AAAA,EAAA,CACvE;AACH;"}
+{"version":3,"file":"withBreakpoint.js","sources":["../../../src/hoc/withBreakpoint/withBreakpoint.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\n\nexport interface BreakpointProps {\n  breakpoint: Breakpoint;\n}\n\n// Hentet fra https://github.com/DefinitelyTyped/DefinitelyTyped/issues/35834#issuecomment-497605842\nexport function withBreakpoint<P extends BreakpointProps, C extends React.ComponentClass<P>>(\n  Component: C & React.ComponentType<P>\n): React.ForwardRefExoticComponent<Omit<React.ComponentPropsWithoutRef<C> & { ref?: React.Ref<InstanceType<C>> }, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps & { ref?: React.Ref<unknown> }>(\n  Component: React.ForwardRefExoticComponent<P>\n): React.ForwardRefExoticComponent<Omit<P, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps>(\n  Component: React.FunctionComponent<P>\n): React.ForwardRefExoticComponent<Omit<P, keyof BreakpointProps>>;\n\nexport function withBreakpoint<P extends BreakpointProps>(Component: React.ComponentType<P>) {\n  return React.forwardRef((props, ref) => {\n    const breakpoint = useBreakpoint();\n    return <Component ref={ref} {...(props as P)} breakpoint={breakpoint} />;\n  });\n}\n\nexport default withBreakpoint;\n"],"names":[],"mappings":";;;AAqBO,SAAS,eAA0C,WAAmC;AAC3F,SAAO,MAAM,WAAW,CAAC,OAAO,QAAQ;AACtC,UAAM,aAAa,cAAc;AACjC,WAAQ,oBAAA,WAAA,EAAU,KAAW,GAAI,OAAa,YAAwB;AAAA,EAAA,CACvE;AACH;"}

package/hooks/useBreakpoint.js

@@ -1,45 +1,66 @@
-import { useState as x, useEffect as l } from "react";
-import { breakpoints as t, screen as a } from "../theme/grid.js";
-var r = ((s) => (s[s.xxs = t.xxs] = "xxs", s[s.xs = t.xs] = "xs", s[s.sm = t.sm] = "sm", s[s.md = t.md] = "md", s[s.lg = t.lg] = "lg", s[s.xl = t.xl] = "xl", s))(r || {});
-const f = () => {
-  const [s, m] = x(r.xxs);
-  return l(() => {
-    var n;
-    const d = (e) => {
-      switch (e.media) {
-        case a.xl:
-          m(e.matches ? r.xl : r.lg);
+import { useState, useEffect } from "react";
+import { breakpoints, screen } from "../theme/grid.js";
+var Breakpoint = ((Breakpoint2) => {
+  Breakpoint2[Breakpoint2["xxs"] = breakpoints.xxs] = "xxs";
+  Breakpoint2[Breakpoint2["xs"] = breakpoints.xs] = "xs";
+  Breakpoint2[Breakpoint2["sm"] = breakpoints.sm] = "sm";
+  Breakpoint2[Breakpoint2["md"] = breakpoints.md] = "md";
+  Breakpoint2[Breakpoint2["lg"] = breakpoints.lg] = "lg";
+  Breakpoint2[Breakpoint2["xl"] = breakpoints.xl] = "xl";
+  return Breakpoint2;
+})(Breakpoint || {});
+const useBreakpoint = () => {
+  const [breakpoint, setBreakpoint] = useState(Breakpoint.xxs);
+  useEffect(() => {
+    var _a;
+    const handleMediaQueryEvent = (event) => {
+      switch (event.media) {
+        case screen.xl:
+          setBreakpoint(event.matches ? Breakpoint.xl : Breakpoint.lg);
           return;
-        case a.lg:
-          m(e.matches ? r.lg : r.md);
+        case screen.lg:
+          setBreakpoint(event.matches ? Breakpoint.lg : Breakpoint.md);
           return;
-        case a.md:
-          m(e.matches ? r.md : r.sm);
+        case screen.md:
+          setBreakpoint(event.matches ? Breakpoint.md : Breakpoint.sm);
           return;
-        case a.sm:
-          m(e.matches ? r.sm : r.xs);
+        case screen.sm:
+          setBreakpoint(event.matches ? Breakpoint.sm : Breakpoint.xs);
           return;
-        case a.xs:
-          m(e.matches ? r.xs : r.xxs);
+        case screen.xs:
+          setBreakpoint(event.matches ? Breakpoint.xs : Breakpoint.xxs);
           return;
         default:
-          m(r.xxs);
+          setBreakpoint(Breakpoint.xxs);
           return;
       }
-    }, i = Object.entries(a).reverse().map(([e, c]) => ({ breakpoint: r[e], mediaQuery: window.matchMedia(c) }));
-    i.forEach((e) => {
-      e.mediaQuery.addEventListener ? e.mediaQuery.addEventListener("change", d) : e.mediaQuery.addListener && e.mediaQuery.addListener(d);
+    };
+    const mediaQueryList = Object.entries(screen).reverse().map(([size, mediaQuery]) => {
+      return { breakpoint: Breakpoint[size], mediaQuery: window.matchMedia(mediaQuery) };
+    });
+    mediaQueryList.forEach((x) => {
+      if (x.mediaQuery.addEventListener) {
+        x.mediaQuery.addEventListener("change", handleMediaQueryEvent);
+      } else if (x.mediaQuery.addListener) {
+        x.mediaQuery.addListener(handleMediaQueryEvent);
+      }
     });
-    const u = ((n = i.find((e) => e.mediaQuery.matches)) == null ? void 0 : n.breakpoint) ?? s;
-    return m(u), () => {
-      i.forEach((e) => {
-        e.mediaQuery.removeEventListener ? e.mediaQuery.removeEventListener("change", d) : e.mediaQuery.removeListener && e.mediaQuery.removeListener(d);
+    const initialBreakpoint = ((_a = mediaQueryList.find((x) => x.mediaQuery.matches)) == null ? void 0 : _a.breakpoint) ?? breakpoint;
+    setBreakpoint(initialBreakpoint);
+    return () => {
+      mediaQueryList.forEach((x) => {
+        if (x.mediaQuery.removeEventListener) {
+          x.mediaQuery.removeEventListener("change", handleMediaQueryEvent);
+        } else if (x.mediaQuery.removeListener) {
+          x.mediaQuery.removeListener(handleMediaQueryEvent);
+        }
       });
     };
-  }, []), s;
+  }, []);
+  return breakpoint;
 };
 export {
-  r as Breakpoint,
-  f as useBreakpoint
+  Breakpoint,
+  useBreakpoint
 };
 //# sourceMappingURL=useBreakpoint.js.map

package/hooks/useBreakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBreakpoint.js","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\n/**\n * Lytt på endringer i breakpoint basert på media queries. Trigger re-render bare når breakpoint er endret.\n * @returns Gjeldende breakpoint\n */\nexport const useBreakpoint = (): Breakpoint => {\n  const [breakpoint, setBreakpoint] = useState<Breakpoint>(Breakpoint.xxs);\n\n  useEffect(() => {\n    const handleMediaQueryEvent = (event: MediaQueryListEvent): void => {\n      switch (event.media) {\n        case screen.xl:\n          setBreakpoint(event.matches ? Breakpoint.xl : Breakpoint.lg);\n          return;\n        case screen.lg:\n          setBreakpoint(event.matches ? Breakpoint.lg : Breakpoint.md);\n          return;\n        case screen.md:\n          setBreakpoint(event.matches ? Breakpoint.md : Breakpoint.sm);\n          return;\n        case screen.sm:\n          setBreakpoint(event.matches ? Breakpoint.sm : Breakpoint.xs);\n          return;\n        case screen.xs:\n          setBreakpoint(event.matches ? Breakpoint.xs : Breakpoint.xxs);\n          return;\n        default:\n          setBreakpoint(Breakpoint.xxs);\n          return;\n      }\n    };\n\n    // Lytt etter endringer for hvert breakpoint\n    const mediaQueryList = Object.entries(screen)\n      .reverse()\n      .map(([size, mediaQuery]) => {\n        return { breakpoint: Breakpoint[size as keyof typeof Breakpoint], mediaQuery: window.matchMedia(mediaQuery) };\n      });\n    mediaQueryList.forEach(x => {\n      // iOS <=13 har ikke støtte for addEventListener/removeEventListener på MediaQueryList,\n      // men har støtte for addListener\n      if (x.mediaQuery.addEventListener) {\n        x.mediaQuery.addEventListener('change', handleMediaQueryEvent);\n      } else if (x.mediaQuery.addListener) {\n        x.mediaQuery.addListener(handleMediaQueryEvent);\n      }\n    });\n\n    // Finn breakpoint ved første render\n    const initialBreakpoint = mediaQueryList.find(x => x.mediaQuery.matches)?.breakpoint ?? breakpoint;\n    setBreakpoint(initialBreakpoint);\n\n    return (): void => {\n      mediaQueryList.forEach(x => {\n        if (x.mediaQuery.removeEventListener) {\n          x.mediaQuery.removeEventListener('change', handleMediaQueryEvent);\n        } else if (x.mediaQuery.removeListener) {\n          x.mediaQuery.removeListener(handleMediaQueryEvent);\n        }\n      });\n    };\n  }, []);\n\n  return breakpoint;\n};\n"],"names":["Breakpoint","breakpoints","useBreakpoint","breakpoint","setBreakpoint","useState","useEffect","handleMediaQueryEvent","event","screen","mediaQueryList","size","mediaQuery","x","initialBreakpoint","_a"],"mappings":";;AAIY,IAAAA,KAAL,CAAKA,OACVA,EAAAA,EAAA,MAAMC,EAAY,GAAlB,IAAA,OACAD,EAAAA,EAAA,KAAKC,EAAY,EAAjB,IAAA,MACAD,EAAAA,EAAA,KAAKC,EAAY,EAAjB,IAAA,MACAD,EAAAA,EAAA,KAAKC,EAAY,EAAjB,IAAA,MACAD,EAAAA,EAAA,KAAKC,EAAY,EAAjB,IAAA,MACAD,EAAAA,EAAA,KAAKC,EAAY,EAAjB,IAAA,MANUD,IAAAA,KAAA,CAAA,CAAA;AAaL,MAAME,IAAgB,MAAkB;AAC7C,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAqBL,EAAW,GAAG;AAEvE,SAAAM,EAAU,MAAM;;AACR,UAAAC,IAAwB,CAACC,MAAqC;AAClE,cAAQA,EAAM,OAAO;AAAA,QACnB,KAAKC,EAAO;AACV,UAAAL,EAAcI,EAAM,UAAUR,EAAW,KAAKA,EAAW,EAAE;AAC3D;AAAA,QACF,KAAKS,EAAO;AACV,UAAAL,EAAcI,EAAM,UAAUR,EAAW,KAAKA,EAAW,EAAE;AAC3D;AAAA,QACF,KAAKS,EAAO;AACV,UAAAL,EAAcI,EAAM,UAAUR,EAAW,KAAKA,EAAW,EAAE;AAC3D;AAAA,QACF,KAAKS,EAAO;AACV,UAAAL,EAAcI,EAAM,UAAUR,EAAW,KAAKA,EAAW,EAAE;AAC3D;AAAA,QACF,KAAKS,EAAO;AACV,UAAAL,EAAcI,EAAM,UAAUR,EAAW,KAAKA,EAAW,GAAG;AAC5D;AAAA,QACF;AACE,UAAAI,EAAcJ,EAAW,GAAG;AAC5B;AAAA,MACJ;AAAA,IAAA,GAIIU,IAAiB,OAAO,QAAQD,CAAM,EACzC,QACA,EAAA,IAAI,CAAC,CAACE,GAAMC,CAAU,OACd,EAAE,YAAYZ,EAAWW,CAA+B,GAAG,YAAY,OAAO,WAAWC,CAAU,IAC3G;AACH,IAAAF,EAAe,QAAQ,CAAKG,MAAA;AAGtB,MAAAA,EAAE,WAAW,mBACbA,EAAA,WAAW,iBAAiB,UAAUN,CAAqB,IACpDM,EAAE,WAAW,eACpBA,EAAA,WAAW,YAAYN,CAAqB;AAAA,IAChD,CACD;AAGK,UAAAO,MAAoBC,IAAAL,EAAe,KAAK,CAAAG,MAAKA,EAAE,WAAW,OAAO,MAA7C,gBAAAE,EAAgD,eAAcZ;AACxF,WAAAC,EAAcU,CAAiB,GAExB,MAAY;AACjB,MAAAJ,EAAe,QAAQ,CAAKG,MAAA;AACtB,QAAAA,EAAE,WAAW,sBACbA,EAAA,WAAW,oBAAoB,UAAUN,CAAqB,IACvDM,EAAE,WAAW,kBACpBA,EAAA,WAAW,eAAeN,CAAqB;AAAA,MACnD,CACD;AAAA,IAAA;AAAA,EAEL,GAAG,CAAE,CAAA,GAEEJ;AACT;"}
+{"version":3,"file":"useBreakpoint.js","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\n/**\n * Lytt på endringer i breakpoint basert på media queries. Trigger re-render bare når breakpoint er endret.\n * @returns Gjeldende breakpoint\n */\nexport const useBreakpoint = (): Breakpoint => {\n  const [breakpoint, setBreakpoint] = useState<Breakpoint>(Breakpoint.xxs);\n\n  useEffect(() => {\n    const handleMediaQueryEvent = (event: MediaQueryListEvent): void => {\n      switch (event.media) {\n        case screen.xl:\n          setBreakpoint(event.matches ? Breakpoint.xl : Breakpoint.lg);\n          return;\n        case screen.lg:\n          setBreakpoint(event.matches ? Breakpoint.lg : Breakpoint.md);\n          return;\n        case screen.md:\n          setBreakpoint(event.matches ? Breakpoint.md : Breakpoint.sm);\n          return;\n        case screen.sm:\n          setBreakpoint(event.matches ? Breakpoint.sm : Breakpoint.xs);\n          return;\n        case screen.xs:\n          setBreakpoint(event.matches ? Breakpoint.xs : Breakpoint.xxs);\n          return;\n        default:\n          setBreakpoint(Breakpoint.xxs);\n          return;\n      }\n    };\n\n    // Lytt etter endringer for hvert breakpoint\n    const mediaQueryList = Object.entries(screen)\n      .reverse()\n      .map(([size, mediaQuery]) => {\n        return { breakpoint: Breakpoint[size as keyof typeof Breakpoint], mediaQuery: window.matchMedia(mediaQuery) };\n      });\n    mediaQueryList.forEach(x => {\n      // iOS <=13 har ikke støtte for addEventListener/removeEventListener på MediaQueryList,\n      // men har støtte for addListener\n      if (x.mediaQuery.addEventListener) {\n        x.mediaQuery.addEventListener('change', handleMediaQueryEvent);\n      } else if (x.mediaQuery.addListener) {\n        x.mediaQuery.addListener(handleMediaQueryEvent);\n      }\n    });\n\n    // Finn breakpoint ved første render\n    const initialBreakpoint = mediaQueryList.find(x => x.mediaQuery.matches)?.breakpoint ?? breakpoint;\n    setBreakpoint(initialBreakpoint);\n\n    return (): void => {\n      mediaQueryList.forEach(x => {\n        if (x.mediaQuery.removeEventListener) {\n          x.mediaQuery.removeEventListener('change', handleMediaQueryEvent);\n        } else if (x.mediaQuery.removeListener) {\n          x.mediaQuery.removeListener(handleMediaQueryEvent);\n        }\n      });\n    };\n  }, []);\n\n  return breakpoint;\n};\n"],"names":["Breakpoint"],"mappings":";;AAIY,IAAA,cAAL,CAAKA,gBAAL;AACLA,cAAAA,YAAA,KAAM,IAAA,YAAY,GAAlB,IAAA;AACAA,cAAAA,YAAA,IAAK,IAAA,YAAY,EAAjB,IAAA;AACAA,cAAAA,YAAA,IAAK,IAAA,YAAY,EAAjB,IAAA;AACAA,cAAAA,YAAA,IAAK,IAAA,YAAY,EAAjB,IAAA;AACAA,cAAAA,YAAA,IAAK,IAAA,YAAY,EAAjB,IAAA;AACAA,cAAAA,YAAA,IAAK,IAAA,YAAY,EAAjB,IAAA;AANUA,SAAAA;AAAA,GAAA,cAAA,CAAA,CAAA;AAaL,MAAM,gBAAgB,MAAkB;AAC7C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAqB,WAAW,GAAG;AAEvE,YAAU,MAAM;;AACR,UAAA,wBAAwB,CAAC,UAAqC;AAClE,cAAQ,MAAM,OAAO;AAAA,QACnB,KAAK,OAAO;AACV,wBAAc,MAAM,UAAU,WAAW,KAAK,WAAW,EAAE;AAC3D;AAAA,QACF,KAAK,OAAO;AACV,wBAAc,MAAM,UAAU,WAAW,KAAK,WAAW,EAAE;AAC3D;AAAA,QACF,KAAK,OAAO;AACV,wBAAc,MAAM,UAAU,WAAW,KAAK,WAAW,EAAE;AAC3D;AAAA,QACF,KAAK,OAAO;AACV,wBAAc,MAAM,UAAU,WAAW,KAAK,WAAW,EAAE;AAC3D;AAAA,QACF,KAAK,OAAO;AACV,wBAAc,MAAM,UAAU,WAAW,KAAK,WAAW,GAAG;AAC5D;AAAA,QACF;AACE,wBAAc,WAAW,GAAG;AAC5B;AAAA,MAAA;AAAA,IAEN;AAGA,UAAM,iBAAiB,OAAO,QAAQ,MAAM,EACzC,QACA,EAAA,IAAI,CAAC,CAAC,MAAM,UAAU,MAAM;AACpB,aAAA,EAAE,YAAY,WAAW,IAA+B,GAAG,YAAY,OAAO,WAAW,UAAU,EAAE;AAAA,IAAA,CAC7G;AACH,mBAAe,QAAQ,CAAK,MAAA;AAGtB,UAAA,EAAE,WAAW,kBAAkB;AAC/B,UAAA,WAAW,iBAAiB,UAAU,qBAAqB;AAAA,MAAA,WACpD,EAAE,WAAW,aAAa;AACjC,UAAA,WAAW,YAAY,qBAAqB;AAAA,MAAA;AAAA,IAChD,CACD;AAGK,UAAA,sBAAoB,oBAAe,KAAK,CAAA,MAAK,EAAE,WAAW,OAAO,MAA7C,mBAAgD,eAAc;AACxF,kBAAc,iBAAiB;AAE/B,WAAO,MAAY;AACjB,qBAAe,QAAQ,CAAK,MAAA;AACtB,YAAA,EAAE,WAAW,qBAAqB;AAClC,YAAA,WAAW,oBAAoB,UAAU,qBAAqB;AAAA,QAAA,WACvD,EAAE,WAAW,gBAAgB;AACpC,YAAA,WAAW,eAAe,qBAAqB;AAAA,QAAA;AAAA,MACnD,CACD;AAAA,IACH;AAAA,EACF,GAAG,EAAE;AAEE,SAAA;AACT;"}

package/hooks/useDelayedState.js

@@ -1,15 +1,23 @@
-import { useState as n, useRef as l, useEffect as m } from "react";
-const d = (u, c) => {
-  const [o, r] = n(u), e = l(), s = (t) => {
-    clearTimeout(e.current), e.current = window.setTimeout(() => r(t), c);
-  }, a = (t) => {
-    clearTimeout(e.current), r(t);
+import { useState, useRef, useEffect } from "react";
+const useDelayedState = (initialState, delay) => {
+  const [value, setValue] = useState(initialState);
+  const timer = useRef();
+  const setDelayedValue = (newState) => {
+    clearTimeout(timer.current);
+    timer.current = window.setTimeout(() => setValue(newState), delay);
   };
-  return m(() => () => {
-    clearTimeout(e.current);
-  }, []), [o, s, a];
+  const setImmediateValue = (newState) => {
+    clearTimeout(timer.current);
+    setValue(newState);
+  };
+  useEffect(() => {
+    return () => {
+      clearTimeout(timer.current);
+    };
+  }, []);
+  return [value, setDelayedValue, setImmediateValue];
 };
 export {
-  d as useDelayedState
+  useDelayedState
 };
 //# sourceMappingURL=useDelayedState.js.map

package/hooks/useDelayedState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDelayedState.js","sources":["../../src/hooks/useDelayedState.ts"],"sourcesContent":["import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react';\n\n/**\n * useState, men med mulighet for å oppdatere state etter X millisekunder\n * @param initialState Verdi state skal ha ved første render\n * @param delay Vent X millisekunder før state oppdateres\n * @returns state, callback for å oppdatere state etter delay, og callback for å oppdatere state umiddelbart\n */\nexport const useDelayedState = <S>(initialState: S, delay: number): [S, Dispatch<SetStateAction<S>>, Dispatch<SetStateAction<S>>] => {\n  const [value, setValue] = useState(initialState);\n  const timer = useRef<number>();\n\n  const setDelayedValue = (newState: SetStateAction<S>): void => {\n    clearTimeout(timer.current);\n    timer.current = window.setTimeout(() => setValue(newState), delay);\n  };\n\n  const setImmediateValue = (newState: SetStateAction<S>): void => {\n    clearTimeout(timer.current);\n    setValue(newState);\n  };\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(timer.current);\n    };\n  }, []);\n\n  return [value, setDelayedValue, setImmediateValue];\n};\n"],"names":["useDelayedState","initialState","delay","value","setValue","useState","timer","useRef","setDelayedValue","newState","setImmediateValue","useEffect"],"mappings":";AAQa,MAAAA,IAAkB,CAAIC,GAAiBC,MAAiF;AACnI,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAASJ,CAAY,GACzCK,IAAQC,KAERC,IAAkB,CAACC,MAAsC;AAC7D,iBAAaH,EAAM,OAAO,GAC1BA,EAAM,UAAU,OAAO,WAAW,MAAMF,EAASK,CAAQ,GAAGP,CAAK;AAAA,EAAA,GAG7DQ,IAAoB,CAACD,MAAsC;AAC/D,iBAAaH,EAAM,OAAO,GAC1BF,EAASK,CAAQ;AAAA,EAAA;AAGnB,SAAAE,EAAU,MACD,MAAM;AACX,iBAAaL,EAAM,OAAO;AAAA,EAAA,GAE3B,CAAE,CAAA,GAEE,CAACH,GAAOK,GAAiBE,CAAiB;AACnD;"}
+{"version":3,"file":"useDelayedState.js","sources":["../../src/hooks/useDelayedState.ts"],"sourcesContent":["import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react';\n\n/**\n * useState, men med mulighet for å oppdatere state etter X millisekunder\n * @param initialState Verdi state skal ha ved første render\n * @param delay Vent X millisekunder før state oppdateres\n * @returns state, callback for å oppdatere state etter delay, og callback for å oppdatere state umiddelbart\n */\nexport const useDelayedState = <S>(initialState: S, delay: number): [S, Dispatch<SetStateAction<S>>, Dispatch<SetStateAction<S>>] => {\n  const [value, setValue] = useState(initialState);\n  const timer = useRef<number>();\n\n  const setDelayedValue = (newState: SetStateAction<S>): void => {\n    clearTimeout(timer.current);\n    timer.current = window.setTimeout(() => setValue(newState), delay);\n  };\n\n  const setImmediateValue = (newState: SetStateAction<S>): void => {\n    clearTimeout(timer.current);\n    setValue(newState);\n  };\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(timer.current);\n    };\n  }, []);\n\n  return [value, setDelayedValue, setImmediateValue];\n};\n"],"names":[],"mappings":";AAQa,MAAA,kBAAkB,CAAI,cAAiB,UAAiF;AACnI,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,YAAY;AAC/C,QAAM,QAAQ,OAAe;AAEvB,QAAA,kBAAkB,CAAC,aAAsC;AAC7D,iBAAa,MAAM,OAAO;AAC1B,UAAM,UAAU,OAAO,WAAW,MAAM,SAAS,QAAQ,GAAG,KAAK;AAAA,EACnE;AAEM,QAAA,oBAAoB,CAAC,aAAsC;AAC/D,iBAAa,MAAM,OAAO;AAC1B,aAAS,QAAQ;AAAA,EACnB;AAEA,YAAU,MAAM;AACd,WAAO,MAAM;AACX,mBAAa,MAAM,OAAO;AAAA,IAC5B;AAAA,EACF,GAAG,EAAE;AAEE,SAAA,CAAC,OAAO,iBAAiB,iBAAiB;AACnD;"}

package/hooks/useElementList.js

@@ -1,18 +1,24 @@
-import { useState as l, useEffect as a } from "react";
-const b = (t, e, u) => {
-  const [o, c] = l();
-  return a(() => {
-    const n = () => {
-      var r;
-      const i = (r = t.current) == null ? void 0 : r.querySelectorAll(e);
-      c(i);
-    }, s = new MutationObserver(n);
-    return t != null && t.current && s.observe(t.current, { subtree: !0, childList: !0, attributes: !0, ...u }), n(), () => {
-      s.disconnect();
+import { useState, useEffect } from "react";
+const useElementList = (ref, selectors, options) => {
+  const [elementList, setElementList] = useState();
+  useEffect(() => {
+    const handleMutationChange = () => {
+      var _a;
+      const elements = (_a = ref.current) == null ? void 0 : _a.querySelectorAll(selectors);
+      setElementList(elements);
     };
-  }, [t, e]), o;
+    const mutationObserver = new MutationObserver(handleMutationChange);
+    if (ref == null ? void 0 : ref.current) {
+      mutationObserver.observe(ref.current, { subtree: true, childList: true, attributes: true, ...options });
+    }
+    handleMutationChange();
+    return () => {
+      mutationObserver.disconnect();
+    };
+  }, [ref, selectors]);
+  return elementList;
 };
 export {
-  b as useElementList
+  useElementList
 };
 //# sourceMappingURL=useElementList.js.map

package/hooks/useElementList.js.map

@@ -1 +1 @@
-{"version":3,"file":"useElementList.js","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 = () => {\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"],"names":["useElementList","ref","selectors","options","elementList","setElementList","useState","useEffect","handleMutationChange","elements","_a","mutationObserver"],"mappings":";AASO,MAAMA,IAAiB,CAC5BC,GACAC,GACAC,MACwC;AACxC,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAkC;AAExE,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAuB,MAAM;;AACjC,YAAMC,KAAWC,IAAAT,EAAI,YAAJ,gBAAAS,EAAa,iBAA8BR;AAC5D,MAAAG,EAAeI,CAAQ;AAAA,IAAA,GAGnBE,IAAmB,IAAI,iBAAiBH,CAAoB;AAClE,WAAIP,KAAA,QAAAA,EAAK,WACPU,EAAiB,QAAQV,EAAI,SAAS,EAAE,SAAS,IAAM,WAAW,IAAM,YAAY,IAAM,GAAGE,EAAS,CAAA,GAGnFK,KAEd,MAAY;AACjB,MAAAG,EAAiB,WAAW;AAAA,IAAA;AAAA,EAC9B,GACC,CAACV,GAAKC,CAAS,CAAC,GAEZE;AACT;"}
+{"version":3,"file":"useElementList.js","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 = () => {\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"],"names":[],"mappings":";AASO,MAAM,iBAAiB,CAC5B,KACA,WACA,YACwC;AACxC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAkC;AAExE,YAAU,MAAM;AACd,UAAM,uBAAuB,MAAM;;AACjC,YAAM,YAAW,SAAI,YAAJ,mBAAa,iBAA8B;AAC5D,qBAAe,QAAQ;AAAA,IACzB;AAEM,UAAA,mBAAmB,IAAI,iBAAiB,oBAAoB;AAClE,QAAI,2BAAK,SAAS;AAChB,uBAAiB,QAAQ,IAAI,SAAS,EAAE,SAAS,MAAM,WAAW,MAAM,YAAY,MAAM,GAAG,QAAA,CAAS;AAAA,IAAA;AAGnF,yBAAA;AAErB,WAAO,MAAY;AACjB,uBAAiB,WAAW;AAAA,IAC9B;AAAA,EAAA,GACC,CAAC,KAAK,SAAS,CAAC;AAEZ,SAAA;AACT;"}

package/hooks/useEventListenerState.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
+import { default as React } from 'react';
 export declare const useEventListenerState: <T>(initial?: T) => [valueRef: React.MutableRefObject<T | undefined>, setValue: (x: T) => void];

package/hooks/useEventListenerState.js

@@ -1,11 +1,14 @@
-import s from "react";
-const c = (u) => {
-  const [a, n] = s.useState(u), e = s.useRef(a);
-  return [e, (t) => {
-    e.current = t, n(t);
-  }];
+import React from "react";
+const useEventListenerState = (initial) => {
+  const [value, _setValue] = React.useState(initial);
+  const valueRef = React.useRef(value);
+  const setValue = (x) => {
+    valueRef.current = x;
+    _setValue(x);
+  };
+  return [valueRef, setValue];
 };
 export {
-  c as useEventListenerState
+  useEventListenerState
 };
 //# sourceMappingURL=useEventListenerState.js.map

package/hooks/useEventListenerState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEventListenerState.js","sources":["../../src/hooks/useEventListenerState.ts"],"sourcesContent":["import React from 'react';\n\nexport const useEventListenerState = <T>(initial?: T): [valueRef: React.MutableRefObject<T | undefined>, setValue: (x: T) => void] => {\n  const [value, _setValue] = React.useState<T | undefined>(initial);\n\n  const valueRef = React.useRef(value);\n\n  const setValue = (x: T) => {\n    valueRef.current = x;\n    _setValue(x);\n  };\n\n  return [valueRef, setValue];\n};\n"],"names":["useEventListenerState","initial","value","_setValue","React","valueRef","x"],"mappings":";AAEa,MAAAA,IAAwB,CAAIC,MAA6F;AACpI,QAAM,CAACC,GAAOC,CAAS,IAAIC,EAAM,SAAwBH,CAAO,GAE1DI,IAAWD,EAAM,OAAOF,CAAK;AAO5B,SAAA,CAACG,GALS,CAACC,MAAS;AACzB,IAAAD,EAAS,UAAUC,GACnBH,EAAUG,CAAC;AAAA,EAAA,CAGa;AAC5B;"}
+{"version":3,"file":"useEventListenerState.js","sources":["../../src/hooks/useEventListenerState.ts"],"sourcesContent":["import React from 'react';\n\nexport const useEventListenerState = <T>(initial?: T): [valueRef: React.MutableRefObject<T | undefined>, setValue: (x: T) => void] => {\n  const [value, _setValue] = React.useState<T | undefined>(initial);\n\n  const valueRef = React.useRef(value);\n\n  const setValue = (x: T) => {\n    valueRef.current = x;\n    _setValue(x);\n  };\n\n  return [valueRef, setValue];\n};\n"],"names":[],"mappings":";AAEa,MAAA,wBAAwB,CAAI,YAA6F;AACpI,QAAM,CAAC,OAAO,SAAS,IAAI,MAAM,SAAwB,OAAO;AAE1D,QAAA,WAAW,MAAM,OAAO,KAAK;AAE7B,QAAA,WAAW,CAAC,MAAS;AACzB,aAAS,UAAU;AACnB,cAAU,CAAC;AAAA,EACb;AAEO,SAAA,CAAC,UAAU,QAAQ;AAC5B;"}

package/hooks/useExpand.js

@@ -1,14 +1,21 @@
-import { useState as u, useEffect as o } from "react";
-import { usePrevious as f } from "./usePrevious.js";
-const p = (t, r) => {
-  const [s, e] = u(t), i = f(s);
-  return o(() => {
-    t !== s && e(t);
-  }, [t]), o(() => {
-    r && s !== !!i && r(s);
-  }, [s, r]), [s, e];
+import { useState, useEffect } from "react";
+import { usePrevious } from "./usePrevious.js";
+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 {
-  p as useExpand
+  useExpand
 };
 //# sourceMappingURL=useExpand.js.map

package/hooks/useExpand.js.map

@@ -1 +1 @@
-{"version":3,"file":"useExpand.js","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"],"names":["useExpand","expanded","onExpand","isExpanded","setIsExpanded","useState","previousIsExpanded","usePrevious","useEffect"],"mappings":";;AAIa,MAAAA,IAAY,CAACC,GAAmBC,MAA2F;AACtI,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASJ,CAAQ,GAC/CK,IAAqBC,EAAYJ,CAAU;AAEjD,SAAAK,EAAU,MAAM;AACd,IAAIP,MAAaE,KACfC,EAAcH,CAAQ;AAAA,EACxB,GACC,CAACA,CAAQ,CAAC,GAEbO,EAAU,MAAM;AACd,IAAIN,KAAYC,MAAe,CAAC,CAACG,KAC/BJ,EAASC,CAAU;AAAA,EACrB,GACC,CAACA,GAAYD,CAAQ,CAAC,GAElB,CAACC,GAAYC,CAAa;AACnC;"}
+{"version":3,"file":"useExpand.js","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"],"names":[],"mappings":";;AAIa,MAAA,YAAY,CAAC,UAAmB,aAA2F;AACtI,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,QAAQ;AAC/C,QAAA,qBAAqB,YAAY,UAAU;AAEjD,YAAU,MAAM;AACd,QAAI,aAAa,YAAY;AAC3B,oBAAc,QAAQ;AAAA,IAAA;AAAA,EACxB,GACC,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACd,QAAI,YAAY,eAAe,CAAC,CAAC,oBAAoB;AACnD,eAAS,UAAU;AAAA,IAAA;AAAA,EACrB,GACC,CAAC,YAAY,QAAQ,CAAC;AAElB,SAAA,CAAC,YAAY,aAAa;AACnC;"}

package/hooks/useFocusToggle.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 /**
  * Skru av og på fokus på fokuserbare elementer slik at de kan være en del av DOMen, men samtidig
  * ikke kunne fokuseres/tabbes til med tastaturet.

package/hooks/useFocusToggle.js

@@ -1,19 +1,31 @@
-import { useEffect as T } from "react";
-import { useElementList as s } from "./useElementList.js";
-import { FOCUSABLE_SELECTORS as a } from "./useFocusableElements.js";
-const f = (i, o) => {
-  const r = s(i, a, { attributes: !1 });
-  T(() => {
-    const e = "tabindex", A = "data-tabindex";
-    o ? r == null || r.forEach((t) => {
-      const E = t.getAttribute(A);
-      E ? t.setAttribute(e, E) : t.removeAttribute(e);
-    }) : r == null || r.forEach((t) => {
-      t.hasAttribute(e) && t.setAttribute(A, `${t.tabIndex}`), t.tabIndex = -1;
-    });
-  }, [i, o, r]);
+import { useEffect } from "react";
+import { useElementList } from "./useElementList.js";
+import { FOCUSABLE_SELECTORS } from "./useFocusableElements.js";
+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 == null ? void 0 : 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 == null ? void 0 : focusableElementList.forEach((el) => {
+        if (el.hasAttribute(TABINDEX_ATTRIBUTE_NAME)) {
+          el.setAttribute(PREVIOUS_TABINDEX_ATTRIBUTE_NAME, `${el.tabIndex}`);
+        }
+        el.tabIndex = -1;
+      });
+    }
+  }, [ref, allowFocus, focusableElementList]);
 };
 export {
-  f as useFocusToggle
+  useFocusToggle
 };
 //# sourceMappingURL=useFocusToggle.js.map

package/hooks/useFocusToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFocusToggle.js","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"],"names":["useFocusToggle","ref","allowFocus","focusableElementList","useElementList","FOCUSABLE_SELECTORS","useEffect","TABINDEX_ATTRIBUTE_NAME","PREVIOUS_TABINDEX_ATTRIBUTE_NAME","el","prevTabIndex"],"mappings":";;;AAYa,MAAAA,IAAiB,CAACC,GAAmCC,MAA+B;AAE/F,QAAMC,IAAuBC,EAAeH,GAAKI,GAAqB,EAAE,YAAY,IAAO;AAE3F,EAAAC,EAAU,MAAM;AACd,UAAMC,IAA0B,YAC1BC,IAAmC;AACzC,IAAIN,IACFC,KAAA,QAAAA,EAAsB,QAAQ,CAAMM,MAAA;AAG5B,YAAAC,IAAeD,EAAG,aAAaD,CAAgC;AACrE,MAAIE,IACCD,EAAA,aAAaF,GAAyBG,CAAY,IAErDD,EAAG,gBAAgBF,CAAuB;AAAA,IAC5C,KAGFJ,KAAA,QAAAA,EAAsB,QAAQ,CAAMM,MAAA;AAG9B,MAAAA,EAAG,aAAaF,CAAuB,KACzCE,EAAG,aAAaD,GAAkC,GAAGC,EAAG,QAAQ,EAAE,GAEpEA,EAAG,WAAW;AAAA,IAAA;AAAA,EAGjB,GAAA,CAACR,GAAKC,GAAYC,CAAoB,CAAC;AAC5C;"}
+{"version":3,"file":"useFocusToggle.js","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"],"names":[],"mappings":";;;AAYa,MAAA,iBAAiB,CAAC,KAAmC,eAA+B;AAE/F,QAAM,uBAAuB,eAAe,KAAK,qBAAqB,EAAE,YAAY,OAAO;AAE3F,YAAU,MAAM;AACd,UAAM,0BAA0B;AAChC,UAAM,mCAAmC;AACzC,QAAI,YAAY;AACd,mEAAsB,QAAQ,CAAM,OAAA;AAG5B,cAAA,eAAe,GAAG,aAAa,gCAAgC;AACrE,YAAI,cAAc;AACb,aAAA,aAAa,yBAAyB,YAAY;AAAA,QAAA,OAChD;AACL,aAAG,gBAAgB,uBAAuB;AAAA,QAAA;AAAA,MAC5C;AAAA,IACD,OACI;AACL,mEAAsB,QAAQ,CAAM,OAAA;AAG9B,YAAA,GAAG,aAAa,uBAAuB,GAAG;AAC5C,aAAG,aAAa,kCAAkC,GAAG,GAAG,QAAQ,EAAE;AAAA,QAAA;AAEpE,WAAG,WAAW;AAAA,MAAA;AAAA,IACf;AAAA,EAEF,GAAA,CAAC,KAAK,YAAY,oBAAoB,CAAC;AAC5C;"}

package/hooks/useFocusTrap.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 /**
  * Lås fokus til et bestemt element. Bruker vil bare kunne tabbe mellom fokuserbare elementer innenfor elementet.
  * @param ref Alle barn av dette elementet vil være fokuserbare, elementer utenfor vil ikke det