rk-designsystem 1.0.0 → 1.1.1

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 (5) hide show
  1. package/README.md +214 -58
  2. package/dist/componentlibrary.es.js +6 -6
  3. package/dist/componentlibrary.umd.js +3 -3
  4. package/dist/index.d.ts +40 -21
  5. package/package.json +115 -106
package/README.md CHANGED
@@ -1,93 +1,249 @@
1
- # Design System Component Library (Norwegian Red Cross)
1
+ # Røde Kors Design System Component Library (Norwegian Red Cross)
2
2
 
3
- **Live Storybook URL:** [https://norwegianredcross.github.io/DesignSystem/storybook/](https://norwegianredcross.github.io/DesignSystem/storybook/)
3
+ ## Live Storybook URL
4
+
5
+ [https://norwegianredcross.github.io/DesignSystem/storybook/](https://norwegianredcross.github.io/DesignSystem/storybook/)
4
6
 
5
7
  ## Overview
6
8
 
7
- This repository contains a library of reusable UI components built with React and Vite, specifically tailored for Norwegian Red Cross digital projects. It leverages components and styling principles from [Digdir's Designsystemet](https://www.designsystemet.no/) while also including custom components to meet specific Red Cross requirements.
9
+ Welcome to the Røde Kors Design System! This repository contains a library of reusable UI components built with React, specifically tailored for Norwegian Red Cross digital projects.
10
+
11
+ It's developed leveraging the foundational components from Digdir's Designsystemet. This approach ensures a unified and recognizable visual identity across all applications for the Norwegian Red Cross. The system is pre-configured with the official Røde Kors brand theme, which is provided via a dedicated design token package.
12
+
13
+ The primary goal is to ensure brand consistency, improve development efficiency, and maintain high accessibility standards across all Røde Kors applications.
14
+
15
+ Storybook serves as the interactive documentation and development environment for viewing and testing these components.
16
+
17
+ ## Consuming This Library (For Application Developers)
18
+
19
+ To use the Røde Kors Design System in your Next.js (or any React) application:
20
+
21
+ ### 1. Installation
22
+
23
+ Install the necessary npm packages for your project. You will need three packages: the component library itself (`rk-designsystem`), the base styles from Digdir, and the Røde Kors theme package (`rk-design-tokens`).
24
+
25
+ ```bash
26
+ # npm
27
+ npm install rk-designsystem @digdir/designsystemet-css rk-design-tokens
28
+
29
+ # yarn
30
+ yarn add rk-designsystem @digdir/designsystemet-css rk-design-tokens
31
+
32
+ # pnpm
33
+ pnpm add rk-designsystem @digdir/designsystemet-css rk-design-tokens
34
+ ```
35
+
36
+ **Note:** You do not need to install `@digdir/designsystemet-react` separately, as all required components are included within the `rk-designsystem` package.
37
+
38
+ ### 2. Including Styles (CSS)
39
+
40
+ For the components to be styled correctly, you must import the stylesheets at the highest level of your application, for instance, in your `layout.tsx` (for Next.js App Router) or `_app.tsx` (for Next.js Pages Router).
41
+
42
+ **Crucial Order:** It's vital that the base stylesheet (`@digdir/designsystemet-css`) is loaded **before** the Røde Kors theme file (`rk-design-tokens`). This ensures our theme's tokens can correctly override the default values.
43
+
44
+ #### Example for Next.js (App Router - `src/app/layout.tsx`):
45
+
46
+ ```tsx
47
+ import './globals.css'; // Your own global styles (if any)
48
+ import '@digdir/designsystemet-css/index.css'; // Base stylesheet for components
49
+ import 'rk-design-tokens/design-tokens-build/theme.css'; // Røde Kors theme
50
+
51
+ export default function RootLayout({
52
+ children,
53
+ }: {
54
+ children: React.ReactNode;
55
+ }) {
56
+ return (
57
+ <html lang="en">
58
+ <body>{children}</body>
59
+ </html>
60
+ );
61
+ }
62
+ ```
63
+
64
+ #### Example for Next.js (Pages Router - `pages/_app.tsx`):
65
+
66
+ ```tsx
67
+ import '../styles/globals.css'; // Your own global styles (if any)
68
+ import '@digdir/designsystemet-css/index.css'; // Base stylesheet for components
69
+ import 'rk-design-tokens/design-tokens-build/theme.css'; // Røde Kors theme
70
+ import type { AppProps } from 'next/app';
71
+
72
+ function MyApp({ Component, pageProps }: AppProps) {
73
+ return <Component {...pageProps} />;
74
+ }
75
+
76
+ export default MyApp;
77
+ ```
78
+
79
+ ### 3. Using Components
80
+
81
+ Once the stylesheets are included, you can start importing and using components in your project. All components you need are available directly from the `rk-designsystem` package.
82
+
83
+ #### 3.1 Import and Use Røde Kors Design System Components
84
+
85
+ Import components directly from the `rk-designsystem` package:
86
+
87
+ ```tsx
88
+ import { Alert } from 'rk-designsystem'; // Import necessary components
89
+
90
+ function MyComponent() {
91
+ return (
92
+ <>
93
+ <Alert variant="info" onClose={() => console.log('Alert closed!')}>
94
+ This is an informational message from the Red Cross Design System.
95
+ </Alert>
96
+ </>
97
+ );
98
+ }
99
+ ```
100
+
101
+ #### 3.2 Example Usage in a Next.js Page
102
+
103
+ Here's an example of how to use multiple Alert components from the Røde Kors Design System within a Next.js page/component:
104
+
105
+ ```tsx
106
+ 'use client'; // Remember 'use client' for interactive components in App Router
107
+
108
+ import React from 'react';
109
+ import { Alert } from 'rk-designsystem'; // Import the components you need
110
+
111
+ export default function Home() {
112
+ return (
113
+ <div className="container mx-auto p-8">
114
+ <h1 className="text-3xl font-bold mb-8">
115
+ Røde Kors Design System Example
116
+ </h1>
117
+
118
+ <section>
119
+ <h2 className="text-2xl font-semibold mb-4">Alerts</h2>
120
+ {/* Røde Kors Design System Alerts */}
121
+ <Alert variant="success">
122
+ <p>
123
+ Welcome! This message is styled with the official Røde Kors theme.
124
+ </p>
125
+ </Alert>
126
+
127
+ <Alert variant="warning" className="mt-4">
128
+ <p>
129
+ Important information using the official Røde Kors theme.
130
+ </p>
131
+ </Alert>
132
+ </section>
133
+
134
+ {/* More Røde Kors components can be added here as needed */}
135
+ </div>
136
+ );
137
+ }
138
+ ```
139
+
140
+ The appearance of all components is fully controlled by the `rk-design-tokens` package. To receive any visual updates to the brand theme (like a new primary color), simply update the package to its latest version:
141
+
142
+ ```bash
143
+ npm update rk-design-tokens
144
+ ```
145
+
146
+ ---
147
+
148
+ # Contributing to the Component Library
149
+
150
+ This guide provides a set of standards and best practices for creating new components. Following these guidelines ensures that our component library remains consistent, accessible, and easy to maintain.
8
151
 
9
- The primary goal is to ensure brand consistency, improve development efficiency, and maintain high accessibility standards across applications.
152
+ ## Getting Started (for Contributors)
10
153
 
11
- [Storybook](https://norwegianredcross.github.io/DesignSystem/storybook/) serves as the interactive documentation and development environment for viewing and testing these components.
154
+ Follow these steps to get the local development environment running. All commands should be run from the root of the project.
12
155
 
13
- ## Features
156
+ ```bash
157
+ # 1. Install dependencies
158
+ pnpm i
14
159
 
15
- * **React Components:** Modern, functional React components.
16
- * **Vite Tooling:** Fast development and build process powered by Vite.
17
- * **TypeScript:** Enhanced code quality and maintainability.
18
- * **Digdir Designsystemet Integration:** Uses foundational components and styles from the national design system.
19
- * **Custom NRC Components:** Includes components built specifically for Norwegian Red Cross needs.
20
- * **Storybook:** Provides interactive documentation, visual testing, and component showcasing.
21
- * **Accessibility:** Built with accessibility (WCAG) considerations.
160
+ # 2. Build all packages
161
+ pnpm build
22
162
 
23
- ## Prerequisites
163
+ # 3. Start the local Storybook server
164
+ pnpm storybook
165
+ ```
24
166
 
25
- * [Node.js](https://nodejs.org/) (LTS version recommended, e.g., v18 or v20+)
26
- * [npm](https://www.npmjs.com/) (comes with Node.js) or [yarn](https://yarnpkg.com/) or [pnpm](https://pnpm.io/)
167
+ ## Core Principles
27
168
 
28
- ## Getting Started
169
+ Every component we build should adhere to these core principles:
29
170
 
30
- 1. **Clone the Repository:**
31
- ```bash
32
- git clone https://github.com/norwegianredcross/DesignSystem.git
33
- cd DesignSystem
34
- ```
171
+ 1. **Accessibility (A11y):** Components must be usable by everyone, including people with disabilities. This means proper ARIA attributes, keyboard navigation, and semantic HTML.
172
+ 2. **Reusability:** Components should be generic enough to be used in multiple contexts without modification.
173
+ 3. **Consistency:** Components should follow our established design tokens (colors, spacing, typography) and have a consistent API and structure.
174
+ 4. **Documentation:** Every component must be documented in Storybook to make it discoverable and easy for other developers to use.
35
175
 
36
- 2. **Switch to the correct branch:**
37
- The component library source code lives on the `Storybook-Demo` branch.
38
- ```bash
39
- git switch Storybook-Demo
40
- # Or git checkout Storybook-Demo
41
- ```
42
- *(Note: The root of this branch contains the component library project).*
176
+ ## When to Create a New Component
43
177
 
44
- 3. **Install Dependencies:**
45
- ```bash
46
- npm install
47
- # or: yarn install
48
- # or: pnpm install
49
- ```
178
+ Before you start coding, determine what kind of component you need. Most of our needs fall into one of three categories:
50
179
 
51
- ## Available Scripts
180
+ 1. **Wrapped Component (Simple):**
181
+ * **What it is:** A component that directly wraps and re-exports a component from `@digdir/designsystemet-react` with no modifications.
182
+ * **When to use:** When the base Digdir component meets our needs perfectly, but we want to include it in our own library for a consistent import source.
183
+ * **Example:** The `Buttons` component is a perfect example of this.
52
184
 
53
- In the project directory, you can run several commands:
185
+ 2. **Wrapped Component (with Style Overrides):**
186
+ * **What it is:** A wrapped Digdir component where we apply custom CSS to tweak its appearance to better match Røde Kors's specific design language.
187
+ * **When to use:** When a Digdir component is functionally correct but needs visual adjustments (e.g., different icons, border radius, padding).
188
+ * **Example:** The `Alert` component, which uses `composes` in its CSS to inherit base styles and then applies its own overrides.
54
189
 
55
- * ### `npm run storybook` or `yarn storybook` or `pnpm storybook`
190
+ 3. **Custom Component (from Scratch):**
191
+ * **What it is:** A completely new component built when no existing Digdir component meets our requirements.
192
+ * **When to use:** For unique UI patterns or functionality not covered by the base library.
193
+ * **Example:** The `DateInput` component is a custom component with its own state, logic, and styling.
56
194
 
57
- Runs the Storybook development server locally. Open [http://localhost:6006](http://localhost:6006) (or the specified port) to view the components interactively in your browser. This is the primary way to view and develop components.
195
+ ## Component File Structure
58
196
 
59
- * ### `npm run build-storybook` or `yarn build-storybook` or `pnpm build-storybook`
197
+ To maintain consistency, every new component should follow this file structure. Create a new folder under `src/components/` with the component's `PascalCase` name.
60
198
 
61
- Builds the static Storybook site for deployment (outputs to the `storybook-static` directory). This is configured with the correct base path for deployment to GitHub Pages.
199
+ ```text
200
+ src/
201
+ └── components/
202
+ └── MyNewComponent/
203
+ ├── index.ts // Public API - exports the component and props
204
+ ├── MyNewComponent.tsx // The React component logic and JSX
205
+ ├── MyNewComponent.stories.tsx // Storybook stories for documentation
206
+ ├── styles.module.css // Scoped CSS (only for custom components)
207
+ └── MyNewComponent.test.tsx // (Optional but Recommended) Unit tests
208
+ ```
62
209
 
63
- * ### `npm run build` or `yarn build` or `pnpm build`
210
+ ## Coding Guidelines
64
211
 
65
- Builds the component library itself for production (using `tsc` and `vite build`). The output is typically placed in the `dist` directory. This is used if you intend to publish the library as a package or consume its build artifacts directly.
212
+ ### 1. Component Logic (`MyNewComponent.tsx`)
66
213
 
67
- * ### `npm run lint` or `yarn lint` or `pnpm lint`
214
+ * **TypeScript First:** All components must be written in TypeScript. Define a `Props` interface for your component, extending from the base HTML element or Digdir component props if applicable.
215
+ * **Forward Refs:** Always use `React.forwardRef` to allow parent components to get a `ref` to the underlying DOM element.
216
+ * **Accessibility is Mandatory:**
217
+ * Use semantic HTML (`<button>`, `<label>`, `<nav>`).
218
+ * Ensure all interactive elements are keyboard-focusable and operable.
219
+ * Provide `aria-label` for icon-only buttons or elements where the text label is not visible.
220
+ * Use `aria-invalid`, `aria-describedby`, etc., to communicate state to assistive technologies.
221
+ * **Controlled vs. Uncontrolled:** If your component has state (like an input), it should support both controlled (`value` + `onChange`) and uncontrolled (`defaultValue`) patterns.
222
+ * **Props Naming:** Use `data-*` attributes for styling variants (e.g., `data-size`, `data-color`) to align with the patterns in our existing components.
68
223
 
69
- Runs the ESLint checker to find potential issues in the code.
224
+ ### 2. Styling (`styles.module.css`)
70
225
 
71
- * ### `npm run dev` or `yarn dev` or `pnpm dev`
226
+ * **CSS Modules:** For **custom components**, all styles must be placed in a `styles.module.css` file. This scopes class names locally and prevents global style conflicts.
227
+ * **Design Tokens:** Always use our design system tokens (`var(--ds-...)`) for colors, spacing, fonts, etc. Do not use hardcoded values (e.g., `#FFF`, `16px`).
228
+ * **Overriding Wrapped Components:** For **wrapped components**, use a standard CSS file. Use the `@layer` and `composes` keywords to extend base Digdir styles without increasing CSS specificity unnecessarily.
72
229
 
73
- Runs the Vite development server. This might be configured for library development mode or a minimal test app within the library project.
230
+ ### 3. Documentation (`MyNewComponent.stories.tsx`)
74
231
 
75
- * ### `npm run preview` or `yarn preview` or `pnpm preview`
232
+ Your Storybook file is the official documentation. It must be clear and comprehensive.
76
233
 
77
- Locally previews the production build of the *library* (from the `dist` directory), not Storybook.
234
+ * **`meta` Object:** Define the component's title, component reference, and `tags: ['autodocs']` to enable automatic documentation.
235
+ * **`argTypes`:** Document every single prop. Provide a `description`, `control` type (e.g., `select`, `boolean`, `text`), and `options` if applicable. This powers the interactive controls in Storybook.
236
+ * **Create Multiple Stories:** Create a separate story for each key state and variant of your component (e.g., `Default`, `Disabled`, `WithError`, `WithIcon`).
78
237
 
79
- The Storybook documentation site, showcasing all components and assets, is deployed to GitHub Pages.
238
+ ## Contribution Process
80
239
 
81
- * **Source Branch for Storybook Code:** `Storybook-Demo`
82
- * **Deployment Target:** `gh-pages` branch, under the `/storybook` subdirectory.
240
+ ### 1. Create a Pull Request (PR)
83
241
 
242
+ 1. **Create a Branch:** Pull the latest changes from the `main` branch and create a new feature branch: `git checkout -b feat/my-new-component`.
84
243
 
85
- Deployment is typically handled via manual `npx gh-pages` commands or could be automated with GitHub Actions (check `.github/workflows/` on the `main` branch for relevant workflows).
244
+ 2. **Open a Draft PR:** As soon as you start, open a **draft** pull request on GitHub. This prevents duplicate work and allows others to see what you're working on.
86
245
 
87
- ## Consuming This Library
246
+ 3. **Commit Your Changes:** As you work, make small, logical commits.
88
247
 
89
- *(Placeholder: This section needs to detail how other projects, like the Next.js demo app on the `main` branch, will consume this component library. Options include:*
90
- * *Publishing as an npm package (to npmjs.com or GitHub Packages).*
91
- * *Setting up monorepo workspaces (e.g., with npm, yarn, or pnpm) within the `DesignSystem` repository if both the library and consumer apps are to be developed in lockstep.*
92
- * *Using local path references (e.g., `file:...`) during development, with a more robust solution for production builds.)*
248
+ 4. **Ready for Review:** When development is complete and all automated checks are passing, mark the PR as "Ready for review" and request a review from the design system maintainers.
93
249
 
package/dist/componentlibrary.es.js CHANGED
@@ -45,7 +45,7 @@ var J = {};
45
45
  */
46
46
  var he;
47
47
  function wt() {
48
- return he || (he = 1, process.env.NODE_ENV !== "production" && function() {
48
+ return he || (he = 1, process.env.NODE_ENV !== "production" && (function() {
49
49
  function e(t) {
50
50
  if (t == null) return null;
51
51
  if (typeof t == "function")
@@ -241,11 +241,11 @@ React keys must be passed directly to JSX without using spread:
241
241
  return null;
242
242
  };
243
243
  j = {
244
- "react-stack-bottom-frame": function(t) {
244
+ react_stack_bottom_frame: function(t) {
245
245
  return t();
246
246
  }
247
247
  };
248
- var ee, te = {}, re = j["react-stack-bottom-frame"].bind(
248
+ var ee, te = {}, re = j.react_stack_bottom_frame.bind(
249
249
  j,
250
250
  d
251
251
  )(), ae = I(o(d)), ne = {};
@@ -274,7 +274,7 @@ React keys must be passed directly to JSX without using spread:
274
274
  b ? I(o(t)) : ae
275
275
  );
276
276
  };
277
- }()), J;
277
+ })()), J;
278
278
  }
279
279
  var pe;
280
280
  function Pt() {
@@ -288,7 +288,7 @@ Rt.displayName = "Avatar";
288
288
  const jt = ie((e, a) => /* @__PURE__ */ l.jsx($e, { ref: a, ...e }));
289
289
  jt.displayName = "Badge";
290
290
  const Ar = De, Or = Me, Wr = Ae, Br = Oe, Ir = We, Tt = de;
291
- Tt.displayName = "Buttons";
291
+ Tt.displayName = "Button";
292
292
  const Nt = Be, Fr = Ie;
293
293
  Nt.displayName = "Card";
294
294
  const St = Fe, $t = xe, Lr = Le;
@@ -1021,7 +1021,7 @@ export {
1021
1021
  Br as BreadcrumbsItem,
1022
1022
  Ir as BreadcrumbsLink,
1023
1023
  Wr as BreadcrumbsList,
1024
- Tt as Buttons,
1024
+ Tt as Button,
1025
1025
  Nt as Card,
1026
1026
  Fr as CardBlock,
1027
1027
  St as Checkbox,
package/dist/componentlibrary.umd.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(a,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("@digdir/designsystemet-react"),require("date-fns")):typeof define=="function"&&define.amd?define(["exports","react","@digdir/designsystemet-react","date-fns"],f):(a=typeof globalThis<"u"?globalThis:a||self,f(a.ComponentLibrary={},a.React,a.designsystemetReact,a.dateFns))})(this,function(a,f,o,m){"use strict";var ee={exports:{}},G={};/**
1
+ (function(a,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("@digdir/designsystemet-react"),require("date-fns")):typeof define=="function"&&define.amd?define(["exports","react","@digdir/designsystemet-react","date-fns"],f):(a=typeof globalThis<"u"?globalThis:a||self,f(a.ComponentLibrary={},a.React,a.designsystemetReact,a.dateFns))})(this,(function(a,f,o,m){"use strict";var ee={exports:{}},G={};/**
2
2
  * @license React
3
3
  * react-jsx-runtime.production.js
4
4
  *
@@ -14,9 +14,9 @@
14
14
  *
15
15
  * This source code is licensed under the MIT license found in the
16
16
  * LICENSE file in the root directory of this source tree.
17
- */var ue;function Se(){return ue||(ue=1,process.env.NODE_ENV!=="production"&&function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===H?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case B:return"Fragment";case O:return"Profiler";case c:return"StrictMode";case F:return"Suspense";case te:return"SuspenseList";case se:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case U:return"Portal";case I:return(t.displayName||"Context")+".Provider";case S:return(t._context.displayName||"Context")+".Consumer";case Q:var i=t.render;return t=t.displayName,t||(t=i.displayName||i.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case Z:return i=t.displayName||null,i!==null?i:e(t.type)||"Memo";case W:i=t._payload,t=t._init;try{return e(t(i))}catch{}}return null}function n(t){return""+t}function r(t){try{n(t);var i=!1}catch{i=!0}if(i){i=console;var d=i.error,p=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return d.call(i,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",p),n(t)}}function l(t){if(t===B)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===W)return"<...>";try{var i=e(t);return i?"<"+i+">":"<...>"}catch{return"<...>"}}function s(){var t=P.A;return t===null?null:t.getOwner()}function b(){return Error("react-stack-top-frame")}function h(t){if(L.call(t,"key")){var i=Object.getOwnPropertyDescriptor(t,"key").get;if(i&&i.isReactWarning)return!1}return t.key!==void 0}function v(t,i){function d(){re||(re=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",i))}d.isReactWarning=!0,Object.defineProperty(t,"key",{get:d,configurable:!0})}function E(){var t=e(this.type);return ne[t]||(ne[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function j(t,i,d,p,k,g,Y,q){return d=g.ref,t={$$typeof:y,type:t,key:i,props:g,_owner:k},(d!==void 0?d:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:E}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:Y}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:q}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function T(t,i,d,p,k,g,Y,q){var C=i.children;if(C!==void 0)if(p)if(R(C)){for(p=0;p<C.length;p++)w(C[p]);Object.freeze&&Object.freeze(C)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else w(C);if(L.call(i,"key")){C=e(t);var M=Object.keys(i).filter(function(D){return D!=="key"});p=0<M.length?"{key: someKey, "+M.join(": ..., ")+": ...}":"{key: someKey}",ie[C+p]||(M=0<M.length?"{"+M.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
17
+ */var ue;function Se(){return ue||(ue=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===H?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case B:return"Fragment";case O:return"Profiler";case c:return"StrictMode";case F:return"Suspense";case te:return"SuspenseList";case se:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case U:return"Portal";case I:return(t.displayName||"Context")+".Provider";case S:return(t._context.displayName||"Context")+".Consumer";case Q:var i=t.render;return t=t.displayName,t||(t=i.displayName||i.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case Z:return i=t.displayName||null,i!==null?i:e(t.type)||"Memo";case W:i=t._payload,t=t._init;try{return e(t(i))}catch{}}return null}function n(t){return""+t}function r(t){try{n(t);var i=!1}catch{i=!0}if(i){i=console;var d=i.error,p=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return d.call(i,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",p),n(t)}}function l(t){if(t===B)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===W)return"<...>";try{var i=e(t);return i?"<"+i+">":"<...>"}catch{return"<...>"}}function s(){var t=P.A;return t===null?null:t.getOwner()}function b(){return Error("react-stack-top-frame")}function h(t){if(L.call(t,"key")){var i=Object.getOwnPropertyDescriptor(t,"key").get;if(i&&i.isReactWarning)return!1}return t.key!==void 0}function v(t,i){function d(){re||(re=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",i))}d.isReactWarning=!0,Object.defineProperty(t,"key",{get:d,configurable:!0})}function E(){var t=e(this.type);return ne[t]||(ne[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function j(t,i,d,p,k,_,Y,q){return d=_.ref,t={$$typeof:y,type:t,key:i,props:_,_owner:k},(d!==void 0?d:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:E}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:Y}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:q}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function T(t,i,d,p,k,_,Y,q){var C=i.children;if(C!==void 0)if(p)if(R(C)){for(p=0;p<C.length;p++)w(C[p]);Object.freeze&&Object.freeze(C)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else w(C);if(L.call(i,"key")){C=e(t);var M=Object.keys(i).filter(function(D){return D!=="key"});p=0<M.length?"{key: someKey, "+M.join(": ..., ")+": ...}":"{key: someKey}",ie[C+p]||(M=0<M.length?"{"+M.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
18
18
  let props = %s;
19
19
  <%s {...props} />
20
20
  React keys must be passed directly to JSX without using spread:
21
21
  let props = %s;
22
- <%s key={someKey} {...props} />`,p,C,M,C),ie[C+p]=!0)}if(C=null,d!==void 0&&(r(d),C=""+d),h(i)&&(r(i.key),C=""+i.key),"key"in i){d={};for(var N in i)N!=="key"&&(d[N]=i[N])}else d=i;return C&&v(d,typeof t=="function"?t.displayName||t.name||"Unknown":t),j(t,C,g,k,s(),d,Y,q)}function w(t){typeof t=="object"&&t!==null&&t.$$typeof===y&&t._store&&(t._store.validated=1)}var x=f,y=Symbol.for("react.transitional.element"),U=Symbol.for("react.portal"),B=Symbol.for("react.fragment"),c=Symbol.for("react.strict_mode"),O=Symbol.for("react.profiler"),S=Symbol.for("react.consumer"),I=Symbol.for("react.context"),Q=Symbol.for("react.forward_ref"),F=Symbol.for("react.suspense"),te=Symbol.for("react.suspense_list"),Z=Symbol.for("react.memo"),W=Symbol.for("react.lazy"),se=Symbol.for("react.activity"),H=Symbol.for("react.client.reference"),P=x.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,L=Object.prototype.hasOwnProperty,R=Array.isArray,z=console.createTask?console.createTask:function(){return null};x={"react-stack-bottom-frame":function(t){return t()}};var re,ne={},ae=x["react-stack-bottom-frame"].bind(x,b)(),oe=z(l(b)),ie={};K.Fragment=B,K.jsx=function(t,i,d,p,k){var g=1e4>P.recentlyCreatedOwnerStacks++;return T(t,i,d,!1,p,k,g?Error("react-stack-top-frame"):ae,g?z(l(t)):oe)},K.jsxs=function(t,i,d,p,k){var g=1e4>P.recentlyCreatedOwnerStacks++;return T(t,i,d,!0,p,k,g?Error("react-stack-top-frame"):ae,g?z(l(t)):oe)}}()),K}var de;function Me(){return de||(de=1,process.env.NODE_ENV==="production"?ee.exports=Ne():ee.exports=Se()),ee.exports}var u=Me();const fe=f.forwardRef((e,n)=>u.jsx(o.Alert,{ref:n,...e}));fe.displayName="Alert";const me=f.forwardRef((e,n)=>u.jsx(o.Avatar,{ref:n,...e}));me.displayName="Avatar";const he=f.forwardRef((e,n)=>u.jsx(o.Badge,{ref:n,...e}));he.displayName="Badge";const De=o.BadgePosition,xe=o.Breadcrumbs,Oe=o.BreadcrumbsList,We=o.BreadcrumbsItem,Ae=o.BreadcrumbsLink,be=o.Button;be.displayName="Buttons";const ve=o.Card,Be=o.CardBlock;ve.displayName="Card";const pe=o.Checkbox,Ie=o.Fieldset,Le=o.useCheckboxGroup;pe.displayName="Checkbox",Ie.displayName="Fieldset";const Re=o.Chip;function le(e){return(n={})=>{const r=n.width?String(n.width):e.defaultWidth;return e.formats[r]||e.formats[e.defaultWidth]}}function X(e){return(n,r)=>{const l=r!=null&&r.context?String(r.context):"standalone";let s;if(l==="formatting"&&e.formattingValues){const h=e.defaultFormattingWidth||e.defaultWidth,v=r!=null&&r.width?String(r.width):h;s=e.formattingValues[v]||e.formattingValues[h]}else{const h=e.defaultWidth,v=r!=null&&r.width?String(r.width):e.defaultWidth;s=e.values[v]||e.values[h]}const b=e.argumentCallback?e.argumentCallback(n):n;return s[b]}}function J(e){return(n,r={})=>{const l=r.width,s=l&&e.matchPatterns[l]||e.matchPatterns[e.defaultMatchWidth],b=n.match(s);if(!b)return null;const h=b[0],v=l&&e.parsePatterns[l]||e.parsePatterns[e.defaultParseWidth],E=Array.isArray(v)?Ve(v,w=>w.test(h)):Ye(v,w=>w.test(h));let j;j=e.valueCallback?e.valueCallback(E):E,j=r.valueCallback?r.valueCallback(j):j;const T=n.slice(h.length);return{value:j,rest:T}}}function Ye(e,n){for(const r in e)if(Object.prototype.hasOwnProperty.call(e,r)&&n(e[r]))return r}function Ve(e,n){for(let r=0;r<e.length;r++)if(n(e[r]))return r}function Fe(e){return(n,r={})=>{const l=n.match(e.matchPattern);if(!l)return null;const s=l[0],b=n.match(e.parsePattern);if(!b)return null;let h=e.valueCallback?e.valueCallback(b[0]):b[0];h=r.valueCallback?r.valueCallback(h):h;const v=n.slice(s.length);return{value:h,rest:v}}}const He={lessThanXSeconds:{one:"mindre enn ett sekund",other:"mindre enn {{count}} sekunder"},xSeconds:{one:"ett sekund",other:"{{count}} sekunder"},halfAMinute:"et halvt minutt",lessThanXMinutes:{one:"mindre enn ett minutt",other:"mindre enn {{count}} minutter"},xMinutes:{one:"ett minutt",other:"{{count}} minutter"},aboutXHours:{one:"omtrent en time",other:"omtrent {{count}} timer"},xHours:{one:"en time",other:"{{count}} timer"},xDays:{one:"en dag",other:"{{count}} dager"},aboutXWeeks:{one:"omtrent en uke",other:"omtrent {{count}} uker"},xWeeks:{one:"en uke",other:"{{count}} uker"},aboutXMonths:{one:"omtrent en måned",other:"omtrent {{count}} måneder"},xMonths:{one:"en måned",other:"{{count}} måneder"},aboutXYears:{one:"omtrent ett år",other:"omtrent {{count}} år"},xYears:{one:"ett år",other:"{{count}} år"},overXYears:{one:"over ett år",other:"over {{count}} år"},almostXYears:{one:"nesten ett år",other:"nesten {{count}} år"}},ze=(e,n,r)=>{let l;const s=He[e];return typeof s=="string"?l=s:n===1?l=s.one:l=s.other.replace("{{count}}",String(n)),r!=null&&r.addSuffix?r.comparison&&r.comparison>0?"om "+l:l+" siden":l},Ge={full:"EEEE d. MMMM y",long:"d. MMMM y",medium:"d. MMM y",short:"dd.MM.y"},Ke={full:"'kl'. HH:mm:ss zzzz",long:"HH:mm:ss z",medium:"HH:mm:ss",short:"HH:mm"},Xe={full:"{{date}} 'kl.' {{time}}",long:"{{date}} 'kl.' {{time}}",medium:"{{date}} {{time}}",short:"{{date}} {{time}}"},Je={date:le({formats:Ge,defaultWidth:"full"}),time:le({formats:Ke,defaultWidth:"full"}),dateTime:le({formats:Xe,defaultWidth:"full"})},Ue={lastWeek:"'forrige' eeee 'kl.' p",yesterday:"'i går kl.' p",today:"'i dag kl.' p",tomorrow:"'i morgen kl.' p",nextWeek:"EEEE 'kl.' p",other:"P"},Qe=(e,n,r,l)=>Ue[e],Ze={narrow:["f.Kr.","e.Kr."],abbreviated:["f.Kr.","e.Kr."],wide:["før Kristus","etter Kristus"]},qe={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1. kvartal","2. kvartal","3. kvartal","4. kvartal"]},$e={narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["jan.","feb.","mars","apr.","mai","juni","juli","aug.","sep.","okt.","nov.","des."],wide:["januar","februar","mars","april","mai","juni","juli","august","september","oktober","november","desember"]},et={narrow:["S","M","T","O","T","F","L"],short:["sø","ma","ti","on","to","fr","lø"],abbreviated:["søn","man","tir","ons","tor","fre","lør"],wide:["søndag","mandag","tirsdag","onsdag","torsdag","fredag","lørdag"]},tt={narrow:{am:"a",pm:"p",midnight:"midnatt",noon:"middag",morning:"på morg.",afternoon:"på etterm.",evening:"på kvelden",night:"på natten"},abbreviated:{am:"a.m.",pm:"p.m.",midnight:"midnatt",noon:"middag",morning:"på morg.",afternoon:"på etterm.",evening:"på kvelden",night:"på natten"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnatt",noon:"middag",morning:"på morgenen",afternoon:"på ettermiddagen",evening:"på kvelden",night:"på natten"}},rt={ordinalNumber:(e,n)=>Number(e)+".",era:X({values:Ze,defaultWidth:"wide"}),quarter:X({values:qe,defaultWidth:"wide",argumentCallback:e=>e-1}),month:X({values:$e,defaultWidth:"wide"}),day:X({values:et,defaultWidth:"wide"}),dayPeriod:X({values:tt,defaultWidth:"wide"})},nt=/^(\d+)\.?/i,at=/\d+/i,ot={narrow:/^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,abbreviated:/^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,wide:/^(før Kristus|før vår tid|etter Kristus|vår tid)/i},it={any:[/^f/i,/^e/i]},lt={narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](\.)? kvartal/i},st={any:[/1/i,/2/i,/3/i,/4/i]},ct={narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mars?|apr|mai|juni?|juli?|aug|sep|okt|nov|des)\.?/i,wide:/^(januar|februar|mars|april|mai|juni|juli|august|september|oktober|november|desember)/i},ut={narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^mai/i,/^jun/i,/^jul/i,/^aug/i,/^s/i,/^o/i,/^n/i,/^d/i]},dt={narrow:/^[smtofl]/i,short:/^(sø|ma|ti|on|to|fr|lø)/i,abbreviated:/^(søn|man|tir|ons|tor|fre|lør)/i,wide:/^(søndag|mandag|tirsdag|onsdag|torsdag|fredag|lørdag)/i},ft={any:[/^s/i,/^m/i,/^ti/i,/^o/i,/^to/i,/^f/i,/^l/i]},mt={narrow:/^(midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten)|[ap])/i,any:/^([ap]\.?\s?m\.?|midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten))/i},ht={any:{am:/^a(\.?\s?m\.?)?$/i,pm:/^p(\.?\s?m\.?)?$/i,midnight:/^midn/i,noon:/^midd/i,morning:/morgen/i,afternoon:/ettermiddag/i,evening:/kveld/i,night:/natt/i}},bt={ordinalNumber:Fe({matchPattern:nt,parsePattern:at,valueCallback:e=>parseInt(e,10)}),era:J({matchPatterns:ot,defaultMatchWidth:"wide",parsePatterns:it,defaultParseWidth:"any"}),quarter:J({matchPatterns:lt,defaultMatchWidth:"wide",parsePatterns:st,defaultParseWidth:"any",valueCallback:e=>e+1}),month:J({matchPatterns:ct,defaultMatchWidth:"wide",parsePatterns:ut,defaultParseWidth:"any"}),day:J({matchPatterns:dt,defaultMatchWidth:"wide",parsePatterns:ft,defaultParseWidth:"any"}),dayPeriod:J({matchPatterns:mt,defaultMatchWidth:"any",parsePatterns:ht,defaultParseWidth:"any"})},V={code:"nb",formatDistance:ze,formatLong:Je,formatRelative:Qe,localize:rt,match:bt,options:{weekStartsOn:1,firstWeekContainsDate:4}},ke=({title:e,...n})=>u.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 28 28",fill:"none","aria-hidden":e?void 0:!0,focusable:"false",...n,children:[e&&u.jsx("title",{children:e}),u.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M16.952 6.96459C16.6103 6.62289 16.0563 6.62289 15.7146 6.96459L9.2979 13.3813C8.95621 13.723 8.95621 14.277 9.2979 14.6187L15.7146 21.0354C16.0563 21.3771 16.6103 21.3771 16.952 21.0354C17.2937 20.6937 17.2937 20.1396 16.952 19.7979L11.1541 14L16.952 8.20203C17.2937 7.86032 17.2937 7.3063 16.952 6.96459Z",fill:"currentColor"})]});ke.displayName="ChevronLeftIcon";const Ce=({title:e,...n})=>u.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 28 28",fill:"none","aria-hidden":e?void 0:!0,focusable:"false",...n,children:[e&&u.jsx("title",{children:e}),u.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.048 6.96459C11.3897 6.62289 11.9437 6.62289 12.2854 6.96459L18.7021 13.3813C19.0438 13.723 19.0438 14.277 18.7021 14.6187L12.2854 21.0354C11.9437 21.3771 11.3897 21.3771 11.048 21.0354C10.7063 20.6937 10.7063 20.1396 11.048 19.7979L16.8459 14L11.048 8.20203C10.7063 7.86032 10.7063 7.3063 11.048 6.96459Z",fill:"currentColor"})]});Ce.displayName="ChevronRightIcon";const _={calendarContainer:"_calendarContainer_mtooc_5",calendarHeader:"_calendarHeader_mtooc_33",monthYear:"_monthYear_mtooc_47",navigationButtons:"_navigationButtons_mtooc_71",grid:"_grid_mtooc_89",dayNameCell:"_dayNameCell_mtooc_105",dateCell:"_dateCell_mtooc_143",dateNumberContainer:"_dateNumberContainer_mtooc_213",otherMonth:"_otherMonth_mtooc_249",selectedDate:"_selectedDate_mtooc_313"},vt=e=>{const n=m.startOfMonth(e),r=m.startOfWeek(n,{locale:V}),l=m.addDays(r,41);return m.eachDayOfInterval({start:r,end:l})},ge=e=>e&&e.charAt(0).toUpperCase()+e.slice(1),_e=({initialDate:e=new Date,selectedDate:n=null,onDateSelect:r})=>{const[l,s]=f.useState(m.startOfMonth(n&&m.isValid(n)?n:e));f.useEffect(()=>{if(n&&m.isValid(n)){const c=m.startOfMonth(n);m.isSameMonth(c,l)||s(c)}},[n]);const b=f.useMemo(()=>m.startOfMonth(new Date),[]),h=f.useMemo(()=>!1,[l,b]),v=f.useMemo(()=>vt(l),[l]),E=f.useMemo(()=>{const c=m.startOfWeek(new Date,{locale:V});return Array.from({length:7}).map((O,S)=>{const I=m.format(m.addDays(c,S),"EEEEEE",{locale:V});return ge(I)})},[]),j=f.useCallback(()=>{h||s(c=>m.startOfMonth(m.subMonths(c,1)))},[h]),T=f.useCallback(()=>{s(c=>m.startOfMonth(m.addMonths(c,1)))},[]),w=f.useCallback(c=>{r&&r(c)},[r]),x=f.useCallback((c,O)=>{(c.key==="Enter"||c.key===" ")&&(c.preventDefault(),w(O))},[w]),y=m.format(l,"MMMM",{locale:V}),U=m.format(l,"yyyy",{locale:V}),B=`${ge(y)} ${U}`;return u.jsxs("div",{className:_.calendarContainer,children:[u.jsxs("div",{className:_.calendarHeader,children:[u.jsx("span",{className:_.monthYear,children:B}),u.jsxs("div",{className:_.navigationButtons,children:[u.jsx(o.Button,{variant:"tertiary",icon:!0,onClick:j,"aria-label":"Forrige måned",disabled:h,children:u.jsx(ke,{})}),u.jsx(o.Button,{variant:"tertiary",icon:!0,onClick:T,"aria-label":"Neste måned",children:u.jsx(Ce,{})})]})]}),u.jsx("div",{className:_.grid,children:E.map(c=>u.jsx("div",{className:_.dayNameCell,children:c},c))}),u.jsx("div",{className:_.grid,children:v.map(c=>{const O=m.isSameMonth(c,l),S=n&&m.isValid(n)&&m.isSameDay(c,n),I=m.isToday(c),Q=[_.dateCell,O?"":_.otherMonth,S?_.selectedDate:"",I&&!S?_.todayDate:""].filter(Boolean).join(" ");return u.jsx("div",{className:Q,onClick:()=>w(c),onKeyDown:F=>x(F,c),role:"button",tabIndex:0,"aria-pressed":S??!1,"aria-label":m.format(c,"PPP",{locale:V}),children:u.jsx("span",{className:_.dateNumberContainer,children:m.format(c,"d")})},c.toISOString())})})]})};_e.displayName="DatePicker";const A={fieldset:"_fieldset_s5r8s_7",description:"_description_s5r8s_29",error:"_error_s5r8s_43",inputWrapper:"_inputWrapper_s5r8s_59",inputWrapperError:"_inputWrapperError_s5r8s_83",suffixButton:"_suffixButton_s5r8s_199",suffixButtonInteractive:"_suffixButtonInteractive_s5r8s_239"},we=e=>{const n=e.slice(0,2),r=e.slice(2,4),l=e.slice(4,8);return e.length>4?`${n}.${r}.${l}`:e.length>2?`${n}.${r}`:e.length>0?n:""},Pe=e=>(e||"").replace(/\D/g,""),Ee=e=>{let n=e;if(n.length>=2){const r=parseInt(n.substring(0,2),10);!isNaN(r)&&r>31&&(n="31"+n.substring(2))}if(n.length>=4){const r=parseInt(n.substring(2,4),10);!isNaN(r)&&r>12&&(n=n.substring(0,2)+"12"+n.substring(4))}return n.slice(0,8)},je=f.forwardRef((e,n)=>{const{label:r,suffixIcon:l,onSuffixClick:s,className:b,inputWrapperClassName:h,inputClassName:v,value:E,defaultValue:j,onChange:T,readOnly:w,placeholder:x="dd.mm.åååå",id:y,name:U,required:B,disabled:c,onClick:O,onFocus:S,onBlur:I,autoComplete:Q="off","aria-label":F,"aria-labelledby":te,description:Z,error:W,...se}=e,H=E!==void 0,P=f.useRef(null);f.useImperativeHandle(n,()=>P.current);const L=f.useCallback(k=>{const g=Pe(k),Y=Ee(g);return we(Y)},[]),[R,z]=f.useState(()=>L(E??j));f.useEffect(()=>{if(H){const k=L(E);k!==R&&(z(k),P.current&&P.current.value!==k&&(P.current.value=k))}},[E,H,R,L]);const re=f.useCallback(k=>{const g=k.target,Y=g.value,q=R,C=Pe(Y).slice(0,8),M=Ee(C),N=we(M);let D=0;const $=M.length;$<=2?D=$:$<=4?D=$+1:D=$+2,D=Math.min(D,N.length),requestAnimationFrame(()=>{if(P.current&&(z(N),P.current.value=N,P.current.setSelectionRange(D,D),(N!==q||H)&&T)){const Gt={...k,target:{...g,value:N}};T(Gt,N)}})},[R,H,T,L]),ne=[A.fieldset,b].filter(Boolean).join(" "),ae=[A.inputWrapper,h,W?A.inputWrapperError:""].filter(Boolean).join(" "),oe=[v].filter(Boolean).join(" "),ie=[A.suffixButton,s?A.suffixButtonInteractive:""].filter(Boolean).join(" ");!r&&!F&&!te&&console.warn("Warning: DateInput component should have a label, aria-label, or aria-labelledby for accessibility.");const t=r&&typeof r=="string"?te||`${y}-label`:void 0,i=Z?`${y}-desc`:void 0,d=W?`${y}-err`:void 0,p=[i,d].filter(Boolean).join(" ")||void 0;return u.jsxs("div",{className:ne,children:[r&&typeof r=="string"?u.jsx("label",{id:t,htmlFor:y,children:r}):r,Z&&u.jsxs("p",{id:i,className:A.description,children:[" ",Z]}),u.jsxs("div",{className:ae,children:[u.jsx("input",{ref:P,type:"text",inputMode:"numeric",pattern:"\\d{2}\\.\\d{2}\\.\\d{4}",maxLength:10,value:R,readOnly:w,placeholder:x,id:y,name:U,required:B,disabled:c,onClick:O,onChange:re,onFocus:S,onBlur:I,autoComplete:Q,"aria-label":F,"aria-labelledby":t,"aria-describedby":p,"aria-invalid":!!W,className:oe,...se}),l&&u.jsx("button",{type:"button",className:ie,onClick:c?void 0:s,tabIndex:s&&!c?0:-1,"aria-hidden":!s,disabled:c,"aria-label":s?"Åpne datovelger":void 0,children:l})]}),W&&u.jsx("p",{id:d,className:A.error,role:"alert",children:W})]})});je.displayName="DateInput";const pt=o.Details,kt=o.Dialog,Ct=o.Divider,gt=o.Dropdown,_t=o.ErrorSummary,wt=o.Field,Te=o.FieldDescription,ye=o.FieldCounter;Te.displayName="Field.Description",ye.displayName="Field.Counter";const Pt=o.Fieldset,Et=o.Input,jt=o.Link,Tt=o.List,yt=o.Pagination,Nt=o.usePagination,St=o.Popover,Mt=o.Radio,Dt=o.useRadioGroup,xt=o.Search,Ot=o.Select,Wt=o.Skeleton,At=o.SkipLink,Bt=o.Spinner,It=o.Switch,Lt=o.Table,Rt=o.Tabs,Yt=o.Tag,Vt=o.Textarea,Ft=o.Textfield,Ht=o.ToggleGroup,zt=o.Tooltip;a.Alert=fe,a.Avatar=me,a.Badge=he,a.BadgePosition=De,a.Breadcrumbs=xe,a.BreadcrumbsItem=We,a.BreadcrumbsLink=Ae,a.BreadcrumbsList=Oe,a.Buttons=be,a.Card=ve,a.CardBlock=Be,a.Checkbox=pe,a.Chip=Re,a.DateInput=je,a.DatePicker=_e,a.Details=pt,a.Dialog=kt,a.Divider=Ct,a.Dropdown=gt,a.ErrorSummary=_t,a.Field=wt,a.FieldCounter=ye,a.FieldDescription=Te,a.Fieldset=Pt,a.Input=Et,a.Link=jt,a.List=Tt,a.Pagination=yt,a.Popover=St,a.Radio=Mt,a.Search=xt,a.Select=Ot,a.SkeletonLoader=Wt,a.SkipLink=At,a.Spinner=Bt,a.Switch=It,a.Table=Lt,a.Tabs=Rt,a.Tag=Yt,a.Textarea=Vt,a.Textfield=Ft,a.ToggleGroup=Ht,a.Tooltip=zt,a.useCheckboxGroup=Le,a.usePagination=Nt,a.useRadioGroup=Dt,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});
22
+ <%s key={someKey} {...props} />`,p,C,M,C),ie[C+p]=!0)}if(C=null,d!==void 0&&(r(d),C=""+d),h(i)&&(r(i.key),C=""+i.key),"key"in i){d={};for(var N in i)N!=="key"&&(d[N]=i[N])}else d=i;return C&&v(d,typeof t=="function"?t.displayName||t.name||"Unknown":t),j(t,C,_,k,s(),d,Y,q)}function w(t){typeof t=="object"&&t!==null&&t.$$typeof===y&&t._store&&(t._store.validated=1)}var x=f,y=Symbol.for("react.transitional.element"),U=Symbol.for("react.portal"),B=Symbol.for("react.fragment"),c=Symbol.for("react.strict_mode"),O=Symbol.for("react.profiler"),S=Symbol.for("react.consumer"),I=Symbol.for("react.context"),Q=Symbol.for("react.forward_ref"),F=Symbol.for("react.suspense"),te=Symbol.for("react.suspense_list"),Z=Symbol.for("react.memo"),W=Symbol.for("react.lazy"),se=Symbol.for("react.activity"),H=Symbol.for("react.client.reference"),P=x.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,L=Object.prototype.hasOwnProperty,R=Array.isArray,z=console.createTask?console.createTask:function(){return null};x={react_stack_bottom_frame:function(t){return t()}};var re,ne={},ae=x.react_stack_bottom_frame.bind(x,b)(),oe=z(l(b)),ie={};K.Fragment=B,K.jsx=function(t,i,d,p,k){var _=1e4>P.recentlyCreatedOwnerStacks++;return T(t,i,d,!1,p,k,_?Error("react-stack-top-frame"):ae,_?z(l(t)):oe)},K.jsxs=function(t,i,d,p,k){var _=1e4>P.recentlyCreatedOwnerStacks++;return T(t,i,d,!0,p,k,_?Error("react-stack-top-frame"):ae,_?z(l(t)):oe)}})()),K}var de;function Me(){return de||(de=1,process.env.NODE_ENV==="production"?ee.exports=Ne():ee.exports=Se()),ee.exports}var u=Me();const fe=f.forwardRef((e,n)=>u.jsx(o.Alert,{ref:n,...e}));fe.displayName="Alert";const me=f.forwardRef((e,n)=>u.jsx(o.Avatar,{ref:n,...e}));me.displayName="Avatar";const he=f.forwardRef((e,n)=>u.jsx(o.Badge,{ref:n,...e}));he.displayName="Badge";const De=o.BadgePosition,xe=o.Breadcrumbs,Oe=o.BreadcrumbsList,We=o.BreadcrumbsItem,Ae=o.BreadcrumbsLink,be=o.Button;be.displayName="Button";const ve=o.Card,Be=o.CardBlock;ve.displayName="Card";const pe=o.Checkbox,Ie=o.Fieldset,Le=o.useCheckboxGroup;pe.displayName="Checkbox",Ie.displayName="Fieldset";const Re=o.Chip;function le(e){return(n={})=>{const r=n.width?String(n.width):e.defaultWidth;return e.formats[r]||e.formats[e.defaultWidth]}}function X(e){return(n,r)=>{const l=r!=null&&r.context?String(r.context):"standalone";let s;if(l==="formatting"&&e.formattingValues){const h=e.defaultFormattingWidth||e.defaultWidth,v=r!=null&&r.width?String(r.width):h;s=e.formattingValues[v]||e.formattingValues[h]}else{const h=e.defaultWidth,v=r!=null&&r.width?String(r.width):e.defaultWidth;s=e.values[v]||e.values[h]}const b=e.argumentCallback?e.argumentCallback(n):n;return s[b]}}function J(e){return(n,r={})=>{const l=r.width,s=l&&e.matchPatterns[l]||e.matchPatterns[e.defaultMatchWidth],b=n.match(s);if(!b)return null;const h=b[0],v=l&&e.parsePatterns[l]||e.parsePatterns[e.defaultParseWidth],E=Array.isArray(v)?Ve(v,w=>w.test(h)):Ye(v,w=>w.test(h));let j;j=e.valueCallback?e.valueCallback(E):E,j=r.valueCallback?r.valueCallback(j):j;const T=n.slice(h.length);return{value:j,rest:T}}}function Ye(e,n){for(const r in e)if(Object.prototype.hasOwnProperty.call(e,r)&&n(e[r]))return r}function Ve(e,n){for(let r=0;r<e.length;r++)if(n(e[r]))return r}function Fe(e){return(n,r={})=>{const l=n.match(e.matchPattern);if(!l)return null;const s=l[0],b=n.match(e.parsePattern);if(!b)return null;let h=e.valueCallback?e.valueCallback(b[0]):b[0];h=r.valueCallback?r.valueCallback(h):h;const v=n.slice(s.length);return{value:h,rest:v}}}const He={lessThanXSeconds:{one:"mindre enn ett sekund",other:"mindre enn {{count}} sekunder"},xSeconds:{one:"ett sekund",other:"{{count}} sekunder"},halfAMinute:"et halvt minutt",lessThanXMinutes:{one:"mindre enn ett minutt",other:"mindre enn {{count}} minutter"},xMinutes:{one:"ett minutt",other:"{{count}} minutter"},aboutXHours:{one:"omtrent en time",other:"omtrent {{count}} timer"},xHours:{one:"en time",other:"{{count}} timer"},xDays:{one:"en dag",other:"{{count}} dager"},aboutXWeeks:{one:"omtrent en uke",other:"omtrent {{count}} uker"},xWeeks:{one:"en uke",other:"{{count}} uker"},aboutXMonths:{one:"omtrent en måned",other:"omtrent {{count}} måneder"},xMonths:{one:"en måned",other:"{{count}} måneder"},aboutXYears:{one:"omtrent ett år",other:"omtrent {{count}} år"},xYears:{one:"ett år",other:"{{count}} år"},overXYears:{one:"over ett år",other:"over {{count}} år"},almostXYears:{one:"nesten ett år",other:"nesten {{count}} år"}},ze=(e,n,r)=>{let l;const s=He[e];return typeof s=="string"?l=s:n===1?l=s.one:l=s.other.replace("{{count}}",String(n)),r!=null&&r.addSuffix?r.comparison&&r.comparison>0?"om "+l:l+" siden":l},Ge={full:"EEEE d. MMMM y",long:"d. MMMM y",medium:"d. MMM y",short:"dd.MM.y"},Ke={full:"'kl'. HH:mm:ss zzzz",long:"HH:mm:ss z",medium:"HH:mm:ss",short:"HH:mm"},Xe={full:"{{date}} 'kl.' {{time}}",long:"{{date}} 'kl.' {{time}}",medium:"{{date}} {{time}}",short:"{{date}} {{time}}"},Je={date:le({formats:Ge,defaultWidth:"full"}),time:le({formats:Ke,defaultWidth:"full"}),dateTime:le({formats:Xe,defaultWidth:"full"})},Ue={lastWeek:"'forrige' eeee 'kl.' p",yesterday:"'i går kl.' p",today:"'i dag kl.' p",tomorrow:"'i morgen kl.' p",nextWeek:"EEEE 'kl.' p",other:"P"},Qe=(e,n,r,l)=>Ue[e],Ze={narrow:["f.Kr.","e.Kr."],abbreviated:["f.Kr.","e.Kr."],wide:["før Kristus","etter Kristus"]},qe={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1. kvartal","2. kvartal","3. kvartal","4. kvartal"]},$e={narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["jan.","feb.","mars","apr.","mai","juni","juli","aug.","sep.","okt.","nov.","des."],wide:["januar","februar","mars","april","mai","juni","juli","august","september","oktober","november","desember"]},et={narrow:["S","M","T","O","T","F","L"],short:["sø","ma","ti","on","to","fr","lø"],abbreviated:["søn","man","tir","ons","tor","fre","lør"],wide:["søndag","mandag","tirsdag","onsdag","torsdag","fredag","lørdag"]},tt={narrow:{am:"a",pm:"p",midnight:"midnatt",noon:"middag",morning:"på morg.",afternoon:"på etterm.",evening:"på kvelden",night:"på natten"},abbreviated:{am:"a.m.",pm:"p.m.",midnight:"midnatt",noon:"middag",morning:"på morg.",afternoon:"på etterm.",evening:"på kvelden",night:"på natten"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnatt",noon:"middag",morning:"på morgenen",afternoon:"på ettermiddagen",evening:"på kvelden",night:"på natten"}},rt={ordinalNumber:(e,n)=>Number(e)+".",era:X({values:Ze,defaultWidth:"wide"}),quarter:X({values:qe,defaultWidth:"wide",argumentCallback:e=>e-1}),month:X({values:$e,defaultWidth:"wide"}),day:X({values:et,defaultWidth:"wide"}),dayPeriod:X({values:tt,defaultWidth:"wide"})},nt=/^(\d+)\.?/i,at=/\d+/i,ot={narrow:/^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,abbreviated:/^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,wide:/^(før Kristus|før vår tid|etter Kristus|vår tid)/i},it={any:[/^f/i,/^e/i]},lt={narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](\.)? kvartal/i},st={any:[/1/i,/2/i,/3/i,/4/i]},ct={narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mars?|apr|mai|juni?|juli?|aug|sep|okt|nov|des)\.?/i,wide:/^(januar|februar|mars|april|mai|juni|juli|august|september|oktober|november|desember)/i},ut={narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^mai/i,/^jun/i,/^jul/i,/^aug/i,/^s/i,/^o/i,/^n/i,/^d/i]},dt={narrow:/^[smtofl]/i,short:/^(sø|ma|ti|on|to|fr|lø)/i,abbreviated:/^(søn|man|tir|ons|tor|fre|lør)/i,wide:/^(søndag|mandag|tirsdag|onsdag|torsdag|fredag|lørdag)/i},ft={any:[/^s/i,/^m/i,/^ti/i,/^o/i,/^to/i,/^f/i,/^l/i]},mt={narrow:/^(midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten)|[ap])/i,any:/^([ap]\.?\s?m\.?|midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten))/i},ht={any:{am:/^a(\.?\s?m\.?)?$/i,pm:/^p(\.?\s?m\.?)?$/i,midnight:/^midn/i,noon:/^midd/i,morning:/morgen/i,afternoon:/ettermiddag/i,evening:/kveld/i,night:/natt/i}},bt={ordinalNumber:Fe({matchPattern:nt,parsePattern:at,valueCallback:e=>parseInt(e,10)}),era:J({matchPatterns:ot,defaultMatchWidth:"wide",parsePatterns:it,defaultParseWidth:"any"}),quarter:J({matchPatterns:lt,defaultMatchWidth:"wide",parsePatterns:st,defaultParseWidth:"any",valueCallback:e=>e+1}),month:J({matchPatterns:ct,defaultMatchWidth:"wide",parsePatterns:ut,defaultParseWidth:"any"}),day:J({matchPatterns:dt,defaultMatchWidth:"wide",parsePatterns:ft,defaultParseWidth:"any"}),dayPeriod:J({matchPatterns:mt,defaultMatchWidth:"any",parsePatterns:ht,defaultParseWidth:"any"})},V={code:"nb",formatDistance:ze,formatLong:Je,formatRelative:Qe,localize:rt,match:bt,options:{weekStartsOn:1,firstWeekContainsDate:4}},ke=({title:e,...n})=>u.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 28 28",fill:"none","aria-hidden":e?void 0:!0,focusable:"false",...n,children:[e&&u.jsx("title",{children:e}),u.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M16.952 6.96459C16.6103 6.62289 16.0563 6.62289 15.7146 6.96459L9.2979 13.3813C8.95621 13.723 8.95621 14.277 9.2979 14.6187L15.7146 21.0354C16.0563 21.3771 16.6103 21.3771 16.952 21.0354C17.2937 20.6937 17.2937 20.1396 16.952 19.7979L11.1541 14L16.952 8.20203C17.2937 7.86032 17.2937 7.3063 16.952 6.96459Z",fill:"currentColor"})]});ke.displayName="ChevronLeftIcon";const Ce=({title:e,...n})=>u.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 28 28",fill:"none","aria-hidden":e?void 0:!0,focusable:"false",...n,children:[e&&u.jsx("title",{children:e}),u.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.048 6.96459C11.3897 6.62289 11.9437 6.62289 12.2854 6.96459L18.7021 13.3813C19.0438 13.723 19.0438 14.277 18.7021 14.6187L12.2854 21.0354C11.9437 21.3771 11.3897 21.3771 11.048 21.0354C10.7063 20.6937 10.7063 20.1396 11.048 19.7979L16.8459 14L11.048 8.20203C10.7063 7.86032 10.7063 7.3063 11.048 6.96459Z",fill:"currentColor"})]});Ce.displayName="ChevronRightIcon";const g={calendarContainer:"_calendarContainer_mtooc_5",calendarHeader:"_calendarHeader_mtooc_33",monthYear:"_monthYear_mtooc_47",navigationButtons:"_navigationButtons_mtooc_71",grid:"_grid_mtooc_89",dayNameCell:"_dayNameCell_mtooc_105",dateCell:"_dateCell_mtooc_143",dateNumberContainer:"_dateNumberContainer_mtooc_213",otherMonth:"_otherMonth_mtooc_249",selectedDate:"_selectedDate_mtooc_313"},vt=e=>{const n=m.startOfMonth(e),r=m.startOfWeek(n,{locale:V}),l=m.addDays(r,41);return m.eachDayOfInterval({start:r,end:l})},_e=e=>e&&e.charAt(0).toUpperCase()+e.slice(1),ge=({initialDate:e=new Date,selectedDate:n=null,onDateSelect:r})=>{const[l,s]=f.useState(m.startOfMonth(n&&m.isValid(n)?n:e));f.useEffect(()=>{if(n&&m.isValid(n)){const c=m.startOfMonth(n);m.isSameMonth(c,l)||s(c)}},[n]);const b=f.useMemo(()=>m.startOfMonth(new Date),[]),h=f.useMemo(()=>!1,[l,b]),v=f.useMemo(()=>vt(l),[l]),E=f.useMemo(()=>{const c=m.startOfWeek(new Date,{locale:V});return Array.from({length:7}).map((O,S)=>{const I=m.format(m.addDays(c,S),"EEEEEE",{locale:V});return _e(I)})},[]),j=f.useCallback(()=>{h||s(c=>m.startOfMonth(m.subMonths(c,1)))},[h]),T=f.useCallback(()=>{s(c=>m.startOfMonth(m.addMonths(c,1)))},[]),w=f.useCallback(c=>{r&&r(c)},[r]),x=f.useCallback((c,O)=>{(c.key==="Enter"||c.key===" ")&&(c.preventDefault(),w(O))},[w]),y=m.format(l,"MMMM",{locale:V}),U=m.format(l,"yyyy",{locale:V}),B=`${_e(y)} ${U}`;return u.jsxs("div",{className:g.calendarContainer,children:[u.jsxs("div",{className:g.calendarHeader,children:[u.jsx("span",{className:g.monthYear,children:B}),u.jsxs("div",{className:g.navigationButtons,children:[u.jsx(o.Button,{variant:"tertiary",icon:!0,onClick:j,"aria-label":"Forrige måned",disabled:h,children:u.jsx(ke,{})}),u.jsx(o.Button,{variant:"tertiary",icon:!0,onClick:T,"aria-label":"Neste måned",children:u.jsx(Ce,{})})]})]}),u.jsx("div",{className:g.grid,children:E.map(c=>u.jsx("div",{className:g.dayNameCell,children:c},c))}),u.jsx("div",{className:g.grid,children:v.map(c=>{const O=m.isSameMonth(c,l),S=n&&m.isValid(n)&&m.isSameDay(c,n),I=m.isToday(c),Q=[g.dateCell,O?"":g.otherMonth,S?g.selectedDate:"",I&&!S?g.todayDate:""].filter(Boolean).join(" ");return u.jsx("div",{className:Q,onClick:()=>w(c),onKeyDown:F=>x(F,c),role:"button",tabIndex:0,"aria-pressed":S??!1,"aria-label":m.format(c,"PPP",{locale:V}),children:u.jsx("span",{className:g.dateNumberContainer,children:m.format(c,"d")})},c.toISOString())})})]})};ge.displayName="DatePicker";const A={fieldset:"_fieldset_s5r8s_7",description:"_description_s5r8s_29",error:"_error_s5r8s_43",inputWrapper:"_inputWrapper_s5r8s_59",inputWrapperError:"_inputWrapperError_s5r8s_83",suffixButton:"_suffixButton_s5r8s_199",suffixButtonInteractive:"_suffixButtonInteractive_s5r8s_239"},we=e=>{const n=e.slice(0,2),r=e.slice(2,4),l=e.slice(4,8);return e.length>4?`${n}.${r}.${l}`:e.length>2?`${n}.${r}`:e.length>0?n:""},Pe=e=>(e||"").replace(/\D/g,""),Ee=e=>{let n=e;if(n.length>=2){const r=parseInt(n.substring(0,2),10);!isNaN(r)&&r>31&&(n="31"+n.substring(2))}if(n.length>=4){const r=parseInt(n.substring(2,4),10);!isNaN(r)&&r>12&&(n=n.substring(0,2)+"12"+n.substring(4))}return n.slice(0,8)},je=f.forwardRef((e,n)=>{const{label:r,suffixIcon:l,onSuffixClick:s,className:b,inputWrapperClassName:h,inputClassName:v,value:E,defaultValue:j,onChange:T,readOnly:w,placeholder:x="dd.mm.åååå",id:y,name:U,required:B,disabled:c,onClick:O,onFocus:S,onBlur:I,autoComplete:Q="off","aria-label":F,"aria-labelledby":te,description:Z,error:W,...se}=e,H=E!==void 0,P=f.useRef(null);f.useImperativeHandle(n,()=>P.current);const L=f.useCallback(k=>{const _=Pe(k),Y=Ee(_);return we(Y)},[]),[R,z]=f.useState(()=>L(E??j));f.useEffect(()=>{if(H){const k=L(E);k!==R&&(z(k),P.current&&P.current.value!==k&&(P.current.value=k))}},[E,H,R,L]);const re=f.useCallback(k=>{const _=k.target,Y=_.value,q=R,C=Pe(Y).slice(0,8),M=Ee(C),N=we(M);let D=0;const $=M.length;$<=2?D=$:$<=4?D=$+1:D=$+2,D=Math.min(D,N.length),requestAnimationFrame(()=>{if(P.current&&(z(N),P.current.value=N,P.current.setSelectionRange(D,D),(N!==q||H)&&T)){const Gt={...k,target:{..._,value:N}};T(Gt,N)}})},[R,H,T,L]),ne=[A.fieldset,b].filter(Boolean).join(" "),ae=[A.inputWrapper,h,W?A.inputWrapperError:""].filter(Boolean).join(" "),oe=[v].filter(Boolean).join(" "),ie=[A.suffixButton,s?A.suffixButtonInteractive:""].filter(Boolean).join(" ");!r&&!F&&!te&&console.warn("Warning: DateInput component should have a label, aria-label, or aria-labelledby for accessibility.");const t=r&&typeof r=="string"?te||`${y}-label`:void 0,i=Z?`${y}-desc`:void 0,d=W?`${y}-err`:void 0,p=[i,d].filter(Boolean).join(" ")||void 0;return u.jsxs("div",{className:ne,children:[r&&typeof r=="string"?u.jsx("label",{id:t,htmlFor:y,children:r}):r,Z&&u.jsxs("p",{id:i,className:A.description,children:[" ",Z]}),u.jsxs("div",{className:ae,children:[u.jsx("input",{ref:P,type:"text",inputMode:"numeric",pattern:"\\d{2}\\.\\d{2}\\.\\d{4}",maxLength:10,value:R,readOnly:w,placeholder:x,id:y,name:U,required:B,disabled:c,onClick:O,onChange:re,onFocus:S,onBlur:I,autoComplete:Q,"aria-label":F,"aria-labelledby":t,"aria-describedby":p,"aria-invalid":!!W,className:oe,...se}),l&&u.jsx("button",{type:"button",className:ie,onClick:c?void 0:s,tabIndex:s&&!c?0:-1,"aria-hidden":!s,disabled:c,"aria-label":s?"Åpne datovelger":void 0,children:l})]}),W&&u.jsx("p",{id:d,className:A.error,role:"alert",children:W})]})});je.displayName="DateInput";const pt=o.Details,kt=o.Dialog,Ct=o.Divider,_t=o.Dropdown,gt=o.ErrorSummary,wt=o.Field,Te=o.FieldDescription,ye=o.FieldCounter;Te.displayName="Field.Description",ye.displayName="Field.Counter";const Pt=o.Fieldset,Et=o.Input,jt=o.Link,Tt=o.List,yt=o.Pagination,Nt=o.usePagination,St=o.Popover,Mt=o.Radio,Dt=o.useRadioGroup,xt=o.Search,Ot=o.Select,Wt=o.Skeleton,At=o.SkipLink,Bt=o.Spinner,It=o.Switch,Lt=o.Table,Rt=o.Tabs,Yt=o.Tag,Vt=o.Textarea,Ft=o.Textfield,Ht=o.ToggleGroup,zt=o.Tooltip;a.Alert=fe,a.Avatar=me,a.Badge=he,a.BadgePosition=De,a.Breadcrumbs=xe,a.BreadcrumbsItem=We,a.BreadcrumbsLink=Ae,a.BreadcrumbsList=Oe,a.Button=be,a.Card=ve,a.CardBlock=Be,a.Checkbox=pe,a.Chip=Re,a.DateInput=je,a.DatePicker=ge,a.Details=pt,a.Dialog=kt,a.Divider=Ct,a.Dropdown=_t,a.ErrorSummary=gt,a.Field=wt,a.FieldCounter=ye,a.FieldDescription=Te,a.Fieldset=Pt,a.Input=Et,a.Link=jt,a.List=Tt,a.Pagination=yt,a.Popover=St,a.Radio=Mt,a.Search=xt,a.Select=Ot,a.SkeletonLoader=Wt,a.SkipLink=At,a.Spinner=Bt,a.Switch=It,a.Table=Lt,a.Tabs=Rt,a.Tag=Yt,a.Textarea=Vt,a.Textfield=Ft,a.ToggleGroup=Ht,a.Tooltip=zt,a.useCheckboxGroup=Le,a.usePagination=Nt,a.useRadioGroup=Dt,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})}));
package/dist/index.d.ts CHANGED
@@ -9,21 +9,25 @@ import { BreadcrumbsItem } from './components/Breadcrumbs';
9
9
  import { BreadcrumbsLink } from './components/Breadcrumbs';
