@thienvu18/designable-react-settings-form 2.0.0

package/lib/components/InputItems/index.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import './styles.less';
+export interface IInputItemsContext {
+    width?: string | number;
+    vertical?: boolean;
+}
+export interface IInputItemsProps {
+    className?: string;
+    style?: React.CSSProperties;
+    width?: string | number;
+    vertical?: boolean;
+}
+export interface IInputItemProps {
+    className?: string;
+    style?: React.CSSProperties;
+    icon?: React.ReactNode;
+    width?: string | number;
+    vertical?: boolean;
+    title?: React.ReactNode;
+}
+export declare const InputItems: React.FC<React.PropsWithChildren<IInputItemsProps>> & {
+    Item: React.FC<React.PropsWithChildren<IInputItemProps>>;
+};

package/lib/components/InputItems/index.js

@@ -0,0 +1,48 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputItems = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const designable_react_1 = require("@thienvu18/designable-react");
+const classnames_1 = __importDefault(require("classnames"));
+require("./styles.less");
+const InputItemsContext = react_1.default.createContext(null);
+const InputItems = (props) => {
+    const { width = '100%', className, style, children } = props;
+    const prefix = (0, designable_react_1.usePrefix)('input-items');
+    return ((0, jsx_runtime_1.jsx)(InputItemsContext.Provider, { value: { width, vertical: props.vertical }, children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(prefix, className), style: style, children: children }) }));
+};
+exports.InputItems = InputItems;
+exports.InputItems.Item = (props) => {
+    const prefix = (0, designable_react_1.usePrefix)('input-items-item');
+    const ctx = (0, react_1.useContext)(InputItemsContext);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(prefix, props.className, {
+            vertical: props.vertical || ctx?.vertical,
+        }), style: { width: props.width || ctx?.width, ...props.style }, children: [props.icon && ((0, jsx_runtime_1.jsx)("div", { className: prefix + '-icon', children: typeof props.icon === 'string' ? ((0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: props.icon, size: 16 })) : (props.icon) })), props.title && (0, jsx_runtime_1.jsx)("div", { className: prefix + '-title', children: props.title }), (0, jsx_runtime_1.jsx)("div", { className: prefix + '-controller', children: props.children })] }));
+};

package/lib/components/InputItems/styles.less

@@ -0,0 +1,45 @@
+@ant-prefix: ant;
+.dn-input-items {
+  display: flex;
+  flex-wrap: wrap;
+  margin-left: -8px;
+
+  &-item {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    color: var(--dn-color-text, rgba(0, 0, 0, 0.88));
+    &-icon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin: 0 8px;
+      flex-shrink: 0;
+      flex-grow: 0;
+      color: var(--dn-color-text, rgba(0, 0, 0, 0.88));
+    }
+
+    &-controller {
+      min-width: 0;
+      flex-shrink: 1;
+      flex-grow: 1;
+
+      .@{ant-prefix}-radio-group {
+        display: flex;
+
+        .@{ant-prefix}-radio-button-wrapper {
+          flex-grow: 1;
+          display: flex;
+          justify-content: center;
+        }
+      }
+    }
+    &.vertical {
+      flex-direction: column;
+      align-items: flex-start;
+      .dn-input-items-item-controller {
+        width: 100%;
+      }
+    }
+  }
+}

package/lib/components/MonacoInput/config.d.ts

@@ -0,0 +1 @@
+export declare const initMonaco: () => void;

package/lib/components/MonacoInput/config.js

