npm - @fremtind/jokul - Versions diffs - 0.64.1 → 0.66.0 - Mend

@fremtind/jokul 0.64.1 → 0.66.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (740) hide show

package/build/es/components/expander/ExpandablePanelContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandablePanelContent.js","sources":["../../../../src/components/expander/ExpandablePanelContent.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useContext } from \"react\";\nimport { useAnimatedHeightBetween } from \"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport { ExpandablePanelContentComponent~~, ExpandableContext~~ } from \"./types.js\";\n\nexport const ExpandablePanelContent: ExpandablePanelContentComponent = ({\n className,\n children,\n ...rest\n}) => {\n const { open, onTransitionStart, onTransitionEnd } =\n useContext<ExpandableContext>(ExpanderContext);\n\n const [animationRef] = useAnimatedHeightBetween<HTMLDivElement>(open, {\n timing: \"snappy\",\n onTransitionStart,\n onTransitionEnd,\n });\n\n return (\n <div\n ref={animationRef}\n className={clsx(\"jkl-expandable__content\", className)}\n {...rest}\n data-expanded={open}\n {...(!open ? { inert: \"true\" } : {})}\n >\n <div className=\"jkl-expandable__content-wrapper\">{children}</div>\n </div>\n );\n};\n"],"names":["ExpandablePanelContent","className","children","rest","open","onTransitionStart","onTransitionEnd","useContext","ExpanderContext","animationRef","useAnimatedHeightBetween","timing","jsx","ref","clsx","inert"],"mappings":"~~6QAMO~~,MAAMA,EAA0D,EACnEC,UAAAA,EACAC,SAAAA,KACGC,MAEH,MAAQC,KAAAA,EAAMC,kBAAAA,EAAmBC,gBAAAA,GAC7BC,EAA8BC,IAE3BC,GAAgBC,EAAyCN,EAAM,CAClEO,OAAQ,SACRN,kBAAAA,EACAC,gBAAAA,IAIA,OAAAM,EAAC,MAAA,CACGC,IAAKJ,EACLR,UAAWa,EAAK,0BAA2Bb,MACvCE,EACJ,gBAAeC,KACTA,EAA2B,CAAC,EAArB,CAAEW,MAAO,QAEtBb,SAACU,EAAA,MAAA,CAAIX,UAAU,kCAAmCC,SAAAA,KAAS"}
1	+ {"version":3,"file":"ExpandablePanelContent.js","sources":["../../../../src/components/expander/ExpandablePanelContent.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useContext } from \"react\";\nimport { useAnimatedHeightBetween } from \"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n ExpandableContext,\n ExpandablePanelContentComponent,\n} from \"./types.js\";\n\nexport const ExpandablePanelContent: ExpandablePanelContentComponent = ({\n className,\n children,\n ...rest\n}) => {\n const { open, onTransitionStart, onTransitionEnd } =\n useContext<ExpandableContext>(ExpanderContext);\n\n const [animationRef] = useAnimatedHeightBetween<HTMLDivElement>(open, {\n timing: \"snappy\",\n onTransitionStart,\n onTransitionEnd,\n });\n\n return (\n <div\n ref={animationRef}\n className={clsx(\"jkl-expandable__content\", className)}\n {...rest}\n data-expanded={open}\n {...(!open ? { inert: \"true\" } : {})}\n >\n <div className=\"jkl-expandable__content-wrapper\">{children}</div>\n </div>\n );\n};\n"],"names":["ExpandablePanelContent","className","children","rest","open","onTransitionStart","onTransitionEnd","useContext","ExpanderContext","animationRef","useAnimatedHeightBetween","timing","jsx","ref","clsx","inert"],"mappings":"6QASO,MAAMA,EAA0D,EACnEC,UAAAA,EACAC,SAAAA,KACGC,MAEH,MAAQC,KAAAA,EAAMC,kBAAAA,EAAmBC,gBAAAA,GAC7BC,EAA8BC,IAE3BC,GAAgBC,EAAyCN,EAAM,CAClEO,OAAQ,SACRN,kBAAAA,EACAC,gBAAAA,IAIA,OAAAM,EAAC,MAAA,CACGC,IAAKJ,EACLR,UAAWa,EAAK,0BAA2Bb,MACvCE,EACJ,gBAAeC,KACTA,EAA2B,CAAC,EAArB,CAAEW,MAAO,QAEtBb,SAACU,EAAA,MAAA,CAAIX,UAAU,kCAAmCC,SAAAA,KAAS"}

package/build/es/components/expander/Expander.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as n}from"react/jsx-runtime";import{c}from"../../../clsx-BeLtu-UY.js";import i,{useContext as s,useRef as r,useImperativeHandle as e,useEffect as t}from"react";import{ChevronDownIcon as m}from"../icon/icons/ChevronDownIcon.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import{ChevronUpIcon as p}from"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{ExpanderContext as a}from"./context.js";const j=i.forwardRef((function(i,j){const{children:I,as:l="summary",open:u,icon:d,className:h,onClick:f,expandDirection:C,...x}=i,v=l,{open:w,onToggle:A,setExpanderHeight:g}=s(a),k=r();e(j,(()=>k.current),[k]);const b=u||w,D="up"===C?p:m;return t((()=>{const o=new ResizeObserver((function(){var o;g((null==(o=k.current)?void 0:o.offsetHeight)||64)}));return k.current?(o.observe(k.current),()=>o.disconnect()):()=>{}}),[g]),o(v,{ref:k,className:c("jkl-expander",{"jkl-expander--open":b},h),..."button"===l?{type:x.type||"button"}:{},onClick:o=>{o.preventDefault(),A(),null==f||f(o)},...x,children:[d||null,n("span",{className:"jkl-expander__label",children:I}),n(D,{className:"jkl-expander__chevron"})]})}));export{j as Expander};
+import{jsxs as o,jsx as n}from"react/jsx-runtime";import{c}from"../../../clsx-BeLtu-UY.js";import i,{useContext as s,useRef as r,useImperativeHandle as e,useEffect as t}from"react";import{ChevronDownIcon as m}from"../icon/icons/ChevronDownIcon.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import{ChevronUpIcon as p}from"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{ExpanderContext as a}from"./context.js";const j=i.forwardRef((function(i,j){const{children:I,as:l="summary",open:u,icon:d,className:h,onClick:f,expandDirection:C,...x}=i,v=l,{open:w,onToggle:A,setExpanderHeight:g}=s(a),k=r();e(j,(()=>k.current),[]);const b=u||w,D="up"===C?p:m;return t((()=>{const o=new ResizeObserver((()=>{var o;g((null==(o=k.current)?void 0:o.offsetHeight)||64)}));return k.current?(o.observe(k.current),()=>o.disconnect()):()=>{}}),[g]),o(v,{ref:k,className:c("jkl-expander",{"jkl-expander--open":b},h),..."button"===l?{type:x.type||"button"}:{},onClick:o=>{o.preventDefault(),A(),null==f||f(o)},...x,children:[d||null,n("span",{className:"jkl-expander__label",children:I}),n(D,{className:"jkl-expander__chevron"})]})}));export{j as Expander};
 //# sourceMappingURL=Expander.js.map

package/build/es/components/expander/Expander.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Expander.js","sources":["../../../../src/components/expander/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronDownIcon } from \"../icon/icons/ChevronDownIcon.js\";\nimport { ChevronUpIcon } from \"../icon/index.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport {\n ExpandableContext,\n ExpanderComponent,\n ExpanderProps,\n} from \"./types.js\";\n\nexport const Expander = React.forwardRef(function Expander<\n ElementType extends React.ElementType = \"summary\",\n>(props: ExpanderProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n children,\n as = \"summary\",\n open: controlledOpen,\n icon,\n className,\n onClick,\n expandDirection,\n ...rest\n } = props;\n const El = as;\n\n const {\n open: contextOpen,\n onToggle,\n setExpanderHeight,\n } = useContext<ExpandableContext>(ExpanderContext);\n\n const internalRef = useRef<HTMLElement>();\n useImperativeHandle(ref, () => internalRef.current, [~~internalRef~~]);\n\n const isOpen = controlledOpen \|\| contextOpen;\n\n const Chevron = expandDirection === \"up\" ? ChevronUpIcon : ChevronDownIcon;\n\n useEffect(() => {\n const observer = new ResizeObserver(~~function~~ () {\n // Default to 64 if the height can not be read because that is\n // the height of the default summary element. In a custom component\n // this means that the focus ring might be slightly misaligned but\n // in most cases we will be able to read the ref correctly.\n setExpanderHeight(internalRef.current?.offsetHeight \|\| 64);\n });\n if (internalRef.current) {\n observer.observe(internalRef.current);\n return () => observer.disconnect();\n }\n return () => {};\n }, [setExpanderHeight]);\n\n return (\n <El\n ref={internalRef}\n className={clsx(\n \"jkl-expander\",\n {\n \"jkl-expander--open\": isOpen,\n },\n className,\n )}\n // If the consumer uses the Expander as a button but does not\n // supply a type, then we set type to \"button\"\n {...(as === \"button\" ? { type: rest.type \|\| \"button\" } : {})}\n onClick={(e) => {\n e.preventDefault();\n onToggle();\n onClick?.(e);\n }}\n {...rest}\n >\n {icon \|\| null}\n <span className=\"jkl-expander__label\">{children}</span>\n <Chevron className=\"jkl-expander__chevron\" />\n </El>\n );\n}) as ExpanderComponent;\n"],"names":["Expander","React","forwardRef","props","ref","children","as","open","controlledOpen","icon","className","onClick","expandDirection","rest","El","contextOpen","onToggle","setExpanderHeight","useContext","ExpanderContext","internalRef","useRef","useImperativeHandle","current","isOpen","Chevron","ChevronUpIcon","ChevronDownIcon","useEffect","observer","ResizeObserver","_a","offsetHeight","observe","disconnect","jsxs","clsx","type","e","preventDefault","jsx"],"mappings":"goDAiBO,MAAMA,EAAWC,EAAMC,YAAW,SAEvCC,EAAmCC,GAC3B,MACFC,SAAAA,EACAC,GAAAA,EAAK,UACLC,KAAMC,EACNC,KAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,KACGC,GACHV,EACEW,EAAKR,GAGPC,KAAMQ,EACNC,SAAAA,EACAC,kBAAAA,GACAC,EAA8BC,GAE5BC,EAAcC,IACpBC,EAAoBlB,GAAK,IAAMgB,EAAYG,SAAS,~~CAACH~~,~~IAErD~~,~~MAAMI,~~EAAShB,GAAkBO,EAE3BU,EAA8B,OAApBb,EAA2Bc,EAAgBC,EAE3D,OAAAC,GAAU,KACAC,MAAAA,EAAW,IAAIC,gBAAe,~~iBAKdb~~,GAAA,OAAAc,EAAAX,EAAYG,cAAZQ,EAAAA,EAAqBC,eAAgB,GAAE,IAEzDZ,OAAAA,EAAYG,SACHM,EAAAI,QAAQb,EAAYG,SACtB,IAAMM,EAASK,cAEnB,MAAM,GACd,CAACjB,IAGAkB,EAACrB,EAAA,CACGV,IAAKgB,EACLV,UAAW0B,EACP,eACA,CACI,qBAAsBZ,GAE1Bd,MAIQ,WAAPJ,EAAkB,CAAE+B,KAAMxB,EAAKwB,MAAQ,UAAa,CAAC,EAC1D1B,QAAU2B,IACNA,EAAEC,iBACOvB,IACT,MAAAL,GAAAA,EAAU2B,EAAAA,KAEVzB,EAEHR,SAAA,CAAQI,GAAA,KACR+B,EAAA,OAAA,CAAK9B,UAAU,sBAAuBL,SAAAA,IACvCmC,EAACf,EAAQ,CAAAf,UAAU,4BAG/B"}
1	+ {"version":3,"file":"Expander.js","sources":["../../../../src/components/expander/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronDownIcon } from \"../icon/icons/ChevronDownIcon.js\";\nimport { ChevronUpIcon } from \"../icon/index.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n ExpandableContext,\n ExpanderComponent,\n ExpanderProps,\n} from \"./types.js\";\n\nexport const Expander = React.forwardRef(function Expander<\n ElementType extends React.ElementType = \"summary\",\n>(props: ExpanderProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n children,\n as = \"summary\",\n open: controlledOpen,\n icon,\n className,\n onClick,\n expandDirection,\n ...rest\n } = props;\n const El = as;\n\n const {\n open: contextOpen,\n onToggle,\n setExpanderHeight,\n } = useContext<ExpandableContext>(ExpanderContext);\n\n const internalRef = useRef<HTMLElement>();\n useImperativeHandle(ref, () => internalRef.current, []);\n\n const isOpen = controlledOpen \|\| contextOpen;\n\n const Chevron = expandDirection === \"up\" ? ChevronUpIcon : ChevronDownIcon;\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n // Default to 64 if the height can not be read because that is\n // the height of the default summary element. In a custom component\n // this means that the focus ring might be slightly misaligned but\n // in most cases we will be able to read the ref correctly.\n setExpanderHeight(internalRef.current?.offsetHeight \|\| 64);\n });\n if (internalRef.current) {\n observer.observe(internalRef.current);\n return () => observer.disconnect();\n }\n return () => {};\n }, [setExpanderHeight]);\n\n return (\n <El\n ref={internalRef}\n className={clsx(\n \"jkl-expander\",\n {\n \"jkl-expander--open\": isOpen,\n },\n className,\n )}\n // If the consumer uses the Expander as a button but does not\n // supply a type, then we set type to \"button\"\n {...(as === \"button\" ? { type: rest.type \|\| \"button\" } : {})}\n onClick={(e) => {\n e.preventDefault();\n onToggle();\n onClick?.(e);\n }}\n {...rest}\n >\n {icon \|\| null}\n <span className=\"jkl-expander__label\">{children}</span>\n <Chevron className=\"jkl-expander__chevron\" />\n </El>\n );\n}) as ExpanderComponent;\n"],"names":["Expander","React","forwardRef","props","ref","children","as","open","controlledOpen","icon","className","onClick","expandDirection","rest","El","contextOpen","onToggle","setExpanderHeight","useContext","ExpanderContext","internalRef","useRef","useImperativeHandle","current","isOpen","Chevron","ChevronUpIcon","ChevronDownIcon","useEffect","observer","ResizeObserver","_a","offsetHeight","observe","disconnect","jsxs","clsx","type","e","preventDefault","jsx"],"mappings":"goDAiBO,MAAMA,EAAWC,EAAMC,YAAW,SAEvCC,EAAmCC,GAC3B,MACFC,SAAAA,EACAC,GAAAA,EAAK,UACLC,KAAMC,EACNC,KAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,KACGC,GACHV,EACEW,EAAKR,GAGPC,KAAMQ,EACNC,SAAAA,EACAC,kBAAAA,GACAC,EAA8BC,GAE5BC,EAAcC,IACpBC,EAAoBlB,GAAK,IAAMgB,EAAYG,SAAS,IAEpD,MAAMC,EAAShB,GAAkBO,EAE3BU,EAA8B,OAApBb,EAA2Bc,EAAgBC,EAE3D,OAAAC,GAAU,KACAC,MAAAA,EAAW,IAAIC,gBAAe,WAKdb,GAAA,OAAAc,EAAAX,EAAYG,cAAZQ,EAAAA,EAAqBC,eAAgB,GAAE,IAEzDZ,OAAAA,EAAYG,SACHM,EAAAI,QAAQb,EAAYG,SACtB,IAAMM,EAASK,cAEnB,MAAM,GACd,CAACjB,IAGAkB,EAACrB,EAAA,CACGV,IAAKgB,EACLV,UAAW0B,EACP,eACA,CACI,qBAAsBZ,GAE1Bd,MAIQ,WAAPJ,EAAkB,CAAE+B,KAAMxB,EAAKwB,MAAQ,UAAa,CAAC,EAC1D1B,QAAU2B,IACNA,EAAEC,iBACOvB,IACT,MAAAL,GAAAA,EAAU2B,EAAAA,KAEVzB,EAEHR,SAAA,CAAQI,GAAA,KACR+B,EAAA,OAAA,CAAK9B,UAAU,sBAAuBL,SAAAA,IACvCmC,EAACf,EAAQ,CAAAf,UAAU,4BAG/B"}

package/build/es/components/expander/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","sources":["../../../../src/components/expander/context.ts"],"sourcesContent":["import { createContext } from \"react\";\nimport { ExpandableContext } from \"./types.js\";\n\nexport const ExpanderContext = createContext<ExpandableContext>({\n open: false,\n onToggle: () => {},\n onTransitionStart: () => {},\n onTransitionEnd: () => {},\n setExpanderHeight: () => {},\n});\n"],"names":["ExpanderContext","createContext","open","onToggle","onTransitionStart","onTransitionEnd","setExpanderHeight"],"mappings":"sCAGO,MAAMA,EAAkBC,EAAiC,CAC5DC,MAAM,EACNC,SAAU,OACVC,kBAAmB,OACnBC,gBAAiB,OACjBC,kBAAmB"}
1	+ {"version":3,"file":"context.js","sources":["../../../../src/components/expander/context.ts"],"sourcesContent":["import { createContext } from \"react\";\nimport type { ExpandableContext } from \"./types.js\";\n\nexport const ExpanderContext = createContext<ExpandableContext>({\n open: false,\n onToggle: () => {},\n onTransitionStart: () => {},\n onTransitionEnd: () => {},\n setExpanderHeight: () => {},\n});\n"],"names":["ExpanderContext","createContext","open","onToggle","onTransitionStart","onTransitionEnd","setExpanderHeight"],"mappings":"sCAGO,MAAMA,EAAkBC,EAAiC,CAC5DC,MAAM,EACNC,SAAU,OACVC,kBAAmB,OACnBC,gBAAiB,OACjBC,kBAAmB"}

