@fremtind/jokul 0.27.0 → 0.27.2

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 (512) hide show
  1. package/build/build-stats.html +1 -1
  2. package/build/cjs/components/ScreenReaderOnly.cjs.map +1 -1
  3. package/build/cjs/components/accordion/Accordion.cjs.map +1 -1
  4. package/build/cjs/components/accordion/AccordionItem.cjs.map +1 -1
  5. package/build/cjs/components/breadcrumb/Breadcrumb.cjs.map +1 -1
  6. package/build/cjs/components/breadcrumb/BreadcrumbItem.cjs.map +1 -1
  7. package/build/cjs/components/button/Button.cjs.map +1 -1
  8. package/build/cjs/components/button/index.d.cts +1 -1
  9. package/build/cjs/components/button/types.cjs.map +1 -1
  10. package/build/cjs/components/card/Card.cjs.map +1 -1
  11. package/build/cjs/components/card/CardImage.cjs.map +1 -1
  12. package/build/cjs/components/card/InfoCard.cjs.map +1 -1
  13. package/build/cjs/components/card/NavCard.cjs.map +1 -1
  14. package/build/cjs/components/card/TaskCard.cjs.map +1 -1
  15. package/build/cjs/components/card/documentation/examples/FakturainfoExample.d.cts +1 -1
  16. package/build/cjs/components/card/documentation/examples/StatuskortExample.d.cts +1 -1
  17. package/build/cjs/components/card/types.cjs.map +1 -1
  18. package/build/cjs/components/card/utils.cjs.map +1 -1
  19. package/build/cjs/components/checkbox/Checkbox.cjs.map +1 -1
  20. package/build/cjs/components/combobox/Combobox.cjs.map +1 -1
  21. package/build/cjs/components/combobox/index.d.cts +1 -1
  22. package/build/cjs/components/cookie-consent/CookieConsent.cjs.map +1 -1
  23. package/build/cjs/components/cookie-consent/CookieConsentContext.cjs.map +1 -1
  24. package/build/cjs/components/cookie-consent/CookieConsentModal.cjs.map +1 -1
  25. package/build/cjs/components/cookie-consent/consents/CustomConsents.cjs.map +1 -1
  26. package/build/cjs/components/cookie-consent/consents/DefaultConsents.cjs.map +1 -1
  27. package/build/cjs/components/cookie-consent/consents/RequirementCheckbox.cjs.map +1 -1
  28. package/build/cjs/components/cookie-consent/consents/RequirementCheckbox.d.cts +1 -1
  29. package/build/cjs/components/cookie-consent/cookieConsentUtils.cjs.map +1 -1
  30. package/build/cjs/components/cookie-consent/cookieConsentUtils.d.cts +1 -1
  31. package/build/cjs/components/cookie-consent/index.d.cts +1 -1
  32. package/build/cjs/components/datepicker/DatePicker.cjs.map +1 -1
  33. package/build/cjs/components/datepicker/internal/Calendar.cjs.map +1 -1
  34. package/build/cjs/components/datepicker/internal/calendarReducer.cjs.map +1 -1
  35. package/build/cjs/components/datepicker/internal/useCalendar.cjs.map +1 -1
  36. package/build/cjs/components/datepicker/internal/utils.cjs.map +1 -1
  37. package/build/cjs/components/datepicker/internal/utils.d.cts +2 -2
  38. package/build/cjs/components/datepicker/utils.cjs.map +1 -1
  39. package/build/cjs/components/description-list/DescriptionList.cjs.map +1 -1
  40. package/build/cjs/components/expander/ExpandSection.cjs.map +1 -1
  41. package/build/cjs/components/expander/Expander.cjs.map +1 -1
  42. package/build/cjs/components/feedback/Feedback.cjs.map +1 -1
  43. package/build/cjs/components/feedback/FeedbackSuccess.cjs.map +1 -1
  44. package/build/cjs/components/feedback/FeedbackValues.cjs.map +1 -1
  45. package/build/cjs/components/feedback/feedbackContext.cjs.map +1 -1
  46. package/build/cjs/components/feedback/followup/Followup.cjs.map +1 -1
  47. package/build/cjs/components/feedback/followup/followupContext.cjs.map +1 -1
  48. package/build/cjs/components/feedback/followup/useFollowup.cjs.map +1 -1
  49. package/build/cjs/components/feedback/main-question/MainQuestion.cjs.map +1 -1
  50. package/build/cjs/components/feedback/main-question/mainQuestionContext.cjs.map +1 -1
  51. package/build/cjs/components/feedback/main-question/useMainQuestion.cjs.map +1 -1
  52. package/build/cjs/components/feedback/presets.cjs.map +1 -1
  53. package/build/cjs/components/feedback/questions/AddonQuestion.cjs.map +1 -1
  54. package/build/cjs/components/feedback/questions/CheckboxQuestion.cjs.map +1 -1
  55. package/build/cjs/components/feedback/questions/ContactQuestion.cjs.map +1 -1
  56. package/build/cjs/components/feedback/questions/RadioQuestion.cjs.map +1 -1
  57. package/build/cjs/components/feedback/questions/SmileyQuestion.cjs.map +1 -1
  58. package/build/cjs/components/feedback/questions/TextQuestion.cjs.map +1 -1
  59. package/build/cjs/components/feedback/questions/smileyUtils.cjs.map +1 -1
  60. package/build/cjs/components/feedback/utils.cjs.map +1 -1
  61. package/build/cjs/components/flex/Flex.cjs.map +1 -1
  62. package/build/cjs/components/icon/Icon.cjs.map +1 -1
  63. package/build/cjs/components/icon/icons/ArrowDownIcon.cjs.map +1 -1
  64. package/build/cjs/components/icon/icons/ArrowLeftIcon.cjs.map +1 -1
  65. package/build/cjs/components/icon/icons/ArrowNorthEastIcon.cjs.map +1 -1
  66. package/build/cjs/components/icon/icons/ArrowRightIcon.cjs.map +1 -1
  67. package/build/cjs/components/icon/icons/ArrowUpIcon.cjs.map +1 -1
  68. package/build/cjs/components/icon/icons/CalendarIcon.cjs.map +1 -1
  69. package/build/cjs/components/icon/icons/CheckIcon.cjs.map +1 -1
  70. package/build/cjs/components/icon/icons/ChevronDownIcon.cjs.map +1 -1
  71. package/build/cjs/components/icon/icons/ChevronLeftIcon.cjs.map +1 -1
  72. package/build/cjs/components/icon/icons/ChevronRightIcon.cjs.map +1 -1
  73. package/build/cjs/components/icon/icons/ChevronUpIcon.cjs.map +1 -1
  74. package/build/cjs/components/icon/icons/CloseIcon.cjs.map +1 -1
  75. package/build/cjs/components/icon/icons/CopyIcon.cjs.map +1 -1
  76. package/build/cjs/components/icon/icons/DotsIcon.cjs.map +1 -1
  77. package/build/cjs/components/icon/icons/DragIcon.cjs.map +1 -1
  78. package/build/cjs/components/icon/icons/GreenCheckIcon.cjs.map +1 -1
  79. package/build/cjs/components/icon/icons/HamburgerIcon.cjs.map +1 -1
  80. package/build/cjs/components/icon/icons/LinkIcon.cjs.map +1 -1
  81. package/build/cjs/components/icon/icons/MinusIcon.cjs.map +1 -1
  82. package/build/cjs/components/icon/icons/PenIcon.cjs.map +1 -1
  83. package/build/cjs/components/icon/icons/PlusIcon.cjs.map +1 -1
  84. package/build/cjs/components/icon/icons/QuestionIcon.cjs.map +1 -1
  85. package/build/cjs/components/icon/icons/RedCrossIcon.cjs.map +1 -1
  86. package/build/cjs/components/icon/icons/SearchIcon.cjs.map +1 -1
  87. package/build/cjs/components/icon/icons/ThumbDownIcon.cjs.map +1 -1
  88. package/build/cjs/components/icon/icons/ThumbUpIcon.cjs.map +1 -1
  89. package/build/cjs/components/icon/icons/TrashCanIcon.cjs.map +1 -1
  90. package/build/cjs/components/icon/icons/animated/ArrowHorizontalAnimated.cjs.map +1 -1
  91. package/build/cjs/components/icon/icons/animated/ArrowVerticalAnimated.cjs.map +1 -1
  92. package/build/cjs/components/icon/icons/animated/PlusRemoveAnimated.cjs.map +1 -1
  93. package/build/cjs/components/icon-button/IconButton.cjs.map +1 -1
  94. package/build/cjs/components/image/Image.cjs.map +1 -1
  95. package/build/cjs/components/image/useImageLoadingStatus.cjs.map +1 -1
  96. package/build/cjs/components/index.d.cts +1 -1
  97. package/build/cjs/components/input-group/FieldGroup.cjs.map +1 -1
  98. package/build/cjs/components/input-group/InputGroup.cjs.map +1 -1
  99. package/build/cjs/components/input-group/Label.cjs.map +1 -1
  100. package/build/cjs/components/input-group/SupportLabel.cjs.map +1 -1
  101. package/build/cjs/components/input-group/index.d.cts +2 -2
  102. package/build/cjs/components/link/Link.cjs.map +1 -1
  103. package/build/cjs/components/link/NavLink.cjs.map +1 -1
  104. package/build/cjs/components/link-list/LinkList.cjs.map +1 -1
  105. package/build/cjs/components/loader/index.d.cts +2 -2
  106. package/build/cjs/components/loader/skeletons/SkeletonAnimation.cjs.map +1 -1
  107. package/build/cjs/components/loader/skeletons/SkeletonButton.cjs.map +1 -1
  108. package/build/cjs/components/loader/skeletons/SkeletonCheckboxGroup.cjs.map +1 -1
  109. package/build/cjs/components/loader/skeletons/SkeletonElement.cjs.map +1 -1
  110. package/build/cjs/components/loader/skeletons/SkeletonInput.cjs.map +1 -1
  111. package/build/cjs/components/loader/skeletons/SkeletonLabel.cjs.map +1 -1
  112. package/build/cjs/components/loader/skeletons/SkeletonRadioButtonGroup.cjs.map +1 -1
  113. package/build/cjs/components/loader/skeletons/SkeletonTable.cjs.map +1 -1
  114. package/build/cjs/components/loader/skeletons/SkeletonTextArea.cjs.map +1 -1
  115. package/build/cjs/components/loader/useDelayedRender.cjs.map +1 -1
  116. package/build/cjs/components/logo/Logo.cjs.map +1 -1
  117. package/build/cjs/components/logo/LogoStamp.cjs.map +1 -1
  118. package/build/cjs/components/logo/useTextSpinner.cjs.map +1 -1
  119. package/build/cjs/components/menu/Menu.cjs.map +1 -1
  120. package/build/cjs/components/menu/MenuItem.cjs.map +1 -1
  121. package/build/cjs/components/menu/MenuItemCheckbox.cjs.map +1 -1
  122. package/build/cjs/components/menu/index.d.cts +1 -1
  123. package/build/cjs/components/message/DismissButton.cjs.map +1 -1
  124. package/build/cjs/components/message/FormErrorMessage.cjs.map +1 -1
  125. package/build/cjs/components/message/Message.cjs.map +1 -1
  126. package/build/cjs/components/message/index.d.cts +2 -2
  127. package/build/cjs/components/modal/Modal.cjs +1 -1
  128. package/build/cjs/components/modal/Modal.cjs.map +1 -1
  129. package/build/cjs/components/modal/index.d.cts +1 -1
  130. package/build/cjs/components/modal/useModal.cjs.map +1 -1
  131. package/build/cjs/components/pagination/Pagination.cjs.map +1 -1
  132. package/build/cjs/components/popover/Popover.cjs +1 -1
  133. package/build/cjs/components/popover/Popover.cjs.map +1 -1
  134. package/build/cjs/components/progress-bar/Countdown.cjs.map +1 -1
  135. package/build/cjs/components/radio-button/BaseRadioButton.cjs.map +1 -1
  136. package/build/cjs/components/radio-button/RadioButton.cjs.map +1 -1
  137. package/build/cjs/components/radio-button/RadioButtonGroup.cjs.map +1 -1
  138. package/build/cjs/components/radio-button/radioGroupContext.cjs.map +1 -1
  139. package/build/cjs/components/radio-panel/RadioPanel.cjs.map +1 -1
  140. package/build/cjs/components/select/NativeSelect.cjs.map +1 -1
  141. package/build/cjs/components/select/Select.cjs.map +1 -1
  142. package/build/cjs/components/select/select-utils.cjs.map +1 -1
  143. package/build/cjs/components/summary-table/SummaryTable.cjs.map +1 -1
  144. package/build/cjs/components/summary-table/SummaryTableRow.cjs.map +1 -1
  145. package/build/cjs/components/summary-table/mocks.cjs.map +1 -1
  146. package/build/cjs/components/system-message/SystemMessage.cjs.map +1 -1
  147. package/build/cjs/components/system-message/common/DismissButton.cjs.map +1 -1
  148. package/build/cjs/components/system-message/common/MessageIcon.cjs.map +1 -1
  149. package/build/cjs/components/system-message/index.d.cts +1 -1
  150. package/build/cjs/components/table/DataTable.cjs.map +1 -1
  151. package/build/cjs/components/table/ExpandableTableRow.cjs.map +1 -1
  152. package/build/cjs/components/table/ExpandableTableRowController.cjs.map +1 -1
  153. package/build/cjs/components/table/Table.cjs.map +1 -1
  154. package/build/cjs/components/table/TableBody.cjs.map +1 -1
  155. package/build/cjs/components/table/TableCaption.cjs.map +1 -1
  156. package/build/cjs/components/table/TableCell.cjs.map +1 -1
  157. package/build/cjs/components/table/TableColumn.cjs.map +1 -1
  158. package/build/cjs/components/table/TableColumnGroup.cjs.map +1 -1
  159. package/build/cjs/components/table/TableFooter.cjs.map +1 -1
  160. package/build/cjs/components/table/TableHead.cjs.map +1 -1
  161. package/build/cjs/components/table/TableHeader.cjs.map +1 -1
  162. package/build/cjs/components/table/TablePagination.cjs.map +1 -1
  163. package/build/cjs/components/table/TableRow.cjs.map +1 -1
  164. package/build/cjs/components/table/index.d.cts +1 -1
  165. package/build/cjs/components/table/tableContext.cjs.map +1 -1
  166. package/build/cjs/components/table/tableSectionContext.cjs.map +1 -1
  167. package/build/cjs/components/table/utils.cjs.map +1 -1
  168. package/build/cjs/components/tabs/NavTab.cjs.map +1 -1
  169. package/build/cjs/components/tabs/NavTabs.cjs.map +1 -1
  170. package/build/cjs/components/tabs/Tab.cjs.map +1 -1
  171. package/build/cjs/components/tabs/TabList.cjs.map +1 -1
  172. package/build/cjs/components/tabs/Tabs.cjs.map +1 -1
  173. package/build/cjs/components/tag/Tag.cjs.map +1 -1
  174. package/build/cjs/components/text-input/BaseTextArea.cjs.map +1 -1
  175. package/build/cjs/components/text-input/BaseTextInput.cjs.map +1 -1
  176. package/build/cjs/components/text-input/TextArea.cjs.map +1 -1
  177. package/build/cjs/components/text-input/TextInput.cjs.map +1 -1
  178. package/build/cjs/components/toast/Toast.cjs.map +1 -1
  179. package/build/cjs/components/toast/ToastRegion.cjs.map +1 -1
  180. package/build/cjs/components/toast/ToastRegion.d.cts +1 -1
  181. package/build/cjs/components/toast/toastContext.cjs.map +1 -1
  182. package/build/cjs/components/toggle-switch/ToggleSlider.cjs.map +1 -1
  183. package/build/cjs/components/toggle-switch/ToggleSwitch.cjs.map +1 -1
  184. package/build/cjs/components/toggle-switch/usePillStyles.cjs.map +1 -1
  185. package/build/cjs/components/tooltip/PopupTip.cjs.map +1 -1
  186. package/build/cjs/components/tooltip/Tooltip.cjs.map +1 -1
  187. package/build/cjs/components/tooltip/TooltipContent.cjs.map +1 -1
  188. package/build/cjs/components/tooltip/TooltipTrigger.cjs.map +1 -1
  189. package/build/cjs/components/tooltip/index.d.cts +1 -1
  190. package/build/cjs/hooks/index.d.cts +5 -5
  191. package/build/cjs/hooks/mediaQueryUtils.cjs.map +1 -1
  192. package/build/cjs/hooks/useAnimatedDetails/useAnimatedDetails.cjs.map +1 -1
  193. package/build/cjs/hooks/useAnimatedHeight/index.d.cts +1 -1
  194. package/build/cjs/hooks/useAnimatedHeight/useAnimatedHeight.cjs.map +1 -1
  195. package/build/cjs/hooks/useAnimatedHeight/useAnimatedHeightBetween.cjs.map +1 -1
  196. package/build/cjs/hooks/useAnimatedHeight/useAutoAnimateHeight.cjs.map +1 -1
  197. package/build/cjs/hooks/useAriaLiveRegion/index.d.cts +1 -1
  198. package/build/cjs/hooks/useAriaLiveRegion/useAriaLiveRegion.cjs.map +1 -1
  199. package/build/cjs/hooks/useBrowserPreferences/useBrowserPreferences.cjs.map +1 -1
  200. package/build/cjs/hooks/useClickOutside/useClickOutside.cjs.map +1 -1
  201. package/build/cjs/hooks/useElementDimensions/index.d.cts +1 -1
  202. package/build/cjs/hooks/useElementDimensions/useElementDimensions.cjs.map +1 -1
  203. package/build/cjs/hooks/useFocusOutside/useFocusOutside.cjs.map +1 -1
  204. package/build/cjs/hooks/useIntersectionObserver/useIntersectionObserver.cjs.map +1 -1
  205. package/build/cjs/hooks/useListNavigation/useListNavigation.cjs.map +1 -1
  206. package/build/cjs/hooks/useListNavigation/useListNavigation.d.cts +1 -1
  207. package/build/cjs/hooks/useLocalStorage/useLocalStorage.cjs.map +1 -1
  208. package/build/cjs/hooks/useMutationObserver/useMutationObserver.cjs.map +1 -1
  209. package/build/cjs/hooks/useProgressiveImg/index.d.cts +1 -1
  210. package/build/cjs/hooks/useProgressiveImg/useProgressiveImg.cjs.map +1 -1
  211. package/build/cjs/hooks/useProgressiveImg/useProgressiveImg.d.cts +1 -1
  212. package/build/cjs/hooks/useScreen/state.cjs.map +1 -1
  213. package/build/cjs/hooks/useScreen/useScreen.cjs.map +1 -1
  214. package/build/cjs/hooks/useScrollIntoView/index.d.cts +1 -1
  215. package/build/cjs/hooks/useSwipeGesture/useSwipeGesture.cjs.map +1 -1
  216. package/build/cjs/utilities/formatters/avstand/formatAvstand.cjs.map +1 -1
  217. package/build/cjs/utilities/formatters/bytes/formatBytes.cjs.map +1 -1
  218. package/build/cjs/utilities/formatters/date/formatDate.cjs.map +1 -1
  219. package/build/cjs/utilities/formatters/fodselsnummer/formatFodselsnummer.cjs.map +1 -1
  220. package/build/cjs/utilities/formatters/index.d.cts +5 -5
  221. package/build/cjs/utilities/formatters/kontonummer/formatKontonummer.cjs.map +1 -1
  222. package/build/cjs/utilities/formatters/kortnummer/formatKortnummer.cjs.map +1 -1
  223. package/build/cjs/utilities/formatters/organisasjonsnummer/formatOrganisasjonsnummer.cjs.map +1 -1
  224. package/build/cjs/utilities/formatters/telefonnummer/formatTelefonnummer.cjs.map +1 -1
  225. package/build/cjs/utilities/formatters/util/formatNumber.cjs.map +1 -1
  226. package/build/cjs/utilities/formatters/util/parseNumber.cjs.map +1 -1
  227. package/build/cjs/utilities/formatters/util/registerWithMask.cjs.map +1 -1
  228. package/build/cjs/utilities/formatters/valuta/formatValuta.cjs.map +1 -1
  229. package/build/cjs/utilities/getThemeAndDensity.cjs.map +1 -1
  230. package/build/cjs/utilities/polymorphism/SlotComponent.cjs.map +1 -1
  231. package/build/cjs/utilities/polymorphism/index.d.cts +1 -1
  232. package/build/cjs/utilities/polymorphism/mergeProps.cjs.map +1 -1
  233. package/build/cjs/utilities/polymorphism/mergeRefs.cjs.map +1 -1
  234. package/build/cjs/utilities/tabListener.cjs.map +1 -1
  235. package/build/cjs/utilities/validators/hasMinimumWords/hasMinimumWords.cjs.map +1 -1
  236. package/build/cjs/utilities/validators/hasNoIllegalCharacters/hasNoIllegalCharacters.cjs.map +1 -1
  237. package/build/cjs/utilities/validators/isValidChassisnummer/isValidChassisnummer.cjs.map +1 -1
  238. package/build/cjs/utilities/validators/isValidEpost/isValidEpost.cjs.map +1 -1
  239. package/build/cjs/utilities/validators/isValidFodselsnummer/isValidFodselsnummer.cjs.map +1 -1
  240. package/build/cjs/utilities/validators/isValidKortnummer/isValidKortnummer.cjs.map +1 -1
  241. package/build/cjs/utilities/validators/isValidName/isValidName.cjs.map +1 -1
  242. package/build/cjs/utilities/validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.cjs.map +1 -1
  243. package/build/cjs/utilities/validators/isValidTelefonnummer/isValidTelefonnummer.cjs.map +1 -1
  244. package/build/es/components/ScreenReaderOnly.js.map +1 -1
  245. package/build/es/components/accordion/Accordion.js.map +1 -1
  246. package/build/es/components/accordion/AccordionItem.js.map +1 -1
  247. package/build/es/components/breadcrumb/Breadcrumb.js.map +1 -1
  248. package/build/es/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  249. package/build/es/components/button/Button.js.map +1 -1
  250. package/build/es/components/button/index.d.ts +1 -1
  251. package/build/es/components/button/types.js.map +1 -1
  252. package/build/es/components/card/Card.js.map +1 -1
  253. package/build/es/components/card/CardImage.js.map +1 -1
  254. package/build/es/components/card/InfoCard.js.map +1 -1
  255. package/build/es/components/card/NavCard.js.map +1 -1
  256. package/build/es/components/card/TaskCard.js.map +1 -1
  257. package/build/es/components/card/documentation/examples/FakturainfoExample.d.ts +1 -1
  258. package/build/es/components/card/documentation/examples/StatuskortExample.d.ts +1 -1
  259. package/build/es/components/card/types.js.map +1 -1
  260. package/build/es/components/card/utils.js.map +1 -1
  261. package/build/es/components/checkbox/Checkbox.js.map +1 -1
  262. package/build/es/components/combobox/Combobox.js.map +1 -1
  263. package/build/es/components/combobox/index.d.ts +1 -1
  264. package/build/es/components/cookie-consent/CookieConsent.js.map +1 -1
  265. package/build/es/components/cookie-consent/CookieConsentContext.js.map +1 -1
  266. package/build/es/components/cookie-consent/CookieConsentModal.js.map +1 -1
  267. package/build/es/components/cookie-consent/consents/CustomConsents.js.map +1 -1
  268. package/build/es/components/cookie-consent/consents/DefaultConsents.js.map +1 -1
  269. package/build/es/components/cookie-consent/consents/RequirementCheckbox.d.ts +1 -1
  270. package/build/es/components/cookie-consent/consents/RequirementCheckbox.js.map +1 -1
  271. package/build/es/components/cookie-consent/cookieConsentUtils.d.ts +1 -1
  272. package/build/es/components/cookie-consent/cookieConsentUtils.js.map +1 -1
  273. package/build/es/components/cookie-consent/index.d.ts +1 -1
  274. package/build/es/components/datepicker/DatePicker.js.map +1 -1
  275. package/build/es/components/datepicker/internal/Calendar.js.map +1 -1
  276. package/build/es/components/datepicker/internal/calendarReducer.js.map +1 -1
  277. package/build/es/components/datepicker/internal/useCalendar.js.map +1 -1
  278. package/build/es/components/datepicker/internal/utils.d.ts +2 -2
  279. package/build/es/components/datepicker/internal/utils.js.map +1 -1
  280. package/build/es/components/datepicker/utils.js.map +1 -1
  281. package/build/es/components/description-list/DescriptionList.js.map +1 -1
  282. package/build/es/components/expander/ExpandSection.js.map +1 -1
  283. package/build/es/components/expander/Expander.js.map +1 -1
  284. package/build/es/components/feedback/Feedback.js.map +1 -1
  285. package/build/es/components/feedback/FeedbackSuccess.js.map +1 -1
  286. package/build/es/components/feedback/FeedbackValues.js.map +1 -1
  287. package/build/es/components/feedback/feedbackContext.js.map +1 -1
  288. package/build/es/components/feedback/followup/Followup.js.map +1 -1
  289. package/build/es/components/feedback/followup/followupContext.js.map +1 -1
  290. package/build/es/components/feedback/followup/useFollowup.js.map +1 -1
  291. package/build/es/components/feedback/main-question/MainQuestion.js.map +1 -1
  292. package/build/es/components/feedback/main-question/mainQuestionContext.js.map +1 -1
  293. package/build/es/components/feedback/main-question/useMainQuestion.js.map +1 -1
  294. package/build/es/components/feedback/presets.js.map +1 -1
  295. package/build/es/components/feedback/questions/AddonQuestion.js.map +1 -1
  296. package/build/es/components/feedback/questions/CheckboxQuestion.js.map +1 -1
  297. package/build/es/components/feedback/questions/ContactQuestion.js.map +1 -1
  298. package/build/es/components/feedback/questions/RadioQuestion.js.map +1 -1
  299. package/build/es/components/feedback/questions/SmileyQuestion.js.map +1 -1
  300. package/build/es/components/feedback/questions/TextQuestion.js.map +1 -1
  301. package/build/es/components/feedback/questions/smileyUtils.js.map +1 -1
  302. package/build/es/components/feedback/utils.js.map +1 -1
  303. package/build/es/components/flex/Flex.js.map +1 -1
  304. package/build/es/components/icon/Icon.js.map +1 -1
  305. package/build/es/components/icon/icons/ArrowDownIcon.js.map +1 -1
  306. package/build/es/components/icon/icons/ArrowLeftIcon.js.map +1 -1
  307. package/build/es/components/icon/icons/ArrowNorthEastIcon.js.map +1 -1
  308. package/build/es/components/icon/icons/ArrowRightIcon.js.map +1 -1
  309. package/build/es/components/icon/icons/ArrowUpIcon.js.map +1 -1
  310. package/build/es/components/icon/icons/CalendarIcon.js.map +1 -1
  311. package/build/es/components/icon/icons/CheckIcon.js.map +1 -1
  312. package/build/es/components/icon/icons/ChevronDownIcon.js.map +1 -1
  313. package/build/es/components/icon/icons/ChevronLeftIcon.js.map +1 -1
  314. package/build/es/components/icon/icons/ChevronRightIcon.js.map +1 -1
  315. package/build/es/components/icon/icons/ChevronUpIcon.js.map +1 -1
  316. package/build/es/components/icon/icons/CloseIcon.js.map +1 -1
  317. package/build/es/components/icon/icons/CopyIcon.js.map +1 -1
  318. package/build/es/components/icon/icons/DotsIcon.js.map +1 -1
  319. package/build/es/components/icon/icons/DragIcon.js.map +1 -1
  320. package/build/es/components/icon/icons/GreenCheckIcon.js.map +1 -1
  321. package/build/es/components/icon/icons/HamburgerIcon.js.map +1 -1
  322. package/build/es/components/icon/icons/LinkIcon.js.map +1 -1
  323. package/build/es/components/icon/icons/MinusIcon.js.map +1 -1
  324. package/build/es/components/icon/icons/PenIcon.js.map +1 -1
  325. package/build/es/components/icon/icons/PlusIcon.js.map +1 -1
  326. package/build/es/components/icon/icons/QuestionIcon.js.map +1 -1
  327. package/build/es/components/icon/icons/RedCrossIcon.js.map +1 -1
  328. package/build/es/components/icon/icons/SearchIcon.js.map +1 -1
  329. package/build/es/components/icon/icons/ThumbDownIcon.js.map +1 -1
  330. package/build/es/components/icon/icons/ThumbUpIcon.js.map +1 -1
  331. package/build/es/components/icon/icons/TrashCanIcon.js.map +1 -1
  332. package/build/es/components/icon/icons/animated/ArrowHorizontalAnimated.js.map +1 -1
  333. package/build/es/components/icon/icons/animated/ArrowVerticalAnimated.js.map +1 -1
  334. package/build/es/components/icon/icons/animated/PlusRemoveAnimated.js.map +1 -1
  335. package/build/es/components/icon-button/IconButton.js.map +1 -1
  336. package/build/es/components/image/Image.js.map +1 -1
  337. package/build/es/components/image/useImageLoadingStatus.js.map +1 -1
  338. package/build/es/components/index.d.ts +1 -1
  339. package/build/es/components/input-group/FieldGroup.js.map +1 -1
  340. package/build/es/components/input-group/InputGroup.js.map +1 -1
  341. package/build/es/components/input-group/Label.js.map +1 -1
  342. package/build/es/components/input-group/SupportLabel.js.map +1 -1
  343. package/build/es/components/input-group/index.d.ts +2 -2
  344. package/build/es/components/link/Link.js.map +1 -1
  345. package/build/es/components/link/NavLink.js.map +1 -1
  346. package/build/es/components/link-list/LinkList.js.map +1 -1
  347. package/build/es/components/loader/index.d.ts +2 -2
  348. package/build/es/components/loader/skeletons/SkeletonAnimation.js.map +1 -1
  349. package/build/es/components/loader/skeletons/SkeletonButton.js.map +1 -1
  350. package/build/es/components/loader/skeletons/SkeletonCheckboxGroup.js.map +1 -1
  351. package/build/es/components/loader/skeletons/SkeletonElement.js.map +1 -1
  352. package/build/es/components/loader/skeletons/SkeletonInput.js.map +1 -1
  353. package/build/es/components/loader/skeletons/SkeletonLabel.js.map +1 -1
  354. package/build/es/components/loader/skeletons/SkeletonRadioButtonGroup.js.map +1 -1
  355. package/build/es/components/loader/skeletons/SkeletonTable.js.map +1 -1
  356. package/build/es/components/loader/skeletons/SkeletonTextArea.js.map +1 -1
  357. package/build/es/components/loader/useDelayedRender.js.map +1 -1
  358. package/build/es/components/logo/Logo.js.map +1 -1
  359. package/build/es/components/logo/LogoStamp.js.map +1 -1
  360. package/build/es/components/logo/useTextSpinner.js.map +1 -1
  361. package/build/es/components/menu/Menu.js.map +1 -1
  362. package/build/es/components/menu/MenuItem.js.map +1 -1
  363. package/build/es/components/menu/MenuItemCheckbox.js.map +1 -1
  364. package/build/es/components/menu/index.d.ts +1 -1
  365. package/build/es/components/message/DismissButton.js.map +1 -1
  366. package/build/es/components/message/FormErrorMessage.js.map +1 -1
  367. package/build/es/components/message/Message.js.map +1 -1
  368. package/build/es/components/message/index.d.ts +2 -2
  369. package/build/es/components/modal/Modal.js +1 -1
  370. package/build/es/components/modal/Modal.js.map +1 -1
  371. package/build/es/components/modal/index.d.ts +1 -1
  372. package/build/es/components/modal/useModal.js.map +1 -1
  373. package/build/es/components/pagination/Pagination.js.map +1 -1
  374. package/build/es/components/popover/Popover.js +1 -1
  375. package/build/es/components/popover/Popover.js.map +1 -1
  376. package/build/es/components/progress-bar/Countdown.js.map +1 -1
  377. package/build/es/components/radio-button/BaseRadioButton.js.map +1 -1
  378. package/build/es/components/radio-button/RadioButton.js.map +1 -1
  379. package/build/es/components/radio-button/RadioButtonGroup.js.map +1 -1
  380. package/build/es/components/radio-button/radioGroupContext.js.map +1 -1
  381. package/build/es/components/radio-panel/RadioPanel.js.map +1 -1
  382. package/build/es/components/select/NativeSelect.js.map +1 -1
  383. package/build/es/components/select/Select.js.map +1 -1
  384. package/build/es/components/select/select-utils.js.map +1 -1
  385. package/build/es/components/summary-table/SummaryTable.js.map +1 -1
  386. package/build/es/components/summary-table/SummaryTableRow.js.map +1 -1
  387. package/build/es/components/summary-table/mocks.js.map +1 -1
  388. package/build/es/components/system-message/SystemMessage.js.map +1 -1
  389. package/build/es/components/system-message/common/DismissButton.js.map +1 -1
  390. package/build/es/components/system-message/common/MessageIcon.js.map +1 -1
  391. package/build/es/components/system-message/index.d.ts +1 -1
  392. package/build/es/components/table/DataTable.js.map +1 -1
  393. package/build/es/components/table/ExpandableTableRow.js.map +1 -1
  394. package/build/es/components/table/ExpandableTableRowController.js.map +1 -1
  395. package/build/es/components/table/Table.js.map +1 -1
  396. package/build/es/components/table/TableBody.js.map +1 -1
  397. package/build/es/components/table/TableCaption.js.map +1 -1
  398. package/build/es/components/table/TableCell.js.map +1 -1
  399. package/build/es/components/table/TableColumn.js.map +1 -1
  400. package/build/es/components/table/TableColumnGroup.js.map +1 -1
  401. package/build/es/components/table/TableFooter.js.map +1 -1
  402. package/build/es/components/table/TableHead.js.map +1 -1
  403. package/build/es/components/table/TableHeader.js.map +1 -1
  404. package/build/es/components/table/TablePagination.js.map +1 -1
  405. package/build/es/components/table/TableRow.js.map +1 -1
  406. package/build/es/components/table/index.d.ts +1 -1
  407. package/build/es/components/table/tableContext.js.map +1 -1
  408. package/build/es/components/table/tableSectionContext.js.map +1 -1
  409. package/build/es/components/table/utils.js.map +1 -1
  410. package/build/es/components/tabs/NavTab.js.map +1 -1
  411. package/build/es/components/tabs/NavTabs.js.map +1 -1
  412. package/build/es/components/tabs/Tab.js.map +1 -1
  413. package/build/es/components/tabs/TabList.js.map +1 -1
  414. package/build/es/components/tabs/Tabs.js.map +1 -1
  415. package/build/es/components/tag/Tag.js.map +1 -1
  416. package/build/es/components/text-input/BaseTextArea.js.map +1 -1
  417. package/build/es/components/text-input/BaseTextInput.js.map +1 -1
  418. package/build/es/components/text-input/TextArea.js.map +1 -1
  419. package/build/es/components/text-input/TextInput.js.map +1 -1
  420. package/build/es/components/toast/Toast.js.map +1 -1
  421. package/build/es/components/toast/ToastRegion.d.ts +1 -1
  422. package/build/es/components/toast/ToastRegion.js.map +1 -1
  423. package/build/es/components/toast/toastContext.js.map +1 -1
  424. package/build/es/components/toggle-switch/ToggleSlider.js.map +1 -1
  425. package/build/es/components/toggle-switch/ToggleSwitch.js.map +1 -1
  426. package/build/es/components/toggle-switch/usePillStyles.js.map +1 -1
  427. package/build/es/components/tooltip/PopupTip.js.map +1 -1
  428. package/build/es/components/tooltip/Tooltip.js.map +1 -1
  429. package/build/es/components/tooltip/TooltipContent.js.map +1 -1
  430. package/build/es/components/tooltip/TooltipTrigger.js.map +1 -1
  431. package/build/es/components/tooltip/index.d.ts +1 -1
  432. package/build/es/hooks/index.d.ts +5 -5
  433. package/build/es/hooks/mediaQueryUtils.js.map +1 -1
  434. package/build/es/hooks/useAnimatedDetails/useAnimatedDetails.js.map +1 -1
  435. package/build/es/hooks/useAnimatedHeight/index.d.ts +1 -1
  436. package/build/es/hooks/useAnimatedHeight/useAnimatedHeight.js.map +1 -1
  437. package/build/es/hooks/useAnimatedHeight/useAnimatedHeightBetween.js.map +1 -1
  438. package/build/es/hooks/useAnimatedHeight/useAutoAnimateHeight.js.map +1 -1
  439. package/build/es/hooks/useAriaLiveRegion/index.d.ts +1 -1
  440. package/build/es/hooks/useAriaLiveRegion/useAriaLiveRegion.js.map +1 -1
  441. package/build/es/hooks/useBrowserPreferences/useBrowserPreferences.js.map +1 -1
  442. package/build/es/hooks/useClickOutside/useClickOutside.js.map +1 -1
  443. package/build/es/hooks/useElementDimensions/index.d.ts +1 -1
  444. package/build/es/hooks/useElementDimensions/useElementDimensions.js.map +1 -1
  445. package/build/es/hooks/useFocusOutside/useFocusOutside.js.map +1 -1
  446. package/build/es/hooks/useIntersectionObserver/useIntersectionObserver.js.map +1 -1
  447. package/build/es/hooks/useListNavigation/useListNavigation.d.ts +1 -1
  448. package/build/es/hooks/useListNavigation/useListNavigation.js.map +1 -1
  449. package/build/es/hooks/useLocalStorage/useLocalStorage.js.map +1 -1
  450. package/build/es/hooks/useMutationObserver/useMutationObserver.js.map +1 -1
  451. package/build/es/hooks/useProgressiveImg/index.d.ts +1 -1
  452. package/build/es/hooks/useProgressiveImg/useProgressiveImg.d.ts +1 -1
  453. package/build/es/hooks/useProgressiveImg/useProgressiveImg.js.map +1 -1
  454. package/build/es/hooks/useScreen/state.js.map +1 -1
  455. package/build/es/hooks/useScreen/useScreen.js.map +1 -1
  456. package/build/es/hooks/useScrollIntoView/index.d.ts +1 -1
  457. package/build/es/hooks/useSwipeGesture/useSwipeGesture.js.map +1 -1
  458. package/build/es/utilities/formatters/avstand/formatAvstand.js.map +1 -1
  459. package/build/es/utilities/formatters/bytes/formatBytes.js.map +1 -1
  460. package/build/es/utilities/formatters/date/formatDate.js.map +1 -1
  461. package/build/es/utilities/formatters/fodselsnummer/formatFodselsnummer.js.map +1 -1
  462. package/build/es/utilities/formatters/index.d.ts +5 -5
  463. package/build/es/utilities/formatters/kontonummer/formatKontonummer.js.map +1 -1
  464. package/build/es/utilities/formatters/kortnummer/formatKortnummer.js.map +1 -1
  465. package/build/es/utilities/formatters/organisasjonsnummer/formatOrganisasjonsnummer.js.map +1 -1
  466. package/build/es/utilities/formatters/telefonnummer/formatTelefonnummer.js.map +1 -1
  467. package/build/es/utilities/formatters/util/formatNumber.js.map +1 -1
  468. package/build/es/utilities/formatters/util/parseNumber.js.map +1 -1
  469. package/build/es/utilities/formatters/util/registerWithMask.js.map +1 -1
  470. package/build/es/utilities/formatters/valuta/formatValuta.js.map +1 -1
  471. package/build/es/utilities/getThemeAndDensity.js.map +1 -1
  472. package/build/es/utilities/polymorphism/SlotComponent.js.map +1 -1
  473. package/build/es/utilities/polymorphism/index.d.ts +1 -1
  474. package/build/es/utilities/polymorphism/mergeProps.js.map +1 -1
  475. package/build/es/utilities/polymorphism/mergeRefs.js.map +1 -1
  476. package/build/es/utilities/tabListener.js.map +1 -1
  477. package/build/es/utilities/validators/hasMinimumWords/hasMinimumWords.js.map +1 -1
  478. package/build/es/utilities/validators/hasNoIllegalCharacters/hasNoIllegalCharacters.js.map +1 -1
  479. package/build/es/utilities/validators/isValidChassisnummer/isValidChassisnummer.js.map +1 -1
  480. package/build/es/utilities/validators/isValidEpost/isValidEpost.js.map +1 -1
  481. package/build/es/utilities/validators/isValidFodselsnummer/isValidFodselsnummer.js.map +1 -1
  482. package/build/es/utilities/validators/isValidKortnummer/isValidKortnummer.js.map +1 -1
  483. package/build/es/utilities/validators/isValidName/isValidName.js.map +1 -1
  484. package/build/es/utilities/validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.js.map +1 -1
  485. package/build/es/utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js.map +1 -1
  486. package/package.json +2 -2
  487. package/styles/components/button/button.css +2 -2
  488. package/styles/components/button/button.min.css +1 -1
  489. package/styles/components/checkbox/checkbox.css +4 -4
  490. package/styles/components/checkbox/checkbox.min.css +1 -1
  491. package/styles/components/feedback/feedback.css +2 -2
  492. package/styles/components/feedback/feedback.min.css +1 -1
  493. package/styles/components/input-group/input-group.css +2 -2
  494. package/styles/components/input-group/input-group.min.css +1 -1
  495. package/styles/components/loader/loader.css +6 -6
  496. package/styles/components/loader/loader.min.css +1 -1
  497. package/styles/components/loader/skeleton-loader.css +5 -5
  498. package/styles/components/loader/skeleton-loader.min.css +1 -1
  499. package/styles/components/message/message.css +2 -2
  500. package/styles/components/message/message.min.css +1 -1
  501. package/styles/components/progress-bar/progress-bar.css +2 -2
  502. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  503. package/styles/components/radio-button/radio-button.css +2 -2
  504. package/styles/components/radio-button/radio-button.min.css +1 -1
  505. package/styles/components/radio-panel/radio-panel.css +6 -6
  506. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  507. package/styles/components/system-message/system-message.css +2 -2
  508. package/styles/components/system-message/system-message.min.css +1 -1
  509. package/styles/components/toast/toast.css +4 -4
  510. package/styles/components/toast/toast.min.css +1 -1
  511. package/styles/styles.css +35 -35
  512. package/styles/styles.min.css +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"FormErrorMessage.js","sources":["../../../../src/components/message/FormErrorMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useRef } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { MessageProps, ErrorMessage } from \"./Message.js\";\n\nexport interface FormErrorMessageProps {\n className?: string;\n id?: string;\n /**\n * @default { title: \"Feil og mangler i skjemaet\" }\n */\n messageProps?: Partial<MessageProps>;\n errors: (string | undefined)[];\n isSubmitted: boolean;\n isValid: boolean;\n}\n\nconst defaultMessageProps = {\n title: \"Feil og mangler i skjemaet\",\n};\n\nexport const FormErrorMessage = forwardRef<HTMLDivElement, FormErrorMessageProps>(\n (props, forwardedRef): JSX.Element | null => {\n const { className, errors, isSubmitted, isValid, messageProps, ...rest } = props;\n\n const showSummary = isSubmitted && !isValid;\n\n const [messageRef] = useAnimatedHeight<HTMLDivElement>(showSummary, { display: \"grid\" });\n\n const previousErrors = useRef<Array<string | undefined>>(errors);\n useEffect(() => {\n previousErrors.current = errors;\n }, [errors]);\n const hasNewErrors = errors.length > previousErrors.current.length;\n\n return (\n <div ref={forwardedRef} className={clsx(\"jkl-form-error-message\", className)} {...rest}>\n <ErrorMessage\n {...defaultMessageProps}\n {...messageProps}\n ref={messageRef}\n role={hasNewErrors ? \"alert\" : \"presentation\"} // Unngå å repetere hele oppsummeringen etter hvert som feilene rettes\n >\n <ul className=\"jkl-list\">\n {errors\n .filter((error) => typeof error !== \"undefined\")\n .map((error) => (\n <li className=\"jkl-list__item\" key={error}>\n {error}\n </li>\n ))}\n </ul>\n </ErrorMessage>\n </div>\n );\n },\n);\n\nFormErrorMessage.displayName = \"FormErrorMessage\";\n"],"names":["defaultMessageProps","title","FormErrorMessage","forwardRef","props","forwardedRef","className","errors","isSubmitted","isValid","messageProps","rest","showSummary","messageRef","useAnimatedHeight","display","previousErrors","useRef","useEffect","current","hasNewErrors","length","jsx","ref","clsx","children","ErrorMessage","role","filter","error","map","displayName"],"mappings":"uRAiBA,MAAMA,EAAsB,CACxBC,MAAO,8BAGEC,EAAmBC,GAC5B,CAACC,EAAOC,KACE,MAAEC,UAAAA,EAAWC,OAAAA,EAAQC,YAAAA,EAAaC,QAAAA,EAASC,aAAAA,KAAiBC,GAASP,EAErEQ,EAAcJ,IAAgBC,GAE7BI,GAAcC,EAAkCF,EAAa,CAAEG,QAAS,SAEzEC,EAAiBC,EAAkCV,GACzDW,GAAU,KACNF,EAAeG,QAAUZ,CAAAA,GAC1B,CAACA,IACJ,MAAMa,EAAeb,EAAOc,OAASL,EAAeG,QAAQE,OAGxD,OAAAC,EAAC,MAAI,CAAAC,IAAKlB,EAAcC,UAAWkB,EAAK,yBAA0BlB,MAAgBK,EAC9Ec,SAAAH,EAACI,EAAA,IACO1B,KACAU,EACJa,IAAKV,EACLc,KAAMP,EAAe,QAAU,eAE/BK,SAAAH,EAAC,MAAGhB,UAAU,WACTmB,WACIG,QAAQC,UAAiBA,EAAU,MACnCC,KAAKD,GACDP,EAAA,KAAA,CAAGhB,UAAU,iBACTmB,SAAAI,GAD+BA,UAMxD,IAKZ3B,EAAiB6B,YAAc"}