10
10
  import { BreadcrumbsList } from './components/Breadcrumbs';
11
11
  import { BreadcrumbsProps } from './components/Breadcrumbs';
12
- import { Buttons } from './components/Buttons';
13
- import { ButtonsProps } from './components/Buttons';
12
+ import { Button } from './components/Button';
13
+ import { ButtonsProps } from './components/Button';
14
14
  import { Card } from './components/Card';
15
15
  import { CardBlock } from './components/Card';
16
16
  import { CardProps } from './components/Card';
17
17
  import { Checkbox } from './components/Checkbox';
18
18
  import { CheckboxProps } from './components/Checkbox';
19
- import { Chip } from './components/Chip';
20
- import { ChipButtonProps } from './components/Chip';
21
- import { ChipCheckboxProps } from './components/Chip';
22
- import { ChipRadioProps } from './components/Chip';
23
- import { ChipRemovableProps } from './components/Chip';
19
+ import { ChipButton } from '@digdir/designsystemet-react';
20
+ import { ChipButtonProps as ChipButtonProps_2 } from './components';
21
+ import { ChipCheckbox } from '@digdir/designsystemet-react';
22
+ import { ChipCheckboxProps as ChipCheckboxProps_2 } from './components';
23
+ import { ChipRadio } from '@digdir/designsystemet-react';
24
+ import { ChipRadioProps as ChipRadioProps_2 } from './components';
25
+ import { ChipRemovable } from '@digdir/designsystemet-react';
26
+ import { ChipRemovableProps as ChipRemovableProps_2 } from './components';
24
27
  import { default as default_2 } from 'react';