package/build/es/components/expander/deprecated/ExpandSection.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandSection.js","sources":["../../../../../src/components/expander/deprecated/ExpandSection.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport { Density } from \"../../../core/types.js\";\nimport { useAnimatedDetails } from \"../../../hooks/useAnimatedDetails/useAnimatedDetails.js\";\nimport { UseAnimatedHeightOptions } from \"../../../hooks/useAnimatedHeight/types.js\";\nimport { Expander, ExpanderProps } from \"./Expander.js\";\n\nexport interface ExpandSectionProps {\n /*\n Innholdet som skal kunne ekspanderes og skjules.\n * Om du ikke trenger at komponenten tar seg av visning og skjuling av\n * innholdet skal du bruke `ExpandButton` direkte. Det sparer deg for\n * å laste inn unødvendige avhengigheter.\n /\n children: ReactNode;\n title: string;\n className?: string;\n density?: Density;\n onClick?: (e: React.MouseEvent<HTMLElement>, isExpanded: boolean) => void;\n expandButtonProps?: Omit<\n ExpanderProps,\n \"id\" \| \"isExpanded\" \| \"onClick\" \| \"hideLabel\"\n >;\n useAnimatedHeightOptions?: UseAnimatedHeightOptions;\n /* Om du ønsker å styre komponenten utenfra /\n isExpanded?: boolean;\n}\n\n/\n @deprecated Denne komponenten bør ikke brukes lenger, og vil ikke bli oppdatert.\n * Bruk heller komponenten `Expandable`.\n */\nexport const ExpandSection = ({\n children,\n className,\n expandButtonProps,\n isExpanded = false,\n density,\n onClick,\n title,\n useAnimatedHeightOptions,\n ...rest\n}: ExpandSectionProps): JSX.Element => {\n const [expanded, setIsExpanded] = useState(isExpanded);\n\n useEffect(() => {\n setIsExpanded(isExpanded);\n }, [isExpanded]);\n\n const { detailsRef, summaryRef, contentRef, onSummaryClick } =\n useAnimatedDetails({\n onOpenChange: (open, e) => {\n setIsExpanded(open);\n if (onClick) {\n onClick(e, open);\n }\n },\n isExpanded,\n });\n\n return (\n <details\n data-testid={\"jkl-expand-section\"}\n className={clsx(\"jkl-expand-section\", className)}\n {...rest}\n ref={detailsRef}\n >\n <Expander\n as={\"summary\"}\n {...expandButtonProps}\n density={density}\n isExpanded={expanded}\n onClick={onSummaryClick}\n ref={summaryRef}\n >\n {title}\n </Expander>\n <div\n data-testid=\"jkl-expand-section__content-wrapper\"\n className=\"jkl-expand-section__content-wrapper\"\n ref={contentRef}\n >\n <div className=\"jkl-expand-section__content\">{children}</div>\n </div>\n </details>\n );\n};\n"],"names":["ExpandSection","children","className","expandButtonProps","isExpanded","density","onClick","title","useAnimatedHeightOptions","rest","expanded","setIsExpanded","useState","useEffect","detailsRef","summaryRef","contentRef","onSummaryClick","useAnimatedDetails","onOpenChange","open","e","jsxs","clsx","ref","jsx","Expander","as"],"mappings":"yRAgCO,MAAMA,EAAgB,EACzBC,SAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,WAAAA,GAAa,EACbC,QAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,yBAAAA,KACGC,MAEH,MAAOC,EAAUC,GAAiBC,EAASR,GAE3CS,GAAU,KACNF,EAAcP,EAAU,GACzB,CAACA,IAEE,MAAEU,WAAAA,EAAYC,WAAAA,EAAYC,WAAAA,EAAYC,eAAAA,GACxCC,EAAmB,CACfC,aAAc,CAACC,EAAMC,KACjBV,EAAcS,GACVd,GACAA,EAAQe,EAAGD,EAAI,EAGvBhB,WAAAA,IAIJ,OAAAkB,EAAC,UAAA,CACG,cAAa,qBACbpB,UAAWqB,EAAK,qBAAsBrB,MAClCO,EACJe,IAAKV,EAELb,SAAA,CAAAwB,EAACC,EAAA,CACGC,GAAI,aACAxB,EACJE,QAAAA,EACAD,WAAYM,EACZJ,QAASW,EACTO,IAAKT,EAEJd,SAAAM,IAELkB,EAAC,MAAA,CACG,cAAY,sCACZvB,UAAU,sCACVsB,IAAKR,EAELf,SAACwB,EAAA,MAAA,CAAIvB,UAAU,8BAA+BD,SAAAA,QAClD"}
1	+ {"version":3,"file":"ExpandSection.js","sources":["../../../../../src/components/expander/deprecated/ExpandSection.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ReactNode, useEffect, useState } from \"react\";\nimport type { Density } from \"../../../core/types.js\";\nimport { useAnimatedDetails } from \"../../../hooks/useAnimatedDetails/useAnimatedDetails.js\";\nimport type { UseAnimatedHeightOptions } from \"../../../hooks/useAnimatedHeight/types.js\";\nimport { Expander, type ExpanderProps } from \"./Expander.js\";\n\nexport interface ExpandSectionProps {\n /*\n Innholdet som skal kunne ekspanderes og skjules.\n * Om du ikke trenger at komponenten tar seg av visning og skjuling av\n * innholdet skal du bruke `ExpandButton` direkte. Det sparer deg for\n * å laste inn unødvendige avhengigheter.\n /\n children: ReactNode;\n title: string;\n className?: string;\n density?: Density;\n onClick?: (e: React.MouseEvent<HTMLElement>, isExpanded: boolean) => void;\n expandButtonProps?: Omit<\n ExpanderProps,\n \"id\" \| \"isExpanded\" \| \"onClick\" \| \"hideLabel\"\n >;\n useAnimatedHeightOptions?: UseAnimatedHeightOptions;\n /* Om du ønsker å styre komponenten utenfra /\n isExpanded?: boolean;\n}\n\n/\n @deprecated Denne komponenten bør ikke brukes lenger, og vil ikke bli oppdatert.\n * Bruk heller komponenten `Expandable`.\n */\nexport const ExpandSection = ({\n children,\n className,\n expandButtonProps,\n isExpanded = false,\n density,\n onClick,\n title,\n useAnimatedHeightOptions,\n ...rest\n}: ExpandSectionProps): JSX.Element => {\n const [expanded, setIsExpanded] = useState(isExpanded);\n\n useEffect(() => {\n setIsExpanded(isExpanded);\n }, [isExpanded]);\n\n const { detailsRef, summaryRef, contentRef, onSummaryClick } =\n useAnimatedDetails({\n onOpenChange: (open, e) => {\n setIsExpanded(open);\n if (onClick) {\n onClick(e, open);\n }\n },\n isExpanded,\n });\n\n return (\n <details\n data-testid={\"jkl-expand-section\"}\n className={clsx(\"jkl-expand-section\", className)}\n {...rest}\n ref={detailsRef}\n >\n <Expander\n as={\"summary\"}\n {...expandButtonProps}\n density={density}\n isExpanded={expanded}\n onClick={onSummaryClick}\n ref={summaryRef}\n >\n {title}\n </Expander>\n <div\n data-testid=\"jkl-expand-section__content-wrapper\"\n className=\"jkl-expand-section__content-wrapper\"\n ref={contentRef}\n >\n <div className=\"jkl-expand-section__content\">{children}</div>\n </div>\n </details>\n );\n};\n"],"names":["ExpandSection","children","className","expandButtonProps","isExpanded","density","onClick","title","useAnimatedHeightOptions","rest","expanded","setIsExpanded","useState","useEffect","detailsRef","summaryRef","contentRef","onSummaryClick","useAnimatedDetails","onOpenChange","open","e","jsxs","clsx","ref","jsx","Expander","as"],"mappings":"yRAgCO,MAAMA,EAAgB,EACzBC,SAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,WAAAA,GAAa,EACbC,QAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,yBAAAA,KACGC,MAEH,MAAOC,EAAUC,GAAiBC,EAASR,GAE3CS,GAAU,KACNF,EAAcP,EAAU,GACzB,CAACA,IAEE,MAAEU,WAAAA,EAAYC,WAAAA,EAAYC,WAAAA,EAAYC,eAAAA,GACxCC,EAAmB,CACfC,aAAc,CAACC,EAAMC,KACjBV,EAAcS,GACVd,GACAA,EAAQe,EAAGD,EAAI,EAGvBhB,WAAAA,IAIJ,OAAAkB,EAAC,UAAA,CACG,cAAa,qBACbpB,UAAWqB,EAAK,qBAAsBrB,MAClCO,EACJe,IAAKV,EAELb,SAAA,CAAAwB,EAACC,EAAA,CACGC,GAAI,aACAxB,EACJE,QAAAA,EACAD,WAAYM,EACZJ,QAASW,EACTO,IAAKT,EAEJd,SAAAM,IAELkB,EAAC,MAAA,CACG,cAAY,sCACZvB,UAAU,sCACVsB,IAAKR,EAELf,SAACwB,EAAA,MAAA,CAAIvB,UAAU,8BAA+BD,SAAAA,QAClD"}

package/build/es/components/expander/deprecated/Expander.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as a}from"react/jsx-runtime";import{c as r}from"../../../../clsx-BeLtu-UY.js";import n from"react";import{ArrowVerticalAnimated as d}from"../../icon/icons/animated/ArrowVerticalAnimated.js";import{ScreenReaderOnly as o}from"../../ScreenReaderOnly.js";const t=n.forwardRef((({as:t="button",className:s,children:i,density:l,expandDirection:c="down",isExpanded:p=!1,hideLabel:m=!1,...x},j)=>{const f=m?o:n.Fragment,w="down"===c?!p:p;return e(t,{"aria-expanded":p,"data-testid":"jkl-old-expander",type:"button"===t?"button":void 0,className:r("jkl-old-expander",s,{"jkl-old-expander--expanded":p,"jkl-old-expander--icon-only":!i}),...x,"data-density":l,ref:j,children:[i&&a(f,{children:a("span",{className:"jkl-old-expander__text",children:i})}),a(d,{className:"jkl-old-expander__arrow",pointingDown:w,bold:p})]})}));t.displayName="Expander";export{t as Expander};
+import{jsxs as e,jsx as a}from"react/jsx-runtime";import{c as r}from"../../../../clsx-BeLtu-UY.js";import n from"react";import{ScreenReaderOnly as d}from"../../ScreenReaderOnly.js";import{ArrowVerticalAnimated as o}from"../../icon/icons/animated/ArrowVerticalAnimated.js";const t=n.forwardRef((({as:t="button",className:s,children:i,density:l,expandDirection:c="down",isExpanded:p=!1,hideLabel:m=!1,...x},j)=>{const f=m?d:n.Fragment,w="down"===c?!p:p;return e(t,{"aria-expanded":p,"data-testid":"jkl-old-expander",type:"button"===t?"button":void 0,className:r("jkl-old-expander",s,{"jkl-old-expander--expanded":p,"jkl-old-expander--icon-only":!i}),...x,"data-density":l,ref:j,children:[i&&a(f,{children:a("span",{className:"jkl-old-expander__text",children:i})}),a(o,{className:"jkl-old-expander__arrow",pointingDown:w,bold:p})]})}));t.displayName="Expander";export{t as Expander};
 //# sourceMappingURL=Expander.js.map

package/build/es/components/expander/deprecated/Expander.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Expander.js","sources":["../../../../../src/components/expander/deprecated/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ForwardedRef } from \"react\";\nimport { Density, WithChildren } from \"../../../core/types.js\";\nimport { ~~ArrowVerticalAnimated~~ } from \"../../~~icon/icons/animated/ArrowVerticalAnimated~~.js\";\nimport { ~~ScreenReaderOnly~~ } from \"../../~~ScreenReaderOnly~~.js\";\n\nexport interface ExpanderProps extends WithChildren {\n as?: \"summary\" \| \"button\";\n /** Må settes dersom du ikke bruker CoreToggle. Verdien skal være IDen til innholdet du ekspanderer. /\n \"aria-controls\"?: string;\n /* Må settes dersom du ikke bruker CoreToggle. IDen her skal brukes som verdien til aria-labelledby på innholdet du ekspanderer. /\n id?: string;\n className?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n /\n Styrer retningen til pila, som animeres ved endring. Styrer også aria-expanded.\n * @default false\n /\n isExpanded?: boolean;\n /* @default \"down\" /\n expandDirection?: \"up\" \| \"down\";\n density?: Density;\n /\n Skjul knappeteksten visuelt.\n \n @default false\n */\n hideLabel?: boolean;\n}\n\nexport const Expander = React.forwardRef(\n (\n {\n as = \"button\",\n className,\n children,\n density,\n expandDirection = \"down\",\n isExpanded = false,\n hideLabel = false,\n ...rest\n }: ExpanderProps,\n ref: ForwardedRef<HTMLButtonElement>,\n ): JSX.Element => {\n const ContentWrapper = hideLabel ? ScreenReaderOnly : React.Fragment;\n const pointingDown =\n expandDirection === \"down\" ? !isExpanded : isExpanded;\n\n const El = as;\n const type = El === \"button\" ? \"button\" : undefined;\n\n return (\n <El\n aria-expanded={isExpanded}\n data-testid=\"jkl-old-expander\"\n type={type}\n className={clsx(\"jkl-old-expander\", className, {\n \"jkl-old-expander--expanded\": isExpanded,\n \"jkl-old-expander--icon-only\": !children,\n })}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children && (\n <ContentWrapper>\n <span className=\"jkl-old-expander__text\">\n {children}\n </span>\n </ContentWrapper>\n )}\n <ArrowVerticalAnimated\n className=\"jkl-old-expander__arrow\"\n pointingDown={pointingDown}\n bold={isExpanded}\n />\n </El>\n );\n },\n);\n\nExpander.displayName = \"Expander\";\n"],"names":["Expander","React","forwardRef","as","className","children","density","expandDirection","isExpanded","hideLabel","rest","ref","ContentWrapper","ScreenReaderOnly","Fragment","pointingDown","jsxs","type","clsx","jsx","ArrowVerticalAnimated","bold","displayName"],"mappings":"gRA+BO,MAAMA,EAAWC,EAAMC,YAC1B,EAEQC,GAAAA,EAAK,SACLC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,gBAAAA,EAAkB,OAClBC,WAAAA,GAAa,EACbC,UAAAA,GAAY,KACTC,GAEPC,KAEMC,MAAAA,EAAiBH,EAAYI,EAAmBZ,EAAMa,SACtDC,EACkB,SAApBR,GAA8BC,EAAaA,EAM3C,OAAAQ,EAJOb,EAIN,CACG,gBAAeK,EACf,cAAY,mBACZS,KANY,WADTd,EACoB,cAAW,EAOlCC,UAAWc,EAAK,mBAAoBd,EAAW,CAC3C,6BAA8BI,EAC9B,+BAAgCH,OAEhCK,EACJ,eAAcJ,EACdK,IAAAA,EAECN,SAAA,CAAAA,KACIO,EACG,CAAAP,SAAAc,EAAC,QAAKf,UAAU,yBACXC,SAAAA,MAIbc,EAACC,EAAA,CACGhB,UAAU,0BACVW,aAAAA,EACAM,KAAMb,MACV,IAMhBR,EAASsB,YAAc"}
1	+ {"version":3,"file":"Expander.js","sources":["../../../../../src/components/expander/deprecated/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ForwardedRef } from \"react\";\nimport type { Density, WithChildren } from \"../../../core/types.js\";\nimport { ScreenReaderOnly } from \"../../ScreenReaderOnly.js\";\nimport { ArrowVerticalAnimated } from \"../../icon/icons/animated/ArrowVerticalAnimated.js\";\n\nexport interface ExpanderProps extends WithChildren {\n as?: \"summary\" \| \"button\";\n /** Må settes dersom du ikke bruker CoreToggle. Verdien skal være IDen til innholdet du ekspanderer. /\n \"aria-controls\"?: string;\n /* Må settes dersom du ikke bruker CoreToggle. IDen her skal brukes som verdien til aria-labelledby på innholdet du ekspanderer. /\n id?: string;\n className?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n /\n Styrer retningen til pila, som animeres ved endring. Styrer også aria-expanded.\n * @default false\n /\n isExpanded?: boolean;\n /* @default \"down\" /\n expandDirection?: \"up\" \| \"down\";\n density?: Density;\n /\n Skjul knappeteksten visuelt.\n \n @default false\n */\n hideLabel?: boolean;\n}\n\nexport const Expander = React.forwardRef(\n (\n {\n as = \"button\",\n className,\n children,\n density,\n expandDirection = \"down\",\n isExpanded = false,\n hideLabel = false,\n ...rest\n }: ExpanderProps,\n ref: ForwardedRef<HTMLButtonElement>,\n ): JSX.Element => {\n const ContentWrapper = hideLabel ? ScreenReaderOnly : React.Fragment;\n const pointingDown =\n expandDirection === \"down\" ? !isExpanded : isExpanded;\n\n const El = as;\n const type = El === \"button\" ? \"button\" : undefined;\n\n return (\n <El\n aria-expanded={isExpanded}\n data-testid=\"jkl-old-expander\"\n type={type}\n className={clsx(\"jkl-old-expander\", className, {\n \"jkl-old-expander--expanded\": isExpanded,\n \"jkl-old-expander--icon-only\": !children,\n })}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children && (\n <ContentWrapper>\n <span className=\"jkl-old-expander__text\">\n {children}\n </span>\n </ContentWrapper>\n )}\n <ArrowVerticalAnimated\n className=\"jkl-old-expander__arrow\"\n pointingDown={pointingDown}\n bold={isExpanded}\n />\n </El>\n );\n },\n);\n\nExpander.displayName = \"Expander\";\n"],"names":["Expander","React","forwardRef","as","className","children","density","expandDirection","isExpanded","hideLabel","rest","ref","ContentWrapper","ScreenReaderOnly","Fragment","pointingDown","jsxs","type","clsx","jsx","ArrowVerticalAnimated","bold","displayName"],"mappings":"gRA+BO,MAAMA,EAAWC,EAAMC,YAC1B,EAEQC,GAAAA,EAAK,SACLC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,gBAAAA,EAAkB,OAClBC,WAAAA,GAAa,EACbC,UAAAA,GAAY,KACTC,GAEPC,KAEMC,MAAAA,EAAiBH,EAAYI,EAAmBZ,EAAMa,SACtDC,EACkB,SAApBR,GAA8BC,EAAaA,EAM3C,OAAAQ,EAJOb,EAIN,CACG,gBAAeK,EACf,cAAY,mBACZS,KANY,WADTd,EACoB,cAAW,EAOlCC,UAAWc,EAAK,mBAAoBd,EAAW,CAC3C,6BAA8BI,EAC9B,+BAAgCH,OAEhCK,EACJ,eAAcJ,EACdK,IAAAA,EAECN,SAAA,CAAAA,KACIO,EACG,CAAAP,SAAAc,EAAC,QAAKf,UAAU,yBACXC,SAAAA,MAIbc,EAACC,EAAA,CACGhB,UAAU,0BACVW,aAAAA,EACAM,KAAMb,MACV,IAMhBR,EAASsB,YAAc"}

package/build/es/components/expander/index.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 export { ExpandablePanel } from './ExpandablePanel.js';
 export { Expander } from './Expander.js';
 export { ExpandSection, type ExpandSectionProps, } from './deprecated/ExpandSection.js';
-export { type ExpandablePanelProps, type ExpanderProps } from './types.js';
+export type { ExpandablePanelProps, ExpanderProps } from './types.js';

package/build/es/components/expander/stories/Expander.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Expander.stories.js","sources":["../../../../../src/components/expander/stories/Expander.stories.tsx"],"sourcesContent":["import { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { GreenCheckIcon } from \"../../icon/index.js\";\nimport { ExpandablePanel } from \"../ExpandablePanel.js\";\nimport { Expander } from \"../Expander.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n title: \"Komponenter/Expander\",\n component: ExpandablePanel,\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n};\n\nexport default meta;\n\ntype StoryExpander = StoryObj<typeof Expander>;\n\n/*\n Expander brukes i ExpandablePanel, men kan også brukes alene dersom du ønsker et annet uttrykk.\n */\nexport const ExpanderStory: StoryExpander = {\n name: \"Expander\",\n args: {\n icon: true,\n flipDirection: false,\n },\n render: ({ icon, ...props }) => (\n <Expander icon={icon ? <GreenCheckIcon /> : undefined} {...props}>\n Når er det vi faktisk er åpne?\n </Expander>\n ),\n};\n"],"names":["meta","title","component","ExpandablePanel","parameters","layout","tags","ExpanderStory","name","args","icon","flipDirection","render","props","jsx","Expander","GreenCheckIcon","children"],"mappings":"gqDAOA,MAAMA,EAAa,CACfC,MAAO,uBACPC,UAAWC,EACXC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,aAUEC,EAA+B,CACxCC,KAAM,WACNC,KAAM,CACFC,MAAM,EACNC,eAAe,GAEnBC,OAAQ,EAAGF,KAAAA,KAASG,KAChBC,EAACC,EAAS,CAAAL,KAAMA,EAAQI,EAAAE,EAAA,CAAe,QAAK,KAAeH,EAAOI,SAElE"}
1	+ {"version":3,"file":"Expander.stories.js","sources":["../../../../../src/components/expander/stories/Expander.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { GreenCheckIcon } from \"../../icon/index.js\";\nimport { ExpandablePanel } from \"../ExpandablePanel.js\";\nimport { Expander } from \"../Expander.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n title: \"Komponenter/Expander\",\n component: ExpandablePanel,\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n};\n\nexport default meta;\n\ntype StoryExpander = StoryObj<typeof Expander>;\n\n/*\n Expander brukes i ExpandablePanel, men kan også brukes alene dersom du ønsker et annet uttrykk.\n */\nexport const ExpanderStory: StoryExpander = {\n name: \"Expander\",\n args: {\n icon: true,\n flipDirection: false,\n },\n render: ({ icon, ...props }) => (\n <Expander icon={icon ? <GreenCheckIcon /> : undefined} {...props}>\n Når er det vi faktisk er åpne?\n </Expander>\n ),\n};\n"],"names":["meta","title","component","ExpandablePanel","parameters","layout","tags","ExpanderStory","name","args","icon","flipDirection","render","props","jsx","Expander","GreenCheckIcon","children"],"mappings":"gqDAOA,MAAMA,EAAa,CACfC,MAAO,uBACPC,UAAWC,EACXC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,aAUEC,EAA+B,CACxCC,KAAM,WACNC,KAAM,CACFC,MAAM,EACNC,eAAe,GAEnBC,OAAQ,EAAGF,KAAAA,KAASG,KAChBC,EAACC,EAAS,CAAAL,KAAMA,EAAQI,EAAAE,EAAA,CAAe,QAAK,KAAeH,EAAOI,SAElE"}