1
+ {"version":3,"file":"FormErrorMessage.js","sources":["../../../../src/components/message/FormErrorMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useRef } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { MessageProps, ErrorMessage } from \"./Message.js\";\n\nexport interface FormErrorMessageProps {\n className?: string;\n id?: string;\n /**\n * @default { title: \"Feil og mangler i skjemaet\" }\n */\n messageProps?: Partial<MessageProps>;\n errors: (string | undefined)[];\n isSubmitted: boolean;\n isValid: boolean;\n}\n\nconst defaultMessageProps = {\n title: \"Feil og mangler i skjemaet\",\n};\n\nexport const FormErrorMessage = forwardRef<\n HTMLDivElement,\n FormErrorMessageProps\n>((props, forwardedRef): JSX.Element | null => {\n const { className, errors, isSubmitted, isValid, messageProps, ...rest } =\n props;\n\n const showSummary = isSubmitted && !isValid;\n\n const [messageRef] = useAnimatedHeight<HTMLDivElement>(showSummary, {\n display: \"grid\",\n });\n\n const previousErrors = useRef<Array<string | undefined>>(errors);\n useEffect(() => {\n previousErrors.current = errors;\n }, [errors]);\n const hasNewErrors = errors.length > previousErrors.current.length;\n\n return (\n <div\n ref={forwardedRef}\n className={clsx(\"jkl-form-error-message\", className)}\n {...rest}\n >\n <ErrorMessage\n {...defaultMessageProps}\n {...messageProps}\n ref={messageRef}\n role={hasNewErrors ? \"alert\" : \"presentation\"} // Unngå å repetere hele oppsummeringen etter hvert som feilene rettes\n >\n <ul className=\"jkl-list\">\n {errors\n .filter((error) => typeof error !== \"undefined\")\n .map((error) => (\n <li className=\"jkl-list__item\" key={error}>\n {error}\n </li>\n ))}\n </ul>\n </ErrorMessage>\n </div>\n );\n});\n\nFormErrorMessage.displayName = \"FormErrorMessage\";\n"],"names":["defaultMessageProps","title","FormErrorMessage","forwardRef","props","forwardedRef","className","errors","isSubmitted","isValid","messageProps","rest","showSummary","messageRef","useAnimatedHeight","display","previousErrors","useRef","useEffect","current","hasNewErrors","length","jsx","ref","clsx","children","ErrorMessage","role","filter","error","map","displayName"],"mappings":"uRAiBA,MAAMA,EAAsB,CACxBC,MAAO,8BAGEC,EAAmBC,GAG9B,CAACC,EAAOC,KACA,MAAEC,UAAAA,EAAWC,OAAAA,EAAQC,YAAAA,EAAaC,QAAAA,EAASC,aAAAA,KAAiBC,GAC9DP,EAEEQ,EAAcJ,IAAgBC,GAE7BI,GAAcC,EAAkCF,EAAa,CAChEG,QAAS,SAGPC,EAAiBC,EAAkCV,GACzDW,GAAU,KACNF,EAAeG,QAAUZ,CAAAA,GAC1B,CAACA,IACJ,MAAMa,EAAeb,EAAOc,OAASL,EAAeG,QAAQE,OAGxD,OAAAC,EAAC,MAAA,CACGC,IAAKlB,EACLC,UAAWkB,EAAK,yBAA0BlB,MACtCK,EAEJc,SAAAH,EAACI,EAAA,IACO1B,KACAU,EACJa,IAAKV,EACLc,KAAMP,EAAe,QAAU,eAE/BK,SAAAH,EAAC,MAAGhB,UAAU,WACTmB,WACIG,QAAQC,UAAiBA,EAAU,MACnCC,KAAKD,GACDP,EAAA,KAAA,CAAGhB,UAAU,iBACTmB,SAAAI,GAD+BA,UAKpD,IAKZ3B,EAAiB6B,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Message.js","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ErrorIcon, InfoIcon, SuccessIcon, WarningIcon } from \"../icon/index.js\";\nimport { DismissButton } from \"./DismissButton.js\";\n\nexport interface MessageProps extends WithChildren {\n id?: string;\n title?: string;\n fullWidth?: boolean;\n density?: Density;\n className?: string;\n dismissed?: boolean;\n dismissAction?: {\n handleDismiss: () => void;\n buttonTitle?: string;\n };\n role?: AriaRole;\n}\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nconst getIcon = (messageType: messageTypes) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-message__icon\" />;\n default:\n return null;\n }\n};\n\nfunction messageFactory(messageType: messageTypes) {\n const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n const {\n id,\n title,\n fullWidth,\n density,\n className = \"\",\n dismissed,\n dismissAction,\n children,\n role,\n ...rest\n } = props;\n\n const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n const hasStringChild = React.Children.map(children, (child) => typeof child === \"string\");\n const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n return (\n <div\n {...rest}\n id={id}\n ref={ref}\n className={clsx(\"jkl-message\", \"jkl-message--\" + messageType, className, {\n \"jkl-message--full\": fullWidth,\n \"jkl-message--dismissed\": dismissed,\n })}\n role={role}\n data-density={density}\n >\n {getIcon(messageType)}\n <div className=\"jkl-message__content\" data-theme=\"light\">\n {title && <p className=\"jkl-message__title\">{title}</p>}\n <div className=\"jkl-message__message\">{newChildren}</div>\n </div>\n {dismissAction?.handleDismiss && (\n <DismissButton\n aria-controls={boxId}\n className=\"jkl-message__dismiss-button\"\n label={dismissAction.buttonTitle || \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n );\n });\n\n Message.displayName = \"Message\";\n\n return Message;\n}\n\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","density","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","hasStringChild","React","Children","map","child","newChildren","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"koDAuBA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,sBAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,sBAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,sBAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,sBAClC,QACW,OAAA,KACf,EAGJ,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,GAAyC,CAACC,EAAOC,KACvD,MACFC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAZ,UAAAA,EAAY,GACZa,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHV,EAEEW,EAAQC,EAAMV,GAAM,cAAe,CAAEW,gBAAiBX,IAEtDY,EAAiBC,EAAMC,SAASC,IAAIT,GAAWU,GAA2B,iBAAVA,IAChEC,EAAc,MAAAL,GAAAA,EAAiB,GAAMvB,EAAA,IAAA,CAAGiB,SAAAA,IAAgBA,EAG1D,OAAAY,EAAC,MAAA,IACOV,EACJR,GAAAA,EACAD,IAAAA,EACAR,UAAW4B,EAAK,cAAe,gBAAkB/B,EAAaG,EAAW,CACrE,oBAAqBW,EACrB,yBAA0BE,IAE9BG,KAAAA,EACA,eAAcJ,EAEbG,SAAA,CAAAnB,EAAQC,GACR8B,EAAA,MAAA,CAAI3B,UAAU,uBAAuB,aAAW,QAC5Ce,SAAA,CAAAL,GAAUZ,EAAA,IAAA,CAAEE,UAAU,qBAAsBe,SAAML,IAClDZ,EAAA,MAAA,CAAIE,UAAU,uBAAwBe,SAAYW,QAEtD,MAAAZ,OAAA,EAAAA,EAAee,gBACZ/B,EAACgC,EAAA,CACG,gBAAeZ,EACflB,UAAU,8BACV+B,MAAOjB,EAAckB,aAAe,OACpCC,QAASnB,EAAce,kBAC3B,IAMhBxB,OAAAA,EAAQ6B,YAAc,UAEf7B,CACX,CAEa,MAAA8B,EAAc/B,EAAe,QAC1C+B,EAAYD,YAAc,cACb,MAAAE,EAAehC,EAAe,SAC3CgC,EAAaF,YAAc,eACd,MAAAG,EAAiBjC,EAAe,WAC7CiC,EAAeH,YAAc,iBAChB,MAAAI,EAAiBlC,EAAe,WAC7CkC,EAAeJ,YAAc"}
1
+ {"version":3,"file":"Message.js","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport {\n ErrorIcon,\n InfoIcon,\n SuccessIcon,\n WarningIcon,\n} from \"../icon/index.js\";\nimport { DismissButton } from \"./DismissButton.js\";\n\nexport interface MessageProps extends WithChildren {\n id?: string;\n title?: string;\n fullWidth?: boolean;\n density?: Density;\n className?: string;\n dismissed?: boolean;\n dismissAction?: {\n handleDismiss: () => void;\n buttonTitle?: string;\n };\n role?: AriaRole;\n}\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nconst getIcon = (messageType: messageTypes) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-message__icon\" />;\n default:\n return null;\n }\n};\n\nfunction messageFactory(messageType: messageTypes) {\n const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n const {\n id,\n title,\n fullWidth,\n density,\n className = \"\",\n dismissed,\n dismissAction,\n children,\n role,\n ...rest\n } = props;\n\n const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n const hasStringChild = React.Children.map(\n children,\n (child) => typeof child === \"string\",\n );\n const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n return (\n <div\n {...rest}\n id={id}\n ref={ref}\n className={clsx(\n \"jkl-message\",\n \"jkl-message--\" + messageType,\n className,\n {\n \"jkl-message--full\": fullWidth,\n \"jkl-message--dismissed\": dismissed,\n },\n )}\n role={role}\n data-density={density}\n >\n {getIcon(messageType)}\n <div className=\"jkl-message__content\" data-theme=\"light\">\n {title && <p className=\"jkl-message__title\">{title}</p>}\n <div className=\"jkl-message__message\">{newChildren}</div>\n </div>\n {dismissAction?.handleDismiss && (\n <DismissButton\n aria-controls={boxId}\n className=\"jkl-message__dismiss-button\"\n label={dismissAction.buttonTitle || \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n );\n });\n\n Message.displayName = \"Message\";\n\n return Message;\n}\n\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","density","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","hasStringChild","React","Children","map","child","newChildren","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"koDA4BA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,sBAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,sBAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,sBAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,sBAClC,QACW,OAAA,KACf,EAGJ,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,GAAyC,CAACC,EAAOC,KACvD,MACFC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAZ,UAAAA,EAAY,GACZa,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHV,EAEEW,EAAQC,EAAMV,GAAM,cAAe,CAAEW,gBAAiBX,IAEtDY,EAAiBC,EAAMC,SAASC,IAClCT,GACCU,GAA2B,iBAAVA,IAEhBC,EAAc,MAAAL,GAAAA,EAAiB,GAAMvB,EAAA,IAAA,CAAGiB,SAAAA,IAAgBA,EAG1D,OAAAY,EAAC,MAAA,IACOV,EACJR,GAAAA,EACAD,IAAAA,EACAR,UAAW4B,EACP,cACA,gBAAkB/B,EAClBG,EACA,CACI,oBAAqBW,EACrB,yBAA0BE,IAGlCG,KAAAA,EACA,eAAcJ,EAEbG,SAAA,CAAAnB,EAAQC,GACR8B,EAAA,MAAA,CAAI3B,UAAU,uBAAuB,aAAW,QAC5Ce,SAAA,CAAAL,GAAUZ,EAAA,IAAA,CAAEE,UAAU,qBAAsBe,SAAML,IAClDZ,EAAA,MAAA,CAAIE,UAAU,uBAAwBe,SAAYW,QAEtD,MAAAZ,OAAA,EAAAA,EAAee,gBACZ/B,EAACgC,EAAA,CACG,gBAAeZ,EACflB,UAAU,8BACV+B,MAAOjB,EAAckB,aAAe,OACpCC,QAASnB,EAAce,kBAC3B,IAMhBxB,OAAAA,EAAQ6B,YAAc,UAEf7B,CACX,CAEa,MAAA8B,EAAc/B,EAAe,QAC1C+B,EAAYD,YAAc,cACb,MAAAE,EAAehC,EAAe,SAC3CgC,EAAaF,YAAc,eACd,MAAAG,EAAiBjC,EAAe,WAC7CiC,EAAeH,YAAc,iBAChB,MAAAI,EAAiBlC,EAAe,WAC7CkC,EAAeJ,YAAc"}
@@ -1,2 +1,2 @@
1
- export { InfoMessage, ErrorMessage, SuccessMessage, WarningMessage, type MessageProps } from './Message.js';
2
- export { FormErrorMessage, type FormErrorMessageProps } from './FormErrorMessage.js';
1
+ export { InfoMessage, ErrorMessage, SuccessMessage, WarningMessage, type MessageProps, } from './Message.js';
2
+ export { FormErrorMessage, type FormErrorMessageProps, } from './FormErrorMessage.js';
@@ -1,2 +1,2 @@
1
- import{jsx as o}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as s}from"react";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/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import{CloseIcon as i}from"../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/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/WarningIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/PenIcon.js";import{IconButton as c}from"../icon-button/IconButton.js";const a=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-container",s),...i,ref:c})));a.displayName="ModalContainer";const r=s((({className:s,transparent:i,...c},a)=>o("div",{className:n("jkl-modal-overlay",s,{"jkl-modal-overlay--transparent":i}),...c,ref:a})));r.displayName="ModalOverlay";const t=s((({className:s,component:i,padding:c,style:a,...r},t)=>o(i||"div",{className:n("jkl jkl-modal",s),style:{"--jkl-modal-padding":c?`var(--jkl-spacing-${c})`:void 0,...a},...r,ref:t})));t.displayName="Modal";const e=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-header",s),...i,ref:c})));e.displayName="ModalHeader";const m=s((({className:s,...i},c)=>o("p",{className:n("jkl-modal-title",s),...i,ref:c})));m.displayName="ModalTitle";const l=s((({className:s,...a},r)=>o(c,{className:n("jkl-modal-close",s),"data-testautoid":"jkl-modal-close",...a,ref:r,children:o(i,{variant:"medium"})})));l.displayName="ModalCloseButton";const d=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-body",s),...i,ref:c})));d.displayName="ModalBody";const p=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-actions",s),...i,ref:c})));p.displayName="ModalActions";export{t as Modal,p as ModalActions,d as ModalBody,l as ModalCloseButton,a as ModalContainer,e as ModalHeader,r as ModalOverlay,m as ModalTitle};
1
+ import{jsx as o}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as s}from"react";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/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import{CloseIcon as i}from"../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/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/WarningIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/PenIcon.js";import{IconButton as c}from"../icon-button/IconButton.js";const a=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-container",s),...i,ref:c,"data-portal":!0})));a.displayName="ModalContainer";const r=s((({className:s,transparent:i,...c},a)=>o("div",{className:n("jkl-modal-overlay",s,{"jkl-modal-overlay--transparent":i}),...c,ref:a})));r.displayName="ModalOverlay";const t=s((({className:s,component:i,padding:c,style:a,...r},t)=>o(i||"div",{className:n("jkl jkl-modal",s),style:{"--jkl-modal-padding":c?`var(--jkl-spacing-${c})`:void 0,...a},...r,ref:t})));t.displayName="Modal";const e=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-header",s),...i,ref:c})));e.displayName="ModalHeader";const m=s((({className:s,...i},c)=>o("p",{className:n("jkl-modal-title",s),...i,ref:c})));m.displayName="ModalTitle";const l=s((({className:s,...a},r)=>o(c,{className:n("jkl-modal-close",s),"data-testautoid":"jkl-modal-close",...a,ref:r,children:o(i,{variant:"medium"})})));l.displayName="ModalCloseButton";const d=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-body",s),...i,ref:c})));d.displayName="ModalBody";const p=s((({className:s,...i},c)=>o("div",{className:n("jkl-modal-actions",s),...i,ref:c})));p.displayName="ModalActions";export{t as Modal,p as ModalActions,d as ModalBody,l as ModalCloseButton,a as ModalContainer,e as ModalHeader,r as ModalOverlay,m as ModalTitle};
2
2
  //# sourceMappingURL=Modal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { WithOptionalChildren } from \"../../core/types.js\";\nimport { CloseIcon } from \"../icon/index.js\";\nimport { IconButton, IconButtonProps } from \"../icon-button/IconButton.js\";\nimport { ModalConfig } from \"./useModal.js\";\n\nexport interface ModalProps extends WithOptionalChildren {\n id?: string;\n className?: string;\n component?: React.ElementType;\n style?: React.CSSProperties;\n /**\n * Overstyrer padding på modalen via en CSS-variabel.\n */\n padding?: 16 | 24 | 40;\n}\n\ntype BaseModalProps = Omit<ModalProps, \"padding\" | \"component\">;\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalContainer = forwardRef<HTMLDivElement, ModalConfig[\"container\"] & BaseModalProps>(\n ({ className, ...rest }, ref) => {\n return <div className={clsx(\"jkl-modal-container\", className)} {...rest} ref={ref} />;\n },\n);\nModalContainer.displayName = \"ModalContainer\";\n\ntype ModalOverlayProps = ModalConfig[\"overlay\"] &\n BaseModalProps & {\n /**\n * Rendre uten bakgrunnsfarge, men med click target for å lukke modalen ved klikk utenfor.\n */\n transparent?: boolean;\n };\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalOverlay = forwardRef<HTMLDivElement, ModalOverlayProps>(\n ({ className, transparent, ...rest }, ref) => (\n <div\n className={clsx(\"jkl-modal-overlay\", className, {\n \"jkl-modal-overlay--transparent\": transparent,\n })}\n {...rest}\n ref={ref}\n />\n ),\n);\nModalOverlay.displayName = \"ModalOverlay\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const Modal = forwardRef<HTMLElement, ModalConfig[\"modal\"] & ModalProps>(\n ({ className, component, padding, style, ...rest }, ref) => {\n const C = component || \"div\";\n return (\n <C\n className={clsx(\"jkl jkl-modal\", className)}\n style={\n {\n \"--jkl-modal-padding\": padding ? `var(--jkl-spacing-${padding})` : undefined,\n ...style,\n } as React.CSSProperties\n }\n {...rest}\n ref={ref}\n />\n );\n },\n);\nModal.displayName = \"Modal\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalHeader = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n <div className={clsx(\"jkl-modal-header\", className)} {...rest} ref={ref} />\n));\nModalHeader.displayName = \"ModalHeader\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalTitle = forwardRef<HTMLParagraphElement, ModalConfig[\"title\"] & BaseModalProps>(\n ({ className, ...rest }, ref) => <p className={clsx(\"jkl-modal-title\", className)} {...rest} ref={ref} />,\n);\nModalTitle.displayName = \"ModalTitle\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalCloseButton = forwardRef<\n HTMLButtonElement,\n Omit<ModalConfig[\"closeButton\"], \"onClick\"> & BaseModalProps & IconButtonProps\n>(({ className, ...rest }, ref) => (\n <IconButton className={clsx(\"jkl-modal-close\", className)} data-testautoid=\"jkl-modal-close\" {...rest} ref={ref}>\n <CloseIcon variant=\"medium\" />\n </IconButton>\n));\nModalCloseButton.displayName = \"ModalCloseButton\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalBody = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n <div className={clsx(\"jkl-modal-body\", className)} {...rest} ref={ref} />\n));\nModalBody.displayName = \"ModalBody\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalActions = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n <div className={clsx(\"jkl-modal-actions\", className)} {...rest} ref={ref} />\n));\nModalActions.displayName = \"ModalActions\";\n"],"names":["ModalContainer","forwardRef","className","rest","ref","jsx","clsx","displayName","ModalOverlay","transparent","Modal","component","padding","style","ModalHeader","ModalTitle","ModalCloseButton","IconButton","children","CloseIcon","variant","ModalBody","ModalActions"],"mappings":"0gDAuBO,MAAMA,EAAiBC,GAC1B,EAAGC,UAAAA,KAAcC,GAAQC,IACdC,EAAC,OAAIH,UAAWI,EAAK,sBAAuBJ,MAAgBC,EAAMC,IAAAA,MAGjFJ,EAAeO,YAAc,iBAatB,MAAMC,EAAeP,GACxB,EAAGC,UAAAA,EAAWO,YAAAA,KAAgBN,GAAQC,IAClCC,EAAC,MAAA,CACGH,UAAWI,EAAK,oBAAqBJ,EAAW,CAC5C,iCAAkCO,OAElCN,EACJC,IAAAA,MAIZI,EAAaD,YAAc,eAKpB,MAAMG,EAAQT,GACjB,EAAGC,UAAAA,EAAWS,UAAAA,EAAWC,QAAAA,EAASC,MAAAA,KAAUV,GAAQC,IAG5CC,EAFMM,GAAa,MAElB,CACGT,UAAWI,EAAK,gBAAiBJ,GACjCW,MACI,CACI,sBAAuBD,EAAU,qBAAqBA,UAAa,KAChEC,MAGPV,EACJC,IAAAA,MAKhBM,EAAMH,YAAc,QAKb,MAAMO,EAAcb,GAA2C,EAAGC,UAAAA,KAAcC,GAAQC,MAC1F,MAAI,CAAAF,UAAWI,EAAK,mBAAoBJ,MAAgBC,EAAMC,IAAAA,MAEnEU,EAAYP,YAAc,cAKnB,MAAMQ,EAAad,GACtB,EAAGC,UAAAA,KAAcC,GAAQC,IAAQC,EAAC,IAAE,CAAAH,UAAWI,EAAK,kBAAmBJ,MAAgBC,EAAMC,IAAAA,MAEjGW,EAAWR,YAAc,aAKZ,MAAAS,EAAmBf,GAG9B,EAAGC,UAAAA,KAAcC,GAAQC,IACtBC,EAAAY,EAAA,CAAWf,UAAWI,EAAK,kBAAmBJ,GAAY,kBAAgB,qBAAsBC,EAAMC,IAAAA,EACnGc,SAAAb,EAACc,EAAU,CAAAC,QAAQ,eAG3BJ,EAAiBT,YAAc,mBAKxB,MAAMc,EAAYpB,GAA2C,EAAGC,UAAAA,KAAcC,GAAQC,MACxF,MAAI,CAAAF,UAAWI,EAAK,iBAAkBJ,MAAgBC,EAAMC,IAAAA,MAEjEiB,EAAUd,YAAc,YAKjB,MAAMe,EAAerB,GAA2C,EAAGC,UAAAA,KAAcC,GAAQC,MAC3F,MAAI,CAAAF,UAAWI,EAAK,oBAAqBJ,MAAgBC,EAAMC,IAAAA,MAEpEkB,EAAaf,YAAc"}