25
- import { DetailsContentProps } from '@digdir/designsystemet-react';
28
+ import { DetailsContent } from '@digdir/designsystemet-react';
26
29
  import { DetailsProps as DetailsProps_2 } from './components';
30
+ import { DetailsSummary } from '@digdir/designsystemet-react';
27
31
  import { Dialog } from './components/Dialog';
28
32
  import { DialogProps } from './components/Dialog';
29
33
  import { DividerProps as DividerProps_2 } from './components';
@@ -44,7 +48,9 @@ import { InputHTMLAttributes } from 'react';
44
48
  import { InputProps } from './components/Input';
45
49
  import { Link } from './components/Link';
46
50
  import { LinkProps } from './components/Link';
47
- import { List } from './components/List';
51
+ import { ListItem } from '@digdir/designsystemet-react';
52
+ import { ListOrdered } from '@digdir/designsystemet-react';
53
+ import { ListUnordered } from '@digdir/designsystemet-react';
48
54
  import { Pagination } from './components/Pagination';
49
55
  import { PaginationProps } from './components/Pagination';
50
56
  import { Popover } from './components/Popover';
@@ -106,7 +112,7 @@ export { BreadcrumbsList }
106
112
 
107
113
  export { BreadcrumbsProps }
108
114
 
109
- export { Buttons }
115
+ export { Button }
110
116
 