package/build/es/components/expander/stories/ExpanderPanel.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpanderPanel.stories.js","sources":["../../../../../src/components/expander/stories/ExpanderPanel.stories.tsx"],"sourcesContent":["import { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Flex } from \"../../flex/Flex.js\";\nimport { GreenCheckIcon } from \"../../icon/index.js\";\nimport { ExpandablePanel } from \"../ExpandablePanel.js\";\nimport { ExpandablePanelContent } from \"../ExpandablePanelContent.js\";\nimport { Expander } from \"../Expander.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n title: \"Komponenter/ExpandablePanel\",\n component: ExpandablePanel,\n subcomponents: { Expander, ExpandablePanelContent },\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n argTypes: {\n variant: { control: \"select\", options: [\"stroke\", \"fill\"] },\n },\n};\n\nexport default meta;\n\ntype StoryExpanderPanel = StoryObj<{\n icon?: boolean;\n flipDirection?: boolean;\n variant: \"stroke\" \| \"fill\";\n}>;\n\nexport const ExpandablePanelStory: StoryExpanderPanel = {\n name: \"ExpandablePanel\",\n args: {\n variant: \"fill\",\n icon: true,\n flipDirection: false,\n },\n render: ({ icon, flipDirection, ...props }) => (\n <Flex style={{ width: \"100%\" }} direction=\"column\" gap={4}>\n {[...Array(3)].map((_, index) => (\n <ExpandablePanel key={index} {...props}>\n <Expander\n icon={icon ? <GreenCheckIcon /> : undefined}\n expandDirection={flipDirection ? \"up\" : undefined}\n >\n Når er det vi faktisk er åpne?\n </Expander>\n <ExpandablePanel.Content>\n Velkommen innom når vi faktisk har kaffe! Vi er åpne\n mandag til fredag fra kl. 09:00 til 18:00. Lørdag kan du\n besøke oss fra 10:00 til 16:00 (vi liker en rolig start\n på lørdagen). Søndager hviler vi – og det burde du også!\n </ExpandablePanel.Content>\n </ExpandablePanel>\n ))}\n </Flex>\n ),\n};\n"],"names":["meta","title","component","ExpandablePanel","subcomponents","Expander","ExpandablePanelContent","parameters","layout","tags","argTypes","variant","control","options","ExpandablePanelStory","name","args","icon","flipDirection","render","props","jsx","Flex","style","width","direction","gap","children","Array","map","_","index","jsxs","GreenCheckIcon","expandDirection","Content"],"mappings":"0xDASA,MAAMA,EAAa,CACfC,MAAO,8BACPC,UAAWC,EACXC,cAAe,CAAEC,SAAAA,EAAUC,uBAAAA,GAC3BC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,YACPC,SAAU,CACNC,QAAS,CAAEC,QAAS,SAAUC,QAAS,CAAC,SAAU,WAY7CC,EAA2C,CACpDC,KAAM,kBACNC,KAAM,CACFL,QAAS,OACTM,MAAM,EACNC,eAAe,GAEnBC,OAAQ,EAAGF,KAAAA,EAAMC,cAAAA,KAAkBE,KAC/BC,EAACC,EAAK,CAAAC,MAAO,CAAEC,MAAO,QAAUC,UAAU,SAASC,IAAK,EACnDC,SAAA,IAAIC,MAAM,IAAIC,KAAI,CAACC,EAAGC,IAClBC,EAAA7B,EAAA,IAAgCiB,EAC7BO,SAAA,CAAAN,EAAChB,EAAA,CACGY,KAAMA,EAAQI,EAAAY,EAAA,CAAe,QAAK,EAClCC,gBAAiBhB,EAAgB,UAAO,EAC3CS,SAAA,mCAGAN,EAAAlB,EAAgBgC,QAAhB,CAAwBR,SAKzB,qOAZkBI"}
1	+ {"version":3,"file":"ExpanderPanel.stories.js","sources":["../../../../../src/components/expander/stories/ExpanderPanel.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Flex } from \"../../flex/Flex.js\";\nimport { GreenCheckIcon } from \"../../icon/index.js\";\nimport { ExpandablePanel } from \"../ExpandablePanel.js\";\nimport { ExpandablePanelContent } from \"../ExpandablePanelContent.js\";\nimport { Expander } from \"../Expander.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n title: \"Komponenter/ExpandablePanel\",\n component: ExpandablePanel,\n subcomponents: { Expander, ExpandablePanelContent },\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n argTypes: {\n variant: { control: \"select\", options: [\"stroke\", \"fill\"] },\n },\n};\n\nexport default meta;\n\ntype StoryExpanderPanel = StoryObj<{\n icon?: boolean;\n flipDirection?: boolean;\n variant: \"stroke\" \| \"fill\";\n}>;\n\nexport const ExpandablePanelStory: StoryExpanderPanel = {\n name: \"ExpandablePanel\",\n args: {\n variant: \"fill\",\n icon: true,\n flipDirection: false,\n },\n render: ({ icon, flipDirection, ...props }) => (\n <Flex style={{ width: \"100%\" }} direction=\"column\" gap={4}>\n {[...Array(3)].map((_, index) => (\n <ExpandablePanel key={index} {...props}>\n <Expander\n icon={icon ? <GreenCheckIcon /> : undefined}\n expandDirection={flipDirection ? \"up\" : undefined}\n >\n Når er det vi faktisk er åpne?\n </Expander>\n <ExpandablePanel.Content>\n Velkommen innom når vi faktisk har kaffe! Vi er åpne\n mandag til fredag fra kl. 09:00 til 18:00. Lørdag kan du\n besøke oss fra 10:00 til 16:00 (vi liker en rolig start\n på lørdagen). Søndager hviler vi – og det burde du også!\n </ExpandablePanel.Content>\n </ExpandablePanel>\n ))}\n </Flex>\n ),\n};\n"],"names":["meta","title","component","ExpandablePanel","subcomponents","Expander","ExpandablePanelContent","parameters","layout","tags","argTypes","variant","control","options","ExpandablePanelStory","name","args","icon","flipDirection","render","props","jsx","Flex","style","width","direction","gap","children","Array","map","_","index","jsxs","GreenCheckIcon","expandDirection","Content"],"mappings":"0xDASA,MAAMA,EAAa,CACfC,MAAO,8BACPC,UAAWC,EACXC,cAAe,CAAEC,SAAAA,EAAUC,uBAAAA,GAC3BC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,YACPC,SAAU,CACNC,QAAS,CAAEC,QAAS,SAAUC,QAAS,CAAC,SAAU,WAY7CC,EAA2C,CACpDC,KAAM,kBACNC,KAAM,CACFL,QAAS,OACTM,MAAM,EACNC,eAAe,GAEnBC,OAAQ,EAAGF,KAAAA,EAAMC,cAAAA,KAAkBE,KAC/BC,EAACC,EAAK,CAAAC,MAAO,CAAEC,MAAO,QAAUC,UAAU,SAASC,IAAK,EACnDC,SAAA,IAAIC,MAAM,IAAIC,KAAI,CAACC,EAAGC,IAClBC,EAAA7B,EAAA,IAAgCiB,EAC7BO,SAAA,CAAAN,EAAChB,EAAA,CACGY,KAAMA,EAAQI,EAAAY,EAAA,CAAe,QAAK,EAClCC,gBAAiBhB,EAAgB,UAAO,EAC3CS,SAAA,mCAGAN,EAAAlB,EAAgBgC,QAAhB,CAAwBR,SAKzB,qOAZkBI"}

package/build/es/components/feedback/Feedback.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Feedback.js","sources":["../../../../src/components/feedback/Feedback.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from \"react\";\nimport { BaseTextAreaProps } from \"../text-area/types.js\";\nimport { FeedbackContextProvider } from \"./feedbackContext.js\";\nimport { Followup } from \"./followup/Followup.js\";\nimport { MainQuestion } from \"./main-question/MainQuestion.js\";\nimport { ContactQuestion } from \"./questions/ContactQuestion.js\";\nimport {\n ContactQuestionProps,\n FeedbackOption,\n FeedbackType,\n FollowupProps,\n} from \"./types.js\";\n\nexport type FeedbackProps = {\n className?: string;\n /** Velg typen alternativer, Smiley eller RadioButtons. /\n type: \"radio\" \| \"smiley\";\n /* Spørsmålet som stilles til brukeren /\n label: string;\n /* Hjelpetekst til hovedspørsmålet /\n helpLabel?: string;\n /* Svaralternativer til spørsmålet /\n options: FeedbackOption[];\n /* Dersom du vil stille et åpent spørsmål i tillegg kan du sette denne til en truthy verdi /\n addOnQuestion?:\n \| {\n /* Spørsmålet du vil stille /\n label?: string;\n /* Eventuell hjelpetekst. Om du ikke spesifiserer en vil det vises en påminnelse om å ikke skrive inn personling informasjon. /\n helpLabel?: string;\n }\n \| boolean;\n /* Lar deg tilpasse meldingen som kommer når brukeren sender inn tilbakemeldingen. /\n successMessage?: {\n title: string;\n children: ReactNode;\n };\n /\n Funksjon for å håndtere innsending av tilbakemelding\n * @param value Verdien av tilbakemeldingen. Dette er et objekt med følgende egenskaper:\n * - `feedbackValue`: Selve verdien av tilbakemeldingen (format varierer etter spørsmålstype)\n * - `intentionalSubmit`: Er `true` hvis brukeren aktivt sendte inn skjemaet, `false` hvis skjemaet ble sendt inn automatisk\n * - `message`: Eventuell utfyllende melding fra bruker. Blir kun sendt inn ved aktiv innsending\n /\n onSubmit: (value: FeedbackType) => void;\n followup?: FollowupProps;\n contactQuestion?: ContactQuestionProps;\n /\n Hvis du ønsker at Feedback formen skal eksponeres som et landmark kan du sende inn\n * hva du ønsker at en skjermleser skal kalle den her. Bare eksponer Feedback som et\n * landmark på sider der den er en viktig del av innholdet, feks en kvitteringsside\n * eller et annet sted det å kunne gi tilbakemelding vil føles naturlig eller forventet\n * for brukeren.\n /\n landmarkLabel?: string;\n} & Pick<BaseTextAreaProps, \"counter\">;\n\nexport const Feedback = ({\n className,\n followup,\n contactQuestion,\n counter,\n landmarkLabel,\n ...mainQuestionProps\n}: FeedbackProps): ReactElement => {\n const [feedbackSubmitted, setFeedbackSubmitted] = useState(false);\n const [followupStarted, setFollowupStarted] = useState(false);\n const [followupSubmitted, setFollowupSubmitted] = useState(false);\n const [contactSubmitted, setContactSubmitted] = useState(false);\n\n return (\n <div\n className={`jkl-feedback ${className \|\| \"\"}`}\n data-testid=\"feedback\"\n >\n <FeedbackContextProvider\n value={{\n feedbackSubmitted,\n followupStarted,\n followupSubmitted,\n contactSubmitted,\n counter,\n landmarkLabel,\n setFeedbackSubmitted,\n setFollowupStarted,\n setFollowupSubmitted,\n setContactSubmitted,\n }}\n >\n {!followupStarted && <MainQuestion {...mainQuestionProps} />}\n {feedbackSubmitted && !contactSubmitted && followup && (\n <Followup {...followup} />\n )}\n {contactQuestion && (\n <div aria-live=\"polite\">\n {/ Show contact question after followup, or after feedback if no followup */}\n {((!followup && feedbackSubmitted) \|\|\n followupSubmitted) && (\n <ContactQuestion {...contactQuestion} />\n )}\n </div>\n )}\n </FeedbackContextProvider>\n </div>\n );\n};\n"],"names":["Feedback","className","followup","contactQuestion","counter","landmarkLabel","mainQuestionProps","feedbackSubmitted","setFeedbackSubmitted","useState","followupStarted","setFollowupStarted","followupSubmitted","setFollowupSubmitted","contactSubmitted","setContactSubmitted","jsx","children","jsxs","FeedbackContextProvider","value","MainQuestion","Followup","ContactQuestion"],"mappings":"oUAyDO,MAAMA,EAAW,EACpBC,UAAAA,EACAC,SAAAA,EACAC,gBAAAA,EACAC,QAAAA,EACAC,cAAAA,KACGC,MAEG,MAACC,EAAmBC,GAAwBC,GAAS,IACpDC,EAAiBC,GAAsBF,GAAS,IAChDG,EAAmBC,GAAwBJ,GAAS,IACpDK,EAAkBC,GAAuBN,GAAS,GAGrD,OAAAO,EAAC,MAAA,CACGf,UAAW,gBAAgBA,GAAa,KACxC,cAAY,WAEZgB,SAAAC,EAACC,EAAA,CACGC,MAAO,CACHb,kBAAAA,EACAG,gBAAAA,EACAE,kBAAAA,EACAE,iBAAAA,EACAV,QAAAA,EACAC,cAAAA,EACAG,qBAAAA,EACAG,mBAAAA,EACAE,qBAAAA,EACAE,oBAAAA,GAGHE,SAAA,EAACP,GAAmBM,EAACK,EAAc,IAAGf,IACtCC,IAAsBO,GAAoBZ,GACtCc,EAAAM,EAAA,IAAapB,IAEjBC,GACGa,EAAC,MAAI,CAAA,YAAU,SAERC,WAACf,GAAYK,GACZK,IACAI,EAACO,EAAiB,IAAGpB,UAIrC"}
1	+ {"version":3,"file":"Feedback.js","sources":["../../../../src/components/feedback/Feedback.tsx"],"sourcesContent":["import React, { type ReactElement, type ReactNode, useState } from \"react\";\nimport type { BaseTextAreaProps } from \"../text-area/types.js\";\nimport { FeedbackContextProvider } from \"./feedbackContext.js\";\nimport { Followup } from \"./followup/Followup.js\";\nimport { MainQuestion } from \"./main-question/MainQuestion.js\";\nimport { ContactQuestion } from \"./questions/ContactQuestion.js\";\nimport type {\n ContactQuestionProps,\n FeedbackOption,\n FeedbackType,\n FollowupProps,\n} from \"./types.js\";\n\nexport type FeedbackProps = {\n className?: string;\n /** Velg typen alternativer, Smiley eller RadioButtons. /\n type: \"radio\" \| \"smiley\";\n /* Spørsmålet som stilles til brukeren /\n label: string;\n /* Hjelpetekst til hovedspørsmålet /\n helpLabel?: string;\n /* Svaralternativer til spørsmålet /\n options: FeedbackOption[];\n /* Dersom du vil stille et åpent spørsmål i tillegg kan du sette denne til en truthy verdi /\n addOnQuestion?:\n \| {\n /* Spørsmålet du vil stille /\n label?: string;\n /* Eventuell hjelpetekst. Om du ikke spesifiserer en vil det vises en påminnelse om å ikke skrive inn personling informasjon. /\n helpLabel?: string;\n }\n \| boolean;\n /* Lar deg tilpasse meldingen som kommer når brukeren sender inn tilbakemeldingen. /\n successMessage?: {\n title: string;\n children: ReactNode;\n };\n /\n Funksjon for å håndtere innsending av tilbakemelding\n * @param value Verdien av tilbakemeldingen. Dette er et objekt med følgende egenskaper:\n * - `feedbackValue`: Selve verdien av tilbakemeldingen (format varierer etter spørsmålstype)\n * - `intentionalSubmit`: Er `true` hvis brukeren aktivt sendte inn skjemaet, `false` hvis skjemaet ble sendt inn automatisk\n * - `message`: Eventuell utfyllende melding fra bruker. Blir kun sendt inn ved aktiv innsending\n /\n onSubmit: (value: FeedbackType) => void;\n followup?: FollowupProps;\n contactQuestion?: ContactQuestionProps;\n /\n Hvis du ønsker at Feedback formen skal eksponeres som et landmark kan du sende inn\n * hva du ønsker at en skjermleser skal kalle den her. Bare eksponer Feedback som et\n * landmark på sider der den er en viktig del av innholdet, feks en kvitteringsside\n * eller et annet sted det å kunne gi tilbakemelding vil føles naturlig eller forventet\n * for brukeren.\n /\n landmarkLabel?: string;\n} & Pick<BaseTextAreaProps, \"counter\">;\n\nexport const Feedback = ({\n className,\n followup,\n contactQuestion,\n counter,\n landmarkLabel,\n ...mainQuestionProps\n}: FeedbackProps): ReactElement => {\n const [feedbackSubmitted, setFeedbackSubmitted] = useState(false);\n const [followupStarted, setFollowupStarted] = useState(false);\n const [followupSubmitted, setFollowupSubmitted] = useState(false);\n const [contactSubmitted, setContactSubmitted] = useState(false);\n\n return (\n <div\n className={`jkl-feedback ${className \|\| \"\"}`}\n data-testid=\"feedback\"\n >\n <FeedbackContextProvider\n value={{\n feedbackSubmitted,\n followupStarted,\n followupSubmitted,\n contactSubmitted,\n counter,\n landmarkLabel,\n setFeedbackSubmitted,\n setFollowupStarted,\n setFollowupSubmitted,\n setContactSubmitted,\n }}\n >\n {!followupStarted && <MainQuestion {...mainQuestionProps} />}\n {feedbackSubmitted && !contactSubmitted && followup && (\n <Followup {...followup} />\n )}\n {contactQuestion && (\n <div aria-live=\"polite\">\n {/ Show contact question after followup, or after feedback if no followup */}\n {((!followup && feedbackSubmitted) \|\|\n followupSubmitted) && (\n <ContactQuestion {...contactQuestion} />\n )}\n </div>\n )}\n </FeedbackContextProvider>\n </div>\n );\n};\n"],"names":["Feedback","className","followup","contactQuestion","counter","landmarkLabel","mainQuestionProps","feedbackSubmitted","setFeedbackSubmitted","useState","followupStarted","setFollowupStarted","followupSubmitted","setFollowupSubmitted","contactSubmitted","setContactSubmitted","jsx","children","jsxs","FeedbackContextProvider","value","MainQuestion","Followup","ContactQuestion"],"mappings":"oUAyDO,MAAMA,EAAW,EACpBC,UAAAA,EACAC,SAAAA,EACAC,gBAAAA,EACAC,QAAAA,EACAC,cAAAA,KACGC,MAEG,MAACC,EAAmBC,GAAwBC,GAAS,IACpDC,EAAiBC,GAAsBF,GAAS,IAChDG,EAAmBC,GAAwBJ,GAAS,IACpDK,EAAkBC,GAAuBN,GAAS,GAGrD,OAAAO,EAAC,MAAA,CACGf,UAAW,gBAAgBA,GAAa,KACxC,cAAY,WAEZgB,SAAAC,EAACC,EAAA,CACGC,MAAO,CACHb,kBAAAA,EACAG,gBAAAA,EACAE,kBAAAA,EACAE,iBAAAA,EACAV,QAAAA,EACAC,cAAAA,EACAG,qBAAAA,EACAG,mBAAAA,EACAE,qBAAAA,EACAE,oBAAAA,GAGHE,SAAA,EAACP,GAAmBM,EAACK,EAAc,IAAGf,IACtCC,IAAsBO,GAAoBZ,GACtCc,EAAAM,EAAA,IAAapB,IAEjBC,GACGa,EAAC,MAAI,CAAA,YAAU,SAERC,WAACf,GAAYK,GACZK,IACAI,EAACO,EAAiB,IAAGpB,UAIrC"}

package/build/es/components/feedback/FeedbackSuccess.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedbackSuccess.js","sources":["../../../../src/components/feedback/FeedbackSuccess.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { SuccessMessage } from \"../message/Message.js\";\nimport { MessageProps } from \"../message/types.js\";\n\nexport const FeedbackSuccess: FC<MessageProps> = ({\n children,\n className,\n ...rest\n}) => (\n <SuccessMessage\n className={clsx(\"jkl-feedback__fade-in\", className)}\n {...rest}\n aria-live=\"polite\"\n >\n {children}\n </SuccessMessage>\n);\n"],"names":["FeedbackSuccess","children","className","rest","jsx","SuccessMessage","clsx"],"mappings":"6IAKO,MAAMA,EAAoC,EAC7CC,SAAAA,EACAC,UAAAA,KACGC,KAEHC,EAACC,EAAA,CACGH,UAAWI,EAAK,wBAAyBJ,MACrCC,EACJ,YAAU,SAETF,SAAAA"}
1	+ {"version":3,"file":"FeedbackSuccess.js","sources":["../../../../src/components/feedback/FeedbackSuccess.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { SuccessMessage } from \"../message/Message.js\";\nimport type { MessageProps } from \"../message/types.js\";\n\nexport const FeedbackSuccess: FC<MessageProps> = ({\n children,\n className,\n ...rest\n}) => (\n <SuccessMessage\n className={clsx(\"jkl-feedback__fade-in\", className)}\n {...rest}\n aria-live=\"polite\"\n >\n {children}\n </SuccessMessage>\n);\n"],"names":["FeedbackSuccess","children","className","rest","jsx","SuccessMessage","clsx"],"mappings":"6IAKO,MAAMA,EAAoC,EAC7CC,SAAAA,EACAC,UAAAA,KACGC,KAEHC,EAACC,EAAA,CACGH,UAAWI,EAAK,wBAAyBJ,MACrCC,EACJ,YAAU,SAETF,SAAAA"}

package/build/es/components/feedback/FeedbackValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedbackValues.js","sources":["../../../../src/components/feedback/FeedbackValues.tsx"],"sourcesContent":["import { FeedbackOption } from \"./types.js\";\n\nexport const VERY_UNHAPPY: FeedbackOption = {\n label: \"Ikke fornøyd i det hele tatt\",\n value: 1,\n};\nexport const UNHAPPY: FeedbackOption = { label: \"Ikke fornøyd\", value: 2 };\nexport const NEUTRAL: FeedbackOption = {\n label: \"Verken fornøyd eller misfornøyd\",\n value: 3,\n};\nexport const HAPPY: FeedbackOption = { label: \"Fornøyd\", value: 4 };\nexport const VERY_HAPPY: FeedbackOption = { label: \"Veldig fornøyd\", value: 5 };\n"],"names":["VERY_UNHAPPY","label","value","UNHAPPY","NEUTRAL","HAPPY","VERY_HAPPY"],"mappings":"AAEO,MAAMA,EAA+B,CACxCC,MAAO,+BACPC,MAAO,GAEEC,EAA0B,CAAEF,MAAO,eAAgBC,MAAO,GAC1DE,EAA0B,CACnCH,MAAO,kCACPC,MAAO,GAEEG,EAAwB,CAAEJ,MAAO,UAAWC,MAAO,GACnDI,EAA6B,CAAEL,MAAO,iBAAkBC,MAAO"}
1	+ {"version":3,"file":"FeedbackValues.js","sources":["../../../../src/components/feedback/FeedbackValues.tsx"],"sourcesContent":["import type { FeedbackOption } from \"./types.js\";\n\nexport const VERY_UNHAPPY: FeedbackOption = {\n label: \"Ikke fornøyd i det hele tatt\",\n value: 1,\n};\nexport const UNHAPPY: FeedbackOption = { label: \"Ikke fornøyd\", value: 2 };\nexport const NEUTRAL: FeedbackOption = {\n label: \"Verken fornøyd eller misfornøyd\",\n value: 3,\n};\nexport const HAPPY: FeedbackOption = { label: \"Fornøyd\", value: 4 };\nexport const VERY_HAPPY: FeedbackOption = { label: \"Veldig fornøyd\", value: 5 };\n"],"names":["VERY_UNHAPPY","label","value","UNHAPPY","NEUTRAL","HAPPY","VERY_HAPPY"],"mappings":"AAEO,MAAMA,EAA+B,CACxCC,MAAO,+BACPC,MAAO,GAEEC,EAA0B,CAAEF,MAAO,eAAgBC,MAAO,GAC1DE,EAA0B,CACnCH,MAAO,kCACPC,MAAO,GAEEG,EAAwB,CAAEJ,MAAO,UAAWC,MAAO,GACnDI,EAA6B,CAAEL,MAAO,iBAAkBC,MAAO"}