1
+ {"version":3,"file":"Modal.js","sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { WithOptionalChildren } from \"../../core/types.js\";\nimport { CloseIcon } from \"../icon/index.js\";\nimport { IconButton, IconButtonProps } from \"../icon-button/IconButton.js\";\nimport { ModalConfig } from \"./useModal.js\";\n\nexport interface ModalProps extends WithOptionalChildren {\n id?: string;\n className?: string;\n component?: React.ElementType;\n style?: React.CSSProperties;\n /**\n * Overstyrer padding på modalen via en CSS-variabel.\n */\n padding?: 16 | 24 | 40;\n}\n\ntype BaseModalProps = Omit<ModalProps, \"padding\" | \"component\">;\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalContainer = forwardRef<\n HTMLDivElement,\n ModalConfig[\"container\"] & BaseModalProps\n>(({ className, ...rest }, ref) => {\n // TODO: 'data-portal' fjernes når modalen tar i bruk Popover komponenten\n return (\n <div\n className={clsx(\"jkl-modal-container\", className)}\n {...rest}\n ref={ref}\n data-portal\n />\n );\n});\nModalContainer.displayName = \"ModalContainer\";\n\ntype ModalOverlayProps = ModalConfig[\"overlay\"] &\n BaseModalProps & {\n /**\n * Rendre uten bakgrunnsfarge, men med click target for å lukke modalen ved klikk utenfor.\n */\n transparent?: boolean;\n };\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalOverlay = forwardRef<HTMLDivElement, ModalOverlayProps>(\n ({ className, transparent, ...rest }, ref) => (\n <div\n className={clsx(\"jkl-modal-overlay\", className, {\n \"jkl-modal-overlay--transparent\": transparent,\n })}\n {...rest}\n ref={ref}\n />\n ),\n);\nModalOverlay.displayName = \"ModalOverlay\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const Modal = forwardRef<HTMLElement, ModalConfig[\"modal\"] & ModalProps>(\n ({ className, component, padding, style, ...rest }, ref) => {\n const C = component || \"div\";\n return (\n <C\n className={clsx(\"jkl jkl-modal\", className)}\n style={\n {\n \"--jkl-modal-padding\": padding\n ? `var(--jkl-spacing-${padding})`\n : undefined,\n ...style,\n } as React.CSSProperties\n }\n {...rest}\n ref={ref}\n />\n );\n },\n);\nModal.displayName = \"Modal\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalHeader = forwardRef<HTMLDivElement, BaseModalProps>(\n ({ className, ...rest }, ref) => (\n <div\n className={clsx(\"jkl-modal-header\", className)}\n {...rest}\n ref={ref}\n />\n ),\n);\nModalHeader.displayName = \"ModalHeader\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalTitle = forwardRef<\n HTMLParagraphElement,\n ModalConfig[\"title\"] & BaseModalProps\n>(({ className, ...rest }, ref) => (\n <p className={clsx(\"jkl-modal-title\", className)} {...rest} ref={ref} />\n));\nModalTitle.displayName = \"ModalTitle\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalCloseButton = forwardRef<\n HTMLButtonElement,\n Omit<ModalConfig[\"closeButton\"], \"onClick\"> &\n BaseModalProps &\n IconButtonProps\n>(({ className, ...rest }, ref) => (\n <IconButton\n className={clsx(\"jkl-modal-close\", className)}\n data-testautoid=\"jkl-modal-close\"\n {...rest}\n ref={ref}\n >\n <CloseIcon variant=\"medium\" />\n </IconButton>\n));\nModalCloseButton.displayName = \"ModalCloseButton\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalBody = forwardRef<HTMLDivElement, BaseModalProps>(\n ({ className, ...rest }, ref) => (\n <div\n className={clsx(\"jkl-modal-body\", className)}\n {...rest}\n ref={ref}\n />\n ),\n);\nModalBody.displayName = \"ModalBody\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalActions = forwardRef<HTMLDivElement, BaseModalProps>(\n ({ className, ...rest }, ref) => (\n <div\n className={clsx(\"jkl-modal-actions\", className)}\n {...rest}\n ref={ref}\n />\n ),\n);\nModalActions.displayName = \"ModalActions\";\n"],"names":["ModalContainer","forwardRef","className","rest","ref","jsx","clsx","displayName","ModalOverlay","transparent","Modal","component","padding","style","ModalHeader","ModalTitle","ModalCloseButton","IconButton","children","CloseIcon","variant","ModalBody","ModalActions"],"mappings":"0gDAuBa,MAAAA,EAAiBC,GAG5B,EAAGC,UAAAA,KAAcC,GAAQC,IAGnBC,EAAC,MAAA,CACGH,UAAWI,EAAK,sBAAuBJ,MACnCC,EACJC,IAAAA,EACA,eAAW,MAIvBJ,EAAeO,YAAc,iBAatB,MAAMC,EAAeP,GACxB,EAAGC,UAAAA,EAAWO,YAAAA,KAAgBN,GAAQC,IAClCC,EAAC,MAAA,CACGH,UAAWI,EAAK,oBAAqBJ,EAAW,CAC5C,iCAAkCO,OAElCN,EACJC,IAAAA,MAIZI,EAAaD,YAAc,eAKpB,MAAMG,EAAQT,GACjB,EAAGC,UAAAA,EAAWS,UAAAA,EAAWC,QAAAA,EAASC,MAAAA,KAAUV,GAAQC,IAG5CC,EAFMM,GAAa,MAElB,CACGT,UAAWI,EAAK,gBAAiBJ,GACjCW,MACI,CACI,sBAAuBD,EACjB,qBAAqBA,UACrB,KACHC,MAGPV,EACJC,IAAAA,MAKhBM,EAAMH,YAAc,QAKb,MAAMO,EAAcb,GACvB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAC,MAAA,CACGH,UAAWI,EAAK,mBAAoBJ,MAChCC,EACJC,IAAAA,MAIZU,EAAYP,YAAc,cAKnB,MAAMQ,EAAad,GAGxB,EAAGC,UAAAA,KAAcC,GAAQC,MACtB,IAAE,CAAAF,UAAWI,EAAK,kBAAmBJ,MAAgBC,EAAMC,IAAAA,MAEhEW,EAAWR,YAAc,aAKZ,MAAAS,EAAmBf,GAK9B,EAAGC,UAAAA,KAAcC,GAAQC,IACvBC,EAACY,EAAA,CACGf,UAAWI,EAAK,kBAAmBJ,GACnC,kBAAgB,qBACZC,EACJC,IAAAA,EAEAc,SAAAb,EAACc,EAAU,CAAAC,QAAQ,eAG3BJ,EAAiBT,YAAc,mBAKxB,MAAMc,EAAYpB,GACrB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAC,MAAA,CACGH,UAAWI,EAAK,iBAAkBJ,MAC9BC,EACJC,IAAAA,MAIZiB,EAAUd,YAAc,YAKjB,MAAMe,EAAerB,GACxB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAC,MAAA,CACGH,UAAWI,EAAK,oBAAqBJ,MACjCC,EACJC,IAAAA,MAIZkB,EAAaf,YAAc"}
@@ -1,4 +1,4 @@
1
1
  export type { ModalProps } from './Modal.js';
