cortex-react-ui 0.2.1 → 0.2.2

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.
package/lib/index.d.ts CHANGED
@@ -229,7 +229,7 @@ type MapsProps = {
229
229
  data?: Location[];
230
230
  };
231
231
 
232
- declare const Map: React$1.FC<AppProps>;
232
+ declare const App: React$1.FC<AppProps>;
233
233
  type AppProps = MapsProps & {
234
234
  onClose: (() => void);
235
235
  onSave: ((points: Point[]) => void);
@@ -402,4 +402,4 @@ interface Props {
402
402
  }
403
403
  declare const CrossIcon: React$1.FC<Props>;
404
404
 
405
- export { AuthDownloadLink, BarLoader, Button, Camera, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ConfirmDialog, ContextMenu, CrossIcon, Dialog, DialogActions, DialogContent$1 as DialogContent, DialogFooter, DialogHeader, DialogContent as DialogTitle, Divider, DomContainer, ErrorDialog, Map, Menu, MenuGroup, MenuItem, Popper, PopupMenu, Scanner, Selected, Spinner, TagInput, ToggleButton, Tooltip, WarningDialog };
405
+ export { AuthDownloadLink, BarLoader, Button, Camera, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ConfirmDialog, ContextMenu, CrossIcon, Dialog, DialogActions, DialogContent$1 as DialogContent, DialogFooter, DialogHeader, DialogContent as DialogTitle, Divider, DomContainer, ErrorDialog, App as Map, Menu, MenuGroup, MenuItem, Popper, PopupMenu, Scanner, Selected, Spinner, TagInput, ToggleButton, Tooltip, WarningDialog };
@@ -73,6 +73,10 @@
73
73
  width: 100%;
74
74
  height: 100%;
75
75
  overflow: hidden;
76
+ display: flex;
77
+ > video {
78
+ margin: 0 auto;
79
+ }
76
80
  }
77
81
 
78
82
  .camera-controls {
@@ -0,0 +1,75 @@
1
+ .btn {
2
+ display: flex;
3
+ align-items: center;
4
+ justify-content: center;
5
+ padding: 0.5rem 1rem;
6
+ border: 1px solid transparent;
7
+ border-radius: 0.375rem;
8
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
9
+ font-size: 0.875rem;
10
+ font-weight: 500;
11
+ line-height: 1.25rem;
12
+ text-align: center;
13
+ text-transform: none;
14
+ white-space: nowrap;
15
+ vertical-align: middle;
16
+ user-select: none;
17
+ background-color: #4F46E5;
18
+ color: #fff;
19
+ cursor: pointer;
20
+ outline: none;
21
+ transition: background-color 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
22
+ }
23
+
24
+ .btn-default {
25
+ background-color: #4F46E5;
26
+ }
27
+
28
+ .btn-default:hover {
29
+ opacity: 0.8;
30
+ }
31
+
32
+ .select {
33
+ display: block;
34
+ width: 100%;
35
+ padding-left: 0.75rem;
36
+ color: #000;
37
+ padding-right: 2.5rem;
38
+ padding-top: 0.5rem;
39
+ padding-bottom: 0.5rem;
40
+ font-size: 1rem;
41
+ border-radius: 0.375rem;
42
+ }
43
+
44
+ /* DIALOG */
45
+ .dialog-header {
46
+ display: flex;
47
+ justify-content: space-between;
48
+ }
49
+
50
+ .dialog-header h4 {
51
+ margin: 0;
52
+ }
53
+
54
+ .dialog-mask {
55
+ overflow-x: hidden;
56
+ overflow-y: auto;
57
+ display: flex;
58
+ justify-content: center;
59
+ padding-top: 2.5rem;
60
+ padding-bottom: 5rem;
61
+ background-color: #0005;
62
+ position: fixed;
63
+ inset: 0;
64
+ }
65
+
66
+ .dialog-body {
67
+ display: flex;
68
+ flex-direction: column;
69
+ gap: 1.25rem;
70
+ padding: 1.25rem;
71
+ height: max-content;
72
+ background-color: white;
73
+ }
74
+
75
+ /* DIALOG */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cortex-react-ui",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "description": "React UI",
5
5
  "author": "Anthony",
6
6
  "license": "MIT",
@@ -90,7 +90,7 @@
90
90
  "@types/node": "^22.10.5",
91
91
  "@types/react": "^17.0.0",
92
92
  "@types/react-dom": "^17.0.0",
93
- "@yudiel/react-qr-scanner": "^2.1.0",
93
+ "@yudiel/react-qr-scanner": "^2.0.2",
94
94
  "css-loader": "5.2.6",
95
95
  "eslint-config-airbnb": "^18.2.1",
96
96
  "eslint-plugin-import": "^2.25.2",
@@ -98,11 +98,18 @@
98
98
  "eslint-plugin-jsx-a11y": "^6.4.1",
99
99
  "eslint-plugin-react": "^7.26.1",
100
100
  "file-loader": "^6.2.0",
101
+ "leaflet": "^1.8.0",
102
+ "leaflet-active-area": "^1.2.1",
103
+ "leaflet-draw": "^1.0.4",
104
+ "leaflet.fullscreen": "^2.4.0",
101
105
  "lodash": "^4.17.21",
102
106
  "react": "^18.1.0",
103
107
  "react-dom": "^18.1.0",
104
108
  "react-icons": "^5.3.0",
109
+ "react-leaflet": "^4.0.0",
110
+ "react-leaflet-draw": "^0.20.4",
105
111
  "react-scripts": "^5.0.1",
112
+ "react-webcam": "^7.2.0",
106
113
  "rollup": "^2.60.2",
107
114
  "rollup-plugin-copy": "^3.4.0",
108
115
  "rollup-plugin-css-only": "^4.5.2",
@@ -121,14 +128,6 @@
121
128
  "url-loader": "^4.1.1"
122
129
  },