package/build/es/components/feedback/feedbackContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"feedbackContext.js","sources":["../../../../src/components/feedback/feedbackContext.tsx"],"sourcesContent":["import React, { createContext, FC, useContext } from \"react\";\nimport { WithChildren } from \"../../core/types.js\";\nimport { BaseTextAreaProps } from \"../text-area/types.js\";\n\ntype FeedbackContext = {\n feedbackSubmitted: boolean;\n followupStarted: boolean;\n followupSubmitted: boolean;\n contactSubmitted: boolean;\n landmarkLabel?: string;\n setFeedbackSubmitted: (state: boolean) => void;\n setFollowupStarted: (state: boolean) => void;\n setFollowupSubmitted: (state: boolean) => void;\n setContactSubmitted: (state: boolean) => void;\n} & Pick<BaseTextAreaProps, \"counter\">;\n\nconst initialState: FeedbackContext = {\n feedbackSubmitted: false,\n followupStarted: false,\n followupSubmitted: false,\n contactSubmitted: false,\n setFeedbackSubmitted: () => null,\n setFollowupStarted: () => null,\n setFollowupSubmitted: () => null,\n setContactSubmitted: () => null,\n};\n\nconst feedbackContext = createContext(initialState);\n\nexport const useFeedbackContext = (): FeedbackContext =>\n useContext(feedbackContext);\n\ninterface FeedbackContextProviderProps extends WithChildren {\n value: FeedbackContext;\n}\n\nexport const FeedbackContextProvider: FC<FeedbackContextProviderProps> = ({\n value,\n children,\n}) => (\n <feedbackContext.Provider value={value}>\n {children}\n </feedbackContext.Provider>\n);\n"],"names":["feedbackContext","createContext","feedbackSubmitted","followupStarted","followupSubmitted","contactSubmitted","setFeedbackSubmitted","setFollowupStarted","setFollowupSubmitted","setContactSubmitted","useFeedbackContext","useContext","FeedbackContextProvider","value","children","jsx","Provider"],"mappings":"8FAgBA,MAWMA,EAAkBC,EAXc,CAClCC,mBAAmB,EACnBC,iBAAiB,EACjBC,mBAAmB,EACnBC,kBAAkB,EAClBC,qBAAsB,IAAM,KAC5BC,mBAAoB,IAAM,KAC1BC,qBAAsB,IAAM,KAC5BC,oBAAqB,IAAM,OAKlBC,EAAqB,IAC9BC,EAAWX,GAMFY,EAA4D,EACrEC,MAAAA,EACAC,SAAAA,KAECC,EAAAf,EAAgBgB,SAAhB,CAAyBH,MAAAA,EACrBC,SAAAA"}
1	+ {"version":3,"file":"feedbackContext.js","sources":["../../../../src/components/feedback/feedbackContext.tsx"],"sourcesContent":["import React, { createContext, type FC, useContext } from \"react\";\nimport type { WithChildren } from \"../../core/types.js\";\nimport type { BaseTextAreaProps } from \"../text-area/types.js\";\n\ntype FeedbackContext = {\n feedbackSubmitted: boolean;\n followupStarted: boolean;\n followupSubmitted: boolean;\n contactSubmitted: boolean;\n landmarkLabel?: string;\n setFeedbackSubmitted: (state: boolean) => void;\n setFollowupStarted: (state: boolean) => void;\n setFollowupSubmitted: (state: boolean) => void;\n setContactSubmitted: (state: boolean) => void;\n} & Pick<BaseTextAreaProps, \"counter\">;\n\nconst initialState: FeedbackContext = {\n feedbackSubmitted: false,\n followupStarted: false,\n followupSubmitted: false,\n contactSubmitted: false,\n setFeedbackSubmitted: () => null,\n setFollowupStarted: () => null,\n setFollowupSubmitted: () => null,\n setContactSubmitted: () => null,\n};\n\nconst feedbackContext = createContext(initialState);\n\nexport const useFeedbackContext = (): FeedbackContext =>\n useContext(feedbackContext);\n\ninterface FeedbackContextProviderProps extends WithChildren {\n value: FeedbackContext;\n}\n\nexport const FeedbackContextProvider: FC<FeedbackContextProviderProps> = ({\n value,\n children,\n}) => (\n <feedbackContext.Provider value={value}>\n {children}\n </feedbackContext.Provider>\n);\n"],"names":["feedbackContext","createContext","feedbackSubmitted","followupStarted","followupSubmitted","contactSubmitted","setFeedbackSubmitted","setFollowupStarted","setFollowupSubmitted","setContactSubmitted","useFeedbackContext","useContext","FeedbackContextProvider","value","children","jsx","Provider"],"mappings":"8FAgBA,MAWMA,EAAkBC,EAXc,CAClCC,mBAAmB,EACnBC,iBAAiB,EACjBC,mBAAmB,EACnBC,kBAAkB,EAClBC,qBAAsB,IAAM,KAC5BC,mBAAoB,IAAM,KAC1BC,qBAAsB,IAAM,KAC5BC,oBAAqB,IAAM,OAKlBC,EAAqB,IAC9BC,EAAWX,GAMFY,EAA4D,EACrEC,MAAAA,EACAC,SAAAA,KAECC,EAAAf,EAAgBgB,SAAhB,CAAyBH,MAAAA,EACrBC,SAAAA"}

package/build/es/components/feedback/followup/Followup.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as s,useRef as r,useEffect as a,createElement as l}from"react";import{PrimaryButton as o,SecondaryButton as i,TertiaryButton as n}from"../../button/Button.js";import{useFeedbackContext as c}from"../feedbackContext.js";import{FeedbackSuccess as d}from"../FeedbackSuccess.js";import{getQuestionFromType as u}from"../utils.js";import{FollowUpProvider as m}from"./followupContext.js";import{useFollowup as p}from"./useFollowup.js";const k={title:"Takk, igjen!",children:"Vi setter pris på at du tok deg tid til å svare på flere spørsmål. Det hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem."},b=({questions:b,successMessage:f=k,onSubmit:j})=>{const[g,h]=s(!1),x=r(null),S=p(b,j),{handleAbort:F,handleNext:N,step:v,submitted:y}=S,{followupStarted:w,setFollowupStarted:C,setFollowupSubmitted:_,contactSubmitted:B,landmarkLabel:L}=c();a((()=>{0!==v.number&&x.current&&x.current.focus()}),[v]),a((()=>{_(y)}),[y,_]);const T=u(b[v.number].type),A=v.isLast?o:i;return g?null:e("div",{"aria-live":"polite",children:t(m,{state:S,children:[!w&&t("div",{className:"jkl-feedback__fade-in",children:[e("p",{className:"jkl-heading-4 jkl-spacing-xl--top jkl-spacing-xs--bottom",children:"Har du tid til å svare på noen flere spørsmål?"}),e("p",{className:"jkl-body jkl-spacing-xl--bottom",children:"Det tar kun et minutt, og hjelper oss å lage bedre løsninger for deg."}),e(o,{onClick:()=>C(!0),className:"jkl-spacing-xl--right",children:"Jeg har tid!"}),e(n,{onClick:()=>h(!0),children:"Nei takk"})]}),!y&&w&&t("form",{onSubmit:N,className:"jkl-feedback__fade-in","aria-label":L,children:[t("p",{className:"jkl-feedback__step-counter",ref:x,children:["Steg ",v.number+1," av ",b.length]}),l(T,{...b[v.number],autoFocus:!0,key:v.number}),t("div",{className:"jkl-spacing-xl--top","aria-live":"off",children:[e(A,{type:"submit",children:v.isLast?"Send inn":"Neste"}),e(n,{onClick:F,className:"jkl-spacing-xl--left",children:"Avbryt"})]})]}),y&&!B&&e(d,{...f})]})})};export{b as Followup};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as s,useRef as l,useEffect as a,createElement as r}from"react";import{PrimaryButton as o,SecondaryButton as i,TertiaryButton as n}from"../../button/Button.js";import{FeedbackSuccess as c}from"../FeedbackSuccess.js";import{useFeedbackContext as d}from"../feedbackContext.js";import{getQuestionFromType as u}from"../utils.js";import{FollowUpProvider as m}from"./followupContext.js";import{useFollowup as p}from"./useFollowup.js";const k={title:"Takk, igjen!",children:"Vi setter pris på at du tok deg tid til å svare på flere spørsmål. Det hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem."},b=({questions:b,successMessage:f=k,onSubmit:j})=>{const[g,h]=s(!1),x=l(null),S=p(b,j),{handleAbort:v,handleNext:F,step:N,submitted:y}=S,{followupStarted:w,setFollowupStarted:C,setFollowupSubmitted:_,contactSubmitted:B,landmarkLabel:L}=d();a((()=>{var e;0!==N.number&&(null==(e=x.current)||e.focus())}),[N]),a((()=>{_(y)}),[y,_]);const T=u(b[N.number].type),A=N.isLast?o:i;return g?null:e("div",{"aria-live":"polite",children:t(m,{state:S,children:[!w&&t("div",{className:"jkl-feedback__fade-in",children:[e("p",{className:"jkl-heading-4 jkl-spacing-xl--top jkl-spacing-xs--bottom",children:"Har du tid til å svare på noen flere spørsmål?"}),e("p",{className:"jkl-body jkl-spacing-xl--bottom",children:"Det tar kun et minutt, og hjelper oss å lage bedre løsninger for deg."}),e(o,{onClick:()=>C(!0),className:"jkl-spacing-xl--right",children:"Jeg har tid!"}),e(n,{onClick:()=>h(!0),children:"Nei takk"})]}),!y&&w&&t("form",{onSubmit:F,className:"jkl-feedback__fade-in","aria-label":L,children:[t("p",{className:"jkl-feedback__step-counter",ref:x,children:["Steg ",N.number+1," av ",b.length]}),r(T,{...b[N.number],autoFocus:!0,key:N.number}),t("div",{className:"jkl-spacing-xl--top","aria-live":"off",children:[e(A,{type:"submit",children:N.isLast?"Send inn":"Neste"}),e(n,{onClick:v,className:"jkl-spacing-xl--left",children:"Avbryt"})]})]}),y&&!B&&e(c,{...f})]})})};export{b as Followup};
 //# sourceMappingURL=Followup.js.map

package/build/es/components/feedback/followup/Followup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Followup.js","sources":["../../../../../src/components/feedback/followup/Followup.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from \"react\";\nimport {\n PrimaryButton,\n SecondaryButton,\n TertiaryButton,\n} from \"../../button/Button.js\";\nimport { ~~useFeedbackContext~~ } from \"../~~feedbackContext~~.js\";\nimport { ~~FeedbackSuccess~~ } from \"../~~FeedbackSuccess~~.js\";\nimport { FollowupProps } from \"../types.js\";\nimport { getQuestionFromType } from \"../utils.js\";\nimport { FollowUpProvider } from \"./followupContext.js\";\nimport { useFollowup } from \"./useFollowup.js\";\n\nconst defaultSuccessMessage = {\n title: \"Takk, igjen!\",\n children:\n \"Vi setter pris på at du tok deg tid til å svare på flere spørsmål. Det hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem.\",\n};\n\nexport const Followup: FC<FollowupProps> = ({\n questions,\n successMessage = defaultSuccessMessage,\n onSubmit,\n}) => {\n const [noThanks, setNoThanks] = useState(false);\n const focusRef = useRef<HTMLParagraphElement>(null);\n const followupState = useFollowup(questions, onSubmit);\n const { handleAbort, handleNext, step, submitted } = followupState;\n const {\n followupStarted,\n setFollowupStarted,\n setFollowupSubmitted,\n contactSubmitted,\n landmarkLabel,\n } = useFeedbackContext();\n\n useEffect(() => {\n if (step.number === 0) {\n return;\n }\n focusRef.current ~~&& focusRef.current.~~focus();\n }, [step]);\n\n useEffect(() => {\n setFollowupSubmitted(submitted);\n }, [submitted, setFollowupSubmitted]);\n\n const QuestionComponent = getQuestionFromType(questions[step.number].type);\n const Button = step.isLast ? PrimaryButton : SecondaryButton;\n\n if (noThanks) {\n return null;\n }\n\n return (\n <div aria-live=\"polite\">\n <FollowUpProvider state={followupState}>\n {!followupStarted && (\n <div className=\"jkl-feedback__fade-in\">\n <p className=\"jkl-heading-4 jkl-spacing-xl--top jkl-spacing-xs--bottom\">\n Har du tid til å svare på noen flere spørsmål?\n </p>\n <p className=\"jkl-body jkl-spacing-xl--bottom\">\n Det tar kun et minutt, og hjelper oss å lage bedre\n løsninger for deg.\n </p>\n <PrimaryButton\n onClick={() => setFollowupStarted(true)}\n className=\"jkl-spacing-xl--right\"\n >\n Jeg har tid!\n </PrimaryButton>\n <TertiaryButton onClick={() => setNoThanks(true)}>\n Nei takk\n </TertiaryButton>\n </div>\n )}\n {!submitted && followupStarted && (\n <form\n onSubmit={handleNext}\n className=\"jkl-feedback__fade-in\"\n aria-label={landmarkLabel}\n >\n <p\n className=\"jkl-feedback__step-counter\"\n ref={focusRef}\n >\n Steg {step.number + 1} av {questions.length}\n </p>\n <QuestionComponent\n {...questions[step.number]}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus\n key={step.number}\n />\n <div className=\"jkl-spacing-xl--top\" aria-live=\"off\">\n <Button type=\"submit\">\n {step.isLast ? \"Send inn\" : \"Neste\"}\n </Button>\n <TertiaryButton\n onClick={handleAbort}\n className=\"jkl-spacing-xl--left\"\n >\n Avbryt\n </TertiaryButton>\n </div>\n </form>\n )}\n {submitted && !contactSubmitted && (\n <FeedbackSuccess {...successMessage} />\n )}\n </FollowUpProvider>\n </div>\n );\n};\n"],"names":["defaultSuccessMessage","title","children","Followup","questions","successMessage","onSubmit","noThanks","setNoThanks","useState","focusRef","useRef","followupState","useFollowup","handleAbort","handleNext","step","submitted","followupStarted","setFollowupStarted","setFollowupSubmitted","contactSubmitted","landmarkLabel","useFeedbackContext","useEffect","number","current","focus","QuestionComponent","getQuestionFromType","type","Button","isLast","PrimaryButton","SecondaryButton","jsxs","FollowUpProvider","state","className","jsx","onClick","TertiaryButton","ref","length","createElement","autoFocus","key","FeedbackSuccess"],"mappings":"6eAaA,MAAMA,EAAwB,CAC1BC,MAAO,eACPC,SACI,yJAGKC,EAA8B,EACvCC,UAAAA,EACAC,eAAAA,EAAiBL,EACjBM,SAAAA,MAEM,MAACC,EAAUC,GAAeC,GAAS,GACnCC,EAAWC,EAA6B,MACxCC,EAAgBC,EAAYT,EAAWE,IACrCQ,YAAAA,EAAaC,WAAAA,EAAYC,KAAAA,EAAMC,UAAAA,GAAcL,GAEjDM,gBAAAA,EACAC,mBAAAA,EACAC,qBAAAA,EACAC,iBAAAA,EACAC,cAAAA,GACAC,IAEJC,GAAU,~~KACc~~,IAAhBR,EAAKS,~~QAGAf~~,~~EAAAgB~~,~~SAAWhB~~,~~EAASgB~~,~~QAAQC~~,~~OAAM~~,~~GAC5C~~,~~CAACX~~,IAEJQ,GAAU,KACNJ,EAAqBH,EAAS,GAC/B,CAACA,EAAWG,~~IAETQ~~,MAAAA,EAAoBC,~~EAAoBzB~~,EAAUY,EAAKS,~~QAAQK~~,MAC/DC,~~EAASf~~,~~EAAKgB~~,OAASC,EAAgBC,EAE7C,~~OAAI3B~~,EACO,OAIN,MAAI,CAAA,YAAU,SACXL,~~SAACiC~~,EAAAC,EAAA,CAAiBC,~~MAAOzB~~,EACpBV,SAAA,EAACgB,~~GACEiB~~,EAAC,MAAI,CAAAG,UAAU,~~wBACXpC~~,SAAA,~~CAACqC~~,EAAA,IAAA,CAAED,UAAU,~~2DAA2DpC~~,SAExE,~~mDACCqC~~,EAAA,IAAA,CAAED,UAAU,~~kCAAkCpC~~,SAG/C,~~0EACAqC~~,EAACN,EAAA,CACGO,QAAS,~~IAAMrB~~,GAAmB,~~GAClCmB~~,UAAU,~~wBACbpC~~,SAAA,~~mBAGAuC~~,EAAe,CAAAD,QAAS,~~IAAMhC~~,GAAY,GAAON,SAElD,iBAGNe,GAAaC,~~GACXiB~~,EAAC,OAAA,~~CACG7B~~,SAAUS,~~EACVuB~~,UAAU,wBACV,~~aAAYhB~~,EAEZpB,SAAA,~~CAAAiC~~,EAAC,IAAA,CACGG,UAAU,6BACVI,~~IAAKhC~~,EACRR,SAAA,CAAA,QACSc,EAAKS,OAAS,EAAE,OAAKrB,~~EAAUuC~~,UAEzCC,EAAChB,EAAA,~~IACOxB~~,EAAUY,EAAKS,~~QAEnBoB~~,WAAS,EACTC,~~IAAK9B~~,EAAKS,~~SAEbU~~,EAAA,MAAA,CAAIG,UAAU,sBAAsB,YAAU,~~MAC3CpC~~,SAAA,~~CAAAqC~~,EAACR,GAAOD,KAAK,~~SACR5B~~,SAAKc,~~EAAAgB~~,OAAS,WAAa,UAEhCO,EAACE,EAAA,CACGD,~~QAAS1B~~,~~EACTwB~~,UAAU,~~uBACbpC~~,SAAA,iBAMZe,IAAcI,~~GACVkB~~,EAAAQ,EAAA,~~IAAoB1C~~,QAGjC"}
1	+ {"version":3,"file":"Followup.js","sources":["../../../../../src/components/feedback/followup/Followup.tsx"],"sourcesContent":["import React, { type FC, useEffect, useRef, useState } from \"react\";\nimport {\n PrimaryButton,\n SecondaryButton,\n TertiaryButton,\n} from \"../../button/Button.js\";\nimport { FeedbackSuccess } from \"../FeedbackSuccess.js\";\nimport { useFeedbackContext } from \"../feedbackContext.js\";\nimport type { FollowupProps } from \"../types.js\";\nimport { getQuestionFromType } from \"../utils.js\";\nimport { FollowUpProvider } from \"./followupContext.js\";\nimport { useFollowup } from \"./useFollowup.js\";\n\nconst defaultSuccessMessage = {\n title: \"Takk, igjen!\",\n children:\n \"Vi setter pris på at du tok deg tid til å svare på flere spørsmål. Det hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem.\",\n};\n\nexport const Followup: FC<FollowupProps> = ({\n questions,\n successMessage = defaultSuccessMessage,\n onSubmit,\n}) => {\n const [noThanks, setNoThanks] = useState(false);\n const focusRef = useRef<HTMLParagraphElement>(null);\n const followupState = useFollowup(questions, onSubmit);\n const { handleAbort, handleNext, step, submitted } = followupState;\n const {\n followupStarted,\n setFollowupStarted,\n setFollowupSubmitted,\n contactSubmitted,\n landmarkLabel,\n } = useFeedbackContext();\n\n useEffect(() => {\n if (step.number === 0) {\n return;\n }\n focusRef.current?.focus();\n }, [step]);\n\n useEffect(() => {\n setFollowupSubmitted(submitted);\n }, [submitted, setFollowupSubmitted]);\n\n const QuestionComponent = getQuestionFromType(questions[step.number].type);\n const Button = step.isLast ? PrimaryButton : SecondaryButton;\n\n if (noThanks) {\n return null;\n }\n\n return (\n <div aria-live=\"polite\">\n <FollowUpProvider state={followupState}>\n {!followupStarted && (\n <div className=\"jkl-feedback__fade-in\">\n <p className=\"jkl-heading-4 jkl-spacing-xl--top jkl-spacing-xs--bottom\">\n Har du tid til å svare på noen flere spørsmål?\n </p>\n <p className=\"jkl-body jkl-spacing-xl--bottom\">\n Det tar kun et minutt, og hjelper oss å lage bedre\n løsninger for deg.\n </p>\n <PrimaryButton\n onClick={() => setFollowupStarted(true)}\n className=\"jkl-spacing-xl--right\"\n >\n Jeg har tid!\n </PrimaryButton>\n <TertiaryButton onClick={() => setNoThanks(true)}>\n Nei takk\n </TertiaryButton>\n </div>\n )}\n {!submitted && followupStarted && (\n <form\n onSubmit={handleNext}\n className=\"jkl-feedback__fade-in\"\n aria-label={landmarkLabel}\n >\n <p\n className=\"jkl-feedback__step-counter\"\n ref={focusRef}\n >\n Steg {step.number + 1} av {questions.length}\n </p>\n <QuestionComponent\n {...questions[step.number]}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus\n key={step.number}\n />\n <div className=\"jkl-spacing-xl--top\" aria-live=\"off\">\n <Button type=\"submit\">\n {step.isLast ? \"Send inn\" : \"Neste\"}\n </Button>\n <TertiaryButton\n onClick={handleAbort}\n className=\"jkl-spacing-xl--left\"\n >\n Avbryt\n </TertiaryButton>\n </div>\n </form>\n )}\n {submitted && !contactSubmitted && (\n <FeedbackSuccess {...successMessage} />\n )}\n </FollowUpProvider>\n </div>\n );\n};\n"],"names":["defaultSuccessMessage","title","children","Followup","questions","successMessage","onSubmit","noThanks","setNoThanks","useState","focusRef","useRef","followupState","useFollowup","handleAbort","handleNext","step","submitted","followupStarted","setFollowupStarted","setFollowupSubmitted","contactSubmitted","landmarkLabel","useFeedbackContext","useEffect","number","_a","current","focus","QuestionComponent","getQuestionFromType","type","Button","isLast","PrimaryButton","SecondaryButton","jsxs","FollowUpProvider","state","className","jsx","onClick","TertiaryButton","ref","length","createElement","autoFocus","key","FeedbackSuccess"],"mappings":"6eAaA,MAAMA,EAAwB,CAC1BC,MAAO,eACPC,SACI,yJAGKC,EAA8B,EACvCC,UAAAA,EACAC,eAAAA,EAAiBL,EACjBM,SAAAA,MAEM,MAACC,EAAUC,GAAeC,GAAS,GACnCC,EAAWC,EAA6B,MACxCC,EAAgBC,EAAYT,EAAWE,IACrCQ,YAAAA,EAAaC,WAAAA,EAAYC,KAAAA,EAAMC,UAAAA,GAAcL,GAEjDM,gBAAAA,EACAC,mBAAAA,EACAC,qBAAAA,EACAC,iBAAAA,EACAC,cAAAA,GACAC,IAEJC,GAAU,WACc,IAAhBR,EAAKS,SAGT,OAAAC,EAAAhB,EAASiB,UAATD,EAAkBE,QAAA,GACnB,CAACZ,IAEJQ,GAAU,KACNJ,EAAqBH,EAAS,GAC/B,CAACA,EAAWG,IAETS,MAAAA,EAAoBC,EAAoB1B,EAAUY,EAAKS,QAAQM,MAC/DC,EAAShB,EAAKiB,OAASC,EAAgBC,EAE7C,OAAI5B,EACO,OAIN,MAAI,CAAA,YAAU,SACXL,SAACkC,EAAAC,EAAA,CAAiBC,MAAO1B,EACpBV,SAAA,EAACgB,GACEkB,EAAC,MAAI,CAAAG,UAAU,wBACXrC,SAAA,CAACsC,EAAA,IAAA,CAAED,UAAU,2DAA2DrC,SAExE,mDACCsC,EAAA,IAAA,CAAED,UAAU,kCAAkCrC,SAG/C,0EACAsC,EAACN,EAAA,CACGO,QAAS,IAAMtB,GAAmB,GAClCoB,UAAU,wBACbrC,SAAA,mBAGAwC,EAAe,CAAAD,QAAS,IAAMjC,GAAY,GAAON,SAElD,iBAGNe,GAAaC,GACXkB,EAAC,OAAA,CACG9B,SAAUS,EACVwB,UAAU,wBACV,aAAYjB,EAEZpB,SAAA,CAAAkC,EAAC,IAAA,CACGG,UAAU,6BACVI,IAAKjC,EACRR,SAAA,CAAA,QACSc,EAAKS,OAAS,EAAE,OAAKrB,EAAUwC,UAEzCC,EAAChB,EAAA,IACOzB,EAAUY,EAAKS,QAEnBqB,WAAS,EACTC,IAAK/B,EAAKS,SAEbW,EAAA,MAAA,CAAIG,UAAU,sBAAsB,YAAU,MAC3CrC,SAAA,CAAAsC,EAACR,GAAOD,KAAK,SACR7B,SAAKc,EAAAiB,OAAS,WAAa,UAEhCO,EAACE,EAAA,CACGD,QAAS3B,EACTyB,UAAU,uBACbrC,SAAA,iBAMZe,IAAcI,GACVmB,EAAAQ,EAAA,IAAoB3C,QAGjC"}

