我正在将Monaco Editor集成到一个项目中，需要为特定用例自定义CSS语言支持。我的目标是将CSS语言模式调整为内联样式，类似于HTML的style属性中使用的内容。这意味着我需要配置语言模式以接受CSS属性和值，而不需要选择器或花括号。

**具体问题：**我正在寻找一种方法来修改摩纳哥编辑器中现有的CSS语言配置，以便它直接接受CSS属性和值（而不需要将它们括在花括号{}中），并保留其他功能，如语法突出显示和自动完成。
我尝试过的：

• 我研究了Monaco Editor的文档和示例，但大多数都集中在从头开始定义新语言或对现有语言进行简单修改。
• 我尝试使用monaco.languages.setMonarchTokensProvider来定义一个自定义的标记器，但是我正在努力修改现有的CSS标记器以有效地满足我的需求。

languages.register({ id: "inlineStyle" });

languages.onLanguage("inlineStyle", () => {
    languages.setLanguageConfiguration("inlineStyle", conf);
    languages.setMonarchTokensProvider("inlineStyle", {tokenizer: {
        root: [
            [/([a-zA-Z\-]+)\s*:/, "property"],
            [/([a-zA-Z\-]+)\s*$/, "property"],
            [/([a-zA-Z\-]+)\s*;\s*$/, "property"],
            [/([a-zA-Z0-9\s\.\#\-\(\)]+)(?=;|$)/, "value"],
        ]
    }});

    function fetchCssProperties() {
        // This is a simplified example. In a real application, you might fetch these properties from a server or a file.
        return [
            { name: "color", values: ["red", "green", "blue"] },
            { name: "background-color", values: ["yellow", "cyan", "magenta"] },
            { name: "width", values: ["100px", "50%", "auto"] },
            { name: "height", values: ["200px", "75%", "auto"] },
            // Add more properties as needed...
        ];
    }

    languages.registerCompletionItemProvider("inlineStyle", {
        provideCompletionItems: function(model, position) {
            // Fetch CSS properties and their values from a data source
            const cssProperties = fetchCssProperties();

            // Map CSS properties and their values to Monaco Editor completion items
            const completionItems = cssProperties.flatMap(property => {
                const propertyCompletionItem = {
                    label: property.name,
                    kind: languages.CompletionItemKind.Property,
                    insertText: property.name + ": ",
                    detail: "CSS Property",
                    documentation: "Inserts a CSS property"
                };

                const valueCompletionItems = property.values.map(value => {
                    return {
                        label: value,
                        kind: languages.CompletionItemKind.Value,
                        insertText: value,
                        detail: "CSS Value",
                        documentation: `Inserts the value "${value}" for the CSS property "${property.name}"`
                    };
                });

                return [propertyCompletionItem, ...valueCompletionItems];
            });

            return { suggestions: completionItems };
        }
    });

});

字符串
上面的代码可以工作（有点），但只依赖于我在fetchCssProperties中编写的属性。此外，整个CSS属性和值列表可能相当广泛，我不认为每次输入时都解析它是一个好主意。我很确定Monaco有一个更好的方法来处理他们的基本CSS语言。

我的问题： 有人能提供指导或例子，说明如何修改摩纳哥编辑器中现有的CSS语言配置，以支持直接输入CSS属性和值，而无需选择器和花括号吗？*

任何帮助或指向摩纳哥编辑器API或类似实现的相关部分的指针都将不胜感激。
谢谢你，谢谢