@cloudbase/weda-ui 0.2.17 → 0.2.21-alpha.2

package/dist/web/components/wd-code-editor/lang/mongodb/complete.js

@@ -0,0 +1,222 @@
+/* eslint-disable rulesdir/no-phantom-deps*/
+/* eslint-disable @typescript-eslint/no-magic-numbers */
+import { 
+// eslint-disable-next-line tree-shaking/no-side-effects-in-initialization
+NodeWeakMap, IterMode, } from '@lezer/common';
+import { syntaxTree } from '@codemirror/language';
+const cache = new NodeWeakMap();
+const ScopeNodes = new Set([
+    'Script',
+    'Block',
+    'FunctionExpression',
+    'FunctionDeclaration',
+    'ArrowFunction',
+    'MethodDeclaration',
+    'ForStatement',
+]);
+function defID(type) {
+    return (node, def) => {
+        const id = node.node.getChild('VariableDefinition');
+        if (id)
+            def(id, type);
+        return true;
+    };
+}
+const functionContext = ['FunctionDeclaration'];
+const gatherCompletions = {
+    FunctionDeclaration: defID('function'),
+    ClassDeclaration: defID('class'),
+    ClassExpression: () => true,
+    EnumDeclaration: defID('constant'),
+    TypeAliasDeclaration: defID('type'),
+    NamespaceDeclaration: defID('namespace'),
+    VariableDefinition(node, def) {
+        if (!node.matchContext(functionContext))
+            def(node, 'variable');
+    },
+    TypeDefinition(node, def) {
+        def(node, 'type');
+    },
+    __proto__: null,
+};
+function getScope(doc, node) {
+    const cached = cache.get(node);
+    if (cached)
+        return cached;
+    const completions = [];
+    let top = true;
+    function def(node, type) {
+        const name = doc.sliceString(node.from, node.to);
+        completions.push({ label: name, type });
+    }
+    node.cursor(IterMode.IncludeAnonymous).iterate((node) => {
+        if (top) {
+            top = false;
+        }
+        else if (node.name) {
+            const gather = gatherCompletions[node.name];
+            if ((gather && gather(node, def)) || ScopeNodes.has(node.name))
+                return false;
+        }
+        else if (node.to - node.from > 8192) {
+            // Allow caching for bigger internal nodes
+            for (const c of getScope(doc, node.node))
+                completions.push(c);
+            return false;
+        }
+    });
+    cache.set(node, completions);
+    return completions;
+}
+const Identifier = /^[\w$\xa1-\uffff][\w$\d\xa1-\uffff]*$/;
+export const dontComplete = [
+    'TemplateString',
+    'String',
+    'RegExp',
+    'LineComment',
+    'BlockComment',
+    'VariableDefinition',
+    'TypeDefinition',
+    'Label',
+    'PropertyDefinition',
+    'PropertyName',
+    'PrivatePropertyDefinition',
+    'PrivatePropertyName',
+    '.',
+    '?.',
+];
+/// Completion source that looks up locally defined names in
+/// JavaScript code.
+export function localCompletionSource(context) {
+    const inner = syntaxTree(context.state).resolveInner(context.pos, -1);
+    if (dontComplete.indexOf(inner.name) > -1)
+        return null;
+    const isWord = inner.name == 'VariableName' ||
+        (inner.to - inner.from < 20 &&
+            Identifier.test(context.state.sliceDoc(inner.from, inner.to)));
+    if (!isWord && !context.explicit)
+        return null;
+    let options = [];
+    for (let pos = inner; pos; pos = pos.parent) {
+        if (ScopeNodes.has(pos.name))
+            options = options.concat(getScope(context.state.doc, pos));
+    }
+    return {
+        options,
+        from: isWord ? inner.from : context.pos,
+        validFor: Identifier,
+    };
+}
+function pathFor(read, member, name) {
+    var _a;
+    const path = [];
+    for (;;) {
+        const obj = member.firstChild;
+        let prop;
+        if ((obj === null || obj === void 0 ? void 0 : obj.name) == 'VariableName') {
+            path.push(read(obj));
+            return { path: path.reverse(), name };
+        }
+        else if ((obj === null || obj === void 0 ? void 0 : obj.name) == 'MemberExpression' &&
+            ((_a = (prop = obj.lastChild)) === null || _a === void 0 ? void 0 : _a.name) == 'PropertyName') {
+            path.push(read(prop));
+            member = obj;
+        }
+        else {
+            return null;
+        }
+    }
+}
+/// Helper function for defining JavaScript completion sources. It
+/// returns the completable name and object path for a completion
+/// context, or null if no name/property completion should happen at
+/// that position. For example, when completing after `a.b.c` it will
+/// return `{path: ["a", "b"], name: "c"}`. When completing after `x`
+/// it will return `{path: [], name: "x"}`. When not in a property or
+/// name, it will return null if `context.explicit` is false, and
+/// `{path: [], name: ""}` otherwise.
+export function completionPath(context) {
+    const read = (node) => context.state.doc.sliceString(node.from, node.to);
+    const inner = syntaxTree(context.state).resolveInner(context.pos, -1);
+    if (inner.name == 'PropertyName') {
+        return pathFor(read, inner.parent, read(inner));
+    }
+    else if ((inner.name == '.' || inner.name == '?.') &&
+        inner.parent.name == 'MemberExpression') {
+        return pathFor(read, inner.parent, '');
+    }
+    else if (dontComplete.indexOf(inner.name) > -1) {
+        return null;
+    }
+    else if (inner.name == 'VariableName' ||
+        (inner.to - inner.from < 20 && Identifier.test(read(inner)))) {
+        return { path: [], name: read(inner) };
+    }
+    else if (inner.name == 'MemberExpression') {
+        return pathFor(read, inner, '');
+    }
+    else {
+        return context.explicit ? { path: [], name: '' } : null;
+    }
+}
+function enumeratePropertyCompletions(obj, top) {
+    const options = [], seen = new Set();
+    for (let depth = 0;; depth++) {
+        for (const name of (Object.getOwnPropertyNames || Object.keys)(obj)) {
+            if (!/^[a-zA-Z_$\xaa-\uffdc][\w$\xaa-\uffdc]*$/.test(name) ||
+                seen.has(name))
+                continue;
+            seen.add(name);
+            let value;
+            try {
+                value = obj[name];
+            }
+            catch (_) {
+                continue;
+            }
+            options.push({
+                label: name,
+                type: typeof value == 'function'
+                    ? /^[A-Z]/.test(name)
+                        ? 'class'
+                        : top
+                            ? 'function'
+                            : 'method'
+                    : top
+                        ? 'variable'
+                        : 'property',
+                boost: -depth,
+            });
+        }
+        const next = Object.getPrototypeOf(obj);
+        if (!next)
+            return options;
+        obj = next;
+    }
+}
+/// Defines a [completion source](#autocomplete.CompletionSource) that
+/// completes from the given scope object (for example `globalThis`).
+/// Will enter properties of the object when completing properties on
+/// a directly-named path.
+export function scopeCompletionSource(scope) {
+    const cache = new Map();
+    return (context) => {
+        const path = completionPath(context);
+        if (!path)
+            return null;
+        let target = scope;
+        for (const step of path.path) {
+            target = target[step];
+            if (!target)
+                return null;
+        }
+        let options = cache.get(target);
+        if (!options)
+            cache.set(target, (options = enumeratePropertyCompletions(target, !path.path.length)));
+        return {
+            from: context.pos - path.name.length,
+            options,
+            validFor: Identifier,
+        };
+    };
+}

