@gravity-ui/querieskit 1.2.0 → 1.3.1

package/src/components/HistoryGroupHeader/HistoryGroupHeader.tsx

@@ -1,18 +0,0 @@
-import React, {FC} from 'react';
-import {Text} from '@gravity-ui/uikit';
-import cn from 'bem-cn-lite';
-import './HistoryGroupHeader.scss';
-
-type Props = {
-    title: string;
-};
-
-const block = cn('qp-history-list-header');
-
-export const HistoryGroupHeader: FC<Props> = ({title}) => {
-    return (
-        <Text as="div" color="secondary" className={block()}>
-            {title}
-        </Text>
-    );
-};

package/src/components/HistoryGroupHeader/index.ts

@@ -1 +0,0 @@
-export {HistoryGroupHeader} from './HistoryGroupHeader';

package/src/components/HistoryPrivateIcon/HistoryPrivateIcon.scss

@@ -1,7 +0,0 @@
-.qp-history-private-icon {
-  color: var(--g-color-text-complementary);
-
-  &_open {
-    color: var(--g-color-text-positive-heavy);
-  }
-}

package/src/components/HistoryPrivateIcon/HistoryPrivateIcon.tsx

@@ -1,22 +0,0 @@
-import React, {FC} from 'react';
-import {Icon} from '@gravity-ui/uikit';
-import LockIcon from '@gravity-ui/icons/svgs/lock.svg';
-import LockOpenIcon from '@gravity-ui/icons/svgs/lock-open.svg';
-import './HistoryPrivateIcon.scss';
-import cn from 'bem-cn-lite';
-
-type Props = {
-    isPrivate?: boolean;
-};
-
-const block = cn('qp-history-private-icon');
-
-export const HistoryPrivateIcon: FC<Props> = ({isPrivate}) => {
-    return (
-        <Icon
-            data={isPrivate ? LockIcon : LockOpenIcon}
-            size={16}
-            className={block({open: !isPrivate})}
-        />
-    );
-};

package/src/components/HistoryPrivateIcon/index.ts

@@ -1 +0,0 @@
-export {HistoryPrivateIcon} from './HistoryPrivateIcon';

package/src/components/LazyList/LazyList.scss

@@ -1,13 +0,0 @@
-.qp-lazy-list {
-  .g-list__item_selected:hover {
-    background-color: var(--g-color-base-selection-hover);
-  }
-
-  &__sentinel {
-    height: 1px;
-  }
-
-  &__spinner {
-    height: 100%;
-  }
-}

package/src/components/LazyList/LazyList.tsx

@@ -1,97 +0,0 @@
-import React, {useMemo} from 'react';
-import {List} from '@gravity-ui/uikit';
-import cn from 'bem-cn-lite';
-import {useLoadMoreSentinel} from '../../helpers/useLoadMoreSentinel';
-import {ListSpinner} from '../ListSpinner';
-import './LazyList.scss';
-
-const block = cn('qp-lazy-list');
-
-const SENTINEL_ROW_HEIGHT = 1;
-
-type SentinelRow = {__sentinel: true};
-type LazyListRow<T> = T | SentinelRow;
-
-const isSentinelRow = <T,>(row: LazyListRow<T>): row is SentinelRow =>
-    Boolean(row) && typeof row === 'object' && '__sentinel' in (row as object);
-
-export type LazyListProps<T extends object> = {
-    items: T[];
-    itemHeight: (item: T) => number;
-    renderItem: (item: T, isActive: boolean, index: number) => React.ReactNode;
-    hasMore?: boolean;
-    onLoadMore?: () => void;
-    onItemClick?: (item: T, index: number) => void;
-    selectedItemIndex?: T[keyof T] | number;
-    filterable?: boolean;
-    loading?: boolean;
-    error?: React.ReactNode;
-    emptyContent?: React.ReactNode;
-    isEmpty?: boolean;
-    className?: string;
-};
-
-export const LazyList = <T extends object>({
-    items,
-    itemHeight,
-    renderItem,
-    hasMore,
-    onLoadMore,
-    onItemClick,
-    selectedItemIndex,
-    filterable = false,
-    loading,
-    error,
-    emptyContent,
-    isEmpty,
-    className,
-}: LazyListProps<T>) => {
-    const sentinelRef = useLoadMoreSentinel(hasMore, onLoadMore);
-
-    const rows: LazyListRow<T>[] = useMemo(
-        () => (hasMore ? [...items, {__sentinel: true}] : items),
-        [items, hasMore],
-    );
-
-    const getRowHeight = (row: LazyListRow<T>) =>
-        isSentinelRow(row) ? SENTINEL_ROW_HEIGHT : itemHeight(row);
-
-    if (error) {
-        return <React.Fragment>{error}</React.Fragment>;
-    }
-
-    const empty = isEmpty ?? !items.length;
-
-    if (loading && empty) {
-        return <ListSpinner className={block('spinner', className)} />;
-    }
-
-    if (empty) {
-        return <React.Fragment>{emptyContent}</React.Fragment>;
-    }
-
-    return (
-        <List<LazyListRow<T>>
-            className={block(null, className)}
-            filterable={filterable}
-            items={rows}
-            itemHeight={getRowHeight}
-            itemsHeight={(listRows) =>
-                listRows.reduce((total, row) => total + getRowHeight(row), 0)
-            }
-            renderItem={(row, isActive, index) =>
-                isSentinelRow(row) ? (
-                    <div ref={sentinelRef} className={block('sentinel')} />
-                ) : (
-                    renderItem(row, isActive, index)
-                )
-            }
-            selectedItemIndex={selectedItemIndex as never}
-            onItemClick={(row, index) => {
-                if (!isSentinelRow(row)) {
-                    onItemClick?.(row, index);
-                }
-            }}
-        />
-    );
-};

