@emhome/meeui-mp 1.11.7

package/lib/dropdown-item/index.js

@@ -0,0 +1,136 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var relation_1 = require("../common/relation");
+var component_1 = require("../common/component");
+(0, component_1.MeeComponent)({
+    classes: ['item-title-class'],
+    field: true,
+    relation: (0, relation_1.useParent)('dropdown-menu', function () {
+        this.updateDataFromParent();
+    }),
+    props: {
+        value: {
+            type: null,
+            observer: 'rerender',
+        },
+        title: {
+            type: String,
+            observer: 'rerender',
+        },
+        disabled: Boolean,
+        titleClass: {
+            type: String,
+            observer: 'rerender',
+        },
+        options: {
+            type: Array,
+            value: [],
+            observer: 'rerender',
+        },
+        popupStyle: String,
+        useBeforeToggle: {
+            type: Boolean,
+            value: false,
+        },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
+    },
+    data: {
+        transition: true,
+        showPopup: false,
+        showWrapper: false,
+        displayTitle: '',
+        safeAreaTabBar: false,
+    },
+    methods: {
+        rerender: function () {
+            var _this = this;
+            wx.nextTick(function () {
+                var _a;
+                (_a = _this.parent) === null || _a === void 0 ? void 0 : _a.updateItemListData();
+            });
+        },
+        updateDataFromParent: function () {
+            if (this.parent) {
+                var _a = this.parent.data, overlay = _a.overlay, duration = _a.duration, activeColor = _a.activeColor, closeOnClickOverlay = _a.closeOnClickOverlay, direction = _a.direction, safeAreaTabBar = _a.safeAreaTabBar;
+                this.setData({
+                    overlay: overlay,
+                    duration: duration,
+                    activeColor: activeColor,
+                    closeOnClickOverlay: closeOnClickOverlay,
+                    direction: direction,
+                    safeAreaTabBar: safeAreaTabBar,
+                });
+            }
+        },
+        onOpen: function () {
+            this.$emit('open');
+        },
+        onOpened: function () {
+            this.$emit('opened');
+        },
+        onClose: function () {
+            this.$emit('close');
+        },
+        onClosed: function () {
+            this.$emit('closed');
+            this.setData({ showWrapper: false });
+        },
+        onOptionTap: function (event) {
+            var option = event.currentTarget.dataset.option;
+            var value = option.value;
+            var shouldEmitChange = this.data.value !== value;
+            this.setData({ showPopup: false, value: value });
+            this.$emit('close');
+            this.rerender();
+            if (shouldEmitChange) {
+                this.$emit('change', value);
+            }
+        },
+        toggle: function (show, options) {
+            var _this = this;
+            if (options === void 0) { options = {}; }
+            var showPopup = this.data.showPopup;
+            if (typeof show !== 'boolean') {
+                show = !showPopup;
+            }
+            if (show === showPopup) {
+                return;
+            }
+            this.onBeforeToggle(show).then(function (status) {
+                var _a;
+                if (!status) {
+                    return;
+                }
+                _this.setData({
+                    transition: !options.immediate,
+                    showPopup: show,
+                });
+                if (show) {
+                    (_a = _this.parent) === null || _a === void 0 ? void 0 : _a.getChildWrapperStyle().then(function (wrapperStyle) {
+                        _this.setData({ wrapperStyle: wrapperStyle, showWrapper: true });
+                        _this.rerender();
+                    });
+                }
+                else {
+                    _this.rerender();
+                }
+            });
+        },
+        onBeforeToggle: function (status) {
+            var _this = this;
+            var useBeforeToggle = this.data.useBeforeToggle;
+            if (!useBeforeToggle) {
+                return Promise.resolve(true);
+            }
+            return new Promise(function (resolve) {
+                _this.$emit('before-toggle', {
+                    status: status,
+                    callback: function (value) { return resolve(value); },
+                });
+            });
+        },
+    },
+});

package/lib/dropdown-item/index.json

@@ -0,0 +1,8 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mee-popup": "../popup/index",
+    "mee-cell": "../cell/index",
+    "mee-icon": "../icon/index"
+  }
+}

package/lib/dropdown-item/index.wxml

@@ -0,0 +1,8 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<import src="./dropdown-item.wxml" />
+
+<root-portal wx:if="{{ rootPortal }}">
+  <include src="./dropdown-item.wxml" />
+</root-portal>
+
+<include wx:else src="./dropdown-item.wxml" />

package/lib/dropdown-item/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-dropdown-item{left:0;overflow:hidden;position:fixed;right:0}.mee-dropdown-item__option{text-align:left}.mee-dropdown-item__option--active .mee-dropdown-item__icon,.mee-dropdown-item__option--active .mee-dropdown-item__title{color:var(--dropdown-menu-option-active-color,#ee0a24)}.mee-dropdown-item--up{top:0}.mee-dropdown-item--down{bottom:0}.mee-dropdown-item__icon{display:block;line-height:inherit}

package/lib/dropdown-item/shared.d.ts

@@ -0,0 +1,5 @@
+export interface Option {
+    text: string;
+    value: string | number;
+    icon: string;
+}

package/lib/dropdown-item/shared.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/dropdown-menu/index.d.ts

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

package/lib/dropdown-menu/index.js

@@ -0,0 +1,122 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+var utils_1 = require("../common/utils");
+var ARRAY = [];
+(0, component_1.MeeComponent)({
+    field: true,
+    classes: ['title-class'],
+    relation: (0, relation_1.useChildren)('dropdown-item', function () {
+        this.updateItemListData();
+    }),
+    props: {
+        activeColor: {
+            type: String,
+            observer: 'updateChildrenData',
+        },
+        overlay: {
+            type: Boolean,
+            value: true,
+            observer: 'updateChildrenData',
+        },
+        zIndex: {
+            type: Number,
+            value: 10,
+        },
+        duration: {
+            type: Number,
+            value: 200,
+            observer: 'updateChildrenData',
+        },
+        direction: {
+            type: String,
+            value: 'down',
+            observer: 'updateChildrenData',
+        },
+        safeAreaTabBar: {
+            type: Boolean,
+            value: false,
+        },
+        closeOnClickOverlay: {
+            type: Boolean,
+            value: true,
+            observer: 'updateChildrenData',
+        },
+        closeOnClickOutside: {
+            type: Boolean,
+            value: true,
+        },
+    },
+    data: {
+        itemListData: [],
+    },
+    beforeCreate: function () {
+        var windowHeight = (0, utils_1.getSystemInfoSync)().windowHeight;
+        this.windowHeight = windowHeight;
+        ARRAY.push(this);
+    },
+    destroyed: function () {
+        var _this = this;
+        ARRAY = ARRAY.filter(function (item) { return item !== _this; });
+    },
+    methods: {
+        updateItemListData: function () {
+            this.setData({
+                itemListData: this.children.map(function (child) { return child.data; }),
+            });
+        },
+        updateChildrenData: function () {
+            this.children.forEach(function (child) {
+                child.updateDataFromParent();
+            });
+        },
+        toggleItem: function (active) {
+            this.children.forEach(function (item, index) {
+                var showPopup = item.data.showPopup;
+                if (index === active) {
+                    item.toggle();
+                }
+                else if (showPopup) {
+                    item.toggle(false, { immediate: true });
+                }
+            });
+        },
+        close: function () {
+            this.children.forEach(function (child) {
+                child.toggle(false, { immediate: true });
+            });
+        },
+        getChildWrapperStyle: function () {
+            var _this = this;
+            var _a = this.data, zIndex = _a.zIndex, direction = _a.direction;
+            return (0, utils_1.getRect)(this, '.mee-dropdown-menu').then(function (rect) {
+                var _a = rect.top, top = _a === void 0 ? 0 : _a, _b = rect.bottom, bottom = _b === void 0 ? 0 : _b;
+                var offset = direction === 'down' ? bottom : _this.windowHeight - top;
+                var wrapperStyle = "z-index: ".concat(zIndex, ";");
+                if (direction === 'down') {
+                    wrapperStyle += "top: ".concat((0, utils_1.addUnit)(offset), ";");
+                }
+                else {
+                    wrapperStyle += "bottom: ".concat((0, utils_1.addUnit)(offset), ";");
+                }
+                return wrapperStyle;
+            });
+        },
+        onTitleTap: function (event) {
+            var _this = this;
+            var index = event.currentTarget.dataset.index;
+            var child = this.children[index];
+            if (!child.data.disabled) {
+                ARRAY.forEach(function (menuItem) {
+                    if (menuItem &&
+                        menuItem.data.closeOnClickOutside &&
+                        menuItem !== _this) {
+                        menuItem.close();
+                    }
+                });
+                this.toggleItem(index);
+            }
+        },
+    },
+});

package/lib/dropdown-menu/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/lib/dropdown-menu/index.wxml

@@ -0,0 +1,23 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view class="mee-dropdown-menu mee-dropdown-menu--top-bottom custom-class">
+  <view
+    wx:for="{{ itemListData }}"
+    wx:key="index"
+    data-index="{{ index }}"
+    class="{{ utils.bem('dropdown-menu__item', { disabled: item.disabled }) }}"
+    bind:tap="onTitleTap"
+  >
+    <view
+      class="{{ item.titleClass }} {{ utils.bem('dropdown-menu__title', { active: item.showPopup, down: item.showPopup === (direction === 'down') }) }} title-class"
+      style="{{ item.showPopup ? 'color:' + activeColor : '' }}"
+    >
+      <view class="mee-ellipsis">
+        {{ computed.displayTitle(item) }}
+      </view>
+    </view>
+  </view>
+
+  <slot />
+</view>

package/lib/dropdown-menu/index.wxs

@@ -0,0 +1,16 @@
+/* eslint-disable */
+function displayTitle(item) {
+  if (item.title) {
+    return item.title;
+  }
+
+  var match = item.options.filter(function(option) {
+    return option.value === item.value;
+  });
+  var displayTitle = match.length ? match[0].text : '';
+  return displayTitle;
+}
+
+module.exports = {
+  displayTitle: displayTitle
+};

package/lib/dropdown-menu/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-dropdown-menu{background-color:var(--dropdown-menu-background-color,#fff);box-shadow:var(--dropdown-menu-box-shadow,0 2px 12px hsla(210,1%,40%,.12));display:flex;height:var(--dropdown-menu-height,50px);-webkit-user-select:none;user-select:none}.mee-dropdown-menu__item{align-items:center;display:flex;flex:1;justify-content:center;min-width:0}.mee-dropdown-menu__item:active{opacity:.7}.mee-dropdown-menu__item--disabled:active{opacity:1}.mee-dropdown-menu__item--disabled .mee-dropdown-menu__title{color:var(--dropdown-menu-title-disabled-text-color,#969799)}.mee-dropdown-menu__title{box-sizing:border-box;color:var(--dropdown-menu-title-text-color,#323233);font-size:var(--dropdown-menu-title-font-size,15px);line-height:var(--dropdown-menu-title-line-height,18px);max-width:100%;padding:var(--dropdown-menu-title-padding,0 24px 0 8px);position:relative}.mee-dropdown-menu__title:after{border-color:transparent transparent currentcolor currentcolor;border-style:solid;border-width:3px;content:"";margin-top:-5px;opacity:.8;position:absolute;right:11px;top:50%;transform:rotate(-45deg)}.mee-dropdown-menu__title--active{color:var(--dropdown-menu-title-active-text-color,#ee0a24)}.mee-dropdown-menu__title--down:after{margin-top:-1px;transform:rotate(135deg)}

package/lib/empty/index.d.ts

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

package/lib/empty/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+(0, component_1.MeeComponent)({
+    props: {
+        description: String,
+        image: {
+            type: String,
+            value: 'default',
+        },
+    },
+});

package/lib/empty/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/lib/empty/index.wxml

@@ -0,0 +1,22 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view class="custom-class mee-empty">
+  <view class="mee-empty__image">
+    <slot name="image"></slot>
+  </view>
+  <view class="mee-empty__image">
+    <image wx:if="{{ image }}" class="mee-empty__image__img" src="{{ computed.imageUrl(image) }}" />
+  </view>
+
+  <view class="mee-empty__description">
+    <slot name="description"></slot>
+  </view>
+  <view class="mee-empty__description">
+    {{ description }}
+  </view>
+
+  <view class="mee-empty__bottom">
+    <slot></slot>
+  </view>
+</view>

package/lib/empty/index.wxs

@@ -0,0 +1,15 @@
+/* eslint-disable */
+var PRESETS = ['error', 'search', 'default', 'network'];
+
+function imageUrl(image) {
+  if (PRESETS.indexOf(image) !== -1) {
+    return 'https://img.yzcdn.cn/vant/empty-image-' + image + '.png';
+  }
+
+  return image;
+}
+
+module.exports = {
+  imageUrl: imageUrl,
+};
+

package/lib/empty/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-empty{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;padding:32px 0}.mee-empty__image{height:160px;width:160px}.mee-empty__image:empty{display:none}.mee-empty__image__img{height:100%;width:100%}.mee-empty__image:not(:empty)+.mee-empty__image{display:none}.mee-empty__description{color:#969799;font-size:14px;line-height:20px;margin-top:16px;padding:0 60px}.mee-empty__description:empty,.mee-empty__description:not(:empty)+.mee-empty__description{display:none}.mee-empty__bottom{margin-top:24px}

package/lib/field/index.d.ts

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

package/lib/field/index.js

@@ -0,0 +1,152 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var utils_1 = require("../common/utils");
+var component_1 = require("../common/component");
+var props_1 = require("./props");
+(0, component_1.MeeComponent)({
+    field: true,
+    classes: ['input-class', 'right-icon-class', 'label-class'],
+    props: __assign(__assign(__assign(__assign({}, props_1.commonProps), props_1.inputProps), props_1.textareaProps), { size: String, icon: String, label: String, error: Boolean, center: Boolean, isLink: Boolean, leftIcon: String, rightIcon: String, autosize: null, required: Boolean, iconClass: String, clickable: Boolean, inputAlign: String, customStyle: String, errorMessage: String, arrowDirection: String, showWordLimit: Boolean, errorMessageAlign: String, readonly: {
+            type: Boolean,
+            observer: 'setShowClear',
+        }, clearable: {
+            type: Boolean,
+            observer: 'setShowClear',
+        }, clearTrigger: {
+            type: String,
+            value: 'focus',
+        }, border: {
+            type: Boolean,
+            value: true,
+        }, titleWidth: {
+            type: String,
+            value: '6.2em',
+        }, clearIcon: {
+            type: String,
+            value: 'clear',
+        }, extraEventParams: {
+            type: Boolean,
+            value: false,
+        } }),
+    data: {
+        focused: false,
+        innerValue: '',
+        showClear: false,
+    },
+    watch: {
+        value: function (value) {
+            if (value !== this.value) {
+                this.setData({ innerValue: value });
+                this.value = value;
+                this.setShowClear();
+            }
+        },
+        clearTrigger: function () {
+            this.setShowClear();
+        },
+    },
+    created: function () {
+        this.value = this.data.value;
+        this.setData({ innerValue: this.value });
+    },
+    methods: {
+        formatValue: function (value) {
+            var maxlength = this.data.maxlength;
+            if (maxlength !== -1 && value.length > maxlength) {
+                return value.slice(0, maxlength);
+            }
+            return value;
+        },
+        onInput: function (event) {
+            var _a = (event.detail || {}).value, value = _a === void 0 ? '' : _a;
+            var formatValue = this.formatValue(value);
+            this.value = formatValue;
+            this.setShowClear();
+            return this.emitChange(__assign(__assign({}, event.detail), { value: formatValue }));
+        },
+        onFocus: function (event) {
+            this.focused = true;
+            this.setShowClear();
+            this.$emit('focus', event.detail);
+        },
+        onBlur: function (event) {
+            this.focused = false;
+            this.setShowClear();
+            this.$emit('blur', event.detail);
+        },
+        onClickIcon: function () {
+            this.$emit('click-icon');
+        },
+        onClickInput: function (event) {
+            this.$emit('click-input', event.detail);
+        },
+        onClear: function () {
+            var _this = this;
+            this.setData({ innerValue: '' });
+            this.value = '';
+            this.setShowClear();
+            (0, utils_1.nextTick)(function () {
+                _this.emitChange({ value: '' });
+                _this.$emit('clear', '');
+            });
+        },
+        onConfirm: function (event) {
+            var _a = (event.detail || {}).value, value = _a === void 0 ? '' : _a;
+            this.value = value;
+            this.setShowClear();
+            this.$emit('confirm', value);
+        },
+        setValue: function (value) {
+            this.value = value;
+            this.setShowClear();
+            if (value === '') {
+                this.setData({ innerValue: '' });
+            }
+            this.emitChange({ value: value });
+        },
+        onLineChange: function (event) {
+            this.$emit('linechange', event.detail);
+        },
+        onKeyboardHeightChange: function (event) {
+            this.$emit('keyboardheightchange', event.detail);
+        },
+        onBindNicknameReview: function (event) {
+            this.$emit('nicknamereview', event.detail);
+        },
+        emitChange: function (detail) {
+            var extraEventParams = this.data.extraEventParams;
+            this.setData({ value: detail.value });
+            var result;
+            var data = extraEventParams
+                ? __assign(__assign({}, detail), { callback: function (data) {
+                        result = data;
+                    } }) : detail.value;
+            this.$emit('input', data);
+            this.$emit('change', data);
+            return result;
+        },
+        setShowClear: function () {
+            var _a = this.data, clearable = _a.clearable, readonly = _a.readonly, clearTrigger = _a.clearTrigger;
+            var _b = this, focused = _b.focused, value = _b.value;
+            var showClear = false;
+            if (clearable && !readonly) {
+                var hasValue = !!value;
+                var trigger = clearTrigger === 'always' || (clearTrigger === 'focus' && focused);
+                showClear = hasValue && trigger;
+            }
+            this.setView({ showClear: showClear });
+        },
+        noop: function () { },
+    },
+});

package/lib/field/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mee-cell": "../cell/index",
+    "mee-icon": "../icon/index"
+  }
+}

package/lib/field/index.wxml

@@ -0,0 +1,56 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<mee-cell
+  size="{{ size }}"
+  icon="{{ leftIcon }}"
+  center="{{ center }}"
+  border="{{ border }}"
+  is-link="{{ isLink }}"
+  required="{{ required }}"
+  clickable="{{ clickable }}"
+  title-width="{{ titleWidth }}"
+  title-style="margin-right: 12px;"
+  custom-style="{{ customStyle }}"
+  arrow-direction="{{ arrowDirection }}"
+  custom-class="custom-class mee-field"
+>
+  <slot name="left-icon" slot="icon" />
+  <label for="{{ name }}" wx:if="{{ label }}" class="label-class {{ utils.bem('field__label', { disabled }) }}" slot="title">
+    {{ label }}
+  </label>
+  <slot wx:else name="label" slot="title" />
+  <view class="{{ utils.bem('field__body', [type]) }}">
+    <view class="{{ utils.bem('field__control', [inputAlign, 'custom']) }}" bindtap="onClickInput">
+      <slot name="input" />
+    </view>
+    <include wx:if="{{ type === 'textarea' }}" src="./textarea.wxml" />
+    <include wx:else src="./input.wxml" />
+
+    <mee-icon
+      wx:if="{{ showClear }}"
+      name="{{ clearIcon }}"
+      class="mee-field__clear-root mee-field__icon-root"
+      catch:touchstart="onClear"
+    />
+    <view class="mee-field__icon-container" bind:tap="onClickIcon">
+      <mee-icon
+        wx:if="{{ rightIcon || icon }}"
+        name="{{ rightIcon || icon }}"
+        class="mee-field__icon-root {{ iconClass }}"
+        custom-class="right-icon-class"
+      />
+      <slot name="right-icon" />
+      <slot name="icon" />
+    </view>
+    <view class="mee-field__button">
+      <slot name="button" />
+    </view>
+  </view>
+  <label for="{{ name }}" wx:if="{{ showWordLimit && maxlength }}" class="mee-field__word-limit">
+    <view class="{{ utils.bem('field__word-num', { full: value.length >= maxlength }) }}">{{ value.length >= maxlength ? maxlength : value.length }}</view>/{{ maxlength }}
+  </label>
+  <label for="{{ name }}"  wx:if="{{ errorMessage }}" class="{{ utils.bem('field__error-message', [errorMessageAlign, { disabled, error }]) }}">
+    {{ errorMessage }}
+  </label>
+</mee-cell>

package/lib/field/index.wxs

@@ -0,0 +1,18 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function inputStyle(autosize) {
+  if (autosize && autosize.constructor === 'Object') {
+    return style({
+      'min-height': addUnit(autosize.minHeight),
+      'max-height': addUnit(autosize.maxHeight),
+    });
+  }
+
+  return '';
+}
+
+module.exports = {
+  inputStyle: inputStyle,
+};

package/lib/field/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-field{--cell-icon-size:var(--field-icon-size,16px)}.mee-field__label{color:var(--field-label-color,#646566)}.mee-field__label--disabled{color:var(--field-disabled-text-color,#c8c9cc)}.mee-field__body{align-items:center;display:flex}.mee-field__body--textarea{box-sizing:border-box;line-height:1.2em;min-height:var(--cell-line-height,24px);padding:3.6px 0}.mee-field__control:empty+.mee-field__control{display:block}.mee-field__control{background-color:initial;border:0;box-sizing:border-box;color:var(--field-input-text-color,#323233);display:none;height:var(--cell-line-height,24px);line-height:inherit;margin:0;min-height:var(--cell-line-height,24px);padding:0;position:relative;resize:none;text-align:left;width:100%}.mee-field__control:empty{display:none}.mee-field__control--textarea{height:var(--field-text-area-min-height,18px);min-height:var(--field-text-area-min-height,18px)}.mee-field__control--error{color:var(--field-input-error-text-color,#ee0a24)}.mee-field__control--disabled{background-color:initial;color:var(--field-input-disabled-text-color,#c8c9cc);opacity:1}.mee-field__control--center{text-align:center}.mee-field__control--right{text-align:right}.mee-field__control--custom{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.mee-field__placeholder{color:var(--field-placeholder-text-color,#c8c9cc);left:0;pointer-events:none;position:absolute;right:0;top:0}.mee-field__placeholder--error{color:var(--field-error-message-color,#ee0a24)}.mee-field__icon-root{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.mee-field__clear-root,.mee-field__icon-container{line-height:inherit;margin-right:calc(var(--padding-xs, 8px)*-1);padding:0 var(--padding-xs,8px);vertical-align:middle}.mee-field__button,.mee-field__clear-root,.mee-field__icon-container{flex-shrink:0}.mee-field__clear-root{color:var(--field-clear-icon-color,#c8c9cc);font-size:var(--field-clear-icon-size,16px)}.mee-field__icon-container{color:var(--field-icon-container-color,#969799);font-size:var(--field-icon-size,16px)}.mee-field__icon-container:empty{display:none}.mee-field__button{padding-left:var(--padding-xs,8px)}.mee-field__button:empty{display:none}.mee-field__error-message{color:var(--field-error-message-color,#ee0a24);display:block;font-size:var(--field-error-message-text-font-size,12px);text-align:left}.mee-field__error-message--center{text-align:center}.mee-field__error-message--right{text-align:right}.mee-field__word-limit{color:var(--field-word-limit-color,#646566);font-size:var(--field-word-limit-font-size,12px);line-height:var(--field-word-limit-line-height,16px);margin-top:var(--padding-base,4px);text-align:right}.mee-field__word-num{display:inline}.mee-field__word-num--full{color:var(--field-word-num-full-color,#ee0a24)}