@fremtind/jokul 0.68.4 → 0.68.6

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 (406) hide show
  1. package/build/build-stats.html +15 -15
  2. package/build/cjs/components/accordion/AccordionItem.cjs.map +1 -1
  3. package/build/cjs/components/autosuggest/Autosuggest.cjs.map +1 -1
  4. package/build/cjs/components/autosuggest/BaseAutosuggest.cjs +2 -2
  5. package/build/cjs/components/autosuggest/BaseAutosuggest.cjs.map +1 -1
  6. package/build/cjs/components/autosuggest/ControllerButton.cjs.map +1 -1
  7. package/build/cjs/components/autosuggest/utils.cjs.map +1 -1
  8. package/build/cjs/components/breadcrumb/Breadcrumb.cjs.map +1 -1
  9. package/build/cjs/components/breadcrumb/documentation/BreadcrumbDocs.cjs.map +1 -1
  10. package/build/cjs/components/breadcrumb/stories/Breadcrumb.stories.cjs +1 -1
  11. package/build/cjs/components/breadcrumb/stories/Breadcrumb.stories.cjs.map +1 -1
  12. package/build/cjs/components/breadcrumb/stories/BreadcrumbItem.stories.cjs.map +1 -1
  13. package/build/cjs/components/button/Button.cjs.map +1 -1
  14. package/build/cjs/components/button/documentation/ButtonDocs.cjs.map +1 -1
  15. package/build/cjs/components/card/Card.cjs.map +1 -1
  16. package/build/cjs/components/card/CardImage.cjs.map +1 -1
  17. package/build/cjs/components/card/NavCard.cjs.map +1 -1
  18. package/build/cjs/components/card/stories/Card.stories.cjs.map +1 -1
  19. package/build/cjs/components/checkbox/Checkbox.cjs.map +1 -1
  20. package/build/cjs/components/checkbox-panel/stories/CheckboxPanel.stories.cjs.map +1 -1
  21. package/build/cjs/components/combobox/Combobox.cjs.map +1 -1
  22. package/build/cjs/components/combobox/stories/Combobox.stories.cjs.map +1 -1
  23. package/build/cjs/components/cookie-consent/CookieConsent.cjs.map +1 -1
  24. package/build/cjs/components/cookie-consent/CookieConsentContext.cjs.map +1 -1
  25. package/build/cjs/components/cookie-consent/stories/CookieConsent.stories.cjs.map +1 -1
  26. package/build/cjs/components/countdown/Countdown.cjs.map +1 -1
  27. package/build/cjs/components/countdown/stories/Countdown.stories.cjs.map +1 -1
  28. package/build/cjs/components/datepicker/DatePicker.cjs.map +1 -1
  29. package/build/cjs/components/datepicker/internal/Calendar.cjs.map +1 -1
  30. package/build/cjs/components/datepicker/internal/calendarReducer.cjs.map +1 -1
  31. package/build/cjs/components/datepicker/internal/useCalendar.cjs.map +1 -1
  32. package/build/cjs/components/datepicker/internal/utils.cjs.map +1 -1
  33. package/build/cjs/components/datepicker/stories/Datepicker.stories.cjs.map +1 -1
  34. package/build/cjs/components/description-list/stories/DescriptionList.stories.cjs.map +1 -1
  35. package/build/cjs/components/expander/ExpandablePanel.cjs.map +1 -1
  36. package/build/cjs/components/expander/ExpandablePanelContent.cjs.map +1 -1
  37. package/build/cjs/components/expander/Expander.cjs.map +1 -1
  38. package/build/cjs/components/expander/deprecated/ExpandSection.cjs.map +1 -1
  39. package/build/cjs/components/expander/deprecated/Expander.cjs.map +1 -1
  40. package/build/cjs/components/expander/stories/Expander.stories.cjs.map +1 -1
  41. package/build/cjs/components/expander/stories/ExpanderPanel.stories.cjs.map +1 -1
  42. package/build/cjs/components/feedback/Feedback.cjs.map +1 -1
  43. package/build/cjs/components/feedback/feedbackContext.cjs.map +1 -1
  44. package/build/cjs/components/feedback/followup/Followup.cjs.map +1 -1
  45. package/build/cjs/components/feedback/followup/followupContext.cjs.map +1 -1
  46. package/build/cjs/components/feedback/followup/useFollowup.cjs.map +1 -1
  47. package/build/cjs/components/feedback/main-question/MainQuestion.cjs.map +1 -1
  48. package/build/cjs/components/feedback/main-question/mainQuestionContext.cjs.map +1 -1
  49. package/build/cjs/components/feedback/main-question/useMainQuestion.cjs.map +1 -1
  50. package/build/cjs/components/feedback/questions/AddonQuestion.cjs.map +1 -1
  51. package/build/cjs/components/feedback/questions/CheckboxQuestion.cjs.map +1 -1
  52. package/build/cjs/components/feedback/questions/ContactQuestion.cjs.map +1 -1
  53. package/build/cjs/components/feedback/questions/RadioQuestion.cjs.map +1 -1
  54. package/build/cjs/components/feedback/questions/SmileyQuestion.cjs.map +1 -1
  55. package/build/cjs/components/feedback/questions/TextQuestion.cjs.map +1 -1
  56. package/build/cjs/components/feedback/questions/smileyUtils.cjs.map +1 -1
  57. package/build/cjs/components/feedback/utils.cjs.map +1 -1
  58. package/build/cjs/components/file-input/File.cjs.map +1 -1
  59. package/build/cjs/components/file-input/FileInput.cjs.map +1 -1
  60. package/build/cjs/components/file-input/internal/Dropzone.cjs.map +1 -1
  61. package/build/cjs/components/file-input/internal/Input.cjs.map +1 -1
  62. package/build/cjs/components/file-input/internal/fileInputContext.cjs.map +1 -1
  63. package/build/cjs/components/file-input/internal/validateFile.cjs.map +1 -1
  64. package/build/cjs/components/file-input/stories/FileInput.stories.cjs.map +1 -1
  65. package/build/cjs/components/flex/Flex.cjs.map +1 -1
  66. package/build/cjs/components/icon/icons/GreenCheckIcon.cjs.map +1 -1
  67. package/build/cjs/components/icon/icons/RedCrossIcon.cjs.map +1 -1
  68. package/build/cjs/components/icon/stories/Icons.stories.cjs.map +1 -1
  69. package/build/cjs/components/icon-button/IconButton.cjs.map +1 -1
  70. package/build/cjs/components/icon-button/stories/IconButton.stories.cjs.map +1 -1
  71. package/build/cjs/components/image/Image.cjs.map +1 -1
  72. package/build/cjs/components/image/stories/Image.stories.cjs.map +1 -1
  73. package/build/cjs/components/image/useImageLoadingStatus.cjs.map +1 -1
  74. package/build/cjs/components/input-group/FieldGroup.cjs.map +1 -1
  75. package/build/cjs/components/input-group/InputGroup.cjs.map +1 -1
  76. package/build/cjs/components/input-group/Label.cjs.map +1 -1
  77. package/build/cjs/components/input-group/SupportLabel.cjs.map +1 -1
  78. package/build/cjs/components/input-group/stories/FieldGroup.stories.cjs +1 -1
  79. package/build/cjs/components/input-group/stories/FieldGroup.stories.cjs.map +1 -1
  80. package/build/cjs/components/input-group/stories/InputGroup.stories.cjs +1 -1
  81. package/build/cjs/components/input-group/stories/InputGroup.stories.cjs.map +1 -1
  82. package/build/cjs/components/link-list/LinkList.cjs.map +1 -1
  83. package/build/cjs/components/link-list/stories/LinkList.stories.cjs.map +1 -1
  84. package/build/cjs/components/list/List.cjs.map +1 -1
  85. package/build/cjs/components/list/stories/List.stories.cjs.map +1 -1
  86. package/build/cjs/components/loader/Loader.cjs.map +1 -1
  87. package/build/cjs/components/loader/skeletons/SkeletonAnimation.cjs.map +1 -1
  88. package/build/cjs/components/loader/skeletons/SkeletonLabel.cjs.map +1 -1
  89. package/build/cjs/components/loader/skeletons/SkeletonTextArea.cjs.map +1 -1
  90. package/build/cjs/components/loader/stories/Skeleton.stories.cjs.map +1 -1
  91. package/build/cjs/components/logo/Logo.cjs.map +1 -1
  92. package/build/cjs/components/logo/LogoStamp.cjs.map +1 -1
  93. package/build/cjs/components/logo/stories/Logo.stories.cjs.map +1 -1
  94. package/build/cjs/components/logo/stories/LogoStamp.stories.cjs.map +1 -1
  95. package/build/cjs/components/logo/useTextSpinner.cjs.map +1 -1
  96. package/build/cjs/components/menu/Menu.cjs +1 -1
  97. package/build/cjs/components/menu/Menu.cjs.map +1 -1
  98. package/build/cjs/components/menu/MenuItem.cjs.map +1 -1
  99. package/build/cjs/components/menu/MenuItemCheckbox.cjs.map +1 -1
  100. package/build/cjs/components/menu/stories/Menu.stories.cjs.map +1 -1
  101. package/build/cjs/components/menu/stories/MenuDivider.stories.cjs.map +1 -1
  102. package/build/cjs/components/menu/stories/MenuItem.stories.cjs.map +1 -1
  103. package/build/cjs/components/menu/useMenuWideEvents.cjs.map +1 -1
  104. package/build/cjs/components/message/FormErrorMessage.cjs.map +1 -1
  105. package/build/cjs/components/message/Message.cjs.map +1 -1
  106. package/build/cjs/components/message/stories/ErrorMessage.stories.cjs.map +1 -1
  107. package/build/cjs/components/message/stories/InfoMessage.stories.cjs.map +1 -1
  108. package/build/cjs/components/message/stories/SuccessMessage.stories.cjs.map +1 -1
  109. package/build/cjs/components/message/stories/WarningMessage.stories.cjs.map +1 -1
  110. package/build/cjs/components/modal/Modal.cjs.map +1 -1
  111. package/build/cjs/components/modal/stories/CompleteModal.stories.cjs +1 -1
  112. package/build/cjs/components/modal/stories/ModalCloseButton.stories.cjs +1 -1
  113. package/build/cjs/components/modal/stories/ModalCloseButton.stories.cjs.map +1 -1
  114. package/build/cjs/components/modal/useModal.cjs.map +1 -1
  115. package/build/cjs/components/pagination/Pagination.cjs.map +1 -1
  116. package/build/cjs/components/popover/Popover.cjs.map +1 -1
  117. package/build/cjs/components/popover/stories/PopoverControlled.stories.cjs +1 -1
  118. package/build/cjs/components/popover/stories/PopoverControlled.stories.cjs.map +1 -1
  119. package/build/cjs/components/popover/stories/PopoverUncontrolled.stories.cjs +1 -1
  120. package/build/cjs/components/popover/stories/PopoverUncontrolled.stories.cjs.map +1 -1
  121. package/build/cjs/components/progress-bar/ProgressBar.cjs.map +1 -1
  122. package/build/cjs/components/radio-button/BaseRadioButton.cjs.map +1 -1
  123. package/build/cjs/components/radio-button/RadioButton.cjs.map +1 -1
  124. package/build/cjs/components/radio-button/RadioButtonGroup.cjs.map +1 -1
  125. package/build/cjs/components/radio-button/stories/RadioButtonGroup.stories.cjs +1 -1
  126. package/build/cjs/components/radio-panel/RadioPanel.cjs.map +1 -1
  127. package/build/cjs/components/radio-panel/RadioPanelGroup.cjs.map +1 -1
  128. package/build/cjs/components/select/NativeSelect.cjs.map +1 -1
  129. package/build/cjs/components/select/Select.cjs.map +1 -1
  130. package/build/cjs/components/select/stories/select.stories.cjs.map +1 -1
  131. package/build/cjs/components/system-message/SystemMessage.cjs.map +1 -1
  132. package/build/cjs/components/system-message/common/MessageIcon.cjs.map +1 -1
  133. package/build/cjs/components/table/ExpandableTableRowController.cjs.map +1 -1
  134. package/build/cjs/components/table/Table.cjs.map +1 -1
  135. package/build/cjs/components/table/TableCell.cjs.map +1 -1
  136. package/build/cjs/components/table/TableHead.cjs.map +1 -1
  137. package/build/cjs/components/table/TableHeader.cjs.map +1 -1
  138. package/build/cjs/components/table/TablePagination.cjs.map +1 -1
  139. package/build/cjs/components/table/TableRow.cjs.map +1 -1
  140. package/build/cjs/components/table/stories/table.stories.cjs.map +1 -1
  141. package/build/cjs/components/table/utils.cjs.map +1 -1
  142. package/build/cjs/components/tabs/NavTab.cjs.map +1 -1
  143. package/build/cjs/components/tabs/NavTabs.cjs.map +1 -1
  144. package/build/cjs/components/tabs/Tab.cjs.map +1 -1
  145. package/build/cjs/components/tabs/TabList.cjs.map +1 -1
  146. package/build/cjs/components/tabs/TabPanel.cjs.map +1 -1
  147. package/build/cjs/components/tabs/Tabs.cjs +1 -1
  148. package/build/cjs/components/tabs/Tabs.cjs.map +1 -1
  149. package/build/cjs/components/tabs/stories/NavTabs.stories.cjs.map +1 -1
  150. package/build/cjs/components/tabs/stories/Tabs.stories.cjs.map +1 -1
  151. package/build/cjs/components/text-area/BaseTextArea.cjs.map +1 -1
  152. package/build/cjs/components/text-area/TextArea.cjs.map +1 -1
  153. package/build/cjs/components/text-input/BaseTextInput.cjs.map +1 -1
  154. package/build/cjs/components/text-input/TextInput.cjs.map +1 -1
  155. package/build/cjs/components/toast/Toast.cjs.map +1 -1
  156. package/build/cjs/components/toast/stories/ToastInCotext.stories.cjs +1 -1
  157. package/build/cjs/components/toast/stories/ToastInCotext.stories.cjs.map +1 -1
  158. package/build/cjs/components/toast/toastContext.cjs.map +1 -1
  159. package/build/cjs/components/toggle-switch/ToggleSlider.cjs.map +1 -1
  160. package/build/cjs/components/toggle-switch/ToggleSwitch.cjs.map +1 -1
  161. package/build/cjs/components/toggle-switch/usePillStyles.cjs.map +1 -1
  162. package/build/cjs/components/tooltip/PopupTip.cjs.map +1 -1
  163. package/build/cjs/components/tooltip/Tooltip.cjs.map +1 -1
  164. package/build/cjs/components/tooltip/TooltipContent.cjs.map +1 -1
  165. package/build/cjs/components/tooltip/TooltipTrigger.cjs.map +1 -1
  166. package/build/cjs/hooks/useAnimatedDetails/useAnimatedDetails.cjs.map +1 -1
  167. package/build/cjs/hooks/useAnimatedHeight/useAnimatedHeight.cjs.map +1 -1
  168. package/build/cjs/hooks/useAnimatedHeight/useAnimatedHeightBetween.cjs.map +1 -1
  169. package/build/cjs/hooks/useAnimatedHeight/useAutoAnimateHeight.cjs.map +1 -1
  170. package/build/cjs/hooks/useAriaLiveRegion/useAriaLiveRegion.cjs.map +1 -1
  171. package/build/cjs/hooks/useBrowserPreferences/useBrowserPreferences.cjs.map +1 -1
  172. package/build/cjs/hooks/useClickOutside/useClickOutside.cjs.map +1 -1
  173. package/build/cjs/hooks/useElementDimensions/useElementDimensions.cjs.map +1 -1
  174. package/build/cjs/hooks/useFocusOutside/useFocusOutside.cjs.map +1 -1
  175. package/build/cjs/hooks/useIntersectionObserver/useIntersectionObserver.cjs.map +1 -1
  176. package/build/cjs/hooks/useKeyListener/useKeyListener.cjs.map +1 -1
  177. package/build/cjs/hooks/useListNavigation/useListNavigation.cjs.map +1 -1
  178. package/build/cjs/hooks/useMutationObserver/useMutationObserver.cjs.map +1 -1
  179. package/build/cjs/hooks/useProgressiveImg/useProgressiveImg.cjs.map +1 -1
  180. package/build/cjs/hooks/useScreen/state.cjs.map +1 -1
  181. package/build/cjs/hooks/useScreen/useScreen.cjs.map +1 -1
  182. package/build/cjs/tailwind/tailwindPreset.cjs.map +1 -1
  183. package/build/cjs/utilities/formatters/avstand/formatAvstand.cjs.map +1 -1
  184. package/build/cjs/utilities/formatters/bytes/formatBytes.cjs.map +1 -1
  185. package/build/cjs/utilities/formatters/fodselsnummer/formatFodselsnummer.cjs.map +1 -1
  186. package/build/cjs/utilities/formatters/kontonummer/formatKontonummer.cjs.map +1 -1
  187. package/build/cjs/utilities/formatters/kortnummer/formatKortnummer.cjs.map +1 -1
  188. package/build/cjs/utilities/formatters/organisasjonsnummer/formatOrganisasjonsnummer.cjs.map +1 -1
  189. package/build/cjs/utilities/formatters/telefonnummer/formatTelefonnummer.cjs.map +1 -1
  190. package/build/cjs/utilities/formatters/util/registerWithMask.cjs.map +1 -1
  191. package/build/cjs/utilities/getThemeAndDensity.cjs.map +1 -1
  192. package/build/cjs/utilities/polymorphism/SlotComponent.cjs.map +1 -1
  193. package/build/cjs/utilities/polymorphism/mergeProps.cjs.map +1 -1
  194. package/build/cjs/utilities/tabListener.cjs.map +1 -1
  195. package/build/cjs/utilities/validators/isValidKortnummer/isValidKortnummer.cjs.map +1 -1
  196. package/build/es/components/accordion/AccordionItem.js.map +1 -1
  197. package/build/es/components/autosuggest/Autosuggest.js.map +1 -1
  198. package/build/es/components/autosuggest/BaseAutosuggest.js +2 -2
  199. package/build/es/components/autosuggest/BaseAutosuggest.js.map +1 -1
  200. package/build/es/components/autosuggest/utils.js.map +1 -1
  201. package/build/es/components/breadcrumb/Breadcrumb.js.map +1 -1
  202. package/build/es/components/breadcrumb/stories/BreadcrumbItem.stories.js.map +1 -1
  203. package/build/es/components/button/documentation/ButtonDocs.js.map +1 -1
  204. package/build/es/components/card/NavCard.js.map +1 -1
  205. package/build/es/components/card/stories/Card.stories.js +1 -1
  206. package/build/es/components/checkbox/Checkbox.js.map +1 -1
  207. package/build/es/components/checkbox-panel/stories/CheckboxPanel.stories.js.map +1 -1
  208. package/build/es/components/combobox/Combobox.js.map +1 -1
  209. package/build/es/components/combobox/stories/Combobox.stories.js.map +1 -1
  210. package/build/es/components/cookie-consent/CookieConsent.js +1 -1
  211. package/build/es/components/cookie-consent/CookieConsent.js.map +1 -1
  212. package/build/es/components/cookie-consent/CookieConsentContext.js.map +1 -1
  213. package/build/es/components/cookie-consent/stories/CookieConsent.stories.js.map +1 -1
  214. package/build/es/components/countdown/Countdown.js.map +1 -1
  215. package/build/es/components/countdown/stories/Countdown.stories.js.map +1 -1
  216. package/build/es/components/datepicker/DatePicker.js.map +1 -1
  217. package/build/es/components/datepicker/internal/Calendar.js +1 -1
  218. package/build/es/components/datepicker/internal/Calendar.js.map +1 -1
  219. package/build/es/components/datepicker/internal/calendarReducer.js.map +1 -1
  220. package/build/es/components/datepicker/internal/useCalendar.js +1 -1
  221. package/build/es/components/datepicker/internal/useCalendar.js.map +1 -1
  222. package/build/es/components/datepicker/internal/utils.js +1 -1
  223. package/build/es/components/datepicker/internal/utils.js.map +1 -1
  224. package/build/es/components/datepicker/stories/Datepicker.stories.js.map +1 -1
  225. package/build/es/components/description-list/stories/DescriptionList.stories.js +1 -1
  226. package/build/es/components/expander/ExpandablePanelContent.js.map +1 -1
  227. package/build/es/components/expander/Expander.js.map +1 -1
  228. package/build/es/components/expander/deprecated/ExpandSection.js.map +1 -1
  229. package/build/es/components/expander/deprecated/Expander.js.map +1 -1
  230. package/build/es/components/expander/stories/Expander.stories.js.map +1 -1
  231. package/build/es/components/expander/stories/ExpanderPanel.stories.js.map +1 -1
  232. package/build/es/components/feedback/Feedback.js.map +1 -1
  233. package/build/es/components/feedback/followup/useFollowup.js.map +1 -1
  234. package/build/es/components/feedback/main-question/useMainQuestion.js.map +1 -1
  235. package/build/es/components/feedback/questions/CheckboxQuestion.js.map +1 -1
  236. package/build/es/components/feedback/questions/ContactQuestion.js.map +1 -1
  237. package/build/es/components/feedback/questions/RadioQuestion.js.map +1 -1
  238. package/build/es/components/feedback/questions/SmileyQuestion.js +1 -1
  239. package/build/es/components/feedback/questions/SmileyQuestion.js.map +1 -1
  240. package/build/es/components/feedback/questions/TextQuestion.js.map +1 -1
  241. package/build/es/components/feedback/questions/smileyUtils.js.map +1 -1
  242. package/build/es/components/feedback/utils.js.map +1 -1
  243. package/build/es/components/file-input/File.js.map +1 -1
  244. package/build/es/components/file-input/FileInput.js.map +1 -1
  245. package/build/es/components/file-input/internal/Dropzone.js.map +1 -1
  246. package/build/es/components/file-input/internal/Input.js.map +1 -1
  247. package/build/es/components/file-input/stories/FileInput.stories.js.map +1 -1
  248. package/build/es/components/flex/Flex.js.map +1 -1
  249. package/build/es/components/icon-button/IconButton.js.map +1 -1
  250. package/build/es/components/icon-button/stories/IconButton.stories.js.map +1 -1
  251. package/build/es/components/image/Image.js.map +1 -1
  252. package/build/es/components/image/useImageLoadingStatus.js.map +1 -1
  253. package/build/es/components/input-group/FieldGroup.js.map +1 -1
  254. package/build/es/components/input-group/InputGroup.js.map +1 -1
  255. package/build/es/components/input-group/Label.js.map +1 -1
  256. package/build/es/components/input-group/SupportLabel.js.map +1 -1
  257. package/build/es/components/input-group/stories/InputGroup.stories.js.map +1 -1
  258. package/build/es/components/loader/Loader.js.map +1 -1
  259. package/build/es/components/loader/skeletons/SkeletonAnimation.js.map +1 -1
  260. package/build/es/components/loader/skeletons/SkeletonLabel.js.map +1 -1
  261. package/build/es/components/loader/skeletons/SkeletonTextArea.js.map +1 -1
  262. package/build/es/components/logo/Logo.js.map +1 -1
  263. package/build/es/components/logo/LogoStamp.js.map +1 -1
  264. package/build/es/components/menu/Menu.js +1 -1
  265. package/build/es/components/menu/Menu.js.map +1 -1
  266. package/build/es/components/menu/MenuItem.js.map +1 -1
  267. package/build/es/components/menu/MenuItemCheckbox.js.map +1 -1
  268. package/build/es/components/menu/stories/Menu.stories.js.map +1 -1
  269. package/build/es/components/menu/stories/MenuDivider.stories.js.map +1 -1
  270. package/build/es/components/menu/stories/MenuItem.stories.js.map +1 -1
  271. package/build/es/components/menu/useMenuWideEvents.js.map +1 -1
  272. package/build/es/components/message/FormErrorMessage.js.map +1 -1
  273. package/build/es/components/message/Message.js.map +1 -1
  274. package/build/es/components/message/stories/ErrorMessage.stories.js.map +1 -1
  275. package/build/es/components/message/stories/InfoMessage.stories.js.map +1 -1
  276. package/build/es/components/message/stories/SuccessMessage.stories.js.map +1 -1
  277. package/build/es/components/message/stories/WarningMessage.stories.js.map +1 -1
  278. package/build/es/components/pagination/Pagination.js.map +1 -1
  279. package/build/es/components/popover/Popover.js +1 -1
  280. package/build/es/components/popover/Popover.js.map +1 -1
  281. package/build/es/components/popover/stories/PopoverControlled.stories.js +1 -1
  282. package/build/es/components/popover/stories/PopoverControlled.stories.js.map +1 -1
  283. package/build/es/components/progress-bar/ProgressBar.js.map +1 -1
  284. package/build/es/components/radio-button/BaseRadioButton.js.map +1 -1
  285. package/build/es/components/radio-button/RadioButtonGroup.js.map +1 -1
  286. package/build/es/components/radio-panel/RadioPanel.js.map +1 -1
  287. package/build/es/components/select/NativeSelect.js.map +1 -1
  288. package/build/es/components/select/Select.js.map +1 -1
  289. package/build/es/components/system-message/SystemMessage.js.map +1 -1
  290. package/build/es/components/system-message/common/MessageIcon.js.map +1 -1
  291. package/build/es/components/table/ExpandableTableRowController.js.map +1 -1
  292. package/build/es/components/table/Table.js.map +1 -1
  293. package/build/es/components/table/TableCell.js.map +1 -1
  294. package/build/es/components/table/TableHead.js.map +1 -1
  295. package/build/es/components/table/TableHeader.js.map +1 -1
  296. package/build/es/components/table/TablePagination.js.map +1 -1
  297. package/build/es/components/table/TableRow.js.map +1 -1
  298. package/build/es/components/table/stories/table.stories.js +1 -1
  299. package/build/es/components/table/utils.js.map +1 -1
  300. package/build/es/components/tabs/NavTab.js.map +1 -1
  301. package/build/es/components/tabs/NavTabs.js.map +1 -1
  302. package/build/es/components/tabs/Tab.js.map +1 -1
  303. package/build/es/components/tabs/TabList.js.map +1 -1
  304. package/build/es/components/tabs/Tabs.js +1 -1
  305. package/build/es/components/tabs/Tabs.js.map +1 -1
  306. package/build/es/components/tabs/stories/NavTabs.stories.js +1 -1
  307. package/build/es/components/tabs/stories/Tabs.stories.js.map +1 -1
  308. package/build/es/components/text-area/BaseTextArea.js.map +1 -1
  309. package/build/es/components/text-area/TextArea.js.map +1 -1
  310. package/build/es/components/text-input/BaseTextInput.js.map +1 -1
  311. package/build/es/components/text-input/TextInput.js.map +1 -1
  312. package/build/es/components/toast/Toast.js.map +1 -1
  313. package/build/es/components/toast/stories/ToastInCotext.stories.js.map +1 -1
  314. package/build/es/components/toast/toastContext.js.map +1 -1
  315. package/build/es/components/toggle-switch/ToggleSlider.js.map +1 -1
  316. package/build/es/components/toggle-switch/ToggleSwitch.js.map +1 -1
  317. package/build/es/components/toggle-switch/usePillStyles.js.map +1 -1
  318. package/build/es/components/tooltip/Tooltip.js +1 -1
  319. package/build/es/components/tooltip/Tooltip.js.map +1 -1
  320. package/build/es/components/tooltip/TooltipTrigger.js.map +1 -1
  321. package/build/es/components/tooltip/stories/Tooltip.stories.js +1 -1
  322. package/build/es/hooks/useAnimatedDetails/useAnimatedDetails.js.map +1 -1
  323. package/build/es/hooks/useAnimatedHeight/useAnimatedHeight.js.map +1 -1
  324. package/build/es/hooks/useAnimatedHeight/useAnimatedHeightBetween.js.map +1 -1
  325. package/build/es/hooks/useAnimatedHeight/useAutoAnimateHeight.js.map +1 -1
  326. package/build/es/hooks/useAriaLiveRegion/useAriaLiveRegion.js.map +1 -1
  327. package/build/es/hooks/useBrowserPreferences/useBrowserPreferences.js.map +1 -1
  328. package/build/es/hooks/useClickOutside/useClickOutside.js.map +1 -1
  329. package/build/es/hooks/useElementDimensions/useElementDimensions.js.map +1 -1
  330. package/build/es/hooks/useFocusOutside/useFocusOutside.js.map +1 -1
  331. package/build/es/hooks/useIntersectionObserver/useIntersectionObserver.js.map +1 -1
  332. package/build/es/hooks/useKeyListener/useKeyListener.js.map +1 -1
  333. package/build/es/hooks/useListNavigation/useListNavigation.js.map +1 -1
  334. package/build/es/hooks/useMutationObserver/useMutationObserver.js.map +1 -1
  335. package/build/es/hooks/useProgressiveImg/useProgressiveImg.js.map +1 -1
  336. package/build/es/hooks/useScreen/state.js.map +1 -1
  337. package/build/es/hooks/useScreen/useScreen.js.map +1 -1
  338. package/build/es/utilities/formatters/util/registerWithMask.js.map +1 -1
  339. package/build/es/utilities/getThemeAndDensity.js.map +1 -1
  340. package/build/es/utilities/polymorphism/SlotComponent.js.map +1 -1
  341. package/build/es/utilities/polymorphism/mergeProps.js.map +1 -1
  342. package/build/es/utilities/tabListener.js.map +1 -1
  343. package/build/es/utilities/validators/isValidKortnummer/isValidKortnummer.js.map +1 -1
  344. package/build/index-C-qqMC-u.cjs +20 -0
  345. package/build/{index-ZdY5zxEI.cjs.map → index-C-qqMC-u.cjs.map} +1 -1
  346. package/build/index-Yq3eaNUM.js +20 -0
  347. package/build/{index-C4ABwKfA.js.map → index-Yq3eaNUM.js.map} +1 -1
  348. package/build/{style.css → jokul.css} +1 -1
  349. package/package.json +28 -28
  350. package/styles/components/accordion/accordion.min.css +1 -1
  351. package/styles/components/button/button.min.css +1 -1
  352. package/styles/components/card/card.min.css +1 -1
  353. package/styles/components/checkbox/checkbox.css +4 -4
  354. package/styles/components/checkbox/checkbox.min.css +1 -1
  355. package/styles/components/checkbox-panel/checkbox-panel.css +2 -2
  356. package/styles/components/checkbox-panel/checkbox-panel.min.css +1 -1
  357. package/styles/components/chip/chip.min.css +1 -1
  358. package/styles/components/combobox/combobox.min.css +1 -1
  359. package/styles/components/cookie-consent/cookie-consent.min.css +1 -1
  360. package/styles/components/countdown/countdown.css +2 -2
  361. package/styles/components/countdown/countdown.min.css +1 -1
  362. package/styles/components/datepicker/datepicker.min.css +1 -1
  363. package/styles/components/description-list/description-list.min.css +1 -1
  364. package/styles/components/expander/deprecated/expander.min.css +1 -1
  365. package/styles/components/expander/expandable.min.css +1 -1
  366. package/styles/components/feedback/feedback.css +2 -2
  367. package/styles/components/feedback/feedback.min.css +1 -1
  368. package/styles/components/file-input/file-input.min.css +1 -1
  369. package/styles/components/icon-button/icon-button.min.css +1 -1
  370. package/styles/components/input-group/input-group.css +2 -2
  371. package/styles/components/input-group/input-group.min.css +1 -1
  372. package/styles/components/link/link.min.css +1 -1
  373. package/styles/components/link-list/link-list.min.css +1 -1
  374. package/styles/components/loader/loader.css +6 -6
  375. package/styles/components/loader/loader.min.css +1 -1
  376. package/styles/components/loader/skeleton-loader.css +5 -5
  377. package/styles/components/loader/skeleton-loader.min.css +1 -1
  378. package/styles/components/menu/menu.min.css +1 -1
  379. package/styles/components/message/message.css +2 -2
  380. package/styles/components/message/message.min.css +1 -1
  381. package/styles/components/modal/modal.min.css +1 -1
  382. package/styles/components/nav-link/nav-link.min.css +1 -1
  383. package/styles/components/popover/popover.min.css +1 -1
  384. package/styles/components/progress-bar/progress-bar.css +1 -1
  385. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  386. package/styles/components/radio-button/radio-button.css +2 -2
  387. package/styles/components/radio-button/radio-button.min.css +1 -1
  388. package/styles/components/radio-panel/radio-panel.css +2 -2
  389. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  390. package/styles/components/select/select.min.css +1 -1
  391. package/styles/components/system-message/system-message.css +2 -2
  392. package/styles/components/system-message/system-message.min.css +1 -1
  393. package/styles/components/table/table.min.css +1 -1
  394. package/styles/components/tabs/tabs.min.css +1 -1
  395. package/styles/components/text-area/text-area.min.css +1 -1
  396. package/styles/components/text-input/text-input.min.css +1 -1
  397. package/styles/components/toast/toast.css +4 -4
  398. package/styles/components/toast/toast.min.css +1 -1
  399. package/styles/components/toggle-switch/toggle-switch.min.css +1 -1
  400. package/styles/components/tooltip/tooltip.min.css +1 -1
  401. package/styles/core/core.min.css +1 -1
  402. package/styles/shared/input-panel/shared.min.css +1 -1
  403. package/styles/styles.css +36 -36
  404. package/styles/styles.min.css +1 -1
  405. package/build/index-C4ABwKfA.js +0 -20
  406. package/build/index-ZdY5zxEI.cjs +0 -20
