@abidibo/react-cam-roi 0.0.13 → 0.1.0

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 (100) hide show
  1. package/README.md +8 -19
  2. package/package.json +28 -1
  3. package/dist/Components/BoolField/BoolField.module.css +0 -60
  4. package/dist/Components/BoolField/index.d.ts +0 -5
  5. package/dist/Components/BoolField/index.js +0 -13
  6. package/dist/Components/Button/Button.module.css +0 -29
  7. package/dist/Components/Button/index.d.ts +0 -8
  8. package/dist/Components/Button/index.js +0 -15
  9. package/dist/Components/EnumField/EnumField.module.css +0 -61
  10. package/dist/Components/EnumField/index.d.ts +0 -10
  11. package/dist/Components/EnumField/index.js +0 -16
  12. package/dist/Components/IconButton/IconButton.module.css +0 -20
  13. package/dist/Components/IconButton/index.d.ts +0 -7
  14. package/dist/Components/IconButton/index.js +0 -10
  15. package/dist/Components/Loader/Loader.module.css +0 -25
  16. package/dist/Components/Loader/index.d.ts +0 -1
  17. package/dist/Components/Loader/index.js +0 -9
  18. package/dist/Components/Modal/Modal.module.css +0 -92
  19. package/dist/Components/Modal/index.d.ts +0 -10
  20. package/dist/Components/Modal/index.js +0 -16
  21. package/dist/Components/NumberField/NumberField.module.css +0 -60
  22. package/dist/Components/NumberField/index.d.ts +0 -3
  23. package/dist/Components/NumberField/index.js +0 -13
  24. package/dist/Components/RoiEditor/Canvas.d.ts +0 -10
  25. package/dist/Components/RoiEditor/Canvas.js +0 -28
  26. package/dist/Components/RoiEditor/ColorPicker.d.ts +0 -5
  27. package/dist/Components/RoiEditor/ColorPicker.js +0 -12
  28. package/dist/Components/RoiEditor/ColorPicker.module.css +0 -17
  29. package/dist/Components/RoiEditor/Header.d.ts +0 -2
  30. package/dist/Components/RoiEditor/Header.js +0 -22
  31. package/dist/Components/RoiEditor/Header.module.css +0 -32
  32. package/dist/Components/RoiEditor/Hooks.d.ts +0 -35
  33. package/dist/Components/RoiEditor/Hooks.js +0 -321
  34. package/dist/Components/RoiEditor/ParameterField.d.ts +0 -9
  35. package/dist/Components/RoiEditor/ParameterField.js +0 -27
  36. package/dist/Components/RoiEditor/ParametersModalForm/ParametersModalForm.module.css +0 -5
  37. package/dist/Components/RoiEditor/ParametersModalForm/index.d.ts +0 -16
  38. package/dist/Components/RoiEditor/ParametersModalForm/index.js +0 -40
  39. package/dist/Components/RoiEditor/Polygon.d.ts +0 -18
  40. package/dist/Components/RoiEditor/Polygon.js +0 -77
  41. package/dist/Components/RoiEditor/Polyline.d.ts +0 -28
  42. package/dist/Components/RoiEditor/Polyline.js +0 -75
  43. package/dist/Components/RoiEditor/Rectangle.d.ts +0 -21
  44. package/dist/Components/RoiEditor/Rectangle.js +0 -73
  45. package/dist/Components/RoiEditor/RoiEditor.module.css +0 -5
  46. package/dist/Components/RoiEditor/RoisInfo.d.ts +0 -2
  47. package/dist/Components/RoiEditor/RoisInfo.js +0 -43
  48. package/dist/Components/RoiEditor/ShapesList.d.ts +0 -2
  49. package/dist/Components/RoiEditor/ShapesList.js +0 -77
  50. package/dist/Components/RoiEditor/ShapesList.module.css +0 -67
  51. package/dist/Components/RoiEditor/Toolbar.d.ts +0 -2
  52. package/dist/Components/RoiEditor/Toolbar.js +0 -25
  53. package/dist/Components/RoiEditor/Toolbar.module.css +0 -41
  54. package/dist/Components/RoiEditor/Types.d.ts +0 -119
  55. package/dist/Components/RoiEditor/Types.js +0 -15
  56. package/dist/Components/RoiEditor/Utils.d.ts +0 -22
  57. package/dist/Components/RoiEditor/Utils.js +0 -150
  58. package/dist/Components/RoiEditor/index.d.ts +0 -10
  59. package/dist/Components/RoiEditor/index.js +0 -78
  60. package/dist/Components/RoleField.d.ts +0 -7
  61. package/dist/Components/RoleField.js +0 -35
  62. package/dist/Components/TextField/TextField.module.css +0 -61
  63. package/dist/Components/TextField/index.d.ts +0 -6
  64. package/dist/Components/TextField/index.js +0 -13
  65. package/dist/Components/Typography/index.d.ts +0 -9
  66. package/dist/Components/Typography/index.js +0 -6
  67. package/dist/Icons/AnnotateIcon.d.ts +0 -6
  68. package/dist/Icons/AnnotateIcon.js +0 -5
  69. package/dist/Icons/CloseIcon.d.ts +0 -6
  70. package/dist/Icons/CloseIcon.js +0 -5
  71. package/dist/Icons/CopyIcon.d.ts +0 -6
  72. package/dist/Icons/CopyIcon.js +0 -5
  73. package/dist/Icons/DeleteIcon.d.ts +0 -6
  74. package/dist/Icons/DeleteIcon.js +0 -5
  75. package/dist/Icons/EditIcon.d.ts +0 -6
  76. package/dist/Icons/EditIcon.js +0 -5
  77. package/dist/Icons/PointerIcon.d.ts +0 -6
  78. package/dist/Icons/PointerIcon.js +0 -5
  79. package/dist/Icons/PolygonIcon.d.ts +0 -6
  80. package/dist/Icons/PolygonIcon.js +0 -5
  81. package/dist/Icons/PolylineIcon.d.ts +0 -6
  82. package/dist/Icons/PolylineIcon.js +0 -5
  83. package/dist/Icons/RectangleIcon.d.ts +0 -6
  84. package/dist/Icons/RectangleIcon.js +0 -5
  85. package/dist/Icons/SaveIcon.d.ts +0 -6
  86. package/dist/Icons/SaveIcon.js +0 -5
  87. package/dist/Icons/SelectIcon.d.ts +0 -6
  88. package/dist/Icons/SelectIcon.js +0 -5
  89. package/dist/Providers/EditorProvider.d.ts +0 -26
  90. package/dist/Providers/EditorProvider.js +0 -29
  91. package/dist/Providers/UiProvider.d.ts +0 -84
  92. package/dist/Providers/UiProvider.js +0 -107
  93. package/dist/Types.d.ts +0 -10
  94. package/dist/Types.js +0 -1
  95. package/dist/Utils/Dispatcher.d.ts +0 -16
  96. package/dist/Utils/Dispatcher.js +0 -65
  97. package/dist/Utils/index.d.ts +0 -4
  98. package/dist/Utils/index.js +0 -14
  99. package/dist/index.d.ts +0 -4
  100. package/dist/index.js +0 -4
@@ -1,150 +0,0 @@
1
- import { formatString } from '../../Utils';
2
- import { OperatorEnum, } from './Types';
3
- export const notify = {
4
- info: (message) => alert(`Info: ${message}`),
5
- warn: (message) => alert(`Warning: ${message}`),
6
- error: (message) => alert(`Error: ${message}`),
7
- success: (message) => alert(`Success: ${message}`),
8
- };
9
- export const enableRois = (configuration) => {
10
- return configuration.rois.length > 0;
11
- };
12
- export const enableMainMetadata = (configuration) => {
13
- return configuration.parameters.length > 0;
14
- };
15
- export const canDrawShape = (configuration, shapeType, shapes, notify, message) => {
16
- const rule = configuration.rois.find((roi) => roi.type === shapeType);
17
- // no rule
18
- if (!rule || !rule.multiplicity || Object.keys(rule.multiplicity).length === 0) {
19
- return true;
20
- }
21
- const currentShapeCount = Object.values(shapes).filter((s) => s.type === shapeType).length;
22
- let res = true;
23
- switch (rule.multiplicity.operator) {
24
- case OperatorEnum.Eq:
25
- case OperatorEnum.Lte:
26
- res = currentShapeCount + 1 <= rule.multiplicity.threshold;
27
- break;
28
- case OperatorEnum.Lt:
29
- res = currentShapeCount + 1 < rule.multiplicity.threshold;
30
- break;
31
- default:
32
- return true;
33
- }
34
- if (!res && notify) {
35
- notify.warn(message);
36
- }
37
- return res;
38
- };
39
- export const validateParametersForm = (parameters, fields, setErrors) => {
40
- const err = {};
41
- parameters.forEach((p) => {
42
- if (p.required && isEmpty(fields[p.codename])) {
43
- err[p.codename] = 'requiredField';
44
- }
45
- });
46
- if (Object.keys(err).length > 0) {
47
- setErrors(err);
48
- return false;
49
- }
50
- return true;
51
- };
52
- const isEmpty = (v) => {
53
- if (typeof v === 'string') {
54
- return v.length === 0;
55
- }
56
- if (Array.isArray(v)) {
57
- return v.length === 0;
58
- }
59
- return v === null || v === undefined;
60
- };
61
- export const validate = (configuration, shapes, metadata, strings) => {
62
- const errors = [];
63
- // check main parameters
64
- if (configuration.parameters.length) {
65
- if (metadata.parameters.find((p) => { var _a; return ((_a = configuration.parameters.find((p2) => p2.codename === p.codename)) === null || _a === void 0 ? void 0 : _a.required) && isEmpty(p.value); })) {
66
- errors.push(strings.missingRequiredValuesInMainParameters);
67
- }
68
- }
69
- // check rois number
70
- configuration.rois.forEach((roi) => {
71
- // check multiplicity
72
- if (roi.multiplicity) {
73
- switch (roi.multiplicity.operator) {
74
- case OperatorEnum.Eq:
75
- if (Object.values(shapes).filter((s) => s.type === roi.type).length !== roi.multiplicity.threshold) {
76
- errors.push(formatString(strings.shapesOfTypeShouldBeEqualToThreshold, {
77
- type: String(roi.type),
78
- threshold: roi.multiplicity.threshold,
79
- }));
80
- }
81
- break;
82
- case OperatorEnum.Lt:
83
- if (Object.values(shapes).filter((s) => s.type === roi.type).length >= roi.multiplicity.threshold) {
84
- errors.push(formatString(strings.shapesOfTypeShouldBeLessThanThreshold, {
85
- type: String(roi.type),
86
- threshold: roi.multiplicity.threshold,
87
- }));
88
- }
89
- break;
90
- case OperatorEnum.Lte:
91
- if (Object.values(shapes).filter((s) => s.type === roi.type).length > roi.multiplicity.threshold) {
92
- errors.push(formatString(strings.shapesOfTypeShouldBeLessThanOrEqualToThreshold, {
93
- type: String(roi.type),
94
- threshold: roi.multiplicity.threshold,
95
- }));
96
- }
97
- break;
98
- case OperatorEnum.Gt:
99
- if (Object.values(shapes).filter((s) => s.type === roi.type).length <= roi.multiplicity.threshold) {
100
- errors.push(formatString(strings.shapesOfTypeShouldBeGreaterThanThreshold, {
101
- type: String(roi.type),
102
- threshold: roi.multiplicity.threshold,
103
- }));
104
- }
105
- break;
106
- case OperatorEnum.Gte:
107
- if (Object.values(shapes).filter((s) => s.type === roi.type).length < roi.multiplicity.threshold) {
108
- errors.push(formatString(strings.shapesOfTypeShouldBeGreaterThanOrEqualToThreshold, {
109
- type: String(roi.type),
110
- threshold: roi.multiplicity.threshold,
111
- }));
112
- }
113
- }
114
- }
115
- });
116
- // check rois metadata
117
- Object.keys(shapes).forEach((shapeId) => {
118
- var _a, _b;
119
- const type = shapes[shapeId].type;
120
- const confParameters = (_b = (_a = configuration.rois.find((r) => r.type === type)) === null || _a === void 0 ? void 0 : _a.parameters) !== null && _b !== void 0 ? _b : [];
121
- confParameters.forEach((p) => {
122
- var _a, _b;
123
- if (p.required &&
124
- isEmpty((_b = (_a = metadata.rois.find((r) => r.id === shapeId)) === null || _a === void 0 ? void 0 : _a.parameters.find((p) => p.codename === p.codename)) === null || _b === void 0 ? void 0 : _b.value)) {
125
- errors.push(strings.missingRequiredValuesInShapeParameters.replace('{id}', shapeId));
126
- }
127
- });
128
- });
129
- return [errors.length === 0, errors];
130
- };
131
- export const fabricShapeToOutputShape = (shape, type) => {
132
- switch (type) {
133
- case "rect" /* ToolEnum.Rectangle */:
134
- return {
135
- top: shape.top,
136
- left: shape.left,
137
- width: shape.width,
138
- height: shape.height,
139
- color: shape.stroke,
140
- };
141
- case "polygon" /* ToolEnum.Polygon */:
142
- case "polyline" /* ToolEnum.Polyline */:
143
- return {
144
- points: shape.get('points'),
145
- top: shape.top,
146
- left: shape.left,
147
- color: shape.stroke,
148
- };
149
- }
150
- };
@@ -1,10 +0,0 @@
1
- import { Configuration, Output } from './Types';
2
- export type RoiEditorProps = {
3
- imageUrl: string;
4
- configuration: Configuration;
5
- onSubmit: (data: Output) => void;
6
- initialData?: Output;
7
- editorId: string;
8
- };
9
- declare const RoiEditor: React.FC<RoiEditorProps>;
10
- export default RoiEditor;
@@ -1,78 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useCallback, useContext, useState } from 'react';
3
- import EditorProvider from '../../Providers/EditorProvider';
4
- import { UiContext } from '../../Providers/UiProvider';
5
- import { css, log } from '../../Utils';
6
- import { Loader } from '../Loader';
7
- import Canvas from './Canvas';
8
- import { useCanvasSize } from './Hooks';
9
- import styles from './RoiEditor.module.css';
10
- import ShapesList from './ShapesList';
11
- import Toolbar from './Toolbar';
12
- import { fabricShapeToOutputShape, validate } from './Utils';
13
- import Header from './Header';
14
- // https://github.com/n-mazaheri/image-editor
15
- const RoiEditor = ({ imageUrl, configuration, onSubmit, initialData, editorId }) => {
16
- var _a, _b, _c;
17
- const { themeMode, enableLogs, pickerColors, strings, notify } = useContext(UiContext);
18
- const { imageSize, canvasSize, wrapperRef, isReady } = useCanvasSize(imageUrl);
19
- const [activeTool, setActiveTool] = useState("pointer" /* ToolEnum.Pointer */);
20
- const [activeColor, setActiveColor] = useState(pickerColors[0]);
21
- const [metadata, setMetadata] = useState({
22
- parameters: [
23
- ...((_a = configuration.parameters.map((p) => {
24
- const initial = initialData === null || initialData === void 0 ? void 0 : initialData.parameters.find((p) => p.codename === p.codename);
25
- return {
26
- codename: p.codename,
27
- value: initial ? initial.value : p.value,
28
- };
29
- })) !== null && _a !== void 0 ? _a : []),
30
- ],
31
- rois: [],
32
- });
33
- const [shapes, setShapes] = useState({});
34
- const addShape = useCallback((id, type, shape) => setShapes(Object.assign(Object.assign({}, shapes), { [id]: { type, shape } })), [shapes]);
35
- const addShapes = useCallback((s) => setShapes(Object.assign(Object.assign({}, shapes), s.reduce((r, s) => (Object.assign(Object.assign({}, r), { [s.id]: s })), {}))), [shapes]);
36
- const removeShape = useCallback((id) => {
37
- const newShapes = Object.assign({}, shapes);
38
- delete newShapes[id];
39
- setShapes(newShapes);
40
- setMetadata(Object.assign(Object.assign({}, metadata), { rois: metadata.rois.filter((r) => r.id !== id) }));
41
- }, [shapes, metadata]);
42
- // TODO: go with percentage coordinates or pixel coordinates but relative to original image
43
- const handleSubmit = useCallback(() => {
44
- var _a, _b;
45
- const [isValid, errors] = validate(configuration, shapes, metadata, strings);
46
- if (isValid) {
47
- onSubmit({
48
- parameters: (_b = (_a = metadata.parameters) === null || _a === void 0 ? void 0 : _a.map((p) => ({ codename: p.codename, value: p.value }))) !== null && _b !== void 0 ? _b : [],
49
- rois: Object.keys(shapes).map((shapeId) => {
50
- var _a, _b, _c, _d, _e, _f, _g;
51
- return ({
52
- parameters: (_c = (_b = (_a = metadata.rois
53
- .find((r) => r.id === shapeId)) === null || _a === void 0 ? void 0 : _a.parameters) === null || _b === void 0 ? void 0 : _b.map((p) => ({ codename: p.codename, value: p.value }))) !== null && _c !== void 0 ? _c : [],
54
- name: (_e = (_d = metadata.rois.find((r) => r.id === shapeId)) === null || _d === void 0 ? void 0 : _d.name) !== null && _e !== void 0 ? _e : '',
55
- role: (_g = (_f = metadata.rois.find((r) => r.id === shapeId)) === null || _f === void 0 ? void 0 : _f.role) !== null && _g !== void 0 ? _g : '',
56
- type: shapes[shapeId].type,
57
- shape: fabricShapeToOutputShape(shapes[shapeId].shape, shapes[shapeId].shape.type),
58
- });
59
- }),
60
- });
61
- }
62
- else {
63
- notify.error(strings.invalidSubmission + '\n' + errors.map((e) => `- ${e}`).join('\n'));
64
- }
65
- }, [onSubmit, configuration, shapes, metadata, strings, notify]);
66
- log('info', enableLogs, 'react-cam-roi', 'active tool', activeTool);
67
- log('info', enableLogs, 'react-cam-roi', 'canvas size', canvasSize);
68
- log('info', enableLogs, 'react-cam-roi', 'metadata', metadata);
69
- if (!isReady) {
70
- return _jsx(Loader, {});
71
- }
72
- return (_jsx(EditorProvider, { editorId: editorId, hideForbiddenTools: (_c = (_b = configuration.options) === null || _b === void 0 ? void 0 : _b.hideForbiddenTools) !== null && _c !== void 0 ? _c : false, activeTool: activeTool, setActiveTool: setActiveTool, activeColor: activeColor, setActiveColor: setActiveColor, shapes: shapes, addShape: addShape, addShapes: addShapes, removeShape: removeShape, configuration: configuration, metadata: metadata, setMetadata: setMetadata, onSubmit: handleSubmit, children: _jsxs("div", { style: { maxWidth: '100%', width: `${imageSize.width}px` }, ref: wrapperRef, children: [_jsx(Header, {}), _jsx(Toolbar, {}), _jsx("div", { className: css('canvasWrapper', styles, themeMode), style: {
73
- width: `${canvasSize.width}px`,
74
- height: `${canvasSize.height}px`,
75
- backgroundImage: `url(${imageUrl})`,
76
- }, children: _jsx(Canvas, { canvasSize: canvasSize, initialData: initialData }) }), _jsx(ShapesList, {})] }) }));
77
- };
78
- export default RoiEditor;
@@ -1,7 +0,0 @@
1
- import { FieldProps } from '../Types';
2
- import { ShapeType } from './RoiEditor/Types';
3
- type RoleFieldProps = Omit<FieldProps<string>, 'readonly' | 'label'> & {
4
- shapeType: ShapeType;
5
- };
6
- declare const RoleField: React.FC<RoleFieldProps>;
7
- export default RoleField;
@@ -1,35 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import { jsx as _jsx } from "react/jsx-runtime";
13
- import { useContext, useEffect } from 'react';
14
- import { useEditorContext } from '../Providers/EditorProvider';
15
- import { UiContext } from '../Providers/UiProvider';
16
- import EnumField from './EnumField';
17
- import { humanize } from '../Utils';
18
- const RoleField = (_a) => {
19
- var { onChange, value, required, shapeType } = _a, props = __rest(_a, ["onChange", "value", "required", "shapeType"]);
20
- const { strings } = useContext(UiContext);
21
- const { configuration } = useEditorContext();
22
- const options = [];
23
- (configuration.rois || []).filter(r => r.type === shapeType).forEach((r) => {
24
- if (!options.includes(r.role)) {
25
- options.push(r.role);
26
- }
27
- });
28
- useEffect(() => {
29
- if (required) {
30
- onChange(options[0]);
31
- }
32
- }, []); // eslint-disable-line react-hooks/exhaustive-deps
33
- return (_jsx(EnumField, Object.assign({ required: required, label: strings.role, value: value, onChange: (value) => onChange(value), options: options.map((o) => ({ value: o, label: humanize(o) })) }, props)));
34
- };
35
- export default RoleField;
@@ -1,61 +0,0 @@
1
- /*
2
- .text-field-wrapper {
3
- margin-bottom: 2rem;
4
- }
5
- .text-field-wrapper-light {
6
- }
7
- .text-field-wrapper-dark {
8
- }
9
- */
10
-
11
- .text-field {
12
- border-radius: 0.25rem;
13
- box-sizing: border-box;
14
- padding: 0.5rem;
15
- width: 100%;
16
- }
17
- .text-field:focus-visible {
18
- outline: none;
19
- border: 1px solid #1976d2;
20
- }
21
- .text-field-light {
22
- background-color: #fff;
23
- color: #333;
24
- border: 1px solid #ccc;
25
- }
26
- .text-field-dark {
27
- background-color: #333;
28
- border: 1px solid #666;
29
- color: #fff;
30
- }
31
- .text-field-error {
32
- border: 1px solid #d32f2f;
33
- }
34
- .text-field-label {
35
- font-weight: bold;
36
- display: block;
37
- margin: 0 0 1rem 0;
38
- }
39
- /*
40
- .text-fiel-label-light {
41
- }
42
- .text-field-label-dark {
43
- }
44
- */
45
- .text-field-label-error {
46
- color: #d32f2f;
47
- }
48
- .text-field-helper-text {
49
- font-style: italic;
50
- font-size: 0.9rem;
51
- margin-top: 0.5rem;
52
- }
53
- /*
54
- .text-field-helper-text-light {
55
- }
56
- .text-field-helper-text-dark {
57
- }
58
- */
59
- .text-field-helper-text-error {
60
- color: #d32f2f;
61
- }
@@ -1,6 +0,0 @@
1
- import { FieldProps } from '../../Types';
2
- export interface TextFieldProps extends FieldProps<string> {
3
- type?: 'text' | 'email' | 'password';
4
- }
5
- declare const TextField: React.FC<TextFieldProps>;
6
- export default TextField;
@@ -1,13 +0,0 @@
1
- import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
- import { useContext } from 'react';
3
- import { UiContext } from '../../Providers/UiProvider';
4
- import { css } from '../../Utils';
5
- import styles from './TextField.module.css';
6
- const TextField = ({ onChange, type = 'text', value, label, helperText, error, required = false, readOnly = false, disabled = false, }) => {
7
- const { themeMode, Typography } = useContext(UiContext);
8
- const handleChange = (e) => {
9
- onChange(e.target.value);
10
- };
11
- return (_jsxs("div", { className: css('text-field-wrapper', styles, themeMode), children: [_jsx("label", { className: `${css('text-field-label', styles, themeMode)} ${error ? css('text-field-label-error', styles, null) : ''}`, children: _jsxs(Typography, { children: [label, required && ' *'] }) }), _jsx("input", { type: type, className: `${css('text-field', styles, themeMode)} ${error ? css('text-field-error', styles, null) : ''}`, onChange: handleChange, value: value, readOnly: readOnly, disabled: disabled }), helperText && (_jsx(Typography, { component: 'div', className: `${css('text-field-helper-text', styles, themeMode)} ${error ? css('text-field-helper-text-error', styles, null) : ''}`, children: helperText }))] }));
12
- };
13
- export default TextField;
@@ -1,9 +0,0 @@
1
- export type TypographyProps = {
2
- children?: React.ReactNode;
3
- className?: string;
4
- variant?: any;
5
- component?: any;
6
- style?: React.CSSProperties;
7
- };
8
- declare const Typography: React.FC<TypographyProps>;
9
- export default Typography;
@@ -1,6 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const Typography = ({ children, style = {}, className = '', component = 'span' }) => {
3
- const Tag = component;
4
- return _jsx(Tag, { className: className, style: style, children: children });
5
- };
6
- export default Typography;
@@ -1,6 +0,0 @@
1
- type AnnotateIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const AnnotateIcon: React.FC<AnnotateIconProps>;
6
- export default AnnotateIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const AnnotateIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "M280-280h84l240-238-86-86-238 238v86Zm352-266 42-44q6-6 6-14t-6-14l-56-56q-6-6-14-6t-14 6l-44 42 86 86ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h168q13-36 43.5-58t68.5-22q38 0 68.5 22t43.5 58h168q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm280-590q13 0 21.5-8.5T510-820q0-13-8.5-21.5T480-850q-13 0-21.5 8.5T450-820q0 13 8.5 21.5T480-790ZM200-200v-560 560Z" }) }));
4
- };
5
- export default AnnotateIcon;
@@ -1,6 +0,0 @@
1
- type CloseIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const CloseIcon: React.FC<CloseIconProps>;
6
- export default CloseIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const CloseIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z" }) }));
4
- };
5
- export default CloseIcon;
@@ -1,6 +0,0 @@
1
- type CopyIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const CopyIcon: React.FC<CopyIconProps>;
6
- export default CopyIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const CopyIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", width: "24px", viewBox: "0 -960 960 960", style: style, children: _jsx("path", { fill: color, d: "M360-240q-33 0-56.5-23.5T280-320v-480q0-33 23.5-56.5T360-880h360q33 0 56.5 23.5T800-800v480q0 33-23.5 56.5T720-240H360Zm0-80h360v-480H360v480ZM200-80q-33 0-56.5-23.5T120-160v-560h80v560h440v80H200Zm160-240v-480 480Z" }) }));
4
- };
5
- export default CopyIcon;
@@ -1,6 +0,0 @@
1
- export type DeleteIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const DeleteIcon: React.FC<DeleteIconProps>;
6
- export default DeleteIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const DeleteIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z" }) }));
4
- };
5
- export default DeleteIcon;
@@ -1,6 +0,0 @@
1
- type EditIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const EditIcon: React.FC<EditIconProps>;
6
- export default EditIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const EditIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "M200-200h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T817-647L290-120H120Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z" }) }));
4
- };
5
- export default EditIcon;
@@ -1,6 +0,0 @@
1
- type PointerIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const PointerIcon: React.FC<PointerIconProps>;
6
- export default PointerIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const PointerIcon = ({ color = 'black', style = { height: '32px' } }) => {
3
- return (_jsx("svg", { style: style, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 25 25", children: _jsx("path", { fill: color, d: "M13.3891,20.923l-3.1995-6.8869-3.47,4.8454V4.077l11.5606,9.0859h-5.9695l3.1679,6.7828-2.0893.9773h-.0002Z" }) }));
4
- };
5
- export default PointerIcon;
@@ -1,6 +0,0 @@
1
- type PolygonIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const PolygonIcon: React.FC<PolygonIconProps>;
6
- export default PolygonIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const PolygonIcon = ({ color = 'black', style = { height: '32px' } }) => {
3
- return (_jsx("svg", { style: style, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 25 25", children: _jsx("path", { fill: color, d: "M17.3836,17.058v-2.9301h2.1705v4.341l-9.7673,4.341-7.5967-7.5968L6.5311,5.4459h4.341v2.1705h-2.9301l-3.1472,7.1627,5.4263,5.4263,7.1627-3.1472M22.8099,5.4459v2.1705h-3.2558v3.2558h-2.1705v-3.2558h-3.2558v-2.1705h3.2558v-3.2558h2.1705v3.2558h3.2558Z" }) }));
4
- };
5
- export default PolygonIcon;
@@ -1,6 +0,0 @@
1
- type PolylineIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const PolylineIcon: React.FC<PolylineIconProps>;
6
- export default PolylineIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- const PolylineIcon = ({ color = 'black', style = { height: '32px' } }) => {
3
- return (_jsxs("svg", { style: style, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 25 25", children: [_jsx("polygon", { fill: color, points: "20.5216 8.6492 20.5216 5.4658 18.3992 5.4658 18.3992 8.6492 15.2159 8.6492 15.2159 10.7715 18.3992 10.7715 18.3992 13.955 20.5216 13.955 20.5216 10.7715 23.705 10.7715 23.705 8.6492 20.5216 8.6492" }), _jsx("polygon", { fill: color, points: "12.3027 17.2 7.011 14.4951 7.011 11.5067 8.9251 9.2929 13.103 9.2929 13.103 3.577 7.3871 3.577 7.3871 7.7797 4.7908 10.7826 1.295 10.7826 1.295 16.4985 6.2004 16.4985 12.3027 19.6175 12.3027 21.423 18.0186 21.423 18.0186 15.7071 12.3027 15.7071 12.3027 17.2" })] }));
4
- };
5
- export default PolylineIcon;
@@ -1,6 +0,0 @@
1
- type RectangleIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const RectangleIcon: React.FC<RectangleIconProps>;
6
- export default RectangleIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const RectangleIcon = ({ color = 'black', style = { height: '32px' } }) => {
3
- return (_jsx("svg", { style: style, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 25 25", children: _jsx("path", { fill: color, d: "M19.5541,7.0738h3.2558v2.1705h-3.2558v3.2558h-2.1705v-3.2558h-3.2558v-2.1705h3.2558v-3.2558h2.1705v3.2558M17.3836,19.0115v-3.2558h2.1705v5.4263H2.1901V7.0738h8.682v2.1705h-6.5115v9.7673h13.023,0Z" }) }));
4
- };
5
- export default RectangleIcon;
@@ -1,6 +0,0 @@
1
- type SaveIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const SaveIcon: React.FC<SaveIconProps>;
6
- export default SaveIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const SaveIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "M840-680v480q0 33-23.5 56.5T760-120H200q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h480l160 160Zm-80 34L646-760H200v560h560v-446ZM480-240q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35ZM240-560h360v-160H240v160Zm-40-86v446-560 114Z" }) }));
4
- };
5
- export default SaveIcon;
@@ -1,6 +0,0 @@
1
- type SelectIconProps = {
2
- color?: string;
3
- style?: React.CSSProperties;
4
- };
5
- declare const SelectIcon: React.FC<SelectIconProps>;
6
- export default SelectIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- const SelectIcon = ({ color = 'black', style = {} }) => {
3
- return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", style: style, children: _jsx("path", { fill: color, d: "m320-410 79-110h170L320-716v306ZM551-80 406-392 240-160v-720l560 440H516l144 309-109 51ZM399-520Z" }) }));
4
- };
5
- export default SelectIcon;
@@ -1,26 +0,0 @@
1
- import { PropsWithChildren } from 'react';
2
- import { Configuration, Metadata, Shape, Shapes, ShapeType, ToolEnum } from '../Components/RoiEditor/Types';
3
- type EditorContextType = {
4
- hideForbiddenTools: boolean;
5
- activeTool: ToolEnum;
6
- setActiveTool: (tool: ToolEnum) => void;
7
- activeColor: string;
8
- setActiveColor: (color: string) => void;
9
- shapes: Shapes;
10
- addShape: (id: string, type: ShapeType, shape: Shape) => void;
11
- addShapes: (shapes: {
12
- id: string;
13
- type: ShapeType;
14
- shape: Shape;
15
- }[]) => void;
16
- removeShape: (id: string) => void;
17
- configuration: Configuration;
18
- metadata: Metadata;
19
- setMetadata: (data: Metadata) => void;
20
- onSubmit: () => void;
21
- editorId: string;
22
- };
23
- export declare const EditorContext: import("react").Context<EditorContextType | undefined>;
24
- export declare function useEditorContext(): EditorContextType;
25
- declare const EditorProvider: ({ children, editorId, hideForbiddenTools, activeTool, setActiveTool, activeColor, setActiveColor, shapes, addShape, addShapes, removeShape, configuration, metadata, setMetadata, onSubmit, }: PropsWithChildren<EditorContextType>) => import("react/jsx-runtime").JSX.Element;
26
- export default EditorProvider;
@@ -1,29 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { createContext, useContext } from 'react';
3
- export const EditorContext = createContext(undefined); // eslint-disable-line
4
- export function useEditorContext() {
5
- const context = useContext(EditorContext);
6
- if (context === undefined) {
7
- throw new Error('useEditorContext must be within a EditorProvider');
8
- }
9
- return context;
10
- }
11
- const EditorProvider = ({ children, editorId, hideForbiddenTools, activeTool, setActiveTool, activeColor, setActiveColor, shapes, addShape, addShapes, removeShape, configuration, metadata, setMetadata, onSubmit, }) => {
12
- return (_jsx(EditorContext.Provider, { value: {
13
- editorId,
14
- hideForbiddenTools,
15
- activeTool,
16
- setActiveTool,
17
- activeColor,
18
- setActiveColor,
19
- shapes,
20
- addShape,
21
- addShapes,
22
- removeShape,
23
- configuration,
24
- metadata,
25
- setMetadata,
26
- onSubmit,
27
- }, children: children }));
28
- };
29
- export default EditorProvider;