@@ -0,0 +1,46 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initMonaco = void 0;
+const react_1 = require("@monaco-editor/react");
+const chrome_1 = __importDefault(require("./themes/chrome"));
+const monokai_1 = __importDefault(require("./themes/monokai"));
+const format_1 = require("./format");
+let initialized = false;
+const initMonaco = () => {
+    if (initialized)
+        return;
+    react_1.loader.init().then((monaco) => {
+        monaco.editor.defineTheme('monokai', monokai_1.default);
+        monaco.editor.defineTheme('chrome-devtools', chrome_1.default);
+        monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
+            target: monaco.languages.typescript.ScriptTarget.Latest,
+            allowNonTsExtensions: true,
+            moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
+            module: monaco.languages.typescript.ModuleKind.CommonJS,
+            noEmit: true,
+            esModuleInterop: true,
+            jsx: monaco.languages.typescript.JsxEmit.React,
+            reactNamespace: 'React',
+            allowJs: true,
+        });
+        monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
+            noSemanticValidation: false,
+            noSyntaxValidation: true,
+        });
+        monaco.languages.registerDocumentFormattingEditProvider('typescript', {
+            async provideDocumentFormattingEdits(model) {
+                return [
+                    {
+                        text: await (0, format_1.format)(model['getDesignerLanguage']?.() || 'typescript', model.getValue()),
+                        range: model.getFullModelRange(),
+                    },
+                ];
+            },
+        });
+        initialized = true;
+    });
+};
+exports.initMonaco = initMonaco;

package/lib/components/MonacoInput/format.d.ts

@@ -0,0 +1 @@
+export declare const format: (language: string, source: string) => Promise<string>;

package/lib/components/MonacoInput/format.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.format = void 0;
+const parser_1 = require("@babel/parser");
+const registry_1 = require("../../registry");
+const cache = {
+    prettier: null,
+};
+const format = async (language, source) => {
+    cache.prettier =
+        cache.prettier ||
+            new Function(`return import("${(0, registry_1.getNpmCDNRegistry)()}/prettier@2.x/esm/standalone.mjs")`)();
+    return cache.prettier.then((module) => {
+        if (language === 'javascript.expression' ||
+            language === 'typescript.expression') {
+            return source;
+        }
+        if (/(?:javascript|typescript)/gi.test(language)) {
+            return module.default.format(source, {
+                semi: false,
+                parser(text) {
+                    return (0, parser_1.parse)(text, {
+                        sourceType: 'module',
+                        plugins: ['typescript', 'jsx'],
+                    });
+                },
+            });
+        }
+        if (language === 'json') {
+            return JSON.stringify(JSON.parse(source), null, 2);
+        }
+        return source;
+    });
+};
+exports.format = format;

package/lib/components/MonacoInput/index.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { EditorProps, loader } from '@monaco-editor/react';
+import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
+import './styles.less';
+import './config';
+export type Monaco = typeof monaco;
+export interface MonacoInputProps extends EditorProps {
+    helpLink?: string | boolean;
+    helpCode?: string;
+    helpCodeViewWidth?: number | string;
+    extraLib?: string;
+    onChange?: (value: string) => void;
+}
+export declare const MonacoInput: React.FC<MonacoInputProps> & {
+    loader?: typeof loader;
+};

package/lib/components/MonacoInput/index.js

