@navikt/ds-react 5.12.5 → 5.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (518) hide show
  1. package/_docs.json +79 -3
  2. package/cjs/accordion/Accordion.js +2 -2
  3. package/cjs/accordion/AccordionHeader.js +1 -1
  4. package/cjs/accordion/AccordionItem.js +11 -14
  5. package/cjs/alert/Alert.js +2 -2
  6. package/cjs/chat/Bubble.js +1 -1
  7. package/cjs/chat/Chat.js +2 -2
  8. package/cjs/chips/Chips.js +1 -1
  9. package/cjs/chips/Removable.js +1 -1
  10. package/cjs/copybutton/CopyButton.js +2 -2
  11. package/cjs/date/datepicker/parts/Caption.js +2 -2
  12. package/cjs/date/datepicker/parts/DropdownCaption.js +1 -1
  13. package/cjs/date/datepicker/parts/HeadRow.js +1 -1
  14. package/cjs/date/datepicker/parts/Row.js +2 -2
  15. package/cjs/date/monthpicker/MonthCaption.js +1 -1
  16. package/cjs/date/parts/DateInput.js +1 -1
  17. package/cjs/date/utils/check-dates.js +1 -1
  18. package/cjs/date/utils/is-match.js +2 -2
  19. package/cjs/date/utils/parse-date.js +1 -1
  20. package/cjs/dropdown/Dropdown.js +10 -12
  21. package/cjs/dropdown/Menu/Divider.js +1 -1
  22. package/cjs/dropdown/Menu/GroupedList/GroupedHeading.js +1 -1
  23. package/cjs/expansion-card/ExpansionCardHeader.js +1 -1
  24. package/cjs/form/ReadOnlyIcon.js +1 -1
  25. package/cjs/form/Select.js +1 -1
  26. package/cjs/form/combobox/Combobox.js +6 -6
  27. package/cjs/form/combobox/ComboboxProvider.js +2 -2
  28. package/cjs/form/combobox/FilteredOptions/FilteredOptions.js +4 -4
  29. package/cjs/form/combobox/FilteredOptions/filteredOptionsContext.js +4 -4
  30. package/cjs/form/combobox/SelectedOptions/SelectedOptions.js +1 -1
  31. package/cjs/form/error-summary/ErrorSummary.js +2 -2
  32. package/cjs/form/error-summary/ErrorSummaryItem.js +1 -1
  33. package/cjs/form/search/Search.js +1 -1
  34. package/cjs/form/search/SearchButton.js +1 -1
  35. package/cjs/grid/Cell.js +1 -1
  36. package/cjs/grid/Grid.js +1 -1
  37. package/cjs/guide-panel/GuidePanel.js +1 -1
  38. package/cjs/internal-header/InternalHeaderButton.js +1 -1
  39. package/cjs/internal-header/InternalHeaderTitle.js +1 -1
  40. package/cjs/internal-header/InternalHeaderUser.js +1 -1
  41. package/cjs/internal-header/InternalHeaderUserButton.js +1 -1
  42. package/cjs/layout/bleed/Bleed.js +1 -1
  43. package/cjs/layout/content-container/ContentContainer.js +1 -1
  44. package/cjs/layout/grid/HGrid.js +1 -1
  45. package/cjs/layout/page/parts/PageBlock.js +1 -1
  46. package/cjs/layout/sidemal-test/AvatarPanel.js +1 -1
  47. package/cjs/layout/sidemal-test/Content.js +3 -3
  48. package/cjs/layout/sidemal-test/Filter.js +1 -1
  49. package/cjs/layout/sidemal-test/Intro.js +1 -1
  50. package/cjs/link-panel/LinkPanel.js +3 -3
  51. package/cjs/link-panel/LinkPanelDescription.js +1 -1
  52. package/cjs/link-panel/LinkPanelTitle.js +1 -1
  53. package/cjs/modal/ModalBody.js +1 -1
  54. package/cjs/modal/ModalFooter.js +1 -1
  55. package/cjs/modal/ModalHeader.js +1 -1
  56. package/cjs/pagination/PaginationItem.js +1 -1
  57. package/cjs/panel/Panel.js +1 -1
  58. package/cjs/popover/PopoverContent.js +1 -1
  59. package/cjs/read-more/ReadMore.js +12 -10
  60. package/cjs/skeleton/Skeleton.js +1 -1
  61. package/cjs/table/Body.js +1 -1
  62. package/cjs/table/ColumnHeader.js +1 -1
  63. package/cjs/table/DataCell.js +1 -1
  64. package/cjs/table/ExpandableRow.js +14 -13
  65. package/cjs/table/Header.js +1 -1
  66. package/cjs/table/Row.js +1 -1
  67. package/cjs/tabs/TabList.js +1 -1
  68. package/cjs/tabs/Tabs.js +1 -1
  69. package/cjs/tag/Tag.js +1 -1
  70. package/cjs/timeline/AxisLabels.js +1 -1
  71. package/cjs/timeline/TimelineRow.js +2 -2
  72. package/cjs/timeline/hooks/useTimelineRows.js +5 -3
  73. package/cjs/timeline/utils/timeline.js +1 -1
  74. package/cjs/timeline/zoom/ZoomButton.js +1 -1
  75. package/cjs/toggle-group/ToggleGroup.js +1 -1
  76. package/cjs/tooltip/Tooltip.js +12 -7
  77. package/cjs/typography/BodyLong.js +1 -1
  78. package/cjs/typography/ErrorMessage.js +1 -1
  79. package/cjs/typography/Ingress.js +1 -1
  80. package/cjs/util/RandomIcon.js +1 -1
  81. package/cjs/util/hooks/useCallbackRef.js +18 -0
  82. package/cjs/util/hooks/useControllableState.js +25 -0
  83. package/esm/accordion/Accordion.d.ts +1 -1
  84. package/esm/accordion/Accordion.js +2 -2
  85. package/esm/accordion/Accordion.js.map +1 -1
  86. package/esm/accordion/AccordionHeader.js +1 -1
  87. package/esm/accordion/AccordionHeader.js.map +1 -1
  88. package/esm/accordion/AccordionItem.d.ts +4 -0
  89. package/esm/accordion/AccordionItem.js +12 -15
  90. package/esm/accordion/AccordionItem.js.map +1 -1
  91. package/esm/alert/Alert.js +2 -2
  92. package/esm/alert/Alert.js.map +1 -1
  93. package/esm/chat/Bubble.js +1 -1
  94. package/esm/chat/Bubble.js.map +1 -1
  95. package/esm/chat/Chat.js +2 -2
  96. package/esm/chat/Chat.js.map +1 -1
  97. package/esm/chips/Chips.d.ts +2 -2
  98. package/esm/chips/Chips.js +1 -1
  99. package/esm/chips/Chips.js.map +1 -1
  100. package/esm/chips/Removable.js +1 -1
  101. package/esm/chips/Removable.js.map +1 -1
  102. package/esm/copybutton/CopyButton.js +2 -2
  103. package/esm/copybutton/CopyButton.js.map +1 -1
  104. package/esm/date/context/useSharedMonthContext.js.map +1 -1
  105. package/esm/date/datepicker/parts/Caption.js +2 -2
  106. package/esm/date/datepicker/parts/Caption.js.map +1 -1
  107. package/esm/date/datepicker/parts/DropdownCaption.js +1 -1
  108. package/esm/date/datepicker/parts/DropdownCaption.js.map +1 -1
  109. package/esm/date/datepicker/parts/HeadRow.js +1 -1
  110. package/esm/date/datepicker/parts/HeadRow.js.map +1 -1
  111. package/esm/date/datepicker/parts/Row.js +3 -3
  112. package/esm/date/datepicker/parts/Row.js.map +1 -1
  113. package/esm/date/monthpicker/MonthCaption.js +1 -1
  114. package/esm/date/monthpicker/MonthCaption.js.map +1 -1
  115. package/esm/date/parts/DateInput.js +1 -1
  116. package/esm/date/parts/DateInput.js.map +1 -1
  117. package/esm/date/utils/check-dates.js +1 -1
  118. package/esm/date/utils/check-dates.js.map +1 -1
  119. package/esm/date/utils/get-month-weeks.js.map +1 -1
  120. package/esm/date/utils/is-match.js +2 -2
  121. package/esm/date/utils/is-match.js.map +1 -1
  122. package/esm/date/utils/navigation.js.map +1 -1
  123. package/esm/date/utils/parse-date.js +1 -1
  124. package/esm/date/utils/parse-date.js.map +1 -1
  125. package/esm/dropdown/Dropdown.d.ts +4 -0
  126. package/esm/dropdown/Dropdown.js +10 -12
  127. package/esm/dropdown/Dropdown.js.map +1 -1
  128. package/esm/dropdown/Menu/Divider.js +1 -1
  129. package/esm/dropdown/Menu/Divider.js.map +1 -1
  130. package/esm/dropdown/Menu/GroupedList/GroupedHeading.js +1 -1
  131. package/esm/dropdown/Menu/GroupedList/GroupedHeading.js.map +1 -1
  132. package/esm/expansion-card/ExpansionCardHeader.js +1 -1
  133. package/esm/expansion-card/ExpansionCardHeader.js.map +1 -1
  134. package/esm/form/Fieldset/useFieldset.d.ts +1 -1
  135. package/esm/form/ReadOnlyIcon.js +1 -1
  136. package/esm/form/ReadOnlyIcon.js.map +1 -1
  137. package/esm/form/Select.js +1 -1
  138. package/esm/form/Select.js.map +1 -1
  139. package/esm/form/Switch.js.map +1 -1
  140. package/esm/form/TextField.js.map +1 -1
  141. package/esm/form/checkbox/useCheckbox.d.ts +1 -1
  142. package/esm/form/combobox/Combobox.d.ts +1 -1
  143. package/esm/form/combobox/Combobox.js +6 -6
  144. package/esm/form/combobox/Combobox.js.map +1 -1
  145. package/esm/form/combobox/ComboboxProvider.js +2 -2
  146. package/esm/form/combobox/ComboboxProvider.js.map +1 -1
  147. package/esm/form/combobox/FilteredOptions/FilteredOptions.js +4 -4
  148. package/esm/form/combobox/FilteredOptions/FilteredOptions.js.map +1 -1
  149. package/esm/form/combobox/FilteredOptions/filteredOptionsContext.d.ts +1 -1
  150. package/esm/form/combobox/FilteredOptions/filteredOptionsContext.js +4 -4
  151. package/esm/form/combobox/FilteredOptions/filteredOptionsContext.js.map +1 -1
  152. package/esm/form/combobox/SelectedOptions/SelectedOptions.js +1 -1
  153. package/esm/form/combobox/SelectedOptions/SelectedOptions.js.map +1 -1
  154. package/esm/form/combobox/ToggleListButton.js +1 -1
  155. package/esm/form/combobox/ToggleListButton.js.map +1 -1
  156. package/esm/form/combobox/customOptionsContext.js +1 -1
  157. package/esm/form/combobox/customOptionsContext.js.map +1 -1
  158. package/esm/form/error-summary/ErrorSummary.js +3 -3
  159. package/esm/form/error-summary/ErrorSummary.js.map +1 -1
  160. package/esm/form/error-summary/ErrorSummaryItem.js +1 -1
  161. package/esm/form/error-summary/ErrorSummaryItem.js.map +1 -1
  162. package/esm/form/radio/useRadio.d.ts +1 -1
  163. package/esm/form/search/Search.js +1 -1
  164. package/esm/form/search/Search.js.map +1 -1
  165. package/esm/form/search/SearchButton.js +1 -1
  166. package/esm/form/search/SearchButton.js.map +1 -1
  167. package/esm/grid/Cell.js +1 -1
  168. package/esm/grid/Cell.js.map +1 -1
  169. package/esm/grid/Grid.js +1 -1
  170. package/esm/grid/Grid.js.map +1 -1
  171. package/esm/guide-panel/GuidePanel.js +1 -1
  172. package/esm/guide-panel/GuidePanel.js.map +1 -1
  173. package/esm/internal-header/InternalHeader.js.map +1 -1
  174. package/esm/internal-header/InternalHeaderButton.js +1 -1
  175. package/esm/internal-header/InternalHeaderButton.js.map +1 -1
  176. package/esm/internal-header/InternalHeaderTitle.js +1 -1
  177. package/esm/internal-header/InternalHeaderTitle.js.map +1 -1
  178. package/esm/internal-header/InternalHeaderUser.js +1 -1
  179. package/esm/internal-header/InternalHeaderUser.js.map +1 -1
  180. package/esm/internal-header/InternalHeaderUserButton.js +1 -1
  181. package/esm/internal-header/InternalHeaderUserButton.js.map +1 -1
  182. package/esm/layout/bleed/Bleed.js +1 -1
  183. package/esm/layout/bleed/Bleed.js.map +1 -1
  184. package/esm/layout/box/Box.d.ts +1 -1
  185. package/esm/layout/content-container/ContentContainer.js +1 -1
  186. package/esm/layout/content-container/ContentContainer.js.map +1 -1
  187. package/esm/layout/grid/HGrid.js +1 -1
  188. package/esm/layout/grid/HGrid.js.map +1 -1
  189. package/esm/layout/page/Page.d.ts +2 -2
  190. package/esm/layout/page/Page.js.map +1 -1
  191. package/esm/layout/page/parts/PageBlock.d.ts +6 -5
  192. package/esm/layout/page/parts/PageBlock.js +1 -1
  193. package/esm/layout/page/parts/PageBlock.js.map +1 -1
  194. package/esm/layout/responsive/Responsive.js.map +1 -1
  195. package/esm/layout/sidemal-test/AvatarPanel.js +1 -1
  196. package/esm/layout/sidemal-test/AvatarPanel.js.map +1 -1
  197. package/esm/layout/sidemal-test/Content.js +4 -4
  198. package/esm/layout/sidemal-test/Content.js.map +1 -1
  199. package/esm/layout/sidemal-test/Filter.js +1 -1
  200. package/esm/layout/sidemal-test/Filter.js.map +1 -1
  201. package/esm/layout/sidemal-test/Header.js +1 -1
  202. package/esm/layout/sidemal-test/Header.js.map +1 -1
  203. package/esm/layout/sidemal-test/Intro.js +2 -2
  204. package/esm/layout/sidemal-test/Intro.js.map +1 -1
  205. package/esm/layout/sidemal-test/content-box/ContentBox.js.map +1 -1
  206. package/esm/layout/stack/HStack.js.map +1 -1
  207. package/esm/layout/stack/Stack.js.map +1 -1
  208. package/esm/layout/stack/VStack.js.map +1 -1
  209. package/esm/layout/utilities/types.d.ts +2 -2
  210. package/esm/link-panel/LinkPanel.d.ts +2 -2
  211. package/esm/link-panel/LinkPanel.js +3 -3
  212. package/esm/link-panel/LinkPanel.js.map +1 -1
  213. package/esm/link-panel/LinkPanelDescription.js +1 -1
  214. package/esm/link-panel/LinkPanelDescription.js.map +1 -1
  215. package/esm/link-panel/LinkPanelTitle.js +1 -1
  216. package/esm/link-panel/LinkPanelTitle.js.map +1 -1
  217. package/esm/loader/Loader.js.map +1 -1
  218. package/esm/modal/ModalBody.js +1 -1
  219. package/esm/modal/ModalBody.js.map +1 -1
  220. package/esm/modal/ModalFooter.js +1 -1
  221. package/esm/modal/ModalFooter.js.map +1 -1
  222. package/esm/modal/ModalHeader.js +1 -1
  223. package/esm/modal/ModalHeader.js.map +1 -1
  224. package/esm/pagination/Pagination.js.map +1 -1
  225. package/esm/pagination/PaginationItem.js +1 -1
  226. package/esm/pagination/PaginationItem.js.map +1 -1
  227. package/esm/panel/Panel.js +1 -1
  228. package/esm/panel/Panel.js.map +1 -1
  229. package/esm/popover/Popover.js.map +1 -1
  230. package/esm/popover/PopoverContent.js +1 -1
  231. package/esm/popover/PopoverContent.js.map +1 -1
  232. package/esm/read-more/ReadMore.d.ts +4 -0
  233. package/esm/read-more/ReadMore.js +13 -11
  234. package/esm/read-more/ReadMore.js.map +1 -1
  235. package/esm/skeleton/Skeleton.js +1 -1
  236. package/esm/skeleton/Skeleton.js.map +1 -1
  237. package/esm/table/Body.js +1 -1
  238. package/esm/table/Body.js.map +1 -1
  239. package/esm/table/ColumnHeader.js +1 -1
  240. package/esm/table/ColumnHeader.js.map +1 -1
  241. package/esm/table/DataCell.js +1 -1
  242. package/esm/table/DataCell.js.map +1 -1
  243. package/esm/table/ExpandableRow.js +15 -14
  244. package/esm/table/ExpandableRow.js.map +1 -1
  245. package/esm/table/Header.js +1 -1
  246. package/esm/table/Header.js.map +1 -1
  247. package/esm/table/Row.js +1 -1
  248. package/esm/table/Row.js.map +1 -1
  249. package/esm/tabs/TabList.js +1 -1
  250. package/esm/tabs/TabList.js.map +1 -1
  251. package/esm/tabs/Tabs.js +1 -1
  252. package/esm/tabs/Tabs.js.map +1 -1
  253. package/esm/tag/Tag.js +1 -1
  254. package/esm/tag/Tag.js.map +1 -1
  255. package/esm/timeline/AxisLabels.js +1 -1
  256. package/esm/timeline/AxisLabels.js.map +1 -1
  257. package/esm/timeline/TimelineRow.js +2 -2
  258. package/esm/timeline/TimelineRow.js.map +1 -1
  259. package/esm/timeline/hooks/useTimelineRows.js +5 -3
  260. package/esm/timeline/hooks/useTimelineRows.js.map +1 -1
  261. package/esm/timeline/utils/timeline.js +1 -1
  262. package/esm/timeline/utils/timeline.js.map +1 -1
  263. package/esm/timeline/zoom/ZoomButton.js +1 -1
  264. package/esm/timeline/zoom/ZoomButton.js.map +1 -1
  265. package/esm/toggle-group/ToggleGroup.js +1 -1
  266. package/esm/toggle-group/ToggleGroup.js.map +1 -1
  267. package/esm/tooltip/Tooltip.d.ts +4 -0
  268. package/esm/tooltip/Tooltip.js +13 -8
  269. package/esm/tooltip/Tooltip.js.map +1 -1
  270. package/esm/typography/BodyLong.js +1 -1
  271. package/esm/typography/BodyLong.js.map +1 -1
  272. package/esm/typography/ErrorMessage.js +1 -1
  273. package/esm/typography/ErrorMessage.js.map +1 -1
  274. package/esm/typography/Ingress.js +1 -1
  275. package/esm/typography/Ingress.js.map +1 -1
  276. package/esm/util/RandomIcon.js +1 -1
  277. package/esm/util/RandomIcon.js.map +1 -1
  278. package/esm/util/hooks/useCallbackRef.d.ts +7 -0
  279. package/esm/util/hooks/useCallbackRef.js +15 -0
  280. package/esm/util/hooks/useCallbackRef.js.map +1 -0
  281. package/esm/util/hooks/useControllableState.d.ts +9 -0
  282. package/esm/util/hooks/useControllableState.js +22 -0
  283. package/esm/util/hooks/useControllableState.js.map +1 -0
  284. package/esm/util/mergeRefs.js.map +1 -1
  285. package/package.json +3 -3
  286. package/src/accordion/Accordion.tsx +5 -5
  287. package/src/accordion/AccordionContent.tsx +3 -3
  288. package/src/accordion/AccordionHeader.tsx +3 -3
  289. package/src/accordion/AccordionItem.tsx +21 -21
  290. package/src/accordion/accordion.stories.tsx +8 -5
  291. package/src/alert/Alert.tsx +8 -8
  292. package/src/alert/alert.stories.tsx +7 -7
  293. package/src/button/Button.tsx +4 -4
  294. package/src/button/button.stories.tsx +1 -1
  295. package/src/chat/Bubble.tsx +4 -4
  296. package/src/chat/Chat.tsx +5 -5
  297. package/src/chat/chat.stories.tsx +1 -1
  298. package/src/chips/Chips.tsx +4 -4
  299. package/src/chips/Removable.tsx +4 -4
  300. package/src/chips/Toggle.tsx +3 -3
  301. package/src/chips/chips.stories.tsx +5 -5
  302. package/src/copybutton/CopyButton.tsx +6 -6
  303. package/src/copybutton/copy-button.stories.tsx +3 -3
  304. package/src/date/context/useSharedMonthContext.tsx +1 -1
  305. package/src/date/datepicker/DatePicker.tsx +2 -2
  306. package/src/date/datepicker/DatePickerStandalone.tsx +2 -2
  307. package/src/date/datepicker/datepicker.stories.tsx +2 -2
  308. package/src/date/datepicker/parts/Caption.tsx +2 -3
  309. package/src/date/datepicker/parts/DropdownCaption.tsx +2 -2
  310. package/src/date/datepicker/parts/HeadRow.tsx +1 -1
  311. package/src/date/datepicker/parts/Row.tsx +3 -3
  312. package/src/date/hooks/useDatepicker.tsx +7 -7
  313. package/src/date/hooks/useMonthPicker.tsx +7 -7
  314. package/src/date/hooks/useRangeDatepicker.test.tsx +2 -2
  315. package/src/date/hooks/useRangeDatepicker.tsx +28 -28
  316. package/src/date/monthpicker/MonthButton.tsx +1 -1
  317. package/src/date/monthpicker/MonthCaption.tsx +1 -1
  318. package/src/date/monthpicker/MonthPicker.tsx +3 -3
  319. package/src/date/monthpicker/MonthPickerStandalone.tsx +3 -3
  320. package/src/date/monthpicker/MonthSelector.tsx +1 -1
  321. package/src/date/parts/DateInput.tsx +6 -6
  322. package/src/date/utils/__tests__/check-dates.test.ts +3 -3
  323. package/src/date/utils/__tests__/format-dates.test.ts +7 -7
  324. package/src/date/utils/__tests__/get-initial-year.test.ts +14 -14
  325. package/src/date/utils/__tests__/get-month-weeks.test.ts +0 -1
  326. package/src/date/utils/__tests__/is-match.test.ts +4 -4
  327. package/src/date/utils/__tests__/parse-dates.test.ts +2 -2
  328. package/src/date/utils/check-dates.ts +2 -2
  329. package/src/date/utils/dates-disabled.ts +1 -1
  330. package/src/date/utils/format-date.ts +1 -1
  331. package/src/date/utils/get-dates.ts +1 -1
  332. package/src/date/utils/get-month-weeks.ts +6 -6
  333. package/src/date/utils/is-match.ts +2 -3
  334. package/src/date/utils/labels.ts +1 -1
  335. package/src/date/utils/navigation.ts +18 -18
  336. package/src/date/utils/parse-date.ts +8 -8
  337. package/src/dropdown/Dropdown.tsx +14 -11
  338. package/src/dropdown/Menu/Divider.tsx +1 -1
  339. package/src/dropdown/Menu/GroupedList/GroupedHeading.tsx +2 -2
  340. package/src/dropdown/Menu/GroupedList/GroupedItem.tsx +1 -1
  341. package/src/dropdown/Menu/GroupedList/index.tsx +1 -1
  342. package/src/dropdown/Menu/List/Item.tsx +1 -1
  343. package/src/dropdown/Menu/index.tsx +1 -1
  344. package/src/dropdown/dropdown.stories.tsx +1 -1
  345. package/src/expansion-card/ExpansionCard.tsx +3 -3
  346. package/src/expansion-card/ExpansionCardContent.tsx +1 -1
  347. package/src/expansion-card/ExpansionCardDescription.tsx +1 -1
  348. package/src/expansion-card/ExpansionCardHeader.tsx +2 -2
  349. package/src/expansion-card/ExpansionCardTitle.tsx +2 -2
  350. package/src/expansion-card/expansion-card.stories.tsx +1 -1
  351. package/src/form/ConfirmationPanel.test.tsx +1 -1
  352. package/src/form/ConfirmationPanel.tsx +2 -2
  353. package/src/form/Fieldset/Fieldset.tsx +2 -2
  354. package/src/form/ReadOnlyIcon.tsx +1 -1
  355. package/src/form/Select.tsx +6 -6
  356. package/src/form/Switch.tsx +4 -4
  357. package/src/form/TextField.tsx +4 -4
  358. package/src/form/Textarea.tsx +4 -4
  359. package/src/form/checkbox/Checkbox.test.tsx +8 -8
  360. package/src/form/checkbox/Checkbox.tsx +3 -3
  361. package/src/form/checkbox/CheckboxGroup.tsx +4 -4
  362. package/src/form/checkbox/useCheckbox.ts +3 -3
  363. package/src/form/combobox/Combobox.tsx +8 -8
  364. package/src/form/combobox/ComboboxProvider.tsx +3 -3
  365. package/src/form/combobox/ComboboxWrapper.tsx +1 -1
  366. package/src/form/combobox/FilteredOptions/FilteredOptions.tsx +6 -6
  367. package/src/form/combobox/FilteredOptions/filteredOptionsContext.tsx +18 -18
  368. package/src/form/combobox/FilteredOptions/useVirtualFocus.ts +5 -5
  369. package/src/form/combobox/Input/Input.tsx +6 -6
  370. package/src/form/combobox/Input/inputContext.tsx +6 -6
  371. package/src/form/combobox/SelectedOptions/SelectedOptions.tsx +1 -1
  372. package/src/form/combobox/SelectedOptions/selectedOptionsContext.tsx +9 -9
  373. package/src/form/combobox/ToggleListButton.tsx +1 -2
  374. package/src/form/combobox/combobox.stories.tsx +8 -8
  375. package/src/form/combobox/combobox.test.tsx +14 -12
  376. package/src/form/combobox/customOptionsContext.tsx +6 -6
  377. package/src/form/combobox/types.ts +2 -2
  378. package/src/form/error-summary/ErrorSummary.tsx +6 -6
  379. package/src/form/error-summary/ErrorSummaryItem.tsx +2 -2
  380. package/src/form/error-summary/error-summary.stories.tsx +2 -1
  381. package/src/form/radio/Radio.test.tsx +1 -1
  382. package/src/form/radio/Radio.tsx +1 -1
  383. package/src/form/radio/RadioGroup.tsx +3 -3
  384. package/src/form/radio/useRadio.ts +1 -1
  385. package/src/form/search/Search.tsx +6 -6
  386. package/src/form/search/SearchButton.tsx +2 -2
  387. package/src/form/search/search.stories.tsx +1 -1
  388. package/src/form/stories/fieldset.stories.tsx +3 -2
  389. package/src/form/stories/select.stories.tsx +2 -1
  390. package/src/form/stories/text-field.stories.tsx +2 -1
  391. package/src/form/useFormField.ts +3 -3
  392. package/src/grid/Cell.tsx +3 -3
  393. package/src/grid/Grid.tsx +2 -2
  394. package/src/grid/grid.stories.tsx +1 -1
  395. package/src/guide-panel/GuidePanel.tsx +2 -2
  396. package/src/guide-panel/guidepanel.stories.tsx +1 -1
  397. package/src/help-text/HelpText.tsx +2 -2
  398. package/src/internal-header/InternalHeader.tsx +1 -1
  399. package/src/internal-header/InternalHeaderButton.tsx +1 -1
  400. package/src/internal-header/InternalHeaderTitle.tsx +1 -1
  401. package/src/internal-header/InternalHeaderUser.tsx +1 -1
  402. package/src/internal-header/InternalHeaderUserButton.tsx +1 -1
  403. package/src/internal-header/header.stories.tsx +3 -3
  404. package/src/layout/bleed/Bleed.tsx +7 -7
  405. package/src/layout/box/Box.stories.tsx +4 -4
  406. package/src/layout/box/Box.tsx +7 -7
  407. package/src/layout/content-container/ContentContainer.tsx +1 -1
  408. package/src/layout/grid/HGrid.tsx +4 -4
  409. package/src/layout/page/Page.stories.tsx +1 -1
  410. package/src/layout/page/Page.tsx +4 -4
  411. package/src/layout/page/parts/PageBlock.tsx +8 -7
  412. package/src/layout/responsive/Responsive.tsx +6 -6
  413. package/src/layout/responsive/hide.stories.tsx +1 -1
  414. package/src/layout/responsive/show.stories.tsx +1 -1
  415. package/src/layout/sidemal-test/AvatarPanel.tsx +1 -1
  416. package/src/layout/sidemal-test/Content.tsx +4 -4
  417. package/src/layout/sidemal-test/Filter.tsx +1 -1
  418. package/src/layout/sidemal-test/Header.tsx +1 -1
  419. package/src/layout/sidemal-test/Intro.tsx +2 -2
  420. package/src/layout/sidemal-test/content-box/ContentBox.tsx +6 -6
  421. package/src/layout/sidemal-test/navno-sidemal.stories.tsx +1 -1
  422. package/src/layout/stack/HStack.tsx +1 -1
  423. package/src/layout/stack/Stack.tsx +3 -3
  424. package/src/layout/stack/VStack.tsx +1 -1
  425. package/src/layout/stack/stack.stories.tsx +2 -2
  426. package/src/layout/utilities/css.ts +6 -6
  427. package/src/layout/utilities/types.ts +2 -2
  428. package/src/link/Link.tsx +2 -2
  429. package/src/link/link.stories.tsx +1 -1
  430. package/src/link-panel/LinkPanel.tsx +6 -7
  431. package/src/link-panel/LinkPanelDescription.tsx +1 -1
  432. package/src/link-panel/LinkPanelTitle.tsx +2 -2
  433. package/src/list/List.tsx +2 -2
  434. package/src/list/ListItem.tsx +2 -2
  435. package/src/list/list.stories.tsx +2 -2
  436. package/src/loader/Loader.tsx +4 -4
  437. package/src/loader/loader.stories.tsx +1 -0
  438. package/src/modal/Modal.test.tsx +4 -4
  439. package/src/modal/Modal.tsx +2 -2
  440. package/src/modal/ModalBody.tsx +2 -2
  441. package/src/modal/ModalFooter.tsx +2 -2
  442. package/src/modal/ModalHeader.tsx +2 -2
  443. package/src/modal/ModalUtils.ts +2 -2
  444. package/src/modal/dialog-polyfill.ts +16 -16
  445. package/src/pagination/Pagination.tsx +5 -6
  446. package/src/pagination/PaginationItem.tsx +3 -3
  447. package/src/pagination/steps.test.ts +8 -8
  448. package/src/panel/Panel.tsx +3 -3
  449. package/src/panel/panel.stories.tsx +2 -1
  450. package/src/popover/Popover.test.tsx +7 -7
  451. package/src/popover/Popover.tsx +8 -8
  452. package/src/popover/PopoverContent.tsx +2 -2
  453. package/src/provider/Provider.tsx +1 -1
  454. package/src/read-more/ReadMore.tsx +19 -13
  455. package/src/read-more/readmore.stories.tsx +4 -0
  456. package/src/skeleton/Skeleton.tsx +4 -4
  457. package/src/stepper/Step.tsx +2 -2
  458. package/src/stepper/Stepper.tsx +3 -3
  459. package/src/table/Body.tsx +1 -1
  460. package/src/table/ColumnHeader.tsx +2 -2
  461. package/src/table/DataCell.tsx +2 -2
  462. package/src/table/ExpandableRow.tsx +19 -17
  463. package/src/table/Header.tsx +1 -1
  464. package/src/table/HeaderCell.tsx +1 -1
  465. package/src/table/Row.tsx +2 -2
  466. package/src/table/Table.tsx +2 -2
  467. package/src/table/stories/table-async.stories.tsx +4 -4
  468. package/src/table/stories/table.stories.tsx +1 -1
  469. package/src/tabs/Tab.tsx +3 -3
  470. package/src/tabs/TabList.tsx +4 -4
  471. package/src/tabs/TabPanel.tsx +1 -1
  472. package/src/tabs/Tabs.stories.tsx +1 -1
  473. package/src/tabs/Tabs.tsx +4 -4
  474. package/src/tag/Tag.tsx +3 -3
  475. package/src/tag/tag.stories.tsx +1 -1
  476. package/src/timeline/AxisLabels.tsx +9 -9
  477. package/src/timeline/Pin.tsx +2 -2
  478. package/src/timeline/Timeline.tsx +7 -7
  479. package/src/timeline/TimelineRow.tsx +5 -5
  480. package/src/timeline/hooks/useTimelineContext.tsx +1 -1
  481. package/src/timeline/hooks/useTimelineRows.ts +18 -19
  482. package/src/timeline/period/ClickablePeriod.tsx +4 -4
  483. package/src/timeline/period/NonClickablePeriod.tsx +1 -1
  484. package/src/timeline/period/index.tsx +1 -1
  485. package/src/timeline/timeline.stories.tsx +2 -2
  486. package/src/timeline/utils/calc.ts +2 -2
  487. package/src/timeline/utils/filter.ts +2 -2
  488. package/src/timeline/utils/period.ts +2 -2
  489. package/src/timeline/utils/timeline.ts +1 -1
  490. package/src/timeline/zoom/ZoomButton.tsx +3 -3
  491. package/src/timeline/zoom/index.tsx +1 -1
  492. package/src/toggle-group/ToggleGroup.stories.tsx +2 -2
  493. package/src/toggle-group/ToggleGroup.tsx +5 -5
  494. package/src/toggle-group/ToggleItem.tsx +1 -1
  495. package/src/toggle-group/context.ts +1 -1
  496. package/src/tooltip/Tooltip.test.tsx +10 -10
  497. package/src/tooltip/Tooltip.tsx +20 -11
  498. package/src/tooltip/tooltip.stories.tsx +1 -1
  499. package/src/typography/BodyLong.tsx +4 -4
  500. package/src/typography/BodyShort.tsx +3 -3
  501. package/src/typography/Detail.tsx +3 -3
  502. package/src/typography/ErrorMessage.tsx +3 -3
  503. package/src/typography/Heading.tsx +3 -3
  504. package/src/typography/Ingress.tsx +1 -1
  505. package/src/typography/Label.tsx +3 -3
  506. package/src/typography/stories/heading.stories.tsx +1 -2
  507. package/src/util/AnimateHeight.tsx +1 -1
  508. package/src/util/OverridableComponent.ts +1 -1
  509. package/src/util/RandomIcon.tsx +1 -1
  510. package/src/util/Slot.tsx +3 -3
  511. package/src/util/TextareaAutoSize.tsx +4 -4
  512. package/src/util/__tests__/Slot.test.tsx +11 -11
  513. package/src/util/hooks/useCallbackRef.ts +20 -0
  514. package/src/util/hooks/useControllableState.ts +40 -0
  515. package/src/util/mergeRefs.tsx +2 -1
  516. package/src/util/omit.ts +1 -1
  517. package/src/util/useEventListener.ts +1 -1
  518. package/src/util/useMedia.ts +1 -1
