@criipto/verify-react 1.1.1 → 1.1.3

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 (21) hide show
  1. package/dist/criipto-verify-react.cjs.js +1 -1
  2. package/dist/criipto-verify-react.cjs.js.map +1 -1
  3. package/dist/criipto-verify-react.css +31 -0
  4. package/dist/criipto-verify-react.esm.js +1 -1
  5. package/dist/criipto-verify-react.esm.js.map +1 -1
  6. package/dist/index.d.ts +1 -0
  7. package/dist/provider.d.ts +0 -1
  8. package/package.json +1 -1
  9. package/example/README.md +0 -9
  10. package/example/package-lock.json +0 -29062
  11. package/example/package.json +0 -39
  12. package/example/public/index.html +0 -16
  13. package/example/src/App.css +0 -90
  14. package/example/src/App.js +0 -39
  15. package/example/src/Dashboard.js +0 -33
  16. package/example/src/Footer.js +0 -8
  17. package/example/src/Header.js +0 -17
  18. package/example/src/Loading.js +0 -12
  19. package/example/src/Login.js +0 -13
  20. package/example/src/index.css +0 -14
  21. package/example/src/index.js +0 -19
package/example/package.json DELETED
@@ -1,39 +0,0 @@
1
- {
2
- "name": "example",
3
- "version": "0.1.0",
4
- "private": true,
5
- "dependencies": {
6
- "@criipto/verify-react": "^0.21.3",
7
- "@testing-library/jest-dom": "^5.16.5",
8
- "@testing-library/react": "^13.4.0",
9
- "@testing-library/user-event": "^13.5.0",
10
- "react": "^18.2.0",
11
- "react-dom": "^18.2.0",
12
- "react-scripts": "5.0.1",
13
- "web-vitals": "^2.1.4"
14
- },
15
- "scripts": {
16
- "start": "react-scripts start",
17
- "build": "react-scripts build",
18
- "test": "react-scripts test",
19
- "eject": "react-scripts eject"
20
- },
21
- "eslintConfig": {
22
- "extends": [
23
- "react-app",
24
- "react-app/jest"
25
- ]
26
- },
27
- "browserslist": {
28
- "production": [
29
- ">0.2%",
30
- "not dead",
31
- "not op_mini all"
32
- ],
33
- "development": [
34
- "last 1 chrome version",
35
- "last 1 firefox version",
36
- "last 1 safari version"
37
- ]
38
- }
39
- }
package/example/public/index.html DELETED
@@ -1,16 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1" />
6
- <meta name="theme-color" content="#000000" />
7
- <meta
8
- name="description"
9
- content="Web site created using create-react-app"
10
- />
11
- <title>Example Pension App</title>
12
- </head>
13
- <body>
14
- <div id="root"></div>
15
- </body>
16
- </html>
package/example/src/App.css DELETED
@@ -1,90 +0,0 @@
1
- body {
2
- display: flex;
3
- min-height: 100vh;
4
- flex-direction: column;
5
- text-align: center;
6
- }
7
-
8
- .App-header,
9
- .App-footer {
10
- min-height: 10vh;
11
- display: flex;
12
- align-items: center;
13
- justify-content: center;
14
- background-color: #6f7d98;
15
- color: white;
16
- }
17
-
18
- .App-header p {
19
- margin: 10px;
20
- }
21
-
22
- .logout-btn {
23
- background-color: #eb827a;
24
- color: #fff;
25
- font-weight: bold;
26
- padding: 8px 10px;
27
- border-radius: 5px;
28
- text-align: center;
29
- cursor: pointer;
30
- margin-right: 10px;
31
- margin-left: auto;
32
- }
33
-
34
- .main {
35
- flex: 1;
36
- min-height: 80vh;
37
- font-size: calc(10px + 2vmin);
38
- background-color: #e6f2ff;
39
- color: rgb(15, 27, 73);
40
- }
41
-
42
- .login,
43
- .loading {
44
- display: flex;
45
- flex-direction: column;
46
- align-items: center;
47
- justify-content: center;
48
- flex: 1;
49
- }
50
-
51
- .user-dashboard {
52
- background-color: #e6f2ff;
53
- display: flex;
54
- flex-direction: column;
55
- align-items: center;
56
- justify-content: center;
57
- font-size: calc(10px + 2vmin);
58
- }
59
-
60
- .dashboard-list {
61
- list-style: none;
62
- padding: 0;
63
- display: flex;
64
- flex-wrap: wrap;
65
- justify-content: center;
66
- }
67
- .dashboard-list li {
68
- width: 200px;
69
- padding: 10px;
70
- margin: 10px;
71
- background-color: #f7f7f7;
72
- border: 1px solid rgb(15, 27, 73);
73
- border-radius: 10px;
74
- text-align: center;
75
- box-shadow: 2px 2px 10px rgba(15, 27, 73, 0.2);
76
- font-size: 20px;
77
- font-weight: bold;
78
- display: flex;
79
- flex-direction: column;
80
- align-items: center;
81
- justify-content: center;
82
- transition: all 0.2s ease-in-out;
83
- }
84
- .dashboard-list li:hover {
85
- box-shadow: 2px 2px 20px rgba(15, 27, 73, 0.4);
86
- }
87
- .dashboard-list li span {
88
- display: block;
89
- margin-bottom: 10px;
90
- }
package/example/src/App.js DELETED
@@ -1,39 +0,0 @@
1
- import React from 'react';
2
- import { useCriiptoVerify, AuthMethodSelector } from '@criipto/verify-react';
3
- import Header from './Header';
4
- import Login from './Login';
5
- import Loading from './Loading';
6
- import Dashboard from './Dashboard';
7
- import Footer from './Footer';
8
- import './App.css';
9
- import '@criipto/verify-react/dist/criipto-verify-react.css';
10
-
11
- function App() {
12
- const { claims, isLoading, logout, error } = useCriiptoVerify();
13
-
14
- const handleLogout = () => {
15
- logout('http://localhost:3000');
16
- };
17
-
18
- return (
19
- <React.Fragment>
20
- <Header handleLogout={handleLogout} user={claims} />
21
- {isLoading && <Loading />}
22
- {error ? (
23
- <p>
24
- An error occurred: {error.error} ({error.error_description})
25
- </p>
26
- ) : null}
27
- {claims ? (
28
- <Dashboard user={claims} />
29
- ) : (
30
- <Login>
31
- <AuthMethodSelector />
32
- </Login>
33
- )}
34
- <Footer />
35
- </React.Fragment>
36
- );
37
- }
38
-
39
- export default App;
package/example/src/Dashboard.js DELETED
@@ -1,33 +0,0 @@
1
- import React from 'react';
2
- import './App.css';
3
-
4
- function Dashboard({
5
- user: { name, birthdate, country, cprNumberIdentifier, iat },
6
- }) {
7
- return (
8
- <div className="user-dashboard main">
9
- <h2>Welcome to your savings dashboard, {name}</h2>
10
- <h4>You have 1.000.000 DKK in pension savings</h4>
11
- <ul className="dashboard-list">
12
- <li>
13
- <span>Name:</span> {name}
14
- </li>
15
- <li>
16
- <span>Birthdate:</span> {birthdate}
17
- </li>
18
- <li>
19
- <span>Country:</span> {country}
20
- </li>
21
- <li>
22
- <span>cprNumberIdentifier: </span>
23
- {cprNumberIdentifier}
24
- </li>
25
- <li>
26
- <span>iat:</span> {iat}
27
- </li>
28
- </ul>
29
- </div>
30
- );
31
- }
32
-
33
- export default Dashboard;
package/example/src/Footer.js DELETED
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import './App.css';
3
-
4
- function Footer() {
5
- return <footer className="App-footer"></footer>;
6
- }
7
-
8
- export default Footer;
package/example/src/Header.js DELETED
@@ -1,17 +0,0 @@
1
- import React from 'react';
2
- import './App.css';
3
-
4
- function Header({ handleLogout, user }) {
5
- return (
6
- <header className="App-header">
7
- <p>Example Pension App</p>
8
- {user && (
9
- <button className="logout-btn" onClick={handleLogout}>
10
- Log Out
11
- </button>
12
- )}
13
- </header>
14
- );
15
- }
16
-
17
- export default Header;
package/example/src/Loading.js DELETED
@@ -1,12 +0,0 @@
1
- import React from 'react';
2
- import './App.css';
3
-
4
- function Loading() {
5
- return (
6
- <div className="loading main">
7
- <h1>Loading...</h1>
8
- </div>
9
- );
10
- }
11
-
12
- export default Loading;
package/example/src/Login.js DELETED
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- import './App.css';
3
-
4
- function Login({ children }) {
5
- return (
6
- <div className="login main">
7
- <p>Please login to access your pension savings.</p>
8
- {children}
9
- </div>
10
- );
11
- }
12
-
13
- export default Login;
package/example/src/index.css DELETED
@@ -1,14 +0,0 @@
1
- body {
2
- margin: 0;
3
- padding: 0;
4
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
5
- 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
6
- sans-serif;
7
- -webkit-font-smoothing: antialiased;
8
- -moz-osx-font-smoothing: grayscale;
9
- }
10
-
11
- code {
12
- font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
13
- monospace;
14
- }
package/example/src/index.js DELETED
@@ -1,19 +0,0 @@
1
- import React from 'react';
2
- import ReactDOM from 'react-dom/client';
3
- import './index.css';
4
- import App from './App';
5
- import { CriiptoVerifyProvider } from '@criipto/verify-react';
6
-
7
- const root = ReactDOM.createRoot(document.getElementById('root'));
8
- root.render(
9
- <React.StrictMode>
10
- <CriiptoVerifyProvider
11
- domain="samples.criipto.id"
12
- clientID="urn:criipto:samples:criipto-verify-react"
13
- redirectUri="http://localhost:3000"
14
- sessionStore={window.localStorage}
15
- >
16
- <App />
17
- </CriiptoVerifyProvider>
18
- </React.StrictMode>
19
- );