@aquera/nile-elements 1.3.3-beta-1.3 → 1.3.3-beta-1.5

package/dist/src/nile-code-editor/nile-code-editor.js

@@ -0,0 +1,735 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, } from 'lit';
+import { customElement, query, property } from 'lit/decorators.js';
+import { styles } from './nile-code-editor.css';
+import { EditorView } from 'codemirror';
+import { placeholder, tooltips } from '@codemirror/view';
+import { Compartment, EditorState } from '@codemirror/state';
+import { syntaxHighlighting, defaultHighlightStyle, } from '@codemirror/language';
+import { lineNumbers } from '@codemirror/view';
+import { javascript, javascriptLanguage, } from '@codemirror/lang-javascript';
+import { sql } from '@codemirror/lang-sql';
+import { json } from '@codemirror/lang-json';
+import { html as htmlLang } from '@codemirror/lang-html';
+import { autocompletion, acceptCompletion, closeCompletion, completionStatus } from '@codemirror/autocomplete';
+import NileElement from '../internal/nile-element';
+import { basicSetup } from './extensionSetup';
+import { classMap } from 'lit/directives/class-map.js';
+import { customisedThemeCss, fontFamily } from './theme';
+import { keymap } from '@codemirror/view';
+// Choose the appropriate mode for your use case
+/**
+ * Nile icon component.
+ *
+ * @tag nile-code-editor
+ *
+ */
+let NileCodeEditor = class NileCodeEditor extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.value = '';
+        this.expandIcon = "var(--nile-icon-expand-2, var(--ng-icon-expand-06))";
+        this.placeholder = "";
+        this.customAutoCompletions = {};
+        this.customCompletionsPaths = [];
+        this.language = 'javascript';
+        this.errorMessage = '';
+        this.error = false;
+        this.enableSearch = false;
+        this.noborder = false;
+        this.multiline = false;
+        this.enableFoldGutters = false;
+        this.allowVariableInCustomSuggestion = false;
+        this.lineNumbers = false;
+        this.disableSyntaxHighlighting = false;
+        this.customThemeCSS = customisedThemeCss;
+        this.lineNumbersMultiline = true;
+        this.hasScroller = true;
+        this.expandable = true;
+        this.readonly = false;
+        this.debounce = false;
+        this.debounceTimeout = 200;
+        this.aboveCursor = false;
+        this.tabCompletion = true;
+        this.defaultFont = false;
+        this.autoCompleteStyle = undefined;
+        this.timeOut = null;
+        // Compartments for initialiazing and switching extensions
+        this.lineNumbersComp = new Compartment();
+        this.restrictSingleLineComp = new Compartment();
+        this.readOnlyComp = new Compartment();
+        this.customCompletionComp = new Compartment();
+        this.placeholderComp = new Compartment();
+        this.defaultSyntaxHighlightingComp = new Compartment();
+        this.themeComp = new Compartment();
+        this.autoCompletionComp = new Compartment();
+        this.autoCompleteStyleComp = new Compartment();
+        this.isSpacePressed = false;
+        /**
+         * Custom autocomplete handler for code editor suggestions
+         * @param context CompletionContext from CodeMirror
+         * @returns CompletionResult with suggestions or null if no suggestions
+         */
+        this.customAutocomplete = (context) => {
+            // Getting the valid last line, last text from the code editor
+            const text = context.state.doc.sliceString(0, context.pos);
+            const lastWord = text.split('\n').at(-1)?.split(' ').at(-1) || '';
+            const [textBeforeCursor, baseTextAfterSeperation] = splitStringAtLastSeparator(lastWord);
+            return this.getNestedSuggestions(context, textBeforeCursor, baseTextAfterSeperation)
+                || this.getTopLevelSuggestions(context, textBeforeCursor);
+        };
+        this.insertBetweenCode = (text) => {
+            const transaction = this.view.state.changeByRange(range => {
+                const { from, to } = range;
+                return { changes: { from: from, to, insert: text }, range };
+            });
+            this.view.dispatch(transaction);
+        };
+        /* #endregion */
+    }
+    /**
+     * The styles for CodeEditor
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.emit('nile-init', undefined, false);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.resizeObserver?.disconnect();
+        this.view.destroy();
+        this.emit('nile-destroy', undefined, false);
+    }
+    firstUpdated() {
+        this.createNewView();
+        if (this.autoCompleteStyle?.width) {
+            this.resizeObserver = new ResizeObserver(entries => {
+                for (const entry of entries) {
+                    const width = entry.contentRect.width;
+                    this.updateAutocompleteWidth(width);
+                }
+            });
+            this.resizeObserver.observe(this.codeEditor);
+        }
+        this.emit('nile-after-init', {
+            codeMirrorInstance: this.view,
+            createNewView: this.createNewView,
+            insertAtCursor: this.insertBetweenCode
+        }, false);
+    }
+    getTabCompletionKeymap() {
+        return this.tabCompletion
+            ? keymap.of([
+                {
+                    key: 'Tab',
+                    run: acceptCompletion,
+                }
+            ])
+            : [];
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('value') && this.view.state.doc.toString() != this.value) {
+            // Editor has already been initialized, update its state
+            this.singleLineMultiLineToggle();
+        }
+        if (changedProperties.has('multiline')) {
+            this.view.dispatch({
+                effects: [
+                    this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),
+                    this.restrictSingleLineComp.reconfigure(this.getSingleLineExtension())
+                ],
+            });
+            this.singleLineMultiLineToggle();
+        }
+        if (changedProperties.has('readonly')) {
+            this.view.dispatch({
+                effects: [
+                    this.readOnlyComp.reconfigure(this.getReadOnlyExtension()),
+                ]
+            });
+        }
+        if (changedProperties.has('aboveCursor')) {
+            this.view.dispatch({
+                effects: [
+                    this.autoCompletionComp.reconfigure(autocompletion({ aboveCursor: this.aboveCursor }))
+                ]
+            });
+        }
+        if (changedProperties.has('placeholder')) {
+            this.view.dispatch({
+                effects: [
+                    this.placeholderComp.reconfigure(this.getPlaceholderExtension()),
+                ]
+            });
+        }
+        if (changedProperties.has('lineNumbers') || changedProperties.has('lineNumbersMultiline')) {
+            this.view.dispatch({
+                effects: [
+                    this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),
+                ]
+            });
+        }
+        if (changedProperties.has('customAutoCompletions') || changedProperties.has('customCompletionsPaths')) {
+            this.view.dispatch({
+                effects: [
+                    this.customCompletionComp.reconfigure(javascriptLanguage.data.of({
+                        autocomplete: this.customAutocomplete
+                    }))
+                ]
+            });
+        }
+        if (changedProperties.has('disableSyntaxHighlighting')) {
+            this.view.dispatch({
+                effects: [
+                    this.defaultSyntaxHighlightingComp.reconfigure(this.getDefaultSyntaxHighlightingExtension())
+                ]
+            });
+        }
+        if (changedProperties.has('customThemeCSS')) {
+            this.view.dispatch({
+                effects: [
+                    this.themeComp.reconfigure(this.getCustomThemeExtension())
+                ]
+            });
+        }
+        if (changedProperties.has('autoCompleteStyle') && this.view) {
+            if (this.autoCompleteStyle?.width) {
+                if (!this.resizeObserver) {
+                    this.resizeObserver = new ResizeObserver(entries => {
+                        for (const entry of entries) {
+                            const width = entry.contentRect.width;
+                            this.updateAutocompleteWidth(width);
+                        }
+                    });
+                    this.resizeObserver.observe(this.codeEditor);
+                }
+            }
+            else {
+                this.resizeObserver?.disconnect();
+                this.resizeObserver = undefined;
+            }
+            this.view.dispatch({
+                effects: [
+                    this.autoCompleteStyleComp.reconfigure(this.getAutoCompleteStyleExtension())
+                ]
+            });
+        }
+    }
+    render() {
+        const hasErrorMessage = !!this.errorMessage;
+        const hasError = !!this.error;
+        const noborder = !!this.noborder;
+        const noScrollbar = !this.hasScroller;
+        return html `<div
+        part="code-editor-base"
+        class=${classMap({
+            'code__editor__container': true,
+            'noborder': noborder,
+            'error': hasError || hasErrorMessage,
+            'code__editor__singleline': !this.multiline,
+            'no-scroller': noScrollbar
+        })}
+      >
+      ${this.expandable
+            ? html ` 
+        <div @click="${(e) => this.emit('nile-expand')}" class="expand__icon__container">
+          <nile-icon
+            name="${this.expandIcon}"
+            method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))"
+            size="16"
+            color="black"
+          ></nile-icon>
+        </div>`
+            : ''}
+      </div>
+      ${hasErrorMessage
+            ? html `
+            <nile-form-error-message
+              >${this.errorMessage}</nile-form-error-message
+            >
+          `
+            : ``}`;
+    }
+    createNewView(emitEvent = true) {
+        if (this.view)
+            this.view.destroy();
+        this.createState();
+        this.view = new EditorView({
+            state: this.viewState,
+            parent: this.codeEditor
+        });
+        this.view.dom.addEventListener('keydown', (e) => {
+            this.checkForSpaceKey(e);
+            this.handleEscapeKey(e);
+        }, true);
+        if (emitEvent)
+            this.emit('nile-after-update', { createNewView: this.createNewView, codeMirrorInstance: this.view, }, false);
+    }
+    checkForSpaceKey(e) {
+        if (e.code === 'Space' && !e.ctrlKey) {
+            this.isSpacePressed = true;
+        }
+        else {
+            this.isSpacePressed = false;
+        }
+    }
+    closeCompletion() {
+        if (this.view) {
+            closeCompletion(this.view);
+        }
+    }
+    handleEscapeKey(e) {
+        if (e.key === 'Escape' && this.view && completionStatus(this.view.state) !== null) {
+            e.stopPropagation();
+            e.preventDefault();
+            closeCompletion(this.view);
+        }
+    }
+    createState() {
+        const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());
+        const readOnlyExtension = this.readOnlyComp.of(this.getReadOnlyExtension());
+        const restrictSingleLineExtension = this.restrictSingleLineComp.of(this.getSingleLineExtension());
+        const placeholderExtension = this.placeholderComp.of(this.getPlaceholderExtension());
+        const customThemeExtension = this.themeComp.of(this.getCustomThemeExtension());
+        const defaultSyntaxHighlightingExtension = this.defaultSyntaxHighlightingComp.of(this.getDefaultSyntaxHighlightingExtension());
+        const autoCompleteStyleExtension = this.autoCompleteStyleComp.of(this.getAutoCompleteStyleExtension());
+        const language = this.getLanguageExtension();
+        const customAutoCompletions = this.customCompletionComp.of(javascriptLanguage.data.of({
+            autocomplete: this.customAutocomplete
+        }));
+        this.viewState = EditorState.create({
+            doc: !this.multiline ? convertToSingleLine(this.value) : this.value,
+            extensions: [
+                basicSetup({
+                    highlightActiveLine: false,
+                    foldGutter: this.enableFoldGutters,
+                    enableSearch: this.enableSearch
+                }),
+                lineNumbersExtension,
+                readOnlyExtension,
+                restrictSingleLineExtension,
+                customAutoCompletions,
+                placeholderExtension,
+                defaultSyntaxHighlightingExtension,
+                this.autoCompletionComp.of(autocompletion({ aboveCursor: this.aboveCursor })),
+                language,
+                customThemeExtension,
+                autoCompleteStyleExtension,
+                this.getTabCompletionKeymap(),
+                EditorView.updateListener.of((v) => {
+                    if (v.docChanged) {
+                        this.debounce ? this.emitAfterTimeout({ value: this.view.state.doc.toString() }) : this.emit('nile-change', { value: this.view.state.doc.toString() });
+                    }
+                }),
+                EditorView.domEventHandlers({
+                    focus: () => this.dispatchEvent(new Event('nile-focus')),
+                    blur: () => this.dispatchEvent(new Event('nile-blur')),
+                }),
+            ],
+        });
+        return this.viewState;
+    }
+    /**
+     * Gets nested property suggestions based on the current path
+     * @param context CompletionContext from CodeMirror
+     * @param textBeforeCursor Text before cursor position
+     * @param baseTextAfterSeperation Text after the last separator (. or [)
+     * @returns CompletionResult with nested suggestions or null
+     */
+    getNestedSuggestions(context, textBeforeCursor, baseTextAfterSeperation) {
+        // Return early if not a valid path or not ending with . or [
+        if (!isValidPath(textBeforeCursor) || !['.', '['].includes(textBeforeCursor.at(-1))) {
+            return null;
+        }
+        const path = parsePath(textBeforeCursor);
+        if (!path)
+            return null;
+        const textAfterSeperation = baseTextAfterSeperation.replace(/["'\[]/g, '');
+        const isInString = textAfterSeperation !== baseTextAfterSeperation;
+        const isBracket = textBeforeCursor.at(-1) === '[';
+        // Return null if we're in a string after a dot
+        if (textBeforeCursor.at(-1) === '.' && isInString)
+            return null;
+        // Get nested properties and filter by text after separation if it exists
+        let resolved = resolveNestedProperties(this.customAutoCompletions, path);
+        if (!resolved || typeof resolved !== 'object')
+            return null;
+        if (textAfterSeperation) {
+            resolved = Object.fromEntries(Object.entries(resolved).filter(([key]) => key.toLowerCase().startsWith(textAfterSeperation.toLowerCase())));
+        }
+        return {
+            from: context.pos - textAfterSeperation.length,
+            options: Object.keys(resolved).map(key => ({
+                label: key,
+                type: 'property',
+                info: `Key of ${path[path.length - 1]}`,
+                apply: !this.allowVariableInCustomSuggestion && (isBracket && !isInString)
+                    ? `'${key}'`
+                    : key,
+                boost: 999
+            }))
+        };
+    }
+    /**
+     * Gets top level suggestions based on custom completions and paths
+     * @param context CompletionContext from CodeMirror
+     * @param textBeforeCursor Text before cursor position
+     * @returns CompletionResult with top level suggestions or null
+     */
+    getTopLevelSuggestions(context, textBeforeCursor) {
+        const baseMatch = textBeforeCursor.match(/([a-zA-Z_$][\w$]*)$/);
+        if (!baseMatch) {
+            const trimmedText = textBeforeCursor.trim();
+            if (trimmedText === '' && !this.isSpacePressed) {
+                const optionsList = Object.keys(this.customAutoCompletions).filter(key => Object.keys(this.customAutoCompletions[key]).length);
+                const options = optionsList.map((key) => ({
+                    label: key,
+                    type: 'property',
+                    apply: key,
+                    boost: 999
+                }));
+                if (this.customCompletionsPaths.length) {
+                    this.customCompletionsPaths.forEach(path => {
+                        options.push({
+                            label: '' + path,
+                            type: 'property',
+                            apply: '' + path,
+                            boost: 998
+                        });
+                    });
+                }
+                return {
+                    from: context.pos,
+                    options: options
+                };
+            }
+            return null;
+        }
+        const optionsList = Object.keys(this.customAutoCompletions).filter(key => Object.keys(this.customAutoCompletions[key]).length &&
+            key.toLowerCase().startsWith(textBeforeCursor.toLowerCase()));
+        const options = optionsList.map((key) => ({
+            label: key,
+            type: 'property',
+            apply: key,
+            boost: 999
+        }));
+        if (this.customCompletionsPaths.length) {
+            this.customCompletionsPaths
+                .filter(path => path.toLocaleLowerCase().includes(textBeforeCursor.toLocaleLowerCase()))
+                .forEach(path => {
+                options.push({
+                    label: '' + path,
+                    type: 'property',
+                    apply: '' + path,
+                    boost: 998
+                });
+            });
+        }
+        return {
+            from: context.pos - baseMatch[1].length,
+            options: options
+        };
+    }
+    emitAfterTimeout(value) {
+        if (this.timeOut)
+            clearTimeout(this.timeOut);
+        this.timeOut = setTimeout(() => this.emit('nile-change', value, false), this.debounceTimeout);
+    }
+    focusAtPosition(pos = this.view.state.doc.toString().length) {
+        if (this.view) {
+            this.view.dispatch({
+                selection: { anchor: pos },
+            });
+            this.view.focus();
+        }
+    }
+    singleLineMultiLineToggle() {
+        this.view.dispatch({
+            changes: {
+                from: 0,
+                to: this.view.state.doc.length,
+                insert: !this.multiline
+                    ? convertToSingleLine(this.value)
+                    : this.value,
+            },
+        });
+    }
+    //EXTENSION CONFIGURATIONS
+    getLineNumbersExension() {
+        return (!this.multiline && this.lineNumbers) || (this.multiline && this.lineNumbersMultiline) ? lineNumbers() : [];
+    }
+    getLanguageExtension() {
+        switch (this.language) {
+            case 'sql':
+                return sql();
+            case 'json':
+                return json();
+            case 'html':
+                return htmlLang();
+            default:
+                return javascript();
+        }
+    }
+    getReadOnlyExtension() {
+        return this.readonly ? EditorState.readOnly.of(true) : [];
+    }
+    getSingleLineExtension() {
+        return !this.multiline ? EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr) : [];
+    }
+    getPlaceholderExtension() {
+        return this.placeholder ? placeholder(this.placeholder) : [];
+    }
+    getDefaultSyntaxHighlightingExtension() {
+        return !this.disableSyntaxHighlighting ? syntaxHighlighting(defaultHighlightStyle, { fallback: true }) : [];
+    }
+    getCustomThemeExtension() {
+        if (this.customThemeCSS) {
+            if (this.defaultFont) {
+                return [EditorView.theme(this.customThemeCSS), EditorView.theme(customisedThemeCss), EditorView.theme(fontFamily)];
+            }
+            return [EditorView.theme(this.customThemeCSS), EditorView.theme(customisedThemeCss)];
+        }
+        if (this.defaultFont) {
+            return [EditorView.theme(customisedThemeCss), EditorView.theme(fontFamily)];
+        }
+        return [EditorView.theme(customisedThemeCss)];
+    }
+    getAutoCompleteStyleExtension(width) {
+        if (this.autoCompleteStyle?.width) {
+            const containerWidth = width || (this.codeEditor ? this.codeEditor.getBoundingClientRect().width : 300);
+            const widthPercentage = parseFloat(this.autoCompleteStyle.width.replace('%', ''));
+            const codeEditorWidth = (containerWidth * widthPercentage) / 100;
+            const multilineStyles = this.autoCompleteStyle.multiline ? {
+                overflow: "visible",
+                textOverflow: "unset",
+                whiteSpace: "normal",
+                wordWrap: "break-word"
+            } : {
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap"
+            };
+            return [
+                tooltips({
+                    position: "fixed",
+                    tooltipSpace: () => {
+                        const rect = this.codeEditor.getBoundingClientRect();
+                        return {
+                            left: rect.left,
+                            top: 0,
+                            right: rect.right,
+                            bottom: 1000
+                        };
+                    }
+                }),
+                EditorView.theme({
+                    ".cm-tooltip.cm-tooltip-autocomplete": {
+                        maxWidth: (codeEditorWidth - 15) + "px !important"
+                    },
+                    ".cm-tooltip.cm-tooltip-autocomplete > ul > li": {
+                        ...multilineStyles,
+                        maxWidth: "100%"
+                    },
+                    ".cm-tooltip.cm-tooltip-autocomplete > ul": {
+                        minWidth: "unset !important"
+                    }
+                })
+            ];
+        }
+        return [];
+    }
+    updateAutocompleteWidth(width) {
+        if (this.view) {
+            this.view.dispatch({
+                effects: this.autoCompleteStyleComp.reconfigure(this.getAutoCompleteStyleExtension(width))
+            });
+        }
+    }
+    restrictSingleLine() {
+        return EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr);
+    }
+};
+__decorate([
+    query('.code__editor__container')
+], NileCodeEditor.prototype, "codeEditor", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "value", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "expandIcon", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "placeholder", void 0);
+__decorate([
+    property({ type: Object, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "customAutoCompletions", void 0);
+__decorate([
+    property({ type: Array, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "customCompletionsPaths", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "language", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'error-message' })
+], NileCodeEditor.prototype, "errorMessage", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "error", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "enableSearch", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "noborder", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "multiline", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "enableFoldGutters", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "allowVariableInCustomSuggestion", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "lineNumbers", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: false })
+], NileCodeEditor.prototype, "disableSyntaxHighlighting", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], NileCodeEditor.prototype, "customThemeCSS", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "lineNumbersMultiline", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "hasScroller", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "expandable", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "readonly", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "debounce", void 0);
+__decorate([
+    property({ type: Number, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "debounceTimeout", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "aboveCursor", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "tabCompletion", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileCodeEditor.prototype, "defaultFont", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], NileCodeEditor.prototype, "autoCompleteStyle", void 0);
+NileCodeEditor = __decorate([
+    customElement('nile-code-editor')
+], NileCodeEditor);
+export { NileCodeEditor };
+export default NileCodeEditor;
+/**
+ * Parses a string path into an array of keys representing nested object access
+ * @param text The path string to parse (e.g. "foo.bar[0].baz")
+ * @returns Array of keys if valid path, null otherwise
+ * @example
+ * parsePath("foo.bar[0]") // returns ["foo", "bar", "0"]
+ * parsePath("invalid") // returns null
+ */
+function parsePath(text) {
+    const regex = /([a-zA-Z_$][\w$]*)(\[(?:[^\]]+)\]|\.[a-zA-Z_$][\w$]*)*/g;
+    const matches = [...text.matchAll(regex)];
+    if (matches.length > 0) {
+        const base = matches[0][1]; // The base object name
+        const keys = [base];
+        // Extract keys from dot or bracket notation
+        const pathMatches = text.match(/\[(.*?)\]|\.(\w+)/g) || [];
+        for (const match of pathMatches) {
+            if (match.startsWith('[')) {
+                keys.push(match.slice(1, -1).replace(/['"]/g, '')); // Remove brackets and quotes
+            }
+            else if (match.startsWith('.')) {
+                keys.push(match.slice(1));
+            }
+        }
+        return keys;
+    }
+    return null;
+}
+;
+/**
+ * Splits a path string at the last separator (. or [)
+ * @param input The path string to split
+ * @returns Array containing [path up to last separator, remainder after separator]
+ * @example
+ * splitStringAtLastSeparator("foo.bar[0]") // returns ["foo.bar[", "0"]
+ */
+function splitStringAtLastSeparator(input) {
+    const lastSeparatorIndex = Math.max(input.lastIndexOf('.'), input.lastIndexOf('['));
+    if (lastSeparatorIndex === -1)
+        return [input, ''];
+    return [input.slice(0, lastSeparatorIndex + 1), input.slice(lastSeparatorIndex + 1)];
+}
+/**
+ * Traverses an object using an array of keys to access nested properties
+ * @param obj The object to traverse
+ * @param keys Array of keys defining the path to the desired property
+ * @returns The value at the specified path, or null if path is invalid
+ * @example
+ * resolveNestedProperties({foo: {bar: 123}}, ["foo", "bar"]) // returns 123
+ */
+function resolveNestedProperties(obj, keys) {
+    return keys.reduce((acc, key) => {
+        if (acc && typeof acc === 'object') {
+            return acc[key];
+        }
+        return null;
+    }, obj);
+}
+;
+/**
+ * Validates if a string represents a valid object path format
+ * @param path The path string to validate
+ * @returns Boolean indicating if path format is valid
+ * @example
+ * isValidPath("foo.bar[0]") // returns true
+ * isValidPath("foo..bar") // returns false
+ */
+function isValidPath(path) {
+    // Regex to validate the format of the string
+    const regex = /^([a-zA-Z_$][\w$]*)(\.[a-zA-Z_$][\w$]*|\[\s*(['"]?[a-zA-Z0-9_$]*['"]?)\s*\])*([\.\[])?$/;
+    // Test the string against the regex
+    return regex.test(path);
+}
+/**
+ * Converts multi-line code into a single line by removing line breaks and extra whitespace
+ * @param code The code string to convert
+ * @returns Single line version of the code
+ * @example
+ * convertToSingleLine("foo\n  bar") // returns "foo bar"
+ */
+function convertToSingleLine(code) {
+    if (!code)
+        return '';
+    // Remove line breaks and unnecessary whitespace
+    return code.replace(/\s+/g, ' ').trim();
+}
+//# sourceMappingURL=nile-code-editor.js.map