@abidibo/react-cam-roi 0.0.7 → 0.0.10
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/README.md +588 -29
- package/dist/Components/BoolField/BoolField.module.css +60 -0
- package/dist/Components/BoolField/index.d.ts +5 -0
- package/dist/Components/BoolField/index.js +13 -0
- package/dist/Components/Button/Button.module.css +27 -0
- package/dist/Components/Button/index.d.ts +8 -0
- package/dist/Components/Button/index.js +15 -0
- package/dist/Components/EnumField/EnumField.module.css +61 -0
- package/dist/Components/EnumField/index.d.ts +10 -0
- package/dist/Components/EnumField/index.js +16 -0
- package/dist/Components/IconButton/IconButton.module.css +8 -3
- package/dist/Components/IconButton/index.d.ts +1 -0
- package/dist/Components/IconButton/index.js +3 -3
- package/dist/Components/Modal/Modal.module.css +92 -0
- package/dist/Components/Modal/index.d.ts +10 -0
- package/dist/Components/Modal/index.js +16 -0
- package/dist/Components/NumberField/NumberField.module.css +60 -0
- package/dist/Components/NumberField/index.d.ts +3 -0
- package/dist/Components/NumberField/index.js +13 -0
- package/dist/Components/RoiEditor/Canvas.d.ts +2 -0
- package/dist/Components/RoiEditor/Canvas.js +21 -11
- package/dist/Components/RoiEditor/Hooks.d.ts +16 -4
- package/dist/Components/RoiEditor/Hooks.js +148 -21
- package/dist/Components/RoiEditor/ParameterField.d.ts +9 -0
- package/dist/Components/RoiEditor/ParameterField.js +27 -0
- package/dist/Components/RoiEditor/ParametersModalForm/ParametersModalForm.module.css +5 -0
- package/dist/Components/RoiEditor/ParametersModalForm/index.d.ts +10 -0
- package/dist/Components/RoiEditor/ParametersModalForm/index.js +31 -0
- package/dist/Components/RoiEditor/Polygon.d.ts +3 -2
- package/dist/Components/RoiEditor/Polygon.js +18 -0
- package/dist/Components/RoiEditor/Polyline.d.ts +12 -1
- package/dist/Components/RoiEditor/Polyline.js +18 -0
- package/dist/Components/RoiEditor/Rectangle.d.ts +17 -1
- package/dist/Components/RoiEditor/Rectangle.js +23 -1
- package/dist/Components/RoiEditor/ShapesList.d.ts +2 -0
- package/dist/Components/RoiEditor/ShapesList.js +47 -0
- package/dist/Components/RoiEditor/ShapesList.module.css +36 -0
- package/dist/Components/RoiEditor/Toolbar.js +20 -6
- package/dist/Components/RoiEditor/Toolbar.module.css +40 -0
- package/dist/Components/RoiEditor/Types.d.ts +97 -1
- package/dist/Components/RoiEditor/Types.js +15 -1
- package/dist/Components/RoiEditor/Utils.d.ts +22 -0
- package/dist/Components/RoiEditor/Utils.js +143 -0
- package/dist/Components/RoiEditor/index.d.ts +4 -0
- package/dist/Components/RoiEditor/index.js +44 -7
- package/dist/Components/TextField/TextField.module.css +61 -0
- package/dist/Components/TextField/index.d.ts +6 -0
- package/dist/Components/TextField/index.js +13 -0
- package/dist/Components/Typography/index.d.ts +4 -0
- package/dist/Components/Typography/index.js +3 -2
- package/dist/Icons/AnnotateIcon.d.ts +6 -0
- package/dist/Icons/AnnotateIcon.js +5 -0
- package/dist/Icons/CloseIcon.d.ts +6 -0
- package/dist/Icons/CloseIcon.js +5 -0
- package/dist/Icons/CopyIcon.d.ts +6 -0
- package/dist/Icons/CopyIcon.js +5 -0
- package/dist/Icons/SaveIcon.d.ts +6 -0
- package/dist/Icons/SaveIcon.js +5 -0
- package/dist/Providers/EditorProvider.d.ts +12 -2
- package/dist/Providers/EditorProvider.js +16 -2
- package/dist/Providers/UiProvider.d.ts +44 -2
- package/dist/Providers/UiProvider.js +55 -2
- package/dist/Types.d.ts +10 -0
- package/dist/Types.js +1 -0
- package/dist/Utils/index.d.ts +1 -1
- package/dist/Utils/index.js +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/package.json +13 -4
- package/dist/Components/RoiEditor/Metadata.d.ts +0 -2
- package/dist/Components/RoiEditor/Metadata.js +0 -31
- package/dist/Components/RoiEditor/Metadata.module.css +0 -34
@@ -4,6 +4,17 @@ import IconButton from '../Components/IconButton';
|
|
4
4
|
import DeleteIcon from '../Icons/DeleteIcon';
|
5
5
|
import EditIcon from '../Icons/EditIcon';
|
6
6
|
import SelectIcon from '../Icons/SelectIcon';
|
7
|
+
import { INotify } from '../Components/RoiEditor/Types';
|
8
|
+
import CopyIcon from '../Icons/CopyIcon';
|
9
|
+
import AnnotateIcon from '../Icons/AnnotateIcon';
|
10
|
+
import Modal from '../Components/Modal';
|
11
|
+
import CloseIcon from '../Icons/CloseIcon';
|
12
|
+
import TextField from '../Components/TextField';
|
13
|
+
import NumberField from '../Components/NumberField';
|
14
|
+
import BoolField from '../Components/BoolField';
|
15
|
+
import EnumField from '../Components/EnumField';
|
16
|
+
import Button from '../Components/Button';
|
17
|
+
import SaveIcon from '../Icons/SaveIcon';
|
7
18
|
type UiContextType = {
|
8
19
|
children?: React.ReactNode;
|
9
20
|
enableLogs: boolean;
|
@@ -11,21 +22,52 @@ type UiContextType = {
|
|
11
22
|
primaryColor: string;
|
12
23
|
Typography: typeof Typography;
|
13
24
|
IconButton: typeof IconButton;
|
25
|
+
Modal: typeof Modal;
|
14
26
|
DeleteIcon: typeof DeleteIcon;
|
15
27
|
EditIcon: typeof EditIcon;
|
16
28
|
SelectIcon: typeof SelectIcon;
|
29
|
+
CopyIcon: typeof CopyIcon;
|
30
|
+
AnnotateIcon: typeof AnnotateIcon;
|
31
|
+
SaveIcon: typeof SaveIcon;
|
32
|
+
CloseIcon: typeof CloseIcon;
|
33
|
+
TextField: typeof TextField;
|
34
|
+
NumberField: typeof NumberField;
|
35
|
+
BoolField: typeof BoolField;
|
36
|
+
EnumField: typeof EnumField;
|
37
|
+
Button: typeof Button;
|
17
38
|
pickerColors: string[];
|
39
|
+
notify: INotify;
|
18
40
|
strings: {
|
41
|
+
cancel: string;
|
42
|
+
cannotDrawMorePolygons: string;
|
43
|
+
cannotDrawMorePolylines: string;
|
44
|
+
cannotDrawMoreRectangles: string;
|
19
45
|
id: string;
|
20
|
-
|
46
|
+
invalidSubmission: string;
|
47
|
+
mainParametersMetadata: string;
|
48
|
+
missingRequiredValuesInMainParameters: string;
|
49
|
+
missingRequiredValuesInShapeParameters: string;
|
21
50
|
polygon: string;
|
51
|
+
polygonHelpText: string;
|
22
52
|
polyline: string;
|
53
|
+
polylineHelpText: string;
|
54
|
+
rect: string;
|
55
|
+
rectHelpText: string;
|
56
|
+
pointer: string;
|
57
|
+
pointerHelpText: string;
|
58
|
+
requiredField: string;
|
59
|
+
save: string;
|
60
|
+
shapesOfTypeShouldBeEqualToThreshold: string;
|
61
|
+
shapesOfTypeShouldBeGreaterThanThreshold: string;
|
62
|
+
shapesOfTypeShouldBeGreaterThanOrEqualToThreshold: string;
|
63
|
+
shapesOfTypeShouldBeLessThanThreshold: string;
|
64
|
+
shapesOfTypeShouldBeLessThanOrEqualToThreshold: string;
|
23
65
|
type: string;
|
24
66
|
};
|
25
67
|
};
|
26
68
|
export declare const DefaultUiContext: UiContextType;
|
27
69
|
export declare const UiContext: import("react").Context<UiContextType>;
|
28
|
-
declare const UiProvider: ({ children, enableLogs, themeMode, primaryColor, Typography, IconButton, DeleteIcon, EditIcon, SelectIcon, pickerColors, strings, }: PropsWithChildren<Partial<Omit<UiContextType, "strings">> & {
|
70
|
+
declare const UiProvider: ({ children, enableLogs, themeMode, primaryColor, Typography, Modal, IconButton, DeleteIcon, EditIcon, SelectIcon, CopyIcon, AnnotateIcon, SaveIcon, CloseIcon, TextField, NumberField, BoolField, EnumField, Button, pickerColors, notify, strings, }: PropsWithChildren<Partial<Omit<UiContextType, "strings">> & {
|
29
71
|
strings?: Partial<UiContextType["strings"]>;
|
30
72
|
}>) => import("react/jsx-runtime").JSX.Element;
|
31
73
|
export default UiProvider;
|
@@ -5,36 +5,89 @@ import IconButton from '../Components/IconButton';
|
|
5
5
|
import DeleteIcon from '../Icons/DeleteIcon';
|
6
6
|
import EditIcon from '../Icons/EditIcon';
|
7
7
|
import SelectIcon from '../Icons/SelectIcon';
|
8
|
+
import { notify } from '../Components/RoiEditor/Utils';
|
9
|
+
import CopyIcon from '../Icons/CopyIcon';
|
10
|
+
import AnnotateIcon from '../Icons/AnnotateIcon';
|
11
|
+
import Modal from '../Components/Modal';
|
12
|
+
import CloseIcon from '../Icons/CloseIcon';
|
13
|
+
import TextField from '../Components/TextField';
|
14
|
+
import NumberField from '../Components/NumberField';
|
15
|
+
import BoolField from '../Components/BoolField';
|
16
|
+
import EnumField from '../Components/EnumField';
|
17
|
+
import Button from '../Components/Button';
|
18
|
+
import SaveIcon from '../Icons/SaveIcon';
|
8
19
|
export const DefaultUiContext = {
|
9
20
|
enableLogs: true,
|
10
21
|
themeMode: 'light',
|
11
22
|
primaryColor: '#1976d2',
|
12
23
|
Typography,
|
13
24
|
IconButton,
|
25
|
+
Modal,
|
14
26
|
DeleteIcon,
|
15
27
|
EditIcon,
|
16
28
|
SelectIcon,
|
29
|
+
CopyIcon,
|
30
|
+
AnnotateIcon,
|
31
|
+
SaveIcon,
|
32
|
+
CloseIcon,
|
33
|
+
TextField,
|
34
|
+
NumberField,
|
35
|
+
BoolField,
|
36
|
+
EnumField,
|
37
|
+
Button,
|
17
38
|
pickerColors: ['#ffffff', '#000000', '#ff9900', '#0099ff'],
|
39
|
+
notify,
|
18
40
|
strings: {
|
41
|
+
cancel: 'Cancel',
|
42
|
+
cannotDrawMorePolygons: 'You cannot draw more polygons',
|
43
|
+
cannotDrawMorePolylines: 'You cannot draw more polylines',
|
44
|
+
cannotDrawMoreRectangles: 'You cannot draw more rectangles',
|
19
45
|
id: 'ID',
|
46
|
+
invalidSubmission: 'Invalid submission',
|
47
|
+
mainParametersMetadata: 'Main parameters',
|
48
|
+
missingRequiredValuesInMainParameters: 'Missing required values in main parameters',
|
49
|
+
missingRequiredValuesInShapeParameters: 'Missing required values in shape {id} parameters',
|
20
50
|
polygon: 'Polygon',
|
51
|
+
polygonHelpText: 'click to draw all the polygon points, double click on the last point to close the polygon',
|
21
52
|
polyline: 'Polyline',
|
22
|
-
|
53
|
+
polylineHelpText: 'click to draw all the polyline points, double click on the last point to stop drawing',
|
54
|
+
rect: 'Rectangle',
|
55
|
+
rectHelpText: 'click and drag to draw the rectangle',
|
56
|
+
pointer: 'Selection',
|
57
|
+
pointerHelpText: 'click a shape to select it',
|
58
|
+
requiredField: 'This field is required',
|
59
|
+
save: 'Save',
|
60
|
+
shapesOfTypeShouldBeEqualToThreshold: 'Shapes of type {type} should be equal to {threshold}',
|
61
|
+
shapesOfTypeShouldBeGreaterThanThreshold: 'Shapes of type {type} should be greater than {threshold}',
|
62
|
+
shapesOfTypeShouldBeGreaterThanOrEqualToThreshold: 'Shapes of type {type} should be greater than or equal to {threshold}',
|
63
|
+
shapesOfTypeShouldBeLessThanThreshold: 'Shapes of type {type} should be less than {threshold}',
|
64
|
+
shapesOfTypeShouldBeLessThanOrEqualToThreshold: 'Shapes of type {type} should be less than or equal to {threshold}',
|
23
65
|
type: 'Type',
|
24
66
|
},
|
25
67
|
};
|
26
68
|
export const UiContext = createContext(DefaultUiContext);
|
27
|
-
const UiProvider = ({ children, enableLogs, themeMode, primaryColor, Typography, IconButton, DeleteIcon, EditIcon, SelectIcon, pickerColors, strings, }) => {
|
69
|
+
const UiProvider = ({ children, enableLogs, themeMode, primaryColor, Typography, Modal, IconButton, DeleteIcon, EditIcon, SelectIcon, CopyIcon, AnnotateIcon, SaveIcon, CloseIcon, TextField, NumberField, BoolField, EnumField, Button, pickerColors, notify, strings, }) => {
|
28
70
|
const ctx = {
|
29
71
|
enableLogs: enableLogs !== null && enableLogs !== void 0 ? enableLogs : DefaultUiContext.enableLogs,
|
30
72
|
Typography: Typography !== null && Typography !== void 0 ? Typography : DefaultUiContext.Typography,
|
73
|
+
Modal: Modal !== null && Modal !== void 0 ? Modal : DefaultUiContext.Modal,
|
31
74
|
IconButton: IconButton !== null && IconButton !== void 0 ? IconButton : DefaultUiContext.IconButton,
|
32
75
|
DeleteIcon: DeleteIcon !== null && DeleteIcon !== void 0 ? DeleteIcon : DefaultUiContext.DeleteIcon,
|
33
76
|
EditIcon: EditIcon !== null && EditIcon !== void 0 ? EditIcon : DefaultUiContext.EditIcon,
|
34
77
|
SelectIcon: SelectIcon !== null && SelectIcon !== void 0 ? SelectIcon : DefaultUiContext.SelectIcon,
|
78
|
+
CopyIcon: CopyIcon !== null && CopyIcon !== void 0 ? CopyIcon : DefaultUiContext.CopyIcon,
|
79
|
+
AnnotateIcon: AnnotateIcon !== null && AnnotateIcon !== void 0 ? AnnotateIcon : DefaultUiContext.AnnotateIcon,
|
80
|
+
SaveIcon: SaveIcon !== null && SaveIcon !== void 0 ? SaveIcon : DefaultUiContext.SaveIcon,
|
81
|
+
CloseIcon: CloseIcon !== null && CloseIcon !== void 0 ? CloseIcon : DefaultUiContext.CloseIcon,
|
82
|
+
TextField: TextField !== null && TextField !== void 0 ? TextField : DefaultUiContext.TextField,
|
83
|
+
NumberField: NumberField !== null && NumberField !== void 0 ? NumberField : DefaultUiContext.NumberField,
|
84
|
+
BoolField: BoolField !== null && BoolField !== void 0 ? BoolField : DefaultUiContext.BoolField,
|
85
|
+
EnumField: EnumField !== null && EnumField !== void 0 ? EnumField : DefaultUiContext.EnumField,
|
86
|
+
Button: Button !== null && Button !== void 0 ? Button : DefaultUiContext.Button,
|
35
87
|
themeMode: themeMode !== null && themeMode !== void 0 ? themeMode : DefaultUiContext.themeMode,
|
36
88
|
primaryColor: primaryColor !== null && primaryColor !== void 0 ? primaryColor : DefaultUiContext.primaryColor,
|
37
89
|
pickerColors: pickerColors !== null && pickerColors !== void 0 ? pickerColors : DefaultUiContext.pickerColors,
|
90
|
+
notify: notify !== null && notify !== void 0 ? notify : DefaultUiContext.notify,
|
38
91
|
strings: strings ? Object.assign(Object.assign({}, DefaultUiContext.strings), strings) : DefaultUiContext.strings,
|
39
92
|
};
|
40
93
|
return _jsx(UiContext.Provider, { value: ctx, children: children });
|
package/dist/Types.d.ts
ADDED
package/dist/Types.js
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
package/dist/Utils/index.d.ts
CHANGED
@@ -1,2 +1,2 @@
|
|
1
1
|
export declare const log: (level: "log" | "info" | "warn" | "error", enable: boolean, ...args: unknown[]) => false | void;
|
2
|
-
export declare const css: (name: string, styles: Record<string, string>, themeMode: "light" | "dark") => string;
|
2
|
+
export declare const css: (name: string, styles: Record<string, string>, themeMode: "light" | "dark" | null) => string;
|
package/dist/Utils/index.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
1
|
export const log = (level, enable, ...args) => enable && console[level](...args);
|
2
|
-
export const css = (name, styles, themeMode) => `${styles[name]} ${styles[`${name}-${themeMode}`]} react-cam-roi-${name} react-cam-roi-${name}-${themeMode}`;
|
2
|
+
export const css = (name, styles, themeMode) => `${styles[name]} ${styles[`${name}-${themeMode}`]} react-cam-roi-${name}${themeMode ? `react-cam-roi-${name}-${themeMode}` : ''}`;
|
package/dist/index.d.ts
CHANGED
@@ -1,3 +1,4 @@
|
|
1
1
|
import RoiEditor from "./Components/RoiEditor";
|
2
2
|
import UiProvider, { UiContext, DefaultUiContext } from "./Providers/UiProvider";
|
3
|
-
|
3
|
+
import * as Types from "./Components/RoiEditor/Types";
|
4
|
+
export { RoiEditor, UiProvider, UiContext, DefaultUiContext, Types };
|
package/dist/index.js
CHANGED
@@ -1,3 +1,4 @@
|
|
1
1
|
import RoiEditor from "./Components/RoiEditor";
|
2
2
|
import UiProvider, { UiContext, DefaultUiContext } from "./Providers/UiProvider";
|
3
|
-
|
3
|
+
import * as Types from "./Components/RoiEditor/Types";
|
4
|
+
export { RoiEditor, UiProvider, UiContext, DefaultUiContext, Types };
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@abidibo/react-cam-roi",
|
3
|
-
"version": "0.0.
|
3
|
+
"version": "0.0.10",
|
4
4
|
"description": "A react component for drawing ROI over images and managing metadata",
|
5
5
|
"repository": {
|
6
6
|
"type": "git",
|
@@ -37,7 +37,11 @@
|
|
37
37
|
"license": "MIT",
|
38
38
|
"devDependencies": {
|
39
39
|
"@chromatic-com/storybook": "^3.2.3",
|
40
|
+
"@emotion/react": "^11.14.0",
|
41
|
+
"@emotion/styled": "^11.14.0",
|
40
42
|
"@eslint/js": "^9.18.0",
|
43
|
+
"@fontsource/roboto": "^5.1.1",
|
44
|
+
"@mui/material": "^6.4.3",
|
41
45
|
"@storybook/addon-essentials": "^8.4.7",
|
42
46
|
"@storybook/addon-interactions": "^8.4.7",
|
43
47
|
"@storybook/addon-onboarding": "^8.4.7",
|
@@ -47,14 +51,14 @@
|
|
47
51
|
"@storybook/react-vite": "^8.4.7",
|
48
52
|
"@storybook/test": "^8.4.7",
|
49
53
|
"@trivago/prettier-plugin-sort-imports": "^5.2.1",
|
50
|
-
"@types/react": "^
|
54
|
+
"@types/react": "^18.0.0",
|
55
|
+
"@types/react-dom": "^18.0.0",
|
51
56
|
"copyfiles": "^2.4.1",
|
52
57
|
"eslint": "^9.18.0",
|
53
58
|
"eslint-plugin-react-hooks": "^5.1.0",
|
54
59
|
"eslint-plugin-react-refresh": "^0.4.18",
|
55
60
|
"globals": "^15.14.0",
|
56
61
|
"prettier": "^3.4.2",
|
57
|
-
"react": "^19.0.0",
|
58
62
|
"rimraf": "^6.0.1",
|
59
63
|
"storybook": "^8.4.7",
|
60
64
|
"typescript": "^5.7.3",
|
@@ -62,6 +66,11 @@
|
|
62
66
|
},
|
63
67
|
"dependencies": {
|
64
68
|
"fabric": "^6.5.4",
|
65
|
-
"uuidv4": "^6.2.13"
|
69
|
+
"uuidv4": "^6.2.13",
|
70
|
+
"vite": "^6.1.0"
|
71
|
+
},
|
72
|
+
"peerDependencies": {
|
73
|
+
"react": "^18.0.0",
|
74
|
+
"react-dom": "^18.0.0"
|
66
75
|
}
|
67
76
|
}
|
@@ -1,31 +0,0 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
-
import { useContext, useEffect, useState } from 'react';
|
3
|
-
import { useEditorContext } from '../../Providers/EditorProvider';
|
4
|
-
import { UiContext } from '../../Providers/UiProvider';
|
5
|
-
import { css } from '../../Utils';
|
6
|
-
import Dispatcher from '../../Utils/Dispatcher';
|
7
|
-
import styles from './Metadata.module.css';
|
8
|
-
const Metadata = () => {
|
9
|
-
const { strings, Typography, IconButton, DeleteIcon, EditIcon, SelectIcon, themeMode } = useContext(UiContext);
|
10
|
-
const { shapes, removeShape } = useEditorContext();
|
11
|
-
const [selected, setSelected] = useState([]);
|
12
|
-
useEffect(() => {
|
13
|
-
const setSelectedShapes = (_, event) => { var _a; return setSelected((_a = event === null || event === void 0 ? void 0 : event.map((s) => s.id)) !== null && _a !== void 0 ? _a : []); };
|
14
|
-
Dispatcher.register('canvas:shapeSelected', setSelectedShapes);
|
15
|
-
return () => {
|
16
|
-
Dispatcher.unregister('canvas:shapeSelected', setSelectedShapes);
|
17
|
-
};
|
18
|
-
}, [shapes]);
|
19
|
-
const handleRemoveShape = (id) => () => {
|
20
|
-
Dispatcher.emit('canvas:removeShape', id);
|
21
|
-
removeShape(id);
|
22
|
-
};
|
23
|
-
const handleSelectShape = (id) => () => {
|
24
|
-
Dispatcher.emit('canvas:selectShape', id);
|
25
|
-
};
|
26
|
-
const iconColor = themeMode === 'light' ? 'black' : 'white';
|
27
|
-
return (_jsxs("table", { className: css('metadata-table', styles, themeMode), children: [Object.keys(shapes).length > 0 && (_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: _jsx(Typography, { children: strings.id }) }), _jsx("th", { children: _jsx(Typography, { children: strings.type }) }), _jsx("th", {})] }) })), _jsx("tbody", { children: Object.keys(shapes).map((id) => {
|
28
|
-
return (_jsxs("tr", { className: selected.indexOf(id) > -1 ? css('metadata-row-selected', styles, themeMode) : '', children: [_jsx("td", { children: _jsx("div", { children: _jsx(Typography, { children: id.substring(0, 6) }) }) }), _jsx("td", { children: _jsx(Typography, { children: strings[shapes[id].type] }) }), _jsxs("td", { children: [_jsx(IconButton, { onClick: handleSelectShape(id), children: _jsx(SelectIcon, { color: iconColor }) }), _jsx(IconButton, { onClick: handleRemoveShape(id), children: _jsx(EditIcon, { color: iconColor }) }), _jsx(IconButton, { onClick: handleRemoveShape(id), children: _jsx(DeleteIcon, { color: iconColor }) })] })] }, id));
|
29
|
-
}) })] }));
|
30
|
-
};
|
31
|
-
export default Metadata;
|
@@ -1,34 +0,0 @@
|
|
1
|
-
.metadata-table {
|
2
|
-
border-collapse: collapse;
|
3
|
-
width: 100%;
|
4
|
-
}
|
5
|
-
|
6
|
-
.metadata-table th {
|
7
|
-
padding: .8rem .3rem .3rem;
|
8
|
-
text-align: left;
|
9
|
-
}
|
10
|
-
|
11
|
-
.metadata-table td {
|
12
|
-
padding: 0 .3rem;
|
13
|
-
}
|
14
|
-
|
15
|
-
.metadata-table tr td:last-child,
|
16
|
-
.metadata-table tr th:last-child {
|
17
|
-
text-align: right;
|
18
|
-
}
|
19
|
-
|
20
|
-
.metadata-table-light {
|
21
|
-
color: #000;
|
22
|
-
}
|
23
|
-
|
24
|
-
.metadata-table-dark {
|
25
|
-
color: #fff;
|
26
|
-
}
|
27
|
-
|
28
|
-
.metadata-row-selected-light {
|
29
|
-
background-color: #ccc;
|
30
|
-
}
|
31
|
-
|
32
|
-
.metadata-row-selected-dark {
|
33
|
-
background-color: #666;
|
34
|
-
}
|