111
117
  export { ButtonsProps }
112
118
 
@@ -120,15 +126,20 @@ export { Checkbox }
120
126
 
121
127
  export { CheckboxProps }
122
128
 
123
- export { Chip }
129
+ export declare const Chip: {
130
+ Button: ChipButton;
131
+ Checkbox: ChipCheckbox;
132
+ Radio: ChipRadio;
133
+ Removable: ChipRemovable;
134
+ };
124
135
 
125
- export { ChipButtonProps }
136
+ export declare type ChipButtonProps = ChipButtonProps_2;
126
137
 
127
- export { ChipCheckboxProps }
138
+ export declare type ChipCheckboxProps = ChipCheckboxProps_2;
128
139
 
129
- export { ChipRadioProps }
140
+ export declare type ChipRadioProps = ChipRadioProps_2;
130
141
 
131
- export { ChipRemovableProps }
142
+ export declare type ChipRemovableProps = ChipRemovableProps_2;
132
143
 
133
144
  export declare const DateInput: default_2.ForwardRefExoticComponent<DateInputProps & default_2.RefAttributes<HTMLInputElement>>;
134
145
 
@@ -157,10 +168,8 @@ export declare interface DatePickerProps {
157
168
  }
158
169
 
159
170
  export declare const Details: React.ForwardRefExoticComponent<DetailsProps_2 & React.RefAttributes<HTMLDetailsElement>> & {
160
- Summary: React.ForwardRefExoticComponent<{
161
- children: React.ReactNode;
162
- } & React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
163
- Content: React.ForwardRefExoticComponent<DetailsContentProps & React.RefAttributes<HTMLDivElement>>;
171
+ Summary: DetailsSummary;
172
+ Content: DetailsContent;
164
173
  };