2
2
  export { ModalContainer, ModalOverlay, Modal, ModalHeader, ModalTitle, ModalCloseButton, ModalBody, ModalActions, } from './Modal.js';
3
- export type { UseModalOptions, ModalInstance, ModalConfig } from './useModal.js';
3
+ export type { UseModalOptions, ModalInstance, ModalConfig, } from './useModal.js';
4
4
  export { useModal } from './useModal.js';
@@ -1 +1 @@
1
- {"version":3,"file":"useModal.js","sources":["../../../../src/components/modal/useModal.ts"],"sourcesContent":["import { A11yDialogConfig, A11yDialogProps, useA11yDialog } from \"react-a11y-dialog\";\nimport { useId } from \"../../hooks/useId/useId.js\";\n\nexport interface UseModalOptions extends Omit<A11yDialogProps, \"id\" | \"closeButtonPosition\"> {\n id?: string;\n /**\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /**\n * Sett til `alertdialog` om du ønsker å slå av muligheten til å lukke med ESC og klikk utenfor.\n *\n * @default \"dialog\"\n */\n role?: \"dialog\" | \"alertdialog\";\n /**\n * Påkrevd for universell utforming. Tittelen kan gjenbrukes som `children` i `<ModalTitle>` med en konstant.\n */\n title: string;\n}\n\nexport type ModalInstance = ReturnType<typeof useModal>[0];\n\nexport interface ModalConfig extends Omit<A11yDialogConfig, \"dialog\"> {\n modal: A11yDialogConfig[\"dialog\"];\n closeButton: A11yDialogConfig[\"closeButton\"] & {\n \"aria-label\": string;\n };\n}\n\n/**\n * @example\n * ```jsx\n * const heading = \"Bekreft sletting\";\n * const [instance, { title, overlay, container, modal, closeButton }] = useModal({ title: heading });\n *\n * useEffect(() => {\n * if (!instance) {\n * return;\n * }\n * instance.show();\n * }, [instance]);\n *\n * return ReactDOM.createPortal(\n * <ModalContainer {...container}>\n * <ModalOverlay {...overlay} />\n * <Modal {...modal}>\n * <ModalHeader>\n * <ModalTitle {...title}>{heading}</ModalTitle>\n * <ModalCloseButton {...closeButton} />\n * </ModalHeader>\n * <ModalBody>\n * Er du sikker på at du vil slette Foo Bar Baz?\n * </ModalBody>\n * <ModalActions>\n * <PrimaryButton\n * onClick={() => {\n * // Do the thing\n * instance?.hide()\n * }}\n * >\n * Bekreft\n * </PrimaryButton>\n * <TertiaryButton onClick={() => instance?.hide()}>\n * Avbryt\n * </TertiaryButton>\n * </ModalActions>\n * </Modal>\n * </ModalContainer>,\n * document.body,\n * );\n * ```\n */\nexport function useModal(props: UseModalOptions) {\n const { id: idProp, role = \"dialog\", closeButtonLabel = \"Lukk\", ...rest } = props;\n\n const id = useId(idProp || \"jkl-modal\", { generateSuffix: !idProp });\n\n const [instance, config] = useA11yDialog({\n id,\n role,\n ...rest,\n });\n\n const { dialog, ...restConfig } = config;\n\n const modalConfig: ModalConfig = {\n modal: config.dialog,\n ...restConfig,\n closeButton: {\n ...config.closeButton,\n \"aria-label\": closeButtonLabel,\n },\n };\n\n return [instance, modalConfig] as const;\n}\n"],"names":["useModal","props","id","idProp","role","closeButtonLabel","rest","useId","generateSuffix","instance","config","useA11yDialog","dialog","restConfig","modal","closeButton"],"mappings":"qGAyEO,SAASA,EAASC,GACf,MAAEC,GAAIC,EAAQC,KAAAA,EAAO,SAAUC,iBAAAA,EAAmB,UAAWC,GAASL,EAEtEC,EAAKK,EAAMJ,GAAU,YAAa,CAAEK,gBAAiBL,KAEpDM,EAAUC,GAAUC,EAAc,CACrCT,GAAAA,EACAE,KAAAA,KACGE,KAGCM,OAAAA,KAAWC,GAAeH,EAW3B,MAAA,CAACD,EATyB,CAC7BK,MAAOJ,EAAOE,UACXC,EACHE,YAAa,IACNL,EAAOK,YACV,aAAcV,IAK1B"}
1
+ {"version":3,"file":"useModal.js","sources":["../../../../src/components/modal/useModal.ts"],"sourcesContent":["import {\n A11yDialogConfig,\n A11yDialogProps,\n useA11yDialog,\n} from \"react-a11y-dialog\";\nimport { useId } from \"../../hooks/useId/useId.js\";\n\nexport interface UseModalOptions\n extends Omit<A11yDialogProps, \"id\" | \"closeButtonPosition\"> {\n id?: string;\n /**\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /**\n * Sett til `alertdialog` om du ønsker å slå av muligheten til å lukke med ESC og klikk utenfor.\n *\n * @default \"dialog\"\n */\n role?: \"dialog\" | \"alertdialog\";\n /**\n * Påkrevd for universell utforming. Tittelen kan gjenbrukes som `children` i `<ModalTitle>` med en konstant.\n */\n title: string;\n}\n\nexport type ModalInstance = ReturnType<typeof useModal>[0];\n\nexport interface ModalConfig extends Omit<A11yDialogConfig, \"dialog\"> {\n modal: A11yDialogConfig[\"dialog\"];\n closeButton: A11yDialogConfig[\"closeButton\"] & {\n \"aria-label\": string;\n };\n}\n\n/**\n * @example\n * ```jsx\n * const heading = \"Bekreft sletting\";\n * const [instance, { title, overlay, container, modal, closeButton }] = useModal({ title: heading });\n *\n * useEffect(() => {\n * if (!instance) {\n * return;\n * }\n * instance.show();\n * }, [instance]);\n *\n * return ReactDOM.createPortal(\n * <ModalContainer {...container}>\n * <ModalOverlay {...overlay} />\n * <Modal {...modal}>\n * <ModalHeader>\n * <ModalTitle {...title}>{heading}</ModalTitle>\n * <ModalCloseButton {...closeButton} />\n * </ModalHeader>\n * <ModalBody>\n * Er du sikker på at du vil slette Foo Bar Baz?\n * </ModalBody>\n * <ModalActions>\n * <PrimaryButton\n * onClick={() => {\n * // Do the thing\n * instance?.hide()\n * }}\n * >\n * Bekreft\n * </PrimaryButton>\n * <TertiaryButton onClick={() => instance?.hide()}>\n * Avbryt\n * </TertiaryButton>\n * </ModalActions>\n * </Modal>\n * </ModalContainer>,\n * document.body,\n * );\n * ```\n */\nexport function useModal(props: UseModalOptions) {\n const {\n id: idProp,\n role = \"dialog\",\n closeButtonLabel = \"Lukk\",\n ...rest\n } = props;\n\n const id = useId(idProp || \"jkl-modal\", { generateSuffix: !idProp });\n\n const [instance, config] = useA11yDialog({\n id,\n role,\n ...rest,\n });\n\n const { dialog, ...restConfig } = config;\n\n const modalConfig: ModalConfig = {\n modal: config.dialog,\n ...restConfig,\n closeButton: {\n ...config.closeButton,\n \"aria-label\": closeButtonLabel,\n },\n };\n\n return [instance, modalConfig] as const;\n}\n"],"names":["useModal","props","id","idProp","role","closeButtonLabel","rest","useId","generateSuffix","instance","config","useA11yDialog","dialog","restConfig","modal","closeButton"],"mappings":"qGA8EO,SAASA,EAASC,GACf,MACFC,GAAIC,EACJC,KAAAA,EAAO,SACPC,iBAAAA,EAAmB,UAChBC,GACHL,EAEEC,EAAKK,EAAMJ,GAAU,YAAa,CAAEK,gBAAiBL,KAEpDM,EAAUC,GAAUC,EAAc,CACrCT,GAAAA,EACAE,KAAAA,KACGE,KAGCM,OAAAA,KAAWC,GAAeH,EAW3B,MAAA,CAACD,EATyB,CAC7BK,MAAOJ,EAAOE,UACXC,EACHE,YAAa,IACNL,EAAOK,YACV,aAAcV,IAK1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"Pagination.js","sources":["../../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { PolymorphicPropsWithRef, PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../icon/index.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { PageButton } from \"./PageButton.js\";\n\nexport type PaginationProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<\n ElementType,\n {\n currentPage: number;\n numberOfPages: number;\n onPageChange: (toPage: number, fromPage: number) => void;\n /**\n * Dersom du ønsker å ha custom labels kan du sende inn disse. \"next\" og \"previous\"\n * brukes som hint til skjermlesere for ikon-knappene til Neste/Forrige side\n * @default { previous: \"Forrige side\", next: \"Neste side\" }\n */\n labels?: {\n previous: string;\n next: string;\n };\n }\n>;\n\nexport type PaginationComponent = <ElementType extends React.ElementType = \"nav\">(\n props: PaginationProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Pagination = React.forwardRef(function Pagination<ElementType extends React.ElementType = \"nav\">(\n {\n onPageChange,\n currentPage,\n numberOfPages,\n labels = {\n previous: \"Forrige side\",\n next: \"Neste side\",\n },\n as,\n ...rest\n }: PaginationProps<ElementType>,\n ref?: PolymorphicRef<ElementType>,\n) {\n useEffect(() => {\n if (currentPage < 1) {\n console.error(\"[Pagination]: currentPage prop should be set to a value larger than 0\");\n }\n if (currentPage > numberOfPages) {\n console.error(\"[Pagination]: currentPage prop should not be set to a value larger than numberOfPages\");\n }\n }, [currentPage, numberOfPages]);\n\n const Component = as || \"nav\";\n\n if (numberOfPages <= 7) {\n return (\n <Component ref={ref} {...rest} className=\"jkl-pagination\">\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.previous}\n onClick={() => onPageChange(currentPage - 1, currentPage)}\n aria-disabled={currentPage === 1}\n tabIndex={currentPage === 1 ? -1 : 0}\n >\n <ChevronLeftIcon />\n </IconButton>\n <ol className=\"jkl-pagination__pages\">\n {Array.from({ length: numberOfPages }).map((_, index) => {\n const page = index + 1;\n return (\n <PageButton\n key={index}\n isActive={currentPage === page}\n number={page}\n total={numberOfPages}\n onClick={() => onPageChange(page, currentPage)}\n />\n );\n })}\n </ol>\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.next}\n onClick={() => onPageChange(currentPage + 1, currentPage)}\n aria-disabled={currentPage === numberOfPages}\n tabIndex={currentPage === numberOfPages ? -1 : 0}\n >\n <ChevronRightIcon />\n </IconButton>\n </Component>\n );\n }\n\n const showStartEllipsis = currentPage > 4;\n const showEndEllipsis = currentPage < numberOfPages - 3;\n\n const startEllipsis = Math.min(Math.max(currentPage - 2, 2), numberOfPages - 5);\n const centerPageNumberStart = Math.min(startEllipsis + 1, numberOfPages - 4);\n const centerPageNumber = Math.min(centerPageNumberStart + 1, numberOfPages - 3);\n const centerPageNumberEnd = Math.min(centerPageNumberStart + 2, numberOfPages - 2);\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 1);\n\n return (\n <Component ref={ref} {...rest} className=\"jkl-pagination\">\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.previous}\n onClick={() => onPageChange(currentPage - 1, currentPage)}\n aria-disabled={currentPage === 1}\n tabIndex={currentPage === 1 ? -1 : 0}\n >\n <ChevronLeftIcon />\n </IconButton>\n <ol className=\"jkl-pagination__pages\">\n <PageButton\n isActive={currentPage === 1}\n number={1}\n total={numberOfPages}\n onClick={() => onPageChange(1, currentPage)}\n />\n {showStartEllipsis ? (\n <span aria-hidden className=\"jkl-pagination-button--elipsis\">\n {\"...\"}\n </span>\n ) : (\n <PageButton\n isActive={currentPage === startEllipsis}\n number={startEllipsis}\n total={numberOfPages}\n onClick={() => onPageChange(startEllipsis, currentPage)}\n />\n )}\n <PageButton\n isActive={currentPage === centerPageNumberStart}\n number={centerPageNumberStart}\n total={numberOfPages}\n onClick={() => onPageChange(centerPageNumberStart, currentPage)}\n />\n <PageButton\n isActive={currentPage === centerPageNumber}\n number={centerPageNumber}\n total={numberOfPages}\n onClick={() => onPageChange(centerPageNumber, currentPage)}\n />\n <PageButton\n isActive={currentPage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n total={numberOfPages}\n onClick={() => onPageChange(centerPageNumberEnd, currentPage)}\n />\n {showEndEllipsis ? (\n <span aria-hidden className=\"jkl-pagination-button--elipsis\">\n {\"...\"}\n </span>\n ) : (\n <PageButton\n isActive={currentPage === endEllipsis}\n number={endEllipsis}\n total={numberOfPages}\n onClick={() => onPageChange(endEllipsis, currentPage)}\n />\n )}\n <PageButton\n isActive={currentPage === numberOfPages}\n number={numberOfPages}\n total={numberOfPages}\n onClick={() => onPageChange(numberOfPages, currentPage)}\n />\n </ol>\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.next}\n onClick={() => onPageChange(currentPage + 1, currentPage)}\n aria-disabled={currentPage === numberOfPages}\n tabIndex={currentPage === numberOfPages ? -1 : 0}\n >\n <ChevronRightIcon />\n </IconButton>\n </Component>\n );\n}) as PaginationComponent;\n"],"names":["Pagination","React","forwardRef","onPageChange","currentPage","numberOfPages","labels","previous","next","as","rest","ref","useEffect","console","error","Component","className","children","jsx","IconButton","title","onClick","tabIndex","ChevronLeftIcon","from","length","map","_","index","page","PageButton","isActive","number","total","ChevronRightIcon","showStartEllipsis","showEndEllipsis","startEllipsis","Math","min","max","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","jsxs"],"mappings":"sjDA4BO,MAAMA,EAAaC,EAAMC,YAAW,UAEnCC,aAAAA,EACAC,YAAAA,EACAC,cAAAA,EACAC,OAAAA,EAAS,CACLC,SAAU,eACVC,KAAM,cAEVC,GAAAA,KACGC,GAEPC,GAEAC,GAAU,KACFR,EAAc,GACdS,QAAQC,MAAM,yEAEdV,EAAcC,GACdQ,QAAQC,MAAM,wFAAuF,GAE1G,CAACV,EAAaC,IAEjB,MAAMU,EAAYN,GAAM,MAExB,GAAIJ,GAAiB,WAEZU,EAAU,CAAAJ,IAAAA,KAAcD,EAAMM,UAAU,iBACrCC,SAAA,CAAAC,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOC,SACdc,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAA+B,IAAhBA,EACfkB,SAA0B,IAAhBlB,GAAyB,EAAA,EAEnCa,WAACM,EAAgB,MAEpBL,EAAA,KAAA,CAAGF,UAAU,wBACTC,eAAMO,KAAK,CAAEC,OAAQpB,IAAiBqB,KAAI,CAACC,EAAGC,KAC3C,MAAMC,EAAOD,EAAQ,EAEjB,OAAAV,EAACY,EAAA,CAEGC,SAAU3B,IAAgByB,EAC1BG,OAAQH,EACRI,MAAO5B,EACPgB,QAAS,IAAMlB,EAAa0B,EAAMzB,IAJ7BwB,EAAA,MASrBV,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOE,KACda,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAAeA,IAAgBC,EAC/BiB,SAAUlB,IAAgBC,GAAqB,EAAA,EAE/CY,WAACiB,EAAiB,SAM5BC,MAAAA,EAAoB/B,EAAc,EAClCgC,EAAkBhC,EAAcC,EAAgB,EAEhDgC,EAAgBC,KAAKC,IAAID,KAAKE,IAAIpC,EAAc,EAAG,GAAIC,EAAgB,GACvEoC,EAAwBH,KAAKC,IAAIF,EAAgB,EAAGhC,EAAgB,GACpEqC,EAAmBJ,KAAKC,IAAIE,EAAwB,EAAGpC,EAAgB,GACvEsC,EAAsBL,KAAKC,IAAIE,EAAwB,EAAGpC,EAAgB,GAC1EuC,EAAcN,KAAKC,IAAIE,EAAwB,EAAGpC,EAAgB,YAGnEU,EAAU,CAAAJ,IAAAA,KAAcD,EAAMM,UAAU,iBACrCC,SAAA,CAAAC,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOC,SACdc,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAA+B,IAAhBA,EACfkB,SAA0B,IAAhBlB,GAAyB,EAAA,EAEnCa,WAACM,EAAgB,MAErBsB,EAAC,KAAG,CAAA7B,UAAU,wBACVC,SAAA,CAAAC,EAACY,EAAA,CACGC,SAA0B,IAAhB3B,EACV4B,OAAQ,EACRC,MAAO5B,EACPgB,QAAS,IAAMlB,EAAa,EAAGC,KAElC+B,IACI,OAAK,CAAA,eAAW,EAACnB,UAAU,iCACvBC,iBAGLC,EAACY,EAAA,CACGC,SAAU3B,IAAgBiC,EAC1BL,OAAQK,EACRJ,MAAO5B,EACPgB,QAAS,IAAMlB,EAAakC,EAAejC,KAGnDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBqC,EAC1BT,OAAQS,EACRR,MAAO5B,EACPgB,QAAS,IAAMlB,EAAasC,EAAuBrC,KAEvDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBsC,EAC1BV,OAAQU,EACRT,MAAO5B,EACPgB,QAAS,IAAMlB,EAAauC,EAAkBtC,KAElDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBuC,EAC1BX,OAAQW,EACRV,MAAO5B,EACPgB,QAAS,IAAMlB,EAAawC,EAAqBvC,KAEpDgC,IACI,OAAK,CAAA,eAAW,EAACpB,UAAU,iCACvBC,iBAGLC,EAACY,EAAA,CACGC,SAAU3B,IAAgBwC,EAC1BZ,OAAQY,EACRX,MAAO5B,EACPgB,QAAS,IAAMlB,EAAayC,EAAaxC,KAGjDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBC,EAC1B2B,OAAQ3B,EACR4B,MAAO5B,EACPgB,QAAS,IAAMlB,EAAaE,EAAeD,QAGnDc,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOE,KACda,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAAeA,IAAgBC,EAC/BiB,SAAUlB,IAAgBC,GAAqB,EAAA,EAE/CY,WAACiB,EAAiB,QAIlC"}
1
+ {"version":3,"file":"Pagination.js","sources":["../../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport {\n PolymorphicPropsWithRef,\n PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../icon/index.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { PageButton } from \"./PageButton.js\";\n\nexport type PaginationProps<ElementType extends React.ElementType> =\n PolymorphicPropsWithRef<\n ElementType,\n {\n currentPage: number;\n numberOfPages: number;\n onPageChange: (toPage: number, fromPage: number) => void;\n /**\n * Dersom du ønsker å ha custom labels kan du sende inn disse. \"next\" og \"previous\"\n * brukes som hint til skjermlesere for ikon-knappene til Neste/Forrige side\n * @default { previous: \"Forrige side\", next: \"Neste side\" }\n */\n labels?: {\n previous: string;\n next: string;\n };\n }\n >;\n\nexport type PaginationComponent = <\n ElementType extends React.ElementType = \"nav\",\n>(\n props: PaginationProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Pagination = React.forwardRef(function Pagination<\n ElementType extends React.ElementType = \"nav\",\n>(\n {\n onPageChange,\n currentPage,\n numberOfPages,\n labels = {\n previous: \"Forrige side\",\n next: \"Neste side\",\n },\n as,\n ...rest\n }: PaginationProps<ElementType>,\n ref?: PolymorphicRef<ElementType>,\n) {\n useEffect(() => {\n if (currentPage < 1) {\n console.error(\n \"[Pagination]: currentPage prop should be set to a value larger than 0\",\n );\n }\n if (currentPage > numberOfPages) {\n console.error(\n \"[Pagination]: currentPage prop should not be set to a value larger than numberOfPages\",\n );\n }\n }, [currentPage, numberOfPages]);\n\n const Component = as || \"nav\";\n\n if (numberOfPages <= 7) {\n return (\n <Component ref={ref} {...rest} className=\"jkl-pagination\">\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.previous}\n onClick={() => onPageChange(currentPage - 1, currentPage)}\n aria-disabled={currentPage === 1}\n tabIndex={currentPage === 1 ? -1 : 0}\n >\n <ChevronLeftIcon />\n </IconButton>\n <ol className=\"jkl-pagination__pages\">\n {Array.from({ length: numberOfPages }).map((_, index) => {\n const page = index + 1;\n return (\n <PageButton\n key={index}\n isActive={currentPage === page}\n number={page}\n total={numberOfPages}\n onClick={() => onPageChange(page, currentPage)}\n />\n );\n })}\n </ol>\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.next}\n onClick={() => onPageChange(currentPage + 1, currentPage)}\n aria-disabled={currentPage === numberOfPages}\n tabIndex={currentPage === numberOfPages ? -1 : 0}\n >\n <ChevronRightIcon />\n </IconButton>\n </Component>\n );\n }\n\n const showStartEllipsis = currentPage > 4;\n const showEndEllipsis = currentPage < numberOfPages - 3;\n\n const startEllipsis = Math.min(\n Math.max(currentPage - 2, 2),\n numberOfPages - 5,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 4,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 3,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 2,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 1);\n\n return (\n <Component ref={ref} {...rest} className=\"jkl-pagination\">\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.previous}\n onClick={() => onPageChange(currentPage - 1, currentPage)}\n aria-disabled={currentPage === 1}\n tabIndex={currentPage === 1 ? -1 : 0}\n >\n <ChevronLeftIcon />\n </IconButton>\n <ol className=\"jkl-pagination__pages\">\n <PageButton\n isActive={currentPage === 1}\n number={1}\n total={numberOfPages}\n onClick={() => onPageChange(1, currentPage)}\n />\n {showStartEllipsis ? (\n <span\n aria-hidden\n className=\"jkl-pagination-button--elipsis\"\n >\n {\"...\"}\n </span>\n ) : (\n <PageButton\n isActive={currentPage === startEllipsis}\n number={startEllipsis}\n total={numberOfPages}\n onClick={() => onPageChange(startEllipsis, currentPage)}\n />\n )}\n <PageButton\n isActive={currentPage === centerPageNumberStart}\n number={centerPageNumberStart}\n total={numberOfPages}\n onClick={() =>\n onPageChange(centerPageNumberStart, currentPage)\n }\n />\n <PageButton\n isActive={currentPage === centerPageNumber}\n number={centerPageNumber}\n total={numberOfPages}\n onClick={() => onPageChange(centerPageNumber, currentPage)}\n />\n <PageButton\n isActive={currentPage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n total={numberOfPages}\n onClick={() =>\n onPageChange(centerPageNumberEnd, currentPage)\n }\n />\n {showEndEllipsis ? (\n <span\n aria-hidden\n className=\"jkl-pagination-button--elipsis\"\n >\n {\"...\"}\n </span>\n ) : (\n <PageButton\n isActive={currentPage === endEllipsis}\n number={endEllipsis}\n total={numberOfPages}\n onClick={() => onPageChange(endEllipsis, currentPage)}\n />\n )}\n <PageButton\n isActive={currentPage === numberOfPages}\n number={numberOfPages}\n total={numberOfPages}\n onClick={() => onPageChange(numberOfPages, currentPage)}\n />\n </ol>\n <IconButton\n className=\"jkl-pagination-button\"\n title={labels.next}\n onClick={() => onPageChange(currentPage + 1, currentPage)}\n aria-disabled={currentPage === numberOfPages}\n tabIndex={currentPage === numberOfPages ? -1 : 0}\n >\n <ChevronRightIcon />\n </IconButton>\n </Component>\n );\n}) as PaginationComponent;\n"],"names":["Pagination","React","forwardRef","onPageChange","currentPage","numberOfPages","labels","previous","next","as","rest","ref","useEffect","console","error","Component","className","children","jsx","IconButton","title","onClick","tabIndex","ChevronLeftIcon","from","length","map","_","index","page","PageButton","isActive","number","total","ChevronRightIcon","showStartEllipsis","showEndEllipsis","startEllipsis","Math","min","max","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","jsxs"],"mappings":"sjDAkCO,MAAMA,EAAaC,EAAMC,YAAW,UAInCC,aAAAA,EACAC,YAAAA,EACAC,cAAAA,EACAC,OAAAA,EAAS,CACLC,SAAU,eACVC,KAAM,cAEVC,GAAAA,KACGC,GAEPC,GAEAC,GAAU,KACFR,EAAc,GACNS,QAAAC,MACJ,yEAGJV,EAAcC,GACNQ,QAAAC,MACJ,wFAAA,GAGT,CAACV,EAAaC,IAEjB,MAAMU,EAAYN,GAAM,MAExB,GAAIJ,GAAiB,WAEZU,EAAU,CAAAJ,IAAAA,KAAcD,EAAMM,UAAU,iBACrCC,SAAA,CAAAC,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOC,SACdc,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAA+B,IAAhBA,EACfkB,SAA0B,IAAhBlB,GAAyB,EAAA,EAEnCa,WAACM,EAAgB,MAEpBL,EAAA,KAAA,CAAGF,UAAU,wBACTC,eAAMO,KAAK,CAAEC,OAAQpB,IAAiBqB,KAAI,CAACC,EAAGC,KAC3C,MAAMC,EAAOD,EAAQ,EAEjB,OAAAV,EAACY,EAAA,CAEGC,SAAU3B,IAAgByB,EAC1BG,OAAQH,EACRI,MAAO5B,EACPgB,QAAS,IAAMlB,EAAa0B,EAAMzB,IAJ7BwB,EAAA,MASrBV,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOE,KACda,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAAeA,IAAgBC,EAC/BiB,SAAUlB,IAAgBC,GAAqB,EAAA,EAE/CY,WAACiB,EAAiB,SAM5BC,MAAAA,EAAoB/B,EAAc,EAClCgC,EAAkBhC,EAAcC,EAAgB,EAEhDgC,EAAgBC,KAAKC,IACvBD,KAAKE,IAAIpC,EAAc,EAAG,GAC1BC,EAAgB,GAEdoC,EAAwBH,KAAKC,IAC/BF,EAAgB,EAChBhC,EAAgB,GAEdqC,EAAmBJ,KAAKC,IAC1BE,EAAwB,EACxBpC,EAAgB,GAEdsC,EAAsBL,KAAKC,IAC7BE,EAAwB,EACxBpC,EAAgB,GAEduC,EAAcN,KAAKC,IAAIE,EAAwB,EAAGpC,EAAgB,YAGnEU,EAAU,CAAAJ,IAAAA,KAAcD,EAAMM,UAAU,iBACrCC,SAAA,CAAAC,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOC,SACdc,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAA+B,IAAhBA,EACfkB,SAA0B,IAAhBlB,GAAyB,EAAA,EAEnCa,WAACM,EAAgB,MAErBsB,EAAC,KAAG,CAAA7B,UAAU,wBACVC,SAAA,CAAAC,EAACY,EAAA,CACGC,SAA0B,IAAhB3B,EACV4B,OAAQ,EACRC,MAAO5B,EACPgB,QAAS,IAAMlB,EAAa,EAAGC,KAElC+B,EACGjB,EAAC,OAAA,CACG,eAAW,EACXF,UAAU,iCAETC,SAAA,QAGLC,EAACY,EAAA,CACGC,SAAU3B,IAAgBiC,EAC1BL,OAAQK,EACRJ,MAAO5B,EACPgB,QAAS,IAAMlB,EAAakC,EAAejC,KAGnDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBqC,EAC1BT,OAAQS,EACRR,MAAO5B,EACPgB,QAAS,IACLlB,EAAasC,EAAuBrC,KAG5Cc,EAACY,EAAA,CACGC,SAAU3B,IAAgBsC,EAC1BV,OAAQU,EACRT,MAAO5B,EACPgB,QAAS,IAAMlB,EAAauC,EAAkBtC,KAElDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBuC,EAC1BX,OAAQW,EACRV,MAAO5B,EACPgB,QAAS,IACLlB,EAAawC,EAAqBvC,KAGzCgC,EACGlB,EAAC,OAAA,CACG,eAAW,EACXF,UAAU,iCAETC,SAAA,QAGLC,EAACY,EAAA,CACGC,SAAU3B,IAAgBwC,EAC1BZ,OAAQY,EACRX,MAAO5B,EACPgB,QAAS,IAAMlB,EAAayC,EAAaxC,KAGjDc,EAACY,EAAA,CACGC,SAAU3B,IAAgBC,EAC1B2B,OAAQ3B,EACR4B,MAAO5B,EACPgB,QAAS,IAAMlB,EAAaE,EAAeD,QAGnDc,EAACC,EAAA,CACGH,UAAU,wBACVI,MAAOd,EAAOE,KACda,QAAS,IAAMlB,EAAaC,EAAc,EAAGA,GAC7C,gBAAeA,IAAgBC,EAC/BiB,SAAUlB,IAAgBC,GAAqB,EAAA,EAE/CY,WAACiB,EAAiB,QAIlC"}
@@ -1,2 +1,2 @@
1
- import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as n,FloatingPortal as t,FloatingFocusManager as o,useFloating as s,offset as r,flip as a,shift as i,autoUpdate as l,useClick as c,useHover as u,useFocus as d,useDismiss as p,useRole as f,useInteractions as m}from"@floating-ui/react";import{c as g}from"../../../clsx-BeLtu-UY.js";import*as h from"react";import{getThemeAndDensity as v}from"../../utilities/getThemeAndDensity.js";const x=h.createContext(null),y=()=>{const e=h.useContext(x);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},F=({children:n,...t})=>{const o=(({open:e,onOpenChange:n,placement:t="bottom-start",strategy:o="absolute",modal:g=!0,offset:v=4,positionReference:x,hoverOptions:y,focusOptions:F,clickOptions:k,roleOptions:C,dismissOptions:b})=>{const[O,P]=h.useState(e),R=e??O,j=n??P,E=s({open:R,onOpenChange:j,placement:t,strategy:o,middleware:[r(v),a({padding:5,fallbackPlacements:["bottom","top"]}),i({padding:12})],whileElementsMounted:l}),w=E.context,M=c(w,{enabled:!1,...k}),D=u(w,{enabled:!1,...y}),T=d(w,{enabled:!1,...F}),A=p(w,b),N=f(w,C),S=m([M,A,T,D,N]);return h.useLayoutEffect((()=>{x&&E.refs.setPositionReference(null==x?void 0:x.current)}),[x,E.refs]),h.useMemo((()=>({open:R,onOpenChange:j,modal:g,...S,...E})),[R,j,g,S,E])})({...t});return e(x.Provider,{value:o,children:n})},k=h.forwardRef((function({children:t,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:i,open:l,onOpenChange:c}=y(),u=t.ref,d=n([a.setReference,r,u]);return o&&h.isValidElement(t)?h.cloneElement(t,i({ref:d,...s,...t.props})):e("button",{ref:d,onClick:()=>null==c?void 0:c(!l),"aria-expanded":l,...i(s),children:t})})),C=h.forwardRef((function({style:s,className:r,padding:a=0,initialFocus:i=0,returnFocus:l=!0,...c},u){const{context:d,modal:p,refs:f,open:m,floatingStyles:h,getFloatingProps:x}=y(),F=n([f.setFloating,u]),k=f.reference.current,{theme:C,density:b}=v((O=k)&&"contextElement"in O?k.contextElement:k);var O;return m?e(t,{children:e(o,{context:d,modal:p,initialFocus:i,returnFocus:l,children:e("div",{"data-theme":C,"data-layout-density":b,className:g("jkl jkl-popover",r),ref:F,style:{...s,...h,"--popover-padding":`var(--jkl-spacing-${a})`},...x(c),children:c.children})})}):null}));F.Trigger=k,F.Content=C;export{F as Popover,F as default};
1
+ import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as n,FloatingPortal as t,FloatingFocusManager as o,useFloating as s,offset as r,flip as a,shift as l,autoUpdate as i,useClick as c,useHover as u,useFocus as d,useDismiss as p,useRole as f,useInteractions as m}from"@floating-ui/react";import{c as g}from"../../../clsx-BeLtu-UY.js";import*as h from"react";import{getThemeAndDensity as v}from"../../utilities/getThemeAndDensity.js";const x=h.createContext(null),y=()=>{const e=h.useContext(x);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},F=({children:n,...t})=>{const o=(({open:e,onOpenChange:n,placement:t="bottom-start",strategy:o="absolute",modal:g=!0,offset:v=4,positionReference:x,hoverOptions:y,focusOptions:F,clickOptions:R,roleOptions:k,dismissOptions:C})=>{const[b,O]=h.useState(e),P=e??b,E=n??O,j=s({open:P,onOpenChange:E,placement:t,strategy:o,middleware:[r(v),a({padding:5,fallbackPlacements:["bottom","top"]}),l({padding:12})],whileElementsMounted:i}),w=j.context,M=c(w,{enabled:!1,...R}),D=u(w,{enabled:!1,...y}),T=d(w,{enabled:!1,...F}),A=p(w,C),N=f(w,k),S=m([M,A,T,D,N]);return h.useLayoutEffect((()=>{x&&j.refs.setPositionReference(null==x?void 0:x.current)}),[x,j.refs]),h.useMemo((()=>({open:P,onOpenChange:E,modal:g,...S,...j})),[P,E,g,S,j])})({...t});return e(x.Provider,{value:o,children:n})},R=h.forwardRef((function({children:t,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:l,open:i,onOpenChange:c}=y(),u=t.ref,d=n([a.setReference,r,u]);return o&&h.isValidElement(t)?h.cloneElement(t,l({ref:d,...s,...t.props})):e("button",{ref:d,onClick:()=>null==c?void 0:c(!i),"aria-expanded":i,...l(s),children:t})})),k=h.forwardRef((function({style:s,className:r,padding:a=0,initialFocus:l=0,returnFocus:i=!0,...c},u){const{context:d,modal:p,refs:f,open:m,floatingStyles:x,getFloatingProps:F}=y(),R=n([f.setFloating,u]),k=f.reference.current,{theme:C,density:b}=v((P=k)&&"contextElement"in P?k.contextElement:k),O=h.useRef(null);var P;return h.useEffect((()=>{var e;O.current=(null==(e=d.elements.domReference)?void 0:e.closest("[data-portal]"))||null}),[d.elements.domReference]),m?e(t,{root:O.current,children:e(o,{context:d,modal:p,initialFocus:l,returnFocus:i,children:e("div",{"data-theme":C,"data-layout-density":b,className:g("jkl jkl-popover",r),ref:R,style:{...s,...x,"--popover-padding":`var(--jkl-spacing-${a})`},...F(c),children:c.children})})}):null}));F.Trigger=R,F.Content=k;export{F as Popover,F as default};
2
2
  //# sourceMappingURL=Popover.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n useFloating,\n useFocus,\n useHover,\n useClick,\n useDismiss,\n autoUpdate,\n useRole,\n useMergeRefs,\n offset,\n flip,\n shift,\n useInteractions,\n FloatingPortal,\n FloatingFocusManager,\n UseFloatingOptions,\n VirtualElement,\n ReferenceElement,\n ReferenceType,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndDensity } from \"../../utilities/getThemeAndDensity.js\";\n\ntype ClickOptions = Parameters<typeof useClick>[1];\ntype DismissOptions = Parameters<typeof useDismiss>[1];\ntype FocusOptions = Parameters<typeof useFocus>[1];\ntype HoverOptions = Parameters<typeof useHover>[1];\ntype RoleOptions = Parameters<typeof useRole>[1];\n\ninterface PopoverOptions {\n /**\n * Angir om popoveren er åpen eller lukket.\n *\n * @see https://floating-ui.com/docs/usefloating#open\n */\n open?: boolean;\n /**\n * Callback som trigges når popoveren åpnes eller lukkes.\n *\n * @see https://floating-ui.com/docs/usefloating#onopenchange\n */\n onOpenChange?: UseFloatingOptions[\"onOpenChange\"];\n /**\n * Bestemmer plasseringen av popoveren.\n *\n * @see https://floating-ui.com/docs/usefloating#placement\n *\n * @default \"bottom-start\"\n */\n placement?: UseFloatingOptions[\"placement\"];\n /**\n * Definerer strategien for posisjonering av popoveren.\n *\n * @see https://floating-ui.com/docs/usefloating#strategy\n *\n * @default \"absolute\"\n */\n strategy?: UseFloatingOptions[\"strategy\"];\n /**\n * Angir om popoveren skal fungere som en modal, der fokus er låst til det flytende elementet\n * og innhold utenfor ikke kan interageres med.\n *\n * @see https://floating-ui.com/docs/usefloating#modal\n *\n * @default true\n */\n modal?: boolean;\n /**\n * Justerer avstanden mellom referanse-elementet og popoveren.\n *\n * @see https://floating-ui.com/docs/offset\n *\n * @default 4\n */\n offset?: number;\n /**\n * Referanse til elementet som popoveren skal posisjoneres i forhold til.\n *\n * @see https://floating-ui.com/docs/usefloating#setpositionreference\n *\n * @default Popover.Trigger\n */\n positionReference?: React.RefObject<ReferenceType>;\n /**\n * Options for hover-interaksjoner.\n *\n * @see https://floating-ui.com/docs/usehover\n *\n * @default { enabled: false }\n */\n hoverOptions?: HoverOptions;\n /**\n * Options for fokus-interaksjoner.\n *\n * @see https://floating-ui.com/docs/usefocus\n *\n * @default { enabled: false }\n */\n focusOptions?: FocusOptions;\n /**\n * Options for klikk-interaksjoner.\n *\n * @see https://floating-ui.com/docs/useclick\n *\n * @default { enabled: false }\n */\n clickOptions?: ClickOptions;\n /**\n * Konfigurerer rollen for popoveren.\n *\n * @see https://floating-ui.com/docs/userole\n *\n * @default { enabled: true, role: \"dialog\" }\n */\n roleOptions?: RoleOptions;\n /**\n * Options for å lukke popoveren når en dismissal skjer,\n * som ved å klikke utenfor eller trykke på \"Escape\"-tasten.\n *\n * @see https://floating-ui.com/docs/usedismiss\n *\n * @default { enabled: true }\n */\n dismissOptions?: DismissOptions;\n}\n\nconst usePopover = ({\n open: _open,\n onOpenChange: _onOpenChange,\n placement = \"bottom-start\",\n strategy = \"absolute\",\n modal = true,\n offset: _offset = 4,\n positionReference,\n hoverOptions,\n focusOptions,\n clickOptions,\n roleOptions,\n dismissOptions,\n}: PopoverOptions) => {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(_open);\n\n const open = _open ?? uncontrolledOpen;\n const onOpenChange = _onOpenChange ?? setUncontrolledOpen;\n\n const data = useFloating({\n open,\n onOpenChange,\n placement,\n strategy,\n middleware: [\n offset(_offset),\n flip({ padding: 5, fallbackPlacements: [\"bottom\", \"top\"] }),\n shift({ padding: 12 }),\n ],\n whileElementsMounted: autoUpdate,\n });\n\n const context = data.context;\n\n const click = useClick(context, {\n enabled: false,\n ...clickOptions,\n });\n const hover = useHover(context, { enabled: false, ...hoverOptions });\n const focus = useFocus(context, { enabled: false, ...focusOptions });\n const dismiss = useDismiss(context, dismissOptions);\n const role = useRole(context, roleOptions);\n\n const interactions = useInteractions([click, dismiss, focus, hover, role]);\n\n React.useLayoutEffect(() => {\n if (positionReference) {\n data.refs.setPositionReference(positionReference?.current);\n }\n }, [positionReference, data.refs]);\n\n return React.useMemo(\n () => ({\n open,\n onOpenChange,\n modal,\n ...interactions,\n ...data,\n }),\n [open, onOpenChange, modal, interactions, data],\n );\n};\n\ntype PopoverContextType = ReturnType<typeof usePopover> | null;\n\nconst PopoverContext = React.createContext<PopoverContextType>(null);\n\nconst usePopoverContext = () => {\n const context = React.useContext(PopoverContext);\n\n if (context == null) {\n throw new Error(\"Popover komponenter må brukes innenfor en <Popover /> komponent\");\n }\n\n return context;\n};\n\nexport const Popover = ({\n children,\n ...restOptions\n}: {\n children: React.ReactNode;\n} & PopoverOptions) => {\n const popover = usePopover({ ...restOptions });\n return <PopoverContext.Provider value={popover}>{children}</PopoverContext.Provider>;\n};\n\ninterface PopoverTriggerProps {\n children: React.ReactNode;\n /**\n * Rendrer komponenten som child-elementet sitt, og slår sammen egenskaper og props.\n *\n * Default er `false`.\n *\n * @example\n * ```tsx\n * <Component asChild foo=\"bar\">\n * <Child baz=\"qux\" />\n * </Component>\n *\n * // Rendrer følgende:\n * <Child foo=\"bar\" baz=\"qux\" />\n * ```\n */\n asChild?: boolean;\n}\n\nconst PopoverTrigger = React.forwardRef<HTMLElement, React.HTMLProps<HTMLElement> & PopoverTriggerProps>(\n function PopoverTrigger({ children, asChild = false, ...props }, propRef) {\n const { refs, getReferenceProps, open, onOpenChange } = usePopoverContext();\n const childrenRef = (children as any).ref;\n const ref = useMergeRefs([refs.setReference, propRef, childrenRef]);\n\n if (asChild && React.isValidElement(children)) {\n return React.cloneElement(\n children,\n getReferenceProps({\n ref,\n ...props,\n ...children.props,\n }),\n );\n }\n\n return (\n <button ref={ref} onClick={() => onOpenChange?.(!open)} aria-expanded={open} {...getReferenceProps(props)}>\n {children}\n </button>\n );\n },\n);\n\ninterface PopoverContentProps {\n /**\n * Padding rundt innholdet i popoveren.\n *\n * Default er `0`.\n */\n padding?: 0 | 8 | 16 | 24;\n /**\n *\n * Angir hvilket element som skal motta fokus ved åpning.\n * Kan være en tabbar index eller en referanse til et element.\"\n *\n * Default er `0`, som betyr at det første fokuserbare elementet i popoveren får fokus.\n * @see https://floating-ui.com/docs/FloatingFocusManager#initialfocus\n */\n initialFocus?: number | React.RefObject<HTMLElement>;\n /**\n * Angir om fokus skal returneres til triggeren når popoveren lukkes.\n *\n * Default er `true`.\n * @see https://floating-ui.com/docs/FloatingFocusManager#returnfocus\n */\n returnFocus?: boolean;\n}\n\n// Er popover-elementet posisjonert i forhold til et annet element enn triggeren?\nconst isCustomPositioned = (referenceElement: ReferenceElement): referenceElement is VirtualElement => {\n if (!referenceElement) return false;\n\n return \"contextElement\" in referenceElement;\n};\n\nconst PopoverContent = React.forwardRef<HTMLDivElement, React.HTMLProps<HTMLDivElement> & PopoverContentProps>(\n function PopoverContent(\n { style, className, padding = 0, initialFocus = 0, returnFocus = true, ...props },\n propRef,\n ) {\n const { context, modal, refs, open, floatingStyles, getFloatingProps } = usePopoverContext();\n const ref = useMergeRefs([refs.setFloating, propRef]);\n\n const referenceElement = refs.reference.current as ReferenceElement;\n\n const { theme, density } = isCustomPositioned(referenceElement)\n ? getThemeAndDensity(referenceElement.contextElement)\n : getThemeAndDensity(referenceElement);\n\n if (!open) return null;\n\n return (\n <FloatingPortal>\n <FloatingFocusManager\n context={context}\n modal={modal}\n initialFocus={initialFocus}\n returnFocus={returnFocus}\n >\n <div\n data-theme={theme}\n data-layout-density={density}\n className={clsx(\"jkl jkl-popover\", className)}\n ref={ref}\n style={\n {\n ...style,\n ...floatingStyles,\n \"--popover-padding\": `var(--jkl-spacing-${padding})`,\n } as React.CSSProperties\n }\n {...getFloatingProps(props)}\n >\n {props.children}\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n );\n },\n);\n\nPopover.Trigger = PopoverTrigger;\nPopover.Content = PopoverContent;\n\nexport default Popover;\n"],"names":["PopoverContext","React","createContext","usePopoverContext","context","useContext","Error","Popover","children","restOptions","popover","open","_open","onOpenChange","_onOpenChange","placement","strategy","modal","offset","_offset","positionReference","hoverOptions","focusOptions","clickOptions","roleOptions","dismissOptions","uncontrolledOpen","setUncontrolledOpen","useState","data","useFloating","middleware","flip","padding","fallbackPlacements","shift","whileElementsMounted","autoUpdate","click","useClick","enabled","hover","useHover","focus","useFocus","dismiss","useDismiss","role","useRole","interactions","useInteractions","useLayoutEffect","refs","setPositionReference","current","useMemo","usePopover","Provider","value","PopoverTrigger","forwardRef","asChild","props","propRef","getReferenceProps","childrenRef","ref","useMergeRefs","setReference","isValidElement","cloneElement","jsx","onClick","PopoverContent","style","className","initialFocus","returnFocus","floatingStyles","getFloatingProps","setFloating","referenceElement","reference","theme","density","getThemeAndDensity","contextElement","FloatingPortal","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}