package/dist/web/components/wd-code-editor/lang/mongodb/index.d.ts

@@ -0,0 +1,2 @@
+import { LanguageSupport } from '@codemirror/language';
+export declare function mongodb(): LanguageSupport;

package/dist/web/components/wd-code-editor/lang/mongodb/index.js

@@ -0,0 +1,60 @@
+/* eslint-disable rulesdir/no-phantom-deps */
+/* eslint-disable @typescript-eslint/no-magic-numbers */
+import { parser } from '@lezer/javascript';
+import { LRLanguage, LanguageSupport, delimitedIndent, flatIndent, continuedIndent, indentNodeProp, foldNodeProp, foldInside, } from '@codemirror/language';
+import { completeFromList, ifNotIn } from '@codemirror/autocomplete';
+import { getCompletions, getSnippets } from './snippets';
+import { localCompletionSource, dontComplete } from './complete';
+/// mongodb support. Includes [snippet](#lang-mongodb.snippets)
+/// and local variable completion.
+export function mongodb() {
+    /// A language provider based on the [Lezer mongodb
+    /// parser](https://github.com/lezer-parser/mongodb), extended with
+    /// highlighting and indentation information.
+    const lang = LRLanguage.define({
+        name: 'mongodb',
+        parser: parser.configure({
+            props: [
+                indentNodeProp.add({
+                    IfStatement: continuedIndent({ except: /^\s*({|else\b)/ }),
+                    TryStatement: continuedIndent({
+                        except: /^\s*({|catch\b|finally\b)/,
+                    }),
+                    LabeledStatement: flatIndent,
+                    SwitchBody: (context) => {
+                        const after = context.textAfter, closed = /^\s*\}/.test(after), isCase = /^\s*(case|default)\b/.test(after);
+                        return (context.baseIndent + (closed ? 0 : isCase ? 1 : 2) * context.unit);
+                    },
+                    Block: delimitedIndent({ closing: '}' }),
+                    ArrowFunction: (cx) => cx.baseIndent + cx.unit,
+                    'TemplateString BlockComment': () => null,
+                    'Statement Property': continuedIndent({ except: /^{/ }),
+                }),
+                foldNodeProp.add({
+                    'Block ClassBody SwitchBody EnumBody ObjectExpression ArrayExpression ObjectType': foldInside,
+                    BlockComment(tree) {
+                        return { from: tree.from + 2, to: tree.to - 2 };
+                    },
+                }),
+            ],
+        }),
+        languageData: {
+            closeBrackets: { brackets: ['(', '[', '{', "'", '"', '`'] },
+            commentTokens: { line: '//', block: { open: '/*', close: '*/' } },
+            indentOnInput: /^\s*(?:case |default:|\{|\}|<\/)$/,
+            wordChars: '$',
+        },
+    });
+    return new LanguageSupport(lang, [
+        lang.data.of({
+            autocomplete: ifNotIn(dontComplete, completeFromList(getSnippets())),
+        }),
+        lang.data.of({
+            autocomplete: localCompletionSource,
+        }),
+        lang.data.of({
+            autocomplete: getCompletions,
+        }),
+        [],
+    ]);
+}

package/dist/web/components/wd-code-editor/lang/mongodb/snippets.d.ts

@@ -0,0 +1,6 @@
+export declare const getSnippets: () => import("@codemirror/autocomplete").Completion[];
+export declare const getCompletions: (context: any) => {
+    from: any;
+    options: any[];
+    validFor: RegExp;
+};

package/dist/web/components/wd-code-editor/lang/mongodb/snippets.js

@@ -0,0 +1,189 @@
+import { snippetCompletion as snip } from '@codemirror/autocomplete';
+const completionMap = (name, type) => ({ label: name, type });
+/// A collection of JavaScript-related
+/// [snippets](#autocomplete.snippet).
+export const getSnippets = () => {
+    const snippets = [
+        snip('function ${name}(${params}) {\n\t${}\n}', {
+            label: 'function',
+            detail: 'definition',
+            type: 'keyword',
+        }),
+        snip('for (let ${index} = 0; ${index} < ${bound}; ${index}++) {\n\t${}\n}', {
+            label: 'for',
+            detail: 'loop',
+            type: 'keyword',
+        }),
+        snip('for (let ${name} of ${collection}) {\n\t${}\n}', {
+            label: 'for',
+            detail: 'of loop',
+            type: 'keyword',
+        }),
+        snip('do {\n\t${}\n} while (${})', {
+            label: 'do',
+            detail: 'loop',
+            type: 'keyword',
+        }),
+        snip('while (${}) {\n\t${}\n}', {
+            label: 'while',
+            detail: 'loop',
+            type: 'keyword',
+        }),
+        snip('try {\n\t${}\n} catch (${error}) {\n\t${}\n}', {
+            label: 'try',
+            detail: '/ catch block',
+            type: 'keyword',
+        }),
+        snip('if (${}) {\n\t${}\n}', {
+            label: 'if',
+            detail: 'block',
+            type: 'keyword',
+        }),
+        snip('if (${}) {\n\t${}\n} else {\n\t${}\n}', {
+            label: 'if',
+            detail: '/ else block',
+            type: 'keyword',
+        }),
+        snip('class ${name} {\n\tconstructor(${params}) {\n\t\t${}\n\t}\n}', {
+            label: 'class',
+            detail: 'definition',
+            type: 'keyword',
+        }),
+    ];
+    const keywords = [
+        'await',
+        'async',
+        'break',
+        'case',
+        'catch',
+        'const',
+        'constructor',
+        'continue',
+        'debugger',
+        'default',
+        'delete',
+        'else',
+        'enum',
+        'export',
+        'extends',
+        'false',
+        'finally',
+        'implements',
+        'import',
+        'in',
+        'instanceof',
+        'interface',
+        'let',
+        'new',
+        'private',
+        'protected',
+        'public',
+        'return',
+        'switch',
+        'static',
+        'throw',
+        'typeof',
+        'var',
+        'void',
+        'while',
+        'yield',
+    ].map((i) => completionMap(i, 'keyword'));
+    return snippets.concat(keywords);
+};
+export const getCompletions = (context) => {
+    const classList = [
+        'Math',
+        'Array',
+        'Object',
+        'String',
+        'Number',
+        'Boolean',
+        'Date',
+        'RegExp',
+        'Error',
+        'Symbol',
+        'Set',
+        'Map',
+        'WeakSet',
+        'WeakMap',
+        'Promise',
+        'Proxy',
+        'Reflect',
+        'JSON',
+        'Intl',
+        'Function',
+    ].map((i) => completionMap(i, 'class'));
+    const constantList = [
+        'undefined',
+        'NaN',
+        'Infinity',
+        'null',
+        'true',
+        'false',
+        'this',
+        'super',
+        'console',
+        'process',
+        'globalThis',
+        'global',
+        'arguments',
+    ].map((i) => completionMap(i, 'constant'));
+    const functionList = ['eval', 'require'].map((i) => completionMap(i, 'constant'));
+    const methodList = [
+        'aggregate',
+        'bulkWrite',
+        'count',
+        'countDocuments',
+        'createIndex',
+        'createIndexes',
+        'dataSize',
+        'deleteMany',
+        'deleteOne',
+        'distinct',
+        'drop',
+        'dropIndex',
+        'dropIndexes',
+        'ensureIndex',
+        'estimatedDocumentCount',
+        'explain',
+        'find',
+        'findAndModify',
+        'findOne',
+        'findOneAndDelete',
+        'findOneAndReplace',
+        'findOneAndUpdate',
+        'getIndexes',
+        'hideIndex',
+        'insert',
+        'insertOne',
+        'insertMany',
+        'isCapped',
+        'mapReduce',
+        'reIndex',
+        'remove',
+        'renameCollection',
+        'replaceOne',
+        'save',
+        'stats',
+        'storageSize',
+        'totalIndexSize',
+        'totalSize',
+        'unhideIndex',
+        'update',
+        'updateMany',
+        'updateOne',
+        'watch',
+    ].map((i) => completionMap(i, 'method'));
+    const textList = ['db'].map((i) => completionMap(i, 'text'));
+    const completions = [].concat(textList, classList, constantList, functionList, methodList);
+    const before = context.matchBefore(/\w+/);
+    // If completion wasn't explicitly started and there
+    // is no word before the cursor, don't open completions.
+    if (!context.explicit && !before)
+        return null;
+    return {
+        from: before ? before.from : context.pos,
+        options: completions,
+        validFor: /^\w*$/,
+    };
+};

package/dist/web/components/wd-code-editor/theme.d.ts

@@ -0,0 +1,4 @@
+export declare const themeData: {
+    githubLight: import("@codemirror/state").Extension;
+    githubDark: import("@codemirror/state").Extension;
+};

package/dist/web/components/wd-code-editor/theme.js

@@ -0,0 +1,5 @@
+import { githubLight, githubDark } from '@uiw/codemirror-theme-github';
+export const themeData = {
+    githubLight,
+    githubDark,
+};

package/dist/web/components/wd-code-editor/wd-code-editor.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-code-editor';
+import { LanguageName } from './lang';
+export declare const WdCodeEditor: React.ForwardRefExoticComponent<WdCodeEditorProps & React.RefAttributes<any>>;
+export interface WdCodeEditorProps extends CommonPropsType, DataType {
+    classRoot?: string;
+    language?: LanguageName;
+}

package/dist/web/components/wd-code-editor/wd-code-editor.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
+import CodeMirror from '@uiw/react-codemirror';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { WdFormItem } from '../wd-form-item';
+import { useFormInputTrait } from '../form-input-hooks';
+import { filterPropsWithOn, getUuid } from '../../utils/tool';
+import { errorHandler } from '../../utils/error';
+import { useSize } from '../../utils/hooks/useFormLegacy';
+import { useSetWidgetApi } from '../../utils/widget-api/use-set-widget-api';
+import { X_RUNTIME_DEFAULT } from '../../../configs/type-utils/x-runtime-default';
+import { loadLanguage, format } from './lang';
+import { themeData } from './theme';
+export const WdCodeEditor = React.forwardRef(function WdCodeEditor(props, ref) {
+    const { name, placeholder, focus = X_RUNTIME_DEFAULT.focus, events, classRoot = 'code-editor', language = X_RUNTIME_DEFAULT.codeEditorLanguage, theme = X_RUNTIME_DEFAULT.codeEditorTheme, style, } = props;
+    /** 兼容从 Form 获取属性，必须引入，自动挂载组件方法 */
+    const [innerHandle, setInnerHandle] = useState({});
+    const traitProps = { ...props, setInnerHandle, inputRef: ref };
+    const { value: _value, onChange: onChangeForm, disabled, readOnly, validateErrorMsg, validateState, visible, } = useFormInputTrait(traitProps);
+    const value = _value !== null && _value !== void 0 ? _value : '';
+    const { classPrefix } = useConfig();
+    const startWithOnProps = useMemo(() => filterPropsWithOn(props), [props]);
+    const inputId = useMemo(() => getUuid(), []);
+    const height = useMemo(() => {
+        var _a;
+        const height = (style === null || style === void 0 ? void 0 : style.height)
+            ? `${(_a = String(style.height)) === null || _a === void 0 ? void 0 : _a.replace(/(\d+(?:\.\d+)?)(%|rem)/g, '$1')}`
+            : '200px';
+        return height.includes('px') ? height : `${height}px`;
+    }, [style === null || style === void 0 ? void 0 : style.height]);
+    const size = useSize(props);
+    const textareaRef = useRef(null);
+    useImperativeHandle(ref, () => textareaRef.current, [textareaRef]);
+    const wrapRef = useRef(null);
+    const root = `${classPrefix}-${classRoot}`;
+    const inputWrap = `${classPrefix}-form-input-wrap`;
+    const textareaWrap = `${classPrefix}-form-code-editor-wrap`;
+    const cls = classNames(inputWrap, textareaWrap, `${root}`, `size-width-${size}`, `size-font-${size}`, {
+        'size-width-hundred': true,
+        'is-disabled': disabled && !readOnly,
+    });
+    /** 内部事件 */
+    const onChange = function (e) {
+        var _a;
+        const text = typeof e === 'string' ? e : e.target.value;
+        onChangeForm(text);
+        (_a = events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: text }, { originEvent: e });
+    };
+    // Widget API，挂载组件只读属性和组件方法
+    useSetWidgetApi(() => ({
+        ...innerHandle,
+        value,
+        format: async (params) => {
+            try {
+                let _value = value;
+                if (params.isCustomVal) {
+                    _value = params === null || params === void 0 ? void 0 : params.value;
+                }
+                const result = await format(_value);
+                onChangeForm(result);
+                return result;
+            }
+            catch (error) {
+                errorHandler({
+                    code: 'CodeEditorFormat',
+                    error,
+                    id: props.id,
+                });
+            }
+        },
+    }), [innerHandle, onChangeForm, props.id, value], ref);
+    useEffect(() => {
+        if (events === null || events === void 0 ? void 0 : events.ready) {
+            // eslint-disable-next-line rulesdir/no-trigger-event-in-effect
+            events === null || events === void 0 ? void 0 : events.ready();
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    const themeExtension = themeData[theme];
+    const languageExtension = loadLanguage(language);
+    return (visible && (_jsx(WdFormItem, { ...props, validateErrorMsg: validateErrorMsg, validateState: validateState, readOnly: false, disabled: disabled, readValue: value, classRoot: classRoot, inputId: inputId, layout: props.layout, children: _jsx("div", { className: cls, ref: wrapRef, onFocus: () => wrapRef.current.classList.add('is-focused'), onBlur: () => wrapRef.current.classList.remove('is-focused'), "data-color-mode": theme, children: _jsxs("div", { className: `${root}__content`, "data-testid": "wd-code-editor", children: [_jsx(CodeMirror, { value: value, height: height, extensions: [languageExtension], onChange: onChange, placeholder: placeholder, editable: !readOnly && !disabled, autoFocus: focus, theme: themeExtension }), _jsx("textarea", { id: inputId, ref: textareaRef, placeholder: placeholder, name: name, value: value, autoFocus: focus, disabled: disabled, readOnly: readOnly, onChange: onChange, spellCheck: false, ...startWithOnProps })] }) }) })));
+});

package/dist/web/components/wd-config-provider/index.d.ts

@@ -0,0 +1 @@
+export { ConfigProvider, type ConfigProviderProps } from './wd-config-provider';

package/dist/web/components/wd-config-provider/index.js

@@ -0,0 +1 @@
+export { ConfigProvider } from './wd-config-provider';

package/dist/web/components/wd-config-provider/wd-config-context.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const DEFAULT_CLASS_PREFIX: string;
+export interface Config {
+    /**
+     * 组件类名前缀
+     *
+     * @default "wd"
+     */
+    classPrefix?: string;
+}
+export declare const WdConfigContext: import("react").Context<Config>;

package/dist/web/components/wd-config-provider/wd-config-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/global-context';
+export const DEFAULT_CLASS_PREFIX = typeof WD_CLASS_PREFIX !== 'undefined' ? WD_CLASS_PREFIX : 'wd';
+export const WdConfigContext = createContext({
+    classPrefix: DEFAULT_CLASS_PREFIX,
+}, 'WdConfigContext');

package/dist/web/components/wd-config-provider/wd-config-provider.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Config } from './wd-config-context';
+export interface ConfigProviderProps extends Config {
+    children: React.ReactNode;
+}
+export declare function ConfigProvider({ children, ...configProps }: ConfigProviderProps): JSX.Element;

package/dist/web/components/wd-config-provider/wd-config-provider.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { WdConfigContext } from './wd-config-context';
+const configStore = {};
+export function ConfigProvider({ children, ...configProps }) {
+    useEffect(() => {
+        Object.assign(configStore, { ...configProps, ...configStore });
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [configProps.classPrefix]);
+    // props 优先级高于全局配置
+    const config = Object.assign({}, configStore, configProps);
+    return (_jsx(WdConfigContext.Provider, { value: config, children: children }));
+}

package/dist/web/components/wd-date/elements/Calendar.h5.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { IDatePickerOptions } from './interface';
+/**
+ * h5端 年月日-日历选择格式
+ */
+export declare const Calendar: React.ForwardRefExoticComponent<IDatePickerOptions & {
+    isWheelChange?: boolean;
+} & React.RefAttributes<any>>;