@rijkshuisstijl-community/paragraph-react 2.0.2 → 2.1.2

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @rijkshuisstijl-community/paragraph-react
 
+## 2.1.2
+
+### Patch Changes
+
+- 89b2604: Fix security vulnerabilities identified by pnpm audit by upgrading vitest and @vitest/coverage-v8 from 4.1.8 to 4.1.10.
+
+## 2.1.1
+
+### Patch Changes
+
+- e41c59f: update dependencies
+
+## 2.1.0
+
+### Minor Changes
+
+- de35f24: Update README files
+- c9e30de: Added an option to import the components separate from the css.
+
+### Patch Changes
+
+- c414601: Ensure package is published with provenance
+- 02786d9: security patch
+- Updated dependencies [c414601]
+- Updated dependencies [de35f24]
+  - @rijkshuisstijl-community/paragraph-css@2.1.0
+
 ## 2.0.2
 
 ### Patch Changes

package/README.md

@@ -2,29 +2,21 @@
 
 # Omschrijving
 
-Dit package bevat de specifieke code voor het component. Als je alle rijkshuisstijl community componenten wil kijk dan naar [https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/components-react/library-react/README.md]. Voor verdere informatie over het inzet van de component kijk naar onze documentatie [https://rijkshuisstijl-community.vercel.app/?path=/docs/rhc-paragraph-docs]
+Dit is de Paragraph React component van het Rijkshuisstijl Community Design System. Zie ook de volgende links:
+
+- README.md voor alle React-componenten
+  [https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/components-react/library-react/README.md]
 
 ## Installatie
 
 ```bash
 pnpm add @rijkshuisstijl-community/paragraph-react
-
 ```
 
 ## Gebruik
 
-### Voorbeeld 1
-
-```tsx
-<Paragraph>Lorem ipsum dolor sit amet, consectetur ad isicing elit, sed do eiusmod</Paragraph>
-```
-
-### Voorbeeld 2
-
-```tsx
-<Paragraph purpose="lead">Lorem ipsum dolor sit amet, consectetur ad isicing elit, sed do eiusmod</Paragraph>
-```
+Op de storybook voor Paragraph React component staan voorbeelden voor het gebruik van dit component[https://rijkshuisstijl-community.vercel.app/?path=/docs/rhc-paragraph--docs]
 
-## Rijkshuisstijl Community Componenten
+## Testing
 
-**Direct aan de slag met [CSS](https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/components-css/library-css/README.md) | [React](https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/components-react/library-react/README.md) | [Web Components](https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/web-components/README.md) | [Twig](https://github.com/nl-design-system/rijkshuisstijl-community/blob/main/packages/components-twig/README.md)**
+We bundelen de CSS direct mee met de componenten zodat je dit niet apart hoeft in te laden. Let wel op met unit tests die in de Node omgeving draaien: die ondersteunen niet altijd standaard `.css` files. Voor vitest moet je bijvoorbeeld `pool: 'vmThreads',` aanzetten in de config als je de volgende error tegenkomt: `TypeError: Unknown file extension ".css"`

package/dist/Paragraph.d.ts

@@ -8,6 +8,6 @@ export interface ParagraphProps extends HTMLAttributes<HTMLParagraphElement> {
     purpose?: NlParagraphPurpose;
 }
 export declare const Paragraph: {
-    ({ className, ...restProps }: ParagraphProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, ...restProps }: ParagraphProps): import("react").JSX.Element;
     displayName: string;
 };

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 import '@rijkshuisstijl-community/paragraph-css';
-export { Paragraph, type ParagraphProps } from './Paragraph';
+export * from './Paragraph';

package/dist/{index.esm.js → index.mjs}

@@ -1,4 +1,3 @@
-'use client';
 import '@rijkshuisstijl-community/paragraph-css';
 import { jsx } from 'react/jsx-runtime';
 import { Paragraph as Paragraph$1 } from '@nl-design-system-candidate/paragraph-react';
@@ -17,4 +16,4 @@ const Paragraph = ({
 Paragraph.displayName = 'Paragraph';
 
 export { Paragraph };
-//# sourceMappingURL=index.esm.js.map
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/Paragraph.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * @license EUPL-1.2\n * Copyright (c) 2026 Community for NL Design System\n */\n\nimport {\n  Paragraph as NlParagraph,\n  type ParagraphPurpose as NlParagraphPurpose,\n} from '@nl-design-system-candidate/paragraph-react';\nimport clsx from 'clsx';\nimport { HTMLAttributes } from 'react';\n\nexport interface ParagraphProps extends HTMLAttributes<HTMLParagraphElement> {\n  purpose?: NlParagraphPurpose;\n}\n\nexport const Paragraph = ({ className, ...restProps }: ParagraphProps) => {\n  return <NlParagraph className={clsx('rhc-paragraph', className)} {...restProps} />;\n};\n\nParagraph.displayName = 'Paragraph';\n"],"names":["Paragraph","className","restProps","_jsx","NlParagraph","clsx","displayName"],"mappings":";;;;AAAA,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAQ,SAAS,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;;ACgBxW,MAAMA,SAAS,GAAGA,CAAC;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAkB,KAAI;EACvE,OAAOC,GAAA,CAACC,WAAW,EAAA;AAACH,IAAAA,SAAS,EAAEI,IAAI,CAAC,eAAe,EAAEJ,SAAS,CAAC;IAAA,GAAMC;IAAa;AACpF;AAEAF,SAAS,CAACM,WAAW,GAAG,WAAW;;;;","x_google_ignoreList":[0]}

package/dist/noSideEffects.d.ts

@@ -0,0 +1 @@
+export * from './Paragraph';

package/dist/noSideEffects.mjs

@@ -0,0 +1,18 @@
+import { jsx } from 'react/jsx-runtime';
+import { Paragraph as Paragraph$1 } from '@nl-design-system-candidate/paragraph-react';
+
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
+
+const Paragraph = ({
+  className,
+  ...restProps
+}) => {
+  return jsx(Paragraph$1, {
+    className: clsx('rhc-paragraph', className),
+    ...restProps
+  });
+};
+Paragraph.displayName = 'Paragraph';
+
+export { Paragraph };
+//# sourceMappingURL=noSideEffects.mjs.map

package/dist/noSideEffects.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"noSideEffects.mjs","sources":["../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/Paragraph.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * @license EUPL-1.2\n * Copyright (c) 2026 Community for NL Design System\n */\n\nimport {\n  Paragraph as NlParagraph,\n  type ParagraphPurpose as NlParagraphPurpose,\n} from '@nl-design-system-candidate/paragraph-react';\nimport clsx from 'clsx';\nimport { HTMLAttributes } from 'react';\n\nexport interface ParagraphProps extends HTMLAttributes<HTMLParagraphElement> {\n  purpose?: NlParagraphPurpose;\n}\n\nexport const Paragraph = ({ className, ...restProps }: ParagraphProps) => {\n  return <NlParagraph className={clsx('rhc-paragraph', className)} {...restProps} />;\n};\n\nParagraph.displayName = 'Paragraph';\n"],"names":["Paragraph","className","restProps","_jsx","NlParagraph","clsx","displayName"],"mappings":";;;AAAA,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAQ,SAAS,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;;ACgBxW,MAAMA,SAAS,GAAGA,CAAC;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAkB,KAAI;EACvE,OAAOC,GAAA,CAACC,WAAW,EAAA;AAACH,IAAAA,SAAS,EAAEI,IAAI,CAAC,eAAe,EAAEJ,SAAS,CAAC;IAAA,GAAMC;IAAa;AACpF;AAEAF,SAAS,CAACM,WAAW,GAAG,WAAW;;;;","x_google_ignoreList":[0]}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.0.2",
+  "version": "2.1.2",
   "author": "Community for Rijkshuisstijl-Community Design System",
   "description": "Paragraph component",
   "license": "EUPL-1.2",
@@ -11,22 +11,26 @@
     "src/",
     "*.md"
   ],
-  "module": "./dist/index.esm.js",
+  "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "rhc:source": "./src/index.ts",
-      "default": {
-        "types": "./dist/index.d.ts",
-        "import": "./dist/index.esm.js"
-      }
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs"
+    },
+    "./no-side-effects": {
+      "rhc:source": "./src/noSideEffects.ts",
+      "types": "./dist/noSideEffects.d.ts",
+      "import": "./dist/noSideEffects.mjs"
     }
   },
   "keywords": [
     "rijkshuisstijl-community-design-system"
   ],
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "provenance": true
   },
   "repository": {
     "type": "git+ssh",
@@ -34,27 +38,27 @@
     "directory": "packages/components-react/paragraph-react"
   },
   "devDependencies": {
-    "@babel/core": "7.29.0",
-    "@babel/plugin-transform-runtime": "7.29.0",
-    "@babel/preset-env": "7.29.2",
-    "@babel/preset-react": "7.28.5",
-    "@babel/preset-typescript": "7.28.5",
-    "@babel/runtime": "7.29.2",
+    "@babel/core": "7.29.7",
+    "@babel/plugin-transform-runtime": "7.29.7",
+    "@babel/preset-env": "7.29.7",
+    "@babel/preset-react": "7.29.7",
+    "@babel/preset-typescript": "7.29.7",
+    "@babel/runtime": "7.29.7",
     "@rollup/plugin-babel": "6.1.0",
-    "@rollup/plugin-commonjs": "29.0.2",
+    "@rollup/plugin-commonjs": "29.0.3",
     "@rollup/plugin-node-resolve": "16.0.3",
     "@testing-library/dom": "10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "14.6.1",
     "@types/lodash.chunk": "4.2.9",
-    "@types/react": "19.2.14",
+    "@types/react": "19.2.17",
     "@vitejs/plugin-react": "4.7.0",
-    "@vitest/coverage-v8": "3.2.4",
+    "@vitest/coverage-v8": "4.1.10",
     "clsx": "2.1.1",
-    "react": "19.2.4",
-    "react-dom": "19.2.4",
-    "rollup": "4.60.1",
+    "react": "19.2.7",
+    "react-dom": "19.2.7",
+    "rollup": "4.61.1",
     "rollup-plugin-filesize": "10.0.0",
     "rollup-plugin-node-externals": "8.1.2",
     "rollup-plugin-node-polyfills": "0.2.1",
@@ -62,8 +66,8 @@
     "rollup-plugin-postcss": "4.0.2",
     "rollup-plugin-typescript2": "0.37.0",
     "typescript": "5.9.3",
-    "vite": "7.3.1",
-    "vitest": "3.2.4"
+    "vite": "7.3.5",
+    "vitest": "4.1.10"
   },
   "peerDependencies": {
     "react": ">=18.2.0",
@@ -71,9 +75,7 @@
   },
   "dependencies": {
     "@nl-design-system-candidate/paragraph-react": "2.2.2",
-    "@vitejs/plugin-react": "4.7.0",
-    "@vitest/coverage-v8": "3.2.4",
-    "@rijkshuisstijl-community/paragraph-css": "2.0.1"
+    "@rijkshuisstijl-community/paragraph-css": "2.1.0"
   },
   "scripts": {
     "build": "rollup --config rollup.config.mjs",

package/src/index.ts

@@ -1,3 +1,3 @@
 import '@rijkshuisstijl-community/paragraph-css';
 
-export { Paragraph, type ParagraphProps } from './Paragraph';
+export * from './Paragraph';

package/src/noSideEffects.ts

@@ -0,0 +1 @@
+export * from './Paragraph';

package/dist/index.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/Paragraph.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * @license EUPL-1.2\n * Copyright (c) 2026 Community for NL Design System\n */\n\nimport {\n  Paragraph as NlParagraph,\n  type ParagraphPurpose as NlParagraphPurpose,\n} from '@nl-design-system-candidate/paragraph-react';\nimport clsx from 'clsx';\nimport { HTMLAttributes } from 'react';\n\nexport interface ParagraphProps extends HTMLAttributes<HTMLParagraphElement> {\n  purpose?: NlParagraphPurpose;\n}\n\nexport const Paragraph = ({ className, ...restProps }: ParagraphProps) => {\n  return <NlParagraph className={clsx('rhc-paragraph', className)} {...restProps} />;\n};\n\nParagraph.displayName = 'Paragraph';\n"],"names":["Paragraph","className","restProps","_jsx","NlParagraph","clsx","displayName"],"mappings":";;;;;AAAA,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAQ,SAAS,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;;ACgBxW,MAAMA,SAAS,GAAGA,CAAC;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAkB,KAAI;EACvE,OAAOC,GAAA,CAACC,WAAW,EAAA;AAACH,IAAAA,SAAS,EAAEI,IAAI,CAAC,eAAe,EAAEJ,SAAS,CAAC;IAAA,GAAMC;IAAa;AACpF;AAEAF,SAAS,CAACM,WAAW,GAAG,WAAW;;;;","x_google_ignoreList":[0]}