165
174
 
166
175
  export declare type DetailsProps = DetailsProps_2;
@@ -205,7 +214,11 @@ export { Link }
205
214
 
206
215
  export { LinkProps }
207
216
 
208
- export { List }
217
+ export declare const List: {
218
+ Item: ListItem;
219
+ Ordered: ListOrdered;
220
+ Unordered: ListUnordered;
221
+ };
209
222
 
210
223
  export { Pagination }
211
224
 
@@ -227,7 +240,13 @@ export { Select }
227
240
 
228
241
  export { SelectProps }
229
242
 
230
- export declare const SkeletonLoader: React.ForwardRefExoticComponent<SkeletonProps_2 & React.RefAttributes<HTMLSpanElement>>;
243
+ export declare const SkeletonLoader: React.ForwardRefExoticComponent<{
244
+ width?: string | number;
245
+ height?: string | number;
246
+ variant?: "rectangle" | "circle" | "text";
247
+ asChild?: boolean;
248
+ characters?: number;
249
+ } & React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
231
250
 
232
251
  export declare type SkeletonProps = SkeletonProps_2;
233
252
 
package/package.json CHANGED
@@ -1,106 +1,115 @@
1
- {
2
- "name": "rk-designsystem",
3
- "version": "1.0.0",
4
- "description": "A React component library built on top of Digdir Design System",
5
- "author": "daniel@tunetek.no",
6
- "license": "MIT",
7
- "keywords": [
8
- "react",
9
- "components",
10
- "ui",
11
- "design-system",
12
- "typescript",
13
- "digdir",
14
- "norwegian"
15
- ],
16
- "repository": {
17
- "type": "git",
18
- "url": "https://github.com/norwegianredcross/DesignSystem.git"
19
- },
20
- "homepage": "https://norwegianredcross.github.io/DesignSystem/storybook",
21
- "bugs": {
22
- "url": "https://github.com/norwegianredcross/DesignSystem/issues"
23
- },
24
- "private": false,
25
- "type": "module",
26
- "main": "./dist/componentlibrary.umd.js",
27
- "module": "./dist/componentlibrary.es.js",
28
- "types": "./dist/index.d.ts",
29
- "exports": {
30
- ".": {
31
- "types": "./dist/index.d.ts",
32
- "import": "./dist/componentlibrary.es.js",
33
- "require": "./dist/componentlibrary.umd.js"
34
- },
35
- "./dist/componentlibrary.css": "./dist/componentlibrary.css"
36
- },
37
- "files": [
38
- "dist",
39
- "README.md",
40
- "LICENSE"
41
- ],
42
- "peerDependencies": {
43
- "react": ">=16.8.0",
44
- "react-dom": ">=16.8.0",
45
- "@digdir/designsystemet": "^1.0.3",
46
- "@digdir/designsystemet-css": "^1.0.3",
47
- "@digdir/designsystemet-react": "^1.0.3",
48
- "@navikt/aksel-icons": "^7.20.0",
49
- "date-fns": "^4.1.0"
50
- },
51
- "scripts": {
52
- "dev": "vite",
53
- "build": "vite build",
54
- "clean": "if exist dist rmdir /s /q dist",
55
- "lint": "eslint .",
56
- "preview": "vite preview",
57
- "prepublishOnly": "npm run clean && npm run build",
58
- "release:patch": "npm version patch && npm publish",
59
- "release:minor": "npm version minor && npm publish",
60
- "release:major": "npm version major && npm publish",
61
- "storybook": "storybook dev -p 6006",
62
- "build-storybook": "storybook build \"base:'/DesignSystem/Storybook-Demo/'\" -o storybook-static",
63
- "predeploy": "npm run build",
64
- "deploy": "gh-pages -d dist"
65
- },
66
- "devDependencies": {
67
- "@chromatic-com/storybook": "^4.0.1",
68
- "@digdir/designsystemet": "^1.0.3",
69
- "@digdir/designsystemet-css": "^1.0.3",
70
- "@digdir/designsystemet-react": "^1.0.3",
71
- "@eslint/js": "^9.21.0",
72
- "@navikt/aksel-icons": "^7.20.0",
73
- "@storybook/addon-a11y": "^9.1.0",
74
- "@storybook/addon-docs": "^9.1.0",
75
- "@storybook/addon-links": "^9.1.0",
76
- "@storybook/addon-onboarding": "^9.0.18",
77
- "@storybook/react-vite": "^9.0.18",
78
- "@types/react": "^19.0.10",
79
- "@types/react-dom": "^19.0.4",
80
- "@vitejs/plugin-react": "^4.3.4",
81
- "@vitest/browser": "^3.1.2",
82
- "@vitest/coverage-v8": "^3.1.2",
83
- "date-fns": "^4.1.0",
84
- "eslint": "^9.21.0",
85
- "eslint-plugin-react-hooks": "^5.1.0",
86
- "eslint-plugin-react-refresh": "^0.4.19",
87
- "eslint-plugin-storybook": "^9.0.18",
88
- "gh-pages": "^6.3.0",
89
- "globals": "^15.15.0",
90
- "playwright": "^1.52.0",
91
- "prettier": "^3.6.2",
92
- "react": "^19.0.0",
93
- "react-dom": "^19.0.0",
94
- "storybook": "^9.0.18",
95
- "typescript": "~5.7.2",
96
- "typescript-eslint": "^8.24.1",
97
- "vite": "^6.2.0",
98
- "vite-plugin-dts": "^4.5.4",
99
- "vitest": "^3.1.2"
100
- },
101
- "eslintConfig": {
102
- "extends": [
103
- "plugin:storybook/recommended"
104
- ]
105
- }
106
- }
1
+ {
2
+ "name": "rk-designsystem",
3
+ "version": "1.1.1",
4
+ "description": "A React component library built on top of Digdir Design System",
5
+ "author": "daniel@tunetek.no",
6
+ "license": "MIT",
7
+ "keywords": [
8
+ "react",
9
+ "components",
10
+ "ui",
11
+ "design-system",
12
+ "typescript",
13
+ "digdir",
14
+ "norwegian"
15
+ ],
16
+ "repository": {
17
+ "type": "git",
18
+ "url": "https://github.com/norwegianredcross/DesignSystem.git"
19
+ },
20
+ "homepage": "https://norwegianredcross.github.io/DesignSystem/storybook",
21
+ "bugs": {
22
+ "url": "https://github.com/norwegianredcross/DesignSystem/issues"
23
+ },
24
+ "private": false,
25
+ "type": "module",
26
+ "main": "./dist/componentlibrary.umd.js",
27
+ "module": "./dist/componentlibrary.es.js",
28
+ "types": "./dist/index.d.ts",
29
+ "exports": {
30
+ ".": {
31
+ "types": "./dist/index.d.ts",
32
+ "import": "./dist/componentlibrary.es.js",
33
+ "require": "./dist/componentlibrary.umd.js"
34
+ },
35
+ "./dist/componentlibrary.css": "./dist/componentlibrary.css"
36
+ },
37
+ "files": [
38
+ "dist",
39
+ "README.md",
40
+ "LICENSE"
41
+ ],
42
+ "peerDependencies": {
43
+ "@digdir/designsystemet": "^1.0.3",
44
+ "@digdir/designsystemet-css": "^1.0.3",
45
+ "@digdir/designsystemet-react": "^1.0.3",
46
+ "@navikt/aksel-icons": "^7.20.0",
47
+ "date-fns": "^4.1.0",
48
+ "react": ">=16.8.0",
49
+ "react-dom": ">=16.8.0"
50
+ },
51
+ "scripts": {
52
+ "dev": "vite",
53
+ "build": "vite build",
54
+ "clean": "if exist dist rmdir /s /q dist",
55
+ "changeset": "changeset",
56
+ "lint": "eslint .",
57
+ "preview": "vite preview",
58
+ "prepublishOnly": "npm run clean && npm run build",
59
+ "release:patch": "npm version patch && npm publish",
60
+ "release:minor": "npm version minor && npm publish",
61
+ "release:major": "npm version major && npm publish",
62
+ "storybook": "storybook dev -p 6006",
63
+ "build-storybook": "storybook build --output-dir storybook-build",
64
+ "predeploy:storybook": "npm run build-storybook && npm run copy-metadata",
65
+ "copy-metadata": "copy metadata.json storybook-build\\metadata.json",
66
+ "deploy:storybook": "gh-pages -d storybook-build -b gh-pages -r https://github.com/norwegianredcross/DesignSystem.git --dest storybook"
67
+ },
68
+ "devDependencies": {
69
+ "@changesets/cli": "^2.27.7",
70
+ "@chromatic-com/storybook": "^4.0.1",
71
+ "@digdir/designsystemet": "^1.0.3",
72
+ "@digdir/designsystemet-css": "^1.0.3",
73
+ "@digdir/designsystemet-react": "^1.0.3",
74
+ "@eslint/js": "^9.21.0",
75
+ "@navikt/aksel-icons": "^7.20.0",
76
+ "@storybook/addon-a11y": "^9.1.0",
77
+ "@storybook/addon-docs": "^9.1.0",
78
+ "@storybook/addon-links": "^9.1.0",
79
+ "@storybook/addon-onboarding": "^9.0.18",
80
+ "@storybook/react-vite": "^9.0.18",
81
+ "@types/react": "^19.0.10",
82
+ "@types/react-dom": "^19.0.4",
83
+ "@vitejs/plugin-react": "^4.3.4",
84
+ "@vitest/browser": "^3.1.2",
85
+ "@vitest/coverage-v8": "^3.1.2",
86
+ "date-fns": "^4.1.0",
87
+ "eslint": "^9.21.0",
88
+ "eslint-plugin-react-hooks": "^5.1.0",
89
+ "eslint-plugin-react-refresh": "^0.4.19",
90
+ "eslint-plugin-storybook": "^9.0.18",
91
+ "gh-pages": "^6.3.0",
92
+ "glob": "^11.0.3",
93
+ "globals": "^15.15.0",
94
+ "playwright": "^1.52.0",
95
+ "prettier": "^3.6.2",
96
+ "react": "^19.0.0",
97
+ "react-docgen-typescript": "^2.4.0",
98
+ "react-dom": "^19.0.0",
99
+ "storybook": "^9.0.18",
100
+ "typescript": "~5.7.2",
101
+ "typescript-eslint": "^8.24.1",
102
+ "vite": "^6.2.0",
103
+ "vite-plugin-dts": "^4.5.4",
104
+ "vitest": "^3.1.2"
105
+ },
106
+ "eslintConfig": {
107
+ "extends": [
108
+ "plugin:storybook/recommended"
109
+ ]
110
+ },
111
+ "dependencies": {
112
+ "@digdir/designsystemet-theme": "^1.6.0",
113
+ "rk-design-tokens": "^1.0.12"
114
+ }
115
+ }