@@ -1 +1 @@
1
- {"version":3,"file":"SystemMessage.cjs","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport type { SystemMessageProps } from \"./types.js\";\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nfunction systemFactory(\n messageType: messageTypes,\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n density,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id || \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${messageType}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n data-density={density}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n data-theme=\"light\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon messageType={messageType} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n data-theme=\"light\"\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle || \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","messageType","id","className","density","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"6SASA,SAASA,EACLC,GA2DO,MAzD6C,EAChDC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEG,MAAAC,EAAWC,EAAAA,MAAMX,GAAM,qBAAsB,CAC/CY,gBAAiBZ,IAIjB,OAAAa,EAAAA,IAAC,MAAA,CACGR,KAAAA,KACII,EACJT,GAAIU,EACJT,UAAWa,EAAAA,KACP,qBACA,uBAAuBf,IACvBE,EACA,CACI,gCAAiCK,IAGzC,eAAcJ,EAEdM,SAAAO,EAAAA,KAAC,MAAA,CACGd,UAAU,8BACV,cAAY,yBACZ,aAAW,QACXe,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,MAACK,EAAAA,aAAYnB,YAAAA,IACZc,EAAAA,IAAA,OAAA,CAAKZ,UAAU,8BACXO,SAAAA,KAEJ,MAAAD,OAAA,EAAAA,EAAeY,gBACZN,EAAAA,IAACO,EAAAA,cAAA,CACG,aAAW,QACX,gBAAeV,EACfT,UAAU,qCACVoB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,oBAGnC,CAKhB,CAEa,MAAAK,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBACnB,MAAAC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBACpB,MAAAE,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBACtB,MAAAG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}
1
+ {"version":3,"file":"SystemMessage.cjs","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport type { SystemMessageProps } from \"./types.js\";\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nfunction systemFactory(\n messageType: messageTypes,\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n density,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id || \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${messageType}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n data-density={density}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n data-theme=\"light\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon messageType={messageType} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n data-theme=\"light\"\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle || \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","messageType","id","className","density","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"6SASA,SAASA,EACLC,GA2DO,MAzD6C,EAChDC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEG,MAAAC,EAAWC,EAAAA,MAAMX,GAAM,qBAAsB,CAC/CY,gBAAiBZ,IAIjB,OAAAa,EAAAA,IAAC,MAAA,CACGR,KAAAA,KACII,EACJT,GAAIU,EACJT,UAAWa,EAAAA,KACP,qBACA,uBAAuBf,IACvBE,EACA,CACI,gCAAiCK,IAGzC,eAAcJ,EAEdM,SAAAO,EAAAA,KAAC,MAAA,CACGd,UAAU,8BACV,cAAY,yBACZ,aAAW,QACXe,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,MAACK,EAAAA,aAAYnB,YAAAA,IACZc,EAAAA,IAAA,OAAA,CAAKZ,UAAU,8BACXO,SAAAA,KAEJ,MAAAD,OAAA,EAAAA,EAAeY,gBACZN,EAAAA,IAACO,EAAAA,cAAA,CACG,aAAW,QACX,gBAAeV,EACfT,UAAU,qCACVoB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,oBAIvC,CAIZ,CAEa,MAAAK,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBACnB,MAAAC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBACpB,MAAAE,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBACtB,MAAAG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"MessageIcon.cjs","sources":["../../../../../src/components/system-message/common/MessageIcon.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport { ErrorIcon } from \"../../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../../icon/icons/WarningIcon.js\";\n\ntype MessageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\ntype Props = {\n messageType: MessageTypes;\n};\n\nexport const MessageIcon: FC<Props> = ({ messageType }) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-system-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-system-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-system-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-system-message__icon\" />;\n\n default:\n return null;\n }\n};\n"],"names":["messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon"],"mappings":"mVAYsC,EAAGA,YAAAA,MACrC,OAAQA,GACJ,IAAK,QACM,OAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,UAAU,6BAChC,IAAK,OACM,OAAAF,EAAAA,IAACG,EAASA,SAAA,CAAAD,UAAU,6BAC/B,IAAK,UACM,OAAAF,EAAAA,IAACI,EAAYA,YAAA,CAAAF,UAAU,6BAClC,IAAK,UACM,OAAAF,EAAAA,IAACK,EAAYA,YAAA,CAAAH,UAAU,6BAElC,QACW,OAAA,KACf"}
1
+ {"version":3,"file":"MessageIcon.cjs","sources":["../../../../../src/components/system-message/common/MessageIcon.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport { ErrorIcon } from \"../../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../../icon/icons/WarningIcon.js\";\n\ntype MessageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\ntype Props = {\n messageType: MessageTypes;\n};\n\nexport const MessageIcon: FC<Props> = ({ messageType }) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-system-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-system-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-system-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-system-message__icon\" />;\n\n default:\n return null;\n }\n};\n"],"names":["messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon"],"mappings":"mVAYsC,EAAGA,YAAAA,MACrC,OAAQA,GACJ,IAAK,QACM,OAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,UAAU,6BAChC,IAAK,OACM,OAAAF,EAAAA,IAACG,EAASA,SAAA,CAAAD,UAAU,6BAC/B,IAAK,UACM,OAAAF,EAAAA,IAACI,EAAYA,YAAA,CAAAF,UAAU,6BAClC,IAAK,UACM,OAAAF,EAAAA,IAACK,EAAYA,YAAA,CAAAH,UAAU,6BAElC,QACW,OAAA,KAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"ExpandableTableRowController.cjs","sources":["../../../../src/components/table/ExpandableTableRowController.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { Expander } from \"../expander/Expander.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { ExpandableTableRowControllerProps } from \"./types.js\";\n\nconst ExpandableTableRowController = forwardRef<\n HTMLTableCellElement,\n ExpandableTableRowControllerProps\n>(\n (\n {\n isOpen,\n onClick,\n children,\n className,\n id,\n \"aria-controls\": ariaControls,\n ...rest\n },\n ref,\n ) => {\n if (isOpen === undefined || typeof onClick !== \"function\") {\n throw new Error(\n \"ExpandableTableRowController must have ExpandableTableRow as parent\",\n );\n }\n\n const { collapseToList } = useTableContext();\n\n const dataTh = (rest as Record<string, string>)[\"data-th\"];\n\n // pick text from data-th if possible, but only if it's a list\n const showTextFromTh: string | undefined = collapseToList\n ? dataTh\n : undefined;\n\n return (\n <TableCell\n className={clsx(\n \"jkl-table-cell--expand\",\n { [\"jkl-table-cell--expand-without-text\"]: !children },\n className,\n )}\n {...rest}\n ref={ref}\n >\n <Expander\n as=\"button\"\n className={clsx(\"jkl-table-row-expand-button\", {\n [\"jkl-table-row-expand-button--expanded\"]: isOpen,\n })}\n id={id}\n open={isOpen}\n aria-controls={ariaControls}\n aria-label={\n children ? undefined : dataTh || \"Ekspander rad\"\n }\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n onClick();\n }}\n onKeyDown={(e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.stopPropagation();\n e.preventDefault();\n onClick();\n }\n }}\n >\n {/* show children. or try to use data-th if children is undefined */}\n {children ?? showTextFromTh}\n </Expander>\n </TableCell>\n );\n },\n);\n\nExpandableTableRowController.displayName = \"ExpandableTableRowController\";\n\nexport { ExpandableTableRowController };\n"],"names":["ExpandableTableRowController","forwardRef","isOpen","onClick","children","className","id","ariaControls","rest","ref","Error","collapseToList","useTableContext","dataTh","showTextFromTh","jsx","TableCell","clsx","Expander","as","open","e","stopPropagation","onKeyDown","key","preventDefault","displayName"],"mappings":"mRAOMA,EAA+BC,EAAAA,YAIjC,EAEQC,OAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,GAAAA,EACA,gBAAiBC,KACdC,GAEPC,KAEA,QAAe,IAAXP,GAA2C,mBAAZC,EAC/B,MAAM,IAAIO,MACN,uEAIF,MAAEC,eAAAA,GAAmBC,EAAAA,kBAErBC,EAAUL,EAAgC,WAG1CM,EAAqCH,EACrCE,OACA,EAGF,OAAAE,EAAAA,IAACC,EAAAA,UAAA,CACGX,UAAWY,EAAAA,KACP,yBACA,CAAG,uCAAyCb,GAC5CC,MAEAG,EACJC,IAAAA,EAEAL,SAAAW,EAAAA,IAACG,EAAAA,SAAA,CACGC,GAAG,SACHd,UAAWY,OAAK,8BAA+B,CAC1C,wCAA0Cf,IAE/CI,GAAAA,EACAc,KAAMlB,EACN,gBAAeK,EACf,aACIH,OAAW,EAAYS,GAAU,gBAErCV,QAAUkB,IACNA,EAAEC,kBACMnB,KAEZoB,UAAYF,KACM,UAAVA,EAAEG,KAA6B,MAAVH,EAAEG,OACvBH,EAAEC,kBACFD,EAAEI,iBACMtB,MAKfC,SAAYA,GAAAU,KACjB,IAMhBd,EAA6B0B,YAAc"}
1
+ {"version":3,"file":"ExpandableTableRowController.cjs","sources":["../../../../src/components/table/ExpandableTableRowController.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { Expander } from \"../expander/Expander.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { ExpandableTableRowControllerProps } from \"./types.js\";\n\nconst ExpandableTableRowController = forwardRef<\n HTMLTableCellElement,\n ExpandableTableRowControllerProps\n>(\n (\n {\n isOpen,\n onClick,\n children,\n className,\n id,\n \"aria-controls\": ariaControls,\n ...rest\n },\n ref,\n ) => {\n if (isOpen === undefined || typeof onClick !== \"function\") {\n throw new Error(\n \"ExpandableTableRowController must have ExpandableTableRow as parent\",\n );\n }\n\n const { collapseToList } = useTableContext();\n\n const dataTh = (rest as Record<string, string>)[\"data-th\"];\n\n // pick text from data-th if possible, but only if it's a list\n const showTextFromTh: string | undefined = collapseToList\n ? dataTh\n : undefined;\n\n return (\n <TableCell\n className={clsx(\n \"jkl-table-cell--expand\",\n { [\"jkl-table-cell--expand-without-text\"]: !children },\n className,\n )}\n {...rest}\n ref={ref}\n >\n <Expander\n as=\"button\"\n className={clsx(\"jkl-table-row-expand-button\", {\n [\"jkl-table-row-expand-button--expanded\"]: isOpen,\n })}\n id={id}\n open={isOpen}\n aria-controls={ariaControls}\n aria-label={\n children ? undefined : dataTh || \"Ekspander rad\"\n }\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n onClick();\n }}\n onKeyDown={(e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.stopPropagation();\n e.preventDefault();\n onClick();\n }\n }}\n >\n {/* show children. or try to use data-th if children is undefined */}\n {children ?? showTextFromTh}\n </Expander>\n </TableCell>\n );\n },\n);\n\nExpandableTableRowController.displayName = \"ExpandableTableRowController\";\n\nexport { ExpandableTableRowController };\n"],"names":["ExpandableTableRowController","forwardRef","isOpen","onClick","children","className","id","ariaControls","rest","ref","Error","collapseToList","useTableContext","dataTh","showTextFromTh","jsx","TableCell","clsx","Expander","as","open","e","stopPropagation","onKeyDown","key","preventDefault","displayName"],"mappings":"mRAOMA,EAA+BC,EAAAA,YAIjC,EAEQC,OAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,GAAAA,EACA,gBAAiBC,KACdC,GAEPC,KAEA,QAAe,IAAXP,GAA2C,mBAAZC,EAC/B,MAAM,IAAIO,MACN,uEAIF,MAAEC,eAAAA,GAAmBC,oBAErBC,EAAUL,EAAgC,WAG1CM,EAAqCH,EACrCE,OACA,EAGF,OAAAE,EAAAA,IAACC,EAAAA,UAAA,CACGX,UAAWY,EAAAA,KACP,yBACA,CAAG,uCAAyCb,GAC5CC,MAEAG,EACJC,IAAAA,EAEAL,SAAAW,EAAAA,IAACG,EAAAA,SAAA,CACGC,GAAG,SACHd,UAAWY,OAAK,8BAA+B,CAC1C,wCAA0Cf,IAE/CI,GAAAA,EACAc,KAAMlB,EACN,gBAAeK,EACf,aACIH,OAAW,EAAYS,GAAU,gBAErCV,QAAUkB,IACNA,EAAEC,kBACMnB,GAAA,EAEZoB,UAAYF,KACM,UAAVA,EAAEG,KAA6B,MAAVH,EAAEG,OACvBH,EAAEC,kBACFD,EAAEI,iBACMtB,MAKfC,SAAYA,GAAAU,KAErB,IAKZd,EAA6B0B,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Table.cjs","sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useState } from \"react\";\nimport { TableContextProvider } from \"./tableContext.js\";\nimport type { TableProps } from \"./types.js\";\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n caption,\n children,\n density,\n collapseToList = false,\n fullWidth = false,\n tabIndex,\n ...rest\n },\n ref,\n ) => {\n const [hasStickyHead, setHasStickyHead] = useState<boolean>(false);\n\n return (\n <TableContextProvider\n state={{ density, collapseToList, setHasStickyHead }}\n >\n <table\n className={clsx(\"jkl-table\", className, {\n [\"jkl-table--full-width\"]: fullWidth,\n [\"jkl-table--collapse-to-list\"]: collapseToList,\n })}\n {...rest}\n // For content in a scrollable table to be accessible with keyboard\n // navigation we need to set tabIndex\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={hasStickyHead ? 0 : tabIndex}\n ref={ref}\n >\n {caption}\n {children}\n </table>\n </TableContextProvider>\n );\n },\n);\n\nTable.displayName = \"Table\";\n\nexport { Table };\n"],"names":["Table","forwardRef","className","caption","children","density","collapseToList","fullWidth","tabIndex","rest","ref","hasStickyHead","setHasStickyHead","useState","jsx","TableContextProvider","state","jsxs","clsx","displayName"],"mappings":"gNAKMA,EAAQC,EAAAA,YACV,EAEQC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,eAAAA,GAAiB,EACjBC,UAAAA,GAAY,EACZC,SAAAA,KACGC,GAEPC,KAEA,MAAOC,EAAeC,GAAoBC,YAAkB,GAGxD,OAAAC,EAAAA,IAACC,EAAAA,qBAAA,CACGC,MAAO,CAAEX,QAAAA,EAASC,eAAAA,EAAgBM,iBAAAA,GAElCR,SAAAa,EAAAA,KAAC,QAAA,CACGf,UAAWgB,EAAAA,KAAK,YAAahB,EAAW,CACnC,wBAA0BK,EAC1B,8BAAgCD,OAEjCG,EAIJD,SAAUG,EAAgB,EAAIH,EAC9BE,IAAAA,EAECN,SAAA,CAAAD,EACAC,MACL,IAMhBJ,EAAMmB,YAAc"}
1
+ {"version":3,"file":"Table.cjs","sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useState } from \"react\";\nimport { TableContextProvider } from \"./tableContext.js\";\nimport type { TableProps } from \"./types.js\";\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n caption,\n children,\n density,\n collapseToList = false,\n fullWidth = false,\n tabIndex,\n ...rest\n },\n ref,\n ) => {\n const [hasStickyHead, setHasStickyHead] = useState<boolean>(false);\n\n return (\n <TableContextProvider\n state={{ density, collapseToList, setHasStickyHead }}\n >\n <table\n className={clsx(\"jkl-table\", className, {\n [\"jkl-table--full-width\"]: fullWidth,\n [\"jkl-table--collapse-to-list\"]: collapseToList,\n })}\n {...rest}\n // For content in a scrollable table to be accessible with keyboard\n // navigation we need to set tabIndex\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={hasStickyHead ? 0 : tabIndex}\n ref={ref}\n >\n {caption}\n {children}\n </table>\n </TableContextProvider>\n );\n },\n);\n\nTable.displayName = \"Table\";\n\nexport { Table };\n"],"names":["Table","forwardRef","className","caption","children","density","collapseToList","fullWidth","tabIndex","rest","ref","hasStickyHead","setHasStickyHead","useState","jsx","TableContextProvider","state","jsxs","clsx","displayName"],"mappings":"gNAKMA,EAAQC,EAAAA,YACV,EAEQC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,eAAAA,GAAiB,EACjBC,UAAAA,GAAY,EACZC,SAAAA,KACGC,GAEPC,KAEA,MAAOC,EAAeC,GAAoBC,EAAAA,UAAkB,GAGxD,OAAAC,EAAAA,IAACC,EAAAA,qBAAA,CACGC,MAAO,CAAEX,QAAAA,EAASC,eAAAA,EAAgBM,iBAAAA,GAElCR,SAAAa,EAAAA,KAAC,QAAA,CACGf,UAAWgB,EAAAA,KAAK,YAAahB,EAAW,CACnC,wBAA0BK,EAC1B,8BAAgCD,OAEjCG,EAIJD,SAAUG,EAAgB,EAAIH,EAC9BE,IAAAA,EAECN,SAAA,CAAAD,EACAC,MAET,IAKZJ,EAAMmB,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TableCell.cjs","sources":["../../../../src/components/table/TableCell.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableCellProps } from \"./types.js\";\n\nconst TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(\n (\n { align = \"left\", verticalAlign = \"top\", className, density, ...rest },\n ref,\n ) => {\n const { density: contextDensity } = useTableContext();\n return (\n <td\n className={clsx(\"jkl-table-cell\", className, {\n [\"jkl-table-cell--align-right\"]: align === \"right\",\n [\"jkl-table-cell--align-center\"]: align === \"center\",\n [\"jkl-table-cell--vertical-align-center\"]:\n verticalAlign === \"center\",\n })}\n {...rest}\n data-density={density || contextDensity}\n ref={ref}\n />\n );\n },\n);\n\nTableCell.displayName = \"TableCell\";\n\nexport { TableCell };\n"],"names":["TableCell","forwardRef","align","verticalAlign","className","density","rest","ref","contextDensity","useTableContext","jsx","clsx","displayName"],"mappings":"gNAKMA,EAAYC,EAAAA,YACd,EACMC,MAAAA,EAAQ,OAAQC,cAAAA,EAAgB,MAAOC,UAAAA,EAAWC,QAAAA,KAAYC,GAChEC,KAEA,MAAQF,QAASG,GAAmBC,EAAgBA,kBAEhD,OAAAC,EAAAA,IAAC,KAAA,CACGN,UAAWO,EAAAA,KAAK,iBAAkBP,EAAW,CACxC,8BAA0C,UAAVF,EAChC,+BAA2C,WAAVA,EACjC,wCACqB,WAAlBC,OAEJG,EACJ,eAAcD,GAAWG,EACzBD,IAAAA,GAAA,IAMhBP,EAAUY,YAAc"}
1
+ {"version":3,"file":"TableCell.cjs","sources":["../../../../src/components/table/TableCell.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableCellProps } from \"./types.js\";\n\nconst TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(\n (\n { align = \"left\", verticalAlign = \"top\", className, density, ...rest },\n ref,\n ) => {\n const { density: contextDensity } = useTableContext();\n return (\n <td\n className={clsx(\"jkl-table-cell\", className, {\n [\"jkl-table-cell--align-right\"]: align === \"right\",\n [\"jkl-table-cell--align-center\"]: align === \"center\",\n [\"jkl-table-cell--vertical-align-center\"]:\n verticalAlign === \"center\",\n })}\n {...rest}\n data-density={density || contextDensity}\n ref={ref}\n />\n );\n },\n);\n\nTableCell.displayName = \"TableCell\";\n\nexport { TableCell };\n"],"names":["TableCell","forwardRef","align","verticalAlign","className","density","rest","ref","contextDensity","useTableContext","jsx","clsx","displayName"],"mappings":"gNAKMA,EAAYC,EAAAA,YACd,EACMC,MAAAA,EAAQ,OAAQC,cAAAA,EAAgB,MAAOC,UAAAA,EAAWC,QAAAA,KAAYC,GAChEC,KAEA,MAAQF,QAASG,GAAmBC,oBAEhC,OAAAC,EAAAA,IAAC,KAAA,CACGN,UAAWO,EAAAA,KAAK,iBAAkBP,EAAW,CACxC,8BAA0C,UAAVF,EAChC,+BAA2C,WAAVA,EACjC,wCACqB,WAAlBC,OAEJG,EACJ,eAAcD,GAAWG,EACzBD,IAAAA,GACJ,IAKZP,EAAUY,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TableHead.cjs","sources":["../../../../src/components/table/TableHead.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport type { TableHeadProps } from \"./types.js\";\n\nconst TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(\n ({ className, srOnly, sticky = false, ...rest }, ref) => {\n const { setHasStickyHead } = useTableContext();\n useEffect(() => {\n setHasStickyHead(sticky);\n }, [sticky, setHasStickyHead]);\n\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: true,\n isTableBody: false,\n isTableFooter: false,\n }}\n >\n <thead\n className={clsx(\"jkl-table-head\", className, {\n [\"jkl-table-head--sr-only\"]: srOnly,\n [\"jkl-table-head--sticky\"]: sticky,\n })}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableHead.displayName = \"TableHead\";\n\nexport { TableHead };\n"],"names":["TableHead","forwardRef","className","srOnly","sticky","rest","ref","setHasStickyHead","useTableContext","useEffect","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"uPAMMA,EAAYC,EAAAA,YACd,EAAGC,UAAAA,EAAWC,OAAAA,EAAQC,OAAAA,GAAS,KAAUC,GAAQC,KACvC,MAAEC,iBAAAA,GAAqBC,EAAAA,kBAC7BC,OAAAA,EAAAA,WAAU,KACNF,EAAiBH,EAAM,GACxB,CAACA,EAAQG,IAGRG,EAAAA,IAACC,EAAAA,4BAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAAA,IAAC,QAAA,CACGR,UAAWe,EAAAA,KAAK,iBAAkBf,EAAW,CACxC,0BAA4BC,EAC5B,yBAA2BC,OAE5BC,EACJC,IAAAA,KACJ,IAMhBN,EAAUkB,YAAc"}
1
+ {"version":3,"file":"TableHead.cjs","sources":["../../../../src/components/table/TableHead.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport type { TableHeadProps } from \"./types.js\";\n\nconst TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(\n ({ className, srOnly, sticky = false, ...rest }, ref) => {\n const { setHasStickyHead } = useTableContext();\n useEffect(() => {\n setHasStickyHead(sticky);\n }, [sticky, setHasStickyHead]);\n\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: true,\n isTableBody: false,\n isTableFooter: false,\n }}\n >\n <thead\n className={clsx(\"jkl-table-head\", className, {\n [\"jkl-table-head--sr-only\"]: srOnly,\n [\"jkl-table-head--sticky\"]: sticky,\n })}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableHead.displayName = \"TableHead\";\n\nexport { TableHead };\n"],"names":["TableHead","forwardRef","className","srOnly","sticky","rest","ref","setHasStickyHead","useTableContext","useEffect","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"uPAMMA,EAAYC,EAAAA,YACd,EAAGC,UAAAA,EAAWC,OAAAA,EAAQC,OAAAA,GAAS,KAAUC,GAAQC,KACvC,MAAEC,iBAAAA,GAAqBC,oBAC7BC,OAAAA,EAAAA,WAAU,KACNF,EAAiBH,EAAM,GACxB,CAACA,EAAQG,IAGRG,EAAAA,IAACC,EAAAA,4BAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAAA,IAAC,QAAA,CACGR,UAAWe,EAAAA,KAAK,iBAAkBf,EAAW,CACxC,0BAA4BC,EAC5B,yBAA2BC,OAE5BC,EACJC,IAAAA,KAER,IAKZN,EAAUkB,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TableHeader.cjs","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" | \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density || contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"8QAQMA,EAAcC,EAAAA,YAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,EAAgBA,kBAQhD,OAAAC,EAAAA,KAAC,KAAA,CACGT,UAAWU,EAAAA,KAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SAAQ,KAeVC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAAA,IAAC,MAAA,CACGZ,UAAWU,OAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAAAA,IAACE,EAAAA,sBAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,QAGhB,IAOpBJ,EAAYuB,YAAc"}
1
+ {"version":3,"file":"TableHeader.cjs","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" | \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density || contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"8QAQMA,EAAcC,EAAAA,YAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,oBAQhC,OAAAC,EAAAA,KAAC,KAAA,CACGT,UAAWU,EAAAA,KAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SACd,KAcYC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAAA,IAAC,MAAA,CACGZ,UAAWU,OAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAAAA,IAACE,EAAAA,sBAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,QAKxB,IAKZJ,EAAYuB,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TablePagination.cjs","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n }\n\n if (num > max) {\n return max;\n }\n\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp || \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset.number as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [onChange, currentPage, numberOfPages],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density || contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"TablePagination.cjs","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n }\n\n if (num > max) {\n return max;\n }\n\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp || \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset.number as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [onChange, currentPage, numberOfPages],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density || contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"TableRow.cjs","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport type { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked || false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" || e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"uPAMMA,EAAWC,EAAAA,YACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,EAAAA,mBACZC,YAAAA,GAAgBC,EAAAA,0BAEjBC,EAASC,GAAcC,EAASA,UAAA,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,EAAAA,WAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,GAAA,GAEhE,CAAC,MAAAb,SAAAA,EAAWW,YAEXL,GAAeN,EAEXc,EAAAA,IAAC,KAAA,CACGC,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EAAAA,KACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,IAMTa,EAAAA,IAAC,KAAA,CACGf,UAAWqB,EAAAA,KAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,GAAA,IAMjBJ,EAAS0B,YAAc"}
1
+ {"version":3,"file":"TableRow.cjs","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport type { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked || false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" || e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"uPAMMA,EAAWC,EAAAA,YACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,qBACZC,YAAAA,GAAgBC,4BAEjBC,EAASC,GAAcC,EAASA,UAAA,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,EAAAA,WAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,GAC/D,GACD,CAAC,MAAAb,SAAAA,EAAWW,YAEXL,GAAeN,EAEXc,EAAAA,IAAC,KAAA,CACGC,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EAAAA,KACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,IAMTa,EAAAA,IAAC,KAAA,CACGf,UAAWqB,EAAAA,KAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,GACL,IAKZJ,EAAS0B,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"table.stories.cjs","sources":["../../../../../src/components/table/stories/table.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Table } from \"../Table.js\";\nimport { TableBody } from \"../TableBody.js\";\nimport { TableCaption } from \"../TableCaption.js\";\nimport { TableCell } from \"../TableCell.js\";\nimport { TableHead } from \"../TableHead.js\";\nimport { TableHeader } from \"../TableHeader.js\";\nimport { TableRow } from \"../TableRow.js\";\nimport \"../styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/Table\",\n component: Table,\n parameters: {\n layout: \"centered\",\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Table>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nconst columns = [\n \"Dato\",\n \"Saksnummer\",\n \"Kundenummer\",\n \"Kundenavn\",\n \"Milepæl\",\n \"Følger saken\",\n];\n\nconst rows = [\n [\n \"24.02.2020\",\n \"20-1234567\",\n \"010203 99887\",\n \"Ola Nordmann\",\n \"Opprettet\",\n \"Siri Saksbehandler\",\n ],\n [\n \"13.04.2019\",\n \"20-8382811\",\n \"010203 99887\",\n \"Kari Nordkvinne\",\n \"Opprettet\",\n \"Siri Saksbehandler\",\n ],\n [\n \"31.07.2017\",\n \"20-1111\",\n \"010203 99887\",\n \"Kari Nordkvinne\",\n \"Opprettet\",\n \"Per Persen\",\n ],\n];\n\nexport const TableComponent: Story = {\n args: {\n caption: (\n <TableCaption srOnly>Overskrift for skjermlesere</TableCaption>\n ),\n children: (\n <>\n <TableHead>\n <TableRow>\n {columns.map((column, index) => (\n <TableHeader key={index} bold>\n {column}\n </TableHeader>\n ))}\n </TableRow>\n </TableHead>\n <TableBody>\n {rows.map((row, rowIndex) => (\n <TableRow key={rowIndex}>\n {row.map((cell, cellIndex) => (\n <TableCell\n key={cellIndex}\n data-th={columns[cellIndex]}\n align={\n [1, 2].includes(cellIndex)\n ? \"right\"\n : \"left\"\n }\n >\n {cell}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </>\n ),\n },\n render: (args) => (\n <Table caption={args.caption} fullWidth>\n {args.children}\n </Table>\n ),\n};\n"],"names":["meta","title","component","Table","parameters","layout","tags","columns","TableComponent","args","caption","jsx","TableCaption","srOnly","children","jsxs","Fragment","TableHead","TableRow","map","column","index","TableHeader","bold","TableBody","row","rowIndex","cell","cellIndex","TableCell","align","includes","render","fullWidth"],"mappings":"0XAWMA,EAAO,CACTC,MAAO,oBACPC,UAAWC,EAAAA,MACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,aAMLC,EAAU,CACZ,OACA,aACA,cACA,YACA,UACA,gBA8BSC,EAAwB,CACjCC,KAAM,CACFC,QACIC,EAAAA,IAACC,eAAa,CAAAC,QAAM,EAACC,SAA2B,gCAEpDA,SAEQC,EAAAA,KAAAC,WAAA,CAAAF,SAAA,CAAAH,MAACM,EAAAA,WACGH,SAACH,EAAAA,IAAAO,WAAA,CACIJ,SAAQP,EAAAY,KAAI,CAACC,EAAQC,IACjBV,EAAAA,IAAAW,EAAAA,YAAA,CAAwBC,MAAI,EACxBT,SAAAM,GADaC,SAM7BV,EAAAA,IAAAa,EAAAA,UAAA,CACIV,SA5CR,CACT,CACI,aACA,aACA,eACA,eACA,YACA,sBAEJ,CACI,aACA,aACA,eACA,kBACA,YACA,sBAEJ,CACI,aACA,UACA,eACA,kBACA,YACA,eAqBkBK,KAAI,CAACM,EAAKC,IACZf,EAAAA,IAACO,EACIA,SAAA,CAAAJ,SAAAW,EAAIN,KAAI,CAACQ,EAAMC,IACZjB,EAAAA,IAACkB,EAAAA,UAAA,CAEG,UAAStB,EAAQqB,GACjBE,MACI,CAAC,EAAG,GAAGC,SAASH,GACV,QACA,OAGTd,SAAAa,GARIC,MAHFF,WAoBnCM,OAASvB,GACJE,EAAAA,IAAAR,EAAAA,MAAA,CAAMO,QAASD,EAAKC,QAASuB,WAAS,EAClCnB,SAAAL,EAAKK"}
1
+ {"version":3,"file":"table.stories.cjs","sources":["../../../../../src/components/table/stories/table.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Table } from \"../Table.js\";\nimport { TableBody } from \"../TableBody.js\";\nimport { TableCaption } from \"../TableCaption.js\";\nimport { TableCell } from \"../TableCell.js\";\nimport { TableHead } from \"../TableHead.js\";\nimport { TableHeader } from \"../TableHeader.js\";\nimport { TableRow } from \"../TableRow.js\";\nimport \"../styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/Table\",\n component: Table,\n parameters: {\n layout: \"centered\",\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Table>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nconst columns = [\n \"Dato\",\n \"Saksnummer\",\n \"Kundenummer\",\n \"Kundenavn\",\n \"Milepæl\",\n \"Følger saken\",\n];\n\nconst rows = [\n [\n \"24.02.2020\",\n \"20-1234567\",\n \"010203 99887\",\n \"Ola Nordmann\",\n \"Opprettet\",\n \"Siri Saksbehandler\",\n ],\n [\n \"13.04.2019\",\n \"20-8382811\",\n \"010203 99887\",\n \"Kari Nordkvinne\",\n \"Opprettet\",\n \"Siri Saksbehandler\",\n ],\n [\n \"31.07.2017\",\n \"20-1111\",\n \"010203 99887\",\n \"Kari Nordkvinne\",\n \"Opprettet\",\n \"Per Persen\",\n ],\n];\n\nexport const TableComponent: Story = {\n args: {\n caption: (\n <TableCaption srOnly>Overskrift for skjermlesere</TableCaption>\n ),\n children: (\n <>\n <TableHead>\n <TableRow>\n {columns.map((column, index) => (\n <TableHeader key={index} bold>\n {column}\n </TableHeader>\n ))}\n </TableRow>\n </TableHead>\n <TableBody>\n {rows.map((row, rowIndex) => (\n <TableRow key={rowIndex}>\n {row.map((cell, cellIndex) => (\n <TableCell\n key={cellIndex}\n data-th={columns[cellIndex]}\n align={\n [1, 2].includes(cellIndex)\n ? \"right\"\n : \"left\"\n }\n >\n {cell}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </>\n ),\n },\n render: (args) => (\n <Table caption={args.caption} fullWidth>\n {args.children}\n </Table>\n ),\n};\n"],"names":["meta","title","component","Table","parameters","layout","tags","columns","TableComponent","args","caption","jsx","TableCaption","srOnly","children","jsxs","Fragment","TableHead","TableRow","map","column","index","TableHeader","bold","TableBody","row","rowIndex","cell","cellIndex","TableCell","align","includes","render","fullWidth"],"mappings":"0XAWMA,EAAO,CACTC,MAAO,oBACPC,UAAWC,EAAAA,MACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,aAMLC,EAAU,CACZ,OACA,aACA,cACA,YACA,UACA,gBA8BSC,EAAwB,CACjCC,KAAM,CACFC,QACIC,EAAAA,IAACC,eAAa,CAAAC,QAAM,EAACC,SAA2B,gCAEpDA,SAEQC,EAAAA,KAAAC,WAAA,CAAAF,SAAA,CAAAH,MAACM,EAAAA,WACGH,SAACH,EAAAA,IAAAO,WAAA,CACIJ,SAAQP,EAAAY,KAAI,CAACC,EAAQC,IACjBV,EAAAA,IAAAW,EAAAA,YAAA,CAAwBC,MAAI,EACxBT,SAAAM,GADaC,SAM7BV,EAAAA,IAAAa,EAAAA,UAAA,CACIV,SA5CR,CACT,CACI,aACA,aACA,eACA,eACA,YACA,sBAEJ,CACI,aACA,aACA,eACA,kBACA,YACA,sBAEJ,CACI,aACA,UACA,eACA,kBACA,YACA,eAqBkBK,KAAI,CAACM,EAAKC,IACZf,EAAAA,IAACO,EACIA,SAAA,CAAAJ,SAAAW,EAAIN,KAAI,CAACQ,EAAMC,IACZjB,EAAAA,IAACkB,EAAAA,UAAA,CAEG,UAAStB,EAAQqB,GACjBE,MACI,CAAC,EAAG,GAAGC,SAASH,GACV,QACA,OAGTd,SAAAa,GARIC,MAHFF,WAoBnCM,OAASvB,GACJE,MAAAR,EAAAA,MAAA,CAAMO,QAASD,EAAKC,QAASuB,WAAS,EAClCnB,SAAAL,EAAKK"}
@@ -1 +1 @@
1
- {"version":3,"file":"utils.cjs","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import type { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["activeSortKey","activeSortDirection","onChange","handleClick","sortKey","newSortParameters","calculateNewSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"+GAMsC,CAClCA,EACAC,EACAC,KAKM,MAUAC,EAAeC,IACX,MAAAC,EAVND,IAEIA,IAAYJ,GAAyC,SAAxBC,EACtB,MAGJ,OAImBK,CAA2BF,GACrDF,EAASE,EAASC,EAAiB,EAahC,MAAA,CACHE,aAXkBH,IAAAA,CAEdI,SAAU,CACNC,QAAS,IAAMN,EAAYC,GAC3BM,UACIV,IAAkBI,EAAUH,OAAsB,KAM9D"}
1
+ {"version":3,"file":"utils.cjs","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import type { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["activeSortKey","activeSortDirection","onChange","handleClick","sortKey","newSortParameters","calculateNewSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"+GAMsC,CAClCA,EACAC,EACAC,KAKM,MAUAC,EAAeC,IACX,MAAAC,EAVND,IAEIA,IAAYJ,GAAyC,SAAxBC,EACtB,MAGJ,OAImBK,CAA2BF,GACrDF,EAASE,EAASC,EAAiB,EAahC,MAAA,CACHE,aAXkBH,IAAAA,CAEdI,SAAU,CACNC,QAAS,IAAMN,EAAYC,GAC3BM,UACIV,IAAkBI,EAAUH,OAAsB,KAOlE"}
@@ -1 +1 @@
1
- {"version":3,"file":"NavTab.cjs","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"gLASaA,EAASC,EAAAA,YAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,EAAAA,aACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,EAAAA,aACnBM,cACO,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,oBAAR,EAAAD,EAAuBE,gBAAvB,EAAAH,EACMD,iBAGlB,CAEI,GAAc,eAAdL,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,WAGnC,IAEJ,CAACrB,IAID,OAAAsB,EAAAA,IAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAAA,KAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}
1
+ {"version":3,"file":"NavTab.cjs","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"gLASaA,EAASC,EAAAA,YAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,EAAAA,aACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,EAAAA,aACnBM,cACO,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,oBAAR,EAAAD,EAAuBE,gBAAvB,EAAAH,EACMD,iBAEd,CAGA,GAAc,eAAdL,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,WAE/B,IAGR,CAACrB,IAID,OAAAsB,EAAAA,IAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAAA,KAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}
@@ -1 +1 @@
1
- {"version":3,"file":"NavTabs.cjs","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies:\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left || 0) -\n (tabsRect?.left || 0) +\n (scrollRef.current?.scrollLeft || 0),\n bottom: -1,\n width:\n (activeRect?.width || 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"gMAIuB,EACnB,aAAcA,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,EAAkBA,YAC3CC,EAAYC,GAAiBF,EAAkBA,WAEhDG,EAAYC,SAAuB,MACnCC,EAAaD,SAAuB,MACpCE,EAAYF,SAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,mBAK5BC,OAAAA,EAAAA,WAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAAA,IAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAAA,KAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAAA,KAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAAA,IAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,SAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,gBAAVa,EAAmBC,aAAc,GACtCC,QACA,EAAAC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,WAG9C"}
1
+ {"version":3,"file":"NavTabs.cjs","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies:\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left || 0) -\n (tabsRect?.left || 0) +\n (scrollRef.current?.scrollLeft || 0),\n bottom: -1,\n width:\n (activeRect?.width || 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"gMAIuB,EACnB,aAAcA,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,cACzBC,EAAYC,GAAiBF,aAE9BG,EAAYC,SAAuB,MACnCC,EAAaD,SAAuB,MACpCE,EAAYF,SAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,mBAK5BC,OAAAA,EAAAA,WAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAAA,IAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAAA,KAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAAA,KAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAAA,IAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,SAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,gBAAVa,EAAmBC,aAAc,GACtCC,QACA,EAAAC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,WAIlD"}
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.cjs","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabProps } from \"./types.js\";\n\n/**\n * En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"6JASaA,mBAAYC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAAA,KAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAAA,IAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,GAAA,IAM3BJ,EAAIU,YAAc"}
1
+ {"version":3,"file":"Tab.cjs","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabProps } from \"./types.js\";\n\n/**\n * En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"6JASaA,mBAAYC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAAA,KAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAAA,IAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,GACf,IAKZJ,EAAIU,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TabList.cjs","sources":["../../../../src/components/tabs/TabList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useCallback, useRef } from \"react\";\nimport type { TabListProps } from \"./types.js\";\n\nexport interface InjectedProps {\n activeIndex: number;\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n tabIDs: string[];\n tabPanelIDs: string[];\n}\n\n/**\n * Konteiner for elementer av typen Tab. Ikke funksjonell utenfor et Tabs element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabList = ({ children, className, ...injected }: TabListProps) => {\n // props injected by Tabs\n const { activeIndex, setActiveIndex, tabIDs, tabPanelIDs, ...rest } =\n injected as TabListProps & InjectedProps;\n\n const tabsRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLButtonElement>(null);\n\n const keyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n (prev as HTMLElement).focus();\n } else {\n (\n current.parentElement?.lastChild\n ?.previousSibling as HTMLElement\n ).focus();\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"BUTTON\") {\n (next as HTMLElement).focus();\n } else {\n (current.parentElement?.firstChild as HTMLElement).focus();\n }\n }\n },\n [],\n );\n\n return (\n <div\n role=\"tablist\"\n ref={tabsRef}\n {...rest}\n className={clsx(\"jkl-tablist\", className)}\n >\n {React.Children.map(children, (tab, tabIndex) => {\n const isActive = activeIndex === tabIndex;\n\n return React.isValidElement(tab)\n ? React.cloneElement<any>(tab, {\n onKeyDown: keyDownHandler,\n tabIndex: isActive ? undefined : -1,\n ref: isActive ? activeRef : undefined,\n onClick: () => setActiveIndex(tabIndex),\n \"aria-selected\": isActive,\n \"aria-controls\": tabPanelIDs[tabIndex],\n id: tabIDs[tabIndex],\n })\n : null;\n })}\n </div>\n );\n};\n"],"names":["children","className","injected","activeIndex","setActiveIndex","tabIDs","tabPanelIDs","rest","tabsRef","useRef","activeRef","keyDownHandler","useCallback","event","key","current","currentTarget","prev","previousSibling","focus","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","ref","clsx","Children","map","tab","tabIndex","isActive","React","isValidElement","cloneElement","onKeyDown","onClick","id"],"mappings":"gMAgBuB,EAAGA,SAAAA,EAAUC,UAAAA,KAAcC,MAE9C,MAAQC,YAAAA,EAAaC,eAAAA,EAAgBC,OAAAA,EAAQC,YAAAA,KAAgBC,GACzDL,EAEEM,EAAUC,SAAuB,MACjCC,EAAYD,SAA0B,MAEtCE,EAAiBC,EAAAA,aAClBC,cACO,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAE7BD,EACCA,EAAqBE,SAGlB,OAAAC,EAAA,OAAAC,EAAAN,EAAQO,oBAAR,EAAAD,EAAuBE,gBAAvB,EAAAH,EACMF,iBACRC,OAEV,CAEI,GAAc,eAAdN,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBQ,EAAOX,EAAMG,cAAcS,YAG7BD,GAA0B,WAAlBA,EAAKE,SACZF,EAAqBL,SAErB,OAAAQ,EAAAZ,EAAQO,sBAARK,EAAuBC,YAA2BT,OAE3D,IAEJ,IAIA,OAAAU,EAAAA,IAAC,MAAA,CACGC,KAAK,UACLC,IAAKvB,KACDD,EACJN,UAAW+B,EAAAA,KAAK,cAAe/B,GAE9BD,WAAMiC,SAASC,IAAIlC,GAAU,CAACmC,EAAKC,KAChC,MAAMC,EAAWlC,IAAgBiC,EAEjC,OAAOE,EAAMC,eAAeJ,GACtBG,EAAME,aAAkBL,EAAK,CACzBM,UAAW9B,EACXyB,SAAUC,OAAW,GAAY,EACjCN,IAAKM,EAAW3B,OAAY,EAC5BgC,QAAS,IAAMtC,EAAegC,GAC9B,gBAAiBC,EACjB,gBAAiB/B,EAAY8B,GAC7BO,GAAItC,EAAO+B,KAEf,SACT"}
1
+ {"version":3,"file":"TabList.cjs","sources":["../../../../src/components/tabs/TabList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useCallback, useRef } from \"react\";\nimport type { TabListProps } from \"./types.js\";\n\nexport interface InjectedProps {\n activeIndex: number;\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n tabIDs: string[];\n tabPanelIDs: string[];\n}\n\n/**\n * Konteiner for elementer av typen Tab. Ikke funksjonell utenfor et Tabs element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabList = ({ children, className, ...injected }: TabListProps) => {\n // props injected by Tabs\n const { activeIndex, setActiveIndex, tabIDs, tabPanelIDs, ...rest } =\n injected as TabListProps & InjectedProps;\n\n const tabsRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLButtonElement>(null);\n\n const keyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n (prev as HTMLElement).focus();\n } else {\n (\n current.parentElement?.lastChild\n ?.previousSibling as HTMLElement\n ).focus();\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"BUTTON\") {\n (next as HTMLElement).focus();\n } else {\n (current.parentElement?.firstChild as HTMLElement).focus();\n }\n }\n },\n [],\n );\n\n return (\n <div\n role=\"tablist\"\n ref={tabsRef}\n {...rest}\n className={clsx(\"jkl-tablist\", className)}\n >\n {React.Children.map(children, (tab, tabIndex) => {\n const isActive = activeIndex === tabIndex;\n\n return React.isValidElement(tab)\n ? React.cloneElement<any>(tab, {\n onKeyDown: keyDownHandler,\n tabIndex: isActive ? undefined : -1,\n ref: isActive ? activeRef : undefined,\n onClick: () => setActiveIndex(tabIndex),\n \"aria-selected\": isActive,\n \"aria-controls\": tabPanelIDs[tabIndex],\n id: tabIDs[tabIndex],\n })\n : null;\n })}\n </div>\n );\n};\n"],"names":["children","className","injected","activeIndex","setActiveIndex","tabIDs","tabPanelIDs","rest","tabsRef","useRef","activeRef","keyDownHandler","useCallback","event","key","current","currentTarget","prev","previousSibling","focus","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","ref","clsx","Children","map","tab","tabIndex","isActive","React","isValidElement","cloneElement","onKeyDown","onClick","id"],"mappings":"gMAgBuB,EAAGA,SAAAA,EAAUC,UAAAA,KAAcC,MAE9C,MAAQC,YAAAA,EAAaC,eAAAA,EAAgBC,OAAAA,EAAQC,YAAAA,KAAgBC,GACzDL,EAEEM,EAAUC,SAAuB,MACjCC,EAAYD,SAA0B,MAEtCE,EAAiBC,EAAAA,aAClBC,cACO,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAE7BD,EACCA,EAAqBE,SAGlB,OAAAC,EAAA,OAAAC,EAAAN,EAAQO,oBAAR,EAAAD,EAAuBE,gBAAvB,EAAAH,EACMF,iBACRC,OACN,CAGA,GAAc,eAAdN,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBQ,EAAOX,EAAMG,cAAcS,YAG7BD,GAA0B,WAAlBA,EAAKE,SACZF,EAAqBL,SAErB,OAAAQ,EAAAZ,EAAQO,sBAARK,EAAuBC,YAA2BT,OACvD,IAGR,IAIA,OAAAU,EAAAA,IAAC,MAAA,CACGC,KAAK,UACLC,IAAKvB,KACDD,EACJN,UAAW+B,EAAAA,KAAK,cAAe/B,GAE9BD,WAAMiC,SAASC,IAAIlC,GAAU,CAACmC,EAAKC,KAChC,MAAMC,EAAWlC,IAAgBiC,EAEjC,OAAOE,EAAMC,eAAeJ,GACtBG,EAAME,aAAkBL,EAAK,CACzBM,UAAW9B,EACXyB,SAAUC,OAAW,GAAY,EACjCN,IAAKM,EAAW3B,OAAY,EAC5BgC,QAAS,IAAMtC,EAAegC,GAC9B,gBAAiBC,EACjB,gBAAiB/B,EAAY8B,GAC7BO,GAAItC,EAAO+B,KAEf,SAEd"}
@@ -1 +1 @@
1
- {"version":3,"file":"TabPanel.cjs","sources":["../../../../src/components/tabs/TabPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabPanelProps } from \"./types.js\";\n\n/**\n * Konteiner for innhold i et tabbet brukergrensesnitt. Ikke funksjonell utenfor et Tabs element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabPanel = ({ children, ...props }: TabPanelProps) => {\n const classes = clsx(\"jkl-tabpanel\", props.className);\n\n return (\n <div role=\"tabpanel\" {...props} className={classes}>\n {children}\n </div>\n );\n};\n"],"names":["children","props","classes","clsx","className","jsx","role"],"mappings":"+LASwB,EAAGA,SAAAA,KAAaC,MACpC,MAAMC,EAAUC,EAAAA,KAAK,eAAgBF,EAAMG,WAGvC,OAAAC,MAAC,OAAIC,KAAK,cAAeL,EAAOG,UAAWF,EACtCF,SAAAA,GACL"}
1
+ {"version":3,"file":"TabPanel.cjs","sources":["../../../../src/components/tabs/TabPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabPanelProps } from \"./types.js\";\n\n/**\n * Konteiner for innhold i et tabbet brukergrensesnitt. Ikke funksjonell utenfor et Tabs element.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabPanel = ({ children, ...props }: TabPanelProps) => {\n const classes = clsx(\"jkl-tabpanel\", props.className);\n\n return (\n <div role=\"tabpanel\" {...props} className={classes}>\n {children}\n </div>\n );\n};\n"],"names":["children","props","classes","clsx","className","jsx","role"],"mappings":"+LASwB,EAAGA,SAAAA,KAAaC,MACpC,MAAMC,EAAUC,EAAAA,KAAK,eAAgBF,EAAMG,WAGvC,OAAAC,EAAAA,IAAC,OAAIC,KAAK,cAAeL,EAAOG,UAAWF,EACtCF,SAAAA,GACL"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../clsx-E3yX_9sL.cjs"),r=require("react"),s=require("../../hooks/usePreviousValue/usePreviousValue.cjs"),n=require("./tabsContext.cjs");let a=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce(((e,t)=>e+=(t&=63)<36?t.toString(36):t<62?(t-26).toString(36).toUpperCase():t>62?"-":"_"),"");exports.Tabs=({onChange:l,defaultTab:i,density:c,...o})=>{const[u,d]=r.useState(i??0),b=s.usePreviousValue(u);r.useEffect((()=>{void 0!==b&&b!==u&&l&&l(u)}),[l,b,u]);const[h,m]=r.useState([]),[x,j]=r.useState([]),p=r.useCallback((()=>{const e=r.Children.toArray(o.children)[0];r.isValidElement(e)&&r.Children.forEach(e.props.children,(e=>{r.isValidElement(e)&&(m((e=>[...e,`jkl-tab-${a(8)}`])),j((e=>[...e,`jkl-tabpanel-${a(8)}`])))}))}),[o.children]);return r.useEffect((()=>{p()}),[p]),e.jsx(n.TabsContextProvider,{state:{density:c},children:e.jsxs("div",{...o,className:t.clsx("jkl-tabs",o.className),"data-density":c,children:[(()=>{const e=r.Children.toArray(o.children)[0];if(r.isValidElement(e))return r.cloneElement(e,{activeIndex:u,setActiveIndex:d,tabIDs:h,tabPanelIDs:x})})(),r.Children.map(o.children,((e,t)=>{if(!r.isValidElement(e)||0===t)return;const s=t-1;return s===u?r.cloneElement(e,{"aria-labelledby":h[s],id:x[s]}):null}))]})})};
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../clsx-E3yX_9sL.cjs"),r=require("react"),s=require("../../hooks/usePreviousValue/usePreviousValue.cjs"),l=require("./tabsContext.cjs");let n=(e=21)=>{let t="",r=crypto.getRandomValues(new Uint8Array(e|=0));for(;e--;)t+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&r[e]];return t};exports.Tabs=({onChange:a,defaultTab:i,density:c,...u})=>{const[o,d]=r.useState(i??0),b=s.usePreviousValue(o);r.useEffect((()=>{void 0!==b&&b!==o&&a&&a(o)}),[a,b,o]);const[h,m]=r.useState([]),[x,f]=r.useState([]),j=r.useCallback((()=>{const e=r.Children.toArray(u.children)[0];r.isValidElement(e)&&r.Children.forEach(e.props.children,(e=>{r.isValidElement(e)&&(m((e=>[...e,`jkl-tab-${n(8)}`])),f((e=>[...e,`jkl-tabpanel-${n(8)}`])))}))}),[u.children]);return r.useEffect((()=>{j()}),[j]),e.jsx(l.TabsContextProvider,{state:{density:c},children:e.jsxs("div",{...u,className:t.clsx("jkl-tabs",u.className),"data-density":c,children:[(()=>{const e=r.Children.toArray(u.children)[0];if(r.isValidElement(e))return r.cloneElement(e,{activeIndex:o,setActiveIndex:d,tabIDs:h,tabPanelIDs:x})})(),r.Children.map(u.children,((e,t)=>{if(!r.isValidElement(e)||0===t)return;const s=t-1;return s===o?r.cloneElement(e,{"aria-labelledby":h[s],id:x[s]}):null}))]})})};
2
2
  //# sourceMappingURL=Tabs.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.cjs","sources":["../../../../../../node_modules/.pnpm/nanoid@3.3.8/node_modules/nanoid/index.browser.js","../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["// This file replaces `index.js` in bundlers like webpack or Rollup,\n// according to `browser` config in `package.json`.\n\nimport { urlAlphabet } from './url-alphabet/index.js'\n\nlet random = bytes => crypto.getRandomValues(new Uint8Array(bytes))\n\nlet customRandom = (alphabet, defaultSize, getRandom) => {\n // First, a bitmask is necessary to generate the ID. The bitmask makes bytes\n // values closer to the alphabet size. The bitmask calculates the closest\n // `2^31 - 1` number, which exceeds the alphabet size.\n // For example, the bitmask for the alphabet size 30 is 31 (00011111).\n // `Math.clz32` is not used, because it is not available in browsers.\n let mask = (2 << (Math.log(alphabet.length - 1) / Math.LN2)) - 1\n // Though, the bitmask solution is not perfect since the bytes exceeding\n // the alphabet size are refused. Therefore, to reliably generate the ID,\n // the random bytes redundancy has to be satisfied.\n\n // Note: every hardware random generator call is performance expensive,\n // because the system call for entropy collection takes a lot of time.\n // So, to avoid additional system calls, extra bytes are requested in advance.\n\n // Next, a step determines how many random bytes to generate.\n // The number of random bytes gets decided upon the ID size, mask,\n // alphabet size, and magic number 1.6 (using 1.6 peaks at performance\n // according to benchmarks).\n\n // `-~f => Math.ceil(f)` if f is a float\n // `-~i => i + 1` if i is an integer\n let step = -~((1.6 * mask * defaultSize) / alphabet.length)\n\n return (size = defaultSize) => {\n let id = ''\n while (true) {\n let bytes = getRandom(step)\n // A compact alternative for `for (var i = 0; i < step; i++)`.\n let j = step | 0\n while (j--) {\n // Adding `|| ''` refuses a random byte that exceeds the alphabet size.\n id += alphabet[bytes[j] & mask] || ''\n if (id.length === size) return id\n }\n }\n }\n}\n\nlet customAlphabet = (alphabet, size = 21) =>\n customRandom(alphabet, size, random)\n\nlet nanoid = (size = 21) =>\n crypto.getRandomValues(new Uint8Array(size)).reduce((id, byte) => {\n // It is incorrect to use bytes exceeding the alphabet size.\n // The following mask reduces the random byte in the 0-255 value\n // range to the 0-63 value range. Therefore, adding hacks, such\n // as empty string fallback or magic numbers, is unneccessary because\n // the bitmask trims bytes down to the alphabet size.\n byte &= 63\n if (byte < 36) {\n // `0-9a-z`\n id += byte.toString(36)\n } else if (byte < 62) {\n // `A-Z`\n id += (byte - 26).toString(36).toUpperCase()\n } else if (byte > 62) {\n id += '-'\n } else {\n id += '_'\n }\n return id\n }, '')\n\nexport { nanoid, customAlphabet, customRandom, urlAlphabet, random }\n","import clsx from \"clsx\";\nimport { nanoid } from \"nanoid\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport type { InjectedProps } from \"./TabList.js\";\nimport { TabsContextProvider } from \"./tabsContext.js\";\nimport type { TabListProps, TabPanelProps, TabsProps } from \"./types.js\";\n\n/**\n * Konteiner for et grensesnitt hvor man kan tabbe mellom innhold.\n * Må inneholde en TabList etterfulgt av en eller flere TabPanel.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tabs = ({\n onChange,\n defaultTab,\n density,\n ...props\n}: TabsProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultTab ?? 0);\n\n const previousTabIndex = usePreviousValue(activeIndex);\n\n useEffect(() => {\n if (\n previousTabIndex !== undefined &&\n previousTabIndex !== activeIndex &&\n onChange\n ) {\n onChange(activeIndex);\n }\n }, [onChange, previousTabIndex, activeIndex]);\n\n const [tabIDs, setTabIDs] = useState<string[]>([]);\n const [tabPanelIDs, setTabPanelIds] = useState<string[]>([]);\n\n const resolveIDs = useCallback(() => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement(tabList)) return;\n\n React.Children.forEach(tabList.props.children, (tab) => {\n if (!React.isValidElement(tab)) return;\n\n setTabIDs((prev) => [...prev, `jkl-tab-${nanoid(8)}`]);\n setTabPanelIds((prev) => [...prev, `jkl-tabpanel-${nanoid(8)}`]);\n });\n }, [props.children]);\n\n const renderTabList = () => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement<TabListProps & InjectedProps>(tabList))\n return;\n\n return React.cloneElement<TabListProps & InjectedProps>(tabList, {\n activeIndex,\n setActiveIndex,\n tabIDs,\n tabPanelIDs,\n });\n };\n\n const renderTabPanels = () => {\n return React.Children.map(props.children, (child, childIndex) => {\n if (\n !React.isValidElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child) ||\n childIndex === 0\n )\n return;\n\n const tabPanelIndex = childIndex - 1;\n\n return tabPanelIndex === activeIndex\n ? React.cloneElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child, {\n \"aria-labelledby\": tabIDs[tabPanelIndex],\n id: tabPanelIDs[tabPanelIndex],\n })\n : null;\n });\n };\n\n useEffect(() => {\n resolveIDs();\n }, [resolveIDs]);\n\n return (\n <TabsContextProvider state={{ density }}>\n <div\n {...props}\n className={clsx(\"jkl-tabs\", props.className)}\n data-density={density}\n >\n {renderTabList()}\n {renderTabPanels()}\n </div>\n </TabsContextProvider>\n );\n};\n"],"names":["nanoid","size","crypto","getRandomValues","Uint8Array","reduce","id","byte","toString","toUpperCase","onChange","defaultTab","density","props","activeIndex","setActiveIndex","useState","previousTabIndex","usePreviousValue","useEffect","tabIDs","setTabIDs","tabPanelIDs","setTabPanelIds","resolveIDs","useCallback","tabList","React","Children","toArray","children","isValidElement","forEach","tab","prev","jsx","TabsContextProvider","state","jsxs","className","clsx","cloneElement","renderTabList","map","child","childIndex","tabPanelIndex"],"mappings":"8QAiDA,IAAIA,EAAS,CAACC,EAAO,KACnBC,OAAOC,gBAAgB,IAAIC,WAAWH,IAAOI,QAAO,CAACC,EAAIC,IASrDD,IAHFC,GAAQ,IACG,GAEHA,EAAKC,SAAS,IACXD,EAAO,IAETA,EAAO,IAAIC,SAAS,IAAIC,cACtBF,EAAO,GACV,IAEA,KAGP,iBCvDe,EAChBG,SAAAA,EACAC,WAAAA,EACAC,QAAAA,KACGC,MAEH,MAAOC,EAAaC,GAAkBC,EAAAA,SAASL,GAAc,GAEvDM,EAAmBC,mBAAiBJ,GAE1CK,EAAAA,WAAU,UAEmB,IAArBF,GACAA,IAAqBH,GACrBJ,GAEAA,EAASI,EAAW,GAEzB,CAACJ,EAAUO,EAAkBH,IAEhC,MAAOM,EAAQC,GAAaL,EAAAA,SAAmB,KACxCM,EAAaC,GAAkBP,EAAAA,SAAmB,IAEnDQ,EAAaC,EAAAA,aAAY,KAC3B,MAAMC,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,EAAMI,eAAeL,IAE1BC,EAAMC,SAASI,QAAQN,EAAQb,MAAMiB,UAAWG,IACvCN,EAAMI,eAAeE,KAEhBZ,GAACa,GAAS,IAAIA,EAAM,WAAWlC,EAAO,QACjCuB,GAACW,GAAS,IAAIA,EAAM,gBAAgBlC,EAAO,QAAK,GAClE,GACF,CAACa,EAAMiB,WAuCVX,OAAAA,EAAAA,WAAU,KACKK,MACZ,CAACA,IAGCW,EAAAA,IAAAC,EAAAA,oBAAA,CAAoBC,MAAO,CAAEzB,QAAAA,GAC1BkB,SAAAQ,EAAAA,KAAC,MAAA,IACOzB,EACJ0B,UAAWC,EAAAA,KAAK,WAAY3B,EAAM0B,WAClC,eAAc3B,EAEbkB,SAAA,CAhDS,MAClB,MAAMJ,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAEnD,GAACH,EAAMI,eAA6CL,GAGjD,OAAAC,EAAMc,aAA2Cf,EAAS,CAC7DZ,YAAAA,EACAC,eAAAA,EACAK,OAAAA,EACAE,YAAAA,GACH,EAqCsBoB,GAjChBf,EAAMC,SAASe,IAAI9B,EAAMiB,UAAU,CAACc,EAAOC,KAC9C,IACKlB,EAAMI,eAELa,IACa,IAAfC,EAEA,OAEJ,MAAMC,EAAgBD,EAAa,EAEnC,OAAOC,IAAkBhC,EACnBa,EAAMc,aAEJG,EAAO,CACL,kBAAmBxB,EAAO0B,GAC1BxC,GAAIgB,EAAYwB,KAEpB,YAkBV","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"Tabs.cjs","sources":["../../../../../../node_modules/.pnpm/nanoid@5.1.5/node_modules/nanoid/index.browser.js","../../../../../../node_modules/.pnpm/nanoid@5.1.5/node_modules/nanoid/url-alphabet/index.js","../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["/* @ts-self-types=\"./index.d.ts\" */\nimport { urlAlphabet as scopedUrlAlphabet } from './url-alphabet/index.js'\nexport { urlAlphabet } from './url-alphabet/index.js'\nexport let random = bytes => crypto.getRandomValues(new Uint8Array(bytes))\nexport let customRandom = (alphabet, defaultSize, getRandom) => {\n let mask = (2 << Math.log2(alphabet.length - 1)) - 1\n let step = -~((1.6 * mask * defaultSize) / alphabet.length)\n return (size = defaultSize) => {\n let id = ''\n while (true) {\n let bytes = getRandom(step)\n let j = step | 0\n while (j--) {\n id += alphabet[bytes[j] & mask] || ''\n if (id.length >= size) return id\n }\n }\n }\n}\nexport let customAlphabet = (alphabet, size = 21) =>\n customRandom(alphabet, size | 0, random)\nexport let nanoid = (size = 21) => {\n let id = ''\n let bytes = crypto.getRandomValues(new Uint8Array((size |= 0)))\n while (size--) {\n id += scopedUrlAlphabet[bytes[size] & 63]\n }\n return id\n}\n","export const urlAlphabet =\n 'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict'\n","import clsx from \"clsx\";\nimport { nanoid } from \"nanoid\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport type { InjectedProps } from \"./TabList.js\";\nimport { TabsContextProvider } from \"./tabsContext.js\";\nimport type { TabListProps, TabPanelProps, TabsProps } from \"./types.js\";\n\n/**\n * Konteiner for et grensesnitt hvor man kan tabbe mellom innhold.\n * Må inneholde en TabList etterfulgt av en eller flere TabPanel.\n *\n * Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tabs = ({\n onChange,\n defaultTab,\n density,\n ...props\n}: TabsProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultTab ?? 0);\n\n const previousTabIndex = usePreviousValue(activeIndex);\n\n useEffect(() => {\n if (\n previousTabIndex !== undefined &&\n previousTabIndex !== activeIndex &&\n onChange\n ) {\n onChange(activeIndex);\n }\n }, [onChange, previousTabIndex, activeIndex]);\n\n const [tabIDs, setTabIDs] = useState<string[]>([]);\n const [tabPanelIDs, setTabPanelIds] = useState<string[]>([]);\n\n const resolveIDs = useCallback(() => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement(tabList)) return;\n\n React.Children.forEach(tabList.props.children, (tab) => {\n if (!React.isValidElement(tab)) return;\n\n setTabIDs((prev) => [...prev, `jkl-tab-${nanoid(8)}`]);\n setTabPanelIds((prev) => [...prev, `jkl-tabpanel-${nanoid(8)}`]);\n });\n }, [props.children]);\n\n const renderTabList = () => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement<TabListProps & InjectedProps>(tabList))\n return;\n\n return React.cloneElement<TabListProps & InjectedProps>(tabList, {\n activeIndex,\n setActiveIndex,\n tabIDs,\n tabPanelIDs,\n });\n };\n\n const renderTabPanels = () => {\n return React.Children.map(props.children, (child, childIndex) => {\n if (\n !React.isValidElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child) ||\n childIndex === 0\n )\n return;\n\n const tabPanelIndex = childIndex - 1;\n\n return tabPanelIndex === activeIndex\n ? React.cloneElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child, {\n \"aria-labelledby\": tabIDs[tabPanelIndex],\n id: tabPanelIDs[tabPanelIndex],\n })\n : null;\n });\n };\n\n useEffect(() => {\n resolveIDs();\n }, [resolveIDs]);\n\n return (\n <TabsContextProvider state={{ density }}>\n <div\n {...props}\n className={clsx(\"jkl-tabs\", props.className)}\n data-density={density}\n >\n {renderTabList()}\n {renderTabPanels()}\n </div>\n </TabsContextProvider>\n );\n};\n"],"names":["nanoid","size","id","bytes","crypto","getRandomValues","Uint8Array","onChange","defaultTab","density","props","activeIndex","setActiveIndex","useState","previousTabIndex","usePreviousValue","useEffect","tabIDs","setTabIDs","tabPanelIDs","setTabPanelIds","resolveIDs","useCallback","tabList","React","Children","toArray","children","isValidElement","forEach","tab","prev","jsx","TabsContextProvider","state","jsxs","className","clsx","cloneElement","renderTabList","map","child","childIndex","tabPanelIndex"],"mappings":"8QAqBO,IAAIA,EAAS,CAACC,EAAO,MAC1B,IAAIC,EAAK,GACLC,EAAQC,OAAOC,gBAAgB,IAAIC,WAAYL,GAAQ,IAC3D,KAAOA,KACLC,GCxBF,mEDwBwC,GAAdC,EAAMF,IAEhC,OAAOC,gBEbW,EAChBK,SAAAA,EACAC,WAAAA,EACAC,QAAAA,KACGC,MAEH,MAAOC,EAAaC,GAAkBC,EAAAA,SAASL,GAAc,GAEvDM,EAAmBC,mBAAiBJ,GAE1CK,EAAAA,WAAU,UAEmB,IAArBF,GACAA,IAAqBH,GACrBJ,GAEAA,EAASI,EAAW,GAEzB,CAACJ,EAAUO,EAAkBH,IAEhC,MAAOM,EAAQC,GAAaL,EAAAA,SAAmB,KACxCM,EAAaC,GAAkBP,EAAAA,SAAmB,IAEnDQ,EAAaC,EAAAA,aAAY,KAC3B,MAAMC,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,EAAMI,eAAeL,IAE1BC,EAAMC,SAASI,QAAQN,EAAQb,MAAMiB,UAAWG,IACvCN,EAAMI,eAAeE,KAEhBZ,GAACa,GAAS,IAAIA,EAAM,WAAW/B,EAAO,QACjCoB,GAACW,GAAS,IAAIA,EAAM,gBAAgB/B,EAAO,QAAK,GAClE,GACF,CAACU,EAAMiB,WAuCVX,OAAAA,EAAAA,WAAU,KACKK,GAAA,GACZ,CAACA,IAGCW,EAAAA,IAAAC,EAAAA,oBAAA,CAAoBC,MAAO,CAAEzB,QAAAA,GAC1BkB,SAAAQ,EAAAA,KAAC,MAAA,IACOzB,EACJ0B,UAAWC,EAAAA,KAAK,WAAY3B,EAAM0B,WAClC,eAAc3B,EAEbkB,SAAA,CAhDS,MAClB,MAAMJ,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAEnD,GAACH,EAAMI,eAA6CL,GAGjD,OAAAC,EAAMc,aAA2Cf,EAAS,CAC7DZ,YAAAA,EACAC,eAAAA,EACAK,OAAAA,EACAE,YAAAA,GACH,EAqCsBoB,GAjChBf,EAAMC,SAASe,IAAI9B,EAAMiB,UAAU,CAACc,EAAOC,KAC9C,IACKlB,EAAMI,eAELa,IACa,IAAfC,EAEA,OAEJ,MAAMC,EAAgBD,EAAa,EAEnC,OAAOC,IAAkBhC,EACnBa,EAAMc,aAEJG,EAAO,CACL,kBAAmBxB,EAAO0B,GAC1BzC,GAAIiB,EAAYwB,KAEpB,YAkBV","x_google_ignoreList":[0,1]}
@@ -1 +1 @@
1
- {"version":3,"file":"NavTabs.stories.cjs","sources":["../../../../../src/components/tabs/stories/NavTabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { NavTab } from \"../NavTab.js\";\nimport { NavTabs as Tabs } from \"../NavTabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/NavTabs\",\n component: Tabs,\n subcomponents: {\n NavTab,\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"NavTabs\",\n args: {\n children: <p>e</p>,\n },\n render: (args) => (\n <Tabs {...args}>\n <NavTab aria-selected={true}>Alle</NavTab>\n <NavTab aria-selected={false}>NICE</NavTab>\n <NavTab aria-selected={false}>Prolife</NavTab>\n </Tabs>\n ),\n};\n"],"names":["meta","title","component","Tabs","NavTabs","subcomponents","NavTab","tags","TabsStory","name","args","children","jsx","render","jsxs"],"mappings":"0QAMMA,EAAO,CACTC,MAAO,2BACPC,UAAWC,EAAAC,QACXC,cAAe,CAAAC,OACXA,EAAAA,QAEJC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,UACNC,KAAM,CACFC,SAAWC,EAAAA,IAAA,IAAA,CAAED,SAAC,OAElBE,OAASH,GACJI,EAAAA,KAAAX,EAAAC,QAAA,IAASM,EACNC,SAAA,CAACC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAMK,SAAI,SAChCC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAOK,SAAI,SACjCC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAOK,SAAO"}
1
+ {"version":3,"file":"NavTabs.stories.cjs","sources":["../../../../../src/components/tabs/stories/NavTabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { NavTab } from \"../NavTab.js\";\nimport { NavTabs as Tabs } from \"../NavTabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/NavTabs\",\n component: Tabs,\n subcomponents: {\n NavTab,\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"NavTabs\",\n args: {\n children: <p>e</p>,\n },\n render: (args) => (\n <Tabs {...args}>\n <NavTab aria-selected={true}>Alle</NavTab>\n <NavTab aria-selected={false}>NICE</NavTab>\n <NavTab aria-selected={false}>Prolife</NavTab>\n </Tabs>\n ),\n};\n"],"names":["meta","title","component","Tabs","NavTabs","subcomponents","NavTab","tags","TabsStory","name","args","children","jsx","render","jsxs"],"mappings":"0QAMMA,EAAO,CACTC,MAAO,2BACPC,UAAWC,EAAAC,QACXC,cAAe,CACXC,OAAAA,EAAAA,QAEJC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,UACNC,KAAM,CACFC,SAAWC,EAAAA,IAAA,IAAA,CAAED,SAAC,OAElBE,OAASH,GACJI,EAAAA,KAAAX,EAAAC,QAAA,IAASM,EACNC,SAAA,CAACC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAMK,SAAI,SAChCC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAOK,SAAI,SACjCC,EAAAA,IAAAN,EAAAA,OAAA,CAAO,iBAAe,EAAOK,SAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.stories.cjs","sources":["../../../../../src/components/tabs/stories/Tabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { Tab } from \"../Tab.js\";\nimport { TabList } from \"../TabList.js\";\nimport { TabPanel } from \"../TabPanel.js\";\nimport { Tabs } from \"../Tabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/Tabs\",\n component: Tabs,\n subcomponents: {\n TabList,\n TabPanel,\n Tab,\n },\n argTypes: {\n defaultTab: {\n control: \"number\",\n table: {\n defaultValue: {\n summary: undefined,\n },\n },\n },\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"Tabs\",\n args: {\n children: <p />,\n },\n render: (args) => (\n <div style={{ maxWidth: \"300px\" }}>\n <Tabs {...args}>\n <TabList aria-label=\"Avtale-filter\">\n <Tab>Alle avtaler</Tab>\n <Tab>NICE</Tab>\n <Tab>Prolife</Tab>\n <Tab>Paris</Tab>\n </TabList>\n\n <TabPanel>Alle avtaler</TabPanel>\n\n <TabPanel>NICE-avtaler</TabPanel>\n\n <TabPanel>Prolife-avtaler</TabPanel>\n\n <TabPanel>Paris-avtaler</TabPanel>\n </Tabs>\n </div>\n ),\n};\n"],"names":["meta","title","component","Tabs","subcomponents","TabList","TabPanel","Tab","argTypes","defaultTab","control","table","defaultValue","summary","tags","TabsStory","name","args","children","render","jsx","style","maxWidth","jsxs"],"mappings":"6TAQMA,EAAO,CACTC,MAAO,wBACPC,UAAWC,EAAAA,KACXC,cAAe,CAAAC,QACXA,EAAAA,QAAAC,SACAA,EAAAA,SAAAC,IACAA,EAAAA,KAEJC,SAAU,CACNC,WAAY,CACRC,QAAS,SACTC,MAAO,CACHC,aAAc,CACVC,aAAS,MAKzBC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,OACNC,KAAM,CACFC,eAAW,IAAE,KAEjBC,OAASF,GACLG,EAAAA,IAAC,MAAI,CAAAC,MAAO,CAAEC,SAAU,SACpBJ,SAACK,EAAAA,KAAApB,EAAAA,KAAA,IAASc,EACNC,SAAA,CAACK,EAAAA,KAAAlB,EAAAA,QAAA,CAAQ,aAAW,gBAChBa,SAAA,CAAAE,EAAAA,IAACb,OAAIW,SAAY,iBACjBE,EAAAA,IAACb,OAAIW,SAAI,SACTE,EAAAA,IAACb,OAAIW,SAAO,YACZE,EAAAA,IAACb,OAAIW,SAAK,aAGdE,EAAAA,IAACd,YAASY,SAAY,iBAEtBE,EAAAA,IAACd,YAASY,SAAY,iBAEtBE,EAAAA,IAACd,YAASY,SAAe,oBAEzBE,EAAAA,IAACd,YAASY,SAAa"}
1
+ {"version":3,"file":"Tabs.stories.cjs","sources":["../../../../../src/components/tabs/stories/Tabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { Tab } from \"../Tab.js\";\nimport { TabList } from \"../TabList.js\";\nimport { TabPanel } from \"../TabPanel.js\";\nimport { Tabs } from \"../Tabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/Tabs\",\n component: Tabs,\n subcomponents: {\n TabList,\n TabPanel,\n Tab,\n },\n argTypes: {\n defaultTab: {\n control: \"number\",\n table: {\n defaultValue: {\n summary: undefined,\n },\n },\n },\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"Tabs\",\n args: {\n children: <p />,\n },\n render: (args) => (\n <div style={{ maxWidth: \"300px\" }}>\n <Tabs {...args}>\n <TabList aria-label=\"Avtale-filter\">\n <Tab>Alle avtaler</Tab>\n <Tab>NICE</Tab>\n <Tab>Prolife</Tab>\n <Tab>Paris</Tab>\n </TabList>\n\n <TabPanel>Alle avtaler</TabPanel>\n\n <TabPanel>NICE-avtaler</TabPanel>\n\n <TabPanel>Prolife-avtaler</TabPanel>\n\n <TabPanel>Paris-avtaler</TabPanel>\n </Tabs>\n </div>\n ),\n};\n"],"names":["meta","title","component","Tabs","subcomponents","TabList","TabPanel","Tab","argTypes","defaultTab","control","table","defaultValue","summary","tags","TabsStory","name","args","children","render","jsx","style","maxWidth","jsxs"],"mappings":"6TAQMA,EAAO,CACTC,MAAO,wBACPC,UAAWC,EAAAA,KACXC,cAAe,CAAAC,QACXA,EAAAA,QAAAC,SACAA,EAAAA,SACAC,IAAAA,EAAAA,KAEJC,SAAU,CACNC,WAAY,CACRC,QAAS,SACTC,MAAO,CACHC,aAAc,CACVC,aAAS,MAKzBC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,OACNC,KAAM,CACFC,eAAW,IAAE,CAAA,IAEjBC,OAASF,GACLG,EAAAA,IAAC,MAAI,CAAAC,MAAO,CAAEC,SAAU,SACpBJ,SAACK,EAAAA,KAAApB,EAAAA,KAAA,IAASc,EACNC,SAAA,CAACK,EAAAA,KAAAlB,EAAAA,QAAA,CAAQ,aAAW,gBAChBa,SAAA,CAAAE,EAAAA,IAACb,OAAIW,SAAY,iBACjBE,EAAAA,IAACb,OAAIW,SAAI,SACTE,EAAAA,IAACb,OAAIW,SAAO,YACZE,EAAAA,IAACb,OAAIW,SAAK,aAGdE,EAAAA,IAACd,YAASY,SAAY,iBAEtBE,EAAAA,IAACd,YAASY,SAAY,iBAEtBE,EAAAA,IAACd,YAASY,SAAe,oBAEzBE,EAAAA,IAACd,YAASY,SAAa"}
@@ -1 +1 @@
1
- {"version":3,"file":"BaseTextArea.cjs","sources":["../../../../src/components/text-area/BaseTextArea.tsx"],"sourcesContent":["import React, {\n type ChangeEvent,\n type FocusEvent,\n forwardRef,\n type RefObject,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { BaseTextAreaProps } from \"./types.js\";\n\nexport const BaseTextArea = forwardRef<HTMLTextAreaElement, BaseTextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n counter,\n onBlur,\n onFocus,\n rows = 7,\n placeholder = \" \", // This space intentionally left blank. Denne + rows trengs for å få den ekspanderende effekten.\n startOpen,\n style,\n value,\n \"aria-invalid\": ariaInvalid,\n onChange,\n ...rest\n } = props;\n\n const [counterCurrent, setCounterCurrent] = useState(() => {\n if (typeof value === \"undefined\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return String(value).length;\n }\n\n return value.length;\n });\n const [textAreaFocused, setTextAreaFocused] = useState(false);\n const internalRef = useRef<HTMLTextAreaElement>(null);\n const textAreaRef =\n (ref as RefObject<HTMLTextAreaElement>) || internalRef;\n\n useEffect(() => {\n const textAreaElement = textAreaRef.current;\n if (textAreaElement) {\n if (!autoExpand) {\n textAreaElement.style.height = \"\";\n return;\n }\n\n if (textAreaFocused || value) {\n textAreaElement.style.height = \"auto\"; // Sett til auto før scrollhøyden leses, sånn at redusering av høyde ved sletting av tekst fungerer\n textAreaElement.style.height = `${textAreaElement.scrollHeight}px`;\n } else {\n textAreaElement.style.height = \"\";\n }\n }\n }, [autoExpand, textAreaRef, value, textAreaFocused]);\n\n function handleOnFocus(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(true);\n if (onFocus) {\n onFocus(e);\n }\n }\n\n function handleOnBlur(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(false);\n if (onBlur) {\n onBlur(e);\n }\n }\n\n function handleOnChange(e: ChangeEvent<HTMLTextAreaElement>) {\n setCounterCurrent(e.target.value.length);\n if (onChange) {\n onChange(e);\n }\n }\n\n const counterTotal: number = counter?.maxLength || 0;\n const progressCurrent: number = counterTotal - counterCurrent;\n function calculatePercentage(current: number, total: number): number {\n if (current <= 0) {\n return 0;\n }\n return total === 0 ? 0 : (current * 100) / total;\n }\n const counterLabel =\n counter && counterCurrent > counterTotal\n ? `Du har skrevet ${counterCurrent - counterTotal} tegn for mye`\n : undefined;\n\n const invalid = Boolean(ariaInvalid || counterLabel);\n\n const overflowStyle = {\n overflowX: autoExpand ? \"hidden\" : undefined, // Must set overflowX hidden for Firefox https://stackoverflow.com/a/22700700\n } as React.CSSProperties;\n\n return (\n <div\n className=\"jkl-text-area-wrapper\"\n data-invalid={invalid}\n data-has-content={counterCurrent > 0}\n >\n <textarea\n aria-invalid={invalid}\n className={`jkl-text-area__text-area jkl-text-area__text-area--${rows}-rows`}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onChange={handleOnChange}\n ref={textAreaRef}\n style={{ ...style, ...overflowStyle }}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n {counter && (\n <div className=\"jkl-text-area__counter\" aria-hidden=\"true\">\n <div className=\"jkl-text-area__counter-count\">\n {counterCurrent}&nbsp;/&nbsp;{counterTotal}\n </div>\n {!counter.hideProgress && (\n <div\n className=\"jkl-text-area__counter-progress\"\n style={{\n [\"--progress-width\" as string]: `${calculatePercentage(\n progressCurrent,\n counterTotal,\n )}%`,\n }}\n />\n )}\n </div>\n )}\n </div>\n );\n },\n);\nBaseTextArea.displayName = \"BaseTextArea\";\n"],"names":["BaseTextArea","forwardRef","props","ref","autoExpand","counter","onBlur","onFocus","rows","placeholder","startOpen","style","value","ariaInvalid","onChange","rest","counterCurrent","setCounterCurrent","useState","String","length","textAreaFocused","setTextAreaFocused","internalRef","useRef","textAreaRef","useEffect","textAreaElement","current","height","scrollHeight","counterTotal","maxLength","progressCurrent","invalid","overflowStyle","overflowX","jsxs","className","children","jsx","e","target","hideProgress","total","displayName"],"mappings":"wIAWaA,EAAeC,EAAAA,YACxB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EAAO,EACPC,YAAAA,EAAc,IACdC,UAAAA,EACAC,MAAAA,EACAC,MAAAA,EACA,eAAgBC,EAChBC,SAAAA,KACGC,GACHb,GAEGc,EAAgBC,GAAqBC,YAAS,WACtCN,EAAU,IACV,EAGU,iBAAVA,EACAO,OAAOP,GAAOQ,OAGlBR,EAAMQ,UAEVC,EAAiBC,GAAsBJ,YAAS,GACjDK,EAAcC,SAA4B,MAC1CC,EACDtB,GAA0CoB,EAE/CG,EAAAA,WAAU,KACN,MAAMC,EAAkBF,EAAYG,QACpC,GAAID,EAAiB,CACjB,IAAKvB,EAED,YADAuB,EAAgBhB,MAAMkB,OAAS,IAI/BR,GAAmBT,GACnBe,EAAgBhB,MAAMkB,OAAS,OAC/BF,EAAgBhB,MAAMkB,OAAS,GAAGF,EAAgBG,kBAElDH,EAAgBhB,MAAMkB,OAAS,EAEvC,IACD,CAACzB,EAAYqB,EAAab,EAAOS,IAuB9B,MAAAU,GAAuB,MAAA1B,SAAAA,EAAS2B,YAAa,EAC7CC,EAA0BF,EAAef,EAO/C,MAKMkB,KAAkBrB,KAJpBR,GAAWW,EAAiBe,EACtB,kBAAkBf,EAAiBe,sBACnC,IAIJI,EAAgB,CAClBC,UAAWhC,EAAa,cAAW,GAInC,OAAAiC,EAAAA,KAAC,MAAA,CACGC,UAAU,wBACV,eAAcJ,EACd,mBAAkBlB,EAAiB,EAEnCuB,SAAA,CAAAC,EAAAA,IAAC,WAAA,CACG,eAAcN,EACdI,UAAW,sDAAsD9B,SACjEF,OA1CZ,SAAsBmC,GAClBnB,GAAmB,GACfhB,GACAA,EAAOmC,EAEf,EAsCYlC,QAlDZ,SAAuBkC,GACnBnB,GAAmB,GACff,GACAA,EAAQkC,EAEhB,EA8CY3B,SArCZ,SAAwB2B,GACFxB,EAAAwB,EAAEC,OAAO9B,MAAMQ,QAC7BN,GACAA,EAAS2B,EAEjB,EAiCYtC,IAAKsB,EACLd,MAAO,IAAKA,KAAUwB,GACtB1B,YAAAA,EACAG,MAAAA,KACIG,IAEPV,GACIgC,EAAAA,KAAA,MAAA,CAAIC,UAAU,yBAAyB,cAAY,OAChDC,SAAA,CAACF,EAAAA,KAAA,MAAA,CAAIC,UAAU,+BACVC,SAAA,CAAAvB,EAAe,MAAce,MAEhC1B,EAAQsC,cACNH,EAAAA,IAAC,MAAA,CACGF,UAAU,kCACV3B,MAAO,CACF,oBA5CAiB,EA6CGK,EA7CcW,EA8Cdb,EA7CxBH,GAAW,GAGE,IAAVgB,EAFI,EAEyB,IAAVhB,EAAiBgB,GAwCa,aA5CnD,IAAoBhB,EAAiBgB,CAmDlC,IAMpB5C,EAAa6C,YAAc"}
1
+ {"version":3,"file":"BaseTextArea.cjs","sources":["../../../../src/components/text-area/BaseTextArea.tsx"],"sourcesContent":["import React, {\n type ChangeEvent,\n type FocusEvent,\n forwardRef,\n type RefObject,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { BaseTextAreaProps } from \"./types.js\";\n\nexport const BaseTextArea = forwardRef<HTMLTextAreaElement, BaseTextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n counter,\n onBlur,\n onFocus,\n rows = 7,\n placeholder = \" \", // This space intentionally left blank. Denne + rows trengs for å få den ekspanderende effekten.\n startOpen,\n style,\n value,\n \"aria-invalid\": ariaInvalid,\n onChange,\n ...rest\n } = props;\n\n const [counterCurrent, setCounterCurrent] = useState(() => {\n if (typeof value === \"undefined\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return String(value).length;\n }\n\n return value.length;\n });\n const [textAreaFocused, setTextAreaFocused] = useState(false);\n const internalRef = useRef<HTMLTextAreaElement>(null);\n const textAreaRef =\n (ref as RefObject<HTMLTextAreaElement>) || internalRef;\n\n useEffect(() => {\n const textAreaElement = textAreaRef.current;\n if (textAreaElement) {\n if (!autoExpand) {\n textAreaElement.style.height = \"\";\n return;\n }\n\n if (textAreaFocused || value) {\n textAreaElement.style.height = \"auto\"; // Sett til auto før scrollhøyden leses, sånn at redusering av høyde ved sletting av tekst fungerer\n textAreaElement.style.height = `${textAreaElement.scrollHeight}px`;\n } else {\n textAreaElement.style.height = \"\";\n }\n }\n }, [autoExpand, textAreaRef, value, textAreaFocused]);\n\n function handleOnFocus(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(true);\n if (onFocus) {\n onFocus(e);\n }\n }\n\n function handleOnBlur(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(false);\n if (onBlur) {\n onBlur(e);\n }\n }\n\n function handleOnChange(e: ChangeEvent<HTMLTextAreaElement>) {\n setCounterCurrent(e.target.value.length);\n if (onChange) {\n onChange(e);\n }\n }\n\n const counterTotal: number = counter?.maxLength || 0;\n const progressCurrent: number = counterTotal - counterCurrent;\n function calculatePercentage(current: number, total: number): number {\n if (current <= 0) {\n return 0;\n }\n return total === 0 ? 0 : (current * 100) / total;\n }\n const counterLabel =\n counter && counterCurrent > counterTotal\n ? `Du har skrevet ${counterCurrent - counterTotal} tegn for mye`\n : undefined;\n\n const invalid = Boolean(ariaInvalid || counterLabel);\n\n const overflowStyle = {\n overflowX: autoExpand ? \"hidden\" : undefined, // Must set overflowX hidden for Firefox https://stackoverflow.com/a/22700700\n } as React.CSSProperties;\n\n return (\n <div\n className=\"jkl-text-area-wrapper\"\n data-invalid={invalid}\n data-has-content={counterCurrent > 0}\n >\n <textarea\n aria-invalid={invalid}\n className={`jkl-text-area__text-area jkl-text-area__text-area--${rows}-rows`}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onChange={handleOnChange}\n ref={textAreaRef}\n style={{ ...style, ...overflowStyle }}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n {counter && (\n <div className=\"jkl-text-area__counter\" aria-hidden=\"true\">\n <div className=\"jkl-text-area__counter-count\">\n {counterCurrent}&nbsp;/&nbsp;{counterTotal}\n </div>\n {!counter.hideProgress && (\n <div\n className=\"jkl-text-area__counter-progress\"\n style={{\n [\"--progress-width\" as string]: `${calculatePercentage(\n progressCurrent,\n counterTotal,\n )}%`,\n }}\n />\n )}\n </div>\n )}\n </div>\n );\n },\n);\nBaseTextArea.displayName = \"BaseTextArea\";\n"],"names":["BaseTextArea","forwardRef","props","ref","autoExpand","counter","onBlur","onFocus","rows","placeholder","startOpen","style","value","ariaInvalid","onChange","rest","counterCurrent","setCounterCurrent","useState","String","length","textAreaFocused","setTextAreaFocused","internalRef","useRef","textAreaRef","useEffect","textAreaElement","current","height","scrollHeight","counterTotal","maxLength","progressCurrent","invalid","overflowStyle","overflowX","jsxs","className","children","jsx","e","target","hideProgress","total","displayName"],"mappings":"wIAWaA,EAAeC,EAAAA,YACxB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EAAO,EACPC,YAAAA,EAAc,IACdC,UAAAA,EACAC,MAAAA,EACAC,MAAAA,EACA,eAAgBC,EAChBC,SAAAA,KACGC,GACHb,GAEGc,EAAgBC,GAAqBC,YAAS,WACtCN,EAAU,IACV,EAGU,iBAAVA,EACAO,OAAOP,GAAOQ,OAGlBR,EAAMQ,UAEVC,EAAiBC,GAAsBJ,EAAAA,UAAS,GACjDK,EAAcC,SAA4B,MAC1CC,EACDtB,GAA0CoB,EAE/CG,EAAAA,WAAU,KACN,MAAMC,EAAkBF,EAAYG,QACpC,GAAID,EAAiB,CACjB,IAAKvB,EAED,YADAuB,EAAgBhB,MAAMkB,OAAS,IAI/BR,GAAmBT,GACnBe,EAAgBhB,MAAMkB,OAAS,OAC/BF,EAAgBhB,MAAMkB,OAAS,GAAGF,EAAgBG,kBAElDH,EAAgBhB,MAAMkB,OAAS,EACnC,IAEL,CAACzB,EAAYqB,EAAab,EAAOS,IAuB9B,MAAAU,GAAuB,MAAA1B,SAAAA,EAAS2B,YAAa,EAC7CC,EAA0BF,EAAef,EAO/C,MAKMkB,KAAkBrB,KAJpBR,GAAWW,EAAiBe,EACtB,kBAAkBf,EAAiBe,sBACnC,IAIJI,EAAgB,CAClBC,UAAWhC,EAAa,cAAW,GAInC,OAAAiC,EAAAA,KAAC,MAAA,CACGC,UAAU,wBACV,eAAcJ,EACd,mBAAkBlB,EAAiB,EAEnCuB,SAAA,CAAAC,EAAAA,IAAC,WAAA,CACG,eAAcN,EACdI,UAAW,sDAAsD9B,SACjEF,OA1CZ,SAAsBmC,GAClBnB,GAAmB,GACfhB,GACAA,EAAOmC,EACX,EAuCQlC,QAlDZ,SAAuBkC,GACnBnB,GAAmB,GACff,GACAA,EAAQkC,EACZ,EA+CQ3B,SArCZ,SAAwB2B,GACFxB,EAAAwB,EAAEC,OAAO9B,MAAMQ,QAC7BN,GACAA,EAAS2B,EACb,EAkCQtC,IAAKsB,EACLd,MAAO,IAAKA,KAAUwB,GACtB1B,YAAAA,EACAG,MAAAA,KACIG,IAEPV,GACIgC,EAAAA,KAAA,MAAA,CAAIC,UAAU,yBAAyB,cAAY,OAChDC,SAAA,CAACF,EAAAA,KAAA,MAAA,CAAIC,UAAU,+BACVC,SAAA,CAAAvB,EAAe,MAAce,MAEhC1B,EAAQsC,cACNH,EAAAA,IAAC,MAAA,CACGF,UAAU,kCACV3B,MAAO,CACF,oBA5CAiB,EA6CGK,EA7CcW,EA8Cdb,EA7CxBH,GAAW,GAGE,IAAVgB,EAFI,EAEyB,IAAVhB,EAAiBgB,GAwCa,aA5CnD,IAAoBhB,EAAiBgB,CAqD1C,IAIZ5C,EAAa6C,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextArea } from \"./BaseTextArea.js\";\nimport type { TextAreaProps } from \"./types.js\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n className,\n counter,\n density,\n errorLabel,\n helpLabel,\n inline,\n label,\n labelProps,\n startOpen,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n const textAreaProps = { autoExpand, counter, startOpen };\n return (\n <InputGroup\n className={clsx(\"jkl-text-area\", className, {\n \"jkl-text-area--start-open\": startOpen,\n \"jkl-text-area--auto-expand\": autoExpand,\n })}\n data-testid=\"jkl-text-area\"\n {...inputGroupProps}\n >\n <BaseTextArea ref={ref} {...rest} {...textAreaProps} />\n </InputGroup>\n );\n },\n);\nTextArea.displayName = \"TextArea\";\n"],"names":["TextArea","forwardRef","props","ref","autoExpand","className","counter","density","errorLabel","helpLabel","inline","label","labelProps","startOpen","supportLabelProps","tooltip","rest","inputGroupProps","textAreaProps","jsx","InputGroup","clsx","children","BaseTextArea","displayName"],"mappings":"2PAMaA,EAAWC,EAAAA,YACpB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHd,EACEe,EAAkB,CACpBN,MAAAA,EACAJ,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAI,kBAAAA,EACAC,QAAAA,GAEEG,EAAgB,CAAEd,WAAAA,EAAYE,QAAAA,EAASO,UAAAA,GAEzC,OAAAM,EAAAA,IAACC,EAAAA,WAAA,CACGf,UAAWgB,EAAAA,KAAK,gBAAiBhB,EAAW,CACxC,4BAA6BQ,EAC7B,6BAA8BT,IAElC,cAAY,mBACRa,EAEJK,eAACC,eAAa,CAAApB,IAAAA,KAAca,KAAUE,KAAe,IAKrElB,EAASwB,YAAc"}
1
+ {"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextArea } from \"./BaseTextArea.js\";\nimport type { TextAreaProps } from \"./types.js\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n className,\n counter,\n density,\n errorLabel,\n helpLabel,\n inline,\n label,\n labelProps,\n startOpen,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n const textAreaProps = { autoExpand, counter, startOpen };\n return (\n <InputGroup\n className={clsx(\"jkl-text-area\", className, {\n \"jkl-text-area--start-open\": startOpen,\n \"jkl-text-area--auto-expand\": autoExpand,\n })}\n data-testid=\"jkl-text-area\"\n {...inputGroupProps}\n >\n <BaseTextArea ref={ref} {...rest} {...textAreaProps} />\n </InputGroup>\n );\n },\n);\nTextArea.displayName = \"TextArea\";\n"],"names":["TextArea","forwardRef","props","ref","autoExpand","className","counter","density","errorLabel","helpLabel","inline","label","labelProps","startOpen","supportLabelProps","tooltip","rest","inputGroupProps","textAreaProps","jsx","InputGroup","clsx","children","BaseTextArea","displayName"],"mappings":"2PAMaA,EAAWC,EAAAA,YACpB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHd,EACEe,EAAkB,CACpBN,MAAAA,EACAJ,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAI,kBAAAA,EACAC,QAAAA,GAEEG,EAAgB,CAAEd,WAAAA,EAAYE,QAAAA,EAASO,UAAAA,GAEzC,OAAAM,EAAAA,IAACC,EAAAA,WAAA,CACGf,UAAWgB,EAAAA,KAAK,gBAAiBhB,EAAW,CACxC,4BAA6BQ,EAC7B,6BAA8BT,IAElC,cAAY,mBACRa,EAEJK,eAACC,eAAa,CAAApB,IAAAA,KAAca,KAAUE,KAC1C,IAIZlB,EAASwB,YAAc"}