1
+ {"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n useFloating,\n useFocus,\n useHover,\n useClick,\n useDismiss,\n autoUpdate,\n useRole,\n useMergeRefs,\n offset,\n flip,\n shift,\n useInteractions,\n FloatingPortal,\n FloatingFocusManager,\n UseFloatingOptions,\n VirtualElement,\n ReferenceElement,\n ReferenceType,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndDensity } from \"../../utilities/getThemeAndDensity.js\";\n\ntype ClickOptions = Parameters<typeof useClick>[1];\ntype DismissOptions = Parameters<typeof useDismiss>[1];\ntype FocusOptions = Parameters<typeof useFocus>[1];\ntype HoverOptions = Parameters<typeof useHover>[1];\ntype RoleOptions = Parameters<typeof useRole>[1];\n\ninterface PopoverOptions {\n /**\n * Angir om popoveren er åpen eller lukket.\n *\n * @see https://floating-ui.com/docs/usefloating#open\n */\n open?: boolean;\n /**\n * Callback som trigges når popoveren åpnes eller lukkes.\n *\n * @see https://floating-ui.com/docs/usefloating#onopenchange\n */\n onOpenChange?: UseFloatingOptions[\"onOpenChange\"];\n /**\n * Bestemmer plasseringen av popoveren.\n *\n * @see https://floating-ui.com/docs/usefloating#placement\n *\n * @default \"bottom-start\"\n */\n placement?: UseFloatingOptions[\"placement\"];\n /**\n * Definerer strategien for posisjonering av popoveren.\n *\n * @see https://floating-ui.com/docs/usefloating#strategy\n *\n * @default \"absolute\"\n */\n strategy?: UseFloatingOptions[\"strategy\"];\n /**\n * Angir om popoveren skal fungere som en modal, der fokus er låst til det flytende elementet\n * og innhold utenfor ikke kan interageres med.\n *\n * @see https://floating-ui.com/docs/usefloating#modal\n *\n * @default true\n */\n modal?: boolean;\n /**\n * Justerer avstanden mellom referanse-elementet og popoveren.\n *\n * @see https://floating-ui.com/docs/offset\n *\n * @default 4\n */\n offset?: number;\n /**\n * Referanse til elementet som popoveren skal posisjoneres i forhold til.\n *\n * @see https://floating-ui.com/docs/usefloating#setpositionreference\n *\n * @default Popover.Trigger\n */\n positionReference?: React.RefObject<ReferenceType>;\n /**\n * Options for hover-interaksjoner.\n *\n * @see https://floating-ui.com/docs/usehover\n *\n * @default { enabled: false }\n */\n hoverOptions?: HoverOptions;\n /**\n * Options for fokus-interaksjoner.\n *\n * @see https://floating-ui.com/docs/usefocus\n *\n * @default { enabled: false }\n */\n focusOptions?: FocusOptions;\n /**\n * Options for klikk-interaksjoner.\n *\n * @see https://floating-ui.com/docs/useclick\n *\n * @default { enabled: false }\n */\n clickOptions?: ClickOptions;\n /**\n * Konfigurerer rollen for popoveren.\n *\n * @see https://floating-ui.com/docs/userole\n *\n * @default { enabled: true, role: \"dialog\" }\n */\n roleOptions?: RoleOptions;\n /**\n * Options for å lukke popoveren når en dismissal skjer,\n * som ved å klikke utenfor eller trykke på \"Escape\"-tasten.\n *\n * @see https://floating-ui.com/docs/usedismiss\n *\n * @default { enabled: true }\n */\n dismissOptions?: DismissOptions;\n}\n\nconst usePopover = ({\n open: _open,\n onOpenChange: _onOpenChange,\n placement = \"bottom-start\",\n strategy = \"absolute\",\n modal = true,\n offset: _offset = 4,\n positionReference,\n hoverOptions,\n focusOptions,\n clickOptions,\n roleOptions,\n dismissOptions,\n}: PopoverOptions) => {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(_open);\n\n const open = _open ?? uncontrolledOpen;\n const onOpenChange = _onOpenChange ?? setUncontrolledOpen;\n\n const data = useFloating({\n open,\n onOpenChange,\n placement,\n strategy,\n middleware: [\n offset(_offset),\n flip({ padding: 5, fallbackPlacements: [\"bottom\", \"top\"] }),\n shift({ padding: 12 }),\n ],\n whileElementsMounted: autoUpdate,\n });\n\n const context = data.context;\n\n const click = useClick(context, {\n enabled: false,\n ...clickOptions,\n });\n const hover = useHover(context, { enabled: false, ...hoverOptions });\n const focus = useFocus(context, { enabled: false, ...focusOptions });\n const dismiss = useDismiss(context, dismissOptions);\n const role = useRole(context, roleOptions);\n\n const interactions = useInteractions([click, dismiss, focus, hover, role]);\n\n React.useLayoutEffect(() => {\n if (positionReference) {\n data.refs.setPositionReference(positionReference?.current);\n }\n }, [positionReference, data.refs]);\n\n return React.useMemo(\n () => ({\n open,\n onOpenChange,\n modal,\n ...interactions,\n ...data,\n }),\n [open, onOpenChange, modal, interactions, data],\n );\n};\n\ntype PopoverContextType = ReturnType<typeof usePopover> | null;\n\nconst PopoverContext = React.createContext<PopoverContextType>(null);\n\nconst usePopoverContext = () => {\n const context = React.useContext(PopoverContext);\n\n if (context == null) {\n throw new Error(\n \"Popover komponenter må brukes innenfor en <Popover /> komponent\",\n );\n }\n\n return context;\n};\n\nexport const Popover = ({\n children,\n ...restOptions\n}: {\n children: React.ReactNode;\n} & PopoverOptions) => {\n const popover = usePopover({ ...restOptions });\n return (\n <PopoverContext.Provider value={popover}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\ninterface PopoverTriggerProps {\n children: React.ReactNode;\n /**\n * Rendrer komponenten som child-elementet sitt, og slår sammen egenskaper og props.\n *\n * Default er `false`.\n *\n * @example\n * ```tsx\n * <Component asChild foo=\"bar\">\n * <Child baz=\"qux\" />\n * </Component>\n *\n * // Rendrer følgende:\n * <Child foo=\"bar\" baz=\"qux\" />\n * ```\n */\n asChild?: boolean;\n}\n\nconst PopoverTrigger = React.forwardRef<\n HTMLElement,\n React.HTMLProps<HTMLElement> & PopoverTriggerProps\n>(function PopoverTrigger({ children, asChild = false, ...props }, propRef) {\n const { refs, getReferenceProps, open, onOpenChange } = usePopoverContext();\n const childrenRef = (children as any).ref;\n const ref = useMergeRefs([refs.setReference, propRef, childrenRef]);\n\n if (asChild && React.isValidElement(children)) {\n return React.cloneElement(\n children,\n getReferenceProps({\n ref,\n ...props,\n ...children.props,\n }),\n );\n }\n\n return (\n <button\n ref={ref}\n onClick={() => onOpenChange?.(!open)}\n aria-expanded={open}\n {...getReferenceProps(props)}\n >\n {children}\n </button>\n );\n});\n\ninterface PopoverContentProps {\n /**\n * Padding rundt innholdet i popoveren.\n *\n * Default er `0`.\n */\n padding?: 0 | 8 | 16 | 24;\n /**\n *\n * Angir hvilket element som skal motta fokus ved åpning.\n * Kan være en tabbar index eller en referanse til et element.\"\n *\n * Default er `0`, som betyr at det første fokuserbare elementet i popoveren får fokus.\n * @see https://floating-ui.com/docs/FloatingFocusManager#initialfocus\n */\n initialFocus?: number | React.RefObject<HTMLElement>;\n /**\n * Angir om fokus skal returneres til triggeren når popoveren lukkes.\n *\n * Default er `true`.\n * @see https://floating-ui.com/docs/FloatingFocusManager#returnfocus\n */\n returnFocus?: boolean;\n}\n\n// Er popover-elementet posisjonert i forhold til et annet element enn triggeren?\nconst isCustomPositioned = (\n referenceElement: ReferenceElement,\n): referenceElement is VirtualElement => {\n if (!referenceElement) return false;\n\n return \"contextElement\" in referenceElement;\n};\n\nconst PopoverContent = React.forwardRef<\n HTMLDivElement,\n React.HTMLProps<HTMLDivElement> & PopoverContentProps\n>(function PopoverContent(\n {\n style,\n className,\n padding = 0,\n initialFocus = 0,\n returnFocus = true,\n ...props\n },\n propRef,\n) {\n const { context, modal, refs, open, floatingStyles, getFloatingProps } =\n usePopoverContext();\n const ref = useMergeRefs([refs.setFloating, propRef]);\n\n const referenceElement = refs.reference.current as ReferenceElement;\n\n const { theme, density } = isCustomPositioned(referenceElement)\n ? getThemeAndDensity(referenceElement.contextElement)\n : getThemeAndDensity(referenceElement);\n\n const floatingPortalRef = React.useRef<HTMLElement | null>(null);\n\n // TODO: Løser et problem hvor nestede portaler ikke \"fester\" seg til det nærmeste portal-elementet. Fjernes når alle komponenter som rendres i en portal tar i bruk popover komponenten da den håndterer dette internt.\n React.useEffect(() => {\n floatingPortalRef.current =\n context.elements.domReference?.closest<HTMLElement>(\n \"[data-portal]\",\n ) || null;\n }, [context.elements.domReference]);\n\n if (!open) return null;\n\n return (\n <FloatingPortal root={floatingPortalRef.current}>\n <FloatingFocusManager\n context={context}\n modal={modal}\n initialFocus={initialFocus}\n returnFocus={returnFocus}\n >\n <div\n data-theme={theme}\n data-layout-density={density}\n className={clsx(\"jkl jkl-popover\", className)}\n ref={ref}\n style={\n {\n ...style,\n ...floatingStyles,\n \"--popover-padding\": `var(--jkl-spacing-${padding})`,\n } as React.CSSProperties\n }\n {...getFloatingProps(props)}\n >\n {props.children}\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n );\n});\n\nPopover.Trigger = PopoverTrigger;\nPopover.Content = PopoverContent;\n\nexport default Popover;\n"],"names":["PopoverContext","React","createContext","usePopoverContext","context","useContext","Error","Popover","children","restOptions","popover","open","_open","onOpenChange","_onOpenChange","placement","strategy","modal","offset","_offset","positionReference","hoverOptions","focusOptions","clickOptions","roleOptions","dismissOptions","uncontrolledOpen","setUncontrolledOpen","useState","data","useFloating","middleware","flip","padding","fallbackPlacements","shift","whileElementsMounted","autoUpdate","click","useClick","enabled","hover","useHover","focus","useFocus","dismiss","useDismiss","role","useRole","interactions","useInteractions","useLayoutEffect","refs","setPositionReference","current","useMemo","usePopover","Provider","value","PopoverTrigger","forwardRef","asChild","props","propRef","getReferenceProps","childrenRef","ref","useMergeRefs","setReference","isValidElement","cloneElement","jsx","onClick","PopoverContent","style","className","initialFocus","returnFocus","floatingStyles","getFloatingProps","setFloating","referenceElement","reference","theme","density","getThemeAndDensity","contextElement","floatingPortalRef","useRef","useEffect","_a","elements","domReference","closest","FloatingPortal","root","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Countdown.js","sources":["../../../../src/components/progress-bar/Countdown.tsx"],"sourcesContent":["import React, { useState, type CSSProperties, type FC, useEffect } from \"react\";\n\nexport interface CountdownProps\n extends Pick<React.HTMLAttributes<HTMLDivElement>, \"onAnimationEnd\" | \"onAnimationStart\"> {\n id?: string;\n className?: string;\n /**\n * Millisekunder å telle ned fra\n */\n from: number;\n isPaused?: boolean;\n style?: CSSProperties;\n}\n\nexport const Countdown: FC<CountdownProps> = ({ className, from, isPaused, ...rest }) => {\n const [remainingSeconds, setRemainingSeconds] = useState(Math.floor(from / 1000));\n\n useEffect(() => {\n if (remainingSeconds <= 0) {\n return;\n }\n\n setTimeout(() => {\n if (!isPaused) {\n setRemainingSeconds((sec) => sec - 1);\n }\n }, 1000);\n }, [isPaused, from, remainingSeconds, setRemainingSeconds]);\n\n return (\n <div className={`jkl-countdown ${className ?? \"\"}`} role=\"timer\" data-testid=\"jkl-countdown\" {...rest}>\n <span\n className=\"jkl-countdown__tracker\"\n role=\"presentation\"\n style={\n {\n \"--duration\": `${from}ms`,\n \"--play-state\": isPaused ? \"paused\" : \"running\",\n } as CSSProperties\n }\n data-testid=\"jkl-countdown__tracker\"\n />\n <span className=\"jkl-sr-only\">{remainingSeconds}</span>\n </div>\n );\n};\n"],"names":["Countdown","className","from","isPaused","rest","remainingSeconds","setRemainingSeconds","useState","Math","floor","useEffect","setTimeout","sec","jsxs","role","children","jsx","style"],"mappings":"kGAca,MAAAA,EAAgC,EAAGC,UAAAA,EAAWC,KAAAA,EAAMC,SAAAA,KAAaC,MACpE,MAACC,EAAkBC,GAAuBC,EAASC,KAAKC,MAAMP,EAAO,MAE3E,OAAAQ,GAAU,KACFL,GAAoB,GAIxBM,YAAW,KACFR,GACmBG,GAACM,GAAQA,EAAM,GAAC,GAEzC,IAAI,GACR,CAACT,EAAUD,EAAMG,EAAkBC,IAGjCO,EAAA,MAAA,CAAIZ,UAAW,iBAAiBA,GAAa,KAAMa,KAAK,QAAQ,cAAY,mBAAoBV,EAC7FW,SAAA,CAAAC,EAAC,OAAA,CACGf,UAAU,yBACVa,KAAK,eACLG,MACI,CACI,aAAc,GAAGf,MACjB,eAAgBC,EAAW,SAAW,WAG9C,cAAY,2BAEfa,EAAA,OAAA,CAAKf,UAAU,cAAec,SAAiBV,MACpD"}
1
+ {"version":3,"file":"Countdown.js","sources":["../../../../src/components/progress-bar/Countdown.tsx"],"sourcesContent":["import React, { useState, type CSSProperties, type FC, useEffect } from \"react\";\n\nexport interface CountdownProps\n extends Pick<\n React.HTMLAttributes<HTMLDivElement>,\n \"onAnimationEnd\" | \"onAnimationStart\"\n > {\n id?: string;\n className?: string;\n /**\n * Millisekunder å telle ned fra\n */\n from: number;\n isPaused?: boolean;\n style?: CSSProperties;\n}\n\nexport const Countdown: FC<CountdownProps> = ({\n className,\n from,\n isPaused,\n ...rest\n}) => {\n const [remainingSeconds, setRemainingSeconds] = useState(\n Math.floor(from / 1000),\n );\n\n useEffect(() => {\n if (remainingSeconds <= 0) {\n return;\n }\n\n setTimeout(() => {\n if (!isPaused) {\n setRemainingSeconds((sec) => sec - 1);\n }\n }, 1000);\n }, [isPaused, from, remainingSeconds, setRemainingSeconds]);\n\n return (\n <div\n className={`jkl-countdown ${className ?? \"\"}`}\n role=\"timer\"\n data-testid=\"jkl-countdown\"\n {...rest}\n >\n <span\n className=\"jkl-countdown__tracker\"\n role=\"presentation\"\n style={\n {\n \"--duration\": `${from}ms`,\n \"--play-state\": isPaused ? \"paused\" : \"running\",\n } as CSSProperties\n }\n data-testid=\"jkl-countdown__tracker\"\n />\n <span className=\"jkl-sr-only\">{remainingSeconds}</span>\n </div>\n );\n};\n"],"names":["Countdown","className","from","isPaused","rest","remainingSeconds","setRemainingSeconds","useState","Math","floor","useEffect","setTimeout","sec","jsxs","role","children","jsx","style"],"mappings":"kGAiBO,MAAMA,EAAgC,EACzCC,UAAAA,EACAC,KAAAA,EACAC,SAAAA,KACGC,MAEG,MAACC,EAAkBC,GAAuBC,EAC5CC,KAAKC,MAAMP,EAAO,MAGtB,OAAAQ,GAAU,KACFL,GAAoB,GAIxBM,YAAW,KACFR,GACmBG,GAACM,GAAQA,EAAM,GAAC,GAEzC,IAAI,GACR,CAACT,EAAUD,EAAMG,EAAkBC,IAGlCO,EAAC,MAAA,CACGZ,UAAW,iBAAiBA,GAAa,KACzCa,KAAK,QACL,cAAY,mBACRV,EAEJW,SAAA,CAAAC,EAAC,OAAA,CACGf,UAAU,yBACVa,KAAK,eACLG,MACI,CACI,aAAc,GAAGf,MACjB,eAAgBC,EAAW,SAAW,WAG9C,cAAY,2BAEfa,EAAA,OAAA,CAAKf,UAAU,cAAec,SAAiBV,MAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"BaseRadioButton.js","sources":["../../../../src/components/radio-button/BaseRadioButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ChangeEventHandler, forwardRef } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { RadioButtonProps } from \"./RadioButton.js\";\n\nexport interface BaseRadioButtonProps extends RadioButtonProps {\n inline?: boolean;\n density?: Density;\n invalid?: boolean;\n onChange?: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const BaseRadioButton = forwardRef<HTMLInputElement, BaseRadioButtonProps>((props, ref) => {\n const { id, className, checked, children, label, density, inline, invalid, name, value, onChange, ...rest } = props;\n\n const inputId = useId(id || \"jkl-radio-button\", { generateSuffix: !id });\n\n return (\n <div\n className={clsx(\"jkl-radio-button\", className, {\n \"jkl-radio-button--inline\": inline,\n \"jkl-radio-button--error\": invalid,\n })}\n data-density={density}\n >\n <input\n name={name}\n ref={ref}\n {...rest}\n id={inputId}\n className=\"jkl-radio-button__input\"\n type=\"radio\"\n onChange={onChange}\n value={value}\n checked={checked}\n />\n <label data-testid=\"jkl-radio-button__label-tag\" htmlFor={inputId} className=\"jkl-radio-button__label\">\n <span aria-hidden className=\"jkl-radio-button__dot\" />\n <span className=\"jkl-radio-button__text\">{label || children}</span>\n </label>\n </div>\n );\n});\n\nBaseRadioButton.displayName = \"BaseRadioButton\";\n"],"names":["BaseRadioButton","forwardRef","props","ref","id","className","checked","children","label","density","inline","invalid","name","value","onChange","rest","inputId","useId","generateSuffix","jsxs","clsx","jsx","type","htmlFor","displayName"],"mappings":"sLAaO,MAAMA,EAAkBC,GAAmD,CAACC,EAAOC,KACtF,MAAQC,GAAAA,EAAIC,UAAAA,EAAWC,QAAAA,EAASC,SAAAA,EAAUC,MAAAA,EAAOC,QAAAA,EAASC,OAAAA,EAAQC,QAAAA,EAASC,KAAAA,EAAMC,MAAAA,EAAOC,SAAAA,KAAaC,GAASb,EAExGc,EAAUC,EAAMb,GAAM,mBAAoB,CAAEc,gBAAiBd,IAG/D,OAAAe,EAAC,MAAA,CACGd,UAAWe,EAAK,mBAAoBf,EAAW,CAC3C,2BAA4BK,EAC5B,0BAA2BC,IAE/B,eAAcF,EAEdF,SAAA,CAAAc,EAAC,QAAA,CACGT,KAAAA,EACAT,IAAAA,KACIY,EACJX,GAAIY,EACJX,UAAU,0BACViB,KAAK,QACLR,SAAAA,EACAD,MAAAA,EACAP,QAAAA,MAEH,QAAM,CAAA,cAAY,8BAA8BiB,QAASP,EAASX,UAAU,0BACzEE,SAAA,CAAAc,EAAC,OAAK,CAAA,eAAW,EAAChB,UAAU,0BAC3BgB,EAAA,OAAA,CAAKhB,UAAU,yBAA0BE,YAASA,SACvD,IAKZP,EAAgBwB,YAAc"}
1
+ {"version":3,"file":"BaseRadioButton.js","sources":["../../../../src/components/radio-button/BaseRadioButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ChangeEventHandler, forwardRef } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { RadioButtonProps } from \"./RadioButton.js\";\n\nexport interface BaseRadioButtonProps extends RadioButtonProps {\n inline?: boolean;\n density?: Density;\n invalid?: boolean;\n onChange?: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const BaseRadioButton = forwardRef<\n HTMLInputElement,\n BaseRadioButtonProps\n>((props, ref) => {\n const {\n id,\n className,\n checked,\n children,\n label,\n density,\n inline,\n invalid,\n name,\n value,\n onChange,\n ...rest\n } = props;\n\n const inputId = useId(id || \"jkl-radio-button\", { generateSuffix: !id });\n\n return (\n <div\n className={clsx(\"jkl-radio-button\", className, {\n \"jkl-radio-button--inline\": inline,\n \"jkl-radio-button--error\": invalid,\n })}\n data-density={density}\n >\n <input\n name={name}\n ref={ref}\n {...rest}\n id={inputId}\n className=\"jkl-radio-button__input\"\n type=\"radio\"\n onChange={onChange}\n value={value}\n checked={checked}\n />\n <label\n data-testid=\"jkl-radio-button__label-tag\"\n htmlFor={inputId}\n className=\"jkl-radio-button__label\"\n >\n <span aria-hidden className=\"jkl-radio-button__dot\" />\n <span className=\"jkl-radio-button__text\">\n {label || children}\n </span>\n </label>\n </div>\n );\n});\n\nBaseRadioButton.displayName = \"BaseRadioButton\";\n"],"names":["BaseRadioButton","forwardRef","props","ref","id","className","checked","children","label","density","inline","invalid","name","value","onChange","rest","inputId","useId","generateSuffix","jsxs","clsx","jsx","type","htmlFor","displayName"],"mappings":"sLAaO,MAAMA,EAAkBC,GAG7B,CAACC,EAAOC,KACA,MACFC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,MAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,KACGC,GACHb,EAEEc,EAAUC,EAAMb,GAAM,mBAAoB,CAAEc,gBAAiBd,IAG/D,OAAAe,EAAC,MAAA,CACGd,UAAWe,EAAK,mBAAoBf,EAAW,CAC3C,2BAA4BK,EAC5B,0BAA2BC,IAE/B,eAAcF,EAEdF,SAAA,CAAAc,EAAC,QAAA,CACGT,KAAAA,EACAT,IAAAA,KACIY,EACJX,GAAIY,EACJX,UAAU,0BACViB,KAAK,QACLR,SAAAA,EACAD,MAAAA,EACAP,QAAAA,IAEJa,EAAC,QAAA,CACG,cAAY,8BACZI,QAASP,EACTX,UAAU,0BAEVE,SAAA,CAAAc,EAAC,OAAK,CAAA,eAAW,EAAChB,UAAU,0BAC3BgB,EAAA,OAAA,CAAKhB,UAAU,yBACXE,YAASA,SAElB,IAKZP,EAAgBwB,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, { forwardRef, InputHTMLAttributes, ChangeEventHandler, ReactNode } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { SupportLabel, SupportLabelProps } from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n children?: ReactNode;\n value: string;\n /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n name?: string;\n /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /** @deprecated Bruk children */\n label?: ReactNode;\n helpLabel?: ReactNode;\n supportLabelProps?: Omit<SupportLabelProps, \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\">;\n}\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>((props, ref) => {\n const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n const { value: selectedValue, density, ...context } = useRadioGroupContext();\n const supportId = useId(\"jkl-support-label\");\n\n return (\n <>\n <BaseRadioButton\n {...context}\n {...rest}\n ref={ref}\n checked={\n typeof checked !== \"undefined\"\n ? checked\n : typeof selectedValue !== \"undefined\"\n ? value === selectedValue\n : undefined\n }\n value={value}\n aria-describedby={helpLabel ? supportId : undefined}\n />\n <SupportLabel\n {...supportLabelProps}\n label={helpLabel}\n labelType={\"help\"}\n id={supportId}\n density={density}\n />\n </>\n );\n});\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","density","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"yUAmBO,MAAMA,EAAcC,GAA+C,CAACC,EAAOC,KACxE,MAAEC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAC1DG,MAAOI,EAAeC,QAAAA,KAAYC,GAAYC,IAChDC,EAAYC,EAAM,qBAExB,OAEQC,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAA,IACOR,KACAH,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACzBJ,IAAUI,OACV,EAEVJ,MAAAA,EACA,mBAAkBE,EAAYM,OAAY,IAE9CK,EAACE,EAAA,IACOd,EACJe,MAAOd,EACPe,UAAW,OACXC,GAAIV,EACJH,QAAAA,MAER,IAIRV,EAAYwB,YAAc"}
1
+ {"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, {\n forwardRef,\n InputHTMLAttributes,\n ChangeEventHandler,\n ReactNode,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport {\n SupportLabel,\n SupportLabelProps,\n} from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n children?: ReactNode;\n value: string;\n /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n name?: string;\n /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /** @deprecated Bruk children */\n label?: ReactNode;\n helpLabel?: ReactNode;\n supportLabelProps?: Omit<\n SupportLabelProps,\n \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\"\n >;\n}\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>(\n (props, ref) => {\n const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n const {\n value: selectedValue,\n density,\n ...context\n } = useRadioGroupContext();\n const supportId = useId(\"jkl-support-label\");\n\n return (\n <>\n <BaseRadioButton\n {...context}\n {...rest}\n ref={ref}\n checked={\n typeof checked !== \"undefined\"\n ? checked\n : typeof selectedValue !== \"undefined\"\n ? value === selectedValue\n : undefined\n }\n value={value}\n aria-describedby={helpLabel ? supportId : undefined}\n />\n <SupportLabel\n {...supportLabelProps}\n label={helpLabel}\n labelType={\"help\"}\n id={supportId}\n density={density}\n />\n </>\n );\n },\n);\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","density","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"yUA+BO,MAAMA,EAAcC,GACvB,CAACC,EAAOC,KACJ,MAAQC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAE9DG,MAAOI,EACPC,QAAAA,KACGC,GACHC,IACEC,EAAYC,EAAM,qBAExB,OAEQC,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAA,IACOR,KACAH,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACzBJ,IAAUI,OACV,EAEVJ,MAAAA,EACA,mBAAkBE,EAAYM,OAAY,IAE9CK,EAACE,EAAA,IACOd,EACJe,MAAOd,EACPe,UAAW,OACXC,GAAIV,EACJH,QAAAA,MAER,IAKZV,EAAYwB,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"RadioButtonGroup.js","sources":["../../../../src/components/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { FieldGroup, type FieldGroupProps } from \"../input-group/FieldGroup.js\";\nimport { RadioGroupContextProvider } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonGroupProps extends Omit<FieldGroupProps, \"onChange\"> {\n legend: string;\n /** Alle RadioButton i gruppen får dette som name. */\n name?: string;\n /** Om gruppen skal være controlled setter du den valgte verdien her. */\n value?: string;\n onChange?: ChangeEventHandler<HTMLInputElement>;\n helpLabel?: string;\n /**\n * Erstatter hjelpeteksten (hvis noen) med en feilmelding.\n * Merker samtidig alle RadioButton i gruppen som ugyldige.\n */\n errorLabel?: string;\n /**\n * Setter inline-modifieren på alle RadioButton i gruppen.\n * @default false\n */\n inline?: boolean;\n density?: Density;\n}\n\nexport const RadioButtonGroup: FC<RadioButtonGroupProps> = (props) => {\n const {\n name,\n value,\n onChange,\n errorLabel,\n inline = false,\n density,\n labelProps = { variant: \"medium\" },\n ...rest\n } = props;\n\n return (\n <RadioGroupContextProvider\n state={{\n onChange,\n value,\n name,\n invalid: Boolean(errorLabel),\n inline,\n density,\n }}\n >\n <FieldGroup\n errorLabel={errorLabel}\n labelProps={labelProps}\n data-testid=\"jkl-radio-button-group\"\n density={density}\n {...rest}\n role=\"radiogroup\"\n aria-invalid={Boolean(errorLabel)}\n />\n </RadioGroupContextProvider>\n );\n};\n"],"names":["RadioButtonGroup","props","name","value","onChange","errorLabel","inline","density","labelProps","variant","rest","jsx","RadioGroupContextProvider","state","invalid","children","FieldGroup","role"],"mappings":"qKA0Ba,MAAAA,EAA+CC,IAClD,MACFC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAS,aACrBC,GACHT,EAGA,OAAAU,EAACC,EAAA,CACGC,MAAO,CACHT,SAAAA,EACAD,MAAAA,EACAD,KAAAA,EACAY,UAAiBT,EACjBC,OAAAA,EACAC,QAAAA,GAGJQ,SAAAJ,EAACK,EAAA,CACGX,WAAAA,EACAG,WAAAA,EACA,cAAY,yBACZD,QAAAA,KACIG,EACJO,KAAK,aACL,iBAAsBZ,KAC1B"}
1
+ {"version":3,"file":"RadioButtonGroup.js","sources":["../../../../src/components/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { FieldGroup, type FieldGroupProps } from \"../input-group/FieldGroup.js\";\nimport { RadioGroupContextProvider } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonGroupProps\n extends Omit<FieldGroupProps, \"onChange\"> {\n legend: string;\n /** Alle RadioButton i gruppen får dette som name. */\n name?: string;\n /** Om gruppen skal være controlled setter du den valgte verdien her. */\n value?: string;\n onChange?: ChangeEventHandler<HTMLInputElement>;\n helpLabel?: string;\n /**\n * Erstatter hjelpeteksten (hvis noen) med en feilmelding.\n * Merker samtidig alle RadioButton i gruppen som ugyldige.\n */\n errorLabel?: string;\n /**\n * Setter inline-modifieren på alle RadioButton i gruppen.\n * @default false\n */\n inline?: boolean;\n density?: Density;\n}\n\nexport const RadioButtonGroup: FC<RadioButtonGroupProps> = (props) => {\n const {\n name,\n value,\n onChange,\n errorLabel,\n inline = false,\n density,\n labelProps = { variant: \"medium\" },\n ...rest\n } = props;\n\n return (\n <RadioGroupContextProvider\n state={{\n onChange,\n value,\n name,\n invalid: Boolean(errorLabel),\n inline,\n density,\n }}\n >\n <FieldGroup\n errorLabel={errorLabel}\n labelProps={labelProps}\n data-testid=\"jkl-radio-button-group\"\n density={density}\n {...rest}\n role=\"radiogroup\"\n aria-invalid={Boolean(errorLabel)}\n />\n </RadioGroupContextProvider>\n );\n};\n"],"names":["RadioButtonGroup","props","name","value","onChange","errorLabel","inline","density","labelProps","variant","rest","jsx","RadioGroupContextProvider","state","invalid","children","FieldGroup","role"],"mappings":"qKA2Ba,MAAAA,EAA+CC,IAClD,MACFC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAS,aACrBC,GACHT,EAGA,OAAAU,EAACC,EAAA,CACGC,MAAO,CACHT,SAAAA,EACAD,MAAAA,EACAD,KAAAA,EACAY,UAAiBT,EACjBC,OAAAA,EACAC,QAAAA,GAGJQ,SAAAJ,EAACK,EAAA,CACGX,WAAAA,EACAG,WAAAA,EACA,cAAY,yBACZD,QAAAA,KACIG,EACJO,KAAK,aACL,iBAAsBZ,KAC1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"radioGroupContext.js","sources":["../../../../src/components/radio-button/radioGroupContext.tsx"],"sourcesContent":["import React, { createContext, useContext, ChangeEventHandler } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\ntype RadioGroupContext = {\n name: string | undefined;\n value: string | undefined;\n inline: boolean;\n density?: Density;\n invalid: boolean;\n onChange: ChangeEventHandler<HTMLInputElement> | undefined;\n};\n\nconst radioGroupContext = createContext<RadioGroupContext>({\n name: undefined,\n value: undefined,\n onChange: () => {\n return;\n },\n inline: false,\n density: undefined,\n invalid: false,\n});\n\nexport const useRadioGroupContext = (): RadioGroupContext => useContext(radioGroupContext);\n\ninterface Props extends WithChildren {\n state: RadioGroupContext;\n}\n\nexport const RadioGroupContextProvider: React.FC<Props> = ({ state, children }) => (\n <radioGroupContext.Provider value={state}>{children}</radioGroupContext.Provider>\n);\n"],"names":["radioGroupContext","createContext","name","value","onChange","inline","density","invalid","useRadioGroupContext","useContext","RadioGroupContextProvider","state","children","jsx","Provider"],"mappings":"8FAYA,MAAMA,EAAoBC,EAAiC,CACvDC,UAAM,EACNC,WAAO,EACPC,SAAU,OAGVC,QAAQ,EACRC,aAAS,EACTC,SAAS,IAGAC,EAAuB,IAAyBC,EAAWT,GAM3DU,EAA6C,EAAGC,MAAAA,EAAOC,SAAAA,KAC/DC,EAAAb,EAAkBc,SAAlB,CAA2BX,MAAOQ,EAAQC,SAAAA"}
1
+ {"version":3,"file":"radioGroupContext.js","sources":["../../../../src/components/radio-button/radioGroupContext.tsx"],"sourcesContent":["import React, { createContext, useContext, ChangeEventHandler } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\ntype RadioGroupContext = {\n name: string | undefined;\n value: string | undefined;\n inline: boolean;\n density?: Density;\n invalid: boolean;\n onChange: ChangeEventHandler<HTMLInputElement> | undefined;\n};\n\nconst radioGroupContext = createContext<RadioGroupContext>({\n name: undefined,\n value: undefined,\n onChange: () => {\n return;\n },\n inline: false,\n density: undefined,\n invalid: false,\n});\n\nexport const useRadioGroupContext = (): RadioGroupContext =>\n useContext(radioGroupContext);\n\ninterface Props extends WithChildren {\n state: RadioGroupContext;\n}\n\nexport const RadioGroupContextProvider: React.FC<Props> = ({\n state,\n children,\n}) => (\n <radioGroupContext.Provider value={state}>\n {children}\n </radioGroupContext.Provider>\n);\n"],"names":["radioGroupContext","createContext","name","value","onChange","inline","density","invalid","useRadioGroupContext","useContext","RadioGroupContextProvider","state","children","Provider"],"mappings":"8FAYA,MAAMA,EAAoBC,EAAiC,CACvDC,UAAM,EACNC,WAAO,EACPC,SAAU,OAGVC,QAAQ,EACRC,aAAS,EACTC,SAAS,IAGAC,EAAuB,IAChCC,EAAWT,GAMFU,EAA6C,EACtDC,MAAAA,EACAC,SAAAA,OAECZ,EAAkBa,SAAlB,CAA2BV,MAAOQ,EAC9BC,SAAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"RadioPanel.js","sources":["../../../../src/components/radio-panel/RadioPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n Children,\n ComponentPropsWithRef,\n ForwardedRef,\n forwardRef,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { useAutoAnimatedHeight } from \"../../hooks/index.js\";\n\ntype Props = ComponentPropsWithRef<\"input\"> & {\n name: string;\n value: string;\n label: string;\n extraLabel?: React.ReactNode;\n alwaysOpen?: boolean;\n};\n\nexport const RadioPanel = forwardRef(function RadioPanel(\n { children, alwaysOpen = false, label, extraLabel, name, checked, ...rest }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [renderChildren, setRenderChildren] = useState(true);\n const animationRef = useAutoAnimatedHeight<HTMLDivElement>(renderChildren);\n\n const handleChange = useCallback(() => {\n if (alwaysOpen) {\n return -1;\n }\n\n // Hvis går fra lukket til åpen, trigge endring i live-region men\n // vent \"lenge nok\" til at skjermleseren får det med seg,\n // radio-knapper får bare en change event når de velges. Det at\n // en annen radio i gruppen blir valgt trigger bare et event på den.\n setRenderChildren(false);\n return window.setTimeout(() => {\n setRenderChildren(true);\n }, 200);\n }, [setRenderChildren, alwaysOpen]);\n\n useEffect(() => {\n if (!checked) {\n return;\n }\n const timeoutId = handleChange();\n return () => window.clearTimeout(timeoutId);\n }, [checked, handleChange]);\n\n const hasChildren = Children.count(children) > 0;\n\n return (\n <div className=\"jkl-radio-panel\" ref={ref}>\n <label className=\"jkl-radio-panel__label\">\n <input onChange={handleChange} className=\"jkl-radio-panel__input\" type=\"radio\" name={name} {...rest} />\n <span aria-hidden=\"true\" className=\"jkl-radio-panel__dot\"></span>\n <span className=\"jkl-radio-panel__main-label\">{label}</span>\n <span\n className={clsx(\"jkl-radio-panel__extra-label\", {\n \"jkl-radio-panel__extra-label--text\": typeof extraLabel === \"string\",\n })}\n >\n {extraLabel}\n </span>\n </label>\n <div\n data-open={renderChildren && hasChildren}\n data-alwaysOpen={alwaysOpen && hasChildren}\n ref={animationRef}\n className=\"jkl-radio-panel__content\"\n aria-live={!alwaysOpen && hasChildren ? \"polite\" : undefined}\n >\n {renderChildren && children}\n </div>\n </div>\n );\n});\n"],"names":["RadioPanel","forwardRef","children","alwaysOpen","label","extraLabel","name","checked","rest","ref","renderChildren","setRenderChildren","useState","animationRef","useAutoAnimatedHeight","handleChange","useCallback","window","setTimeout","useEffect","timeoutId","clearTimeout","hasChildren","Children","count","jsxs","className","jsx","onChange","type","clsx"],"mappings":"2WAoBO,MAAMA,EAAaC,GAAW,UAC/BC,SAAAA,EAAUC,WAAAA,GAAa,EAAOC,MAAAA,EAAOC,WAAAA,EAAYC,KAAAA,EAAMC,QAAAA,KAAYC,GACrEC,GAEM,MAACC,EAAgBC,GAAqBC,GAAS,GAC/CC,EAAeC,EAAsCJ,GAErDK,EAAeC,GAAY,IACzBb,GACO,GAOXQ,GAAkB,GACXM,OAAOC,YAAW,KACrBP,GAAkB,EAAI,GACvB,OACJ,CAACA,EAAmBR,IAEvBgB,GAAU,KACN,IAAKZ,EACD,OAEJ,MAAMa,EAAYL,IACX,MAAA,IAAME,OAAOI,aAAaD,EAAS,GAC3C,CAACb,EAASQ,IAEb,MAAMO,EAAcC,EAASC,MAAMtB,GAAY,EAG1C,OAAAuB,EAAA,MAAA,CAAIC,UAAU,kBAAkBjB,IAAAA,EAC7BP,SAAA,CAACuB,EAAA,QAAA,CAAMC,UAAU,yBACbxB,SAAA,CAACyB,EAAA,QAAA,CAAMC,SAAUb,EAAcW,UAAU,yBAAyBG,KAAK,QAAQvB,KAAAA,KAAgBE,IAC9FmB,EAAA,OAAA,CAAK,cAAY,OAAOD,UAAU,yBAClCC,EAAA,OAAA,CAAKD,UAAU,8BAA+BxB,SAAME,IACrDuB,EAAC,OAAA,CACGD,UAAWI,EAAK,+BAAgC,CAC5C,qCAA4D,iBAAfzB,IAGhDH,SAAAG,OAGTsB,EAAC,MAAA,CACG,YAAWjB,GAAkBY,EAC7B,kBAAiBnB,GAAcmB,EAC/Bb,IAAKI,EACLa,UAAU,2BACV,aAAYvB,GAAcmB,EAAc,cAAW,EAElDpB,SAAkBQ,GAAAR,MAInC"}
1
+ {"version":3,"file":"RadioPanel.js","sources":["../../../../src/components/radio-panel/RadioPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n Children,\n ComponentPropsWithRef,\n ForwardedRef,\n forwardRef,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { useAutoAnimatedHeight } from \"../../hooks/index.js\";\n\ntype Props = ComponentPropsWithRef<\"input\"> & {\n name: string;\n value: string;\n label: string;\n extraLabel?: React.ReactNode;\n alwaysOpen?: boolean;\n};\n\nexport const RadioPanel = forwardRef(function RadioPanel(\n {\n children,\n alwaysOpen = false,\n label,\n extraLabel,\n name,\n checked,\n ...rest\n }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [renderChildren, setRenderChildren] = useState(true);\n const animationRef = useAutoAnimatedHeight<HTMLDivElement>(renderChildren);\n\n const handleChange = useCallback(() => {\n if (alwaysOpen) {\n return -1;\n }\n\n // Hvis går fra lukket til åpen, trigge endring i live-region men\n // vent \"lenge nok\" til at skjermleseren får det med seg,\n // radio-knapper får bare en change event når de velges. Det at\n // en annen radio i gruppen blir valgt trigger bare et event på den.\n setRenderChildren(false);\n return window.setTimeout(() => {\n setRenderChildren(true);\n }, 200);\n }, [setRenderChildren, alwaysOpen]);\n\n useEffect(() => {\n if (!checked) {\n return;\n }\n const timeoutId = handleChange();\n return () => window.clearTimeout(timeoutId);\n }, [checked, handleChange]);\n\n const hasChildren = Children.count(children) > 0;\n\n return (\n <div className=\"jkl-radio-panel\" ref={ref}>\n <label className=\"jkl-radio-panel__label\">\n <input\n onChange={handleChange}\n className=\"jkl-radio-panel__input\"\n type=\"radio\"\n name={name}\n {...rest}\n />\n <span\n aria-hidden=\"true\"\n className=\"jkl-radio-panel__dot\"\n ></span>\n <span className=\"jkl-radio-panel__main-label\">{label}</span>\n <span\n className={clsx(\"jkl-radio-panel__extra-label\", {\n \"jkl-radio-panel__extra-label--text\":\n typeof extraLabel === \"string\",\n })}\n >\n {extraLabel}\n </span>\n </label>\n <div\n data-open={renderChildren && hasChildren}\n data-alwaysOpen={alwaysOpen && hasChildren}\n ref={animationRef}\n className=\"jkl-radio-panel__content\"\n aria-live={!alwaysOpen && hasChildren ? \"polite\" : undefined}\n >\n {renderChildren && children}\n </div>\n </div>\n );\n});\n"],"names":["RadioPanel","forwardRef","children","alwaysOpen","label","extraLabel","name","checked","rest","ref","renderChildren","setRenderChildren","useState","animationRef","useAutoAnimatedHeight","handleChange","useCallback","window","setTimeout","useEffect","timeoutId","clearTimeout","hasChildren","Children","count","jsxs","className","jsx","onChange","type","clsx"],"mappings":"2WAoBa,MAAAA,EAAaC,GAAW,UAE7BC,SAAAA,EACAC,WAAAA,GAAa,EACbC,MAAAA,EACAC,WAAAA,EACAC,KAAAA,EACAC,QAAAA,KACGC,GAEPC,GAEM,MAACC,EAAgBC,GAAqBC,GAAS,GAC/CC,EAAeC,EAAsCJ,GAErDK,EAAeC,GAAY,IACzBb,GACO,GAOXQ,GAAkB,GACXM,OAAOC,YAAW,KACrBP,GAAkB,EAAI,GACvB,OACJ,CAACA,EAAmBR,IAEvBgB,GAAU,KACN,IAAKZ,EACD,OAEJ,MAAMa,EAAYL,IACX,MAAA,IAAME,OAAOI,aAAaD,EAAS,GAC3C,CAACb,EAASQ,IAEb,MAAMO,EAAcC,EAASC,MAAMtB,GAAY,EAG1C,OAAAuB,EAAA,MAAA,CAAIC,UAAU,kBAAkBjB,IAAAA,EAC7BP,SAAA,CAACuB,EAAA,QAAA,CAAMC,UAAU,yBACbxB,SAAA,CAAAyB,EAAC,QAAA,CACGC,SAAUb,EACVW,UAAU,yBACVG,KAAK,QACLvB,KAAAA,KACIE,IAERmB,EAAC,OAAA,CACG,cAAY,OACZD,UAAU,yBAEbC,EAAA,OAAA,CAAKD,UAAU,8BAA+BxB,SAAME,IACrDuB,EAAC,OAAA,CACGD,UAAWI,EAAK,+BAAgC,CAC5C,qCAC0B,iBAAfzB,IAGdH,SAAAG,OAGTsB,EAAC,MAAA,CACG,YAAWjB,GAAkBY,EAC7B,kBAAiBnB,GAAcmB,EAC/Bb,IAAKI,EACLa,UAAU,2BACV,aAAYvB,GAAcmB,EAAc,cAAW,EAElDpB,SAAkBQ,GAAAR,MAInC"}
@@ -1 +1 @@
1
- {"version":3,"file":"NativeSelect.js","sources":["../../../../src/components/select/NativeSelect.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, SelectHTMLAttributes } from \"react\";\nimport { getValuePair, ValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/index.js\";\nimport { InputGroup, InputGroupProps } from \"../input-group/InputGroup.js\";\n\nexport interface NativeSelectProps extends Omit<InputGroupProps, \"children\">, SelectHTMLAttributes<HTMLSelectElement> {\n /**\n * Merk som ugyldig uten å sende inn en errorLabel.\n * NB! Brukes kun i tilfeller der valideringsfeil dukker opp andre steder, for eksempel i en FieldGroup.\n */\n invalid?: boolean;\n /**\n * Setter inn et placeholderelement som vises når ingenting er valgt i nedtrekkslisten.\n * @default \"Velg\"\n */\n placeholder?: string;\n items: Array<string | ValuePair>;\n selectClassName?: string;\n width?: string;\n}\n\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>((props, ref) => {\n const {\n label,\n className,\n density,\n errorLabel,\n helpLabel,\n inline,\n invalid,\n items,\n labelProps,\n placeholder = \"Velg\",\n selectClassName,\n supportLabelProps,\n tooltipProps,\n value,\n width,\n ...rest\n } = props;\n\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltipProps,\n };\n\n return (\n <InputGroup\n {...inputGroupProps}\n data-testid=\"jkl-select\"\n className={clsx(\"jkl-select\", className, {\n \"jkl-select--inline\": inline,\n \"jkl-select--invalid\": !!errorLabel || invalid,\n })}\n render={(inputProps) => (\n <div className=\"jkl-select__outer-wrapper\" style={{ width }}>\n <select\n ref={ref}\n className={clsx(\"jkl-select__button\", selectClassName, {\n \"jkl-select__button--active-value\": !!value,\n })}\n defaultValue={value ? undefined : \"\"}\n value={value}\n {...inputProps}\n {...rest}\n >\n {placeholder && !value && (\n <option disabled value=\"\">\n {placeholder}\n </option>\n )}\n {items.map(getValuePair).map((item) => (\n <option\n data-testid=\"jkl-select__option\"\n className=\"jkl-select__option\"\n key={item.value}\n value={item.value}\n >\n {item.label}\n </option>\n ))}\n </select>\n <ArrowVerticalAnimated variant=\"medium\" pointingDown className=\"jkl-select__arrow\" />\n </div>\n )}\n />\n );\n});\n\nNativeSelect.displayName = \"NativeSelect\";\n"],"names":["NativeSelect","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","invalid","items","labelProps","placeholder","selectClassName","supportLabelProps","tooltipProps","value","width","rest","jsx","InputGroup","clsx","render","inputProps","jsxs","style","children","defaultValue","disabled","map","getValuePair","item","ArrowVerticalAnimated","variant","pointingDown","displayName"],"mappings":"4lDAsBO,MAAMA,EAAeC,GAAiD,CAACC,EAAOC,KAC3E,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,YAAAA,EAAc,OACdC,gBAAAA,EACAC,kBAAAA,EACAC,aAAAA,EACAC,MAAAA,EACAC,MAAAA,KACGC,GACHjB,EAcA,OAAAkB,EAACC,EAAA,CAXDjB,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAI,WAAAA,EACAH,OAAAA,EACAM,kBAAAA,EACAC,aAAAA,EAMI,cAAY,aACZX,UAAWiB,EAAK,aAAcjB,EAAW,CACrC,qBAAsBI,EACtB,wBAAyBF,GAAcG,IAE3Ca,OAASC,GACJC,EAAA,MAAA,CAAIpB,UAAU,4BAA4BqB,MAAO,CAAER,MAAAA,GAChDS,SAAA,CAAAF,EAAC,SAAA,CACGtB,IAAAA,EACAE,UAAWiB,EAAK,qBAAsBR,EAAiB,CACnD,qCAAsCG,IAE1CW,aAAcX,OAAQ,EAAY,GAClCA,MAAAA,KACIO,KACAL,EAEHQ,SAAA,CAAed,IAACI,GACZG,EAAA,SAAA,CAAOS,UAAQ,EAACZ,MAAM,GAClBU,SACLd,IAEHF,EAAMmB,IAAIC,GAAcD,KAAKE,GAC1BZ,EAAC,SAAA,CACG,cAAY,qBACZf,UAAU,qBAEVY,MAAOe,EAAKf,MAEXU,SAAKK,EAAA5B,OAHD4B,EAAKf,cAOrBgB,EAAsB,CAAAC,QAAQ,SAASC,cAAY,EAAC9B,UAAU,0BACnE,IAMhBL,EAAaoC,YAAc"}
1
+ {"version":3,"file":"NativeSelect.js","sources":["../../../../src/components/select/NativeSelect.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, SelectHTMLAttributes } from \"react\";\nimport { getValuePair, ValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/index.js\";\nimport { InputGroup, InputGroupProps } from \"../input-group/InputGroup.js\";\n\nexport interface NativeSelectProps\n extends Omit<InputGroupProps, \"children\">,\n SelectHTMLAttributes<HTMLSelectElement> {\n /**\n * Merk som ugyldig uten å sende inn en errorLabel.\n * NB! Brukes kun i tilfeller der valideringsfeil dukker opp andre steder, for eksempel i en FieldGroup.\n */\n invalid?: boolean;\n /**\n * Setter inn et placeholderelement som vises når ingenting er valgt i nedtrekkslisten.\n * @default \"Velg\"\n */\n placeholder?: string;\n items: Array<string | ValuePair>;\n selectClassName?: string;\n width?: string;\n}\n\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>(\n (props, ref) => {\n const {\n label,\n className,\n density,\n errorLabel,\n helpLabel,\n inline,\n invalid,\n items,\n labelProps,\n placeholder = \"Velg\",\n selectClassName,\n supportLabelProps,\n tooltipProps,\n value,\n width,\n ...rest\n } = props;\n\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltipProps,\n };\n\n return (\n <InputGroup\n {...inputGroupProps}\n data-testid=\"jkl-select\"\n className={clsx(\"jkl-select\", className, {\n \"jkl-select--inline\": inline,\n \"jkl-select--invalid\": !!errorLabel || invalid,\n })}\n render={(inputProps) => (\n <div\n className=\"jkl-select__outer-wrapper\"\n style={{ width }}\n >\n <select\n ref={ref}\n className={clsx(\n \"jkl-select__button\",\n selectClassName,\n {\n \"jkl-select__button--active-value\": !!value,\n },\n )}\n defaultValue={value ? undefined : \"\"}\n value={value}\n {...inputProps}\n {...rest}\n >\n {placeholder && !value && (\n <option disabled value=\"\">\n {placeholder}\n </option>\n )}\n {items.map(getValuePair).map((item) => (\n <option\n data-testid=\"jkl-select__option\"\n className=\"jkl-select__option\"\n key={item.value}\n value={item.value}\n >\n {item.label}\n </option>\n ))}\n </select>\n <ArrowVerticalAnimated\n variant=\"medium\"\n pointingDown\n className=\"jkl-select__arrow\"\n />\n </div>\n )}\n />\n );\n },\n);\n\nNativeSelect.displayName = \"NativeSelect\";\n"],"names":["NativeSelect","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","invalid","items","labelProps","placeholder","selectClassName","supportLabelProps","tooltipProps","value","width","rest","jsx","InputGroup","clsx","render","inputProps","jsxs","style","children","defaultValue","disabled","map","getValuePair","item","ArrowVerticalAnimated","variant","pointingDown","displayName"],"mappings":"4lDAwBO,MAAMA,EAAeC,GACxB,CAACC,EAAOC,KACE,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,YAAAA,EAAc,OACdC,gBAAAA,EACAC,kBAAAA,EACAC,aAAAA,EACAC,MAAAA,EACAC,MAAAA,KACGC,GACHjB,EAcA,OAAAkB,EAACC,EAAA,CAXDjB,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAI,WAAAA,EACAH,OAAAA,EACAM,kBAAAA,EACAC,aAAAA,EAMI,cAAY,aACZX,UAAWiB,EAAK,aAAcjB,EAAW,CACrC,qBAAsBI,EACtB,wBAAyBF,GAAcG,IAE3Ca,OAASC,GACLC,EAAC,MAAA,CACGpB,UAAU,4BACVqB,MAAO,CAAER,MAAAA,GAETS,SAAA,CAAAF,EAAC,SAAA,CACGtB,IAAAA,EACAE,UAAWiB,EACP,qBACAR,EACA,CACI,qCAAsCG,IAG9CW,aAAcX,OAAQ,EAAY,GAClCA,MAAAA,KACIO,KACAL,EAEHQ,SAAA,CAAed,IAACI,GACZG,EAAA,SAAA,CAAOS,UAAQ,EAACZ,MAAM,GAClBU,SACLd,IAEHF,EAAMmB,IAAIC,GAAcD,KAAKE,GAC1BZ,EAAC,SAAA,CACG,cAAY,qBACZf,UAAU,qBAEVY,MAAOe,EAAKf,MAEXU,SAAKK,EAAA5B,OAHD4B,EAAKf,YAOtBG,EAACa,EAAA,CACGC,QAAQ,SACRC,cAAY,EACZ9B,UAAU,0BAElB,IAOpBL,EAAaoC,YAAc"}