From 840f39d426588ce608b3a173e2ab109074a2fc9c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Benedikt=20R=C3=B6tsch?= Date: Wed, 3 Jan 2024 18:01:24 +0100 Subject: [PATCH] refactor: restructure to match docs structure --- parcel/package.json | 7 +-- parcel/src/consent-manager.tsx | 78 ++++++++++++++++++++++++++++++++ parcel/src/index.tsx | 82 ++++------------------------------ parcel/yarn.lock | 21 +++++---- 4 files changed, 103 insertions(+), 85 deletions(-) create mode 100644 parcel/src/consent-manager.tsx diff --git a/parcel/package.json b/parcel/package.json index 2d9e991..d2c8e85 100644 --- a/parcel/package.json +++ b/parcel/package.json @@ -5,19 +5,20 @@ "version": "0.0.1", "license": "MIT", "scripts": { - "start": "parcel index.html", + "start": "parcel src/index.html", "build": "parcel build src/index.html" }, "dependencies": { - "@consent-manager/core": "1.0.1", + "@consent-manager/core": "next", "react": "18.2.0", "react-app-polyfill": "^3.0.0", "react-dom": "^18.1.0" }, "devDependencies": { - "@types/react": "^18.2.45", + "@types/react": "^18.2.46", "@types/react-dom": "^18.2.18", "parcel": "^2.0.0", + "process": "^0.11.10", "typescript": "^5.3.3" } } diff --git a/parcel/src/consent-manager.tsx b/parcel/src/consent-manager.tsx new file mode 100644 index 0000000..20df6a2 --- /dev/null +++ b/parcel/src/consent-manager.tsx @@ -0,0 +1,78 @@ +import * as React from "react"; +import * as ReactDOM from "react-dom"; + +import { + ConsentManager, + ConsentManagerConfig, + ConsentManagerForm, +} from "@consent-manager/core"; + +const consentManagerConfig: ConsentManagerConfig = { + integrations: [ + { + id: "video-platform", + title: "Video Inc.", + category: "social", + Icon: () => ( + + + + ), + description: "Video Inc. is a popular service to share clips of cats.", + }, + { + id: "integration-with-wrapper", + title: "Red Box Ltd.", + category: "statistics", + Icon: () => ( + + + + ), + description: + "Adds red borders around your content, demonstrates use of components that do e.g. click tracking", + WrapperComponent: () => ( +
Very special red box!
+ ), + }, + ], +}; + +export const ConsentManagerWrapper:React.FC<{children: React.ReactNode}> = ({children}) => { + const storage = React.useState({ + decisions: {}, + }); + + return ( +
+ +
+ {children} +
+ +
+
+ ); +}; \ No newline at end of file diff --git a/parcel/src/index.tsx b/parcel/src/index.tsx index 14191f4..620a8b8 100644 --- a/parcel/src/index.tsx +++ b/parcel/src/index.tsx @@ -1,63 +1,8 @@ import * as React from "react"; import * as ReactDOM from "react-dom"; -import { - ConsentManager, - ConsentManagerConfig, - ConsentManagerForm, - PrivacyShield, -} from "@consent-manager/core"; - -const consentManagerConfig: ConsentManagerConfig = { - integrations: [ - { - id: "video-platform", - title: "Video Inc.", - category: "social", - Icon: () => ( - - - - ), - description: "Video Inc. is a popular service to share clips of cats.", - }, - { - id: "integration-with-wrapper", - title: "Red Box Ltd.", - category: "statistics", - Icon: () => ( - - - - ), - description: - "Adds red borders around your content, demonstrates use of components that do e.g. click tracking", - WrapperComponent: ({ children }) => ( -
{children}
- ), - }, - ], -}; +import { PrivacyShield } from "@consent-manager/core"; +import { ConsentManagerWrapper } from "./consent-manager"; const VideoPlatform: React.FC<{ id: string }> = ({ id }) => { return ( @@ -75,24 +20,13 @@ const VideoPlatform: React.FC<{ id: string }> = ({ id }) => { }; const App = () => { - const storage = React.useState({ - decisions: {}, - }); - return ( -
- -
-

Your content:

- - - -
- -
-
+ +

Your content:

+ + + +
); }; diff --git a/parcel/yarn.lock b/parcel/yarn.lock index 701018b..8655537 100644 --- a/parcel/yarn.lock +++ b/parcel/yarn.lock @@ -31,10 +31,10 @@ dependencies: regenerator-runtime "^0.13.4" -"@consent-manager/core@1.0.1": - version "1.0.1" - resolved "https://registry.yarnpkg.com/@consent-manager/core/-/core-1.0.1.tgz#ce90078d9506a1ac5f9c52906c900d6bd8174659" - integrity sha512-SNbrOEziJiK8Aah11MJRJp7kJSzd25vt0D9u8fxts98ByO37EItmbWfRLbMTzfHbHZGLMK4ALnp+IjZgifuq+g== +"@consent-manager/core@next": + version "2.0.0-next.2" + resolved "https://registry.yarnpkg.com/@consent-manager/core/-/core-2.0.0-next.2.tgz#c245fa867a31f8aea9afc15014ee30d1270ede63" + integrity sha512-Vi8QuqVQLYWBTInGxnDYXMuZhxzq997nmN9Bg+fEJ7heqDXr74jp1zPsoi5vHNVA1MhLZBvESZr71b7lrKFyQA== dependencies: "@types/history" "^4.7.8" history "^5.0.0" @@ -905,10 +905,10 @@ "@types/scheduler" "*" csstype "^3.0.2" -"@types/react@^18.2.45": - version "18.2.45" - resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.45.tgz#253f4fac288e7e751ab3dc542000fb687422c15c" - integrity sha512-TtAxCNrlrBp8GoeEp1npd5g+d/OejJHFxS3OWmrPBMFaVQMSN0OFySozJio5BHxTuTeug00AVXVAjfDSfk+lUg== +"@types/react@^18.2.46": + version "18.2.46" + resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.46.tgz#f04d6c528f8f136ea66333bc66abcae46e2680df" + integrity sha512-nNCvVBcZlvX4NU1nRRNV/mFl1nNRuTuslAJglQsq+8ldXe5Xv0Wd2f7WTE3jOxhLH2BFfiZGC6GCp+kHQbgG+w== dependencies: "@types/prop-types" "*" "@types/scheduler" "*" @@ -1657,6 +1657,11 @@ posthtml@^0.16.4, posthtml@^0.16.5: posthtml-parser "^0.11.0" posthtml-render "^3.0.0" +process@^0.11.10: + version "0.11.10" + resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182" + integrity sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A== + promise@^8.1.0: version "8.1.0" resolved "https://registry.npmjs.org/promise/-/promise-8.1.0.tgz#697c25c3dfe7435dd79fcd58c38a135888eaf05e"