Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSON tree structure and autocomplete not working properly #128

Open
andreyqin opened this issue Jun 10, 2024 · 0 comments
Open

JSON tree structure and autocomplete not working properly #128

andreyqin opened this issue Jun 10, 2024 · 0 comments

Comments

@andreyqin
Copy link

andreyqin commented Jun 10, 2024

Hi there! First of all, thanks for this library, it really helps me building a JSON editor with a custom json format and conveniently validate it. Unfortunately, I ran into an issue where JSON Schema's tree structure fails on getting autocomplete when I define it as a tree. For instance, I have a json structure like below:

const shema = {
    type: 'object',
    properties: {
        children: {
            type: 'array',
            items: { $ref: '#' },
        },
    },
};

But I only get children to be autocompleted for the first and second level of nesting. The third level stops working for me (no autocomplete):
Screenshot 2024-06-10 at 14 09 48

Maybe the issue is somehow related to work with arrays in general. The schema below also fails on getting autocomplete for "props" field:

const schema = {
    type: 'object',
    properties: {
        props: {
            type: 'array',
            items: {
                type: 'string',
                enum: ['a', 'b', 'c'],
            },
        },
        children: {
            type: 'array',
            items: { $ref: '#' },
        },
    },
};

Result (no autocomplete):
Screenshot 2024-06-10 at 14 35 51

Here is my React component:

<CodeMirror
            extensions={[
            json(),
            linter(jsonParseLinter()),
            linter(jsonSchemaLinter(), {
                needsRefresh: handleRefresh,
            }),
            jsonLanguage.data.of({
                autocomplete: jsonCompletion(),
            }),
            hoverTooltip(
                jsonSchemaHover({
                    getHoverTexts: getHoverText,
                    formatHover: createHoverTooltip,
                }),
                { hoverTime: 0 },
            ),
            stateExtensions(schema),
]}
            value={value}
            theme='dark'
            height='100%'
            className={cn(styles.root, className)}
            onChange={handleChange}
        />

I'm using: node v18.7.0, "codemirror-json-schema": "^0.7.8", "@codemirror/lang-json": "^6.0.1", "@uiw/react-codemirror": "^4.22.1".

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant