@microbit/makecode-embed 0.1.0 → 0.2.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 (79) hide show
  1. package/dist/cjs/index.d.ts +10 -0
  2. package/dist/cjs/index.js +25 -0
  3. package/dist/cjs/index.js.map +1 -0
  4. package/dist/cjs/package.json +1 -0
  5. package/dist/cjs/react/MakeCodeBlocksRendering.js +105 -0
  6. package/dist/cjs/react/MakeCodeBlocksRendering.js.map +1 -0
  7. package/dist/cjs/react/MakeCodeFrame.js +74 -0
  8. package/dist/cjs/react/MakeCodeFrame.js.map +1 -0
  9. package/dist/cjs/react/MakeCodeRenderBlocksProvider.js +25 -0
  10. package/dist/cjs/react/MakeCodeRenderBlocksProvider.js.map +1 -0
  11. package/dist/cjs/react/index.js +23 -0
  12. package/dist/cjs/react/index.js.map +1 -0
  13. package/dist/cjs/react/useMakeCodeRenderBlocks.js +18 -0
  14. package/dist/cjs/react/useMakeCodeRenderBlocks.js.map +1 -0
  15. package/dist/cjs/vanilla/examples.js +20 -0
  16. package/dist/cjs/vanilla/examples.js.map +1 -0
  17. package/dist/cjs/vanilla/index.js +14 -0
  18. package/dist/cjs/vanilla/index.js.map +1 -0
  19. package/dist/cjs/vanilla/makecode-frame-driver.js +638 -0
  20. package/dist/cjs/vanilla/makecode-frame-driver.js.map +1 -0
  21. package/dist/cjs/vanilla/makecode-render-blocks.js +217 -0
  22. package/dist/cjs/vanilla/makecode-render-blocks.js.map +1 -0
  23. package/dist/cjs/vanilla/pxt.js +36 -0
  24. package/dist/cjs/vanilla/pxt.js.map +1 -0
  25. package/dist/esm/index.d.ts +10 -0
  26. package/dist/esm/index.js +9 -0
  27. package/dist/esm/index.js.map +1 -0
  28. package/dist/esm/package.json +1 -0
  29. package/dist/esm/react/MakeCodeBlocksRendering.d.ts +24 -0
  30. package/dist/esm/react/MakeCodeBlocksRendering.js.map +1 -0
  31. package/dist/esm/react/MakeCodeFrame.d.ts +38 -0
  32. package/dist/esm/react/MakeCodeFrame.js.map +1 -0
  33. package/dist/esm/react/MakeCodeRenderBlocksProvider.d.ts +18 -0
  34. package/dist/esm/react/MakeCodeRenderBlocksProvider.js.map +1 -0
  35. package/dist/esm/react/index.d.ts +8 -0
  36. package/dist/esm/react/index.js.map +1 -0
  37. package/dist/esm/react/useMakeCodeRenderBlocks.d.ts +6 -0
  38. package/dist/esm/react/useMakeCodeRenderBlocks.js.map +1 -0
  39. package/dist/esm/vanilla/examples.d.ts +3 -0
  40. package/dist/esm/vanilla/examples.js.map +1 -0
  41. package/dist/esm/vanilla/index.d.ts +6 -0
  42. package/dist/esm/vanilla/index.js.map +1 -0
  43. package/dist/esm/vanilla/makecode-frame-driver.d.ts +264 -0
  44. package/dist/esm/vanilla/makecode-frame-driver.js.map +1 -0
  45. package/dist/esm/vanilla/makecode-render-blocks.d.ts +31 -0
  46. package/dist/esm/vanilla/makecode-render-blocks.js.map +1 -0
  47. package/dist/esm/vanilla/pxt.d.ts +845 -0
  48. package/dist/esm/vanilla/pxt.js.map +1 -0
  49. package/package.json +35 -8
  50. package/dist/react/MakeCodeBlocksRendering.js.map +0 -1
  51. package/dist/react/MakeCodeFrame.js.map +0 -1
  52. package/dist/react/MakeCodeRenderBlocksProvider.js.map +0 -1
  53. package/dist/react/index.js.map +0 -1
  54. package/dist/react/useMakeCodeRenderBlocks.js.map +0 -1
  55. package/dist/vanilla/examples.js.map +0 -1
  56. package/dist/vanilla/index.js.map +0 -1
  57. package/dist/vanilla/makecode-frame-driver.js.map +0 -1
  58. package/dist/vanilla/makecode-render-blocks.js.map +0 -1
  59. package/dist/vanilla/pxt.js.map +0 -1
  60. /package/dist/{react → cjs/react}/MakeCodeBlocksRendering.d.ts +0 -0
  61. /package/dist/{react → cjs/react}/MakeCodeFrame.d.ts +0 -0
  62. /package/dist/{react → cjs/react}/MakeCodeRenderBlocksProvider.d.ts +0 -0
  63. /package/dist/{react → cjs/react}/index.d.ts +0 -0
  64. /package/dist/{react → cjs/react}/useMakeCodeRenderBlocks.d.ts +0 -0
  65. /package/dist/{vanilla → cjs/vanilla}/examples.d.ts +0 -0
  66. /package/dist/{vanilla → cjs/vanilla}/index.d.ts +0 -0
  67. /package/dist/{vanilla → cjs/vanilla}/makecode-frame-driver.d.ts +0 -0
  68. /package/dist/{vanilla → cjs/vanilla}/makecode-render-blocks.d.ts +0 -0
  69. /package/dist/{vanilla → cjs/vanilla}/pxt.d.ts +0 -0
  70. /package/dist/{react → esm/react}/MakeCodeBlocksRendering.js +0 -0
  71. /package/dist/{react → esm/react}/MakeCodeFrame.js +0 -0
  72. /package/dist/{react → esm/react}/MakeCodeRenderBlocksProvider.js +0 -0
  73. /package/dist/{react → esm/react}/index.js +0 -0
  74. /package/dist/{react → esm/react}/useMakeCodeRenderBlocks.js +0 -0
  75. /package/dist/{vanilla → esm/vanilla}/examples.js +0 -0
  76. /package/dist/{vanilla → esm/vanilla}/index.js +0 -0
  77. /package/dist/{vanilla → esm/vanilla}/makecode-frame-driver.js +0 -0
  78. /package/dist/{vanilla → esm/vanilla}/makecode-render-blocks.js +0 -0
  79. /package/dist/{vanilla → esm/vanilla}/pxt.js +0 -0
