@tuya/miniapp-smart-ui 2.13.5-beta-0

package/lib/dialog/README.md

@@ -0,0 +1,412 @@
+---
+category: 反馈
+---
+
+# Dialog 弹出框
+
+### 介绍
+
+弹出模态框，常用于消息提示、消息确认，或在当前页面内完成特定的交互操作，支持函数调用和组件调用两种方式。
+
+### 引入
+
+在`app.json`或`index.json`中引入组件，详细介绍见[快速上手](/material/smartui?comId=help-getting-started&appType=miniapp)。
+
+```json
+"usingComponents": {
+  "smart-dialog": "@tuya/miniapp-smart-ui/lib/dialog/index"
+}
+```
+
+## 代码演示
+
+### 消息提示
+
+用于提示一些消息，只包含一个确认按钮。
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+
+DialogInstance.alert({
+  title: '标题',
+  message: '弹窗内容',
+}).then(() => {
+  // on close
+});
+
+DialogInstance.alert({
+  message: '弹窗内容',
+}).then(() => {
+  // on close
+});
+```
+
+### 消息确认
+
+用于确认消息，包含取消和确认按钮。
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+
+DialogInstance.confirm({
+  title: '标题',
+  message: '弹窗内容',
+})
+  .then(() => {
+    // on confirm
+  })
+  .catch(() => {
+    // on cancel
+  });
+```
+
+### 输入框
+
+用于输入文案信息，此时默认最大输入限制`maxlength`是`20`;`emptyDisabled` `v2.7.0` 属性可以限制输入框内为空时无法提交。
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+
+const beforeClose = (action: 'confirm' | 'cancel' | 'overlay', value?: string): Promise<boolean> => {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      if (action === 'confirm') {
+        // 不存在输入值则拦截确认操作
+        resolve(!!value);
+      } else {
+        resolve(true);
+      }
+    }, 1000);
+  });
+}    
+
+DialogInstance.input({
+  title: 'Title',
+  value: '',
+  beforeClose,
+  emptyDisabled: true,
+  cancelButtonText: 'Sub Action',
+})
+  .then((res) => {
+    console.log('=== onConfirm', res);
+    const inputValue = res?.data?.inputValue;
+  })
+  .catch(() => {
+    // on cancel
+  });
+```
+
+### 圆角按钮风格
+
+将 theme 选项设置为 `round-button` 可以展示圆角按钮风格的弹窗。
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+
+DialogInstance.alert({
+  title: '标题',
+  message: '弹窗内容',
+  theme: 'round-button',
+}).then(() => {
+  // on close
+});
+
+DialogInstance.alert({
+  message: '弹窗内容',
+  theme: 'round-button',
+}).then(() => {
+  // on close
+});
+```
+
+### 异步关闭
+
+通过 `beforeClose` 属性可以传入一个回调函数，在弹窗关闭前进行特定操作。
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+
+const beforeClose = (action) =>
+  new Promise((resolve) => {
+    setTimeout(() => {
+      if (action === 'confirm') {
+        resolve(true);
+      } else {
+        // 拦截取消操作
+        resolve(false);
+      }
+    }, 1000);
+  });
+
+DialogInstance.confirm({
+  title: '标题',
+  message: '弹窗内容',
+  beforeClose,
+});
+```
+
+### 自定义图标 `v2.6.3`
+
+icon 属性支持传入svg string，底层用的是 SmartUI 的 Icon 组件，icon 属性就是传入name属性到icon组件上
+
+```html
+<smart-dialog id="smart-dialog" />
+```
+
+```javascript
+import DialogInstance from '@tuya/miniapp-smart-ui/dialog/dialog';
+import AlarmIcon from '@tuya-miniapp/icons/dist/svg/Alarm';
+
+DialogInstance.confirm({
+  context: this,
+  title: 'Title',
+  icon: AlarmIcon,
+  iconColor: '#1989fa',
+  iconSize: '36px',
+  message: 'Body',
+  cancelButtonText: 'Sub Action',
+  confirmButtonText: '确认',
+}).then(() => {
+  // on close
+});
+```
+
+### 组件调用
+
+如果需要在弹窗内嵌入组件或其他自定义内容，可以使用组件调用的方式。
+
+```html
+<smart-dialog
+  use-slot
+  title="标题"
+  show="{{ show }}"
+  show-cancel-button
+  confirm-button-open-type="getUserInfo"
+  bind:close="onClose"
+  bind:getuserinfo="getUserInfo"
+>
+  <image src="https://static1.tuyacn.com/static/tuya-miniapp-doc/_next/static/images/logo-small.png" />
+</smart-dialog>
+```
+
+```js
+Page({
+  data: {
+    show: true,
+  },
+
+  getUserInfo(event) {
+    console.log(event.detail);
+  },
+
+  onClose(event) {
+    if(event.detail === 'confirm') {
+      this.setData({
+        show: false,
+      });
+    }
+  },
+});
+```
+
+### 自定义样式
+
+如果需要自定义样式，建议使用 `custom-class` 实现，不在推荐 `className` 属性（在自定义组件中使用并不会生效），使用方法如下
+
+#### 组件调用
+
+```html
+<smart-dialog
+  title="标题"
+  message="弹窗内容"
+  show="{{ show }}"
+  custom-class="my-custom-class"
+/>
+```
+
+#### API 调用
+
+```html
+<smart-dialog id="smart-dialog" custom-class="my-custom-class" />
+```
+
+## API
+
+### 方法
+
+| 方法名  | 参数      | 返回值    | 介绍     |
+| -------- | --------- | --------- | --------- |
+| DialogInstance                     | `options` | `Promise` | 展示弹窗                         |
+| DialogInstance.alert               | `options` | `Promise` | 展示消息提示弹窗                 |
+| DialogInstance.close               | -         | `void`    | 关闭弹窗, 并清空缓存队列                         |
+| DialogInstance.confirm             | `options` | `Promise` | 展示消息确认弹窗                 |
+| DialogInstance.input               | `options` | `Promise` | 展示输入框弹窗                   |
+| DialogInstance.resetDefaultOptions | -         | `void`    | 重置默认配置，对所有 Dialog 生效 |
+| DialogInstance.setDefaultOptions   | `options` | `void`    | 修改默认配置，对所有 Dialog 生效 |
+| DialogInstance.stopLoading         | -         | `void`    | 停止按钮的加载状态               |
+
+### Options
+
+icon: AlarmIcon,
+  iconColor: '#1989fa',
+  iconSize: '36px',
+
+通过函数调用 Dialog 时，支持传入以下选项：
+
+| 参数         | 说明  | 类型   | 默认值    |
+| ------------ | --------- | -------------- | --------- |
+| icon         | 是否显示警告图标，或者icon的name值    | _boolean_ `v2.6.3` _boolean \| string_ `v2.6.3`         | `false`   |
+| iconColor `v2.6.3`   | icon的颜色 | _string_           | `#F04C4C`      |
+| iconSize `v2.6.3`   | icon的大小 | _string_           | -      |
+| maxlength    | 最大输入长度，设置为 -1 的时候不限制最大长度 | _number_           | `20`      |
+| message      | 文本内容，支持通过`\n`换行                   | _string_           | -         |
+| messageAlign | 内容对齐方式，可选值为`left` `right`         | _string_           | `center`  |
+| password     | 是否是密码类型     | _boolean_          | `false`   |
+| placeholder  | 输入框为空时占位符     | _string_           | -         |
+| theme        | 样式风格，可选值为`round-button`   | _string_           | `default` |
+| title        | 标题      | _string_       | -         |
+| value        | 输入框的初始值     | _string_           | -         |
+| onInput `v2.10.0` |  输入回调 | _(value: string) => void_ | - |
+| width        | 弹窗宽度，默认单位为`px`   | _string \| number_ | `320px`   |
+| zIndex       | z-index 层级   | _number_           | `100`     |
+| customStyle | 自定义样式 | _string_ | '' |
+| selector | 自定义选择器 | _string_ | `#smart-dialog` |
+| cancelButtonText | 取消按钮的文案 | _string_ | `Cancel` |
+| closeOnClickOverlay | 点击遮罩层时是否关闭弹窗 | _boolean_ | `false` |
+| confirmButtonText | 确认按钮的文案 | _string_ | `Confirm` |
+| overlay | 是否展示遮罩层 | _boolean_ | `true` |
+| overlayStyle | 自定义遮罩层样式 | _object_ | - |
+| showCancelButton | 是否展示取消按钮 | _boolean_ | `false` |
+| showConfirmButton | 是否展示确认按钮 | _boolean_ | `true` |
+| beforeClose | 关闭前的回调函数，返回 `false` 可阻止关闭，支持返回 Promise | _(action) => boolean \| Promise\<boolean\>_ | - |
+| context | 选择器的选择范围，可以传入自定义组件的 this 作为上下文 | _object_ | 当前页面 |
+| transition | 动画名称，可选值为`fade` `none` | _string_ | `scale` |
+| nativeDisabled `v2.3.8` | 开启弹框期间是否禁用本地手势 | _boolean_ | `false` |
+| autoClose `v2.6.3` | 是否自动点击回调后关闭 | _boolean_ | `true` |
+| emptyDisabled `v2.7.0` | 输入框模式，value 为空时 无法提交 | _boolean_ | `false` |
+| fullCoverView `v2.11.1` | 是否使用 cover-view 包裹弹层，用于覆盖原生组件（如 map、video）时使用 | _boolean_ | `false` |
+
+### Props
+
+通过组件调用 Dialog 时，支持以下 Props:
+
+| 参数              | 说明  | 类型   | 默认值    |
+| ----------------- | --------- | ------------ | --------- |
+| confirm-button-id | 确认按钮的标识符，作为底层原生 button 组件的 id 值 | _string_           | -         |
+| icon         | 是否显示警告图标，或者icon的name值    | _boolean_ `v2.0.0` _boolean \| string_ `v2.6.3`          | `false`   |
+| icon-color `v2.6.3`   | icon的颜色 | _string_           | `#F04C4C`      |
+| icon-size `v2.6.3`   | icon的大小 | _string_           | -      |
+| maxlength         | 最大输入长度，设置为 -1 的时候不限制最大长度       | _number_           | `20`      |
+| message           | 文本内容，支持通过`\n`换行                         | _string_           | -         |
+| message-align     | 内容对齐方式，可选值为`left` `right`               | _string_           | `center`  |
+| password          | 是否是密码类型                                     | _boolean_          | `false`   |
+| placeholder       | 输入框为空时占位符                                 | _string_           | -         |
+| show              | 是否显示弹窗                                       | _boolean_          | -         |
+| theme             | 样式风格，可选值为`round-button`                   | _string_           | `default` |
+| title             | 标题                                               | _string_           | -         |
+| value             | 输入框的初始值                                     | _string_           | -         |
+| width             | 弹窗宽度，默认单位为`px`                           | _string \| number_ | `320px`   |
+| z-index           | z-index 层级                                       | _number_           | `100`     |
+| custom-style | 自定义样式 | _string_ | '' |
+| show-confirm-button | 是否展示确认按钮 | _boolean_ | `true` |
+| cancel-button-color | 取消按钮的字体颜色 | _string_ | `#333` |
+| cancel-button-text | 取消按钮的文案 | _string_ | `取消` |
+| close-on-click-overlay | 点击遮罩层时是否关闭弹窗 | _boolean_ | `false` |
+| confirm-button-color | 确认按钮的字体颜色 | _string_ | `#ee0a24` |
+| confirm-button-text | 确认按钮的文案 | _string_ | `确认` |
+| overlay | 是否展示遮罩层 | _boolean_ | `true` |
+| overlay-style | 自定义遮罩层样式 | _object_ | - |
+| show-cancel-button | 是否展示取消按钮 | _boolean_ | `false` |
+| use-cancel-button-slot | 是否使用自定义取消按钮的插槽 | _boolean_ | `false` |
+| use-confirm-button-slot | 是否使用自定义确认按钮的插槽 | _boolean_ | `false` |
+| use-slot | 是否使用自定义内容的插槽 | _boolean_ | `false` |
+| use-title-slot | 是否使用自定义标题的插槽 | _boolean_ | `false` |
+| before-close | 关闭前的回调函数，返回 `false` 可阻止关闭，支持返回 Promise | _(action, value?: string) => boolean \| Promise\<boolean\>_ | - |
+| transition | 动画名称，可选值为`fade` | _string_ | `scale` |
+| autoClose `v2.6.3` | 是否自动点击回调后关闭 | _boolean_ | `false` |
+| emptyDisabled `v2.7.0` | 输入框模式，value 为空时 无法提交 | _boolean_ | `false` |
+| full-cover-view `v2.11.1` | 是否使用 cover-view 包裹弹层，用于覆盖原生组件（如 map、video）时使用 | _boolean_ | `false` |
+
+
+### Events
+
+| 事件         | 说明      | 回调参数        |
+| ------------ | -------------- | ------------ |
+| bind:cancel  | 点击取消按钮时触发 | -                                                                        |
+| bind:close   | 弹窗关闭时触发     | event.detail: 触发关闭事件的来源，<br>枚举为`confirm`,`cancel`,`overlay` |
+| bind:confirm | 点击确认按钮时触发 | -          |
+
+### Slot
+
+| 名称         | 说明                |
+| ---------- | ----------------------- |
+| cancel-button  | 自定义`cancel-button`显示内容，需要 `use-cancel-button-slot` 为 `true`   |
+| confirm-button | 自定义`confirm-button`显示内容，需要 `use-confirm-button-slot` 为 `true` |
+| title          | 自定义`title`显示内容，如果设置了`title`属性则不生效                     |
+
+### 外部样式类
+
+| 类名                 | 说明           |
+| -------------------- | -------------- |
+| cancel-button-class  | 取消按钮样式类 |
+| confirm-button-class | 确认按钮样式类 |
+| custom-class         | 根节点样式类   |
+
+### 样式变量
+
+组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](/material/smartui?comId=config-provider&appType=miniapp)。
+| 名称    | 默认值   | 描述 |
+| ------------ | --------- | ---- |
+| --dialog-cancel-color `v2.1.7` | _var(--app-B4-N3, rgba(0, 0, 0, 0.5))_ | 取消按钮颜色 |
+| --dialog-confirm-color `v2.1.7` | _var(--app-B4-N1, rgba(0, 0, 0, 1))_ | 确认按钮颜色 |
+| --dialog-confirm-font-weight `v2.5.1` | _normal_ | 确认按钮的字重 |
+| --dialog-cancel-font-weight `v2.5.1` | _normal_ | 取消按钮字重 |
+| --dialog-width | _311px_ | 弹窗宽度 |
+| --dialog-small-screen-width | _90%_ | 小屏幕弹窗宽度 |
+| --dialog-font-size | _16px_ | 对话框字体大小 |
+| --dialog-border-radius | _16px_ | 圆角半径 |
+| --dialog-background-color | _var(--smart-ui-dialog-background, rgba(255, 255, 255, 1))_ | 背景颜色 |
+| --dialog-header-font-color | _var(--app-B4-N1, rgba(0, 0, 0, 1))_ | 标题字体颜色 |
+| --dialog-header-font-weight | _400_ | 标题字体粗细 |
+| --dialog-header-line-height | _24px_ | 标题行高 |
+| --dialog-header-padding `v2.3.5` | _0_ | 头部标题内边距 |
+| --dialog-header-padding-top | _24px_ | 头部标题顶部内边距 |
+| --dialog-header-padding-side `v2.13.0` | _16px_ | 头部标题左右内边距 |
+| --dialog-header-isolated-padding | _@padding-lg 0_ | 标题内边距 |
+| --dialog-message-padding | _24px_ | 消息内边距 |
+| --dialog-message-font-size | _16px_ | 消息字体大小 |
+| --dialog-message-line-height | _20px_ | 消息行高 |
+| --dialog-message-max-height | _60vh_ | 消息最大高度 |
+| --dialog-message-text-color | _var(--app-B4-N1, rgba(0, 0, 0, 1))_ | 消息字体颜色 |
+| --dialog-has-title-message-font-size | _14px_ | 标题消息字体大小 |
+| --dialog-has-title-message-text-color | _var(--app-B4-N3, rgba(0, 0, 0, 0.5))_ | 标题消息字体颜色 |
+| --dialog-has-title-message-padding-top | _8px_ | 标题消息顶部内边距 |
+| --dialog-header-icon-size | _39px_ | 图标大小 |
+| --dialog-input-height | _40px_ | 输入框高度 |
+| --dialog-input-background-color | _var(--app-B4-N9, rgba(0, 0, 0, 0.05))_ | 输入框背景色 |
+| --dialog-input-color `v2.13.1` | _var(--app-B4-N1, rgba(0, 0, 0, 1))_ | 输入框文字颜色 |
+| --dialog-input-margin | _0 16px 24px_ | 输入框外边距 |
+| --dialog-input-padding | _0 10px_ | 输入框内边距 |
+| --dialog-input-border-radius | _10px_ | 输入框圆角半径 |
+| --dialog-input-font-size | _14px_ | 输入框字体大小 |
+| --dialog--round-button-border-radius `v2.3.5` | _20px_ `v2.3.5` _301px_ `v2.7.1`  | 当设置`theme: 'round-button'`的按钮圆角 |

package/lib/dialog/dialog.d.ts

@@ -0,0 +1,81 @@
+/// <reference types="miniprogram-api-typings" />
+/// <reference types="miniprogram-api-typings" />
+export declare const queueRef: {
+    value: WechatMiniprogram.Component.TrivialInstance[];
+};
+export type Action = 'confirm' | 'cancel' | 'overlay';
+type DialogContext = WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
+type AnyObject = {};
+interface DialogOptions {
+    lang?: string;
+    show?: boolean;
+    title?: string;
+    icon?: boolean | string;
+    iconColor?: string;
+    iconSize?: string;
+    nativeDisabled?: boolean;
+    width?: string | number | null;
+    zIndex?: number;
+    theme?: string;
+    context?: (() => DialogContext) | DialogContext;
+    message?: string;
+    overlay?: boolean;
+    selector?: string;
+    ariaLabel?: string;
+    customStyle?: string;
+    transition?: string;
+    autoClose?: boolean;
+    beforeClose?: null | ((action: Action, value?: string) => Promise<void | boolean> | void);
+    businessId?: number;
+    sessionFrom?: string;
+    overlayStyle?: string;
+    appParameter?: string;
+    messageAlign?: string;
+    sendMessageImg?: string;
+    showMessageCard?: boolean;
+    sendMessagePath?: string;
+    sendMessageTitle?: string;
+    confirmButtonText?: string;
+    cancelButtonText?: string;
+    showConfirmButton?: boolean;
+    showCancelButton?: boolean;
+    closeOnClickOverlay?: boolean;
+    confirmButtonOpenType?: string;
+    value?: null | string;
+    ignoreQueue?: boolean;
+    emptyDisabled?: boolean;
+    password?: boolean;
+    placeholder?: string;
+    maxlength?: number;
+    fullCoverView?: boolean;
+}
+interface DialogInputOptions extends DialogOptions {
+    value: string;
+    type?: string;
+    password?: boolean;
+    placeholder?: string;
+    maxlength?: number;
+    emptyDisabled?: boolean;
+    onInput?: (value: string) => void;
+}
+export declare const contextRef: {
+    value: Record<string, DialogContext | null>;
+};
+declare const Dialog: {
+    (options: DialogOptions): Promise<WechatMiniprogram.Component.TrivialInstance>;
+    alert(options: DialogOptions): Promise<WechatMiniprogram.Component.TrivialInstance>;
+    confirm(options: DialogOptions): Promise<WechatMiniprogram.Component.TrivialInstance>;
+    input: (options: DialogInputOptions) => Promise<WechatMiniprogram.Component.Instance<{
+        /**
+         * 输入框的当前值
+         */
+        inputValue: string;
+    }, AnyObject, AnyObject>>;
+    close(): void;
+    stopLoading(): void;
+    currentOptions: DialogOptions;
+    defaultOptions: DialogOptions;
+    setDefaultOptions(options: DialogOptions): void;
+    resetDefaultOptions(): void;
+};
+export default Dialog;

package/lib/dialog/dialog.js

@@ -0,0 +1,137 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.contextRef = exports.queueRef = void 0;
+var appLog_1 = __importDefault(require("../common/appLog"));
+var utils_1 = require("../common/utils");
+exports.queueRef = {
+    value: [],
+};
+var defaultOptions = {
+    show: false,
+    title: '',
+    width: null,
+    theme: 'default',
+    message: '',
+    zIndex: 100,
+    overlay: true,
+    selector: '#smart-dialog',
+    beforeClose: null,
+    transition: 'scale',
+    customStyle: '',
+    autoClose: true,
+    messageAlign: '',
+    overlayStyle: '',
+    confirmButtonText: '确认',
+    cancelButtonText: '取消',
+    showConfirmButton: true,
+    showCancelButton: false,
+    closeOnClickOverlay: false,
+    confirmButtonOpenType: '',
+    icon: false,
+    nativeDisabled: false,
+    ignoreQueue: false,
+    value: null,
+    password: false,
+    emptyDisabled: false,
+    placeholder: '',
+    maxlength: 20,
+    fullCoverView: false,
+};
+var currentOptions = __assign({}, defaultOptions);
+exports.contextRef = {
+    value: {},
+};
+var Dialog = function (options) {
+    options = __assign(__assign({}, currentOptions), options);
+    var prom = new Promise(function (resolve, reject) {
+        appLog_1.default.info('start open dialog');
+        var context = (typeof options.context === 'function' ? options.context() : options.context) ||
+            exports.contextRef.value[options.selector] ||
+            (0, utils_1.getCurrentPage)();
+        var selector = options.selector;
+        appLog_1.default.info("dialog selector: ".concat(selector));
+        appLog_1.default.info("queue : ".concat(JSON.stringify(exports.queueRef.value)));
+        var dialog = context.selectComponent(options.selector);
+        appLog_1.default.info("dialog component ".concat(dialog ? 'success' : 'fail'));
+        if (!options.ignoreQueue &&
+            exports.queueRef.value.length > 0 &&
+            exports.queueRef.value.find(function (item) { return dialog && item && item.id === dialog.id; })) {
+            console.warn("\u76F8\u540C\u9009\u62E9\u5668\u7684 Dialog \u8C03\u7528\u8FC7\u4E8E\u9891\u7E41\uFF0C".concat(dialog.id, " \u5DF2\u5FFD\u7565\u91CD\u590D\u8C03\u7528"));
+            appLog_1.default.info("\u76F8\u540C\u9009\u62E9\u5668\u7684 Dialog \u8C03\u7528\u8FC7\u4E8E\u9891\u7E41\uFF0C".concat(dialog.id, " \u5DF2\u5FFD\u7565\u91CD\u590D\u8C03\u7528"));
+            return;
+        }
+        delete options.context;
+        delete options.selector;
+        if (dialog) {
+            var optionsWithInputValue = __assign({}, options);
+            if (typeof options.value === 'string') {
+                optionsWithInputValue.inputValue = options.value;
+            }
+            dialog.setData(__assign({ callback: function (action, instance) {
+                    /**
+                     * 在声明式调用的情况下，在 close 后需要手动清空队列
+                     */
+                    exports.queueRef.value = exports.queueRef.value.filter(function (item) { return item.id !== dialog.id; });
+                    action === 'confirm' ? resolve(instance) : reject(instance);
+                    appLog_1.default.info("dialog ".concat(dialog.id, " callback"));
+                } }, optionsWithInputValue));
+            wx.nextTick(function () {
+                appLog_1.default.info("start open dialog ".concat(dialog.id));
+                dialog.setData({ show: true });
+            });
+            exports.queueRef.value.push(dialog);
+        }
+        else {
+            console.warn("\u672A\u627E\u5230 ".concat((selector !== null && selector !== void 0 ? selector : '#smart-dialog').replace('#', ''), " \u8282\u70B9\uFF0C\u8BF7\u786E\u8BA4 selector \u53CA context \u662F\u5426\u6B63\u786E"));
+            appLog_1.default.info("\u672A\u627E\u5230 ".concat((selector !== null && selector !== void 0 ? selector : '#smart-dialog').replace('#', ''), " \u8282\u70B9\uFF0C\u8BF7\u786E\u8BA4 selector \u53CA context \u662F\u5426\u6B63\u786E"));
+        }
+    });
+    prom.catch(function (err) {
+        appLog_1.default.info("Dialog promise Error", err);
+        console.log(err, '---Dialog-error');
+        exports.queueRef.value = [];
+    });
+    return prom;
+};
+Dialog.alert = function (options) { return Dialog(options); };
+Dialog.confirm = function (options) {
+    return Dialog(__assign({ showCancelButton: true }, options));
+};
+Dialog.input = (function (options) { var _a; return Dialog(__assign(__assign({ showCancelButton: true }, options), { value: (_a = options.value) !== null && _a !== void 0 ? _a : '' })); });
+Dialog.close = function () {
+    exports.queueRef.value.forEach(function (dialog) {
+        dialog.close();
+    });
+    exports.queueRef.value = [];
+};
+Dialog.stopLoading = function () {
+    exports.queueRef.value.forEach(function (dialog) {
+        dialog.stopLoading();
+    });
+};
+Dialog.currentOptions = currentOptions;
+Dialog.defaultOptions = defaultOptions;
+Dialog.setDefaultOptions = function (options) {
+    currentOptions = __assign(__assign({}, currentOptions), options);
+    Dialog.currentOptions = currentOptions;
+};
+Dialog.resetDefaultOptions = function () {
+    currentOptions = __assign({}, defaultOptions);
+    Dialog.currentOptions = currentOptions;
+};
+Dialog.resetDefaultOptions();
+exports.default = Dialog;

