Update major

.ncurc.major.js

@@ -1,9 +1,7 @@
 const minorConfig = require('./.ncurc.minor');
 
-// Prettier v3 breaks storybook: https://github.com/whitespace-se/storybook-addon-html/issues/104
-
 module.exports = {
   ...minorConfig,
-  reject: [...minorConfig.reject],
+  reject: [...minorConfig.reject, '@utrecht/component-library-react'],
   target: 'latest',
 };

.ncurc.minor.js

@@ -1,7 +1,8 @@
 const patchConfig = require('./.ncurc.patch');
 
+// TODO: kan update niet uitvoeren omdat functie in laatste versie is disabled: https://github.com/nl-design-system/themes/commit/637fcb0ff11e3edcb0f61f967a45dcc6c7af8669#r150807599
 module.exports = {
   ...patchConfig,
-  reject: [...patchConfig.reject],
+  reject: [...patchConfig.reject, '@nl-design-system-unstable/theme-toolkit'],
   target: 'minor',
 };

components/Action/package.json

@@ -34,6 +34,6 @@
     "@gemeente-denhaag/icons": "workspace:*",
     "@gemeente-denhaag/link": "workspace:*",
     "@gemeente-denhaag/utils": "workspace:*",
-    "date-fns": "3.6.0"
+    "date-fns": "4.1.0"
   }
 }

components/Action/src/Time.tsx

@@ -1,5 +1,5 @@
 import React, { TimeHTMLAttributes } from 'react';
 
-interface Props extends TimeHTMLAttributes<HTMLTimeElement> {}
+type Props = TimeHTMLAttributes<HTMLTimeElement>;
 
 export const Time = ({ children, ...rest }: Props) => <time {...rest}>{children}</time>;

components/Alert/package.json

@@ -36,6 +36,6 @@
     "@gemeente-denhaag/typography": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/BadgeCounter/package.json