package/build/es/components/feedback/followup/followupContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"followupContext.js","sources":["../../../../../src/components/feedback/followup/followupContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport { WithChildren } from \"../../../core/types.js\";\nimport { FollowupState } from \"../types.js\";\n\nconst followUpContext = createContext<FollowupState \| undefined>(undefined);\n\nexport const useFollowUpContext = (): FollowupState \| undefined =>\n useContext(followUpContext);\n\ninterface FollowupContextProviderProps extends WithChildren {\n state: FollowupState;\n}\n\nexport const FollowUpProvider: React.FC<FollowupContextProviderProps> = ({\n state,\n children,\n}) => (\n <followUpContext.Provider value={state}>\n {children}\n </followUpContext.Provider>\n);\n"],"names":["followUpContext","createContext","useFollowUpContext","useContext","FollowUpProvider","state","children","Provider","value"],"mappings":"8FAIA,MAAMA,EAAkBC,OAAyC,GAEpDC,EAAqB,IAC9BC,EAAWH,GAMFI,EAA2D,EACpEC,MAAAA,EACAC,SAAAA,OAECN,EAAgBO,SAAhB,CAAyBC,MAAOH,EAC5BC,SAAAA"}
1	+ {"version":3,"file":"followupContext.js","sources":["../../../../../src/components/feedback/followup/followupContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport type { WithChildren } from \"../../../core/types.js\";\nimport type { FollowupState } from \"../types.js\";\n\nconst followUpContext = createContext<FollowupState \| undefined>(undefined);\n\nexport const useFollowUpContext = (): FollowupState \| undefined =>\n useContext(followUpContext);\n\ninterface FollowupContextProviderProps extends WithChildren {\n state: FollowupState;\n}\n\nexport const FollowUpProvider: React.FC<FollowupContextProviderProps> = ({\n state,\n children,\n}) => (\n <followUpContext.Provider value={state}>\n {children}\n </followUpContext.Provider>\n);\n"],"names":["followUpContext","createContext","useFollowUpContext","useContext","FollowUpProvider","state","children","Provider","value"],"mappings":"8FAIA,MAAMA,EAAkBC,OAAyC,GAEpDC,EAAqB,IAC9BC,EAAWH,GAMFI,EAA2D,EACpEC,MAAAA,EACAC,SAAAA,OAECN,EAAgBO,SAAhB,CAAyBC,MAAOH,EAC5BC,SAAAA"}

package/build/es/components/feedback/followup/useFollowup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFollowup.js","sources":["../../../../../src/components/feedback/followup/useFollowup.ts"],"sourcesContent":["import {\n Dispatch,\n FormEvent,\n SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { FeedbackAnswer, FeedbackOption, FollowupQuestion } from \"../types.js\";\n\ntype CurrentValue =\n \| FeedbackOption<string \| number>\n \| FeedbackOption<string \| number>[]\n \| undefined;\n\ntype Followup = {\n questions: FollowupQuestion[];\n values: FeedbackAnswer[] \| undefined;\n step: {\n number: number;\n question: FollowupQuestion;\n isLast: boolean;\n };\n currentValue: CurrentValue;\n setCurrentValue: Dispatch<SetStateAction<CurrentValue>>;\n submitted: boolean;\n handleNext: () => void;\n handleAbort: () => void;\n};\n\nexport const useFollowup = (\n questions: FollowupQuestion[],\n onSubmit: (a: FeedbackAnswer[]) => void,\n): Followup => {\n const [values, setValues] = useState<FeedbackAnswer[]>();\n const [step, setStep] = useState({\n number: 0,\n question: questions[0],\n isLast: questions.length === 1,\n });\n const [shouldSubmit, setShouldSubmit] = useState(false);\n const [submitted, setSubmitted] = useState(false);\n const [currentValue, setCurrentValue] = useState<\n FeedbackOption \| FeedbackOption[]\n >();\n\n // Store info in a ref to facilitate autosubmit on component unmount,\n // or when leaving page\n const followupRef = useRef({\n values,\n submitted,\n onSubmit,\n });\n\n // Keep values in ref updated\n useEffect(() => {\n followupRef.current = {\n ...followupRef.current,\n values,\n submitted,\n };\n }, [values, submitted]);\n\n // General method for submitting info\n const _handleSubmit = useCallback(() => {\n if (\n !followupRef.current.submitted &&\n followupRef.current.values !== undefined\n ) {\n followupRef.current.onSubmit(followupRef.current.values);\n }\n }, []);\n\n // Function for handling going to the next step in the form wizard\n function handleNext(e?: FormEvent<HTMLFormElement>) {\n e?.preventDefault();\n\n const value = Array.isArray(currentValue)\n ? currentValue.map((option) => option.value.toString())\n : currentValue?.value;\n\n const newValue = {\n ...step.question,\n name: step.question.name \|\| step.question.label,\n value,\n };\n\n setValues((oldValues) => {\n const filteredValues =\n oldValues?.filter(\n (oldValue) => oldValue.name !== newValue.name,\n ) \|\| [];\n return [...filteredValues, newValue as FeedbackAnswer];\n });\n setCurrentValue(undefined);\n\n if (step.isLast) {\n setShouldSubmit(true);\n } else {\n setStep((currentStep) => {\n const newStepNum = currentStep.number + 1;\n return {\n number: newStepNum,\n question: questions[newStepNum],\n isLast: newStepNum + 1 >= questions.length,\n };\n });\n }\n }\n\n // Let the user abort without submitting answers\n function handleAbort() {\n setValues(undefined);\n setCurrentValue(undefined);\n setStep({\n number: 0,\n question: questions[0],\n isLast: questions.length === 1,\n });\n setSubmitted(true);\n }\n\n // Submit info after user submits last question\n useEffect(() => {\n if (shouldSubmit) {\n _handleSubmit();\n setSubmitted(true);\n }\n }, [shouldSubmit, _handleSubmit]);\n\n // Submit info if component unmounts or page unloads\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"beforeunload\", _handleSubmit);\n }\n return () => {\n _handleSubmit();\n window.removeEventListener(\"beforeunload\", _handleSubmit);\n };\n }, [_handleSubmit]);\n\n return {\n questions,\n values,\n step,\n currentValue,\n setCurrentValue,\n submitted,\n handleNext,\n handleAbort,\n };\n};\n"],"names":["useFollowup","questions","onSubmit","values","setValues","useState","step","setStep","number","question","isLast","length","shouldSubmit","setShouldSubmit","submitted","setSubmitted","currentValue","setCurrentValue","followupRef","useRef","useEffect","current","_handleSubmit","useCallback","window","addEventListener","removeEventListener","handleNext","e","preventDefault","value","Array","isArray","map","option","toString","newValue","name","label","oldValues","filter","oldValue","currentStep","newStepNum","handleAbort"],"mappings":"~~6EA+Ba~~,MAAAA,EAAc,CACvBC,EACAC,KAEM,MAACC,EAAQC,GAAaC,KACrBC,EAAMC,GAAWF,EAAS,CAC7BG,OAAQ,EACRC,SAAUR,EAAU,GACpBS,OAA6B,IAArBT,EAAUU,UAEfC,EAAcC,GAAmBR,GAAS,IAC1CS,EAAWC,GAAgBV,GAAS,IACpCW,EAAcC,GAAmBZ,IAMlCa,EAAcC,EAAO,CACvBhB,OAAAA,EACAW,UAAAA,EACAZ,SAAAA,IAIJkB,GAAU,KACNF,EAAYG,QAAU,IACfH,EAAYG,QACflB,OAAAA,EACAW,UAAAA,EAAA,GAEL,CAACX,EAAQW,IAGNQ,MAAAA,EAAgBC,GAAY,MAEzBL,EAAYG,QAAQP,gBACU,IAA/BI,EAAYG,QAAQlB,QAEpBe,EAAYG,QAAQnB,SAASgB,EAAYG,QAAQlB,OAAM,GAE5D,IAoDH,OAAAiB,GAAU,KACFR,IACcU,IACdP,GAAa,GAAI,GAEtB,CAACH,EAAcU,IAGlBF,GAAU,YACKI,OAAW,KACXA,OAAAC,iBAAiB,eAAgBH,GAErC,KACWA,IACPE,OAAAE,oBAAoB,eAAgBJ,EAAa,IAE7D,CAACA,IAEG,CACHrB,UAAAA,EACAE,OAAAA,EACAG,KAAAA,EACAU,aAAAA,EACAC,gBAAAA,EACAH,UAAAA,EACAa,WA1EJ,SAAoBC,GAChB,MAAAA,GAAAA,EAAGC,iBAEH,MAAMC,EAAQC,MAAMC,QAAQhB,GACtBA,EAAaiB,KAAKC,GAAWA,EAAOJ,MAAMK,aAC1C,MAAAnB,OAAAA,EAAAA,EAAcc,MAEdM,EAAW,IACV9B,EAAKG,SACR4B,KAAM/B,EAAKG,SAAS4B,MAAQ/B,EAAKG,SAAS6B,MAC1CR,MAAAA,GAGJ1B,GAAWmC,GAKA,KAHH,MAAAA,SAAAA,EAAWC,QACNC,GAAaA,EAASJ,OAASD,EAASC,SACxC,GACkBD,KAE/BnB,OAAgB,GAEZX,EAAKI,OACLG,GAAgB,GAEhBN,GAASmC,IACCC,MAAAA,EAAaD,EAAYlC,OAAS,EACjC,MAAA,CACHA,OAAQmC,EACRlC,SAAUR,EAAU0C,GACpBjC,OAAQiC,EAAa,GAAK1C,EAAUU,OAAA,GAIpD,EAyCIiC,YAtCJ,WACIxC,OAAU,GACVa,OAAgB,GACRV,EAAA,CACJC,OAAQ,EACRC,SAAUR,EAAU,GACpBS,OAA6B,IAArBT,EAAUU,SAEtBI,GAAa,EACjB,EA6BI"}
1	+ {"version":3,"file":"useFollowup.js","sources":["../../../../../src/components/feedback/followup/useFollowup.ts"],"sourcesContent":["import {\n type Dispatch,\n type FormEvent,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type {\n FeedbackAnswer,\n FeedbackOption,\n FollowupQuestion,\n} from \"../types.js\";\n\ntype CurrentValue =\n \| FeedbackOption<string \| number>\n \| FeedbackOption<string \| number>[]\n \| undefined;\n\ntype Followup = {\n questions: FollowupQuestion[];\n values: FeedbackAnswer[] \| undefined;\n step: {\n number: number;\n question: FollowupQuestion;\n isLast: boolean;\n };\n currentValue: CurrentValue;\n setCurrentValue: Dispatch<SetStateAction<CurrentValue>>;\n submitted: boolean;\n handleNext: () => void;\n handleAbort: () => void;\n};\n\nexport const useFollowup = (\n questions: FollowupQuestion[],\n onSubmit: (a: FeedbackAnswer[]) => void,\n): Followup => {\n const [values, setValues] = useState<FeedbackAnswer[]>();\n const [step, setStep] = useState({\n number: 0,\n question: questions[0],\n isLast: questions.length === 1,\n });\n const [shouldSubmit, setShouldSubmit] = useState(false);\n const [submitted, setSubmitted] = useState(false);\n const [currentValue, setCurrentValue] = useState<\n FeedbackOption \| FeedbackOption[]\n >();\n\n // Store info in a ref to facilitate autosubmit on component unmount,\n // or when leaving page\n const followupRef = useRef({\n values,\n submitted,\n onSubmit,\n });\n\n // Keep values in ref updated\n useEffect(() => {\n followupRef.current = {\n ...followupRef.current,\n values,\n submitted,\n };\n }, [values, submitted]);\n\n // General method for submitting info\n const _handleSubmit = useCallback(() => {\n if (\n !followupRef.current.submitted &&\n followupRef.current.values !== undefined\n ) {\n followupRef.current.onSubmit(followupRef.current.values);\n }\n }, []);\n\n // Function for handling going to the next step in the form wizard\n function handleNext(e?: FormEvent<HTMLFormElement>) {\n e?.preventDefault();\n\n const value = Array.isArray(currentValue)\n ? currentValue.map((option) => option.value.toString())\n : currentValue?.value;\n\n const newValue = {\n ...step.question,\n name: step.question.name \|\| step.question.label,\n value,\n };\n\n setValues((oldValues) => {\n const filteredValues =\n oldValues?.filter(\n (oldValue) => oldValue.name !== newValue.name,\n ) \|\| [];\n return [...filteredValues, newValue as FeedbackAnswer];\n });\n setCurrentValue(undefined);\n\n if (step.isLast) {\n setShouldSubmit(true);\n } else {\n setStep((currentStep) => {\n const newStepNum = currentStep.number + 1;\n return {\n number: newStepNum,\n question: questions[newStepNum],\n isLast: newStepNum + 1 >= questions.length,\n };\n });\n }\n }\n\n // Let the user abort without submitting answers\n function handleAbort() {\n setValues(undefined);\n setCurrentValue(undefined);\n setStep({\n number: 0,\n question: questions[0],\n isLast: questions.length === 1,\n });\n setSubmitted(true);\n }\n\n // Submit info after user submits last question\n useEffect(() => {\n if (shouldSubmit) {\n _handleSubmit();\n setSubmitted(true);\n }\n }, [shouldSubmit, _handleSubmit]);\n\n // Submit info if component unmounts or page unloads\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"beforeunload\", _handleSubmit);\n }\n return () => {\n _handleSubmit();\n window.removeEventListener(\"beforeunload\", _handleSubmit);\n };\n }, [_handleSubmit]);\n\n return {\n questions,\n values,\n step,\n currentValue,\n setCurrentValue,\n submitted,\n handleNext,\n handleAbort,\n };\n};\n"],"names":["useFollowup","questions","onSubmit","values","setValues","useState","step","setStep","number","question","isLast","length","shouldSubmit","setShouldSubmit","submitted","setSubmitted","currentValue","setCurrentValue","followupRef","useRef","useEffect","current","_handleSubmit","useCallback","window","addEventListener","removeEventListener","handleNext","e","preventDefault","value","Array","isArray","map","option","toString","newValue","name","label","oldValues","filter","oldValue","currentStep","newStepNum","handleAbort"],"mappings":"6EAmCa,MAAAA,EAAc,CACvBC,EACAC,KAEM,MAACC,EAAQC,GAAaC,KACrBC,EAAMC,GAAWF,EAAS,CAC7BG,OAAQ,EACRC,SAAUR,EAAU,GACpBS,OAA6B,IAArBT,EAAUU,UAEfC,EAAcC,GAAmBR,GAAS,IAC1CS,EAAWC,GAAgBV,GAAS,IACpCW,EAAcC,GAAmBZ,IAMlCa,EAAcC,EAAO,CACvBhB,OAAAA,EACAW,UAAAA,EACAZ,SAAAA,IAIJkB,GAAU,KACNF,EAAYG,QAAU,IACfH,EAAYG,QACflB,OAAAA,EACAW,UAAAA,EAAA,GAEL,CAACX,EAAQW,IAGNQ,MAAAA,EAAgBC,GAAY,MAEzBL,EAAYG,QAAQP,gBACU,IAA/BI,EAAYG,QAAQlB,QAEpBe,EAAYG,QAAQnB,SAASgB,EAAYG,QAAQlB,OAAM,GAE5D,IAoDH,OAAAiB,GAAU,KACFR,IACcU,IACdP,GAAa,GAAI,GAEtB,CAACH,EAAcU,IAGlBF,GAAU,YACKI,OAAW,KACXA,OAAAC,iBAAiB,eAAgBH,GAErC,KACWA,IACPE,OAAAE,oBAAoB,eAAgBJ,EAAa,IAE7D,CAACA,IAEG,CACHrB,UAAAA,EACAE,OAAAA,EACAG,KAAAA,EACAU,aAAAA,EACAC,gBAAAA,EACAH,UAAAA,EACAa,WA1EJ,SAAoBC,GAChB,MAAAA,GAAAA,EAAGC,iBAEH,MAAMC,EAAQC,MAAMC,QAAQhB,GACtBA,EAAaiB,KAAKC,GAAWA,EAAOJ,MAAMK,aAC1C,MAAAnB,OAAAA,EAAAA,EAAcc,MAEdM,EAAW,IACV9B,EAAKG,SACR4B,KAAM/B,EAAKG,SAAS4B,MAAQ/B,EAAKG,SAAS6B,MAC1CR,MAAAA,GAGJ1B,GAAWmC,GAKA,KAHH,MAAAA,SAAAA,EAAWC,QACNC,GAAaA,EAASJ,OAASD,EAASC,SACxC,GACkBD,KAE/BnB,OAAgB,GAEZX,EAAKI,OACLG,GAAgB,GAEhBN,GAASmC,IACCC,MAAAA,EAAaD,EAAYlC,OAAS,EACjC,MAAA,CACHA,OAAQmC,EACRlC,SAAUR,EAAU0C,GACpBjC,OAAQiC,EAAa,GAAK1C,EAAUU,OAAA,GAIpD,EAyCIiC,YAtCJ,WACIxC,OAAU,GACVa,OAAgB,GACRV,EAAA,CACJC,OAAQ,EACRC,SAAUR,EAAU,GACpBS,OAA6B,IAArBT,EAAUU,SAEtBI,GAAa,EACjB,EA6BI"}

package/build/es/components/feedback/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 export { Feedback, type FeedbackProps } from './Feedback.js';
 export { PRESETS, type PresetProperties } from './presets.js';