@@ -0,0 +1,246 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonacoInput = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_2 = __importStar(require("@monaco-editor/react"));
+const designable_react_1 = require("@thienvu18/designable-react");
+const antd_1 = require("antd");
+const parser_1 = require("@babel/parser");
+const designable_shared_1 = require("@thienvu18/designable-shared");
+const format_1 = require("./format");
+const classnames_1 = __importDefault(require("classnames"));
+require("./styles.less");
+require("./config");
+const config_1 = require("./config");
+const MonacoInput = ({ className, language, defaultLanguage, width, helpLink, helpCode, helpCodeViewWidth, height, onMount, onChange, ...props }) => {
+    const [loaded, setLoaded] = (0, react_1.useState)(false);
+    const theme = (0, designable_react_1.useTheme)();
+    const valueRef = (0, react_1.useRef)('');
+    const validateRef = (0, react_1.useRef)(null);
+    const submitRef = (0, react_1.useRef)(null);
+    const declarationRef = (0, react_1.useRef)([]);
+    const extraLibRef = (0, react_1.useRef)(null);
+    const monacoRef = (0, react_1.useRef)(null);
+    const editorRef = (0, react_1.useRef)(null);
+    const computedLanguage = (0, react_1.useRef)(language || defaultLanguage);
+    const realLanguage = (0, react_1.useRef)('');
+    const unmountedRef = (0, react_1.useRef)(false);
+    const changedRef = (0, react_1.useRef)(false);
+    const uidRef = (0, react_1.useRef)((0, designable_shared_1.uid)());
+    const prefix = (0, designable_react_1.usePrefix)('monaco-input');
+    const input = props.value || props.defaultValue;
+    (0, react_1.useEffect)(() => {
+        unmountedRef.current = false;
+        (0, config_1.initMonaco)();
+        return () => {
+            if (extraLibRef.current) {
+                extraLibRef.current.dispose();
+            }
+            unmountedRef.current = true;
+        };
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (monacoRef.current && props.extraLib) {
+            updateExtraLib();
+        }
+    }, [props.extraLib]);
+    const updateExtraLib = () => {
+        if (extraLibRef.current) {
+            extraLibRef.current.dispose();
+        }
+        extraLibRef.current =
+            monacoRef.current.languages.typescript.typescriptDefaults.addExtraLib(props.extraLib, `${uidRef.current}.d.ts`);
+    };
+    const isFileLanguage = () => {
+        const lang = computedLanguage.current;
+        return lang === 'javascript' || lang === 'typescript';
+    };
+    const isExpLanguage = () => {
+        const lang = computedLanguage.current;
+        return lang === 'javascript.expression' || lang === 'typescript.expression';
+    };
+    const renderHelper = () => {
+        const getHref = () => {
+            if (typeof helpLink === 'string')
+                return helpLink;
+            if (isFileLanguage()) {
+                return 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript';
+            }
+            if (isExpLanguage()) {
+                return 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators';
+            }
+        };
+        if (helpLink === false)
+            return null;
+        const href = getHref();
+        return (href && ((0, jsx_runtime_1.jsx)(antd_1.Tooltip, { title: (0, jsx_runtime_1.jsx)(designable_react_1.TextWidget, { token: "SettingComponents.MonacoInput.helpDocument" }), children: (0, jsx_runtime_1.jsx)("div", { className: prefix + '-helper', children: (0, jsx_runtime_1.jsx)("a", { target: "_blank", href: href, rel: "noreferrer", children: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "Help" }) }) }) })));
+    };
+    const onMountHandler = (editor, monaco) => {
+        editorRef.current = editor;
+        monacoRef.current = monaco;
+        onMount?.(editor, monaco);
+        const model = editor.getModel();
+        const currentValue = editor.getValue();
+        model['getDesignerLanguage'] = () => computedLanguage.current;
+        if (currentValue) {
+            (0, format_1.format)(computedLanguage.current, currentValue)
+                .then((content) => {
+                editor.setValue(content);
+                setLoaded(true);
+            })
+                .catch(() => {
+                setLoaded(true);
+            });
+        }
+        else {
+            setLoaded(true);
+        }
+        if (props.extraLib) {
+            updateExtraLib();
+        }
+        editor.onDidChangeModelContent(() => {
+            onChangeHandler(editor.getValue());
+        });
+    };
+    const submit = () => {
+        clearTimeout(submitRef.current);
+        submitRef.current = setTimeout(() => {
+            onChange?.(valueRef.current);
+        }, 1000);
+    };
+    const validate = () => {
+        if (realLanguage.current === 'typescript') {
+            clearTimeout(validateRef.current);
+            validateRef.current = setTimeout(() => {
+                try {
+                    if (valueRef.current) {
+                        if (isFileLanguage()) {
+                            (0, parser_1.parse)(valueRef.current, {
+                                sourceType: 'module',
+                                plugins: ['typescript', 'jsx'],
+                            });
+                        }
+                        else if (isExpLanguage()) {
+                            (0, parser_1.parseExpression)(valueRef.current, {
+                                plugins: ['typescript', 'jsx'],
+                            });
+                        }
+                    }
+                    monacoRef.current.editor.setModelMarkers(editorRef.current.getModel(), computedLanguage.current, []);
+                    declarationRef.current = editorRef.current.deltaDecorations(declarationRef.current, [
+                        {
+                            range: new monacoRef.current.Range(1, 1, 1, 1),
+                            options: {},
+                        },
+                    ]);
+                    submit();
+                }
+                catch (e) {
+                    declarationRef.current = editorRef.current.deltaDecorations(declarationRef.current, [
+                        {
+                            range: new monacoRef.current.Range(e.loc.line, e.loc.column, e.loc.line, e.loc.column),
+                            options: {
+                                isWholeLine: true,
+                                glyphMarginClassName: 'monaco-error-highline',
+                            },
+                        },
+                    ]);
+                    monacoRef.current.editor.setModelMarkers(editorRef.current.getModel(), computedLanguage.current, [
+                        {
+                            code: '1003',
+                            severity: 8,
+                            startLineNumber: e.loc.line,
+                            startColumn: e.loc.column,
+                            endLineNumber: e.loc.line,
+                            endColumn: e.loc.column,
+                            message: e.message,
+                        },
+                    ]);
+                }
+            }, 240);
+        }
+        else {
+            submit();
+            declarationRef.current = editorRef.current.deltaDecorations(declarationRef.current, [
+                {
+                    range: new monacoRef.current.Range(1, 1, 1, 1),
+                    options: {},
+                },
+            ]);
+        }
+    };
+    const onChangeHandler = (value) => {
+        changedRef.current = true;
+        valueRef.current = value;
+        validate();
+    };
+    computedLanguage.current = language || defaultLanguage;
+    realLanguage.current = /(?:javascript|typescript)/gi.test(computedLanguage.current)
+        ? 'typescript'
+        : computedLanguage.current;
+    const renderHelpCode = () => {
+        if (!helpCode)
+            return null;
+        return ((0, jsx_runtime_1.jsx)("div", { className: prefix + '-view', style: { width: helpCodeViewWidth || '50%' }, children: (0, jsx_runtime_1.jsx)(react_2.default, { value: helpCode, theme: theme === 'dark' ? 'monokai' : 'chrome-devtools', defaultLanguage: realLanguage.current, language: realLanguage.current, options: {
+                    ...props.options,
+                    lineNumbers: 'off',
+                    readOnly: true,
+                    glyphMargin: false,
+                    folding: false,
+                    lineDecorationsWidth: 0,
+                    lineNumbersMinChars: 0,
+                    minimap: {
+                        enabled: false,
+                    },
+                    tabSize: 2,
+                    smoothScrolling: true,
+                    scrollbar: {
+                        verticalScrollbarSize: 5,
+                        horizontalScrollbarSize: 5,
+                        alwaysConsumeMouseWheel: false,
+                    },
+                }, width: "100%", height: "100%" }) }));
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(prefix, className, {
+            loaded,
+        }), style: { width, height }, children: [renderHelper(), (0, jsx_runtime_1.jsx)("div", { className: prefix + '-view', children: (0, jsx_runtime_1.jsx)(react_2.default, { ...props, theme: theme === 'dark' ? 'monokai' : 'chrome-devtools', defaultLanguage: realLanguage.current, language: realLanguage.current, options: {
+                        glyphMargin: true,
+                        ...props.options,
+                        tabSize: 2,
+                        smoothScrolling: true,
+                        scrollbar: {
+                            verticalScrollbarSize: 5,
+                            horizontalScrollbarSize: 5,
+                            alwaysConsumeMouseWheel: false,
+                        },
+                    }, value: input, width: "100%", height: "100%", onMount: onMountHandler }) }), renderHelpCode()] }));
+};
+exports.MonacoInput = MonacoInput;
+exports.MonacoInput.loader = react_2.loader;

