@sijanbhattarai/veda-ui 0.1.35
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/dist/index.d.ts +1 -0
- package/dist/index.js +140 -0
- package/dist/index.js.map +1 -0
- package/dist/toolbar.d.ts +8 -0
- package/package.json +50 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { DEFAULT_MAP_PROPS, DEFAULT_CHART_PROPS, InsertMapButton, InsertLineGraph, InsertSectionBreak, InsertIframe } from './toolbar';
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
import { jsxs as s, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { usePublisher as a, insertJsx$ as n, Button as o } from "@mdxeditor/editor";
|
|
3
|
+
import { Icon as c } from "@trussworks/react-uswds";
|
|
4
|
+
const l = {
|
|
5
|
+
center: "[-94.5, 41.25]",
|
|
6
|
+
zoom: "8.3",
|
|
7
|
+
datasetId: "ct-ch4-monthgrid-v2023",
|
|
8
|
+
layerId: "total-ch4",
|
|
9
|
+
dateTime: "2020-12-31",
|
|
10
|
+
compareDateTime: "2015-12-31",
|
|
11
|
+
compareLabel: "2020 VS 2015",
|
|
12
|
+
attrUrl: "",
|
|
13
|
+
attrAuthor: "",
|
|
14
|
+
caption: ""
|
|
15
|
+
}, d = {
|
|
16
|
+
dataPath: "",
|
|
17
|
+
dateFormat: "%Y-%m-%d",
|
|
18
|
+
idKey: "id",
|
|
19
|
+
xKey: "date",
|
|
20
|
+
yKey: "value",
|
|
21
|
+
yAxisLabel: "Value",
|
|
22
|
+
xAxisLabel: "Date",
|
|
23
|
+
highlightStart: "",
|
|
24
|
+
highlightEnd: "",
|
|
25
|
+
highlightLabel: "",
|
|
26
|
+
availableDomain: "",
|
|
27
|
+
altTitle: "Chart",
|
|
28
|
+
colorScheme: "default",
|
|
29
|
+
colors: "",
|
|
30
|
+
altDesc: "A data visualization chart"
|
|
31
|
+
}, g = () => {
|
|
32
|
+
const e = a(n);
|
|
33
|
+
return /* @__PURE__ */ s(
|
|
34
|
+
o,
|
|
35
|
+
{
|
|
36
|
+
onClick: () => {
|
|
37
|
+
try {
|
|
38
|
+
e({
|
|
39
|
+
name: "MapBlock",
|
|
40
|
+
kind: "flow",
|
|
41
|
+
props: {
|
|
42
|
+
datasetId: l.datasetId,
|
|
43
|
+
layerId: l.layerId,
|
|
44
|
+
dateTime: l.dateTime
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
} catch (t) {
|
|
48
|
+
console.error("Error inserting Map component:", t), alert("Could not insert Map component. See console for details.");
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
title: "Insert Map",
|
|
52
|
+
className: "text-sm display-flex flex-align-center padding-1",
|
|
53
|
+
children: [
|
|
54
|
+
/* @__PURE__ */ r(c.Map, { className: "margin-right-05 width-3 height-3", "aria-hidden": "true" }),
|
|
55
|
+
"Add Map"
|
|
56
|
+
]
|
|
57
|
+
}
|
|
58
|
+
);
|
|
59
|
+
}, f = () => {
|
|
60
|
+
const e = a(n);
|
|
61
|
+
return /* @__PURE__ */ s(
|
|
62
|
+
o,
|
|
63
|
+
{
|
|
64
|
+
onClick: () => {
|
|
65
|
+
try {
|
|
66
|
+
e({
|
|
67
|
+
name: "Chart",
|
|
68
|
+
kind: "flow",
|
|
69
|
+
props: { ...d }
|
|
70
|
+
});
|
|
71
|
+
} catch (t) {
|
|
72
|
+
console.error("Error inserting Chart component:", t), alert("Could not insert chart component. See console for details.");
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
title: "Insert Line Graph",
|
|
76
|
+
className: "text-sm display-flex flex-align-center padding-1",
|
|
77
|
+
children: [
|
|
78
|
+
/* @__PURE__ */ r(c.Insights, { className: "margin-right-05 width-3 height-3", "aria-hidden": "true" }),
|
|
79
|
+
"line graph"
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
);
|
|
83
|
+
}, x = () => {
|
|
84
|
+
const e = a(n);
|
|
85
|
+
return /* @__PURE__ */ r(
|
|
86
|
+
o,
|
|
87
|
+
{
|
|
88
|
+
onClick: () => {
|
|
89
|
+
try {
|
|
90
|
+
e({
|
|
91
|
+
name: "Break",
|
|
92
|
+
kind: "text",
|
|
93
|
+
props: {}
|
|
94
|
+
});
|
|
95
|
+
} catch (t) {
|
|
96
|
+
console.error("Error inserting Break component:", t), alert("Could not insert break component. See console for details.");
|
|
97
|
+
}
|
|
98
|
+
},
|
|
99
|
+
title: "Insert Break",
|
|
100
|
+
className: "text-sm display-flex flex-align-center padding-1",
|
|
101
|
+
children: "Insert Break"
|
|
102
|
+
}
|
|
103
|
+
);
|
|
104
|
+
}, k = () => {
|
|
105
|
+
const e = a(n);
|
|
106
|
+
return /* @__PURE__ */ r(
|
|
107
|
+
o,
|
|
108
|
+
{
|
|
109
|
+
onClick: () => {
|
|
110
|
+
try {
|
|
111
|
+
e({
|
|
112
|
+
name: "iframe",
|
|
113
|
+
kind: "flow",
|
|
114
|
+
props: {
|
|
115
|
+
src: "https://example.com",
|
|
116
|
+
width: "100%",
|
|
117
|
+
height: "400",
|
|
118
|
+
frameBorder: "0",
|
|
119
|
+
title: "Embedded Content"
|
|
120
|
+
}
|
|
121
|
+
});
|
|
122
|
+
} catch (t) {
|
|
123
|
+
console.error("Error inserting iframe component:", t), alert("Could not insert iframe. See console for details.");
|
|
124
|
+
}
|
|
125
|
+
},
|
|
126
|
+
title: "Insert Iframe",
|
|
127
|
+
className: "text-sm display-flex flex-align-center padding-1",
|
|
128
|
+
children: "Insert Iframe"
|
|
129
|
+
}
|
|
130
|
+
);
|
|
131
|
+
};
|
|
132
|
+
export {
|
|
133
|
+
d as DEFAULT_CHART_PROPS,
|
|
134
|
+
l as DEFAULT_MAP_PROPS,
|
|
135
|
+
k as InsertIframe,
|
|
136
|
+
f as InsertLineGraph,
|
|
137
|
+
g as InsertMapButton,
|
|
138
|
+
x as InsertSectionBreak
|
|
139
|
+
};
|
|
140
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, usePublisher, insertJsx$ } from '@mdxeditor/editor';\nimport { Icon } from '@trussworks/react-uswds';\nimport { MapProps, ChartProps } from '@sijanbhattarai/mdx-editor-core';\n\nexport const DEFAULT_MAP_PROPS: MapProps = {\n center: '[-94.5, 41.25]',\n zoom: '8.3',\n datasetId: 'ct-ch4-monthgrid-v2023',\n layerId: 'total-ch4',\n dateTime: '2020-12-31',\n compareDateTime: '2015-12-31',\n compareLabel: '2020 VS 2015',\n attrUrl: '',\n attrAuthor: '',\n caption: '',\n};\n\nexport const DEFAULT_CHART_PROPS: ChartProps = {\n dataPath: '',\n dateFormat: '%Y-%m-%d',\n idKey: 'id',\n xKey: 'date',\n yKey: 'value',\n yAxisLabel: 'Value',\n xAxisLabel: 'Date',\n highlightStart: '',\n highlightEnd: '',\n highlightLabel: '',\n availableDomain: '',\n altTitle: 'Chart',\n colorScheme: 'default',\n colors: '',\n altDesc: 'A data visualization chart',\n};\n\nexport const InsertMapButton = () => {\n const insertJsx = usePublisher(insertJsx$);\n\n const handleClick = () => {\n try {\n insertJsx({\n name: 'MapBlock',\n kind: 'flow',\n props: { \n datasetId: DEFAULT_MAP_PROPS.datasetId,\n layerId: DEFAULT_MAP_PROPS.layerId,\n dateTime: DEFAULT_MAP_PROPS.dateTime,\n },\n });\n } catch (error) {\n console.error('Error inserting Map component:', error);\n alert('Could not insert Map component. See console for details.');\n }\n };\n\n return (\n <Button\n onClick={handleClick}\n title='Insert Map'\n className='text-sm display-flex flex-align-center padding-1'\n >\n <Icon.Map className='margin-right-05 width-3 height-3' aria-hidden=\"true\" />\n Add Map\n </Button>\n );\n};\n\nexport const InsertLineGraph = () => {\n const insertJsx = usePublisher(insertJsx$);\n\n const handleClick = () => {\n try {\n insertJsx({\n name: 'Chart',\n kind: 'flow',\n props: { ...DEFAULT_CHART_PROPS },\n });\n } catch (error) {\n console.error('Error inserting Chart component:', error);\n alert('Could not insert chart component. See console for details.');\n }\n };\n\n return (\n <Button\n onClick={handleClick}\n title='Insert Line Graph'\n className='text-sm display-flex flex-align-center padding-1'\n >\n <Icon.Insights className='margin-right-05 width-3 height-3' aria-hidden=\"true\" />\n line graph\n </Button>\n );\n};\n\nexport const InsertSectionBreak = () => {\n const insertJsx = usePublisher(insertJsx$);\n\n const handleClick = () => {\n try {\n insertJsx({\n name: 'Break',\n kind: 'text',\n props: {},\n });\n } catch (error) {\n console.error('Error inserting Break component:', error);\n alert('Could not insert break component. See console for details.');\n }\n };\n\n return (\n <Button\n onClick={handleClick}\n title='Insert Break'\n className='text-sm display-flex flex-align-center padding-1'\n >\n Insert Break\n </Button>\n );\n};\n\nexport const InsertIframe = () => {\n const insertJsx = usePublisher(insertJsx$);\n\n const handleClick = () => {\n try {\n insertJsx({\n name: 'iframe',\n kind: 'flow',\n props: {\n src: 'https://example.com',\n width: '100%',\n height: '400',\n frameBorder: '0',\n title: 'Embedded Content'\n },\n });\n } catch (error) {\n console.error('Error inserting iframe component:', error);\n alert('Could not insert iframe. See console for details.');\n }\n };\n\n return (\n <Button\n onClick={handleClick}\n title='Insert Iframe'\n className='text-sm display-flex flex-align-center padding-1'\n >\n Insert Iframe\n </Button>\n );\n};"],"names":["DEFAULT_MAP_PROPS","DEFAULT_CHART_PROPS","InsertMapButton","insertJsx","usePublisher","insertJsx$","jsxs","Button","error","jsx","Icon","InsertLineGraph","InsertSectionBreak","InsertIframe"],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { MapProps, ChartProps } from '@sijanbhattarai/mdx-editor-core';
|
|
2
|
+
|
|
3
|
+
export declare const DEFAULT_MAP_PROPS: MapProps;
|
|
4
|
+
export declare const DEFAULT_CHART_PROPS: ChartProps;
|
|
5
|
+
export declare const InsertMapButton: () => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare const InsertLineGraph: () => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const InsertSectionBreak: () => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const InsertIframe: () => import("react/jsx-runtime").JSX.Element;
|
package/package.json
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@sijanbhattarai/veda-ui",
|
|
3
|
+
"version": "0.1.35",
|
|
4
|
+
"description": "UI components for MDXEditor",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.js",
|
|
11
|
+
"types": "./dist/index.d.ts"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
"files": [
|
|
15
|
+
"dist"
|
|
16
|
+
],
|
|
17
|
+
"scripts": {
|
|
18
|
+
"build": "vite build",
|
|
19
|
+
"dev": "vite build --watch",
|
|
20
|
+
"prepublishOnly": "npm run build"
|
|
21
|
+
},
|
|
22
|
+
"peerDependencies": {
|
|
23
|
+
"react": "^18.0.0",
|
|
24
|
+
"react-dom": "^18.0.0",
|
|
25
|
+
"@mdxeditor/editor": "^3.40.1",
|
|
26
|
+
"@trussworks/react-uswds": "^9.0.0"
|
|
27
|
+
},
|
|
28
|
+
"dependencies": {
|
|
29
|
+
"@sijanbhattarai/mdx-editor-core": "^0.1.6"
|
|
30
|
+
},
|
|
31
|
+
"devDependencies": {
|
|
32
|
+
"@types/react": "^18.0.0",
|
|
33
|
+
"@types/react-dom": "^18.0.0",
|
|
34
|
+
"typescript": "^5.0.0",
|
|
35
|
+
"vite": "^5.0.0",
|
|
36
|
+
"@vitejs/plugin-react": "^4.0.0",
|
|
37
|
+
"vite-plugin-dts": "^3.0.0"
|
|
38
|
+
},
|
|
39
|
+
"repository": {
|
|
40
|
+
"type": "git",
|
|
41
|
+
"url": "https://github.com/NASA-IMPACT/mdx-editor-components.git"
|
|
42
|
+
},
|
|
43
|
+
"keywords": [
|
|
44
|
+
"mdx",
|
|
45
|
+
"editor",
|
|
46
|
+
"ui"
|
|
47
|
+
],
|
|
48
|
+
"author": "NASA IMPACT",
|
|
49
|
+
"license": "MIT"
|
|
50
|
+
}
|