package/_docs.json CHANGED
@@ -335,6 +335,25 @@
335
335
  "name": "boolean"
336
336
  }
337
337
  },
338
+ "onOpenChange": {
339
+ "defaultValue": null,
340
+ "description": "Callback for current open-state",
341
+ "name": "onOpenChange",
342
+ "parent": {
343
+ "fileName": "src/accordion/AccordionItem.tsx",
344
+ "name": "AccordionItemProps"
345
+ },
346
+ "declarations": [
347
+ {
348
+ "fileName": "src/accordion/AccordionItem.tsx",
349
+ "name": "AccordionItemProps"
350
+ }
351
+ ],
352
+ "required": false,
353
+ "type": {
354
+ "name": "((open: boolean) => void)"
355
+ }
356
+ },
338
357
  "className": {
339
358
  "defaultValue": null,
340
359
  "description": "",
@@ -1879,6 +1898,25 @@
1879
1898
  "type": {
1880
1899
  "name": "boolean"
1881
1900
  }
1901
+ },
1902
+ "onOpenChange": {
1903
+ "defaultValue": null,
1904
+ "description": "Change handler for open",
1905
+ "name": "onOpenChange",
1906
+ "parent": {
1907
+ "fileName": "src/dropdown/Dropdown.tsx",
1908
+ "name": "DropdownProps"
1909
+ },
1910
+ "declarations": [
1911
+ {
1912
+ "fileName": "src/dropdown/Dropdown.tsx",
1913
+ "name": "DropdownProps"
1914
+ }
1915
+ ],
1916
+ "required": false,
1917
+ "type": {
1918
+ "name": "((open: boolean) => void)"
1919
+ }
1882
1920
  }