package/lib/components/MonacoInput/styles.less

@@ -0,0 +1,33 @@
+.dn-monaco-input {
+  position: relative;
+  transition: all 0.15s ease-in-out;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+  display: flex;
+
+  &.loaded {
+    opacity: 1;
+  }
+
+  &-view {
+    flex-grow: 2;
+    height: 100%;
+  }
+
+  &-helper {
+    position: absolute;
+    bottom: 10px;
+    right: 5%;
+    z-index: 2;
+  }
+
+  .monaco-error-highline {
+    left: 0px !important;
+    width: 5px !important;
+    height: 5px !important;
+    background: red !important;
+    border-radius: 100% !important;
+    transform: translate(35px, 5px) !important;
+  }
+}

package/lib/components/MonacoInput/themes/chrome.d.ts

@@ -0,0 +1,39 @@
+declare const _default: {
+    base: string;
+    inherit: boolean;
+    rules: ({
+        foreground: string;
+        token: string;
+        fontStyle?: undefined;
+        background?: undefined;
+    } | {
+        fontStyle: string;
+        token: string;
+        foreground?: undefined;
+        background?: undefined;
+    } | {
+        background: string;
+        token: string;
+        foreground?: undefined;
+        fontStyle?: undefined;
+    } | {
+        foreground: string;
+        background: string;
+        token: string;
+        fontStyle?: undefined;
+    } | {
+        foreground: string;
+        fontStyle: string;
+        token: string;
+        background?: undefined;
+    })[];
+    colors: {
+        'editor.foreground': string;
+        'editor.background': string;
+        'editor.selectionBackground': string;
+        'editor.lineHighlightBackground': string;
+        'editorCursor.foreground': string;
+        'editorWhitespace.foreground': string;
+    };
+};
+export default _default;