123
130
  "dependencies": {
124
- "@rollup/plugin-replace": "^5.0.2",
125
- "leaflet": "^1.8.0",
126
- "leaflet-active-area": "^1.2.1",
127
- "leaflet-draw": "^1.0.4",
128
- "leaflet.fullscreen": "^2.4.0",
129
- "react-leaflet": "^4.0.0",
130
- "react-leaflet-draw": "^0.20.4",
131
- "react-webcam": "^7.2.0",
132
- "screenfull": "^6.0.2"
131
+ "@rollup/plugin-replace": "^5.0.2"
133
132
  }
134
133
  }
@@ -1,15 +0,0 @@
1
- import React from 'react';
2
- import { MapsProps } from './components/Maps';
3
- import 'leaflet/dist/leaflet.css';
4
- import 'leaflet-draw/dist/leaflet.draw.css';
5
- import { Point } from './models';
6
- declare const Map: React.FC<AppProps>;
7
- export type AppProps = MapsProps & {
8
- onClose: (() => void);
9
- onSave: ((points: Point[]) => void);
10
- customButtons?: {
11
- cancelButton?: HTMLElement;
12
- saveButton?: HTMLElement;
13
- };
14
- };
15
- export default Map;
@@ -1,15 +0,0 @@
1
- import React from 'react';
2
- import { MapsProps } from './components/Maps';
3
- import 'leaflet/dist/leaflet.css';
4
- import 'leaflet-draw/dist/leaflet.draw.css';
5
- import { Point } from './models';
6
- declare const Map: React.FC<AppProps>;
7
- export type AppProps = MapsProps & {
8
- onClose: (() => void);
9
- onSave: ((points: Point[]) => void);
10
- customButtons?: {
11
- cancelButton?: HTMLElement;
12
- saveButton?: HTMLElement;
13
- };
14
- };
15
- export default Map;
@@ -1,110 +0,0 @@
1
- @use "../global.scss";
2
-
3
- @mixin scanner($props: null, $options: null) {
4
- $internal-options: global.$default-options;
5
-
6
- $internal-props: (
7
- bgColor: #ffffff,
8
- fgColor: global.$color-grey-darker,
9
- closeBtnColor: global.$color-grey,
10
- closeBtnHoverColor: global.$color-blue,
11
- closeBtnDisableColor: global.$color-blue-grey-lighter,
12
- confirm: (
13
- headerBgColor: global.$color-orange-dark,
14
- headerFgColor: #ffffff,
15
- bgColor: #ffffff,
16
- fgColor: global.$color-grey-darker,
17
- ),
18
- error: (
19
- headerBgColor: global.$color-red,
20
- headerFgColor: #ffffff,
21
- bgColor: #ffffff,
22
- fgColor: global.$color-grey-darker,
23
- ),
24
- warning: (
25
- headerBgColor: global.$color-grey,
26
- headerFgColor: #ffffff,
27
- bgColor: #ffffff,
28
- fgColor: global.$color-grey-darker,
29
- ),
30
- );
31
-
32
- $internal-props: global.safe-map-merge($internal-props, $props);
33
- $internal-options: global.safe-map-merge($internal-options, $options);
34
-
35
- .btn {
36
- display: flex;
37
- align-items: center;
38
- justify-content: center;
39
- padding: 0.5rem 1rem;
40
- border: 1px solid transparent;
41
- border-radius: 0.375rem;
42
- box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
43
- font-size: 0.875rem;
44
- font-weight: 500;
45
- line-height: 1.25rem;
46
- text-align: center;
47
- text-transform: none;
48
- white-space: nowrap;
49
- vertical-align: middle;
50
- user-select: none;
51
- background-color: #4F46E5;
52
- color: #fff;
53
- cursor: pointer;
54
- outline: none;
55
- transition: background-color 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
56
- }
57
-
58
- .btn-default {
59
- background-color: #4F46E5;
60
- }
61
-
62
- .btn-default:hover {
63
- opacity: 0.8;
64
- }
65
-
66
- .select {
67
- display: block;
68
- width: 100%;
69
- padding-left: 0.75rem;
70
- color: #000;
71
- padding-right: 2.5rem;
72
- padding-top: 0.5rem;
73
- padding-bottom: 0.5rem;
74
- font-size: 1rem;
75
- border-radius: 0.375rem;
76
- }
77
-
78
- /* DIALOG */
79
- .dialog-header {
80
- display: flex;
81
- justify-content: space-between;
82
- }
83
-
84
- .dialog-header h4 {
85
- margin: 0;
86
- }
87
-
88
- .dialog-mask {
89
- overflow-x: hidden;
90
- overflow-y: auto;
91
- display: flex;
92
- justify-content: center;
93
- padding-top: 2.5rem;
94
- padding-bottom: 5rem;
95
- background-color: #0005;
96
- position: fixed;
97
- inset: 0;
98
- }
99
-
100
- .dialog-body {
101
- display: flex;
102
- flex-direction: column;
103
- gap: 1.25rem;
104
- padding: 1.25rem;
105
- height: max-content;
106
- background-color: white;
107
- }
108
-
109
- /* DIALOG */
110
- }