1883
1921
  }
1884
1922
  },
@@ -6611,6 +6649,25 @@
6611
6649
  "name": "boolean"
6612
6650
  }
6613
6651
  },
6652
+ "onOpenChange": {
6653
+ "defaultValue": null,
6654
+ "description": "Callback for current open-state",
6655
+ "name": "onOpenChange",
6656
+ "parent": {
6657
+ "fileName": "src/read-more/ReadMore.tsx",
6658
+ "name": "ReadMoreProps"
6659
+ },
6660
+ "declarations": [
6661
+ {
6662
+ "fileName": "src/read-more/ReadMore.tsx",
6663
+ "name": "ReadMoreProps"
6664
+ }
6665
+ ],
6666
+ "required": false,
6667
+ "type": {
6668
+ "name": "((open: boolean) => void)"
6669
+ }
6670
+ },
6614
6671
  "size": {
6615
6672
  "defaultValue": {
6616
6673
  "value": "medium"
@@ -9034,6 +9091,25 @@
9034
9091
  "name": "boolean"
9035
9092
  }
9036
9093
  },
9094
+ "onOpenChange": {
9095
+ "defaultValue": null,
9096
+ "description": "Change handler for open",
9097
+ "name": "onOpenChange",
9098
+ "parent": {
9099
+ "fileName": "src/tooltip/Tooltip.tsx",
9100
+ "name": "TooltipProps"
9101
+ },
9102
+ "declarations": [
9103
+ {
9104
+ "fileName": "src/tooltip/Tooltip.tsx",
9105
+ "name": "TooltipProps"
9106
+ }
9107
+ ],
9108
+ "required": false,
9109
+ "type": {
9110
+ "name": "((open: boolean) => void)"
9111
+ }
9112
+ },
9037
9113
  "placement": {
9038
9114
  "defaultValue": {
9039
9115
  "value": "\"top\""
@@ -17444,7 +17520,7 @@
17444
17520
  ],
17445
17521
  "required": false,
17446
17522
  "type": {
17447
- "name": "\"bg-default\" | \"bg-subtle\""
17523
+ "name": "\"bg-default\" | \"bg-subtle\" | \"surface-subtle\""
17448
17524
  }
17449
17525
  },