package/src/components/LazyList/index.ts

@@ -1,2 +0,0 @@
-export {LazyList} from './LazyList';
-export type {LazyListProps} from './LazyList';

package/src/components/ListSpinner/ListSpinner.scss

@@ -1,3 +0,0 @@
-.qp-list-spinner {
-    height: 100%;
-}

package/src/components/ListSpinner/ListSpinner.tsx

@@ -1,18 +0,0 @@
-import React, {FC} from 'react';
-import {Flex, Spin} from '@gravity-ui/uikit';
-import cn from 'bem-cn-lite';
-import './ListSpinner.scss';
-
-const block = cn('qp-list-spinner');
-
-export type ListSpinnerProps = {
-    className?: string;
-};
-
-export const ListSpinner: FC<ListSpinnerProps> = ({className}) => {
-    return (
-        <Flex alignItems="center" justifyContent="center" className={block(null, className)}>
-            <Spin size="m" />
-        </Flex>
-    );
-};

package/src/components/ListSpinner/index.ts

@@ -1,2 +0,0 @@
-export {ListSpinner} from './ListSpinner';
-export type {ListSpinnerProps} from './ListSpinner';

package/src/components/MonacoEditor/MonacoEditor.tsx

@@ -1,112 +0,0 @@
-import React, {FC, useEffect, useRef} from 'react';
-// @ts-ignore monaco-editor ships its own types but the default resolution
-// doesn't pick them up for this deep import path in this project setup.
-import * as monaco from 'monaco-editor/editor/editor.api';
-import './monaco-yql-languages/monaco.contribution';
-import {MONACO_THEME_BY_UI, MonacoThemeName, YT_LIGHT_MONACO_THEME} from './MonacoEditorThemes';
-
-export type MonacoEditorConfig = Omit<monaco.editor.IStandaloneEditorConstructionOptions, 'theme'>;
-
-type Props = {
-    value: string;
-    readOnly?: boolean;
-    language?: string;
-    theme?: string;
-    onClick?: (e: monaco.editor.IEditorMouseEvent) => void;
-    monacoConfig?: MonacoEditorConfig;
-    className?: string;
-};
-
-const resolveTheme = (theme?: string): MonacoThemeName => {
-    if (!theme) {
-        return YT_LIGHT_MONACO_THEME;
-    }
-    return (MONACO_THEME_BY_UI[theme] ?? theme) as MonacoThemeName;
-};
-
-export const MonacoEditor: FC<Props> = ({
-    value,
-    language,
-    theme,
-    readOnly,
-    onClick,
-    monacoConfig,
-    className,
-}) => {
-    const containerRef = useRef<HTMLDivElement>(null);
-    const editorRef = useRef<monaco.editor.IStandaloneCodeEditor | null>(null);
-    const modelRef = useRef<monaco.editor.ITextModel | null>(null);
-    // Keeps the latest `onClick` without re-subscribing the mouse listener
-    // on every render (avoids stale closures without extra effect churn).
-    const onClickRef = useRef(onClick);
-    onClickRef.current = onClick;
-
-    // Create the editor + model once per mount, dispose both on unmount.
-    useEffect(() => {
-        if (!containerRef.current) return undefined;
-
-        const model = monaco.editor.createModel(value, language);
-        modelRef.current = model;
-
-        const editorInstance = monaco.editor.create(containerRef.current, {
-            model,
-            renderLineHighlight: 'none',
-            colorDecorators: true,
-            automaticLayout: true,
-            readOnly,
-            minimap: {
-                enabled: false,
-            },
-            lineNumbers: 'on',
-            suggestOnTriggerCharacters: true,
-            wordBasedSuggestions: 'off',
-            theme: resolveTheme(theme),
-            ...monacoConfig,
-        });
-        editorRef.current = editorInstance;
-
-        const mouseDownSubscription = editorInstance.onMouseDown((e) => {
-            onClickRef.current?.(e);
-        });
-
-        return () => {
-            mouseDownSubscription.dispose();
-            editorInstance.dispose();
-            model.dispose();
-            editorRef.current = null;
-            modelRef.current = null;
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-
-    // Keep the model text in sync with the `value` prop after the initial mount.
-    useEffect(() => {
-        const model = modelRef.current;
-        if (model && model.getValue() !== value) {
-            model.setValue(value);
-        }
-    }, [value]);
-
-    // Keep the model language in sync with the `language` prop.
-    useEffect(() => {
-        const model = modelRef.current;
-        if (model && language !== undefined) {
-            monaco.editor.setModelLanguage(model, language);
-        }
-    }, [language]);
-
-    // Keep the editor theme in sync with the `theme` prop.
-    useEffect(() => {
-        monaco.editor.setTheme(resolveTheme(theme));
-    }, [theme]);
-
-    // Re-apply options (e.g. `readOnly`, `monacoConfig`) when they change.
-    useEffect(() => {
-        editorRef.current?.updateOptions({
-            readOnly,
-            ...monacoConfig,
-        });
-    }, [readOnly, monacoConfig]);
-
-    return <div ref={containerRef} className={className}></div>;
-};

package/src/components/MonacoEditor/MonacoEditorThemes.tsx

@@ -1,73 +0,0 @@
-// @ts-ignore monaco-editor ships its own types but the default resolution
-// doesn't pick them up for this deep import path in this project setup.
-import * as monaco from 'monaco-editor/editor/editor.api';
-
-const lightRules = [
-    {token: 'string.tablepath', foreground: '3e999f'},
-    {token: 'path', foreground: '3e999f', fontStyle: 'underline'},
-    {token: 'string.sql', foreground: 'a31515'},
-];
-
-export const YT_LIGHT_MONACO_THEME = 'yt-light';
-monaco.editor.defineTheme(YT_LIGHT_MONACO_THEME, {
-    base: 'vs',
-    inherit: true,
-    rules: lightRules,
-    colors: {
-        'editorLineNumber.foreground': '#000000b3',
-        'editor.lineHighlightBackground': '#0000000a',
-        'editorGutter.background': '#0000000a',
-    },
-});
-
-export const YT_LIGHT_HC_MONACO_THEME = 'yt-light-hc';
-monaco.editor.defineTheme(YT_LIGHT_HC_MONACO_THEME, {
-    base: 'hc-light',
-    inherit: true,
-    rules: lightRules,
-    colors: {},
-});
-
-const darkRules = [
-    {token: 'string.tablepath', foreground: '3e999f'},
-    {token: 'path', foreground: '3e999f', fontStyle: 'underline'},
-    {token: 'string.sql', foreground: 'ce9178'},
-];
-
-export const YT_DARK_MONACO_THEME = 'yt-dark';
-monaco.editor.defineTheme(YT_DARK_MONACO_THEME, {
-    base: 'vs-dark',
-    inherit: true,
-    rules: darkRules,
-    colors: {
-        'editorLineNumber.foreground': '#ffffffb3',
-        'editor.lineHighlightBackground': '#ffffff0a',
-        'editorGutter.background': '#ffffff0a',
-        'editor.background': '#2d2c33',
-    },
-});
-
-export const YT_DARK_HC_MONACO_THEME = 'yt-dark-hc';
-monaco.editor.defineTheme(YT_DARK_HC_MONACO_THEME, {
-    base: 'hc-black',
-    inherit: true,
-    rules: darkRules,
-    colors: {},
-});
-
-export type MonacoThemeName =
-    | typeof YT_LIGHT_MONACO_THEME
-    | typeof YT_LIGHT_HC_MONACO_THEME
-    | typeof YT_DARK_MONACO_THEME
-    | typeof YT_DARK_HC_MONACO_THEME
-    | 'vs'
-    | 'vs-dark'
-    | 'hc-black'
-    | 'hc-light';
-
-export const MONACO_THEME_BY_UI: Record<string, MonacoThemeName> = {
-    dark: YT_DARK_MONACO_THEME,
-    'dark-hc': YT_DARK_HC_MONACO_THEME,
-    light: YT_LIGHT_MONACO_THEME,
-    'light-hc': YT_LIGHT_HC_MONACO_THEME,
-};

package/src/components/MonacoEditor/index.ts

@@ -1,11 +0,0 @@
-export {MonacoEditor} from './MonacoEditor';
-export type {MonacoEditorConfig} from './MonacoEditor';
-export {MonacoLanguage} from './monaco-yql-languages';
-export {
-    YT_DARK_HC_MONACO_THEME,
-    YT_DARK_MONACO_THEME,
-    YT_LIGHT_HC_MONACO_THEME,
-    YT_LIGHT_MONACO_THEME,
-    MONACO_THEME_BY_UI,
-} from './MonacoEditorThemes';
-export type {MonacoThemeName} from './MonacoEditorThemes';

package/src/components/MonacoEditor/monaco-yql-languages/_.contribution.ts

@@ -1,193 +0,0 @@
-import {
-    type CancellationToken,
-    Emitter,
-    type IEvent,
-    type Position,
-    type editor,
-    languages,
-} from 'monaco-editor';
-
-interface ILang extends languages.ILanguageExtensionPoint {
-    loader: () => Promise<ILangImpl>;
-}
-
-interface ILangImpl {
-    conf: languages.LanguageConfiguration;
-    language: languages.IMonarchLanguage;
-    provideSuggestionsFunction?: (
-        model: editor.ITextModel,
-        monacoCursorPosition: Position,
-        _context: languages.CompletionContext,
-        _token: CancellationToken,
-    ) =>
-        | {suggestions: languages.CompletionItem[]}
-        | Promise<{suggestions: languages.CompletionItem[]}>;
-    provideInlineSuggestionsFunction?: (
-        model: editor.ITextModel,
-        monacoCursorPosition: Position,
-        _context: languages.InlineCompletionContext,
-        _token: CancellationToken,
-    ) => Promise<{items: languages.InlineCompletion[]}>;
-}
-
-const languageDefinitions: {[languageId: string]: ILang} = {};
-const lazyLanguageLoaders: {[languageId: string]: LazyLanguageLoader} = {};
-
-class LazyLanguageLoader {
-    public static getOrCreate(languageId: string): LazyLanguageLoader {
-        if (!lazyLanguageLoaders[languageId]) {
-            lazyLanguageLoaders[languageId] = new LazyLanguageLoader(languageId);
-        }
-        return lazyLanguageLoaders[languageId];
-    }
-
-    private readonly _languageId: string;
-    private _loadingTriggered: boolean;
-    private _lazyLoadPromise: Promise<ILangImpl>;
-    private _lazyLoadPromiseResolve!: (value: ILangImpl) => void;
-    private _lazyLoadPromiseReject!: (err: unknown) => void;
-
-    constructor(languageId: string) {
-        this._languageId = languageId;
-        this._loadingTriggered = false;
-        this._lazyLoadPromise = new Promise((resolve, reject) => {
-            this._lazyLoadPromiseResolve = resolve;
-            this._lazyLoadPromiseReject = reject;
-        });
-    }
-
-    public whenLoaded(): Promise<ILangImpl> {
-        return this._lazyLoadPromise;
-    }
-
-    public load(): Promise<ILangImpl> {
-        if (!this._loadingTriggered) {
-            this._loadingTriggered = true;
-            languageDefinitions[this._languageId].loader().then(
-                (mod) => this._lazyLoadPromiseResolve(mod),
-                (err) => this._lazyLoadPromiseReject(err),
-            );
-        }
-        return this._lazyLoadPromise;
-    }
-}
-
-export function registerLanguage(def: ILang): void {
-    const languageId = def.id;
-
-    languageDefinitions[languageId] = def;
-    languages.register(def);
-
-    const lazyLanguageLoader = LazyLanguageLoader.getOrCreate(languageId);
-    languages.setMonarchTokensProvider(
-        languageId,
-        lazyLanguageLoader.whenLoaded().then((mod) => mod.language),
-    );
-    languages.onLanguage(languageId, () => {
-        lazyLanguageLoader.load().then((mod) => {
-            languages.setLanguageConfiguration(languageId, mod.conf);
-        });
-    });
-    lazyLanguageLoader.whenLoaded().then((mod) => {
-        if (mod.provideSuggestionsFunction) {
-            languages.registerCompletionItemProvider(languageId, {
-                triggerCharacters: ['`', ':', '/', '', ' '],
-                provideCompletionItems: mod.provideSuggestionsFunction,
-            });
-        }
-        if (mod.provideInlineSuggestionsFunction) {
-            languages.registerInlineCompletionsProvider(languageId, {
-                provideInlineCompletions: mod.provideInlineSuggestionsFunction,
-                disposeInlineCompletions: () => {},
-            });
-        }
-    });
-}
-
-export interface ModeConfiguration {
-    readonly completionItems?: boolean;
-    readonly hovers?: boolean;
-    readonly documentSymbols?: boolean;
-    readonly definitions?: boolean;
-    readonly references?: boolean;
-    readonly documentHighlights?: boolean;
-    readonly rename?: boolean;
-    readonly colors?: boolean;
-    readonly foldingRanges?: boolean;
-    readonly diagnostics?: boolean;
-    readonly selectionRanges?: boolean;
-}
-
-export interface DiagnosticsOptions {
-    readonly validate?: boolean;
-}
-
-export interface LanguageServiceDefaults {
-    readonly languageId: string;
-    readonly onDidChange: IEvent<LanguageServiceDefaults>;
-    readonly diagnosticsOptions: DiagnosticsOptions;
-    readonly modeConfiguration: ModeConfiguration;
-    setDiagnosticsOptions(options: DiagnosticsOptions): void;
-    setModeConfiguration(modeConfiguration: ModeConfiguration): void;
-}
-
-export class LanguageServiceDefaultsImpl implements LanguageServiceDefaults {
-    private _onDidChange = new Emitter<LanguageServiceDefaults>();
-    private _diagnosticsOptions!: DiagnosticsOptions;
-    private _modeConfiguration!: ModeConfiguration;
-    private _languageId: string;
-
-    constructor(
-        languageId: string,
-        diagnosticsOptions: DiagnosticsOptions,
-        modeConfiguration: ModeConfiguration,
-    ) {
-        this._languageId = languageId;
-        this.setDiagnosticsOptions(diagnosticsOptions);
-        this.setModeConfiguration(modeConfiguration);
-    }
-
-    public get onDidChange(): IEvent<LanguageServiceDefaults> {
-        return this._onDidChange.event;
-    }
-
-    public get languageId(): string {
-        return this._languageId;
-    }
-
-    public get modeConfiguration(): ModeConfiguration {
-        return this._modeConfiguration;
-    }
-
-    public get diagnosticsOptions(): DiagnosticsOptions {
-        return this._diagnosticsOptions;
-    }
-
-    public setDiagnosticsOptions(options: DiagnosticsOptions): void {
-        this._diagnosticsOptions = options || Object.create(null);
-        this._onDidChange.fire(this);
-    }
-
-    public setModeConfiguration(modeConfiguration: ModeConfiguration): void {
-        this._modeConfiguration = modeConfiguration || Object.create(null);
-        this._onDidChange.fire(this);
-    }
-}
-
-export const modeConfigurationDefault: Required<ModeConfiguration> = {
-    completionItems: true,
-    hovers: true,
-    documentSymbols: true,
-    definitions: true,
-    references: true,
-    documentHighlights: true,
-    rename: true,
-    colors: true,
-    foldingRanges: true,
-    diagnostics: true,
-    selectionRanges: true,
-};
-
-export const diagnosticDefault: Required<DiagnosticsOptions> = {
-    validate: true,
-};

package/src/components/MonacoEditor/monaco-yql-languages/clickhouse/clickhouse.contribution.ts

@@ -1,14 +0,0 @@
-import {registerLanguage} from '../_.contribution';
-import {MonacoLanguage} from '../constants';
-
-registerLanguage({
-    id: MonacoLanguage.CHYT,
-    extensions: [],
-    loader: async () => {
-        const lang = await import('./clickhouse');
-        return {
-            conf: lang.conf,
-            language: lang.language,
-        };
-    },
-});