移动目录

mdui_patched/functions/alert.d.ts

@@ -0,0 +1,82 @@
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import type { Dialog } from '../components/dialog.js';
+interface Options {
+    /**
+     * alert 的标题
+     */
+    headline?: string;
+    /**
+     * alert 的描述文本
+     */
+    description?: string;
+    /**
+     * alert 顶部的 Material Icons 图标名
+     */
+    icon?: string;
+    /**
+     * 是否在按下 ESC 键时，关闭 alert
+     */
+    closeOnEsc?: boolean;
+    /**
+     * 是否在点击遮罩层时，关闭 alert
+     */
+    closeOnOverlayClick?: boolean;
+    /**
+     * 确认按钮的文本
+     */
+    confirmText?: string;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 alert。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 alert 函数，将在上一个 alert 关闭后才打开下一个 alert。
+     * `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
+     */
+    queue?: string;
+    /**
+     * 点击确认按钮时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * 默认点击确认按钮后会关闭 alert；若返回值为 `false`，则不关闭 alert；若返回值为 promise，则将在 promise 被 resolve 后，关闭 alert。
+     * @param dialog
+     */
+    onConfirm?: (dialog: Dialog) => void | boolean | Promise<void>;
+    /**
+     * alert 开始打开时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpen?: (dialog: Dialog) => void;
+    /**
+     * alert 打开动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpened?: (dialog: Dialog) => void;
+    /**
+     * alert 开始关闭时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClose?: (dialog: Dialog) => void;
+    /**
+     * alert 关闭动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClosed?: (dialog: Dialog) => void;
+    /**
+     * 点击遮罩层时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOverlayClick?: (dialog: Dialog) => void;
+}
+/**
+ * 打开一个 alert，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export declare const alert: (options: Options) => Promise<void>;
+export {};

mdui_patched/functions/alert.js

@@ -0,0 +1,81 @@
+import { msg } from '@lit/localize';
+import isPromise from 'is-promise';
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import { isUndefined, returnTrue } from '@mdui/jq/shared/helper.js';
+import { onLocaleReady, offLocaleReady } from '../internal/localize.js';
+import { dialog as openDialog } from './dialog.js';
+const getConfirmText = () => {
+    return msg('OK', {
+        id: 'functions.alert.confirmText',
+    });
+};
+/**
+ * 打开一个 alert，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export const alert = (options) => {
+    const mergedOptions = Object.assign({}, {
+        confirmText: getConfirmText(),
+        onConfirm: returnTrue,
+    }, options);
+    const properties = [
+        'headline',
+        'description',
+        'icon',
+        'closeOnEsc',
+        'closeOnOverlayClick',
+        'queue',
+        'onOpen',
+        'onOpened',
+        'onClose',
+        'onClosed',
+        'onOverlayClick',
+    ];
+    return new Promise((resolve, reject) => {
+        let isResolve = false;
+        const dialog = openDialog({
+            ...Object.fromEntries(properties
+                .filter((key) => !isUndefined(mergedOptions[key]))
+                .map((key) => [key, mergedOptions[key]])),
+            actions: [
+                {
+                    text: mergedOptions.confirmText,
+                    onClick: (dialog) => {
+                        const clickResult = mergedOptions.onConfirm.call(dialog, dialog);
+                        if (isPromise(clickResult)) {
+                            clickResult.then(() => {
+                                isResolve = true;
+                            });
+                        }
+                        else if (clickResult !== false) {
+                            isResolve = true;
+                        }
+                        return clickResult;
+                    },
+                },
+            ],
+        });
+        // 若未传入自定义文案，则监听 locale 变化更新文案
+        if (!options.confirmText) {
+            onLocaleReady(dialog, () => {
+                $(dialog).find('[slot="action"]').text(getConfirmText());
+            });
+        }
+        $(dialog).on('close', (e) => {
+            if (e.target === dialog) {
+                if (isResolve) {
+                    resolve();
+                }
+                else {
+                    reject();
+                }
+                offLocaleReady(dialog);
+            }
+        });
+    });
+};

mdui_patched/functions/breakpoint.d.ts

@@ -0,0 +1 @@
+export { breakpoint } from '@mdui/shared/helpers/breakpoint.js';

mdui_patched/functions/breakpoint.js

@@ -0,0 +1 @@
+export { breakpoint } from '@mdui/shared/helpers/breakpoint.js';

mdui_patched/functions/confirm.d.ts

@@ -0,0 +1,99 @@
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/first.js';
+import '@mdui/jq/methods/last.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import type { Dialog } from '../components/dialog.js';
+interface Options {
+    /**
+     * confirm 的标题
+     */
+    headline?: string;
+    /**
+     * confirm 的描述文本
+     */
+    description?: string;
+    /**
+     * confirm 顶部的 Material Icons 图标名
+     */
+    icon?: string;
+    /**
+     * 是否在按下 ESC 键时，关闭 confirm
+     */
+    closeOnEsc?: boolean;
+    /**
+     * 是否在点击遮罩层时，关闭 confirm
+     */
+    closeOnOverlayClick?: boolean;
+    /**
+     * 确认按钮的文本
+     */
+    confirmText?: string;
+    /**
+     * 取消按钮的文本
+     */
+    cancelText?: string;
+    /**
+     * 是否垂直排列底部操作按钮
+     */
+    stackedActions?: boolean;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 confirm。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 confirm 函数，将在上一个 confirm 关闭后才打开下一个 confirm。
+     * `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
+     */
+    queue?: string;
+    /**
+     * 点击确认按钮时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * 默认点击确认按钮后会关闭 confirm；若返回值为 `false`，则不关闭 confirm；若返回值为 promise，则将在 promise 被 resolve 后，关闭 confirm。
+     * @param dialog
+     */
+    onConfirm?: (dialog: Dialog) => void | boolean | Promise<void>;
+    /**
+     * 点击取消按钮时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * 默认点击确认按钮后会关闭 confirm；若返回值为 `false`，则不关闭 confirm；若返回值为 promise，则将在 promise 被 resolve 后，关闭 confirm。
+     * @param dialog
+     */
+    onCancel?: (dialog: Dialog) => void | boolean | Promise<void>;
+    /**
+     * confirm 开始打开时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpen?: (dialog: Dialog) => void;
+    /**
+     * confirm 打开动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpened?: (dialog: Dialog) => void;
+    /**
+     * confirm 开始关闭时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClose?: (dialog: Dialog) => void;
+    /**
+     * confirm 关闭动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClosed?: (dialog: Dialog) => void;
+    /**
+     * 点击遮罩层时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOverlayClick?: (dialog: Dialog) => void;
+}
+/**
+ * 打开一个 confirm，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export declare const confirm: (options: Options) => Promise<void>;
+export {};

mdui_patched/functions/confirm.js

@@ -0,0 +1,102 @@
+import { msg } from '@lit/localize';
+import isPromise from 'is-promise';
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/first.js';
+import '@mdui/jq/methods/last.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import { isUndefined, returnTrue } from '@mdui/jq/shared/helper.js';
+import { onLocaleReady, offLocaleReady } from '../internal/localize.js';
+import { dialog as openDialog } from './dialog.js';
+const getConfirmText = () => {
+    return msg('OK', {
+        id: 'functions.confirm.confirmText',
+    });
+};
+const getCancelText = () => {
+    return msg('Cancel', {
+        id: 'functions.confirm.cancelText',
+    });
+};
+/**
+ * 打开一个 confirm，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export const confirm = (options) => {
+    const mergedOptions = Object.assign({}, {
+        confirmText: getConfirmText(),
+        cancelText: getCancelText(),
+        onConfirm: returnTrue,
+        onCancel: returnTrue,
+    }, options);
+    const properties = [
+        'headline',
+        'description',
+        'icon',
+        'closeOnEsc',
+        'closeOnOverlayClick',
+        'stackedActions',
+        'queue',
+        'onOpen',
+        'onOpened',
+        'onClose',
+        'onClosed',
+        'onOverlayClick',
+    ];
+    return new Promise((resolve, reject) => {
+        let isResolve = false;
+        const dialog = openDialog({
+            ...Object.fromEntries(properties
+                .filter((key) => !isUndefined(mergedOptions[key]))
+                .map((key) => [key, mergedOptions[key]])),
+            actions: [
+                {
+                    text: mergedOptions.cancelText,
+                    onClick: (dialog) => {
+                        return mergedOptions.onCancel.call(dialog, dialog);
+                    },
+                },
+                {
+                    text: mergedOptions.confirmText,
+                    onClick: (dialog) => {
+                        const clickResult = mergedOptions.onConfirm.call(dialog, dialog);
+                        if (isPromise(clickResult)) {
+                            clickResult.then(() => {
+                                isResolve = true;
+                            });
+                        }
+                        else if (clickResult !== false) {
+                            isResolve = true;
+                        }
+                        return clickResult;
+                    },
+                },
+            ],
+        });
+        // 若未传入自定义文案，则监听 locale 变化更新文案
+        if (!options.confirmText) {
+            onLocaleReady(dialog, () => {
+                $(dialog).find('[slot="action"]').last().text(getConfirmText());
+            });
+        }
+        if (!options.cancelText) {
+            onLocaleReady(dialog, () => {
+                $(dialog).find('[slot="action"]').first().text(getCancelText());
+            });
+        }
+        $(dialog).on('close', (e) => {
+            if (e.target === dialog) {
+                if (isResolve) {
+                    resolve();
+                }
+                else {
+                    reject();
+                }
+                offLocaleReady(dialog);
+            }
+        });
+    });
+};

mdui_patched/functions/dialog.d.ts

@@ -0,0 +1,97 @@
+import '@mdui/jq/methods/append.js';
+import '@mdui/jq/methods/appendTo.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/remove.js';
+import '../components/button.js';
+import { Dialog } from '../components/dialog.js';
+import type { JQ } from '@mdui/jq/shared/core.js';
+interface Action {
+    /**
+     * 按钮文本
+     */
+    text: string;
+    /**
+     * 点击按钮时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * 默认点击按钮后会关闭 dialog；若返回值为 false，则不关闭 dialog；若返回值为 promise，则将在 promise 被 resolve 后，关闭 dialog。
+     * @param dialog
+     */
+    onClick?: (dialog: Dialog) => void | boolean | Promise<void>;
+}
+interface Options {
+    /**
+     * dialog 的标题
+     */
+    headline?: string;
+    /**
+     * dialog 的描述文本
+     */
+    description?: string;
+    /**
+     * dialog 中的 body 内容，可以是 HTML 字符串、DOM 元素、或 JQ 对象
+     */
+    body?: string | HTMLElement | JQ<HTMLElement>;
+    /**
+     * dialog 顶部的 Material Icons 图标名
+     */
+    icon?: string;
+    /**
+     * 是否在按下 ESC 键时，关闭 dialog
+     */
+    closeOnEsc?: boolean;
+    /**
+     * 是否在点击遮罩层时，关闭 dialog
+     */
+    closeOnOverlayClick?: boolean;
+    /**
+     * 底部操作按钮数组
+     */
+    actions?: Action[];
+    /**
+     * 是否垂直排列底部操作按钮
+     */
+    stackedActions?: boolean;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 dialog。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 dialog 函数，将在上一个 dialog 关闭后才打开下一个 dialog。
+     * `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
+     */
+    queue?: string;
+    /**
+     * dialog 开始打开时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpen?: (dialog: Dialog) => void;
+    /**
+     * dialog 打开动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpened?: (dialog: Dialog) => void;
+    /**
+     * dialog 开始关闭时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClose?: (dialog: Dialog) => void;
+    /**
+     * dialog 关闭动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClosed?: (dialog: Dialog) => void;
+    /**
+     * 点击遮罩层时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOverlayClick?: (dialog: Dialog) => void;
+}
+/**
+ * 打开一个 dialog，返回 dialog 实例
+ * @param options
+ */
+export declare const dialog: (options: Options) => Dialog;
+export {};

mdui_patched/functions/dialog.js

@@ -0,0 +1,105 @@
+import isPromise from 'is-promise';
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/append.js';
+import '@mdui/jq/methods/appendTo.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/remove.js';
+import { returnTrue, toKebabCase } from '@mdui/jq/shared/helper.js';
+import { dequeue, queue } from '@mdui/shared/helpers/queue.js';
+import '../components/button.js';
+import { Dialog } from '../components/dialog.js';
+const defaultAction = {
+    onClick: returnTrue,
+};
+const queueName = 'mdui.functions.dialog.';
+let currentDialog = undefined;
+/**
+ * 打开一个 dialog，返回 dialog 实例
+ * @param options
+ */
+export const dialog = (options) => {
+    const dialog = new Dialog();
+    const $dialog = $(dialog);
+    const properties = [
+        'headline',
+        'description',
+        'icon',
+        'closeOnEsc',
+        'closeOnOverlayClick',
+        'stackedActions',
+    ];
+    const callbacks = ['onOpen', 'onOpened', 'onClose', 'onClosed', 'onOverlayClick'];
+    Object.entries(options).forEach(([key, value]) => {
+        // @ts-ignore
+        if (properties.includes(key)) {
+            // @ts-ignore
+            dialog[key] = value;
+            // @ts-ignore
+        }
+        else if (callbacks.includes(key)) {
+            const eventName = toKebabCase(key.slice(2));
+            $dialog.on(eventName, (e) => {
+                if (e.target === dialog) {
+                    value.call(dialog, dialog);
+                }
+            });
+        }
+    });
+    if (options.body) {
+        $dialog.append(options.body);
+    }
+    if (options.actions) {
+        options.actions.forEach((action) => {
+            const mergedAction = Object.assign({}, defaultAction, action);
+            $(`<mdui-button
+        slot="action"
+        variant="text"
+      >${mergedAction.text}</mdui-button>`)
+                .appendTo($dialog)
+                .on('click', function () {
+                const clickResult = mergedAction.onClick.call(dialog, dialog);
+                if (isPromise(clickResult)) {
+                    this.loading = true;
+                    clickResult
+                        .then(() => {
+                        dialog.open = false;
+                    })
+                        .finally(() => {
+                        this.loading = false;
+                    });
+                }
+                else if (clickResult !== false) {
+                    dialog.open = false;
+                }
+            });
+        });
+    }
+    $dialog.appendTo('body').on('closed', (e) => {
+        if (e.target !== dialog) {
+            return;
+        }
+        $dialog.remove();
+        if (options.queue) {
+            currentDialog = undefined;
+            dequeue(queueName + options.queue);
+        }
+    });
+    if (!options.queue) {
+        setTimeout(() => {
+            dialog.open = true;
+        });
+    }
+    else if (currentDialog) {
+        queue(queueName + options.queue, () => {
+            dialog.open = true;
+            currentDialog = dialog;
+        });
+    }
+    else {
+        setTimeout(() => {
+            dialog.open = true;
+        });
+        currentDialog = dialog;
+    }
+    return dialog;
+};

mdui_patched/functions/getColorFromImage.d.ts

@@ -0,0 +1,7 @@
+import type { JQ } from '@mdui/jq/shared/core.js';
+/**
+ * 根据指定的图片，提取出主色调的十六进制颜色值
+ * @param image `<img>` 元素的 CSS 选择器、或 `<img>` 元素、或 JQ 对象
+ * @return string 十六进制颜色值。例如：`#ff0000`
+ */
+export declare const getColorFromImage: (image: string | HTMLImageElement | JQ<HTMLImageElement>) => Promise<string>;

mdui_patched/functions/getColorFromImage.js

@@ -0,0 +1,12 @@
+import { sourceColorFromImage, hexFromArgb, } from '@material/material-color-utilities';
+import { $ } from '@mdui/jq/$.js';
+/**
+ * 根据指定的图片，提取出主色调的十六进制颜色值
+ * @param image `<img>` 元素的 CSS 选择器、或 `<img>` 元素、或 JQ 对象
+ * @return string 十六进制颜色值。例如：`#ff0000`
+ */
+export const getColorFromImage = async (image) => {
+    const $image = $(image);
+    const source = await sourceColorFromImage($image[0]);
+    return hexFromArgb(source);
+};

mdui_patched/functions/getLocale.d.ts

@@ -0,0 +1,6 @@
+import type { GetLocal } from '../internal/localize.js';
+/**
+ * 获取当前的语言代码。如果当前正在加载新的语言包，则该函数仍返回先前的语言代码
+ * @return string 当前的语言代码
+ */
+export declare const getLocale: GetLocal;

mdui_patched/functions/getLocale.js

@@ -0,0 +1,11 @@
+import { getLocale as getLocaleInternal, uninitializedError, } from '../internal/localize.js';
+/**
+ * 获取当前的语言代码。如果当前正在加载新的语言包，则该函数仍返回先前的语言代码
+ * @return string 当前的语言代码
+ */
+export const getLocale = () => {
+    if (!getLocaleInternal) {
+        throw new Error(uninitializedError);
+    }
+    return getLocaleInternal();
+};

mdui_patched/functions/getTheme.d.ts

@@ -0,0 +1,10 @@
+import type { Theme } from '../internal/theme.js';
+import type { JQ } from '@mdui/jq/shared/core.js';
+/**
+ * 获取在指定元素上设置的主题。
+ * 未传入参数时，默认获取 `<html>` 元素上的主题。
+ * 元素上未设置过主题时，默认返回 `light`。
+ * @param target 获取该元素上的主题。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ * @return Theme 当前主题，值为 `light`、`dark` 或 `auto`
+ */
+export declare const getTheme: (target?: string | HTMLElement | JQ<HTMLElement>) => Theme;

mdui_patched/functions/getTheme.js

@@ -0,0 +1,16 @@
+import { $ } from '@mdui/jq/$.js';
+/**
+ * 获取在指定元素上设置的主题。
+ * 未传入参数时，默认获取 `<html>` 元素上的主题。
+ * 元素上未设置过主题时，默认返回 `light`。
+ * @param target 获取该元素上的主题。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ * @return Theme 当前主题，值为 `light`、`dark` 或 `auto`
+ */
+export const getTheme = (target = document.documentElement) => {
+    const element = $(target)[0];
+    const themes = ['light', 'dark', 'auto'];
+    const prefix = 'mdui-theme-';
+    return (Array.from(element.classList)
+        .find((className) => themes.map((theme) => prefix + theme).includes(className))
+        ?.slice(prefix.length) ?? 'light');
+};

mdui_patched/functions/loadLocale.d.ts

@@ -0,0 +1,6 @@
+import type { LoadFunc } from '../internal/localize.js';
+/**
+ * 加载语言包。参数为一个函数，该函数接收一个语言代码作为参数，返回一个 Promise，resolve 的值为对应的语言包
+ * @param loadFunc
+ */
+export declare const loadLocale: (loadFunc: LoadFunc) => void;

mdui_patched/functions/loadLocale.js

@@ -0,0 +1,8 @@
+import { initializeLocalize } from '../internal/localize.js';
+/**
+ * 加载语言包。参数为一个函数，该函数接收一个语言代码作为参数，返回一个 Promise，resolve 的值为对应的语言包
+ * @param loadFunc
+ */
+export const loadLocale = (loadFunc) => {
+    initializeLocalize(loadFunc);
+};

mdui_patched/functions/observeResize.d.ts

@@ -0,0 +1,2 @@
+export { observeResize } from '@mdui/shared/helpers/observeResize.js';
+export type { ObserveResize } from '@mdui/shared/helpers/observeResize.js';

mdui_patched/functions/observeResize.js

@@ -0,0 +1 @@
+export { observeResize } from '@mdui/shared/helpers/observeResize.js';

mdui_patched/functions/prompt.d.ts

@@ -0,0 +1,114 @@
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/first.js';
+import '@mdui/jq/methods/last.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import { TextField } from '../components/text-field.js';
+import type { Dialog } from '../components/dialog.js';
+interface Options {
+    /**
+     * prompt 的标题
+     */
+    headline?: string;
+    /**
+     * prompt 的描述文本
+     */
+    description?: string;
+    /**
+     * prompt 顶部的 Material Icons 图标名
+     */
+    icon?: string;
+    /**
+     * 是否在按下 ESC 键时，关闭 prompt
+     */
+    closeOnEsc?: boolean;
+    /**
+     * 是否在点击遮罩层时，关闭 prompt
+     */
+    closeOnOverlayClick?: boolean;
+    /**
+     * 确认按钮的文本
+     */
+    confirmText?: string;
+    /**
+     * 取消按钮的文本
+     */
+    cancelText?: string;
+    /**
+     * 是否垂直排列底部操作按钮
+     */
+    stackedActions?: boolean;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 prompt。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 prompt 函数，将在上一个 prompt 关闭后才打开下一个 prompt。
+     * `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
+     */
+    queue?: string;
+    /**
+     * 点击确认按钮时的回调函数。
+     * 函数参数为输入框的值和 dialog 实例，`this` 指向 dialog 实例。
+     * 默认点击确认按钮后会关闭 prompt；若返回值为 `false`，则不关闭 prompt；若返回值为 promise，则将在 promise 被 resolve 后，关闭 prompt。
+     * @param value
+     * @param dialog
+     */
+    onConfirm?: (value: string, dialog: Dialog) => void | boolean | Promise<void>;
+    /**
+     * 点击取消按钮时的回调函数。
+     * 函数参数为输入框的值和 dialog 实例，`this` 指向 dialog 实例。
+     * 默认点击取消按钮后会关闭 prompt；若返回值为 `false`，则不关闭 prompt；若返回值为 promise，则将在 promise 被 resolve 后，关闭 prompt。
+     * @param dialog
+     */
+    onCancel?: (value: string, dialog: Dialog) => void | boolean | Promise<void>;
+    /**
+     * prompt 开始打开时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpen?: (dialog: Dialog) => void;
+    /**
+     * prompt 打开动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOpened?: (dialog: Dialog) => void;
+    /**
+     * prompt 开始关闭时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClose?: (dialog: Dialog) => void;
+    /**
+     * prompt 关闭动画完成时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onClosed?: (dialog: Dialog) => void;
+    /**
+     * 点击遮罩层时的回调函数。
+     * 函数参数为 dialog 实例，`this` 也指向 dialog 实例。
+     * @param dialog
+     */
+    onOverlayClick?: (dialog: Dialog) => void;
+    /**
+     * 输入框的校验函数，参数为输入框的值。`this` 指向 TextField 实例。
+     * 将在浏览器原生验证 API 验证通过后，再使用该函数进行验证。
+     * 可以返回 `boolean` 值，为 `false` 时表示验证未通过，为 `true` 时表示验证通过。
+     * 也可以返回字符串，字符串不为空时表示验证未通过，同时返回的字符串将用作错误提示。
+     * 也可以返回 Promise，被 resolve 表示验证通过，被 reject 表示验证未通过，同时拒绝原因将用作错误提示。
+     * @param value
+     */
+    validator?: (value: string) => boolean | string | Promise<void>;
+    /**
+     * prompt 内部的输入框为 `<mdui-text-field>` 组件。可在该参数中设置 `<mdui-text-field>` 组件的参数。
+     */
+    textFieldOptions?: Partial<TextField>;
+}
+/**
+ * 打开一个 prompt，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve，resolve 的参数为输入框的值；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export declare const prompt: (options: Options) => Promise<string>;
+export {};

mdui_patched/functions/prompt.js

@@ -0,0 +1,137 @@
+import { msg } from '@lit/localize';
+import isPromise from 'is-promise';
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/find.js';
+import '@mdui/jq/methods/first.js';
+import '@mdui/jq/methods/last.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/text.js';
+import { isBoolean, isString, isUndefined, returnTrue, } from '@mdui/jq/shared/helper.js';
+import { TextField } from '../components/text-field.js';
+import { onLocaleReady, offLocaleReady } from '../internal/localize.js';
+import { dialog as openDialog } from './dialog.js';
+const getConfirmText = () => {
+    return msg('OK', {
+        id: 'functions.prompt.confirmText',
+    });
+};
+const getCancelText = () => {
+    return msg('Cancel', {
+        id: 'functions.prompt.cancelText',
+    });
+};
+/**
+ * 打开一个 prompt，返回 Promise。
+ * 如果是通过点击确定按钮关闭，则返回的 promise 会被 resolve，resolve 的参数为输入框的值；
+ * 如果是通过其他方式关闭，则返回的 promise 会被 reject。
+ * @param options
+ */
+export const prompt = (options) => {
+    const mergedOptions = Object.assign({}, {
+        confirmText: getConfirmText(),
+        cancelText: getCancelText(),
+        onConfirm: returnTrue,
+        onCancel: returnTrue,
+        validator: returnTrue,
+        textFieldOptions: {},
+    }, options);
+    const properties = [
+        'headline',
+        'description',
+        'icon',
+        'closeOnEsc',
+        'closeOnOverlayClick',
+        'stackedActions',
+        'queue',
+        'onOpen',
+        'onOpened',
+        'onClose',
+        'onClosed',
+        'onOverlayClick',
+    ];
+    const textField = new TextField();
+    Object.entries(mergedOptions.textFieldOptions).forEach(([key, value]) => {
+        // @ts-ignore
+        textField[key] = value;
+    });
+    return new Promise((resolve, reject) => {
+        let isResolve = false;
+        const dialog = openDialog({
+            ...Object.fromEntries(properties
+                .filter((key) => !isUndefined(mergedOptions[key]))
+                .map((key) => [key, mergedOptions[key]])),
+            body: textField,
+            actions: [
+                {
+                    text: mergedOptions.cancelText,
+                    onClick: (dialog) => {
+                        return mergedOptions.onCancel.call(dialog, textField.value, dialog);
+                    },
+                },
+                {
+                    text: mergedOptions.confirmText,
+                    onClick: (dialog) => {
+                        const onConfirm = () => {
+                            const clickResult = mergedOptions.onConfirm.call(dialog, textField.value, dialog);
+                            if (isPromise(clickResult)) {
+                                clickResult.then(() => {
+                                    isResolve = true;
+                                });
+                            }
+                            else if (clickResult !== false) {
+                                isResolve = true;
+                            }
+                            return clickResult;
+                        };
+                        // 原生验证
+                        textField.setCustomValidity('');
+                        if (!textField.reportValidity()) {
+                            return false;
+                        }
+                        // validator 函数验证
+                        const validateResult = mergedOptions.validator.call(textField, textField.value);
+                        if (isBoolean(validateResult) && !validateResult) {
+                            textField.setCustomValidity(' ');
+                            return false;
+                        }
+                        if (isString(validateResult)) {
+                            textField.setCustomValidity(validateResult);
+                            return false;
+                        }
+                        if (isPromise(validateResult)) {
+                            return new Promise((resolve, reject) => {
+                                validateResult.then(resolve).catch((reason) => {
+                                    textField.setCustomValidity(reason);
+                                    reject(reason);
+                                });
+                            });
+                        }
+                        return onConfirm();
+                    },
+                },
+            ],
+        });
+        // 若未传入自定义文案，则监听 locale 变化更新文案
+        if (!options.confirmText) {
+            onLocaleReady(dialog, () => {
+                $(dialog).find('[slot="action"]').last().text(getConfirmText());
+            });
+        }
+        if (!options.cancelText) {
+            onLocaleReady(dialog, () => {
+                $(dialog).find('[slot="action"]').first().text(getCancelText());
+            });
+        }
+        $(dialog).on('close', (e) => {
+            if (e.target === dialog) {
+                if (isResolve) {
+                    resolve(textField.value);
+                }
+                else {
+                    reject();
+                }
+                offLocaleReady(dialog);
+            }
+        });
+    });
+};

mdui_patched/functions/removeColorScheme.d.ts

@@ -0,0 +1,6 @@
+import type { JQ } from '@mdui/jq/shared/core.js';
+/**
+ * 移除指定元素上的配色方案
+ * @param target 要移除配色方案的元素。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ */
+export declare const removeColorScheme: (target?: string | HTMLElement | JQ<HTMLElement>) => void;

mdui_patched/functions/removeColorScheme.js

@@ -0,0 +1,8 @@
+import { remove } from '../internal/colorScheme.js';
+/**
+ * 移除指定元素上的配色方案
+ * @param target 要移除配色方案的元素。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ */
+export const removeColorScheme = (target = document.documentElement) => {
+    remove(target);
+};

mdui_patched/functions/setColorScheme.d.ts

@@ -0,0 +1,15 @@
+import type { CustomColor } from '../internal/colorScheme.js';
+import type { JQ } from '@mdui/jq/shared/core.js';
+/**
+ * 在指定元素上设置配色方案
+ * @param hex 十六进制颜色值，如 #f82506
+ * @param options
+ * @param options.target 要设置配色方案的元素。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ * @param options.customColors 自定义颜色数组
+ * @param options.customColors[].name 自定义颜色名
+ * @param options.customColors[].value 自定义十六进制颜色值，如 #f82506
+ */
+export declare const setColorScheme: (hex: string, options?: {
+    target?: string | HTMLElement | JQ<HTMLElement>;
+    customColors?: CustomColor[];
+}) => void;

mdui_patched/functions/setColorScheme.js

@@ -0,0 +1,15 @@
+import { argbFromHex } from '@material/material-color-utilities';
+import { setFromSource } from '../internal/colorScheme.js';
+/**
+ * 在指定元素上设置配色方案
+ * @param hex 十六进制颜色值，如 #f82506
+ * @param options
+ * @param options.target 要设置配色方案的元素。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ * @param options.customColors 自定义颜色数组
+ * @param options.customColors[].name 自定义颜色名
+ * @param options.customColors[].value 自定义十六进制颜色值，如 #f82506
+ */
+export const setColorScheme = (hex, options) => {
+    const source = argbFromHex(hex);
+    setFromSource(source, options);
+};

mdui_patched/functions/setLocale.d.ts

@@ -0,0 +1,6 @@
+import type { SetLocal } from '../internal/localize.js';
+/**
+ * 切换到指定的语言。返回 Promise，在新的语言包加载完成后 resolve
+ * @param locale 语言代码
+ */
+export declare const setLocale: SetLocal;

mdui_patched/functions/setLocale.js

@@ -0,0 +1,11 @@
+import { setLocale as setLocaleInternal, uninitializedError, } from '../internal/localize.js';
+/**
+ * 切换到指定的语言。返回 Promise，在新的语言包加载完成后 resolve
+ * @param locale 语言代码
+ */
+export const setLocale = (locale) => {
+    if (!setLocaleInternal) {
+        throw new Error(uninitializedError);
+    }
+    return setLocaleInternal(locale);
+};

mdui_patched/functions/setTheme.d.ts

@@ -0,0 +1,10 @@
+import '@mdui/jq/methods/addClass.js';
+import '@mdui/jq/methods/removeClass.js';
+import type { Theme } from '../internal/theme.js';
+import type { JQ } from '@mdui/jq/shared/core.js';
+/**
+ * 在当前页面、或指定元素上设置主题。
+ * @param theme 要设置的主题。值为 `light`、`dark` 或 `auto`
+ * @param target 在该元素上设置主题。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ */
+export declare const setTheme: (theme: Theme, target?: string | HTMLElement | JQ<HTMLElement>) => void;

mdui_patched/functions/setTheme.js

@@ -0,0 +1,16 @@
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/addClass.js';
+import '@mdui/jq/methods/removeClass.js';
+/**
+ * 在当前页面、或指定元素上设置主题。
+ * @param theme 要设置的主题。值为 `light`、`dark` 或 `auto`
+ * @param target 在该元素上设置主题。可以是 CSS 选择器、DOM 元素、或 JQ 对象。默认为 `<html>` 元素
+ */
+export const setTheme = (theme, target = document.documentElement) => {
+    const $target = $(target);
+    const themes = ['light', 'dark', 'auto'];
+    const prefix = 'mdui-theme-';
+    $target
+        .removeClass(themes.map((theme) => prefix + theme).join(' '))
+        .addClass(prefix + theme);
+};

mdui_patched/functions/snackbar.d.ts

@@ -0,0 +1,91 @@
+import '@mdui/jq/methods/appendTo.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/remove.js';
+import { Snackbar } from '../components/snackbar.js';
+interface Options {
+    /**
+     * Snackbar 中的消息文本内容
+     */
+    message: string;
+    /**
+     * Snackbar 出现的位置。默认为 `bottom`。可选值为：
+     * * `top`：位于顶部，居中对齐
+     * * `top-start`：位于顶部，左对齐
+     * * `top-end`：位于顶部，右对齐
+     * * `bottom`：位于底部，居中对齐
+     * * `bottom-start`：位于底部，左对齐
+     * * `bottom-end`：位于底部，右对齐
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
+    /**
+     * 操作按钮的文本
+     */
+    action?: string;
+    /**
+     * 是否在右侧显示关闭按钮
+     */
+    closeable?: boolean;
+    /**
+     * 消息文本最多显示几行。默认不限制行数。可选值为
+     * * `1`：消息文本最多显示一行
+     * * `2`：消息文本最多显示两行
+     */
+    messageLine?: 1 | 2;
+    /**
+     * 在多长时间后自动关闭（单位为毫秒）。设置为 0 时，不自动关闭。默认为 5 秒后自动关闭。
+     */
+    autoCloseDelay?: number;
+    /**
+     * 点击或触摸 Snackbar 以外的区域时是否关闭 Snackbar
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 snackbar。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 snackbar 函数，将在上一个 snackbar 关闭后才打开下一个 snackbar。
+     */
+    queue?: string;
+    /**
+     * 点击 Snackbar 时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClick?: (snackbar: Snackbar) => void;
+    /**
+     * 点击操作按钮时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * 默认点击后会关闭 snackbar；若返回值为 false，则不关闭 snackbar；若返回值为 promise，则将在 promise 被 resolve 后，关闭 snackbar。
+     * @param snackbar
+     */
+    onActionClick?: (snackbar: Snackbar) => void | boolean | Promise<void>;
+    /**
+     * Snackbar 开始显示时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onOpen?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 显示动画完成时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onOpened?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 开始隐藏时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClose?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 隐藏动画完成时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClosed?: (snackbar: Snackbar) => void;
+}
+/**
+ * 打开一个 Snackbar
+ * @param options
+ */
+export declare const snackbar: (options: Options) => Snackbar;
+export {};

mdui_patched/functions/snackbar.js

@@ -0,0 +1,89 @@
+import isPromise from 'is-promise';
+import { $ } from '@mdui/jq/$.js';
+import '@mdui/jq/methods/appendTo.js';
+import '@mdui/jq/methods/on.js';
+import '@mdui/jq/methods/remove.js';
+import { returnTrue, toKebabCase } from '@mdui/jq/shared/helper.js';
+import { dequeue, queue } from '@mdui/shared/helpers/queue.js';
+import { Snackbar } from '../components/snackbar.js';
+const queueName = 'mdui.functions.snackbar.';
+let currentSnackbar = undefined;
+/**
+ * 打开一个 Snackbar
+ * @param options
+ */
+export const snackbar = (options) => {
+    const snackbar = new Snackbar();
+    const $snackbar = $(snackbar);
+    Object.entries(options).forEach(([key, value]) => {
+        if (key === 'message') {
+            snackbar.innerHTML = value;
+        }
+        else if ([
+            'onClick',
+            'onActionClick',
+            'onOpen',
+            'onOpened',
+            'onClose',
+            'onClosed',
+        ].includes(key)) {
+            const eventName = toKebabCase(key.slice(2));
+            $snackbar.on(eventName, (e) => {
+                if (e.target !== snackbar) {
+                    return;
+                }
+                if (key === 'onActionClick') {
+                    const actionClick = (options.onActionClick ?? returnTrue).call(snackbar, snackbar);
+                    if (isPromise(actionClick)) {
+                        snackbar.actionLoading = true;
+                        actionClick
+                            .then(() => {
+                            snackbar.open = false;
+                        })
+                            .finally(() => {
+                            snackbar.actionLoading = false;
+                        });
+                    }
+                    else if (actionClick !== false) {
+                        snackbar.open = false;
+                    }
+                }
+                else {
+                    value.call(snackbar, snackbar);
+                }
+            });
+        }
+        else {
+            // @ts-ignore
+            snackbar[key] = value;
+        }
+    });
+    $snackbar.appendTo('body').on('closed', (e) => {
+        if (e.target !== snackbar) {
+            return;
+        }
+        $snackbar.remove();
+        if (options.queue) {
+            currentSnackbar = undefined;
+            dequeue(queueName + options.queue);
+        }
+    });
+    if (!options.queue) {
+        setTimeout(() => {
+            snackbar.open = true;
+        });
+    }
+    else if (currentSnackbar) {
+        queue(queueName + options.queue, () => {
+            snackbar.open = true;
+            currentSnackbar = snackbar;
+        });
+    }
+    else {
+        setTimeout(() => {
+            snackbar.open = true;
+        });
+        currentSnackbar = snackbar;
+    }
+    return snackbar;
+};

mdui_patched/functions/throttle.d.ts

@@ -0,0 +1 @@
+export { throttle } from '@mdui/shared/helpers/throttle.js';

mdui_patched/functions/throttle.js

@@ -0,0 +1 @@
+export { throttle } from '@mdui/shared/helpers/throttle.js';