Initial commit of 001code-html Scratch frontend project.

Includes scratch-gui, scratch-vm, scratch-blocks, scratch-render, scratch-l10n, and deployment config.

Co-authored-by: Cursor <cursoragent@cursor.com>

scratch-gui/test/unit/components/monitor.test.jsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import {shallow} from 'enzyme';
+import DefaultMonitor from '../../../src/components/monitor/default-monitor';
+import Monitor from '../../../src/components/monitor/monitor';
+import {DARK_THEME, DEFAULT_THEME} from '../../../src/lib/themes';
+
+jest.mock('../../../src/lib/themes/default');
+jest.mock('../../../src/lib/themes/dark');
+
+describe('Monitor Component', () => {
+    test('it selects the correct colors based on default theme', () => {
+        const noop = () => {};
+
+        const wrapper = shallow(<Monitor
+            category="motion"
+            // eslint-disable-next-line react/jsx-no-bind
+            componentRef={noop}
+            draggable={false}
+            label="My label"
+            mode="default"
+            // eslint-disable-next-line react/jsx-no-bind
+            onDragEnd={noop}
+            // eslint-disable-next-line react/jsx-no-bind
+            onNextMode={noop}
+            theme={DEFAULT_THEME}
+        />);
+
+        const defaultMonitor = wrapper.find(DefaultMonitor);
+
+        // selects colors from mock value in src/lib/themes/__mocks__/default-colors.js
+        expect(defaultMonitor.props().categoryColor).toEqual({background: '#111111', text: '#444444'});
+    });
+
+    test('it selects the correct colors based on dark mode theme', () => {
+        const noop = () => {};
+
+        const wrapper = shallow(<Monitor
+            category="motion"
+            // eslint-disable-next-line react/jsx-no-bind
+            componentRef={noop}
+            draggable={false}
+            label="My label"
+            mode="default"
+            // eslint-disable-next-line react/jsx-no-bind
+            onDragEnd={noop}
+            // eslint-disable-next-line react/jsx-no-bind
+            onNextMode={noop}
+            theme={DARK_THEME}
+        />);
+
+        const defaultMonitor = wrapper.find(DefaultMonitor);
+
+        // selects colors from mock value in src/lib/themes/__mocks__/dark-mode.js
+        expect(defaultMonitor.props().categoryColor).toEqual({background: '#AAAAAA', text: '#BBBBBB'});
+    });
+});