@@ -0,0 +1,10 @@
1
+ export { default as MakeCodeFrame, type MakeCodeFrameProps, } from './react/MakeCodeFrame.js';
2
+ export { default as useMakeCodeRenderBlocks, type UseMakeCodeRenderBlocksReturn, } from './react/useMakeCodeRenderBlocks.js';
3
+ export { MakeCodeRenderBlocksProvider } from './react/MakeCodeRenderBlocksProvider.js';
4
+ export { default as MakeCodeBlocksRendering, type MakeCodeBlocksRenderingProps, } from './react/MakeCodeBlocksRendering.js';
5
+ export { defaultMakeCodeProject, emptyMakeCodeProject, } from './vanilla/examples.js';
6
+ export { MakeCodeFrameDriver, createMakeCodeURL, } from './vanilla/makecode-frame-driver.js';
7
+ export { BlockLayout } from './vanilla/pxt.js';
8
+ export { createMakeCodeRenderBlocks } from './vanilla/makecode-render-blocks.js';
9
+ export type { MakeCodeRenderBlocksOptions, MakeCodeRenderBlocksReturn, RenderBlocksResponse, RenderBlocksRequest, } from './vanilla/makecode-render-blocks.js';
10
+ export type { CreateEvent, EditorContentLoadedRequest, EditorEvent, EditorMessageTutorialCompletedEventRequest, EditorMessageTutorialEventRequest, EditorMessageTutorialExitEventRequest, EditorMessageTutorialLoadedEventRequest, EditorMessageTutorialProgressEventRequest, EditorWorkspaceSaveRequest, EditorWorkspaceSyncRequest, ImportExternalProjectOptions, ImportFileOptions, ImportProjectOptions, InfoMessage, LanguageRestriction, MakeCodeProject, ProjectCreationOptions, ProjectFilters, RenderBlocksOptions, RenderByBlockIdOptions, RenderXmlOptions, ShareResult, StartActivityOptions, ToolboxBlockDefinition, ToolboxCategoryDefinition, UIEvent, } from './vanilla/pxt.js';
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.createMakeCodeRenderBlocks = exports.BlockLayout = exports.createMakeCodeURL = exports.MakeCodeFrameDriver = exports.emptyMakeCodeProject = exports.defaultMakeCodeProject = exports.MakeCodeBlocksRendering = exports.MakeCodeRenderBlocksProvider = exports.useMakeCodeRenderBlocks = exports.MakeCodeFrame = void 0;
7
+ var MakeCodeFrame_js_1 = require("./react/MakeCodeFrame.js");
8
+ Object.defineProperty(exports, "MakeCodeFrame", { enumerable: true, get: function () { return __importDefault(MakeCodeFrame_js_1).default; } });
9
+ var useMakeCodeRenderBlocks_js_1 = require("./react/useMakeCodeRenderBlocks.js");
10
+ Object.defineProperty(exports, "useMakeCodeRenderBlocks", { enumerable: true, get: function () { return __importDefault(useMakeCodeRenderBlocks_js_1).default; } });
11
+ var MakeCodeRenderBlocksProvider_js_1 = require("./react/MakeCodeRenderBlocksProvider.js");
12
+ Object.defineProperty(exports, "MakeCodeRenderBlocksProvider", { enumerable: true, get: function () { return MakeCodeRenderBlocksProvider_js_1.MakeCodeRenderBlocksProvider; } });
13
+ var MakeCodeBlocksRendering_js_1 = require("./react/MakeCodeBlocksRendering.js");
14
+ Object.defineProperty(exports, "MakeCodeBlocksRendering", { enumerable: true, get: function () { return __importDefault(MakeCodeBlocksRendering_js_1).default; } });
15
+ var examples_js_1 = require("./vanilla/examples.js");
16
+ Object.defineProperty(exports, "defaultMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.defaultMakeCodeProject; } });
17
+ Object.defineProperty(exports, "emptyMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.emptyMakeCodeProject; } });
18
+ var makecode_frame_driver_js_1 = require("./vanilla/makecode-frame-driver.js");
19
+ Object.defineProperty(exports, "MakeCodeFrameDriver", { enumerable: true, get: function () { return makecode_frame_driver_js_1.MakeCodeFrameDriver; } });
20
+ Object.defineProperty(exports, "createMakeCodeURL", { enumerable: true, get: function () { return makecode_frame_driver_js_1.createMakeCodeURL; } });
21
+ var pxt_js_1 = require("./vanilla/pxt.js");
22
+ Object.defineProperty(exports, "BlockLayout", { enumerable: true, get: function () { return pxt_js_1.BlockLayout; } });
23
+ var makecode_render_blocks_js_1 = require("./vanilla/makecode-render-blocks.js");
24
+ Object.defineProperty(exports, "createMakeCodeRenderBlocks", { enumerable: true, get: function () { return makecode_render_blocks_js_1.createMakeCodeRenderBlocks; } });
25
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;AAAA,6DAGkC;AAFhC,kIAAA,OAAO,OAAiB;AAI1B,iFAG4C;AAF1C,sJAAA,OAAO,OAA2B;AAIpC,2FAAuF;AAA9E,+IAAA,4BAA4B,OAAA;AACrC,iFAG4C;AAF1C,sJAAA,OAAO,OAA2B;AAIpC,qDAG+B;AAF7B,qHAAA,sBAAsB,OAAA;AACtB,mHAAA,oBAAoB,OAAA;AAGtB,+EAG4C;AAF1C,+HAAA,mBAAmB,OAAA;AACnB,6HAAA,iBAAiB,OAAA;AAGnB,2CAA+C;AAAtC,qGAAA,WAAW,OAAA;AAEpB,iFAAiF;AAAxE,uIAAA,0BAA0B,OAAA"}
@@ -0,0 +1 @@
1
+ {"type": "commonjs"}
@@ -0,0 +1,105 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ Object.defineProperty(exports, "__esModule", { value: true });
26
+ const jsx_runtime_1 = require("react/jsx-runtime");
27
+ /**
28
+ * A React component
29
+ * to render MakeCode block snippets
30
+ */
31
+ const react_1 = __importStar(require("react"));
32
+ const MakeCodeRenderBlocksProvider_js_1 = require("./MakeCodeRenderBlocksProvider.js");
33
+ const MakeCodeBlocksRendering = ({ loaderCmp, package: _package, packageId, snippetMode, layout, code, className, }) => {
34
+ const [state, setState] = (0, react_1.useState)({
35
+ rendering: true,
36
+ });
37
+ const { renderBlocks } = (0, MakeCodeRenderBlocksProvider_js_1.useMakeCodeRenderBlocksContext)();
38
+ (0, react_1.useEffect)(() => {
39
+ let ignoreReponse = false;
40
+ async function intializeRendering() {
41
+ try {
42
+ const r = await renderBlocks({
43
+ code: code || '',
44
+ options: {
45
+ packageId,
46
+ package: _package,
47
+ snippetMode,
48
+ layout,
49
+ },
50
+ });
51
+ if (!ignoreReponse) {
52
+ setState({
53
+ uri: r.uri,
54
+ width: r.width,
55
+ height: r.height,
56
+ rendering: false,
57
+ });
58
+ }
59
+ }
60
+ catch (e) {
61
+ if (!ignoreReponse) {
62
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
63
+ setState({ error: e.toString(), rendering: false });
64
+ }
65
+ }
66
+ }
67
+ if (typeof code === 'string' && !code.trim()) {
68
+ // If you render an empty string MakeCode responds with a smiley face, so we
69
+ // need to check first.
70
+ setState({
71
+ rendering: false,
72
+ height: 0,
73
+ width: 0,
74
+ });
75
+ }
76
+ else {
77
+ intializeRendering();
78
+ }
79
+ return () => {
80
+ ignoreReponse = true;
81
+ };
82
+ }, [code, packageId, _package, snippetMode, layout, renderBlocks]);
83
+ const { uri, width, height, error, rendering } = state;
84
+ let component;
85
+ if (width === 0 && height === 0) {
86
+ component = null;
87
+ }
88
+ else if (rendering) {
89
+ component = loaderCmp ? loaderCmp : (0, jsx_runtime_1.jsx)("div", { children: "Loading..." });
90
+ }
91
+ else if (error) {
92
+ component = (0, jsx_runtime_1.jsx)("div", { children: error });
93
+ }
94
+ else if (uri) {
95
+ component = ((0, jsx_runtime_1.jsx)("img", { className: "ui image", alt: code === undefined || typeof code === 'string'
96
+ ? code
97
+ : code.text['main.ts'], src: uri, width: width, height: height }));
98
+ }
99
+ else {
100
+ throw new Error('Unexpected state.');
101
+ }
102
+ return ((0, jsx_runtime_1.jsx)("div", { className: className, style: { overflow: 'auto' }, children: component }));
103
+ };
104
+ exports.default = react_1.default.memo(MakeCodeBlocksRendering);
105
+ //# sourceMappingURL=MakeCodeBlocksRendering.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MakeCodeBlocksRendering.js","sourceRoot":"","sources":["../../../src/react/MakeCodeBlocksRendering.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,74 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
4
+ const react_1 = require("react");
5
+ const react_2 = require("react");
6
+ const makecode_frame_driver_js_1 = require("../vanilla/makecode-frame-driver.js");
7
+ const styles = {
8
+ iframe: {
9
+ width: '100%',
10
+ flexGrow: 1,
11
+ border: 'none',
12
+ },
13
+ };
14
+ const MakeCodeFrame = (0, react_2.forwardRef)(function MakeCode(props, ref) {
15
+ const { baseUrl = 'https://makecode.microbit.org', version, lang, controller, queryParams, initialProjects, controllerId, filters, searchBar, onDownload, onSave, onBack, onBackLongPress, onEditorContentLoaded, onWorkspaceLoaded, onWorkspaceSync, onWorkspaceReset, onWorkspaceEvent, onWorkspaceSave, onTutorialEvent, ...rest } = props;
16
+ const options = (0, react_2.useMemo)(() => {
17
+ return {
18
+ initialProjects,
19
+ controllerId,
20
+ filters,
21
+ searchBar,
22
+ onDownload,
23
+ onSave,
24
+ onBack,
25
+ onBackLongPress,
26
+ onEditorContentLoaded,
27
+ onWorkspaceLoaded,
28
+ onWorkspaceSync,
29
+ onWorkspaceReset,
30
+ onWorkspaceEvent,
31
+ onWorkspaceSave,
32
+ onTutorialEvent,
33
+ };
34
+ }, [
35
+ controllerId,
36
+ filters,
37
+ initialProjects,
38
+ onBack,
39
+ onBackLongPress,
40
+ onDownload,
41
+ onEditorContentLoaded,
42
+ onSave,
43
+ onTutorialEvent,
44
+ onWorkspaceEvent,
45
+ onWorkspaceLoaded,
46
+ onWorkspaceReset,
47
+ onWorkspaceSave,
48
+ onWorkspaceSync,
49
+ searchBar,
50
+ ]);
51
+ // Reload MakeCode if the URL changes
52
+ const src = (0, makecode_frame_driver_js_1.createMakeCodeURL)(baseUrl, version, lang, controller, queryParams);
53
+ return ((0, react_1.createElement)(MakeCodeFrameInner, { ...rest, ref: ref, key: src, src: src, options: options }));
54
+ });
55
+ const MakeCodeFrameInner = (0, react_2.forwardRef)(function MakeCodeFrameInner(props, ref) {
56
+ const { options, style, ...rest } = props;
57
+ const iframeRef = (0, react_2.useRef)(null);
58
+ // We keep a fixed driver (which has state for messages) and update its options as needed.
59
+ const driverRef = (0, react_2.useRef)(new makecode_frame_driver_js_1.MakeCodeFrameDriver(options, () => iframeRef.current ?? undefined));
60
+ (0, react_2.useEffect)(() => {
61
+ const driver = driverRef.current;
62
+ driver.initialize();
63
+ return () => {
64
+ driver.dispose();
65
+ };
66
+ }, []);
67
+ (0, react_2.useEffect)(() => {
68
+ driverRef.current.setOptions(options);
69
+ }, [options]);
70
+ (0, react_2.useImperativeHandle)(ref, () => driverRef.current, []);
71
+ return ((0, jsx_runtime_1.jsx)("iframe", { ref: iframeRef, title: "MakeCode", style: { ...styles.iframe, ...style }, allow: "usb; autoplay; camera; microphone;", ...rest }));
72
+ });
73
+ exports.default = MakeCodeFrame;
74
+ //# sourceMappingURL=MakeCodeFrame.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MakeCodeFrame.js","sourceRoot":"","sources":["../../../src/react/MakeCodeFrame.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.useMakeCodeRenderBlocksContext = exports.MakeCodeRenderBlocksProvider = void 0;
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
+ const react_1 = require("react");
9
+ const useMakeCodeRenderBlocks_js_1 = __importDefault(require("./useMakeCodeRenderBlocks.js"));
10
+ const MakeCodeRenderBlocksContext = (0, react_1.createContext)({
11
+ renderBlocks: () => {
12
+ throw new Error('Configure MakeCodeRenderBlocksProvider.');
13
+ },
14
+ });
15
+ const MakeCodeRenderBlocksProvider = ({ disabled, version, lang, children, }) => {
16
+ const options = (0, react_1.useMemo)(() => {
17
+ return { disabled, version, lang };
18
+ }, [disabled, lang, version]);
19
+ const value = (0, useMakeCodeRenderBlocks_js_1.default)(options);
20
+ return ((0, jsx_runtime_1.jsx)(MakeCodeRenderBlocksContext.Provider, { value: value, children: children }));
21
+ };
22
+ exports.MakeCodeRenderBlocksProvider = MakeCodeRenderBlocksProvider;
23
+ const useMakeCodeRenderBlocksContext = () => (0, react_1.useContext)(MakeCodeRenderBlocksContext);
24
+ exports.useMakeCodeRenderBlocksContext = useMakeCodeRenderBlocksContext;
25
+ //# sourceMappingURL=MakeCodeRenderBlocksProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MakeCodeRenderBlocksProvider.js","sourceRoot":"","sources":["../../../src/react/MakeCodeRenderBlocksProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,iCAAsE;AACtE,8FAEsC;AAEtC,MAAM,2BAA2B,GAC/B,IAAA,qBAAa,EAAgC;IAC3C,YAAY,EAAE,GAAG,EAAE;QACjB,MAAM,IAAI,KAAK,CAAC,yCAAyC,CAAC,CAAC;IAC7D,CAAC;CACF,CAAC,CAAC;AAEE,MAAM,4BAA4B,GAAG,CAAC,EAC3C,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,QAAQ,GAeT,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC3B,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IAC9B,MAAM,KAAK,GAAG,IAAA,oCAAuB,EAAC,OAAO,CAAC,CAAC;IAC/C,OAAO,CACL,uBAAC,2BAA2B,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAC/C,QAAQ,GAC4B,CACxC,CAAC;AACJ,CAAC,CAAC;AA7BW,QAAA,4BAA4B,gCA6BvC;AAEK,MAAM,8BAA8B,GAAG,GAAG,EAAE,CACjD,IAAA,kBAAU,EAAC,2BAA2B,CAAC,CAAC;AAD7B,QAAA,8BAA8B,kCACD"}
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.BlockLayout = exports.createMakeCodeURL = exports.MakeCodeFrameDriver = exports.emptyMakeCodeProject = exports.defaultMakeCodeProject = exports.MakeCodeBlocksRendering = exports.MakeCodeRenderBlocksProvider = exports.useMakeCodeRenderBlocks = exports.MakeCodeFrame = void 0;
7
+ var MakeCodeFrame_js_1 = require("./MakeCodeFrame.js");
8
+ Object.defineProperty(exports, "MakeCodeFrame", { enumerable: true, get: function () { return __importDefault(MakeCodeFrame_js_1).default; } });
9
+ var useMakeCodeRenderBlocks_js_1 = require("./useMakeCodeRenderBlocks.js");
10
+ Object.defineProperty(exports, "useMakeCodeRenderBlocks", { enumerable: true, get: function () { return __importDefault(useMakeCodeRenderBlocks_js_1).default; } });
11
+ var MakeCodeRenderBlocksProvider_js_1 = require("./MakeCodeRenderBlocksProvider.js");
12
+ Object.defineProperty(exports, "MakeCodeRenderBlocksProvider", { enumerable: true, get: function () { return MakeCodeRenderBlocksProvider_js_1.MakeCodeRenderBlocksProvider; } });
13
+ var MakeCodeBlocksRendering_js_1 = require("./MakeCodeBlocksRendering.js");
14
+ Object.defineProperty(exports, "MakeCodeBlocksRendering", { enumerable: true, get: function () { return __importDefault(MakeCodeBlocksRendering_js_1).default; } });
15
+ var examples_js_1 = require("../vanilla/examples.js");
16
+ Object.defineProperty(exports, "defaultMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.defaultMakeCodeProject; } });
17
+ Object.defineProperty(exports, "emptyMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.emptyMakeCodeProject; } });
18
+ var makecode_frame_driver_js_1 = require("../vanilla/makecode-frame-driver.js");
19
+ Object.defineProperty(exports, "MakeCodeFrameDriver", { enumerable: true, get: function () { return makecode_frame_driver_js_1.MakeCodeFrameDriver; } });
20
+ Object.defineProperty(exports, "createMakeCodeURL", { enumerable: true, get: function () { return makecode_frame_driver_js_1.createMakeCodeURL; } });
21
+ var pxt_js_1 = require("../vanilla/pxt.js");
22
+ Object.defineProperty(exports, "BlockLayout", { enumerable: true, get: function () { return pxt_js_1.BlockLayout; } });
23
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react/index.ts"],"names":[],"mappings":";;;;;;AAAA,uDAG4B;AAF1B,kIAAA,OAAO,OAAiB;AAI1B,2EAGsC;AAFpC,sJAAA,OAAO,OAA2B;AAIpC,qFAAiF;AAAxE,+IAAA,4BAA4B,OAAA;AACrC,2EAGsC;AAFpC,sJAAA,OAAO,OAA2B;AAIpC,sDAGgC;AAF9B,qHAAA,sBAAsB,OAAA;AACtB,mHAAA,oBAAoB,OAAA;AAGtB,gFAG6C;AAF3C,+HAAA,mBAAmB,OAAA;AACnB,6HAAA,iBAAiB,OAAA;AAGnB,4CAAgD;AAAvC,qGAAA,WAAW,OAAA"}
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const react_1 = require("react");
4
+ const makecode_render_blocks_js_1 = require("../vanilla/makecode-render-blocks.js");
5
+ const useMakeCodeRenderBlocks = (options) => {
6
+ const { disabled, lang, version } = options;
7
+ const memoizedOptions = (0, react_1.useMemo)(() => {
8
+ return { disabled, lang, version };
9
+ }, [disabled, lang, version]);
10
+ const returnValue = (0, react_1.useMemo)(() => (0, makecode_render_blocks_js_1.createMakeCodeRenderBlocks)(memoizedOptions), [memoizedOptions]);
11
+ (0, react_1.useEffect)(() => {
12
+ returnValue.initialize();
13
+ return () => returnValue.dispose();
14
+ }, [returnValue]);
15
+ return returnValue;
16
+ };
17
+ exports.default = useMakeCodeRenderBlocks;
18
+ //# sourceMappingURL=useMakeCodeRenderBlocks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useMakeCodeRenderBlocks.js","sourceRoot":"","sources":["../../../src/react/useMakeCodeRenderBlocks.tsx"],"names":[],"mappings":";;AAAA,iCAA2C;AAC3C,oFAM8C;AAM9C,MAAM,uBAAuB,GAAG,CAC9B,OAAoC,EACL,EAAE;IACjC,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC;IAC5C,MAAM,eAAe,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACnC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IAC9B,MAAM,WAAW,GAAG,IAAA,eAAO,EACzB,GAAG,EAAE,CAAC,IAAA,sDAA0B,EAAC,eAAe,CAAC,EACjD,CAAC,eAAe,CAAC,CAClB,CAAC;IACF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,WAAW,CAAC,UAAU,EAAE,CAAC;QACzB,OAAO,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF,kBAAe,uBAAuB,CAAC"}
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.emptyMakeCodeProject = exports.defaultMakeCodeProject = void 0;
4
+ exports.defaultMakeCodeProject = {
5
+ text: {
6
+ 'main.blocks': '<xml xmlns="http://www.w3.org/1999/xhtml">\n <block type="pxt-on-start" id=",{,HjW]u:lVGcDRS_Cu|" x="-247" y="113"></block>\n</xml>',
7
+ 'main.ts': '',
8
+ 'README.md': ' ',
9
+ 'pxt.json': '{\n "name": "Untitled",\n "dependencies": {\n "core": "*"\n , "radio": "*"\n },\n "description": "",\n "files": [\n "main.blocks",\n "main.ts",\n "README.md"\n ]\n}',
10
+ },
11
+ };
12
+ exports.emptyMakeCodeProject = {
13
+ text: {
14
+ 'main.blocks': '<xml xmlns="http://www.w3.org/1999/xhtml">\n <variables></variables>\n</xml>',
15
+ 'main.ts': '\n',
16
+ 'README.md': ' ',
17
+ 'pxt.json': '{\n "name": "Untitled",\n "dependencies": {\n "core": "*"\n , "radio": "*"\n },\n "description": "",\n "files": [\n "main.blocks",\n "main.ts",\n "README.md"\n ]\n}',
18
+ },
19
+ };
20
+ //# sourceMappingURL=examples.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"examples.js","sourceRoot":"","sources":["../../../src/vanilla/examples.ts"],"names":[],"mappings":";;;AAEa,QAAA,sBAAsB,GAAoB;IACrD,IAAI,EAAE;QACJ,aAAa,EACX,sIAAsI;QACxI,SAAS,EAAE,EAAE;QACb,WAAW,EAAE,GAAG;QAChB,UAAU,EACR,mNAAmN;KACtN;CACF,CAAC;AAEW,QAAA,oBAAoB,GAAoB;IACnD,IAAI,EAAE;QACJ,aAAa,EACX,+EAA+E;QACjF,SAAS,EAAE,IAAI;QACf,WAAW,EAAE,GAAG;QAChB,UAAU,EACR,mNAAmN;KACtN;CACF,CAAC"}
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.createMakeCodeRenderBlocks = exports.BlockLayout = exports.createMakeCodeURL = exports.MakeCodeFrameDriver = exports.emptyMakeCodeProject = exports.defaultMakeCodeProject = void 0;
4
+ var examples_js_1 = require("../vanilla/examples.js");
5
+ Object.defineProperty(exports, "defaultMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.defaultMakeCodeProject; } });
6
+ Object.defineProperty(exports, "emptyMakeCodeProject", { enumerable: true, get: function () { return examples_js_1.emptyMakeCodeProject; } });
7
+ var makecode_frame_driver_js_1 = require("../vanilla/makecode-frame-driver.js");
8
+ Object.defineProperty(exports, "MakeCodeFrameDriver", { enumerable: true, get: function () { return makecode_frame_driver_js_1.MakeCodeFrameDriver; } });
9
+ Object.defineProperty(exports, "createMakeCodeURL", { enumerable: true, get: function () { return makecode_frame_driver_js_1.createMakeCodeURL; } });
10
+ var pxt_js_1 = require("../vanilla/pxt.js");
11
+ Object.defineProperty(exports, "BlockLayout", { enumerable: true, get: function () { return pxt_js_1.BlockLayout; } });
12
+ var makecode_render_blocks_js_1 = require("../vanilla/makecode-render-blocks.js");
13
+ Object.defineProperty(exports, "createMakeCodeRenderBlocks", { enumerable: true, get: function () { return makecode_render_blocks_js_1.createMakeCodeRenderBlocks; } });
14
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/vanilla/index.ts"],"names":[],"mappings":";;;AAAA,sDAGgC;AAF9B,qHAAA,sBAAsB,OAAA;AACtB,mHAAA,oBAAoB,OAAA;AAGtB,gFAK6C;AAJ3C,+HAAA,mBAAmB,OAAA;AACnB,6HAAA,iBAAiB,OAAA;AAKnB,4CAAgD;AAAvC,qGAAA,WAAW,OAAA;AAwDpB,kFAAkF;AAAzE,uIAAA,0BAA0B,OAAA"}