17450
17526
  "footer": {
@@ -19393,7 +19469,7 @@
19393
19469
  "defaultValue": {
19394
19470
  "value": "max-width: 100%;"
19395
19471
  },
19396
- "description": "Predefined max-width\n@example md: 768px\nlg: 1024px\nxl: 1280px\n2xl: 1440px",
19472
+ "description": "Predefined max-width\n@example text: 576px + dynamic gutters\nmd: 768px\nlg: 1024px\nxl: 1280px\n2xl: 1440px",
19397
19473
  "name": "width",
19398
19474
  "parent": {
19399
19475
  "fileName": "src/layout/page/parts/PageBlock.tsx",
@@ -19407,7 +19483,7 @@
19407
19483
  ],
19408
19484
  "required": false,
19409
19485
  "type": {
19410
- "name": "\"md\" | \"lg\" | \"xl\" | \"2xl\""
19486
+ "name": "\"text\" | \"md\" | \"lg\" | \"xl\" | \"2xl\""
19411
19487
  }
19412
19488
  },
19413
19489
  "gutters": {
@@ -40,10 +40,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Accordion = void 0;
41
41
  const clsx_1 = __importDefault(require("clsx"));
42
42
  const react_1 = __importStar(require("react"));
43
- const AccordionItem_1 = __importDefault(require("./AccordionItem"));
44
43
  const AccordionContent_1 = __importDefault(require("./AccordionContent"));
45
- const AccordionHeader_1 = __importDefault(require("./AccordionHeader"));
46
44
  const AccordionContext_1 = require("./AccordionContext");
45
+ const AccordionHeader_1 = __importDefault(require("./AccordionHeader"));
46
+ const AccordionItem_1 = __importDefault(require("./AccordionItem"));
47
47
  /**
48
48
  * A component that displays collapsible content sections.
49
49
  *
@@ -37,9 +37,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
37
37
  return (mod && mod.__esModule) ? mod : { "default": mod };
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
- const aksel_icons_1 = require("@navikt/aksel-icons");
41
40
  const clsx_1 = __importDefault(require("clsx"));
42
41
  const react_1 = __importStar(require("react"));
42
+ const aksel_icons_1 = require("@navikt/aksel-icons");
43
43
  const typography_1 = require("../typography");
44
44
  const AccordionContext_1 = require("./AccordionContext");
45
45
  const AccordionItem_1 = require("./AccordionItem");
@@ -40,36 +40,33 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.AccordionItemContext = void 0;
41
41
  const clsx_1 = __importDefault(require("clsx"));
42
42
  const react_1 = __importStar(require("react"));
43
- const AccordionContext_1 = require("./AccordionContext");
44
43
  const util_1 = require("../util");
44
+ const useControllableState_1 = require("../util/hooks/useControllableState");
45
+ const AccordionContext_1 = require("./AccordionContext");
45
46
  exports.AccordionItemContext = (0, react_1.createContext)(null);
46
47
  const AccordionItem = (0, react_1.forwardRef)((_a, ref) => {
47
- var { children, className, open, defaultOpen = false } = _a, rest = __rest(_a, ["children", "className", "open", "defaultOpen"]);
48
- const [internalOpen, setInternalOpen] = (0, react_1.useState)(defaultOpen);
48
+ var { children, className, open, defaultOpen = false, onOpenChange } = _a, rest = __rest(_a, ["children", "className", "open", "defaultOpen", "onOpenChange"]);
49
+ const [_open, _setOpen] = (0, useControllableState_1.useControllableState)({
50
+ defaultValue: defaultOpen,
51
+ value: open,
52
+ onChange: onOpenChange,
53
+ });
49
54
  const context = (0, react_1.useContext)(AccordionContext_1.AccordionContext);
50
- const [_open, _setOpen] = (0, react_1.useState)(defaultOpen);
51
55
  const shouldAnimate = (0, react_1.useRef)(!(Boolean(open) || defaultOpen));
52
56
  const handleOpen = () => {
53
- if (open === undefined) {
54
- const newOpen = !_open;
55
- _setOpen(newOpen);
56
- setInternalOpen(newOpen);
57
- }
58
- else {
59
- setInternalOpen(!open);
60
- }
57
+ _setOpen((x) => !x);
61
58
  shouldAnimate.current = true;
62
59
  };
63
60
  if (!(context === null || context === void 0 ? void 0 : context.mounted)) {
64
61
  console.error("<Accordion.Item> has to be used within an <Accordion>");
65
62
  }
66
63
  return (react_1.default.createElement("div", Object.assign({ className: (0, clsx_1.default)("navds-accordion__item", className, {
67
- "navds-accordion__item--open": open !== null && open !== void 0 ? open : internalOpen,
64
+ "navds-accordion__item--open": _open,
68
65
  "navds-accordion__item--neutral": (context === null || context === void 0 ? void 0 : context.variant) === "neutral",
69
66
  "navds-accordion__item--no-animation": !shouldAnimate.current,
70
67
  }), ref: ref }, (0, util_1.omit)(rest, ["onClick"])),
71
68
  react_1.default.createElement(exports.AccordionItemContext.Provider, { value: {
72
- open: open !== null && open !== void 0 ? open : internalOpen,
69
+ open: _open,
73
70
  toggleOpen: handleOpen,
74
71
  } }, children)));
75
72
  });
@@ -38,11 +38,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Alert = void 0;
41
- const aksel_icons_1 = require("@navikt/aksel-icons");
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
42
  const react_1 = __importStar(require("react"));
44
- const typography_1 = require("../typography");
43
+ const aksel_icons_1 = require("@navikt/aksel-icons");
45
44
  const button_1 = require("../button");
45
+ const typography_1 = require("../typography");
46
46
  const Icon = (_a) => {
47
47
  var { variant } = _a, props = __rest(_a, ["variant"]);
48
48
  switch (variant) {
@@ -37,8 +37,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
37
37
  return (mod && mod.__esModule) ? mod : { "default": mod };
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
- const react_1 = __importStar(require("react"));
41
40
  const clsx_1 = __importDefault(require("clsx"));
41
+ const react_1 = __importStar(require("react"));
42
42
  const typography_1 = require("../typography");
43
43
  const Bubble = (0, react_1.forwardRef)((_a, ref) => {
44
44
  var { children, className, name, timestamp, backgroundColor, toptextPosition } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "backgroundColor", "toptextPosition"]);
package/cjs/chat/Chat.js CHANGED
@@ -38,10 +38,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Chat = exports.SIZES = exports.POSITIONS = void 0;
41
- const react_1 = __importStar(require("react"));
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
- const Bubble_1 = __importDefault(require("./Bubble"));
42
+ const react_1 = __importStar(require("react"));
44
43
  const typography_1 = require("../typography");
44
+ const Bubble_1 = __importDefault(require("./Bubble"));
45
45
  exports.POSITIONS = ["left", "right"];
46
46
  exports.SIZES = ["medium", "small"];
47
47
  /**
@@ -40,8 +40,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Chips = void 0;
41
41
  const clsx_1 = __importDefault(require("clsx"));
42
42
  const react_1 = __importStar(require("react"));
43
- const Toggle_1 = __importDefault(require("./Toggle"));
44
43
  const Removable_1 = __importDefault(require("./Removable"));
44
+ const Toggle_1 = __importDefault(require("./Toggle"));
45
45
  /**
46
46
  * A component that displays a list of items as chips.
47
47
  *
@@ -38,9 +38,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.RemovableChips = void 0;
41
- const aksel_icons_1 = require("@navikt/aksel-icons");
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
42
  const react_1 = __importStar(require("react"));
43
+ const aksel_icons_1 = require("@navikt/aksel-icons");
44
44
  exports.RemovableChips = (0, react_1.forwardRef)((_a, ref) => {
45
45
  var { className, children, variant = "action", removeLabel = "slett", onDelete, type = "button" } = _a, rest = __rest(_a, ["className", "children", "variant", "removeLabel", "onDelete", "type"]);
46
46
  return (react_1.default.createElement("button", Object.assign({}, rest, { ref: ref, type: type, className: (0, clsx_1.default)("navds-chips__chip navds-chips__removable navds-chips--icon-right", className, `navds-chips__removable--${variant}`), "aria-label": `${children} ${removeLabel}`, onClick: (e) => {
@@ -38,11 +38,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.CopyButton = void 0;
41
- const aksel_icons_1 = require("@navikt/aksel-icons");
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
42
  const react_1 = __importStar(require("react"));
44
- const copy_1 = __importDefault(require("../util/copy"));
43
+ const aksel_icons_1 = require("@navikt/aksel-icons");
45
44
  const typography_1 = require("../typography");
45
+ const copy_1 = __importDefault(require("../util/copy"));
46
46
  /**
47
47
  * A button component that copies text to the clipboard when clicked.
48
48
  *
@@ -4,12 +4,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.DatePickerCaption = void 0;
7
- const aksel_icons_1 = require("@navikt/aksel-icons");
8
7
  const react_1 = __importDefault(require("react"));
9
8
  const react_day_picker_1 = require("react-day-picker");
10
- const WeekRow_1 = __importDefault(require("./WeekRow"));
9
+ const aksel_icons_1 = require("@navikt/aksel-icons");
11
10
  const button_1 = require("../../../button");
12
11
  const typography_1 = require("../../../typography");
12
+ const WeekRow_1 = __importDefault(require("./WeekRow"));
13
13
  /**
14
14
  * https://github.com/gpbl/react-day-picker/tree/main/src/components/Caption
15
15
  */
@@ -4,13 +4,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.DropdownCaption = void 0;
7
- const aksel_icons_1 = require("@navikt/aksel-icons");
8
7
  const date_fns_1 = require("date-fns");
9
8
  const setMonth_1 = __importDefault(require("date-fns/setMonth"));
10
9
  const setYear_1 = __importDefault(require("date-fns/setYear"));
11
10
  const startOfMonth_1 = __importDefault(require("date-fns/startOfMonth"));
12
11
  const react_1 = __importDefault(require("react"));
13
12
  const react_day_picker_1 = require("react-day-picker");
13
+ const aksel_icons_1 = require("@navikt/aksel-icons");
14
14
  const button_1 = require("../../../button");
15
15
  const Select_1 = require("../../../form/Select");
16
16
  const get_dates_1 = require("../../utils/get-dates");
@@ -4,8 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.getWeekdays = exports.HeadRow = void 0;
7
- const react_1 = __importDefault(require("react"));
8
7
  const date_fns_1 = require("date-fns");
8
+ const react_1 = __importDefault(require("react"));
9
9
  const react_day_picker_1 = require("react-day-picker");
10
10
  const responsive_1 = require("../../../layout/responsive");
11
11
  /**
@@ -3,11 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
6
  const date_fns_1 = require("date-fns");
7
+ const react_1 = __importDefault(require("react"));
8
8
  const react_day_picker_1 = require("react-day-picker");
9
- const WeekNumber_1 = __importDefault(require("./WeekNumber"));
10
9
  const responsive_1 = require("../../../layout/responsive");
10
+ const WeekNumber_1 = __importDefault(require("./WeekNumber"));
11
11
  /**
12
12
  * https://github.com/gpbl/react-day-picker/tree/main/src/components/Row
13
13
  */
@@ -4,13 +4,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.MonthCaption = void 0;
7
- const aksel_icons_1 = require("@navikt/aksel-icons");
8
7
  const date_fns_1 = require("date-fns");
9
8
  const setYear_1 = __importDefault(require("date-fns/setYear"));
10
9
  const startOfMonth_1 = __importDefault(require("date-fns/startOfMonth"));
11
10
  const startOfYear_1 = __importDefault(require("date-fns/startOfYear"));
12
11
  const react_1 = __importDefault(require("react"));
13
12
  const react_day_picker_1 = require("react-day-picker");
13
+ const aksel_icons_1 = require("@navikt/aksel-icons");
14
14
  const button_1 = require("../../button");
15
15
  const Select_1 = require("../../form/Select");
16
16
  const context_1 = require("../context");
@@ -38,9 +38,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.MonthPickerInput = exports.DatePickerInput = void 0;
41
- const aksel_icons_1 = require("@navikt/aksel-icons");
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
42
  const react_1 = __importStar(require("react"));
43
+ const aksel_icons_1 = require("@navikt/aksel-icons");
44
44
  const ReadOnlyIcon_1 = require("../../form/ReadOnlyIcon");
45
45
  const useFormField_1 = require("../../form/useFormField");
46
46
  const typography_1 = require("../../typography");
@@ -4,8 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.isValidDate = exports.dateIsInCurrentMonth = void 0;
7
- const setYear_1 = __importDefault(require("date-fns/setYear"));
8
7
  const isThisMonth_1 = __importDefault(require("date-fns/isThisMonth"));
8
+ const setYear_1 = __importDefault(require("date-fns/setYear"));
9
9
  const dateIsInCurrentMonth = (date, dateToCompare) => {
10
10
  return (0, isThisMonth_1.default)((0, setYear_1.default)(date, Number(dateToCompare.getFullYear())));
11
11
  };
@@ -4,9 +4,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.isDateInRange = exports.isMatch = void 0;
7
- const isSameDay_1 = __importDefault(require("date-fns/isSameDay"));
8
- const isDate_1 = __importDefault(require("date-fns/isDate"));
9
7
  const differenceInCalendarDays_1 = __importDefault(require("date-fns/differenceInCalendarDays"));
8
+ const isDate_1 = __importDefault(require("date-fns/isDate"));
9
+ const isSameDay_1 = __importDefault(require("date-fns/isSameDay"));
10
10
  const isSameMonth_1 = __importDefault(require("date-fns/isSameMonth"));
11
11
  const react_day_picker_1 = require("react-day-picker");
12
12
  function isDateType(value) {
@@ -4,8 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.parseDate = exports.INPUT_DATE_STRING_FORMAT_MONTH = exports.INPUT_DATE_STRING_FORMAT_DATE = void 0;
7
- const parse_1 = __importDefault(require("date-fns/parse"));
8
7
  const isBefore_1 = __importDefault(require("date-fns/isBefore"));
8
+ const parse_1 = __importDefault(require("date-fns/parse"));
9
9
  const sub_1 = __importDefault(require("date-fns/sub"));
10
10
  const check_dates_1 = require("./check-dates");
11
11
  exports.INPUT_DATE_STRING_FORMAT_DATE = "dd.MM.yyyy";
@@ -28,6 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  exports.Dropdown = void 0;
30
30
  const react_1 = __importStar(require("react"));
31
+ const useControllableState_1 = require("../util/hooks/useControllableState");
31
32
  const Menu_1 = __importDefault(require("./Menu"));
32
33
  const Toggle_1 = __importDefault(require("./Toggle"));
33
34
  const context_1 = require("./context");
@@ -62,24 +63,21 @@ const context_1 = require("./context");
62
63
  * </Dropdown>
63
64
  * ```
64
65
  */
65
- exports.Dropdown = (({ children, onSelect, closeOnSelect = true, defaultOpen = false, open, }) => {
66
- const [isOpen, setIsOpen] = (0, react_1.useState)(defaultOpen);
66
+ exports.Dropdown = (({ children, onSelect, closeOnSelect = true, defaultOpen = false, open, onOpenChange, }) => {
67
67
  const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
68
- const handleToggle = (v) => {
69
- if (open === undefined) {
70
- setIsOpen(v);
71
- }
72
- };
68
+ const [_open, _setOpen] = (0, useControllableState_1.useControllableState)({
69
+ defaultValue: defaultOpen,
70
+ value: open,
71
+ onChange: onOpenChange,
72
+ });
73
73
  return (react_1.default.createElement(context_1.DropdownContext.Provider, { value: {
74
- isOpen: open !== null && open !== void 0 ? open : isOpen,
75
- handleToggle,
74
+ isOpen: _open,
75
+ handleToggle: _setOpen,
76
76
  anchorEl,
77
77
  setAnchorEl,
78
78
  onSelect: (event) => {
79
79
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(event);
80
- if (closeOnSelect) {
81
- open === undefined && setIsOpen(false);
82
- }
80
+ closeOnSelect && _setOpen(false);
83
81
  },
84
82
  } }, children));
85
83
  });
@@ -38,8 +38,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Divider = void 0;
41
- const react_1 = __importStar(require("react"));
42
41
  const clsx_1 = __importDefault(require("clsx"));
42
+ const react_1 = __importStar(require("react"));
43
43
  exports.Divider = (0, react_1.forwardRef)((_a, ref) => {
44
44
  var { className } = _a, rest = __rest(_a, ["className"]);
45
45
  return (react_1.default.createElement("hr", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-dropdown__divider", className) })));
@@ -38,8 +38,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.GroupedHeading = void 0;
41
- const react_1 = __importStar(require("react"));
42
41
  const clsx_1 = __importDefault(require("clsx"));
42
+ const react_1 = __importStar(require("react"));
43
43
  exports.GroupedHeading = (0, react_1.forwardRef)((_a, ref) => {
44
44
  var { className } = _a, rest = __rest(_a, ["className"]);
45
45
  return (react_1.default.createElement("dt", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-dropdown__list-heading", "navds-heading", "navds-heading--xsmall", className) })));
@@ -37,9 +37,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
37
37
  return (mod && mod.__esModule) ? mod : { "default": mod };
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
- const aksel_icons_1 = require("@navikt/aksel-icons");
41
40
  const clsx_1 = __importDefault(require("clsx"));
42
41
  const react_1 = __importStar(require("react"));
42
+ const aksel_icons_1 = require("@navikt/aksel-icons");
43
43
  const context_1 = require("./context");
44
44
  const ExpansionCardHeader = (0, react_1.forwardRef)((_a, ref) => {
45
45
  var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
@@ -4,8 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.ReadOnlyIcon = void 0;
7
- const aksel_icons_1 = require("@navikt/aksel-icons");
8
7
  const react_1 = __importDefault(require("react"));
8
+ const aksel_icons_1 = require("@navikt/aksel-icons");
9
9
  const ReadOnlyIcon = ({ readOnly, nativeReadOnly = true, }) => {
10
10
  if (readOnly) {
11
11
  return (react_1.default.createElement(aksel_icons_1.PadlockLockedFillIcon, Object.assign({}, (nativeReadOnly ? { "aria-hidden": true } : { title: "readonly" }), { className: "navds-form-field__readonly-icon" })));
@@ -38,9 +38,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Select = void 0;
41
- const aksel_icons_1 = require("@navikt/aksel-icons");
42
41
  const clsx_1 = __importDefault(require("clsx"));
43
42
  const react_1 = __importStar(require("react"));
43
+ const aksel_icons_1 = require("@navikt/aksel-icons");
44
44
  const typography_1 = require("../typography");
45
45
  const util_1 = require("../util");
46
46
  const ReadOnlyIcon_1 = require("./ReadOnlyIcon");
@@ -40,17 +40,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Combobox = void 0;
41
41
  const clsx_1 = __importDefault(require("clsx"));
42
42
  const react_1 = __importStar(require("react"));
43
+ const typography_1 = require("../../typography");
44
+ const util_1 = require("../../util");
43
45
  const ClearButton_1 = __importDefault(require("./ClearButton"));
46
+ const ComboboxWrapper_1 = __importDefault(require("./ComboboxWrapper"));
44
47
  const FilteredOptions_1 = __importDefault(require("./FilteredOptions/FilteredOptions"));
45
48
  const filteredOptionsContext_1 = require("./FilteredOptions/filteredOptionsContext");
49
+ const Input_1 = __importDefault(require("./Input/Input"));
50
+ const inputContext_1 = require("./Input/inputContext");
46
51
  const SelectedOptions_1 = __importDefault(require("./SelectedOptions/SelectedOptions"));
47
- const ToggleListButton_1 = __importDefault(require("./ToggleListButton"));
48
52
  const selectedOptionsContext_1 = require("./SelectedOptions/selectedOptionsContext");
49
- const ComboboxWrapper_1 = __importDefault(require("./ComboboxWrapper"));
50
- const inputContext_1 = require("./Input/inputContext");
51
- const Input_1 = __importDefault(require("./Input/Input"));
52
- const util_1 = require("../../util");
53
- const typography_1 = require("../../typography");
53
+ const ToggleListButton_1 = __importDefault(require("./ToggleListButton"));
54
54
  exports.Combobox = (0, react_1.forwardRef)((props, ref) => {
55
55
  const { className, hideLabel = false, description, label, clearButton = true, clearButtonLabel, toggleListButton = true, toggleListButtonLabel, inputClassName, shouldShowSelectedOptions = true } = props, rest = __rest(props, ["className", "hideLabel", "description", "label", "clearButton", "clearButtonLabel", "toggleListButton", "toggleListButtonLabel", "inputClassName", "shouldShowSelectedOptions"]);
56
56
  const toggleListButtonRef = (0, react_1.useRef)(null);
@@ -40,9 +40,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  const react_1 = __importStar(require("react"));
41
41
  const Combobox_1 = __importDefault(require("./Combobox"));
42
42
  const filteredOptionsContext_1 = require("./FilteredOptions/filteredOptionsContext");
43
- const customOptionsContext_1 = require("./customOptionsContext");
44
- const selectedOptionsContext_1 = require("./SelectedOptions/selectedOptionsContext");
45
43
  const inputContext_1 = require("./Input/inputContext");
44
+ const selectedOptionsContext_1 = require("./SelectedOptions/selectedOptionsContext");
45
+ const customOptionsContext_1 = require("./customOptionsContext");
46
46
  /**
47
47
  * A component that allows the user to search in a list of options
48
48
  *
@@ -3,15 +3,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
6
  const clsx_1 = __importDefault(require("clsx"));
7
+ const react_1 = __importDefault(require("react"));
8
8
  const aksel_icons_1 = require("@navikt/aksel-icons");
9
- const filteredOptionsContext_1 = require("./filteredOptionsContext");
10
- const selectedOptionsContext_1 = require("../SelectedOptions/selectedOptionsContext");
11
- const inputContext_1 = require("../Input/inputContext");
12
9
  const loader_1 = require("../../../loader");
13
10
  const typography_1 = require("../../../typography");
11
+ const inputContext_1 = require("../Input/inputContext");
12
+ const selectedOptionsContext_1 = require("../SelectedOptions/selectedOptionsContext");
14
13
  const filtered_options_util_1 = __importDefault(require("./filtered-options-util"));
14
+ const filteredOptionsContext_1 = require("./filteredOptionsContext");
15
15
  const FilteredOptions = () => {
16
16
  const { inputProps: { id }, size, value, } = (0, inputContext_1.useInputContext)();
17
17
  const { allowNewValues, isLoading, isListOpen, filteredOptions, setFilteredOptionsRef, isMouseLastUsedInputDevice, setIsMouseLastUsedInputDevice, isValueNew, toggleIsListOpen, activeDecendantId, virtualFocus, } = (0, filteredOptionsContext_1.useFilteredOptionsContext)();
@@ -27,12 +27,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
27
27
  };
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  exports.useFilteredOptionsContext = exports.FilteredOptionsProvider = void 0;
30
- const react_1 = __importStar(require("react"));
31
30
  const clsx_1 = __importDefault(require("clsx"));
32
- const customOptionsContext_1 = require("../customOptionsContext");
33
- const inputContext_1 = require("../Input/inputContext");
34
- const usePrevious_1 = __importDefault(require("../../../util/usePrevious"));
31
+ const react_1 = __importStar(require("react"));
35
32
  const util_1 = require("../../../util");
33
+ const usePrevious_1 = __importDefault(require("../../../util/usePrevious"));
34
+ const inputContext_1 = require("../Input/inputContext");
35
+ const customOptionsContext_1 = require("../customOptionsContext");
36
36
  const filtered_options_util_1 = __importDefault(require("./filtered-options-util"));
37
37
  const useVirtualFocus_1 = __importDefault(require("./useVirtualFocus"));
38
38
  const FilteredOptionsContext = (0, react_1.createContext)({});
@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  const react_1 = __importDefault(require("react"));
7
7
  const chips_1 = require("../../../chips");
8
- const selectedOptionsContext_1 = require("./selectedOptionsContext");
9
8
  const inputContext_1 = require("../Input/inputContext");
9
+ const selectedOptionsContext_1 = require("./selectedOptionsContext");
10
10
  const Option = ({ option }) => {
11
11
  const { isMultiSelect, removeSelectedOption } = (0, selectedOptionsContext_1.useSelectedOptionsContext)();
12
12
  const { focusInput } = (0, inputContext_1.useInputContext)();
@@ -38,11 +38,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.ErrorSummary = void 0;
41
- const react_1 = __importStar(require("react"));
42
41
  const clsx_1 = __importDefault(require("clsx"));
42
+ const react_1 = __importStar(require("react"));
43
43
  const typography_1 = require("../../typography");
44
- const ErrorSummaryItem_1 = __importDefault(require("./ErrorSummaryItem"));
45
44
  const util_1 = require("../../util");
45
+ const ErrorSummaryItem_1 = __importDefault(require("./ErrorSummaryItem"));
46
46
  /**
47
47
  * A component that displays a summary of errors.
48
48
  *
@@ -38,8 +38,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.ErrorSummaryItem = void 0;
41
- const react_1 = __importStar(require("react"));
42
41
  const clsx_1 = __importDefault(require("clsx"));
42
+ const react_1 = __importStar(require("react"));
43
43
  exports.ErrorSummaryItem = (0, react_1.forwardRef)((_a, ref) => {
44
44
  var { children, as: Component = "a", className } = _a, rest = __rest(_a, ["children", "as", "className"]);
45
45
  return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)(className, "navds-error-summary__item", "navds-link") }), children));