-export { type FeedbackOption, type FeedbackType, type FollowupProps, type FollowupQuestion, type MainQuestion, type RadioQuestion, type SmileyQuestion, type CheckboxQuestion, type TextQuestion, type ContactQuestionProps, type FeedbackAnswer, type SingleFeedbackAnswer, type MultiFeedbackAnswer, } from './types.js';
+export type { FeedbackOption, FeedbackType, FollowupProps, FollowupQuestion, MainQuestion, RadioQuestion, SmileyQuestion, CheckboxQuestion, TextQuestion, ContactQuestionProps, FeedbackAnswer, SingleFeedbackAnswer, MultiFeedbackAnswer, } from './types.js';

package/build/es/components/feedback/main-question/MainQuestion.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as t,jsx as s}from"react/jsx-runtime";import{c as i}from"../../../../clsx-BeLtu-UY.js";import{useEffect as a}from"react";import{useAnimatedHeight as o}from"../../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{PrimaryButton as r,TertiaryButton as n}from"../../button/Button.js";import{useFeedbackContext as l}from"../feedbackContext.js";import{FeedbackSuccess as m}from"../FeedbackSuccess.js";import{AddonQuestion as d}from"../questions/AddonQuestion.js";import{getQuestionFromType as u}from"../utils.js";import{MainQuestionContextProvider as c}from"./mainQuestionContext.js";import{useMainQuestion as b}from"./useMainQuestion.js";const p={title:"Takk for tilbakemeldingen!",children:"Husk at vi ikke kan besvare meldinger fra dette skjemaet. Kontakt gjerne din forsikringsrådgiver om du har flere spørsmål."},k=({label:k,options:f,type:j,addOnQuestion:h,successMessage:g=p,helpLabel:v,onSubmit:x})=>{const Q=b(x),{setFeedbackSubmitted:y,contactSubmitted:S,landmarkLabel:A}=l(),{handleSubmit:C,currentValue:F,setCurrentValue:_,submitted:L}=Q,[M]=o(void 0!==F);a((()=>{y(L)}),[L,y]);const H=u(j);return e(t,{children:[!L&&s(c,{state:Q,children:e("form",{onSubmit:C,"aria-label":A,children:[s(H,{label:k,options:f,helpLabel:v}),e("div",{ref:M,className:i({"jkl-feedback__submit-wrapper":!0,"jkl-feedback__submit-wrapper--hidden":void 0===F}),children:[h&&s(d,{helpLabel:"object"==typeof h?h.helpLabel:void 0,label:"object"==typeof h?h.label:void 0}),e("div",{className:"jkl-feedback__buttons jkl-spacing-xl--top",children:[s(r,{className:"jkl-spacing-xl--right",children:"Send"}),s(n,{type:"button",onClick:()=>_(void 0),children:"Avbryt"})]})]})]})}),L&&!S&&s(m,{...g})]})};export{k as MainQuestion};
+import{jsxs as e,Fragment as t,jsx as s}from"react/jsx-runtime";import{c as i}from"../../../../clsx-BeLtu-UY.js";import{useEffect as a}from"react";import{useAnimatedHeight as o}from"../../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{PrimaryButton as r,TertiaryButton as n}from"../../button/Button.js";import{FeedbackSuccess as l}from"../FeedbackSuccess.js";import{useFeedbackContext as m}from"../feedbackContext.js";import{AddonQuestion as d}from"../questions/AddonQuestion.js";import{getQuestionFromType as u}from"../utils.js";import{MainQuestionContextProvider as c}from"./mainQuestionContext.js";import{useMainQuestion as b}from"./useMainQuestion.js";const p={title:"Takk for tilbakemeldingen!",children:"Husk at vi ikke kan besvare meldinger fra dette skjemaet. Kontakt gjerne din forsikringsrådgiver om du har flere spørsmål."},k=({label:k,options:f,type:j,addOnQuestion:h,successMessage:g=p,helpLabel:v,onSubmit:x})=>{const Q=b(x),{setFeedbackSubmitted:y,contactSubmitted:S,landmarkLabel:A}=m(),{handleSubmit:C,currentValue:F,setCurrentValue:_,submitted:L}=Q,[M]=o(void 0!==F);a((()=>{y(L)}),[L,y]);const H=u(j);return e(t,{children:[!L&&s(c,{state:Q,children:e("form",{onSubmit:C,"aria-label":A,children:[s(H,{label:k,options:f,helpLabel:v}),e("div",{ref:M,className:i({"jkl-feedback__submit-wrapper":!0,"jkl-feedback__submit-wrapper--hidden":void 0===F}),children:[h&&s(d,{helpLabel:"object"==typeof h?h.helpLabel:void 0,label:"object"==typeof h?h.label:void 0}),e("div",{className:"jkl-feedback__buttons jkl-spacing-xl--top",children:[s(r,{className:"jkl-spacing-xl--right",children:"Send"}),s(n,{type:"button",onClick:()=>_(void 0),children:"Avbryt"})]})]})]})}),L&&!S&&s(l,{...g})]})};export{k as MainQuestion};
 //# sourceMappingURL=MainQuestion.js.map

package/build/es/components/feedback/main-question/MainQuestion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MainQuestion.js","sources":["../../../../../src/components/feedback/main-question/MainQuestion.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ComponentProps, FC, ReactNode, useEffect } from \"react\";\nimport { useAnimatedHeight } from \"../../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { PrimaryButton, TertiaryButton } from \"../../button/Button.js\";\nimport { Feedback } from \"../Feedback.js\";\nimport { ~~useFeedbackContext~~ } from \"../~~feedbackContext~~.js\";\nimport { ~~FeedbackSuccess~~ } from \"../~~FeedbackSuccess~~.js\";\nimport { AddonQuestion } from \"../questions/AddonQuestion.js\";\nimport { FeedbackOption, FeedbackType } from \"../types.js\";\nimport { getQuestionFromType } from \"../utils.js\";\nimport { MainQuestionContextProvider } from \"./mainQuestionContext.js\";\nimport { useMainQuestion } from \"./useMainQuestion.js\";\n\nconst defaultSuccessMessage = {\n title: \"Takk for tilbakemeldingen!\",\n children:\n \"Husk at vi ikke kan besvare meldinger fra dette skjemaet. Kontakt gjerne din forsikringsrådgiver om du har flere spørsmål.\",\n};\n\ntype Props = Pick<ComponentProps<typeof Feedback>, \"addOnQuestion\"> & {\n type: \"radio\" \| \"smiley\";\n label: string;\n helpLabel?: string;\n options: FeedbackOption[];\n successMessage?: {\n title: string;\n children: ReactNode;\n };\n onSubmit: (value: FeedbackType) => void;\n};\n\nexport const MainQuestion: FC<Props> = ({\n label,\n options,\n type,\n addOnQuestion,\n successMessage = defaultSuccessMessage,\n helpLabel,\n onSubmit,\n}) => {\n const mainQuestionState = useMainQuestion(onSubmit);\n\n const { setFeedbackSubmitted, contactSubmitted, landmarkLabel } =\n useFeedbackContext();\n const { handleSubmit, currentValue, setCurrentValue, submitted } =\n mainQuestionState;\n const [submitWrapperRef] = useAnimatedHeight<HTMLDivElement>(\n currentValue !== undefined,\n );\n\n useEffect(() => {\n setFeedbackSubmitted(submitted);\n }, [submitted, setFeedbackSubmitted]);\n\n const MainQuestionComp = getQuestionFromType(type);\n\n return (\n <>\n {!submitted && (\n <MainQuestionContextProvider state={mainQuestionState}>\n <form onSubmit={handleSubmit} aria-label={landmarkLabel}>\n <MainQuestionComp\n label={label}\n options={options}\n helpLabel={helpLabel}\n />\n <div\n ref={submitWrapperRef}\n className={clsx({\n \"jkl-feedback__submit-wrapper\": true,\n \"jkl-feedback__submit-wrapper--hidden\":\n currentValue === undefined,\n })}\n >\n {addOnQuestion && (\n <AddonQuestion\n helpLabel={\n typeof addOnQuestion === \"object\"\n ? addOnQuestion.helpLabel\n : undefined\n }\n label={\n typeof addOnQuestion === \"object\"\n ? addOnQuestion.label\n : undefined\n }\n />\n )}\n <div className=\"jkl-feedback__buttons jkl-spacing-xl--top\">\n <PrimaryButton className=\"jkl-spacing-xl--right\">\n Send\n </PrimaryButton>\n <TertiaryButton\n type=\"button\"\n onClick={() => setCurrentValue(undefined)}\n >\n Avbryt\n </TertiaryButton>\n </div>\n </div>\n </form>\n </MainQuestionContextProvider>\n )}\n {submitted && !contactSubmitted && (\n <FeedbackSuccess {...successMessage} />\n )}\n </>\n );\n};\n"],"names":["defaultSuccessMessage","title","children","MainQuestion","label","options","type","addOnQuestion","successMessage","helpLabel","onSubmit","mainQuestionState","useMainQuestion","setFeedbackSubmitted","contactSubmitted","landmarkLabel","useFeedbackContext","handleSubmit","currentValue","setCurrentValue","submitted","submitWrapperRef","useAnimatedHeight","useEffect","MainQuestionComp","getQuestionFromType","jsxs","Fragment","jsx","MainQuestionContextProvider","state","ref","className","clsx","AddonQuestion","PrimaryButton","TertiaryButton","onClick","FeedbackSuccess"],"mappings":"~~ypBAaA~~,MAAMA,EAAwB,CAC1BC,MAAO,6BACPC,SACI,8HAeKC,EAA0B,EACnCC,MAAAA,EACAC,QAAAA,EACAC,KAAAA,EACAC,cAAAA,EACAC,eAAAA,EAAiBR,EACjBS,UAAAA,EACAC,SAAAA,MAEMC,MAAAA,EAAoBC,EAAgBF,IAElCG,qBAAAA,EAAsBC,iBAAAA,EAAkBC,cAAAA,GAC5CC,KACIC,aAAAA,EAAcC,aAAAA,EAAcC,gBAAAA,EAAiBC,UAAAA,GACjDT,GACGU,GAAoBC,OACN,IAAjBJ,GAGJK,GAAU,KACNV,EAAqBO,EAAS,GAC/B,CAACA,EAAWP,IAETW,MAAAA,EAAmBC,EAAoBnB,GAE7C,OAESoB,EAAAC,EAAA,CAAAzB,SAAA,EAACkB,GACGQ,EAAAC,EAAA,CAA4BC,MAAOnB,EAChCT,WAAC,OAAK,CAAAQ,SAAUO,EAAc,aAAYF,EACtCb,SAAA,CAAA0B,EAACJ,EAAA,CACGpB,MAAAA,EACAC,QAAAA,EACAI,UAAAA,IAEJiB,EAAC,MAAA,CACGK,IAAKV,EACLW,UAAWC,EAAK,CACZ,gCAAgC,EAChC,4CACqB,IAAjBf,IAGPhB,SAAA,CACGK,GAAAqB,EAACM,EAAA,CACGzB,UAC6B,iBAAlBF,EACDA,EAAcE,eACd,EAEVL,MAC6B,iBAAlBG,EACDA,EAAcH,WACd,IAIlBsB,EAAC,MAAI,CAAAM,UAAU,4CACX9B,SAAA,CAAC0B,EAAAO,EAAA,CAAcH,UAAU,wBAAwB9B,SAEjD,SACA0B,EAACQ,EAAA,CACG9B,KAAK,SACL+B,QAAS,IAAMlB,OAAgB,GAClCjB,SAAA,sBAQpBkB,IAAcN,GACVc,EAAAU,EAAA,IAAoB9B,MAE7B"}
1	+ {"version":3,"file":"MainQuestion.js","sources":["../../../../../src/components/feedback/main-question/MainQuestion.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n type ComponentProps,\n type FC,\n type ReactNode,\n useEffect,\n} from \"react\";\nimport { useAnimatedHeight } from \"../../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { PrimaryButton, TertiaryButton } from \"../../button/Button.js\";\nimport type { Feedback } from \"../Feedback.js\";\nimport { FeedbackSuccess } from \"../FeedbackSuccess.js\";\nimport { useFeedbackContext } from \"../feedbackContext.js\";\nimport { AddonQuestion } from \"../questions/AddonQuestion.js\";\nimport type { FeedbackOption, FeedbackType } from \"../types.js\";\nimport { getQuestionFromType } from \"../utils.js\";\nimport { MainQuestionContextProvider } from \"./mainQuestionContext.js\";\nimport { useMainQuestion } from \"./useMainQuestion.js\";\n\nconst defaultSuccessMessage = {\n title: \"Takk for tilbakemeldingen!\",\n children:\n \"Husk at vi ikke kan besvare meldinger fra dette skjemaet. Kontakt gjerne din forsikringsrådgiver om du har flere spørsmål.\",\n};\n\ntype Props = Pick<ComponentProps<typeof Feedback>, \"addOnQuestion\"> & {\n type: \"radio\" \| \"smiley\";\n label: string;\n helpLabel?: string;\n options: FeedbackOption[];\n successMessage?: {\n title: string;\n children: ReactNode;\n };\n onSubmit: (value: FeedbackType) => void;\n};\n\nexport const MainQuestion: FC<Props> = ({\n label,\n options,\n type,\n addOnQuestion,\n successMessage = defaultSuccessMessage,\n helpLabel,\n onSubmit,\n}) => {\n const mainQuestionState = useMainQuestion(onSubmit);\n\n const { setFeedbackSubmitted, contactSubmitted, landmarkLabel } =\n useFeedbackContext();\n const { handleSubmit, currentValue, setCurrentValue, submitted } =\n mainQuestionState;\n const [submitWrapperRef] = useAnimatedHeight<HTMLDivElement>(\n currentValue !== undefined,\n );\n\n useEffect(() => {\n setFeedbackSubmitted(submitted);\n }, [submitted, setFeedbackSubmitted]);\n\n const MainQuestionComp = getQuestionFromType(type);\n\n return (\n <>\n {!submitted && (\n <MainQuestionContextProvider state={mainQuestionState}>\n <form onSubmit={handleSubmit} aria-label={landmarkLabel}>\n <MainQuestionComp\n label={label}\n options={options}\n helpLabel={helpLabel}\n />\n <div\n ref={submitWrapperRef}\n className={clsx({\n \"jkl-feedback__submit-wrapper\": true,\n \"jkl-feedback__submit-wrapper--hidden\":\n currentValue === undefined,\n })}\n >\n {addOnQuestion && (\n <AddonQuestion\n helpLabel={\n typeof addOnQuestion === \"object\"\n ? addOnQuestion.helpLabel\n : undefined\n }\n label={\n typeof addOnQuestion === \"object\"\n ? addOnQuestion.label\n : undefined\n }\n />\n )}\n <div className=\"jkl-feedback__buttons jkl-spacing-xl--top\">\n <PrimaryButton className=\"jkl-spacing-xl--right\">\n Send\n </PrimaryButton>\n <TertiaryButton\n type=\"button\"\n onClick={() => setCurrentValue(undefined)}\n >\n Avbryt\n </TertiaryButton>\n </div>\n </div>\n </form>\n </MainQuestionContextProvider>\n )}\n {submitted && !contactSubmitted && (\n <FeedbackSuccess {...successMessage} />\n )}\n </>\n );\n};\n"],"names":["defaultSuccessMessage","title","children","MainQuestion","label","options","type","addOnQuestion","successMessage","helpLabel","onSubmit","mainQuestionState","useMainQuestion","setFeedbackSubmitted","contactSubmitted","landmarkLabel","useFeedbackContext","handleSubmit","currentValue","setCurrentValue","submitted","submitWrapperRef","useAnimatedHeight","useEffect","MainQuestionComp","getQuestionFromType","jsxs","Fragment","jsx","MainQuestionContextProvider","state","ref","className","clsx","AddonQuestion","PrimaryButton","TertiaryButton","onClick","FeedbackSuccess"],"mappings":"ypBAkBA,MAAMA,EAAwB,CAC1BC,MAAO,6BACPC,SACI,8HAeKC,EAA0B,EACnCC,MAAAA,EACAC,QAAAA,EACAC,KAAAA,EACAC,cAAAA,EACAC,eAAAA,EAAiBR,EACjBS,UAAAA,EACAC,SAAAA,MAEMC,MAAAA,EAAoBC,EAAgBF,IAElCG,qBAAAA,EAAsBC,iBAAAA,EAAkBC,cAAAA,GAC5CC,KACIC,aAAAA,EAAcC,aAAAA,EAAcC,gBAAAA,EAAiBC,UAAAA,GACjDT,GACGU,GAAoBC,OACN,IAAjBJ,GAGJK,GAAU,KACNV,EAAqBO,EAAS,GAC/B,CAACA,EAAWP,IAETW,MAAAA,EAAmBC,EAAoBnB,GAE7C,OAESoB,EAAAC,EAAA,CAAAzB,SAAA,EAACkB,GACGQ,EAAAC,EAAA,CAA4BC,MAAOnB,EAChCT,WAAC,OAAK,CAAAQ,SAAUO,EAAc,aAAYF,EACtCb,SAAA,CAAA0B,EAACJ,EAAA,CACGpB,MAAAA,EACAC,QAAAA,EACAI,UAAAA,IAEJiB,EAAC,MAAA,CACGK,IAAKV,EACLW,UAAWC,EAAK,CACZ,gCAAgC,EAChC,4CACqB,IAAjBf,IAGPhB,SAAA,CACGK,GAAAqB,EAACM,EAAA,CACGzB,UAC6B,iBAAlBF,EACDA,EAAcE,eACd,EAEVL,MAC6B,iBAAlBG,EACDA,EAAcH,WACd,IAIlBsB,EAAC,MAAI,CAAAM,UAAU,4CACX9B,SAAA,CAAC0B,EAAAO,EAAA,CAAcH,UAAU,wBAAwB9B,SAEjD,SACA0B,EAACQ,EAAA,CACG9B,KAAK,SACL+B,QAAS,IAAMlB,OAAgB,GAClCjB,SAAA,sBAQpBkB,IAAcN,GACVc,EAAAU,EAAA,IAAoB9B,MAE7B"}

package/build/es/components/feedback/main-question/mainQuestionContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mainQuestionContext.js","sources":["../../../../../src/components/feedback/main-question/mainQuestionContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport { WithChildren } from \"../../../core/types.js\";\nimport { FeedbackState } from \"../types.js\";\n\nconst mainQuestionContext = createContext<FeedbackState \| undefined>(undefined);\n\nexport const useMainQuestionContext = (): FeedbackState \| undefined =>\n useContext(mainQuestionContext);\n\ninterface Props extends WithChildren {\n state: FeedbackState;\n}\n\nexport const MainQuestionContextProvider: React.FC<Props> = ({\n state,\n children,\n}) => (\n <mainQuestionContext.Provider value={state}>\n {children}\n </mainQuestionContext.Provider>\n);\n"],"names":["mainQuestionContext","createContext","useMainQuestionContext","useContext","MainQuestionContextProvider","state","children","Provider","value"],"mappings":"8FAIA,MAAMA,EAAsBC,OAAyC,GAExDC,EAAyB,IAClCC,EAAWH,GAMFI,EAA+C,EACxDC,MAAAA,EACAC,SAAAA,OAECN,EAAoBO,SAApB,CAA6BC,MAAOH,EAChCC,SAAAA"}
1	+ {"version":3,"file":"mainQuestionContext.js","sources":["../../../../../src/components/feedback/main-question/mainQuestionContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport type { WithChildren } from \"../../../core/types.js\";\nimport type { FeedbackState } from \"../types.js\";\n\nconst mainQuestionContext = createContext<FeedbackState \| undefined>(undefined);\n\nexport const useMainQuestionContext = (): FeedbackState \| undefined =>\n useContext(mainQuestionContext);\n\ninterface Props extends WithChildren {\n state: FeedbackState;\n}\n\nexport const MainQuestionContextProvider: React.FC<Props> = ({\n state,\n children,\n}) => (\n <mainQuestionContext.Provider value={state}>\n {children}\n </mainQuestionContext.Provider>\n);\n"],"names":["mainQuestionContext","createContext","useMainQuestionContext","useContext","MainQuestionContextProvider","state","children","Provider","value"],"mappings":"8FAIA,MAAMA,EAAsBC,OAAyC,GAExDC,EAAyB,IAClCC,EAAWH,GAMFI,EAA+C,EACxDC,MAAAA,EACAC,SAAAA,OAECN,EAAoBO,SAApB,CAA6BC,MAAOH,EAChCC,SAAAA"}

