@oslokommune/punkt-react 16.25.0 → 16.26.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (157) hide show
  1. package/CHANGELOG.md +46 -0
  2. package/CONTRIBUTING.md +1 -1
  3. package/README.md +1 -1
  4. package/dist/components/accordion/Accordion.d.ts +21 -0
  5. package/dist/components/accordion/Accordion.test.d.ts +0 -0
  6. package/dist/components/accordion/AccordionItem.d.ts +17 -0
  7. package/dist/components/alert/Alert.d.ts +14 -0
  8. package/dist/components/alert/Alert.test.d.ts +0 -0
  9. package/dist/components/backlink/BackLink.d.ts +14 -0
  10. package/dist/components/backlink/BackLink.test.d.ts +0 -0
  11. package/dist/components/breadcrumbs/Breadcrumbs.d.ts +16 -0
  12. package/dist/components/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  13. package/dist/components/button/Button.d.ts +24 -0
  14. package/dist/components/button/Button.test.d.ts +0 -0
  15. package/dist/components/calendar/Calendar.accessibility.test.d.ts +0 -0
  16. package/dist/components/calendar/Calendar.constraints.test.d.ts +0 -0
  17. package/dist/components/calendar/Calendar.core.test.d.ts +0 -0
  18. package/dist/components/calendar/Calendar.d.ts +3 -0
  19. package/dist/components/calendar/Calendar.interaction.test.d.ts +0 -0
  20. package/dist/components/calendar/Calendar.selection.test.d.ts +0 -0
  21. package/dist/components/calendar/CalendarGrid.d.ts +4 -0
  22. package/dist/components/calendar/CalendarNav.d.ts +2 -0
  23. package/dist/components/calendar/calendar-utils.d.ts +20 -0
  24. package/dist/components/calendar/types.d.ts +104 -0
  25. package/dist/components/calendar/useCalendarState.d.ts +2 -0
  26. package/dist/components/card/Card.d.ts +37 -0
  27. package/dist/components/card/Card.test.d.ts +0 -0
  28. package/dist/components/checkbox/Checkbox.d.ts +23 -0
  29. package/dist/components/checkbox/Checkbox.test.d.ts +0 -0
  30. package/dist/components/combobox/Combobox.accessibility.test.d.ts +0 -0
  31. package/dist/components/combobox/Combobox.core.test.d.ts +0 -0
  32. package/dist/components/combobox/Combobox.d.ts +3 -0
  33. package/dist/components/combobox/Combobox.interaction.test.d.ts +0 -0
  34. package/dist/components/combobox/Combobox.selection.test.d.ts +0 -0
  35. package/dist/components/combobox/ComboboxInput.d.ts +6 -0
  36. package/dist/components/combobox/ComboboxTags.d.ts +11 -0
  37. package/dist/components/combobox/Listbox.d.ts +6 -0
  38. package/dist/components/combobox/types.d.ts +104 -0
  39. package/dist/components/combobox/useComboboxState.d.ts +2 -0
  40. package/dist/components/consent/Consent.d.ts +51 -0
  41. package/dist/components/consent/Consent.test.d.ts +0 -0
  42. package/dist/components/consent/strings.d.ts +85 -0
  43. package/dist/components/datepicker/DateTags.d.ts +10 -0
  44. package/dist/components/datepicker/Datepicker.accessibility.test.d.ts +0 -0
  45. package/dist/components/datepicker/Datepicker.core.test.d.ts +0 -0
  46. package/dist/components/datepicker/Datepicker.d.ts +3 -0
  47. package/dist/components/datepicker/Datepicker.input.test.d.ts +0 -0
  48. package/dist/components/datepicker/Datepicker.selection.test.d.ts +0 -0
  49. package/dist/components/datepicker/Datepicker.validation.test.d.ts +0 -0
  50. package/dist/components/datepicker/DatepickerInputs.d.ts +4 -0
  51. package/dist/components/datepicker/DatepickerPopup.d.ts +21 -0
  52. package/dist/components/datepicker/types.d.ts +109 -0
  53. package/dist/components/datepicker/useDatepickerState.d.ts +2 -0
  54. package/dist/components/fileupload/DropZone.d.ts +42 -0
  55. package/dist/components/fileupload/FileUpload.d.ts +84 -0
  56. package/dist/components/fileupload/FileUpload.test.d.ts +0 -0
  57. package/dist/components/fileupload/QueueDisplay.d.ts +19 -0
  58. package/dist/components/fileupload/QueueDisplay.test.d.ts +0 -0
  59. package/dist/components/fileupload/QueueItemContent.d.ts +44 -0
  60. package/dist/components/fileupload/Subcomponents.d.ts +36 -0
  61. package/dist/components/fileupload/Truncate.d.ts +20 -0
  62. package/dist/components/fileupload/Truncate.test.d.ts +0 -0
  63. package/dist/components/fileupload/extensions/Comments.d.ts +6 -0
  64. package/dist/components/fileupload/extensions/Remove.d.ts +2 -0
  65. package/dist/components/fileupload/extensions/Rename.d.ts +2 -0
  66. package/dist/components/fileupload/hooks/index.d.ts +4 -0
  67. package/dist/components/fileupload/hooks/useFileAttributes.d.ts +10 -0
  68. package/dist/components/fileupload/hooks/useImagePreview.d.ts +9 -0
  69. package/dist/components/fileupload/hooks/useOperationState.d.ts +6 -0
  70. package/dist/components/fileupload/hooks/useRequiredFormValidation.d.ts +16 -0
  71. package/dist/components/fileupload/hooks.d.ts +4 -0
  72. package/dist/components/fileupload/types.d.ts +88 -0
  73. package/dist/components/fileupload/utils.d.ts +5 -0
  74. package/dist/components/footer/Footer.d.ts +36 -0
  75. package/dist/components/footer/Footer.test.d.ts +0 -0
  76. package/dist/components/footerSimple/FooterSimple.d.ts +21 -0
  77. package/dist/components/footerSimple/FooterSimple.test.d.ts +0 -0
  78. package/dist/components/header/Header.d.ts +15 -0
  79. package/dist/components/header/Header.test.d.ts +0 -0
  80. package/dist/components/header/HeaderService.d.ts +9 -0
  81. package/dist/components/header/HeaderService.test.d.ts +0 -0
  82. package/dist/components/header/types.d.ts +93 -0
  83. package/dist/components/header-menu/HeaderMenu.d.ts +26 -0
  84. package/dist/components/header-menu/HeaderMenu.test.d.ts +0 -0
  85. package/dist/components/headerUserMenu/UserMenu.d.ts +11 -0
  86. package/dist/components/headerUserMenu/UserMenu.test.d.ts +0 -0
  87. package/dist/components/heading/Heading.d.ts +14 -0
  88. package/dist/components/heading/Heading.test.d.ts +0 -0
  89. package/dist/components/helptext/Helptext.d.ts +9 -0
  90. package/dist/components/helptext/Helptext.test.d.ts +0 -0
  91. package/dist/components/icon/Icon.d.ts +10 -0
  92. package/dist/components/icon/Icon.test.d.ts +9 -0
  93. package/dist/components/index.d.ts +50 -0
  94. package/dist/components/input/Input.d.ts +21 -0
  95. package/dist/components/inputwrapper/InputWrapper.d.ts +28 -0
  96. package/dist/components/interfaces.d.ts +30 -0
  97. package/dist/components/link/Link.d.ts +17 -0
  98. package/dist/components/link/Link.test.d.ts +1 -0
  99. package/dist/components/linkcard/LinkCard.d.ts +14 -0
  100. package/dist/components/linkcard/LinkCard.test.d.ts +0 -0
  101. package/dist/components/loader/Loader.d.ts +41 -0
  102. package/dist/components/loader/Loader.test.d.ts +0 -0
  103. package/dist/components/messagebox/Messagebox.d.ts +11 -0
  104. package/dist/components/messagebox/Messagebox.test.d.ts +1 -0
  105. package/dist/components/modal/Modal.d.ts +17 -0
  106. package/dist/components/modal/Modal.test.d.ts +0 -0
  107. package/dist/components/progressbar/Progressbar.d.ts +21 -0
  108. package/dist/components/progressbar/Progressbar.test.d.ts +0 -0
  109. package/dist/components/radio/RadioButton.d.ts +20 -0
  110. package/dist/components/radio/RadioButton.test.d.ts +0 -0
  111. package/dist/components/searchinput/SearchInput.d.ts +36 -0
  112. package/dist/components/searchinput/SearchInput.test.d.ts +0 -0
  113. package/dist/components/select/Select.d.ts +30 -0
  114. package/dist/components/select/Select.test.d.ts +0 -0
  115. package/dist/components/stepper/Step.d.ts +21 -0
  116. package/dist/components/stepper/Stepper.d.ts +32 -0
  117. package/dist/components/stepper/Stepper.test.d.ts +0 -0
  118. package/dist/components/table/Table.d.ts +11 -0
  119. package/dist/components/table/Table.test.d.ts +0 -0
  120. package/dist/components/table/TableBody.d.ts +7 -0
  121. package/dist/components/table/TableData.d.ts +7 -0
  122. package/dist/components/table/TableDataCell.d.ts +8 -0
  123. package/dist/components/table/TableHeader.d.ts +7 -0
  124. package/dist/components/table/TableHeaderCell.d.ts +7 -0
  125. package/dist/components/table/TableRow.d.ts +7 -0
  126. package/dist/components/tabs/TabItem.d.ts +15 -0
  127. package/dist/components/tabs/Tabs.d.ts +33 -0
  128. package/dist/components/tabs/Tabs.test.d.ts +0 -0
  129. package/dist/components/tag/Tag.d.ts +24 -0
  130. package/dist/components/tag/Tag.test.d.ts +0 -0
  131. package/dist/components/textarea/Textarea.d.ts +35 -0
  132. package/dist/components/textarea/Textarea.test.d.ts +0 -0
  133. package/dist/components/textinput/Textinput.d.ts +44 -0
  134. package/dist/components/textinput/Textinput.test.d.ts +0 -0
  135. package/dist/components/timepicker/Timepicker.d.ts +3 -0
  136. package/dist/components/timepicker/Timepicker.test.d.ts +0 -0
  137. package/dist/components/timepicker/types.d.ts +81 -0
  138. package/dist/components/timepicker/useTimepickerState.d.ts +58 -0
  139. package/dist/components/types.d.ts +2 -0
  140. package/dist/index.d.ts +1 -1364
  141. package/dist/punkt-react.cjs +1 -1
  142. package/dist/punkt-react.js +1000 -984
  143. package/package.json +33 -32
  144. package/src/components/calendar/types.ts +1 -1
  145. package/src/components/card/Card.tsx +1 -1
  146. package/src/components/combobox/types.ts +5 -5
  147. package/src/components/datepicker/types.ts +5 -5
  148. package/src/components/fileupload/FileUpload.tsx +1 -1
  149. package/src/components/fileupload/Subcomponents.tsx +1 -1
  150. package/src/components/fileupload/Truncate.tsx +1 -1
  151. package/src/components/fileupload/hooks/useRequiredFormValidation.ts +1 -1
  152. package/src/components/header/HeaderService.tsx +17 -16
  153. package/src/components/header/types.ts +2 -0
  154. package/src/components/tabs/Tabs.tsx +1 -0
  155. package/src/components/tag/Tag.tsx +1 -1
  156. package/src/components/timepicker/Timepicker.tsx +1 -2
  157. package/src/components/timepicker/types.ts +2 -5