@@ -30,11 +30,11 @@
     "watch:components": "chokidar --silent --follow-symlinks \"src/**/*\" -c \"pnpm run build\""
   },
   "dependencies": {
-    "@utrecht/component-library-react": "7.0.0",
-    "@utrecht/components": "7.3.0"
+    "@utrecht/component-library-react": "4.2.0",
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/Blockquote/package.json

@@ -30,7 +30,7 @@
     "watch:components": "chokidar --silent --follow-symlinks \"src/**/*\" -c \"pnpm run build\""
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/Breadcrumb/package.json

@@ -35,7 +35,7 @@
     "@gemeente-denhaag/responsive-content": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/Breadcrumb/src/BreadcrumbListItem.tsx

@@ -2,7 +2,7 @@ import React, { LiHTMLAttributes } from 'react';
 import clsx from 'clsx';
 import './index.scss';
 
-export interface BreadcrumbListItemProps extends LiHTMLAttributes<HTMLLIElement> {}
+export type BreadcrumbListItemProps = LiHTMLAttributes<HTMLLIElement>;
 
 export const BreadcrumbListItem: React.FC<BreadcrumbListItemProps> = ({
   hidden,

components/Button/package.json

@@ -33,7 +33,7 @@
     "@gemeente-denhaag/icons": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/ButtonLink/package.json

@@ -31,9 +31,9 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/Card/package.json

@@ -39,7 +39,7 @@
     "@gemeente-denhaag/iconbutton": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/Card/src/Card/Card.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardProps = HTMLAttributes<HTMLDivElement>;
 
 export const Card = ({ className, ...props }: CardProps) => {
   const classNames = clsx('denhaag-card', className);

components/Card/src/Card/CardActions.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardActionsProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardActionsProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardActions = ({ className, ...props }: CardActionsProps) => {
   const classNames = clsx('denhaag-card__actions', className);

components/Card/src/Card/CardBackground.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardBackgroundProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardBackgroundProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardBackground = ({ className, ...props }: CardBackgroundProps) => {
   const classNames = clsx('denhaag-card__background', className);

components/Card/src/Card/CardContent.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardContentProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardContentProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardContent = ({ className, ...props }: CardContentProps) => {
   const classNames = clsx('denhaag-card__content', className);

components/Card/src/Card/CardDate.tsx

@@ -1,7 +1,7 @@
 import React, { TimeHTMLAttributes } from 'react';
 import '../index.scss';
 
-export interface CardDateProps extends TimeHTMLAttributes<HTMLTimeElement> {}
+export type CardDateProps = TimeHTMLAttributes<HTMLTimeElement>;
 
 export const CardDate = ({ ...props }: CardDateProps) => {
   return <time {...props}></time>;

components/Card/src/Card/CardDateWrapper.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardDateWrapperProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardDateWrapperProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardDateWrapper = ({ className, ...props }: CardDateWrapperProps) => {
   const classNames = clsx('denhaag-card__date-wrapper', className);

components/Card/src/Card/CardTextWrapper.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardTextWrapperProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardTextWrapperProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardTextWrapper = ({ className, ...props }: CardTextWrapperProps) => {
   const classNames = clsx('denhaag-card__text-wrapper', className);

components/Card/src/Card/CardWrapper.tsx

@@ -2,7 +2,7 @@ import React, { HTMLAttributes } from 'react';
 import '../index.scss';
 import clsx from 'clsx';
 
-export interface CardWrapperProps extends HTMLAttributes<HTMLDivElement> {}
+export type CardWrapperProps = HTMLAttributes<HTMLDivElement>;
 
 export const CardWrapper = ({ className, ...props }: CardWrapperProps) => {
   const classNames = clsx('denhaag-card__wrapper', className);

components/Checkbox/package.json

@@ -31,10 +31,10 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/ContactTimeline/src/ContactTimelineHeaderChannel.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineHeaderChannelProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineHeaderChannelProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineHeaderChannel: React.FC<ContactTimelineHeaderChannelProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__step-header__channel')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineHeaderContent.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineHeaderContentProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineHeaderContentProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineHeaderContent: React.FC<ContactTimelineHeaderContentProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__step-header__content')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineHeaderDate.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineHeaderDateProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineHeaderDateProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineHeaderDate: React.FC<ContactTimelineHeaderDateProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__step-header__date')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineItemFile.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineItemFileProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineItemFileProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineItemFile: React.FC<ContactTimelineItemFileProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__step-item-file')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineItemSender.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineItemSenderProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineItemSenderProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineItemSender: React.FC<ContactTimelineItemSenderProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__step-item-sender')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineList.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { OlHTMLAttributes } from 'react';
 
-export interface ContactTimelineListProps extends OlHTMLAttributes<HTMLOListElement> {}
+export type ContactTimelineListProps = OlHTMLAttributes<HTMLOListElement>;
 
 export const ContactTimelineList: React.FC<ContactTimelineListProps> = ({
   className,

components/ContactTimeline/src/ContactTimelineMeta.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineMetaProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineMetaProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineMeta: React.FC<ContactTimelineMetaProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__meta')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineMetaItem.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineMetaItemProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineMetaItemProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineMetaItem: React.FC<ContactTimelineMetaItemProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__meta-item')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineMetaSeparator.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { HTMLAttributes } from 'react';
 
-interface ContactTimelineMetaSeparatorProps extends HTMLAttributes<HTMLDivElement> {}
+type ContactTimelineMetaSeparatorProps = HTMLAttributes<HTMLDivElement>;
 
 export const ContactTimelineMetaSeparator: React.FC<ContactTimelineMetaSeparatorProps> = ({ children }) => {
   return <div className={clsx('denhaag-contact-timeline__meta-separator')}>{children}</div>;

components/ContactTimeline/src/ContactTimelineMetaTimeItem.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import React, { TimeHTMLAttributes } from 'react';
 
-interface ContactTimelineMetaTimeItemProps extends TimeHTMLAttributes<HTMLTimeElement> {}
+type ContactTimelineMetaTimeItemProps = TimeHTMLAttributes<HTMLTimeElement>;
 
 export const ContactTimelineMetaTimeItem: React.FC<ContactTimelineMetaTimeItemProps> = ({
   children,

components/DescriptionList/src/DescriptionListItem.tsx

@@ -1,7 +1,7 @@
 import React, { HTMLAttributes } from 'react';
 import clsx from 'clsx';
 
-export interface DescriptionListItemProps extends HTMLAttributes<HTMLDivElement> {}
+export type DescriptionListItemProps = HTMLAttributes<HTMLDivElement>;
 
 export const DescriptionListItem = ({ className, children, ...props }: DescriptionListItemProps) => {
   const classNames = clsx('denhaag-description-list-item', className);

components/Divider/package.json

@@ -33,7 +33,7 @@
     "@gemeente-denhaag/icons": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/DotIndicator/package.json

@@ -33,7 +33,7 @@
     "@gemeente-denhaag/button": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }

components/Footer/package.json

@@ -36,7 +36,7 @@
     "@gemeente-denhaag/link-group": "workspace:*",
     "@gemeente-denhaag/list": "workspace:*",
     "@gemeente-denhaag/responsive-content": "workspace:*",
-    "@utrecht/component-library-css": "4.1.0",
+    "@utrecht/component-library-css": "7.0.0",
     "@utrecht/component-library-react": "4.2.0"
   }
 }

components/FormField/package.json

@@ -31,9 +31,9 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/FormFieldDescription/package.json

@@ -31,9 +31,9 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/FormFieldErrorMessage/package.json

@@ -31,9 +31,9 @@
   },
   "devDependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/FormFieldSet/package.json

@@ -31,9 +31,9 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/FormLabel/package.json

@@ -31,9 +31,9 @@
   },
   "dependencies": {
     "@utrecht/component-library-react": "4.2.0",
-    "@utrecht/components": "6.1.0"
+    "@utrecht/components": "7.4.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   }
 }

components/FormProgress/package.json

@@ -34,7 +34,7 @@
     "@gemeente-denhaag/link": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^18.0.0"
+    "react": "^19.0.0"
   },
   "gitHead": "dcf72a9b79266c1ebede35aff4a02dd9121a980f"
 }