package/lib/components/MonacoInput/themes/chrome.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    base: 'vs',
+    inherit: true,
+    rules: [
+        {
+            foreground: 'c41a16',
+            token: 'string',
+        },
+        {
+            foreground: '1c00cf',
+            token: 'constant.numeric',
+        },
+        {
+            foreground: 'aa0d91',
+            token: 'keyword',
+        },
+        {
+            foreground: '000000',
+            token: 'keyword.operator',
+        },
+        {
+            foreground: 'aa0d91',
+            token: 'constant.language',
+        },
+        {
+            foreground: '990000',
+            token: 'support.class.exception',
+        },
+        {
+            foreground: '000000',
+            token: 'entity.name.function',
+        },
+        {
+            fontStyle: 'bold underline',
+            token: 'entity.name.type',
+        },
+        {
+            fontStyle: 'italic',
+            token: 'variable.parameter',
+        },
+        {
+            foreground: '007400',
+            token: 'comment',
+        },
+        {
+            foreground: 'ff0000',
+            token: 'invalid',
+        },
+        {
+            background: 'e71a1100',
+            token: 'invalid.deprecated.trailing-whitespace',
+        },
+        {
+            foreground: '000000',
+            background: 'fafafafc',
+            token: 'text source',
+        },
+        {
+            foreground: 'aa0d91',
+            token: 'meta.tag',
+        },
+        {
+            foreground: 'aa0d91',
+            token: 'declaration.tag',
+        },
+        {
+            foreground: '000000',
+            fontStyle: 'bold',
+            token: 'support',
+        },
+        {
+            foreground: 'aa0d91',
+            token: 'storage',
+        },
+        {
+            fontStyle: 'bold underline',
+            token: 'entity.name.section',
+        },
+        {
+            foreground: '000000',
+            fontStyle: 'bold',
+            token: 'entity.name.function.frame',
+        },
+        {
+            foreground: '333333',
+            token: 'meta.tag.preprocessor.xml',
+        },
+        {
+            foreground: '994500',
+            fontStyle: 'italic',
+            token: 'entity.other.attribute-name',
+        },
+        {
+            foreground: '881280',
+            token: 'entity.name.tag',
+        },
+    ],
+    colors: {
+        'editor.foreground': '#000000',
+        'editor.background': '#FFFFFF',
+        'editor.selectionBackground': '#BAD6FD',
+        'editor.lineHighlightBackground': '#EFEFFF',
+        'editorCursor.foreground': '#000000',
+        'editorWhitespace.foreground': '#B3B3B3F4',
+    },
+};

package/lib/components/MonacoInput/themes/monokai.d.ts

@@ -0,0 +1,31 @@
+declare const _default: {
+    base: string;
+    inherit: boolean;
+    rules: ({
+        foreground: string;
+        token: string;
+        fontStyle?: undefined;
+        background?: undefined;
+    } | {
+        foreground: string;
+        fontStyle: string;
+        token: string;
+        background?: undefined;
+    } | {
+        foreground: string;
+        background: string;
+        token: string;
+        fontStyle?: undefined;
+    })[];
+    colors: {
+        'editor.foreground': string;
+        'editor.background': string;
+        'editor.selectionBackground': string;
+        'editor.lineHighlightBackground': string;
+        'editorCursor.foreground': string;
+        'editorWhitespace.foreground': string;
+        'editorIndentGuide.activeBackground': string;
+        'editor.selectionHighlightBorder': string;
+    };
+};
+export default _default;