package/build/es/components/feedback/main-question/useMainQuestion.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { SetStateAction, Dispatch, FormEventHandler } from 'react';
-import { FeedbackType, FeedbackOption } from '../types.js';
+import { Dispatch, FormEventHandler, SetStateAction } from 'react';
+import { FeedbackOption, FeedbackType } from '../types.js';
 type Value = FeedbackOption<string | number> | FeedbackOption<string | number>[] | undefined;
 type MainQuestion = {
     currentValue: Value;

package/build/es/components/feedback/main-question/useMainQuestion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useMainQuestion.js","sources":["../../../../../src/components/feedback/main-question/useMainQuestion.ts"],"sourcesContent":["import {\n ~~useState~~,\n ~~useRef~~,\n ~~useCallback~~,\n ~~useEffect~~,\n ~~SetStateAction~~,\n ~~Dispatch~~,\n ~~FormEventHandler~~,\n} from \"react\";\nimport { ~~FeedbackType~~, ~~FeedbackOption~~ } from \"../types.js\";\n\ntype Value =\n \| FeedbackOption<string \| number>\n \| FeedbackOption<string \| number>[]\n \| undefined;\n\ntype MainQuestion = {\n currentValue: Value;\n setCurrentValue: Dispatch<SetStateAction<Value>>;\n message: string \| undefined;\n setMessage: Dispatch<SetStateAction<string \| undefined>>;\n submitted: boolean;\n handleSubmit: FormEventHandler<HTMLFormElement>;\n};\n\nexport const useMainQuestion = (\n onSubmit: (f: FeedbackType) => void,\n): MainQuestion => {\n const [currentValue, setCurrentValue] = useState<\n FeedbackOption \| FeedbackOption[]\n >();\n const [message, setMessage] = useState<string>();\n const [submitted, setSubmitted] = useState(false);\n\n const feedbackRef = useRef({\n onSubmit,\n currentValue,\n message,\n submitted,\n });\n\n useEffect(() => {\n feedbackRef.current = {\n ...feedbackRef.current,\n onSubmit,\n currentValue,\n message,\n submitted,\n };\n }, [onSubmit, currentValue, message, submitted]);\n\n const submitHandler = useCallback((intentionalSubmit = true) => {\n const { message, currentValue, submitted, onSubmit } =\n feedbackRef.current;\n\n if (!submitted && currentValue !== undefined) {\n const feedbackValue = Array.isArray(currentValue)\n ? currentValue.map((option) => option.value)\n : currentValue?.value;\n onSubmit({\n feedbackValue,\n intentionalSubmit,\n ...(intentionalSubmit && message ? { message } : {}),\n });\n }\n }, []);\n\n const autoSubmit = useCallback(() => submitHandler(false), [submitHandler]);\n\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"beforeunload\", autoSubmit);\n }\n return () => {\n autoSubmit();\n window.removeEventListener(\"beforeunload\", autoSubmit);\n };\n }, [autoSubmit]);\n\n const handleSubmit: FormEventHandler<HTMLFormElement> = (e) => {\n e.preventDefault();\n submitHandler();\n setSubmitted(true);\n };\n\n return {\n currentValue,\n setCurrentValue,\n message,\n setMessage,\n submitted,\n handleSubmit,\n };\n};\n"],"names":["useMainQuestion","onSubmit","currentValue","setCurrentValue","useState","message","setMessage","submitted","setSubmitted","feedbackRef","useRef","useEffect","current","submitHandler","useCallback","intentionalSubmit","feedbackValue","Array","isArray","map","option","value","autoSubmit","window","addEventListener","removeEventListener","handleSubmit","e","preventDefault"],"mappings":"6EAyBa,MAAAA,EACTC,IAEM,MAACC,EAAcC,GAAmBC,KAGjCC,EAASC,GAAcF,KACvBG,EAAWC,GAAgBJ,GAAS,GAErCK,EAAcC,EAAO,CACvBT,SAAAA,EACAC,aAAAA,EACAG,QAAAA,EACAE,UAAAA,IAGJI,GAAU,KACNF,EAAYG,QAAU,IACfH,EAAYG,QACfX,SAAAA,EACAC,aAAAA,EACAG,QAAAA,EACAE,UAAAA,EAAA,GAEL,CAACN,EAAUC,EAAcG,EAASE,IAErC,MAAMM,EAAgBC,GAAY,CAACC,GAAoB,KAC7C,MAAEV,QAAAA,EAASH,aAAAA,EAAcK,UAAAA,EAAWN,SAAAA,GACtCQ,EAAYG,QAEZ,IAACL,QAA8B,IAAjBL,EAA4B,CAI1CD,EAAS,CACLe,cAJkBC,MAAMC,QAAQhB,GAC9BA,EAAaiB,KAAKC,GAAWA,EAAOC,QACpCnB,MAAAA,SAAAA,EAAcmB,MAGhBN,kBAAAA,KACIA,GAAqBV,EAAU,CAAEA,QAAAA,GAAY,CAAC,GAE1D,IACD,IAEGiB,EAAaR,GAAY,IAAMD,GAAc,IAAQ,CAACA,IAE5DF,OAAAA,GAAU,YACKY,OAAW,KACXA,OAAAC,iBAAiB,eAAgBF,GAErC,KACQA,IACJC,OAAAE,oBAAoB,eAAgBH,EAAU,IAE1D,CAACA,IAQG,CACHpB,aAAAA,EACAC,gBAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAmB,aAZqDC,IACrDA,EAAEC,iBACYf,IACdL,GAAa,EAAI,EASjB"}
1	+ {"version":3,"file":"useMainQuestion.js","sources":["../../../../../src/components/feedback/main-question/useMainQuestion.ts"],"sourcesContent":["import {\n type Dispatch,\n type FormEventHandler,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { FeedbackOption, FeedbackType } from \"../types.js\";\n\ntype Value =\n \| FeedbackOption<string \| number>\n \| FeedbackOption<string \| number>[]\n \| undefined;\n\ntype MainQuestion = {\n currentValue: Value;\n setCurrentValue: Dispatch<SetStateAction<Value>>;\n message: string \| undefined;\n setMessage: Dispatch<SetStateAction<string \| undefined>>;\n submitted: boolean;\n handleSubmit: FormEventHandler<HTMLFormElement>;\n};\n\nexport const useMainQuestion = (\n onSubmit: (f: FeedbackType) => void,\n): MainQuestion => {\n const [currentValue, setCurrentValue] = useState<\n FeedbackOption \| FeedbackOption[]\n >();\n const [message, setMessage] = useState<string>();\n const [submitted, setSubmitted] = useState(false);\n\n const feedbackRef = useRef({\n onSubmit,\n currentValue,\n message,\n submitted,\n });\n\n useEffect(() => {\n feedbackRef.current = {\n ...feedbackRef.current,\n onSubmit,\n currentValue,\n message,\n submitted,\n };\n }, [onSubmit, currentValue, message, submitted]);\n\n const submitHandler = useCallback((intentionalSubmit = true) => {\n const { message, currentValue, submitted, onSubmit } =\n feedbackRef.current;\n\n if (!submitted && currentValue !== undefined) {\n const feedbackValue = Array.isArray(currentValue)\n ? currentValue.map((option) => option.value)\n : currentValue?.value;\n onSubmit({\n feedbackValue,\n intentionalSubmit,\n ...(intentionalSubmit && message ? { message } : {}),\n });\n }\n }, []);\n\n const autoSubmit = useCallback(() => submitHandler(false), [submitHandler]);\n\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"beforeunload\", autoSubmit);\n }\n return () => {\n autoSubmit();\n window.removeEventListener(\"beforeunload\", autoSubmit);\n };\n }, [autoSubmit]);\n\n const handleSubmit: FormEventHandler<HTMLFormElement> = (e) => {\n e.preventDefault();\n submitHandler();\n setSubmitted(true);\n };\n\n return {\n currentValue,\n setCurrentValue,\n message,\n setMessage,\n submitted,\n handleSubmit,\n };\n};\n"],"names":["useMainQuestion","onSubmit","currentValue","setCurrentValue","useState","message","setMessage","submitted","setSubmitted","feedbackRef","useRef","useEffect","current","submitHandler","useCallback","intentionalSubmit","feedbackValue","Array","isArray","map","option","value","autoSubmit","window","addEventListener","removeEventListener","handleSubmit","e","preventDefault"],"mappings":"6EAyBa,MAAAA,EACTC,IAEM,MAACC,EAAcC,GAAmBC,KAGjCC,EAASC,GAAcF,KACvBG,EAAWC,GAAgBJ,GAAS,GAErCK,EAAcC,EAAO,CACvBT,SAAAA,EACAC,aAAAA,EACAG,QAAAA,EACAE,UAAAA,IAGJI,GAAU,KACNF,EAAYG,QAAU,IACfH,EAAYG,QACfX,SAAAA,EACAC,aAAAA,EACAG,QAAAA,EACAE,UAAAA,EAAA,GAEL,CAACN,EAAUC,EAAcG,EAASE,IAErC,MAAMM,EAAgBC,GAAY,CAACC,GAAoB,KAC7C,MAAEV,QAAAA,EAASH,aAAAA,EAAcK,UAAAA,EAAWN,SAAAA,GACtCQ,EAAYG,QAEZ,IAACL,QAA8B,IAAjBL,EAA4B,CAI1CD,EAAS,CACLe,cAJkBC,MAAMC,QAAQhB,GAC9BA,EAAaiB,KAAKC,GAAWA,EAAOC,QACpCnB,MAAAA,SAAAA,EAAcmB,MAGhBN,kBAAAA,KACIA,GAAqBV,EAAU,CAAEA,QAAAA,GAAY,CAAC,GAE1D,IACD,IAEGiB,EAAaR,GAAY,IAAMD,GAAc,IAAQ,CAACA,IAE5DF,OAAAA,GAAU,YACKY,OAAW,KACXA,OAAAC,iBAAiB,eAAgBF,GAErC,KACQA,IACJC,OAAAE,oBAAoB,eAAgBH,EAAU,IAE1D,CAACA,IAQG,CACHpB,aAAAA,EACAC,gBAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAmB,aAZqDC,IACrDA,EAAEC,iBACYf,IACdL,GAAa,EAAI,EASjB"}

package/build/es/components/feedback/presets.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"presets.js","sources":["../../../../src/components/feedback/presets.tsx"],"sourcesContent":["import { FeedbackProps } from \"./Feedback.js\";\nimport { defaultOptions as smileyOptions } from \"./questions/smileyUtils.js\";\n\nexport type PresetProperties = Pick<\n FeedbackProps,\n \"label\" \| \"type\" \| \"options\" \| \"addOnQuestion\"\n>;\n\nconst smileyQuestion: PresetProperties = {\n type: \"smiley\",\n label: \"Hvor fornøyd er du med denne nettsiden?\",\n options: smileyOptions,\n addOnQuestion: true,\n};\n\nexport const PRESETS: Record<string, PresetProperties> = {\n \"Fant du\": {\n type: \"radio\",\n label: \"Fant du det du lette etter?\",\n options: [\n {\n label: \"Ja\",\n value: \"ja\",\n textAreaLabel:\n \"Så bra! Har du noen tilbakemeldinger kan du skrive dem her.\",\n },\n {\n label: \"Nei\",\n value: \"nei\",\n textAreaLabel:\n \"Det var leit! Fortell oss gjerne hva du savner, så kan vi gjøre sidene våre bedre.\",\n },\n ],\n addOnQuestion: true,\n },\n \"Fikk du gjort\": {\n type: \"radio\",\n label: \"Fikk du gjort det du skulle?\",\n options: [\n {\n label: \"Ja\",\n value: \"ja\",\n textAreaLabel:\n \"Så bra! Har du noen tilbakemeldinger kan du skrive dem her.\",\n },\n {\n label: \"Nei\",\n value: \"nei\",\n textAreaLabel:\n \"Det var leit! Fortell oss gjerne hva du savner, så kan vi gjøre sidene våre bedre.\",\n },\n ],\n addOnQuestion: true,\n },\n \"Hvor fornøyd 5\": smileyQuestion,\n Smileys: smileyQuestion,\n};\n"],"names":["smileyQuestion","type","label","options","smileyOptions","addOnQuestion","PRESETS","value","textAreaLabel","Smileys"],"mappings":"4DAQA,MAAMA,EAAmC,CACrCC,KAAM,SACNC,MAAO,0CACPC,QAASC,EACTC,eAAe,GAGNC,EAA4C,CACrD,UAAW,CACPL,KAAM,QACNC,MAAO,8BACPC,QAAS,CACL,CACID,MAAO,KACPK,MAAO,KACPC,cACI,+DAER,CACIN,MAAO,MACPK,MAAO,MACPC,cACI,uFAGZH,eAAe,GAEnB,gBAAiB,CACbJ,KAAM,QACNC,MAAO,+BACPC,QAAS,CACL,CACID,MAAO,KACPK,MAAO,KACPC,cACI,+DAER,CACIN,MAAO,MACPK,MAAO,MACPC,cACI,uFAGZH,eAAe,GAEnB,iBAAkBL,EAClBS,QAAST"}
1	+ {"version":3,"file":"presets.js","sources":["../../../../src/components/feedback/presets.tsx"],"sourcesContent":["import type { FeedbackProps } from \"./Feedback.js\";\nimport { defaultOptions as smileyOptions } from \"./questions/smileyUtils.js\";\n\nexport type PresetProperties = Pick<\n FeedbackProps,\n \"label\" \| \"type\" \| \"options\" \| \"addOnQuestion\"\n>;\n\nconst smileyQuestion: PresetProperties = {\n type: \"smiley\",\n label: \"Hvor fornøyd er du med denne nettsiden?\",\n options: smileyOptions,\n addOnQuestion: true,\n};\n\nexport const PRESETS: Record<string, PresetProperties> = {\n \"Fant du\": {\n type: \"radio\",\n label: \"Fant du det du lette etter?\",\n options: [\n {\n label: \"Ja\",\n value: \"ja\",\n textAreaLabel:\n \"Så bra! Har du noen tilbakemeldinger kan du skrive dem her.\",\n },\n {\n label: \"Nei\",\n value: \"nei\",\n textAreaLabel:\n \"Det var leit! Fortell oss gjerne hva du savner, så kan vi gjøre sidene våre bedre.\",\n },\n ],\n addOnQuestion: true,\n },\n \"Fikk du gjort\": {\n type: \"radio\",\n label: \"Fikk du gjort det du skulle?\",\n options: [\n {\n label: \"Ja\",\n value: \"ja\",\n textAreaLabel:\n \"Så bra! Har du noen tilbakemeldinger kan du skrive dem her.\",\n },\n {\n label: \"Nei\",\n value: \"nei\",\n textAreaLabel:\n \"Det var leit! Fortell oss gjerne hva du savner, så kan vi gjøre sidene våre bedre.\",\n },\n ],\n addOnQuestion: true,\n },\n \"Hvor fornøyd 5\": smileyQuestion,\n Smileys: smileyQuestion,\n};\n"],"names":["smileyQuestion","type","label","options","smileyOptions","addOnQuestion","PRESETS","value","textAreaLabel","Smileys"],"mappings":"4DAQA,MAAMA,EAAmC,CACrCC,KAAM,SACNC,MAAO,0CACPC,QAASC,EACTC,eAAe,GAGNC,EAA4C,CACrD,UAAW,CACPL,KAAM,QACNC,MAAO,8BACPC,QAAS,CACL,CACID,MAAO,KACPK,MAAO,KACPC,cACI,+DAER,CACIN,MAAO,MACPK,MAAO,MACPC,cACI,uFAGZH,eAAe,GAEnB,gBAAiB,CACbJ,KAAM,QACNC,MAAO,+BACPC,QAAS,CACL,CACID,MAAO,KACPK,MAAO,KACPC,cACI,+DAER,CACIN,MAAO,MACPK,MAAO,MACPC,cACI,uFAGZH,eAAe,GAEnB,iBAAkBL,EAClBS,QAAST"}

package/build/es/components/feedback/questions/AddonQuestion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AddonQuestion.js","sources":["../../../../../src/components/feedback/questions/AddonQuestion.tsx"],"sourcesContent":["import React, { ChangeEventHandler, useEffect, useState } from \"react\";\nimport { TextArea } from \"../../text-area/TextArea.js\";\nimport { useFeedbackContext } from \"../feedbackContext.js\";\nimport { useMainQuestionContext } from \"../main-question/mainQuestionContext.js\";\n\ninterface Props {\n label?: string;\n helpLabel?: string;\n}\n\nexport const AddonQuestion: React.FC<Props> = ({\n helpLabel = \"Ikke skriv personlige opplysninger. Tilbakemeldinger som kommer inn her blir ikke besvart, men brukt i videre arbeid med å forbedre tjenestene våre.\",\n label,\n}) => {\n const { counter } = useFeedbackContext();\n const context = useMainQuestionContext();\n const [dynamicLabel, setDynamicLabel] = useState<string>();\n\n useEffect(() => {\n const labelFromValue = Array.isArray(context?.currentValue)\n ? context?.currentValue[0].textAreaLabel?.toString()\n : context?.currentValue?.textAreaLabel?.toString();\n setDynamicLabel(labelFromValue \|\| label);\n }, [context?.currentValue, label]);\n\n if (!context) {\n console.error(\n \"Addon question must be used inside a MainQuestion context provider\",\n );\n return null;\n }\n\n const { message, setMessage } = context;\n const handleChange: ChangeEventHandler<HTMLTextAreaElement> = (e) =>\n setMessage(e.target.value);\n\n return (\n <>\n {context.currentValue !== undefined && (\n <div className=\"jkl-sr-only\" aria-live=\"polite\">\n {dynamicLabel} {helpLabel}\n </div>\n )}\n <TextArea\n startOpen\n rows={4}\n data-testid=\"jkl-feedback__open-question\"\n className=\"jkl-spacing-xl--bottom jkl-spacing-xl--top\"\n label={dynamicLabel}\n labelProps={{ srOnly: true }}\n placeholder={dynamicLabel}\n helpLabel={helpLabel}\n value={message \|\| \"\"}\n onChange={handleChange}\n counter={counter}\n />\n </>\n );\n};\n"],"names":["AddonQuestion","helpLabel","label","counter","useFeedbackContext","context","useMainQuestionContext","dynamicLabel","setDynamicLabel","useState","useEffect","labelFromValue","Array","isArray","currentValue","_a","textAreaLabel","toString","_c","_b","console","error","message","setMessage","jsxs","Fragment","children","className","jsx","TextArea","startOpen","rows","labelProps","srOnly","placeholder","value","onChange","e","target"],"mappings":"mTAUO,MAAMA,EAAiC,EAC1CC,UAAAA,EAAY,uJACZC,MAAAA,MAEM,MAAEC,QAAAA,GAAYC,IACdC,EAAUC,KACTC,EAAcC,GAAmBC,IASxC,GAPAC,GAAU,eACN,MAAMC,EAAiBC,MAAMC,QAAQ,MAAAR,OAAAA,EAAAA,EAASS,cACxC,OAAAC,EAAA,MAAAV,OAAAA,EAAAA,EAASS,aAAa,GAAGE,oBAAzB,EAAAD,EAAwCE,WACxC,OAAAC,EAAA,OAAAC,EAAA,MAAAd,OAAA,EAAAA,EAASS,mBAATK,EAAAA,EAAuBH,oBAAvB,EAAAE,EAAsCD,WAC5CT,EAAgBG,GAAkBT,EAAK,GACxC,CAAC,MAAAG,OAAA,EAAAA,EAASS,aAAcZ,KAEtBG,EACO,OAAAe,QAAAC,MACJ,sEAEG,KAGL,MAAEC,QAAAA,EAASC,WAAAA,GAAelB,EAIhC,OAESmB,EAAAC,EAAA,CAAAC,SAAA,MAAyB,IAAzBrB,EAAQS,cACLU,EAAC,OAAIG,UAAU,cAAc,YAAU,SAClCD,SAAA,CAAAnB,EAAa,IAAEN,KAGxB2B,EAACC,EAAA,CACGC,WAAS,EACTC,KAAM,EACN,cAAY,8BACZJ,UAAU,6CACVzB,MAAOK,EACPyB,WAAY,CAAEC,QAAQ,GACtBC,YAAa3B,EACbN,UAAAA,EACAkC,MAAOb,GAAW,GAClBc,SApBmDC,GAC3Dd,EAAWc,EAAEC,OAAOH,OAoBZhC,QAAAA,MAER"}
1	+ {"version":3,"file":"AddonQuestion.js","sources":["../../../../../src/components/feedback/questions/AddonQuestion.tsx"],"sourcesContent":["import React, { type ChangeEventHandler, useEffect, useState } from \"react\";\nimport { TextArea } from \"../../text-area/TextArea.js\";\nimport { useFeedbackContext } from \"../feedbackContext.js\";\nimport { useMainQuestionContext } from \"../main-question/mainQuestionContext.js\";\n\ninterface Props {\n label?: string;\n helpLabel?: string;\n}\n\nexport const AddonQuestion: React.FC<Props> = ({\n helpLabel = \"Ikke skriv personlige opplysninger. Tilbakemeldinger som kommer inn her blir ikke besvart, men brukt i videre arbeid med å forbedre tjenestene våre.\",\n label,\n}) => {\n const { counter } = useFeedbackContext();\n const context = useMainQuestionContext();\n const [dynamicLabel, setDynamicLabel] = useState<string>();\n\n useEffect(() => {\n const labelFromValue = Array.isArray(context?.currentValue)\n ? context?.currentValue[0].textAreaLabel?.toString()\n : context?.currentValue?.textAreaLabel?.toString();\n setDynamicLabel(labelFromValue \|\| label);\n }, [context?.currentValue, label]);\n\n if (!context) {\n console.error(\n \"Addon question must be used inside a MainQuestion context provider\",\n );\n return null;\n }\n\n const { message, setMessage } = context;\n const handleChange: ChangeEventHandler<HTMLTextAreaElement> = (e) =>\n setMessage(e.target.value);\n\n return (\n <>\n {context.currentValue !== undefined && (\n <div className=\"jkl-sr-only\" aria-live=\"polite\">\n {dynamicLabel} {helpLabel}\n </div>\n )}\n <TextArea\n startOpen\n rows={4}\n data-testid=\"jkl-feedback__open-question\"\n className=\"jkl-spacing-xl--bottom jkl-spacing-xl--top\"\n label={dynamicLabel}\n labelProps={{ srOnly: true }}\n placeholder={dynamicLabel}\n helpLabel={helpLabel}\n value={message \|\| \"\"}\n onChange={handleChange}\n counter={counter}\n />\n </>\n );\n};\n"],"names":["AddonQuestion","helpLabel","label","counter","useFeedbackContext","context","useMainQuestionContext","dynamicLabel","setDynamicLabel","useState","useEffect","labelFromValue","Array","isArray","currentValue","_a","textAreaLabel","toString","_c","_b","console","error","message","setMessage","jsxs","Fragment","children","className","jsx","TextArea","startOpen","rows","labelProps","srOnly","placeholder","value","onChange","e","target"],"mappings":"mTAUO,MAAMA,EAAiC,EAC1CC,UAAAA,EAAY,uJACZC,MAAAA,MAEM,MAAEC,QAAAA,GAAYC,IACdC,EAAUC,KACTC,EAAcC,GAAmBC,IASxC,GAPAC,GAAU,eACN,MAAMC,EAAiBC,MAAMC,QAAQ,MAAAR,OAAAA,EAAAA,EAASS,cACxC,OAAAC,EAAA,MAAAV,OAAAA,EAAAA,EAASS,aAAa,GAAGE,oBAAzB,EAAAD,EAAwCE,WACxC,OAAAC,EAAA,OAAAC,EAAA,MAAAd,OAAA,EAAAA,EAASS,mBAATK,EAAAA,EAAuBH,oBAAvB,EAAAE,EAAsCD,WAC5CT,EAAgBG,GAAkBT,EAAK,GACxC,CAAC,MAAAG,OAAA,EAAAA,EAASS,aAAcZ,KAEtBG,EACO,OAAAe,QAAAC,MACJ,sEAEG,KAGL,MAAEC,QAAAA,EAASC,WAAAA,GAAelB,EAIhC,OAESmB,EAAAC,EAAA,CAAAC,SAAA,MAAyB,IAAzBrB,EAAQS,cACLU,EAAC,OAAIG,UAAU,cAAc,YAAU,SAClCD,SAAA,CAAAnB,EAAa,IAAEN,KAGxB2B,EAACC,EAAA,CACGC,WAAS,EACTC,KAAM,EACN,cAAY,8BACZJ,UAAU,6CACVzB,MAAOK,EACPyB,WAAY,CAAEC,QAAQ,GACtBC,YAAa3B,EACbN,UAAAA,EACAkC,MAAOb,GAAW,GAClBc,SApBmDC,GAC3Dd,EAAWc,EAAEC,OAAOH,OAoBZhC,QAAAA,MAER"}