package/lib/dialog/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-bottom-sheet-dragger-node-background:rgba(0,0,0,.3);--smart-ui-dialog-background:var(--app-B4,#fff);--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);--smart-ui-battery-body-base-background:rgba(0,0,0,.25);--smart-ui-battery-text-color:rgba(0,0,0,.6);--smart-ui-battery-slash-border-color:#fff;--smart-ui-toast-background:#5c5c5c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 4px 12px rgba(0,0,0,.1),0 16px 32px rgba(0,0,0,.12);--smart-ui-overlay-blur-background:rgba(40,44,53,.22)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-bottom-sheet-dragger-node-background:hsla(0,0%,100%,.3);--smart-ui-dialog-background:linear-gradient(0deg,var(--app-B4-N6),var(--app-B4-N6)),var(--app-B1);--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0));--smart-ui-battery-body-base-background:hsla(0,0%,100%,.4);--smart-ui-battery-text-color:#fff;--smart-ui-battery-slash-border-color:#000;--smart-ui-toast-background:#3c3c3c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 8px 24px 0 rgba(0,0,0,.15);--smart-ui-overlay-blur-background:rgba(0,0,0,.6)}.smart-manrope{font-family:Manrope,sans-serif}:root{--smart-a11y-action-sheet-item-text-color:#000}:root[theme=dark]{--smart-a11y-action-sheet-item-text-color:#fff}.smart-dialog{--button-default-background-color:transparent;--goods-action-background-color:transparent;background:var(--dialog-background-color,var(--smart-ui-dialog-background,#fff));border-radius:var(--dialog-border-radius,16px);font-size:var(--dialog-font-size,16px);overflow:hidden;top:50%;width:var(--dialog-width,311px)}@media (max-width:321px){.smart-dialog{width:var(--dialog-small-screen-width,90%)}}.smart-dialog__header{color:var(--dialog-header-font-color,var(--app-B4-N1,#000));font-weight:var(--dialog-header-font-weight,400);line-height:var(--dialog-header-line-height,24px);padding:var(--dialog-header-padding,0);padding-left:var(--dialog-header-padding-side,16px);padding-right:var(--dialog-header-padding-side,16px);padding-top:var(--dialog-header-padding-top,24px);text-align:center}.smart-dialog__header-icon{border-radius:100%;display:block;font-size:var(--dialog-header-icon-size,39px);height:var(--dialog-header-icon-size,39px);margin:auto auto 12px;width:var(--dialog-header-icon-size,39px)}.smart-dialog__header--isolated{padding:var(--dialog-header-isolated-padding,24px 0)}.smart-dialog__message{-webkit-overflow-scrolling:touch;color:var(--dialog-message-text-color,var(--app-B4-N1,#000));font-size:var(--dialog-message-font-size,16px);line-height:var(--dialog-message-line-height,20px);max-height:var(--dialog-message-max-height,60vh);overflow-y:auto;padding:var(--dialog-message-padding,24px);text-align:center}.smart-dialog__message-text{word-wrap:break-word}.smart-dialog__message--hasTitle{color:var(--dialog-has-title-message-text-color,var(--app-B4-N3,rgba(0,0,0,.5)));font-size:var(--dialog-has-title-message-font-size,14px);padding-top:var(--dialog-has-title-message-padding-top,8px)}.smart-dialog__message--round-button{--hairline-right-width:0;padding-bottom:16px}.smart-dialog__message--left{text-align:left}.smart-dialog__message--right{text-align:right}.smart-dialog__message--justify{text-align:justify}.smart-dialog__input{background-color:var(--dialog-input-background-color,var(--app-B4-N9,rgba(0,0,0,.05)));border-radius:var(--dialog-input-border-radius,10px);color:var(--dialog-input-color,var(--app-B4-N1,#000));font-size:var(--dialog-input-font-size,14px);height:var(--dialog-input-height,40px);margin:var(--dialog-input-margin,0 16px 24px);padding:var(--dialog-input-padding,0 10px)}.smart-dialog__footer{display:flex}.smart-dialog__footer--round-button{--hairline-right-width:0;padding:8px 20px 16px!important;position:relative!important}.smart-dialog__button{flex:1}.smart-dialog__confirm{font-weight:var(--dialog-confirm-font-weight,normal)}.smart-dialog__confirm--disabled{opacity:.5;pointer-events:none}.smart-dialog__cancel{font-weight:var(--dialog-cancel-font-weight,normal)}.smart-dialog__cancel,.smart-dialog__confirm{border:0!important;border-radius:0!important}.smart-dialog-bounce-enter{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.smart-dialog-bounce-leave-active{opacity:0;transform:translate3d(-50%,-50%,0) scale(.9)}.smart-dialog--round-button .smart-dialog__cancel,.smart-dialog--round-button .smart-dialog__confirm{border-radius:var(--dialog--round-button-border-radius,301px)!important}:root[data-a11y=true] .smart-dialog{color:var(--a11y-dialog-message-text-color,var(--app-B6-N2,rgba(0,0,0,.7)));font-size:var(--a11y-dialog-message-font-size,18px);font-weight:var(--a11y-dialog-message-font-weight,500)}:root[data-a11y=true] .smart-dialog__header{font-size:var(--dialog-header-font-size,20px);font-weight:var(--dialog-header-font-weight,600);line-height:var(--dialog-header-line-height,30px)}:root[data-a11y=true] .smart-dialog__message{color:var(--dialog-message-text-color,var(--app-B6-N2,rgba(0,0,0,.7)));font-size:var(--dialog-message-font-size,18px);font-weight:var(--dialog-message-font-weight,500);line-height:var(--dialog-message-line-height,27px)}:root[data-a11y=true] .smart-dialog__message--hasTitle{color:var(--dialog-has-title-message-text-color,var(--app-B6-N2,rgba(0,0,0,.7)));font-size:var(--dialog-has-title-message-font-size,18px)}:root[data-a11y=true] .smart-dialog__confirm{font-weight:var(--dialog-confirm-font-weight,500)}:root[data-a11y=true] .smart-dialog__input{background-color:var(--dialog-input-background-color,var(--app-B4-N7,rgba(0,0,0,.08)));font-size:var(--dialog-input-font-size,18px);font-weight:var(--dialog-input-font-weight,500);height:var(--dialog-input-height,47px)}:root[data-a11y=true] .smart-hairline--top:after{border-top-width:0;border:solid var(--hairline-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-width:var(--hairline-top-width,2px) 0 0}:root[data-a11y=true] .smart-hairline--right:after{border-right-width:0;border:solid var(--hairline-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-width:0 var(--hairline-right-width,2px) 0 0}

package/lib/dialog/index.d.ts

@@ -0,0 +1 @@
+export {};