package/dist/index.d.ts CHANGED
@@ -1,1364 +1 @@
1
- import { AnchorHTMLAttributes } from 'react';
2
- import { Booleanish } from './shared-types';
3
- import { ButtonHTMLAttributes } from 'react';
4
- import { ChangeEvent } from 'react';
5
- import { ChangeEventHandler } from 'react';
6
- import { FC } from 'react';
7
- import { FocusEvent as FocusEvent_2 } from 'react';
8
- import { ForwardRefExoticComponent } from 'react';
9
- import { HTMLAttributes } from 'react';
10
- import { HTMLProps } from 'react';
11
- import { IDatepickerStrings } from './shared-types/datepicker';
12
- import { IFileItem } from './shared-types';
13
- import { IFileTransfer } from './shared-types';
14
- import { IFileValidateDetail } from './shared-types';
15
- import { InputHTMLAttributes } from 'react';
16
- import { IPktComboboxOption } from './shared-types/combobox';
17
- import { IPktHeaderMenu as IPktHeaderMenu_2 } from './shared-types';
18
- import { IPktSearchInputSuggestion } from './shared-types/searchinput';
19
- import { ITimepickerStrings } from './shared-types/timepicker';
20
- import { JSX as JSX_2 } from 'react/jsx-runtime';
21
- import { LinkHTMLAttributes } from 'react';
22
- import { MouseEvent as MouseEvent_2 } from 'react';
23
- import { ReactElement } from 'react';
24
- import { ReactNode } from 'react';
25
- import { Ref } from 'react';
26
- import { RefAttributes } from 'react';
27
- import { SelectHTMLAttributes } from 'react';
28
- import { SyntheticEvent } from 'react';
29
- import { TAccordionSkin } from './shared-types';
30
- import { TAlertRole } from './shared-types';
31
- import { TAlertSkin } from './shared-types';
32
- import { TAriaLive } from './shared-types';
33
- import { TCardSkin } from './shared-types';
34
- import { TextareaHTMLAttributes } from 'react';
35
- import { TFileUploadStrategy } from './shared-types';
36
- import { THeaderFooterApi } from './shared-types';
37
- import { THeaderMenu } from './shared-types';
38
- import { THeaderPosition } from './shared-types';
39
- import { THeaderScrollBehavior } from './shared-types';
40
- import { THeadingLevel as THeadingLevel_2 } from './shared-types';
41
- import { THeadingSize } from './shared-types';
42
- import { THeadingWeight } from './shared-types';
43
- import { TLayout } from './shared-types';
44
- import { TLogOutButtonPlacement } from './shared-types';
45
- import { TMessageboxSkin } from './shared-types';
46
- import { TPktComboboxDisplayValue } from './shared-types/combobox';
47
- import { TPktComboboxTagPlacement } from './shared-types/combobox';
48
- import { TProgressbarRole } from './shared-types';
49
- import { TProgressbarSkin } from './shared-types';
50
- import { TProgressbarStatusPlacement } from './shared-types';
51
- import { TProgressbarStatusType } from './shared-types';
52
- import { TProgressbarTitlePosition } from './shared-types';
53
- import { TSlotMenuVariant } from './shared-types';
54
- import { TTagSkin } from './shared-types';
55
-
56
- declare interface BasePktTagProps {
57
- skin?: TTagSkin;
58
- textStyle?: 'normal-text' | 'thin-text';
59
- size?: 'small' | 'medium' | 'large';
60
- closeTag?: boolean;
61
- iconName?: string;
62
- ariaLabel?: string;
63
- onClose?: () => void;
64
- children?: ReactNode;
65
- }
66
-
67
- declare interface ButtonPktTagProps extends BasePktTagProps, HTMLAttributes<HTMLButtonElement> {
68
- closeTag: true;
69
- type?: 'button' | 'submit' | 'reset';
70
- }
71
-
72
- declare interface Column {
73
- title: string;
74
- links?: Link[];
75
- text?: string;
76
- }
77
-
78
- declare type ConsentDetailsMap = Record<string, boolean>;
79
-
80
- /**
81
- * A selected file plus metadata used by the FileUpload UI.
82
- *
83
- * Notes:
84
- * - A `fileId` is generated automatically if omitted.
85
- * - `attributes.targetFilename` is the filename shown in the queue and may be updated by extensions (e.g. rename).
86
- *
87
- * Implements the shared `IFileItem` type from `shared-types`.
88
- */
89
- export declare class FileItem implements IFileItem {
90
- fileId: TFileId;
91
- file: File;
92
- attributes: {
93
- targetFilename: string;
94
- } & Record<string, unknown>;
95
- constructor(file: File, fileId?: TFileId);
96
- }
97
-
98
- /**
99
- * Shared props for `PktFileUpload` (both `form` and `custom` strategies).
100
- */
101
- declare interface IBaseFileUploadProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'checked' | 'size' | 'type' | 'value' | 'onChange' | 'width' | 'defaultValue'> {
102
- /** Called with the next file list when files are added/removed/updated. */
103
- onFilesChanged?: (files: TFileItemList) => void;
104
- /** Allow selecting/dropping multiple files. */
105
- multiple?: boolean;
106
- /** Controlled value (recommended). */
107
- value?: TFileItemList;
108
- /** Upload mode. Defaults to `"form"`. */
109
- uploadStrategy?: TUploadStrategy;
110
- /** Field name. Used for native input (`form`) or hidden ID inputs (`custom`). */
111
- name: string;
112
- /** Enable comment operation (disabled automatically in thumbnail view). */
113
- addCommentsEnabled?: boolean;
114
- /** Enable rename operation (disabled automatically in thumbnail view). */
115
- renameFilesEnabled?: boolean;
116
- /** Renderer for queue items (`filename`, `thumbnail`, or custom function). */
117
- itemRenderer?: keyof typeof ItemRenderers | TItemRenderer;
118
- /** Number of trailing characters to keep when truncating long filenames. */
119
- truncateTail?: number;
120
- /**
121
- * Called immediately when a file is added in `uploadStrategy="custom"`.
122
- * Use it to start uploading the file and update `transfers`.
123
- */
124
- onFileUploadRequested?: (fileItem: FileItem) => void;
125
- /** Uncontrolled initial value (use either `value` or `defaultValue`, not both). */
126
- defaultValue?: TFileItemList;
127
- /** Extra operations appended after built-ins (rename/comment). */
128
- extraOperations?: Array<TQueueItemOperation>;
129
- /** Stretch to full container width (drop zone + queue). */
130
- fullwidth?: boolean;
131
- /** Allowed formats for built-in validation (extensions like `pdf`, or MIME patterns like `image/*`). */
132
- allowedFormats?: string[];
133
- /** Custom message for invalid format. Use `{formats}` placeholder. */
134
- formatErrorMessage?: string;
135
- /** Max file size (e.g. `"5MB"` or bytes). */
136
- maxFileSize?: string | number;
137
- /** Custom message for size validation. Use `{maxSize}` placeholder. */
138
- sizeErrorMessage?: string;
139
- /** Optional additional validation hook (runs after built-in format/size checks). Return string to block. */
140
- onFileValidation?: (file: File) => string | null;
141
- /**
142
- * Low-level validation escape hatch — Lit parity with the `file-validate` CustomEvent.
143
- * Receives a detail object whose `errorMessage` can be mutated; set it to reject the file.
144
- */
145
- onFileValidate?: (detail: TFileValidateDetail) => void;
146
- /** External/programmatic error message shown under the component. */
147
- errorMessage?: string;
148
- /** External error flag (combined with internal validation errors). */
149
- hasError?: boolean;
150
- /** Disable the whole component (no interaction). */
151
- disabled?: boolean;
152
- /** Optional label/title (wraps the component in `PktInputWrapper`). */
153
- label?: string;
154
- /** Help text under the label. */
155
- helptext?: string | ReactNode;
156
- /** Show "Valgfritt" tag in wrapper. */
157
- optionalTag?: boolean;
158
- /** Show "Må fylles ut" tag in wrapper. */
159
- requiredTag?: boolean;
160
- /** Marks the upload as required. Native validation is used in `form`; submit validation in `custom`. */
161
- required?: boolean;
162
- /** Enable image preview modal (only applies to thumbnail renderer). */
163
- enableImagePreview?: boolean;
164
- }
165
-
166
- declare interface IBreadcrumbs {
167
- text: string;
168
- href: string;
169
- }
170
-
171
- declare interface ICardTag {
172
- skin?: TTagSkin;
173
- iconName?: string;
174
- ariaLabel?: string;
175
- text: string;
176
- }
177
-
178
- declare interface IFileInputFileUploadProps extends IBaseFileUploadProps, Omit<HTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'defaultValue'> {
179
- uploadStrategy?: 'form';
180
- onFileUploadRequested?: never;
181
- }
182
-
183
- declare interface ImmediateFileUploadProps extends IBaseFileUploadProps {
184
- id: string;
185
- uploadStrategy: 'custom';
186
- transfers: Array<TFileTransfer>;
187
- onFileUploadRequested: (fileItem: FileItem) => void;
188
- onTransferCancelled?: (fileItemId: string) => void;
189
- }
190
-
191
- declare interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
192
- /** The input's label */
193
- label?: string;
194
- /** The input's id */
195
- id: string;
196
- }
197
-
198
- export declare interface IPktAccordion {
199
- compact?: boolean;
200
- /**
201
- * @default skin: "borderless"
202
- */
203
- skin?: TPktAccordionSkin;
204
- /**
205
- * @description A unique identifier to connect the accordion with a heading
206
- */
207
- ariaLabelledBy?: string;
208
- children?: ReactNode;
209
- name?: string;
210
- className?: string;
211
- }
212
-
213
- export declare interface IPktAccordionItem {
214
- defaultOpen?: boolean;
215
- id: string;
216
- title: string | ReactNode;
217
- skin?: TPktAccordionSkin_2;
218
- compact?: boolean;
219
- isOpen?: boolean;
220
- children?: ReactNode;
221
- name?: string;
222
- className?: string;
223
- onClick?: (e: MouseEvent_2<HTMLDetailsElement>) => void;
224
- onToggle?: (e: SyntheticEvent<HTMLDetailsElement>) => void;
225
- }
226
-
227
- export declare interface IPktAlert extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
228
- skin?: TAlertSkin;
229
- closeAlert?: boolean;
230
- title?: ReactNode;
231
- date?: string;
232
- ariaLive?: TAriaLive;
233
- compact?: boolean;
234
- role?: TAlertRole;
235
- onClose?: (e: CustomEvent) => void;
236
- }
237
-
238
- export declare interface IPktBackLink extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
239
- href?: string;
240
- text?: string;
241
- ariaLabel?: string;
242
- renderLink?: (args: {
243
- href: string;
244
- className: string;
245
- children: ReactNode;
246
- props: AnchorHTMLAttributes<HTMLAnchorElement>;
247
- }) => ReactNode;
248
- ref?: Ref<HTMLElement>;
249
- }
250
-
251
- export declare interface IPktBreadcrumbs extends AnchorHTMLAttributes<HTMLAnchorElement> {
252
- breadcrumbs: IBreadcrumbs[];
253
- navigationType?: 'router' | 'anchor';
254
- renderLink?: (args: {
255
- href: string;
256
- className: string;
257
- children: ReactNode;
258
- props: AnchorHTMLAttributes<HTMLAnchorElement>;
259
- }) => ReactNode;
260
- }
261
-
262
- export declare interface IPktButton extends ButtonHTMLAttributes<HTMLButtonElement> {
263
- iconName?: string;
264
- secondIconName?: string;
265
- iconPath?: string;
266
- secondIconPath?: string;
267
- mode?: 'light' | 'dark';
268
- size?: 'small' | 'medium' | 'large';
269
- fullWidth?: boolean;
270
- fullWidthOnMobile?: boolean;
271
- color?: 'blue' | 'blue-outline' | 'green' | 'green-outline' | 'green-dark' | 'green-dark-outline' | 'beige-light' | 'beige-dark-outline' | 'yellow' | 'yellow-outline' | 'red' | 'red-outline';
272
- skin?: 'primary' | 'secondary' | 'tertiary';
273
- variant?: 'label-only' | 'icon-left' | 'icon-right' | 'icon-only' | 'icons-right-and-left';
274
- state?: 'normal' | 'focus' | 'hover' | 'active';
275
- type?: 'button' | 'submit' | 'reset';
276
- isLoading?: boolean;
277
- loadingAnimationPath?: string;
278
- }
279
-
280
- declare interface IPktCalendar {
281
- selected?: string[];
282
- multiple?: boolean;
283
- maxMultiple?: number;
284
- range?: boolean;
285
- earliest?: string | null;
286
- latest?: string | null;
287
- excludedates?: Date[] | string[];
288
- excludeweekdays?: string[];
289
- weeknumbers?: boolean;
290
- withcontrols?: boolean;
291
- currentmonth?: Date | string | null;
292
- today?: string;
293
- strings?: IPktCalendarStrings;
294
- onDateSelected?: (selected: string[]) => void;
295
- onClose?: () => void;
296
- id?: string;
297
- className?: string;
298
- }
299
-
300
- declare interface IPktCalendarStrings {
301
- month?: string;
302
- year?: string;
303
- days?: string[];
304
- daysShort?: string[];
305
- months?: string[];
306
- week?: string;
307
- prevMonth?: string;
308
- nextMonth?: string;
309
- }
310
-
311
- export declare interface IPktCard extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
312
- ariaLabel?: string;
313
- metaLead?: string | null;
314
- borderOnHover?: boolean;
315
- metaTrail?: string | null;
316
- layout?: TLayout;
317
- heading?: string;
318
- headingLevel?: THeadingLevel;
319
- image?: {
320
- src: string;
321
- alt: string;
322
- };
323
- imageShape?: TCardImageShape;
324
- clickCardLink?: string | null;
325
- padding?: TCardPadding;
326
- openLinkInNewTab?: boolean;
327
- skin?: TCardSkin;
328
- subheading?: string;
329
- tagPosition?: TCardTagPosition;
330
- tags?: ICardTag[];
331
- children?: ReactNode;
332
- ref?: Ref<HTMLDivElement>;
333
- }
334
-
335
- export declare interface IPktCheckbox extends InputHTMLAttributes<HTMLInputElement> {
336
- id: string;
337
- hasTile?: boolean;
338
- disabled?: boolean;
339
- label?: string;
340
- checkHelptext?: ReactNode | ReactNode[] | string;
341
- hasError?: boolean;
342
- defaultChecked?: boolean;
343
- checked?: boolean;
344
- indeterminate?: boolean;
345
- value?: string;
346
- isSwitch?: boolean;
347
- hideLabel?: boolean;
348
- labelPosition?: 'right' | 'left';
349
- optionalTag?: boolean;
350
- optionalText?: string;
351
- requiredTag?: boolean;
352
- requiredText?: string;
353
- tagText?: string | null;
354
- onChange?: ChangeEventHandler<HTMLInputElement>;
355
- }
356
-
357
- export declare interface IPktCombobox {
358
- value?: string | string[];
359
- defaultValue?: string | string[];
360
- options?: IPktComboboxOption[];
361
- defaultOptions?: IPktComboboxOption[];
362
- multiple?: boolean;
363
- maxlength?: number;
364
- typeahead?: boolean;
365
- includeSearch?: boolean;
366
- allowUserInput?: boolean;
367
- displayValueAs?: TPktComboboxDisplayValue;
368
- tagPlacement?: TPktComboboxTagPlacement;
369
- searchPlaceholder?: string;
370
- name?: string;
371
- id?: string;
372
- disabled?: boolean;
373
- required?: boolean;
374
- placeholder?: string;
375
- label?: string;
376
- helptext?: string | ReactNode;
377
- helptextDropdown?: string | ReactNode;
378
- helptextDropdownButton?: string;
379
- hasError?: boolean;
380
- errorMessage?: string | ReactNode;
381
- fullwidth?: boolean;
382
- requiredTag?: boolean;
383
- requiredText?: string;
384
- optionalTag?: boolean;
385
- optionalText?: string;
386
- tagText?: string;
387
- useWrapper?: boolean;
388
- onChange?: ChangeEventHandler<HTMLInputElement>;
389
- onValueChange?: (values: string[]) => void;
390
- className?: string;
391
- children?: ReactNode;
392
- }
393
-
394
- declare interface IPktConsent extends HTMLAttributes<HTMLElement> {
395
- devMode?: boolean;
396
- cookieDomain?: string | null;
397
- cookieSecure?: string | null;
398
- cookieExpiryDays?: string | null;
399
- hotjarId?: string | null;
400
- googleAnalyticsId?: string | null;
401
- i18nLanguage?: string;
402
- triggerType?: TPktConsentTriggerType | null;
403
- triggerText?: string | null;
404
- onToggleConsent?: (e: CustomEvent<ConsentDetailsMap>) => void;
405
- }
406
-
407
- export declare interface IPktDatepicker extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
408
- id: string;
409
- label: string;
410
- value?: string | string[];
411
- dateformat?: string;
412
- multiple?: boolean;
413
- maxlength?: number;
414
- range?: boolean;
415
- showRangeLabels?: boolean;
416
- weeknumbers?: boolean;
417
- withcontrols?: boolean;
418
- excludedates?: string[];
419
- excludeweekdays?: string[];
420
- currentmonth?: string;
421
- today?: string;
422
- calendarOpen?: boolean;
423
- timezone?: string;
424
- fullwidth?: boolean;
425
- hasFieldset?: boolean;
426
- inline?: boolean;
427
- helptext?: string | ReactNode;
428
- helptextDropdown?: string | ReactNode;
429
- helptextDropdownButton?: string;
430
- hasError?: boolean;
431
- errorMessage?: string | ReactNode;
432
- optionalTag?: boolean;
433
- optionalText?: string;
434
- requiredTag?: boolean;
435
- requiredText?: string;
436
- tagText?: string;
437
- useWrapper?: boolean;
438
- strings?: IDatepickerStrings;
439
- onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
440
- onValueChange?: (values: string[]) => void;
441
- className?: string;
442
- }
443
-
444
- export declare type IPktFileUpload = IFileInputFileUploadProps | ImmediateFileUploadProps;
445
-
446
- export declare interface IPktFooter extends HTMLAttributes<HTMLDivElement> {
447
- columnOne: Column;
448
- columnTwo: Column;
449
- socialLinks?: SocialLink[];
450
- personvernOgInfoLink?: string;
451
- tilgjengelighetLink?: string;
452
- openLinksInNewTab?: boolean;
453
- includeConsent?: boolean;
454
- hotjarId?: string | null;
455
- googleAnalyticsId?: string | null;
456
- devMode?: boolean;
457
- cookieDomain?: string | null;
458
- cookieSecure?: string | null;
459
- cookieExpiryDays?: string | null;
460
- onToggleConsent?: (e: CustomEvent) => void;
461
- }
462
-
463
- export declare interface IPktFooterSimple extends HTMLAttributes<HTMLDivElement> {
464
- links?: Array<{
465
- href: string;
466
- text: string;
467
- external?: boolean;
468
- openInNewTab?: boolean;
469
- }>;
470
- personvernOgInfoLink?: string;
471
- tilgjengelighetLink?: string;
472
- openLinksInNewTab?: boolean;
473
- includeConsent?: boolean;
474
- hotjarId?: string | null;
475
- googleAnalyticsId?: string | null;
476
- devMode?: boolean;
477
- cookieDomain?: string | null;
478
- cookieSecure?: string | null;
479
- cookieExpiryDays?: string | null;
480
- onToggleConsent?: (e: CustomEvent) => void;
481
- }
482
-
483
- export declare interface IPktHeader {
484
- children?: ReactNode;
485
- /** Additional CSS class name(s) to apply to the header */
486
- className?: string;
487
- /** Set dark mode on the header */
488
- 'data-mode'?: 'dark';
489
- /** Hide the Oslo logo. Default: false (logo is shown) */
490
- hideLogo?: boolean;
491
- /** Link URL for the logo */
492
- logoLink?: string;
493
- /** Callback when logo is clicked */
494
- logoClick?: (event: MouseEvent_2) => void;
495
- /** Name of the service displayed in the header */
496
- serviceName?: string;
497
- /** Link URL for the service name */
498
- serviceLink?: string;
499
- /** Callback when service name is clicked */
500
- serviceClick?: (event: MouseEvent_2) => void;
501
- /** Use compact header height */
502
- compact?: boolean;
503
- /** User object with name, shortname, and lastLoggedIn */
504
- user?: User;
505
- /** User menu items displayed in the dropdown */
506
- userMenu?: UserMenuItem[];
507
- /** Representing object with name, shortname, and orgNumber */
508
- representing?: Representing;
509
- /** Whether the user can change representation. Shows "Endre organisasjon" button */
510
- canChangeRepresentation?: boolean;
511
- /** Callback when user clicks "Endre organisasjon" */
512
- changeRepresentation?: () => void;
513
- /** @deprecated Use userMenu instead. Will show console.warn if used. */
514
- userMenuFooter?: UserMenuFooterItem[];
515
- /** @deprecated userOptions is no longer available. Use userMenu instead. */
516
- userOptions?: UserMenuItem[];
517
- /** Where to show the logout button: 'userMenu', 'header', 'both', or 'none' */
518
- logOutButtonPlacement?: TLogOutButtonPlacement;
519
- /** Callback when user clicks logout */
520
- logOut?: () => void;
521
- /** Show search input in the header */
522
- showSearch?: boolean;
523
- /** Callback when user submits search (presses Enter) */
524
- onSearch?: (query: string) => void;
525
- /** Callback when search input value changes */
526
- onSearchChange?: (query: string) => void;
527
- /** Controlled value for the search input */
528
- searchValue?: string;
529
- /** Placeholder text for the search input. Default: "Søk" */
530
- searchPlaceholder?: string;
531
- /** Custom breakpoint for responsive behavior (grid layout) in pixels. Default: 1024 */
532
- mobileBreakpoint?: number;
533
- /** Custom breakpoint for tablet responsive behavior (interaction pattern) in pixels. Default: 1280 */
534
- tabletBreakpoint?: number;
535
- /** Which menu is initially open */
536
- openedMenu?: THeaderMenu;
537
- /** Header position. 'fixed' fixes to top of viewport, 'relative' follows document flow. Default: 'fixed' */
538
- position?: THeaderPosition;
539
- /** Scroll behavior. 'hide' hides header on scroll down, 'none' keeps it visible. Default: 'hide' */
540
- scrollBehavior?: THeaderScrollBehavior;
541
- /** Variant for the slot menu button in tablet/mobile mode. Default: 'icon-only' */
542
- slotMenuVariant?: TSlotMenuVariant;
543
- /** Text for the slot menu button in tablet/mobile mode. Default: 'Meny' */
544
- slotMenuText?: string;
545
- }
546
-
547
- export declare interface IPktHeaderMenu extends Omit<HTMLAttributes<HTMLElement>, 'onError'>, IPktHeaderMenu_2 {
548
- /** Forwarded to the host element. */
549
- ref?: Ref<HTMLElement>;
550
- /** Fired when the payload has been fetched (or `data` was supplied). */
551
- onDataLoaded?: (data: THeaderFooterApi) => void;
552
- /** Fired when the fetch fails. */
553
- onDataError?: (error: Error) => void;
554
- /** Optional id of the toggle button that controls this menu. */
555
- ariaLabelledBy?: string;
556
- }
557
-
558
- export declare type IPktHeaderService = IPktHeader;
559
-
560
- declare interface IPktHeading extends HTMLAttributes<HTMLHeadingElement> {
561
- size?: TPktHeadingSize;
562
- level?: TPktHeadingLevel;
563
- weight?: TPktHeadingWeight;
564
- visuallyHidden?: boolean;
565
- align?: 'start' | 'center' | 'end';
566
- children?: ReactNode;
567
- }
568
-
569
- declare interface IPktHelptextProps extends HTMLAttributes<HTMLDivElement> {
570
- helptext?: string | ReactNode;
571
- helptextDropdown?: string | ReactNode;
572
- helptextDropdownButton?: string;
573
- forId?: string;
574
- onToggleHelpText?: (isOpen: boolean) => void;
575
- }
576
-
577
- declare interface IPktIcon extends HTMLAttributes<HTMLElement> {
578
- name?: string;
579
- path?: string;
580
- ariaHidden?: Booleanish;
581
- ariaLabel?: string;
582
- }
583
-
584
- export declare interface IPktInputWrapper extends RefAttributes<HTMLElement> {
585
- forId: string;
586
- label: string;
587
- helptext?: string | ReactNode;
588
- helptextDropdown?: string | ReactNode;
589
- helptextDropdownButton?: string;
590
- counter?: boolean;
591
- counterCurrent?: number;
592
- counterMaxLength?: number;
593
- optionalTag?: boolean;
594
- optionalText?: string;
595
- requiredTag?: boolean;
596
- requiredText?: string;
597
- tagText?: string | null;
598
- hasError?: boolean;
599
- errorMessage?: string | ReactNode;
600
- disabled?: boolean;
601
- inline?: boolean;
602
- ariaDescribedby?: string;
603
- useWrapper?: boolean;
604
- children?: ReactNode;
605
- className?: string;
606
- hasFieldset?: boolean;
607
- role?: string;
608
- counterPosition?: 'top' | 'bottom';
609
- }
610
-
611
- declare interface IPktLink extends LinkHTMLAttributes<HTMLAnchorElement> {
612
- href?: string;
613
- iconName?: string | undefined;
614
- className?: string | undefined;
615
- iconPosition?: string | undefined;
616
- external?: boolean;
617
- target?: string | undefined;
618
- renderLink?: (args: {
619
- href: string;
620
- className: string;
621
- children: ReactNode;
622
- props: AnchorHTMLAttributes<HTMLAnchorElement>;
623
- }) => ReactNode;
624
- }
625
-
626
- export declare interface IPktLinkCard extends Omit<HTMLAttributes<HTMLAnchorElement>, 'title'> {
627
- skin?: 'normal' | 'no-padding' | 'blue' | 'beige' | 'green' | 'gray' | 'beige-outline' | 'gray-outline';
628
- title?: string;
629
- href?: string;
630
- iconName?: string;
631
- openInNewTab?: boolean;
632
- external?: boolean;
633
- children?: ReactNode;
634
- }
635
-
636
- export declare interface IPktLoader extends HTMLAttributes<HTMLDivElement> {
637
- /**
638
- * Tid i millisekunder før loader vises. Nyttig når lastetiden kan være
639
- * så kort at loader ikke trengs.
640
- */
641
- delay?: number;
642
- /**
643
- * Vises loader inline eller som blokk.
644
- */
645
- inline?: boolean;
646
- /**
647
- * Styrer om loader eller barnenoder vises. Når `false` vises barnenoder.
648
- */
649
- isLoading?: boolean;
650
- /**
651
- * Meldingstekst som vises sammen med loader.
652
- */
653
- message?: string | null;
654
- /**
655
- * Størrelse på loader. Standard er "medium".
656
- */
657
- size?: TPktLoaderSize;
658
- /**
659
- * Loader-variant. Standard er "shapes" (Oslo-bølger). Andre er "blue" og "rainbow" (spinner-varianter).
660
- */
661
- variant?: TPktLoaderVariant;
662
- /**
663
- * Overstyrer stien til loader-animasjoner.
664
- */
665
- loadingAnimationPath?: string;
666
- children?: ReactNode;
667
- }
668
-
669
- export declare interface IPktMessagebox extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
670
- skin?: TMessageboxSkin;
671
- title?: ReactNode;
672
- compact?: boolean;
673
- closable?: boolean;
674
- onClose?: () => void;
675
- }
676
-
677
- export declare interface IPktModal extends Omit<HTMLAttributes<HTMLDialogElement>, 'onClose' | 'open'> {
678
- open?: boolean;
679
- headingText?: string;
680
- hideCloseButton?: boolean;
681
- closeOnBackdropClick?: boolean;
682
- size?: 'small' | 'medium' | 'large' | 'fit-content';
683
- removePadding?: boolean;
684
- closeButtonSkin?: 'blue' | 'yellow-filled';
685
- variant?: 'dialog' | 'drawer';
686
- drawerPosition?: 'left' | 'right';
687
- transparentBackdrop?: boolean;
688
- onClose?: () => void;
689
- children?: ReactNode;
690
- ref?: Ref<HTMLDialogElement>;
691
- }
692
-
693
- export declare interface IPktProgressbar extends Omit<HTMLAttributes<HTMLDivElement>, 'role' | 'title'> {
694
- ariaLabel?: string | null;
695
- ariaLabelledby?: string | null;
696
- ariaLive?: TAriaLive;
697
- ariaValueText?: string | null;
698
- id?: string;
699
- role?: TProgressbarRole;
700
- skin?: TProgressbarSkin;
701
- statusPlacement?: TProgressbarStatusPlacement;
702
- statusType?: TProgressbarStatusType;
703
- title?: string | null;
704
- titlePosition?: TProgressbarTitlePosition;
705
- valueCurrent: number;
706
- valueMax?: number;
707
- valueMin?: number;
708
- ref?: Ref<HTMLDivElement>;
709
- }
710
-
711
- export declare interface IPktRadioButton extends InputHTMLAttributes<HTMLInputElement> {
712
- id: string;
713
- name: string;
714
- label: string;
715
- hasTile?: boolean;
716
- disabled?: boolean;
717
- checkHelptext?: ReactNode | ReactNode[] | string;
718
- defaultChecked?: boolean;
719
- checked?: boolean;
720
- hasError?: boolean;
721
- value?: string;
722
- optionalTag?: boolean;
723
- optionalText?: string;
724
- requiredTag?: boolean;
725
- requiredText?: string;
726
- tagText?: string | null;
727
- onChange?: ChangeEventHandler<HTMLInputElement>;
728
- }
729
-
730
- declare interface IPktSelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
731
- ariaDescribedby?: string;
732
- ariaLabelledby?: string;
733
- children?: ReactNode | ReactNode[];
734
- disabled?: boolean;
735
- errorMessage?: string | ReactNode | ReactNode[];
736
- hasError?: boolean;
737
- helptext?: string | ReactNode | ReactNode[];
738
- helptextDropdown?: string | ReactNode | ReactNode[];
739
- helptextDropdownButton?: string;
740
- id: string;
741
- inline?: boolean;
742
- fullwidth?: boolean;
743
- label: string;
744
- name?: string;
745
- optionalTag?: boolean;
746
- optionalText?: string;
747
- requiredTag?: boolean;
748
- requiredText?: string;
749
- tagText?: string | null;
750
- options?: Array<{
751
- value: string;
752
- label: string;
753
- disabled?: boolean;
754
- }>;
755
- }
756
-
757
- export declare interface IPktStep {
758
- /**
759
- * Step content. Can be a string, a React component or an element.
760
- */
761
- children?: ReactNode;
762
- /**
763
- * Additional class names
764
- */
765
- className?: string;
766
- /**
767
- * Step status. Can be 'completed', 'incomplete' or 'current'
768
- */
769
- status: TStepStatus;
770
- /**
771
- * Title of the step
772
- */
773
- title: string;
774
- }
775
-
776
- export declare interface IPktStepper extends HTMLAttributes<HTMLOListElement> {
777
- /**
778
- * The index of the current active step
779
- */
780
- activeStep: number;
781
- /**
782
- * Children of the Stepper must be Step items. Either an Array of Step items or a single Step item.
783
- */
784
- children: ReactElement<IPktStep>[] | ReactElement<IPktStep>;
785
- /**
786
- * Additional class names
787
- */
788
- className?: string;
789
- /**
790
- * Boolean to hide the content of non-active steps content
791
- * @default true
792
- */
793
- hideNonActiveStepsContent?: boolean;
794
- /**
795
- * Boolean to hide the content and title of non-active steps
796
- * @default false
797
- */
798
- hideNonActiveSteps?: boolean;
799
- /**
800
- * Orientation of the stepper.
801
- * @default vertical
802
- */
803
- orientation?: 'horizontal' | 'vertical';
804
- }
805
-
806
- export declare interface IPktTab {
807
- text: string;
808
- href?: string;
809
- action?: (index: number) => void;
810
- disabled?: boolean;
811
- icon?: string;
812
- controls?: string;
813
- tag?: {
814
- text: string;
815
- skin: TTagSkin | undefined;
816
- };
817
- active?: boolean;
818
- }
819
-
820
- declare interface IPktTabItem {
821
- children: ReactNode;
822
- active?: boolean;
823
- disabled?: boolean;
824
- href?: string;
825
- onClick?: (event: MouseEvent_2) => void;
826
- icon?: string;
827
- controls?: string;
828
- tag?: string;
829
- tagSkin?: TTagSkin;
830
- index?: number;
831
- }
832
-
833
- declare interface IPktTabs {
834
- arrowNav?: boolean;
835
- disableArrowNav?: boolean;
836
- separatorIconName?: string;
837
- separatorIconPath?: string;
838
- tabs?: IPktTab[];
839
- onTabSelected?: (index: number) => void;
840
- children?: ReactNode;
841
- }
842
-
843
- export declare type IPktTag = ButtonPktTagProps | SpanPktTagProps;
844
-
845
- export declare interface IPktTextarea extends TextareaHTMLAttributes<HTMLTextAreaElement> {
846
- id: string;
847
- ariaDescribedby?: string;
848
- ariaLabelledby?: string;
849
- counter?: boolean;
850
- counterMaxLength?: number;
851
- disabled?: boolean;
852
- errorMessage?: string | ReactNode | ReactNode[];
853
- hasError?: boolean;
854
- helptext?: string | ReactNode | ReactNode[];
855
- helptextDropdown?: string | ReactNode | ReactNode[];
856
- helptextDropdownButton?: string;
857
- inline?: boolean;
858
- fullwidth?: boolean;
859
- label: string;
860
- name?: string;
861
- optionalTag?: boolean;
862
- optionalText?: string;
863
- requiredTag?: boolean;
864
- requiredText?: string;
865
- tagText?: string | null;
866
- placeholder?: string;
867
- rows?: number;
868
- useWrapper?: boolean;
869
- value?: string;
870
- autocomplete?: string;
871
- minLength?: number;
872
- maxLength?: number;
873
- readOnly?: boolean;
874
- required?: boolean;
875
- skipForwardTestid?: boolean;
876
- onChange?: ChangeEventHandler<HTMLTextAreaElement>;
877
- }
878
-
879
- export declare interface IPktTextinput extends InputHTMLAttributes<HTMLInputElement> {
880
- id: string;
881
- ariaDescribedby?: string;
882
- ariaLabelledby?: string;
883
- autocomplete?: string;
884
- counter?: boolean;
885
- counterMaxLength?: number;
886
- disabled?: boolean;
887
- errorMessage?: string | ReactNode | ReactNode[];
888
- hasError?: boolean;
889
- helptext?: string | ReactNode | ReactNode[];
890
- helptextDropdown?: string | ReactNode | ReactNode[];
891
- helptextDropdownButton?: string;
892
- iconNameRight?: string;
893
- inline?: boolean;
894
- fullwidth?: boolean;
895
- label: string;
896
- name?: string;
897
- optionalTag?: boolean;
898
- optionalText?: string;
899
- requiredTag?: boolean;
900
- requiredText?: string;
901
- tagText?: string | null;
902
- placeholder?: string;
903
- prefix?: string;
904
- suffix?: string;
905
- type?: string;
906
- useWrapper?: boolean;
907
- value?: string;
908
- omitSearchIcon?: boolean;
909
- min?: number | string;
910
- max?: number | string;
911
- minLength?: number;
912
- maxLength?: number;
913
- step?: string;
914
- size?: number;
915
- readonly?: boolean;
916
- required?: boolean;
917
- dataTestid?: string;
918
- onChange?: ChangeEventHandler<HTMLInputElement>;
919
- skipForwardTestid?: boolean;
920
- }
921
-
922
- /**
923
- * Props for {@link PktTimepicker}: a React time picker with `HH:MM`, aligned with Elements `pkt-timepicker`.
924
- *
925
- * The value is submitted via a hidden `input type="time"`; hour/minute fields are the editing UI. Use `value`
926
- * or `defaultValue` for controlled vs. uncontrolled mode.
927
- */
928
- export declare interface IPktTimepicker extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'min' | 'max' | 'step' | 'onFocus' | 'onBlur'> {
929
- /** Unique id; used for hour, minute, popup, and hidden input ids. */
930
- id: string;
931
- /** Visible label (InputWrapper). */
932
- label: string;
933
- /** Controlled value (`HH:MM`). */
934
- value?: string;
935
- /** Initial value when the component is uncontrolled. */
936
- defaultValue?: string;
937
- /**
938
- * Earliest valid time (`HH:MM`). May be a number or string (HTML attribute / RHF).
939
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time}
940
- */
941
- min?: string | number;
942
- /**
943
- * Latest valid time (`HH:MM`). May be a number or string (HTML attribute / RHF).
944
- */
945
- max?: string | number;
946
- /**
947
- * Step in **seconds** (e.g. `60` = 1 min, `300` = 5 min). Must be a valid multiple (same rules as Elements).
948
- * @default 60
949
- */
950
- step?: number;
951
- /** Hides the clock button and popup; shows a static clock icon. */
952
- hidePicker?: boolean;
953
- /** Shows previous/next step buttons instead of the popup. */
954
- stepArrows?: boolean;
955
- /** Full width (`pkt-timepicker--fullwidth`). */
956
- fullwidth?: boolean;
957
- /** Form field name on the hidden `input`; falls back to `id` if omitted. */
958
- name?: string;
959
- /** Help text above the field. */
960
- helptext?: string | ReactNode;
961
- /** Expandable help text (dropdown). */
962
- helptextDropdown?: string | ReactNode;
963
- /** Button label for expandable help text. */
964
- helptextDropdownButton?: string;
965
- /** Forces error state on the wrapper. */
966
- hasError?: boolean;
967
- /** Error message below the field. */
968
- errorMessage?: string | ReactNode;
969
- /** Shows an "optional" tag. */
970
- optionalTag?: boolean;
971
- /** Label text for the optional tag. */
972
- optionalText?: string;
973
- /** Shows a "required" tag. */
974
- requiredTag?: boolean;
975
- /** Label text for the required tag. */
976
- requiredText?: string;
977
- /** Extra tag next to the label. */
978
- tagText?: string | null;
979
- /** Inline layout in InputWrapper. */
980
- inline?: boolean;
981
- /** Show visible label and help text (`false` = screen-reader-only label). */
982
- useWrapper?: boolean;
983
- /** Passed through to InputWrapper as `aria-describedby`. */
984
- ariaDescribedby?: string;
985
- /** Copy for hours, minutes, buttons, and popup. */
986
- strings?: ITimepickerStrings;
987
- /** Change event from the hidden input (`e.target.value` is `HH:MM`). */
988
- onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
989
- /** Input events while typing or using spinners. */
990
- onInput?: (e: ChangeEvent<HTMLInputElement>) => void;
991
- /** Callback with the committed `HH:MM` string. */
992
- onValueChange?: (value: string) => void;
993
- /**
994
- * Fires when focus enters this control from outside (not when moving only between hour and minute).
995
- * Implemented on the root wrapper; spinbuttons must allow focus to bubble so this runs.
996
- */
997
- onFocus?: (e: FocusEvent_2<Element>) => void;
998
- /** Focus leaves the whole component. */
999
- onBlur?: (e: FocusEvent_2<Element>) => void;
1000
- /** Extra class names on the root (`pkt-timepicker`). */
1001
- className?: string;
1002
- }
1003
-
1004
- declare interface ISearch extends HTMLProps<HTMLInputElement> {
1005
- appearance?: 'local' | 'local-with-button' | 'global';
1006
- disabled?: boolean;
1007
- fullwidth?: boolean;
1008
- id: string;
1009
- label?: string;
1010
- name?: string;
1011
- placeholder?: string;
1012
- suggestions?: PktSearchInputSuggestion[];
1013
- value?: string | undefined;
1014
- onSearch?: (value: string) => void;
1015
- onSuggestionClick?: (index: number) => void;
1016
- action?: string;
1017
- method?: 'get' | 'post' | 'dialog';
1018
- }
1019
-
1020
- declare interface ISearchForm extends ISearch {
1021
- action?: string;
1022
- method?: 'get' | 'post' | 'dialog';
1023
- }
1024
-
1025
- declare interface ISearchInput extends ISearch {
1026
- onChange: (event: ChangeEvent<HTMLInputElement>) => void;
1027
- disabled?: boolean;
1028
- }
1029
-
1030
- declare interface ITableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {
1031
- className?: string;
1032
- children: ReactNode;
1033
- }
1034
-
1035
- declare interface ITableDataCellProps extends HTMLAttributes<HTMLTableCellElement> {
1036
- className?: string;
1037
- children?: ReactNode;
1038
- dataLabel?: string;
1039
- }
1040
-
1041
- declare interface ITableHeaderCellProps extends HTMLAttributes<HTMLTableCellElement> {
1042
- className?: string;
1043
- children: ReactNode;
1044
- }
1045
-
1046
- declare interface ITableHeaderProps extends HTMLAttributes<HTMLTableSectionElement> {
1047
- className?: string;
1048
- children: ReactNode;
1049
- }
1050
-
1051
- declare interface ITableProps extends HTMLAttributes<HTMLTableElement> {
1052
- compact?: boolean;
1053
- skin?: 'basic' | 'zebra-blue';
1054
- responsiveView?: boolean;
1055
- className?: string;
1056
- children: ReactNode;
1057
- }
1058
-
1059
- declare interface ITableRowProps extends HTMLAttributes<HTMLTableRowElement> {
1060
- className?: string;
1061
- children: ReactNode;
1062
- }
1063
-
1064
- export declare const ItemRenderers: Record<string, TItemRenderer>;
1065
-
1066
- declare interface Link {
1067
- href: string;
1068
- text: string;
1069
- external?: boolean;
1070
- openInNewTab?: boolean;
1071
- }
1072
-
1073
- export declare const PktAccordion: ForwardRefExoticComponent<IPktAccordion & RefAttributes<HTMLDivElement>>;
1074
-
1075
- export declare const PktAccordionItem: ForwardRefExoticComponent<IPktAccordionItem & RefAttributes<HTMLDetailsElement>>;
1076
-
1077
- export declare const PktAlert: FC<IPktAlert>;
1078
-
1079
- export declare const PktBackLink: ForwardRefExoticComponent<Omit<IPktBackLink, "ref"> & RefAttributes<HTMLElement>>;
1080
-
1081
- export declare const PktBreadcrumbs: ForwardRefExoticComponent<IPktBreadcrumbs & RefAttributes<HTMLAnchorElement>>;
1082
-
1083
- export declare const PktButton: ForwardRefExoticComponent<IPktButton & RefAttributes<HTMLButtonElement>>;
1084
-
1085
- export declare const PktCalendar: ForwardRefExoticComponent<IPktCalendar & RefAttributes<PktCalendarHandle>>;
1086
-
1087
- declare interface PktCalendarHandle {
1088
- handleDateSelect: (selectedDate: Date | null) => void;
1089
- addToSelected: (selectedDate: Date) => void;
1090
- removeFromSelected: (selectedDate: Date) => void;
1091
- toggleSelected: (selectedDate: Date) => void;
1092
- focusOnCurrentDate: () => void;
1093
- close: () => void;
1094
- }
1095
-
1096
- export declare const PktCard: ForwardRefExoticComponent<Omit<IPktCard, "ref"> & RefAttributes<HTMLDivElement>>;
1097
-
1098
- export declare const PktCheckbox: ForwardRefExoticComponent<IPktCheckbox & RefAttributes<HTMLInputElement>>;
1099
-
1100
- export declare const PktCombobox: ForwardRefExoticComponent<IPktCombobox & RefAttributes<HTMLDivElement>>;
1101
-
1102
- export declare const PktConsent: ForwardRefExoticComponent<IPktConsent & RefAttributes<HTMLElement>>;
1103
-
1104
- export declare const PktDatepicker: ForwardRefExoticComponent<IPktDatepicker & RefAttributes<HTMLDivElement>>;
1105
-
1106
- export declare const PktFileUpload: FC<IPktFileUpload>;
1107
-
1108
- export declare const PktFooter: FC<IPktFooter>;
1109
-
1110
- export declare const PktFooterSimple: FC<IPktFooterSimple>;
1111
-
1112
- /**
1113
- * PktHeader - Main header component for Oslo kommune services
1114
- *
1115
- * This component provides a complete header solution with:
1116
- * - Logo and service name
1117
- * - User menu with login/logout functionality
1118
- * - Search functionality
1119
- * - Responsive mobile menu
1120
- * - Fixed positioning with scroll-to-hide
1121
- *
1122
- * TODO: Add `type` prop to switch between `service` and `global` header types
1123
- */
1124
- export declare const PktHeader: ForwardRefExoticComponent<IPktHeader & RefAttributes<HTMLDivElement>>;
1125
-
1126
- /**
1127
- * `<PktHeaderMenu>` — global mega menu for Oslo kommune.
1128
- *
1129
- * Fetches the live header/footer payload on mount and renders the
1130
- * `megamenu` slice for the current locale. Mirrors `pkt-header-menu`
1131
- * (Punkt Elements) — both implementations share types and data
1132
- * helpers from `shared-utils/header-menu`.
1133
- *
1134
- * This component is purely presentational with respect to focus/scroll-lock;
1135
- * the parent header is expected to control `open` and own focus
1136
- * management.
1137
- */
1138
- export declare const PktHeaderMenu: ({ dataUrl, data, locale, open, mobileBreakpoint, ariaLabelledBy, className, onDataLoaded, onDataError, ref, ...rest }: IPktHeaderMenu) => JSX_2.Element;
1139
-
1140
- export declare const PktHeaderService: ForwardRefExoticComponent<IPktHeader & RefAttributes<HTMLDivElement>>;
1141
-
1142
- export declare const PktHeading: ForwardRefExoticComponent<IPktHeading & RefAttributes<HTMLHeadingElement>>;
1143
-
1144
- export declare const PktHelptext: ForwardRefExoticComponent<IPktHelptextProps & RefAttributes<HTMLDivElement>>;
1145
-
1146
- export declare const PktIcon: ForwardRefExoticComponent<IPktIcon & RefAttributes<HTMLSpanElement>>;
1147
-
1148
- /**
1149
- * Input component
1150
- * @param {string} label - Label for the input
1151
- * @param {string} id - Id for the input
1152
- * @param {string} validationMessage - Validation message for the input
1153
- * @param {InputHTMLAttributes<HTMLInputElement>} props - Other props to pass to the input
1154
- * @returns {ReactElement} - React element
1155
- *
1156
- * @example
1157
- * <Input label="First name" id="firstName" validationMessage="First name is required" />
1158
- *
1159
- */
1160
- export declare const PktInput: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
1161
-
1162
- export declare const PktInputWrapper: ForwardRefExoticComponent<Omit<IPktInputWrapper, "ref"> & RefAttributes<HTMLDivElement>>;
1163
-
1164
- export declare const PktLink: FC<IPktLink>;
1165
-
1166
- export declare const PktLinkCard: {
1167
- ({ children, skin, title, href, iconName, openInNewTab, external, className, ...props }: IPktLinkCard): JSX_2.Element;
1168
- displayName: string;
1169
- };
1170
-
1171
- export declare const PktLoader: ForwardRefExoticComponent<IPktLoader & RefAttributes<HTMLDivElement>>;
1172
-
1173
- export declare const PktMessagebox: FC<IPktMessagebox>;
1174
-
1175
- export declare const PktModal: ForwardRefExoticComponent<Omit<IPktModal, "ref"> & RefAttributes<HTMLDialogElement>>;
1176
-
1177
- export declare const PktProgressbar: ForwardRefExoticComponent<Omit<IPktProgressbar, "ref"> & RefAttributes<HTMLDivElement>>;
1178
-
1179
- export declare const PktRadioButton: ForwardRefExoticComponent<IPktRadioButton & RefAttributes<HTMLInputElement>>;
1180
-
1181
- export declare const PktSearchInput: ForwardRefExoticComponent<(Omit<ISearchForm, "ref"> | Omit<ISearchInput, "ref">) & RefAttributes<HTMLInputElement>>;
1182
-
1183
- /**
1184
- * React suggestion item: portable fields from {@link IPktSearchInputSuggestion}
1185
- * plus optional rich content and per-row handler.
1186
- */
1187
- export declare type PktSearchInputSuggestion = Omit<IPktSearchInputSuggestion, 'title' | 'text'> & {
1188
- title?: string | ReactNode;
1189
- text?: string | ReactNode;
1190
- onClick?: () => void;
1191
- };
1192
-
1193
- export declare const PktSelect: ForwardRefExoticComponent<IPktSelectProps & RefAttributes<HTMLSelectElement>>;
1194
-
1195
- export declare const PktStep: ({ children, className, status, title }: IPktStep) => JSX_2.Element;
1196
-
1197
- export declare const PktStepper: ForwardRefExoticComponent<IPktStepper & RefAttributes<HTMLOListElement>>;
1198
-
1199
- export declare const PktTabItem: ForwardRefExoticComponent<IPktTabItem & RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
1200
-
1201
- export declare const PktTable: ({ className, compact, skin, responsiveView, children, ...props }: ITableProps) => JSX_2.Element;
1202
-
1203
- export declare const PktTableBody: ({ id, children, className, ...props }: ITableBodyProps) => JSX_2.Element;
1204
-
1205
- export declare const PktTableDataCell: ({ children, className, dataLabel, ...props }: ITableDataCellProps) => JSX_2.Element;
1206
-
1207
- export declare const PktTableHeader: ({ className, children, ...props }: ITableHeaderProps) => JSX_2.Element;
1208
-
1209
- export declare const PktTableHeaderCell: ({ className, children, ...props }: ITableHeaderCellProps) => JSX_2.Element;
1210
-
1211
- export declare const PktTableRow: ({ className, children, ...props }: ITableRowProps) => JSX_2.Element;
1212
-
1213
- export declare const PktTabs: ForwardRefExoticComponent<IPktTabs & RefAttributes<HTMLDivElement>>;
1214
-
1215
- export declare const PktTag: ForwardRefExoticComponent<(ButtonPktTagProps | SpanPktTagProps) & RefAttributes<HTMLSpanElement | HTMLButtonElement>>;
1216
-
1217
- export declare const PktTextarea: ForwardRefExoticComponent<IPktTextarea & RefAttributes<HTMLTextAreaElement>>;
1218
-
1219
- export declare const PktTextinput: ForwardRefExoticComponent<IPktTextinput & RefAttributes<HTMLInputElement>>;
1220
-
1221
- export declare const PktTimepicker: ForwardRefExoticComponent<IPktTimepicker & RefAttributes<HTMLDivElement>>;
1222
-
1223
- /** Representing object for header components */
1224
- declare interface Representing {
1225
- name: string;
1226
- /** @deprecated shortname is deprecated and will be removed in a future version */
1227
- shortname?: string;
1228
- orgNumber?: string | number;
1229
- }
1230
-
1231
- declare interface SocialLink {
1232
- href: string;
1233
- iconName?: string;
1234
- language?: string;
1235
- openInNewTab?: boolean;
1236
- }
1237
-
1238
- declare interface SpanPktTagProps extends BasePktTagProps, HTMLAttributes<HTMLSpanElement> {
1239
- closeTag?: false | undefined;
1240
- onClose?: undefined;
1241
- type?: undefined;
1242
- }
1243
-
1244
- declare type TCardImageShape = 'square' | 'round';
1245
-
1246
- declare type TCardPadding = 'none' | 'default';
1247
-
1248
- declare type TCardTagPosition = 'top' | 'bottom';
1249
-
1250
- export declare type TFileAndTransfer = FileItem & Pick<TFileTransfer, 'progress' | 'errorMessage' | 'showProgress' | 'lastProgress'>;
1251
-
1252
- export declare type TFileAttribute<T> = {
1253
- get: (fileId: TFileId) => T | undefined;
1254
- set: (fileId: TFileId, attributeValue: T | undefined) => void;
1255
- };
1256
-
1257
- export declare type TFileAttributes = <T>(attributeName: string) => TFileAttribute<T>;
1258
-
1259
- /** Unique identifier assigned to each selected file. */
1260
- export declare type TFileId = string;
1261
-
1262
- /** The value type for `PktFileUpload` (`value` / `defaultValue`). */
1263
- export declare type TFileItemList = Array<FileItem>;
1264
-
1265
- /** Transfer status for a file when using `uploadStrategy="custom"` — aliased from `shared-types`. */
1266
- export declare type TFileTransfer = IFileTransfer;
1267
-
1268
- /** Detail payload passed to the React `onFileValidate` escape hatch. */
1269
- declare type TFileValidateDetail = IFileValidateDetail;
1270
-
1271
- declare type THeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
1272
-
1273
- /**
1274
- * Custom renderer for how a queue item is displayed (e.g. filename vs thumbnail grid).
1275
- *
1276
- * Must return a renderable React element (or `null`).
1277
- */
1278
- export declare type TItemRenderer = (props: {
1279
- transferItem: TFileAndTransfer;
1280
- queueItemOperations: Array<TQueueItemOperation>;
1281
- onPreviewClick?: () => void;
1282
- }) => ReactElement | null;
1283
-
1284
- declare type TPktAccordionSkin = TAccordionSkin;
1285
-
1286
- declare type TPktAccordionSkin_2 = TAccordionSkin;
1287
-
1288
- declare type TPktConsentTriggerType = 'button' | 'link' | 'footerlink' | 'icon';
1289
-
1290
- declare type TPktHeadingLevel = THeadingLevel_2;
1291
-
1292
- declare type TPktHeadingSize = THeadingSize;
1293
-
1294
- declare type TPktHeadingWeight = THeadingWeight;
1295
-
1296
- declare type TPktLoaderSize = 'small' | 'medium' | 'large';
1297
-
1298
- declare type TPktLoaderVariant = 'blue' | 'rainbow' | 'shapes';
1299
-
1300
- /**
1301
- * An operation that can be attached to a queue item (rename, comment, remove, etc).
1302
- *
1303
- * Must carry a stable `id: string` — symbols are no longer supported.
1304
- */
1305
- export declare type TQueueItemOperation = {
1306
- id: string;
1307
- title: TQueueOperationLabel;
1308
- ariaLabel?: TQueueOperationLabel;
1309
- onClick?: (context: TQueueOperationContext) => void;
1310
- renderInlineUI?: (context: TQueueOperationContext) => ReactNode;
1311
- renderExtendedUI?: (context: TQueueOperationContext) => ReactNode;
1312
- renderContent?: (context: TQueueOperationContext) => ReactNode;
1313
- renderHidden?: (context: TQueueOperationContext) => ReactNode;
1314
- };
1315
-
1316
- /**
1317
- * Context passed to queue-item operations. Mirrors the Lit
1318
- * `TQueueOperationContext` so operations authored for one runtime are
1319
- * trivial to port to the other.
1320
- */
1321
- export declare type TQueueOperationContext = {
1322
- file: FileItem;
1323
- inputName: string;
1324
- disabled: boolean;
1325
- isActive: boolean;
1326
- activate: () => void;
1327
- close: () => void;
1328
- getAttribute: <T>(name: string) => T | undefined;
1329
- setAttribute: (name: string, value: unknown) => void;
1330
- };
1331
-
1332
- declare type TQueueOperationLabel = string | ((fileItem: FileItem) => string);
1333
-
1334
- declare type TStepStatus = 'completed' | 'incomplete' | 'current';
1335
-
1336
- export declare type TTransferItemInProgress = TFileAndTransfer & {
1337
- progress: number;
1338
- };
1339
-
1340
- /** Upload mode: `form` posts the files on submit, `custom` posts file IDs and uploads separately. */
1341
- export declare type TUploadStrategy = TFileUploadStrategy;
1342
-
1343
- /** User object for header components */
1344
- declare interface User {
1345
- name: string;
1346
- /** @deprecated shortname is deprecated and will be removed in a future version */
1347
- shortname?: string;
1348
- lastLoggedIn?: string | Date;
1349
- }
1350
-
1351
- /** @deprecated Use UserMenuItem instead */
1352
- declare interface UserMenuFooterItem {
1353
- title: string;
1354
- target: string | (() => void);
1355
- }
1356
-
1357
- /** User menu item for header components */
1358
- declare interface UserMenuItem {
1359
- iconName?: string;
1360
- title: string;
1361
- target: string | (() => void);
1362
- }
1363
-
1364
- export { }
1
+ export * from './components';