package/build/es/components/feedback/questions/CheckboxQuestion.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{useRef as o,useEffect as r}from"react";import{Checkbox as t}from"../../checkbox/Checkbox.js";import{FieldGroup as n}from"../../input-group/FieldGroup.js";import{useFollowUpContext as l}from"../followup/followupContext.js";import{useMainQuestionContext as u}from"../main-question/mainQuestionContext.js";const a=({label:a,name:s,options:i,helpLabel:c,autoFocus:p=!1})=>{const f=l(),m=u(),d=f||m,v=o(null);r((()=>{p&&v.current&&v.current.focus()}),[p,v]);const x=e=>{const{value:o}=e.target,r=null==i?void 0:i.find((e=>e.value.toString()===o));if(r){if(null==d||!d.currentValue)return void(null==d||d.setCurrentValue([r]));if(Array.isArray(null==d?void 0:d.currentValue)){const e=d.currentValue.find((e=>e===r));e?d.setCurrentValue((o=>o.filter((o=>o!==e)))):d.setCurrentValue((e=>[...e,r]))}}};return d?e(n,{labelProps:{variant:"large"},legend:a,helpLabel:c,children:null==i?void 0:i.map(((o,r)=>e(t,{name:s||a,value:o.value.toString(),onChange:x,ref:0===r?v:void 0,children:o.label},`${a}-${o.value}`)))}):(console.error("Questions must be used inside a Followup or Feedback context provider"),null)};export{a as CheckboxQuestion};
+import{jsx as e}from"react/jsx-runtime";import{useRef as o,useEffect as r}from"react";import{Checkbox as t}from"../../checkbox/Checkbox.js";import{FieldGroup as n}from"../../input-group/FieldGroup.js";import{useFollowUpContext as l}from"../followup/followupContext.js";import{useMainQuestionContext as u}from"../main-question/mainQuestionContext.js";const a=({label:a,name:s,options:i,helpLabel:c,autoFocus:p=!1})=>{const f=l(),m=u(),d=f||m,v=o(null);r((()=>{p&&v.current&&v.current.focus()}),[p]);const x=e=>{const{value:o}=e.target,r=null==i?void 0:i.find((e=>e.value.toString()===o));if(r){if(null==d||!d.currentValue)return void(null==d||d.setCurrentValue([r]));if(Array.isArray(null==d?void 0:d.currentValue)){const e=d.currentValue.find((e=>e===r));e?d.setCurrentValue((o=>o.filter((o=>o!==e)))):d.setCurrentValue((e=>[...e,r]))}}};return d?e(n,{labelProps:{variant:"large"},legend:a,helpLabel:c,children:null==i?void 0:i.map(((o,r)=>e(t,{name:s||a,value:o.value.toString(),onChange:x,ref:0===r?v:void 0,children:o.label},`${a}-${o.value}`)))}):(console.error("Questions must be used inside a Followup or Feedback context provider"),null)};export{a as CheckboxQuestion};
 //# sourceMappingURL=CheckboxQuestion.js.map

package/build/es/components/feedback/questions/CheckboxQuestion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxQuestion.js","sources":["../../../../../src/components/feedback/questions/CheckboxQuestion.tsx"],"sourcesContent":["import React, { ChangeEventHandler, useEffect, useRef } from \"react\";\nimport { Checkbox } from \"../../checkbox/Checkbox.js\";\nimport { FieldGroup } from \"../../input-group/FieldGroup.js\";\nimport { useFollowUpContext } from \"../followup/followupContext.js\";\nimport { useMainQuestionContext } from \"../main-question/mainQuestionContext.js\";\nimport { FeedbackOption, QuestionProps } from \"../types.js\";\n\nexport const CheckboxQuestion: React.FC<QuestionProps> = ({\n label,\n name,\n options,\n helpLabel,\n autoFocus = false,\n}) => {\n const followupContext = useFollowUpContext();\n const feedbackContext = useMainQuestionContext();\n const context = followupContext \|\| feedbackContext;\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (autoFocus && ref.current) {\n ref.current.focus();\n }\n }, [autoFocus~~, ref~~]);\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const { value } = event.target;\n const matchingOption = options?.find(\n (option) => option.value.toString() === value,\n );\n if (!matchingOption) return;\n\n if (!context?.currentValue) {\n context?.setCurrentValue([matchingOption]);\n return;\n }\n\n if (Array.isArray(context?.currentValue)) {\n const found = context.currentValue.find(\n (option) => option === matchingOption,\n );\n if (found) {\n context.setCurrentValue((oldValues) =>\n (oldValues as FeedbackOption[]).filter(\n (option) => option !== found,\n ),\n );\n } else {\n context.setCurrentValue((oldValues) => [\n ...(oldValues as FeedbackOption[]),\n matchingOption,\n ]);\n }\n }\n };\n\n if (!context) {\n console.error(\n \"Questions must be used inside a Followup or Feedback context provider\",\n );\n return null;\n }\n\n return (\n <FieldGroup\n labelProps={{ variant: \"large\" }}\n legend={label}\n helpLabel={helpLabel}\n >\n {options?.map((option, i) => (\n <Checkbox\n key={`${label}-${option.value}`}\n name={name \|\| label}\n value={option.value.toString()}\n onChange={handleChange}\n ref={i === 0 ? ref : undefined}\n >\n {option.label}\n </Checkbox>\n ))}\n </FieldGroup>\n );\n};\n"],"names":["CheckboxQuestion","label","name","options","helpLabel","autoFocus","followupContext","useFollowUpContext","feedbackContext","useMainQuestionContext","context","ref","useRef","useEffect","current","focus","handleChange","event","value","target","matchingOption","find","option","toString","currentValue","setCurrentValue","Array","isArray","found","oldValues","filter","jsx","FieldGroup","labelProps","variant","legend","children","map","i","Checkbox","onChange","console","error"],"mappings":"8VAOO,MAAMA,EAA4C,EACrDC,MAAAA,EACAC,KAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,UAAAA,GAAY,MAENC,MAAAA,EAAkBC,IAClBC,EAAkBC,IAClBC,EAAUJ,GAAmBE,EAC7BG,EAAMC,EAAyB,MAErCC,GAAU,KACFR,GAAaM,EAAIG,SACjBH,EAAIG,QAAQC,UAEjB,CAACV,~~EAAWM~~,~~IAETK,~~MAAAA,EAAsDC,IAClD,MAAEC,MAAAA,GAAUD,EAAME,OAClBC,EAAiB,MAAAjB,OAAA,EAAAA,EAASkB,MAC3BC,GAAWA,EAAOJ,MAAMK,aAAeL,IAE5C,GAAKE,EAED,CAAA,GAAC,MAAAV,IAAAA,EAASc,aAEV,YADS,MAAAd,GAAAA,EAAAe,gBAAgB,CAACL,KAI9B,GAAIM,MAAMC,QAAQ,MAAAjB,OAAAA,EAAAA,EAASc,cAAe,CAChCI,MAAAA,EAAQlB,EAAQc,aAAaH,MAC9BC,GAAWA,IAAWF,IAEvBQ,EACQlB,EAAAe,iBAAiBI,GACpBA,EAA+BC,QAC3BR,GAAWA,IAAWM,MAIvBlB,EAAAe,iBAAiBI,GAAc,IAC/BA,EACJT,IAGZ,CAAA,GAGJ,OAAKV,EAQDqB,EAACC,EAAA,CACGC,WAAY,CAAEC,QAAS,SACvBC,OAAQlC,EACRG,UAAAA,EAECgC,SAAS,MAAAjC,OAAAA,EAAAA,EAAAkC,KAAI,CAACf,EAAQgB,IACnBP,EAACQ,EAAA,CAEGrC,KAAMA,GAAQD,EACdiB,MAAOI,EAAOJ,MAAMK,WACpBiB,SAAUxB,EACVL,IAAW,IAAN2B,EAAU3B,OAAM,EAEpByB,SAAOd,EAAArB,OANH,GAAGA,KAASqB,EAAOJ,cAd5BuB,QAAAC,MACJ,yEAEG,KAAA"}
1	+ {"version":3,"file":"CheckboxQuestion.js","sources":["../../../../../src/components/feedback/questions/CheckboxQuestion.tsx"],"sourcesContent":["import React, { type ChangeEventHandler, useEffect, useRef } from \"react\";\nimport { Checkbox } from \"../../checkbox/Checkbox.js\";\nimport { FieldGroup } from \"../../input-group/FieldGroup.js\";\nimport { useFollowUpContext } from \"../followup/followupContext.js\";\nimport { useMainQuestionContext } from \"../main-question/mainQuestionContext.js\";\nimport type { FeedbackOption, QuestionProps } from \"../types.js\";\n\nexport const CheckboxQuestion: React.FC<QuestionProps> = ({\n label,\n name,\n options,\n helpLabel,\n autoFocus = false,\n}) => {\n const followupContext = useFollowUpContext();\n const feedbackContext = useMainQuestionContext();\n const context = followupContext \|\| feedbackContext;\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (autoFocus && ref.current) {\n ref.current.focus();\n }\n }, [autoFocus]);\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const { value } = event.target;\n const matchingOption = options?.find(\n (option) => option.value.toString() === value,\n );\n if (!matchingOption) return;\n\n if (!context?.currentValue) {\n context?.setCurrentValue([matchingOption]);\n return;\n }\n\n if (Array.isArray(context?.currentValue)) {\n const found = context.currentValue.find(\n (option) => option === matchingOption,\n );\n if (found) {\n context.setCurrentValue((oldValues) =>\n (oldValues as FeedbackOption[]).filter(\n (option) => option !== found,\n ),\n );\n } else {\n context.setCurrentValue((oldValues) => [\n ...(oldValues as FeedbackOption[]),\n matchingOption,\n ]);\n }\n }\n };\n\n if (!context) {\n console.error(\n \"Questions must be used inside a Followup or Feedback context provider\",\n );\n return null;\n }\n\n return (\n <FieldGroup\n labelProps={{ variant: \"large\" }}\n legend={label}\n helpLabel={helpLabel}\n >\n {options?.map((option, i) => (\n <Checkbox\n key={`${label}-${option.value}`}\n name={name \|\| label}\n value={option.value.toString()}\n onChange={handleChange}\n ref={i === 0 ? ref : undefined}\n >\n {option.label}\n </Checkbox>\n ))}\n </FieldGroup>\n );\n};\n"],"names":["CheckboxQuestion","label","name","options","helpLabel","autoFocus","followupContext","useFollowUpContext","feedbackContext","useMainQuestionContext","context","ref","useRef","useEffect","current","focus","handleChange","event","value","target","matchingOption","find","option","toString","currentValue","setCurrentValue","Array","isArray","found","oldValues","filter","jsx","FieldGroup","labelProps","variant","legend","children","map","i","Checkbox","onChange","console","error"],"mappings":"8VAOO,MAAMA,EAA4C,EACrDC,MAAAA,EACAC,KAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,UAAAA,GAAY,MAENC,MAAAA,EAAkBC,IAClBC,EAAkBC,IAClBC,EAAUJ,GAAmBE,EAC7BG,EAAMC,EAAyB,MAErCC,GAAU,KACFR,GAAaM,EAAIG,SACjBH,EAAIG,QAAQC,UAEjB,CAACV,IAEEW,MAAAA,EAAsDC,IAClD,MAAEC,MAAAA,GAAUD,EAAME,OAClBC,EAAiB,MAAAjB,OAAA,EAAAA,EAASkB,MAC3BC,GAAWA,EAAOJ,MAAMK,aAAeL,IAE5C,GAAKE,EAED,CAAA,GAAC,MAAAV,IAAAA,EAASc,aAEV,YADS,MAAAd,GAAAA,EAAAe,gBAAgB,CAACL,KAI9B,GAAIM,MAAMC,QAAQ,MAAAjB,OAAAA,EAAAA,EAASc,cAAe,CAChCI,MAAAA,EAAQlB,EAAQc,aAAaH,MAC9BC,GAAWA,IAAWF,IAEvBQ,EACQlB,EAAAe,iBAAiBI,GACpBA,EAA+BC,QAC3BR,GAAWA,IAAWM,MAIvBlB,EAAAe,iBAAiBI,GAAc,IAC/BA,EACJT,IAGZ,CAAA,GAGJ,OAAKV,EAQDqB,EAACC,EAAA,CACGC,WAAY,CAAEC,QAAS,SACvBC,OAAQlC,EACRG,UAAAA,EAECgC,SAAS,MAAAjC,OAAAA,EAAAA,EAAAkC,KAAI,CAACf,EAAQgB,IACnBP,EAACQ,EAAA,CAEGrC,KAAMA,GAAQD,EACdiB,MAAOI,EAAOJ,MAAMK,WACpBiB,SAAUxB,EACVL,IAAW,IAAN2B,EAAU3B,OAAM,EAEpByB,SAAOd,EAAArB,OANH,GAAGA,KAASqB,EAAOJ,cAd5BuB,QAAAC,MACJ,yEAEG,KAAA"}

package/build/es/components/feedback/questions/ContactQuestion.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as a,useRef as r,useEffect as n}from"react";import{isValidEpost as o}from"../../../utilities/validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as l}from"../../../utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js";import{PrimaryButton as s,TertiaryButton as i}from"../../button/Button.js";import{TextInput as m}from"../../text-input/TextInput.js";import{useFeedbackContext as d}from"../feedbackContext.js";import{FeedbackSuccess as p}from"../FeedbackSuccess.js";const u={title:"Takk for tiden din!",children:"Neste gang vi gjennomfører intervjuer og tester kan det hende vi tar kontakt med deg. Dine innspill hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem."},c=({label:c="Kan vi kontakte deg for flere innspill?",sendButtonLabel:f="Sett meg på lista!",withPhone:k=!1,onSubmit:g,successMessage:v=u,children:b})=>{const[h,j]=a(""),[x,E]=a(""),[S,C]=a({}),N=r(null),T=r(null),[y,V]=a(!1),[B,D]=a(!1),{contactSubmitted:L,setContactSubmitted:P,landmarkLabel:F}=d(),I="string"==typeof b?"p":"div",w=(e,t)=>{const a=(e=>e&&""!==e?o(e)?void 0:"Skriv inn en gyldig e-postadresse":"Du må oppgi e-postadresse for at vi kan kontakte deg")(e),r=(e=>e&&""!==e?l(e)?void 0:"Skriv inn et gyldig telefonnummer":"Du må oppgi telefonnummer for at vi kan kontakte deg")(t);return C({email:a,phone:r}),{emailError:a,phoneError:r}};n((()=>{if(y){const{emailError:e,phoneError:t}=w(h,x);!e&&(!k||!t)&&V(!1)}}),[h,x,y,k]);const K=e=>t=>e(t.target.value);return B?null:L?e(p,{...v}):t("form",{className:"jkl-spacing-xl--top",onSubmit:e=>{var t,a;e.preventDefault();const{emailError:r,phoneError:n}=w(h,x);return r?(V(!0),void(null==(t=N.current)||t.focus())):k&&n?(V(!0),void(null==(a=T.current)||a.focus())):(g({email:h,phone:k?x:void 0}),void P(!0))},"aria-label":F,children:[e("p",{className:"jkl-heading-4 jkl-spacing-xs--bottom",children:c}),b&&e(I,{className:"jkl-body",children:b}),e(m,{ref:N,className:"jkl-spacing-l--top",label:"E-post",labelProps:{variant:"small"},autoComplete:"email",name:"email",value:h,onChange:K(j),errorLabel:S.email}),k&&e(m,{ref:T,className:"jkl-spacing-l--top",label:"Telefonnummer",labelProps:{variant:"small"},autoComplete:"tel",name:"phone",value:x,onChange:K(E),errorLabel:S.phone}),t("div",{className:"jkl-spacing-xl--top",children:[e(s,{type:"submit",className:"jkl-spacing-xl--right",children:f}),e(i,{onClick:()=>D(!0),children:"Nei takk"})]})]})};export{c as ContactQuestion};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as a,useRef as r,useCallback as n,useEffect as o}from"react";import{isValidEpost as l}from"../../../utilities/validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as s}from"../../../utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js";import{PrimaryButton as i,TertiaryButton as m}from"../../button/Button.js";import{TextInput as d}from"../../text-input/TextInput.js";import{FeedbackSuccess as u}from"../FeedbackSuccess.js";import{useFeedbackContext as p}from"../feedbackContext.js";const c={title:"Takk for tiden din!",children:"Neste gang vi gjennomfører intervjuer og tester kan det hende vi tar kontakt med deg. Dine innspill hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem."},f=({label:f="Kan vi kontakte deg for flere innspill?",sendButtonLabel:k="Sett meg på lista!",withPhone:g=!1,onSubmit:b,successMessage:v=c,children:h})=>{const[j,x]=a(""),[E,C]=a(""),[S,N]=a({}),T=r(null),y=r(null),[V,B]=a(!1),[D,L]=a(!1),{contactSubmitted:P,setContactSubmitted:F,landmarkLabel:I}=p(),w="string"==typeof h?"p":"div",K=n(((e,t)=>{const a=(e=>e&&""!==e?l(e)?void 0:"Skriv inn en gyldig e-postadresse":"Du må oppgi e-postadresse for at vi kan kontakte deg")(e),r=(e=>e&&""!==e?s(e)?void 0:"Skriv inn et gyldig telefonnummer":"Du må oppgi telefonnummer for at vi kan kontakte deg")(t);return N({email:a,phone:r}),{emailError:a,phoneError:r}}),[]);o((()=>{if(V){const{emailError:e,phoneError:t}=K(j,E);!e&&(!g||!t)&&B(!1)}}),[j,E,V,g,K]);const M=e=>t=>e(t.target.value);return D?null:P?e(u,{...v}):t("form",{className:"jkl-spacing-xl--top",onSubmit:e=>{var t,a;e.preventDefault();const{emailError:r,phoneError:n}=K(j,E);return r?(B(!0),void(null==(t=T.current)||t.focus())):g&&n?(B(!0),void(null==(a=y.current)||a.focus())):(b({email:j,phone:g?E:void 0}),void F(!0))},"aria-label":I,children:[e("p",{className:"jkl-heading-4 jkl-spacing-xs--bottom",children:f}),h&&e(w,{className:"jkl-body",children:h}),e(d,{ref:T,className:"jkl-spacing-l--top",label:"E-post",labelProps:{variant:"small"},autoComplete:"email",name:"email",value:j,onChange:M(x),errorLabel:S.email}),g&&e(d,{ref:y,className:"jkl-spacing-l--top",label:"Telefonnummer",labelProps:{variant:"small"},autoComplete:"tel",name:"phone",value:E,onChange:M(C),errorLabel:S.phone}),t("div",{className:"jkl-spacing-xl--top",children:[e(i,{type:"submit",className:"jkl-spacing-xl--right",children:k}),e(m,{onClick:()=>L(!0),children:"Nei takk"})]})]})};export{f as ContactQuestion};
 //# sourceMappingURL=ContactQuestion.js.map