cty-mui-core 1.0.37 → 1.0.39

package/dist/cjs/cty-canvas-video.cjs.entry.js

@@ -769,7 +769,7 @@ const CanvasVideo = class {
             }, onTransitionEnd: () => this.transitionend() }, index.h("div", { class: "cty-canvas-video__progress-inner" }))), !this.isVertical && this.isMove && !!this.progressBar && (index.h("div", { class: "cty-canvas-video__time" }, index.h("span", { class: "cty-canvas-video__time-left" }, this.transTime(this.pTime)), index.h("span", { class: "cty-canvas-video__time-center" }, "/"), index.h("span", { class: "cty-canvas-video__time-right" }, this.transTime(this.pDuration)))), !(!this.isVertical && this.isMove && !!this.progressBar) && (index.h("div", { class: "cty-canvas-video__content" }, option.renderSlot !== 'content' && (index.h("div", { class: "cty-canvas-video__content-box" }, index.h("div", { class: "cty-canvas-video__tip" }, index.h("cty-icon", { name: "cty-lamp" }), option[this._props.tip || 'tip']), index.h("p", { class: "cty-canvas-video__date" }, option[this._props.date || 'date']), index.h("p", { class: "cty-canvas-video__description" }, option[this._props.description || 'description']), index.h("button", { class: "cty-canvas-video__name cty-button-native", onClick: e => this.clickName(e) }, '@' + option[this._props.name || 'name']))), option.contentRender !== undefined && index.h("slot", { name: option.contentRender }))), !(!this.isVertical && this.isMove && !!this.progressBar) && (index.h("div", { class: "cty-canvas-video__sidebar" }, option.renderSlot !== 'sidebar' && (index.h("button", { class: "cty-canvas-video__avatar cty-button-native", onClick: e => this.clickAvatar(e) }, index.h("img", { src: option[this._props.avatar || 'avatar'] }), this.avatarButton && index.h("span", { class: "cty-canvas-video__avatar-button" }, this.avatarButton))), option.renderSlot !== 'sidebar' && option[this._props.likeCount || 'likeCount'] && (index.h("button", { class: "cty-canvas-video__sidebar-item cty-button-native", onClick: e => this.clickLike(e) }, index.h("cty-icon", { name: "cty-thumb" }), index.h("span", null, option[this._props.likeCount || 'likeCount']))), option.renderSlot !== 'sidebar' && option[this._props.viewCount || 'viewCount'] && (index.h("button", { class: "cty-canvas-video__sidebar-item cty-button-native" }, index.h("cty-icon", { name: "cty-eye" }), index.h("span", null, option[this._props.viewCount || 'viewCount']))), option.renderSlot !== 'sidebar' && option[this._props.collectCount || 'collectCount'] && (index.h("button", { class: "cty-canvas-video__sidebar-item cty-button-native", onClick: e => this.clickCollect(e) }, index.h("cty-icon", { name: "cty-star" }), index.h("span", null, option[this._props.collectCount || 'collectCount']))), option.sidebarRender !== 'sidebar' && (index.h("button", { class: "cty-canvas-video__sidebar-item cty-button-native", onClick: e => this.clickShare(e) }, index.h("cty-icon", { name: "cty-share" }), index.h("span", null, "\u5206\u4EAB"))), option.sidebarRender !== undefined && index.h("slot", { name: option.sidebarRender }))))));
     }
     render() {
-        return (index.h(index.Host, { key: 'c9247641307c3565f4162b4ac9527af5901f0d57', class: "cty-canvas-video" }, index.h("div", { key: '1064099a468d1cb4e1bfcbfcba86726c7b03a778', class: "cty-canvas-videos" }, index.h("video", { key: 'd07090531623c5def3b458f32882ecbd3f79d760', ref: el => (this.videoEl1 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate1(), onEnded: () => this.videoEnded(), src: this.videoUrl1, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 0 }), index.h("video", { key: '5a3cce01cf472b86a2fb57ec2c3152537cae51c3', ref: el => (this.videoEl2 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate2(), onEnded: () => this.videoEnded(), src: this.videoUrl2, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 1 }), index.h("video", { key: '10972bbb0330fe362e7182f672d09fcfbf8722f2', ref: el => (this.videoEl3 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate3(), onEnded: () => this.videoEnded(), src: this.videoUrl3, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 2 })), index.h("div", { key: '4970e44d666e586da384372056a835b226ab7529', class: "cty-canvas-video__slides", ref: el => (this.videoSlidesEl = el) }, this.renderSlide())));
+        return (index.h(index.Host, { key: 'f8c538c55322d321377e2126501c3050e822b3e2', class: "cty-canvas-video" }, index.h("div", { key: '21d4c6f094f8eeb9c96dced1a7487faae9c82ec4', class: "cty-canvas-videos" }, index.h("video", { key: 'da6db380316549fe168a05a75c4c8d735a965f8b', ref: el => (this.videoEl1 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate1(), onEnded: () => this.videoEnded(), src: this.videoUrl1, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 0 }), index.h("video", { key: 'cfc6431ea3c65228bff76cb5984b656d6ce1e607', ref: el => (this.videoEl2 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate2(), onEnded: () => this.videoEnded(), src: this.videoUrl2, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 1 }), index.h("video", { key: '9482762c33cecb5465f194e0f2ce571a3c3b12ec', ref: el => (this.videoEl3 = el), preload: this.preload, "x5-video-player-type": "h5", "x5-video-player-fullscreen": "true", playsinline: true, "webkit-playsinline": true, onTimeUpdate: () => this.videoTimeupdate3(), onEnded: () => this.videoEnded(), src: this.videoUrl3, typeof: "video/mp4", autoplay: this.autoplay && this.videoIndex == 2 })), index.h("div", { key: 'b32eb36ff437a1884eaa64ae94e09f39c288e5ee', class: "cty-canvas-video__slides", ref: el => (this.videoSlidesEl = el) }, this.renderSlide())));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-cascader-view.cjs.entry.js

@@ -110,13 +110,13 @@ const CascaderView = class {
     }
     render() {
         const levels = this.getLevels();
-        return (index.h(index.Host, { key: '02b0f40ab83b2f227be69ada8954abeb95ccd0ae', class: "cty-cascader-view" }, index.h("div", { key: '33be506937c8a4438a3002dad686e0680fdde965', class: "cty-cascader-tabs" }, levels.map((level, index$1) => (index.h("div", { class: {
+        return (index.h(index.Host, { key: '0e088b5852a0d7b895e1df2af144a5ba7b2627d2', class: "cty-cascader-view" }, index.h("div", { key: 'c587171c7a6a0860a7623c6ab7f0aa2ba1b564e5', class: "cty-cascader-tabs" }, levels.map((level, index$1) => (index.h("div", { class: {
                 'cty-cascader-tab': true,
                 'cty-cascader-tab-active': this.tabActiveIndex === index$1,
-            }, part: "tab-item", onClick: () => this.onTabChange(index$1) }, index.h("div", { class: "cty-cascader-header-title", ref: el => (this.tabRefs[index$1] = el) }, level.selected ? level.selected[this.props.label] : this.placeholder)))), index.h("div", { key: 'cfdf8e4d323feba09c2f869c9188e349c439d831', class: "cty-cascader-tab-underline", style: {
+            }, part: "tab-item", onClick: () => this.onTabChange(index$1) }, index.h("div", { class: "cty-cascader-header-title", ref: el => (this.tabRefs[index$1] = el) }, level.selected ? level.selected[this.props.label] : this.placeholder)))), index.h("div", { key: '514114f4fa21eae5fb109df308c44c0f4ea76d83', class: "cty-cascader-tab-underline", style: {
                 width: `${this.underlineWidth}px`,
                 transform: `translateX(${this.underlineLeft}px)`,
-            } })), index.h("div", { key: '67bbfb1a0b7df79506e672cc25582e63cabb499d', class: "cty-cascader-content" }, (() => {
+            } })), index.h("div", { key: '564a6c3b894182929571d48eca0ea6084d914062', class: "cty-cascader-content" }, (() => {
             const level = levels[this.tabActiveIndex];
             if (!level)
                 return null;

package/dist/cjs/cty-cascader.cjs.entry.js

@@ -396,7 +396,7 @@ const Cascader = class {
         this.ctyConfirm.emit({ values, indexes, options });
     }
     render() {
-        return (index.h(index.Host, { key: 'f77c6e1424f111bc8d37bd12b12070feb39101cf', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: '95b6eaafaf4803d2a86a5110855541ad67f6e49e', position: "bottom", backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: '572fceaf785626fac23dda2bce92bf5a6286d868', class: "cty-cascader", part: "cascader", onClick: (e) => e.stopPropagation() }, index.h("slot", { key: '0942125916bf919c0a65e5627331126afded4826', name: 'header' }), index.h("div", { key: 'd6df99527b420d74799fc46c0cc6bd705e1a8029', class: "cty-cascader-header", part: "header" }, index.h("button", { key: '62d51a685660ea3f72cb43ae86e11f95aa829359', onClick: () => this.dismiss(), class: "cancel cty-button-native" }, this.cancelText), index.h("div", { key: '4e24518a56ef746cbc8416817fa22d2bd64befbe', class: "cty-cascader-title" }, this.title), index.h("button", { key: 'bb2cd0c4f2300fb9880038e2e9ba516b1ec479b0', onClick: () => this.confirm(), class: "confirm cty-button-native" }, this.confirmText)), index.h("div", { key: 'eff01b56ebb0abeda07bab0ade1532f7555484b3', class: "cty-cascader-columns", part: "columns", style: { height: this.columnHeight + 'px' } }, this.scrollColumns.map(c => index.h("div", { class: "cty-cascader-column", onTouchStart: (e) => this.handleTouchstart(e, c), onTouchMove: (e) => this.handleTouchmove(e, c), onTouchEnd: () => this.handleTouchend(c), onMouseDown: (e) => this.handleTouchstart(e, c), onMouseMove: (e) => this.handleTouchmove(e, c), onMouseUp: () => this.handleTouchend(c) }, index.h("div", { ref: (el) => this.setScrollEl(el, c), class: "cty-cascader-scroller", style: { transform: 'translateY(' + c.translate + 'px)', 'transition-duration': c.duration + 'ms', 'transition-property': c.duration ? 'transform' : 'none' }, onTransitionEnd: () => this.handleTransitionend(c) }, c.column.map((option, i) => index.h("div", { class: 'cty-cascader-option ' + (option.className || ''), style: { height: this.optionHeight + 'px' }, onClick: () => this.handleClick(c, i) }, index.h("div", { class: 'cty-cascader-text ' + (option.textClassName || '') }, option[this.textKey])))))), index.h("div", { key: 'dbf1e0cb4fb9134316f93c6a3030237dde566f7b', class: "cty-cascader-picked", style: { top: this.center + 'px', height: this.optionHeight + 'px' } }), index.h("div", { key: '537c696af3cdb849c6beb2a8cd3d2dccb2921333', class: "cty-cascader-mask", style: { 'background-size': '100% ' + (this.columnHeight - this.optionHeight) / 2 + 'px' } }))))));
+        return (index.h(index.Host, { key: '97e5ba39b37f33da627e357ca5398b6aef2c203f', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: 'b1d162c9aec1551acd7c7b27109bc56f1920a085', position: "bottom", backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: '61fd570a4c6c6834931d560c8a7fd9f3b86fbaf3', class: "cty-cascader", part: "cascader", onClick: (e) => e.stopPropagation() }, index.h("slot", { key: 'ad35d68959c51871e694738e5f5c74667df19958', name: 'header' }), index.h("div", { key: 'c1f09c031b41362be4b1623370c16878b1c1a8dc', class: "cty-cascader-header", part: "header" }, index.h("button", { key: '4b59e5a0e7745dc2221a4043cd7685015c308a0c', onClick: () => this.dismiss(), class: "cancel cty-button-native" }, this.cancelText), index.h("div", { key: 'a338cb8c142934f2bf62125c7072245edd5ba7bf', class: "cty-cascader-title" }, this.title), index.h("button", { key: 'b19bfb4f26f7c4ec012a8c7e566e0885da677f92', onClick: () => this.confirm(), class: "confirm cty-button-native" }, this.confirmText)), index.h("div", { key: 'fbb92633280ca5d57b46fa7d2993962627a555df', class: "cty-cascader-columns", part: "columns", style: { height: this.columnHeight + 'px' } }, this.scrollColumns.map(c => index.h("div", { class: "cty-cascader-column", onTouchStart: (e) => this.handleTouchstart(e, c), onTouchMove: (e) => this.handleTouchmove(e, c), onTouchEnd: () => this.handleTouchend(c), onMouseDown: (e) => this.handleTouchstart(e, c), onMouseMove: (e) => this.handleTouchmove(e, c), onMouseUp: () => this.handleTouchend(c) }, index.h("div", { ref: (el) => this.setScrollEl(el, c), class: "cty-cascader-scroller", style: { transform: 'translateY(' + c.translate + 'px)', 'transition-duration': c.duration + 'ms', 'transition-property': c.duration ? 'transform' : 'none' }, onTransitionEnd: () => this.handleTransitionend(c) }, c.column.map((option, i) => index.h("div", { class: 'cty-cascader-option ' + (option.className || ''), style: { height: this.optionHeight + 'px' }, onClick: () => this.handleClick(c, i) }, index.h("div", { class: 'cty-cascader-text ' + (option.textClassName || '') }, option[this.textKey])))))), index.h("div", { key: '8e968e7accfba77c182c23f34fdb7f4eb5dd6e20', class: "cty-cascader-picked", style: { top: this.center + 'px', height: this.optionHeight + 'px' } }), index.h("div", { key: 'd00cf3538a16042826c872d618438b608c20168f', class: "cty-cascader-mask", style: { 'background-size': '100% ' + (this.columnHeight - this.optionHeight) / 2 + 'px' } }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-circle.cjs.entry.js

@@ -0,0 +1,82 @@
+'use strict';
+
+var index = require('./index-DCK462Hl.js');
+
+const circleCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}:host{display:inline-block;position:relative;width:100px;height:100px;--cty-circle-fill:none;--cty-circle-color:var(--cty-color-white);--cty-circle-linecap:round;--cty-circle-rotate:0deg;--cty-circle-text-color:var(--cty-color-primary);--cty-circle-text-size:var(--cty-font-size-base);--cty-circle-text-weight:normal;--cty-circle-text-line-height:20px}svg{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transform:rotate(var(--cty-circle-rotate));transform:rotate(var(--cty-circle-rotate))}path{fill:none}.cty-circle__layer{stroke:var(--cty-circle-color);fill:var(--cty-circle-fill)}.cty-circle__hover{stroke-linecap:var(--cty-circle-linecap)}.cty-circle__text{position:absolute;top:50%;left:0;width:100%;color:var(--cty-circle-text-color);font-weight:var(--cty-circle-text-weight);font-size:var(--cty-circle-text-size);line-height:var(--cty-circle-text-line-height);text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%)}";
+
+const Circle = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.rate = 0;
+        this.width = 40;
+        this.color = 'var(--cty-color-primary)';
+        this.text = '';
+        this.clockwise = true;
+        this.zeroTransparent = true;
+        this.rad = 500;
+        this.ratio = 1;
+        this.widthDif = 1;
+        this.offset = 0;
+        this.needDefs = false;
+        this.gradientId = '';
+        this.colors = [];
+        this.perimeter = 0;
+    }
+    watchColorHandler() {
+        this.needDefs = this.color instanceof Object;
+        if (this.needDefs) {
+            this.colors = Object.keys(this.color).sort((a, b) => parseFloat(a) - parseFloat(b)).map((key) => ({
+                offset: key.toString(),
+                color: this.color[key]
+            }));
+            this.updateSVGAttr();
+        }
+    }
+    watchRadHandler() {
+        this.perimeter = 2 * 3.14 * this.rad;
+        this.updateSVGAttr();
+    }
+    updateSVGAttr() {
+        var _a, _b, _c, _d;
+        (_a = this.svgEl) === null || _a === void 0 ? void 0 : _a.setAttribute('viewBox', `0 0 ${+this.width + this.rad * 2 + this.offset * 2} ${+this.width + this.rad * 2 + this.offset * 2}`);
+        (_b = this.layerEl) === null || _b === void 0 ? void 0 : _b.setAttribute('d', this._getPath());
+        (_c = this.hoverEl) === null || _c === void 0 ? void 0 : _c.setAttribute('d', this._getPath());
+        Array.from(((_d = this.svgEl) === null || _d === void 0 ? void 0 : _d.querySelectorAll('stop')) || []).forEach((stopEL, index) => {
+            stopEL.setAttribute('key', index.toString());
+            stopEL.setAttribute('offset', this.colors[index].offset);
+            stopEL.setAttribute('stop-color', this.colors[index].color);
+        });
+    }
+    componentWillLoad() {
+        this.perimeter = 2 * 3.14 * this.rad;
+        this.gradientId = 'cty-circle-' + Math.random().toFixed(12).slice(2);
+        this.watchColorHandler();
+    }
+    componentDidLoad() {
+        this.updateSVGAttr();
+    }
+    _getPath() {
+        const { rad, width, offset, clockwise } = this;
+        const viewBoxSize = +width + rad * 2 + offset * 2;
+        const sweepFlag = clockwise ? 1 : 0;
+        return `M ${viewBoxSize / 2} ${viewBoxSize / 2} m 0, ${-rad} a ${rad}, ${rad} 0 1, ${sweepFlag} 0, ${rad * 2} a ${rad}, ${rad} 0 1, ${sweepFlag} 0, ${-rad * 2}`;
+    }
+    render() {
+        return (index.h(index.Host, { key: '2f368270af4614789d5598e5bc90b3e2ef057989', class: "cty-circle" }, index.h("svg", { key: '1df0553171d9fec249e84cf41f710826f49b3026', ref: el => (this.svgEl = el) }, this.needDefs && index.h("defs", { key: 'd57f574b35bbf69c57fc40803f3f7fb9acbcf9a9' }, index.h("linearGradient", { key: 'cf43aa12f3d51cf6a243f9638de9dedf2257280a', id: this.gradientId, x1: "100%", y1: "0%", x2: "0%", y2: "0%", gradientTransform: "rotate(90)" }, this.colors.map(() => (index.h("stop", null))))), index.h("path", { key: 'b5f534ab0dae045ee9d90f7dc9ca7781858e75f7', ref: el => (this.layerEl = el), class: "cty-circle__layer", style: {
+                'stroke-width': this.width + 'px',
+                'strokeDasharray': (this.ratio * this.perimeter) + 'px ' + this.perimeter + 'px'
+            } }), index.h("path", { key: 'c0e0e7bde4ee4218d369f0a68c45bdcc41b9bf6f', ref: el => (this.hoverEl = el), class: "cty-circle__hover", style: {
+                'stroke': this.rate <= 0 && this.zeroTransparent ? 'transparent' : this.needDefs ? 'url(#' + this.gradientId + ')' : this.color,
+                'stroke-width': +this.width + this.widthDif + 'px',
+                'strokeDasharray': (this.ratio * this.rate / 100 * this.perimeter) + 'px ' + this.perimeter + 'px'
+            } })), this.text !== '' && index.h("div", { key: '87e72df56f972317345f50b3b7e82ff002df5048', class: "cty-circle__text" }, this.text), index.h("slot", { key: '269615587b996b6dc54c2a3390a0ef47ff08fb4c' })));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "color": ["watchColorHandler"],
+        "rad": ["watchColorHandler", "watchRadHandler"]
+    }; }
+};
+Circle.style = circleCss;
+
+exports.cty_circle = Circle;

package/dist/cjs/cty-count-down.cjs.entry.js

@@ -143,8 +143,8 @@ const CountDown = class {
         return timeText;
     }
     render() {
-        return (index.h(index.Host, { key: '2f81e4f12a44af17c35088f25634497f32abc9c5', class: "cty-count-down" }, !this.isSingle &&
-            this.timeRange.map((item, idx) => (index.h("div", { class: "cty-count-down__item", part: "item" }, index.h("span", { class: "cty-count-down__label", part: "label" }, format.pad(this.timeData[item], 2) || this.timeData[item]), (this.unit || idx !== this.timeRange.length - 1) && index.h("span", { class: "cty-count-down__unit" }, this.unit ? this.dateFormatUnit[item] : ':')))), this.isSingle && (index.h("div", { key: 'fafb431baf155e6ddb6d9288b2fcb28cc4afc50f', class: "cty-count-down__item", part: "item" }, index.h("span", { key: '7c5e49d9a4e4459c7804afd8e6c7c1fd21d91892', class: "cty-count-down__label", part: "label" }, " ", this.formattedTime, " "))), index.h("slot", { key: '7a60d356c17a00eb9700e034fe20efc9f0b16398' })));
+        return (index.h(index.Host, { key: 'd2d208764379ab3b71735d5d171020fb423a71bd', class: "cty-count-down" }, !this.isSingle &&
+            this.timeRange.map((item, idx) => (index.h("div", { class: "cty-count-down__item", part: "item" }, index.h("span", { class: "cty-count-down__label", part: "label" }, format.pad(this.timeData[item], 2) || this.timeData[item]), (this.unit || idx !== this.timeRange.length - 1) && index.h("span", { class: "cty-count-down__unit" }, this.unit ? this.dateFormatUnit[item] : ':')))), this.isSingle && (index.h("div", { key: 'd2736b2880e5a30d7ecb9d4ee94049dfc4fa82d0', class: "cty-count-down__item", part: "item" }, index.h("span", { key: '97ee81f41d93a9c1dfc1cda655f820193eec9524', class: "cty-count-down__label", part: "label" }, " ", this.formattedTime, " "))), index.h("slot", { key: '5d87201788959f4858f432e72be3cff75b7c081e' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/cty-divider.cjs.entry.js

@@ -18,10 +18,10 @@ const Divider = class {
     render() {
         const { vertical, placement, hasContent } = this;
         const classRet = vertical ? `cty-divider__vertical` : hasContent ? `cty-divider__content-${placement}` : ``;
-        return (index.h(index.Host, { key: 'b9d087dcfbc973c32966363e2db037fafe7ceb78', class: {
+        return (index.h(index.Host, { key: 'dfd49737a845112f77896befa6ac9926a1951f48', class: {
                 'cty-divider': true,
                 [classRet]: true
-            } }, index.h("slot", { key: 'ee440ec8f5ff56d81bde3d950e4c78d42219582c' })));
+            } }, index.h("slot", { key: '8799145031bc0605e950b4f9d3cb6632d65fd54e' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/cty-dropdown.cjs.entry.js

@@ -100,24 +100,24 @@ const Dropdown = class {
     }
     render() {
         const { elRect, innerOptions, tabActiveIndex, arrowIcon, innerValue, direction } = this;
-        return (index.h(index.Host, { key: '5cd075db391b80bff2c3802c5864ffe76b9931c2', class: {
+        return (index.h(index.Host, { key: '8bafea86f2e4f369aa9c91c53b53d5bda24429c6', class: {
                 'cty-dropdown': true,
                 'cty-dropdown-open': tabActiveIndex !== -1,
-            } }, index.h("div", { key: 'fbf91dbc7e7636adadcdabc7751dd74582e293cd', class: "cty-dropdown-nav" }, innerOptions.map((option, index$1) => (index.h("div", { class: {
+            } }, index.h("div", { key: '53b674e74ef38333347878e6d24f55d082822e4c', class: "cty-dropdown-nav" }, innerOptions.map((option, index$1) => (index.h("div", { class: {
                 'cty-dropdown-item': true,
                 'cty-dropdown-item__disabled': !!option.disabled,
                 'cty-dropdown-item__active': index$1 === tabActiveIndex,
             }, onClick: () => this.toggleNavPop(index$1) }, index.h("div", { class: "cty-dropdown-item-title flex-center" }, index.h("span", { class: "cty-dropdown-item-title-text" }, option.label), index.h("span", { class: {
                 'cty-dropdown-item-title-arrow': true,
                 'cty-dropdown-item-title-arrow__active': index$1 === tabActiveIndex,
-            } }, index.h("cty-icon", { name: option.arrowIcon || arrowIcon }))))))), index.h("div", { key: '11c4c8c68c670c92ae86af2e105969b2daffdd6e', class: {
+            } }, index.h("cty-icon", { name: option.arrowIcon || arrowIcon }))))))), index.h("div", { key: '70758a011ed538e3a9215bf6a00431ba99f4cbad', class: {
                 'cty-dropdown-popup': true,
                 'cty-dropdown-popup__visible': tabActiveIndex != -1,
             }, style: {
                 top: `${direction == 'up' ? 0 : elRect.bottom}px`,
                 bottom: `${direction == 'up' ? 'auto' : 0}`,
                 height: `${direction == 'up' ? `${elRect.top}px` : 'auto'}`
-            } }, index.h("div", { key: 'f7f816b8237b11c4a46a08fc474e5a6ffa35ca46', class: "cty-dropdown-popup-mask", onClick: this.handleMaskClick }), index.h("div", { key: '73a5db305846157a312f197045cfb1fa2f221a0c', class: "cty-dropdown-popup-body", style: { bottom: `${direction == 'up' ? '0px' : 'auto'}` } }, innerOptions.map((option, index$1) => {
+            } }, index.h("div", { key: 'd7212399b2011a0ae339c742cea1affd0697050a', class: "cty-dropdown-popup-mask", onClick: this.handleMaskClick }), index.h("div", { key: '1a774b0f33129111ad07eccbe1ec137f59512ffc', class: "cty-dropdown-popup-body", style: { bottom: `${direction == 'up' ? '0px' : 'auto'}` } }, innerOptions.map((option, index$1) => {
             if (index$1 != tabActiveIndex)
                 return null;
             return (index.h("slot", { name: "content" }, index.h("div", { class: "cty-dropdown-popup-content" }, option.children && Array.isArray(option.children) && option.children.map((child, index$1) => (index.h("slot", { name: 'content-item' + index$1 }, index.h("div", { class: { 'cty-dropdown-popup-item': true, "cty-dropdown-popup-item__active": innerValue[tabActiveIndex] == child.key }, onClick: () => this.handleItemClick(child) }, child.label)))))));

package/dist/cjs/cty-empty.cjs.entry.js

@@ -12,7 +12,7 @@ const Empty = class {
     }
     render() {
         const image = this.image === undefined ? (config.config.get('resUrlPrefix', '') + 'assets/cty_res/svg/cty-no-data.svg') : this.image;
-        return (index.h(index.Host, { key: '4eb56b280eeb9f0fbe4b67cd71a558cf0f0bc7e2', class: "cty-empty" }, index.h("slot", { key: '241e56e654739d1edb6af501f37652ffd07d834e', name: "top" }), image && index.h("img", { key: '429d88a5b6b0c24b6db1e877afb514189fb26eb5', class: "cty-empty__image", src: image }), index.h("slot", { key: '41e9cfc4948a4a72dbf83d992db62bba8269781c', name: "image" }), this.description && index.h("p", { key: '4cb5825ef8ad176b427d14595d8892cae299fdc1', class: "cty-empty__description" }, this.description), index.h("slot", { key: 'f0b31f8bdd3749419cb11d776191169b1f692b7c', name: "description" })));
+        return (index.h(index.Host, { key: 'd3c212326854e78a39d572a26ad41bea325c281a', class: "cty-empty" }, index.h("slot", { key: '99cd7aed9db5764d586d5e51fca62ce44c20d6d3', name: "top" }), image && index.h("img", { key: 'f35737267d6e8f89c288acff429c76168f48117f', class: "cty-empty__image", src: image }), index.h("slot", { key: '47c776265f6db9018f2161e5ccddee5b03c511d2', name: "image" }), this.description && index.h("p", { key: '974e5071b52337bd6e2304b6dabbc34ea0aa0455', class: "cty-empty__description" }, this.description), index.h("slot", { key: '86322cbea30f876cbd774c6cf291d2ee7a650c29', name: "description" })));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return index.getElement(this); }

package/dist/cjs/cty-floating-bubble.cjs.entry.js

@@ -146,7 +146,7 @@ const FloatingBubble = class {
         return touch;
     }
     render() {
-        return (index.h(index.Host, { key: 'e0ec234a20abec0ba7294d31656bfbc89f8974ff', class: "cty-floating-bubble", onTouchStart: () => this.onTouchStart(), onTouchMove: (e) => this.onTouchMove(e), onTouchEnd: (e) => this.onTouchEnd(e), onTouchCancel: (e) => this.onTouchEnd(e), onMouseDown: () => this.onTouchStart(), onMouseMove: (e) => this.onTouchMove(e), onMouseUp: (e) => this.onTouchEnd(e), onMouseLeave: (e) => this.onTouchEnd(e), onClick: (e) => this.onClick(e), style: this.rootStyle }, this.icon && (index.h("cty-icon", { key: '84dd9f24811481d7a513d10242deecc7678a2255', class: "cty-floating-bubble__icon", name: this.icon })), index.h("slot", { key: 'bc7ea18aa26283be64dd255b78f3df8010bc577d' })));
+        return (index.h(index.Host, { key: '97cb474b7ab53050d951abbcfc30690a7e023748', class: "cty-floating-bubble", onTouchStart: () => this.onTouchStart(), onTouchMove: (e) => this.onTouchMove(e), onTouchEnd: (e) => this.onTouchEnd(e), onTouchCancel: (e) => this.onTouchEnd(e), onMouseDown: () => this.onTouchStart(), onMouseMove: (e) => this.onTouchMove(e), onMouseUp: (e) => this.onTouchEnd(e), onMouseLeave: (e) => this.onTouchEnd(e), onClick: (e) => this.onClick(e), style: this.rootStyle }, this.icon && (index.h("cty-icon", { key: 'e52b2c3c36f9eb49bf6205e7165184f9dc8d812e', class: "cty-floating-bubble__icon", name: this.icon })), index.h("slot", { key: 'd1b5b73767f2178bbe8386574623c07d2d7ab120' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/cty-floating-panel.cjs.entry.js

@@ -5,7 +5,7 @@ var dom = require('./dom-B8PDM5o-.js');
 var utils = require('./utils-C8Ez-9Oe.js');
 var index$1 = require('./index-DASUhQA3.js');
 
-const floatingPanelCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}.flex{display:-ms-flexbox;display:flex}.flex-wrap{display:-ms-flexbox;display:flex;-ms-flex-flow:wrap;flex-flow:wrap}.flex-align-start{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.flex-align-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.flex-align-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end}.flex-justify-start{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}.flex-justify-center{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.flex-justify-end{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}.flex-align-end-start{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:start;justify-content:flex-start}.flex-align-end-center{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}.flex-align-end-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:end;justify-content:flex-end}.flex-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-center-justify-end{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}.flex-between{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.flex-center-between{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}.flex-column{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}.flex-column-align-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center}.flex-column-justify-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:center;justify-content:center}.flex-column-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-column-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:justify;justify-content:space-between}.flex-column-center-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host{--cty-floating-panel-content-background:var(--cty-color-white);--cty-floating-panel-header-height:30px;--cty-floating-panel-bar-width:30px;--cty-floating-panel-bar-color:var(--cty-text-color-primary);position:fixed;z-index:10;bottom:0;left:0;width:100%;background-color:var(--cty-color-white);border-radius:var(--cty-border-radius-round) var(--cty-border-radius-round) 0 0;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:cubic-bezier(0.18, 0.89, 0.32, 1.28);transition-timing-function:cubic-bezier(0.18, 0.89, 0.32, 1.28)}:host::after{content:\"\";display:block;position:absolute;bottom:-100vh;height:100vh;width:100vw;background-color:inherit}.cty-floating-panel__header{width:100%;height:var(--cty-floating-panel-header-height);cursor:pointer}.cty-floating-panel__header-bar{font-size:var(--cty-floating-panel-bar-width);color:var(--cty-floating-panel-bar-color)}.cty-floating-panel__content{-ms-flex:1;flex:1;overflow-y:auto;width:100%;background:var(--cty-floating-panel-content-background)}";
+const floatingPanelCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}.flex{display:-ms-flexbox;display:flex}.flex-wrap{display:-ms-flexbox;display:flex;-ms-flex-flow:wrap;flex-flow:wrap}.flex-align-start{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.flex-align-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.flex-align-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end}.flex-justify-start{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}.flex-justify-center{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.flex-justify-end{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}.flex-align-end-start{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:start;justify-content:flex-start}.flex-align-end-center{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}.flex-align-end-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:end;justify-content:flex-end}.flex-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-center-justify-end{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}.flex-between{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.flex-center-between{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}.flex-column{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}.flex-column-align-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center}.flex-column-justify-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:center;justify-content:center}.flex-column-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-column-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:justify;justify-content:space-between}.flex-column-center-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host{--cty-floating-panel-content-background:var(--cty-color-white);--cty-floating-panel-header-height:30px;--cty-floating-panel-bar-width:30px;--cty-floating-panel-bar-color:var(--cty-text-color-primary);position:fixed;z-index:10;bottom:0;left:0;width:100%;background-color:var(--cty-color-white);border-radius:var(--cty-border-radius-round) var(--cty-border-radius-round) 0 0;-webkit-transition-property:none;transition-property:none;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:cubic-bezier(0.18, 0.89, 0.32, 1.28);transition-timing-function:cubic-bezier(0.18, 0.89, 0.32, 1.28)}:host::after{content:\"\";display:block;position:absolute;bottom:-100vh;height:100vh;width:100vw;background-color:inherit}.cty-floating-panel__header{width:100%;height:var(--cty-floating-panel-header-height);cursor:pointer}.cty-floating-panel__header-bar{font-size:var(--cty-floating-panel-bar-width);color:var(--cty-floating-panel-bar-color)}.cty-floating-panel__content{-ms-flex:1;flex:1;overflow-y:auto;width:100%;background:var(--cty-floating-panel-content-background)}";
 
 const FloatingPanel = class {
     constructor(hostRef) {
@@ -98,15 +98,15 @@ const FloatingPanel = class {
         return moveY;
     }
     render() {
-        return (index.h(index.Host, { key: 'f2cf5536d268f54f0ec3683afabb99dc10459f52', class: "cty-floating-panel flex-column", onTouchStart: (e) => this.dragStart(e), onTouchMove: (e) => this.dragMove(e), onTouchEnd: () => this.dragEnd(), onMouseDown: (e) => this.dragStart(e), onMouseMove: (e) => this.dragMove(e), onMouseUp: () => this.dragEnd() }, index.h("div", { key: '00f3f71ee575b3205f1b6c6bc83e9a332a41600c', class: "cty-floating-panel__header flex-center", onTouchStart: () => {
+        return (index.h(index.Host, { key: '84e095dd2833d15ab639424b2223afb62bcd5e98', class: "cty-floating-panel flex-column", onTouchStart: (e) => this.dragStart(e), onTouchMove: (e) => this.dragMove(e), onTouchEnd: () => this.dragEnd(), onMouseDown: (e) => this.dragStart(e), onMouseMove: (e) => this.dragMove(e), onMouseUp: () => this.dragEnd() }, index.h("div", { key: '8cafd61f7a921d19396803366fcaddef9dc1ebe4', class: "cty-floating-panel__header flex-center", onTouchStart: () => {
                 this.setContentTouched(false);
             }, onMouseDown: () => {
                 this.setContentTouched(false);
-            } }, index.h("slot", { key: 'a2c0b49cdf13aefc8d82442e6ae4caae6ddb7bf1', name: "icon-start" }), this.icon && index.h("cty-icon", { key: '33b43106ced47e3a46a0b4e34284ff042bcae596', class: "cty-floating-panel__header-bar", name: this.icon }), index.h("slot", { key: '185bcb4c5d3e3b1dd6b841ce89ffe5c478ca40f7', name: "icon-end" })), index.h("div", { key: '60791d76b61410d85f4e34601a47dd22bd8a5f1b', class: "cty-floating-panel__content", ref: (el) => (this.contentRef = el), onTouchStart: () => {
+            } }, index.h("slot", { key: '3a02e10265abb6a0e033ff3ce6b2f036895b93e6', name: "icon-start" }), this.icon && index.h("cty-icon", { key: 'd07f4568b56789c94bce86ef03d4a09c761e9982', class: "cty-floating-panel__header-bar", name: this.icon }), index.h("slot", { key: '6f6433977a63eef657904e97dbb62c47ec7588b2', name: "icon-end" })), index.h("div", { key: '1e8dd947664b007cd3cf65d338765deca37b6873', class: "cty-floating-panel__content", ref: (el) => (this.contentRef = el), onTouchStart: () => {
                 this.setContentTouched(true);
             }, onMouseDown: () => {
                 this.setContentTouched(true);
-            } }, index.h("slot", { key: 'd84ff597db9ec40cb588e306dbf6a87b658d0078' }))));
+            } }, index.h("slot", { key: 'b2e668b305866b48ca8ab522c714e648755fdafd' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/cty-icon.cjs.entry.js

@@ -39,7 +39,7 @@ const Icon = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'a76d38557cc02e2ed4655a270b160b2d1b4e00d8', class: "cty-icon" }, index.h("ion-icon", { key: 'f0ca1789733155e91316be5a287d34ff6ce7bfa9', src: this._src || undefined, name: this._name || undefined, icon: this._icon || null, size: this.size, color: this.color, lazy: this.lazy, flipRtl: this.flipRtl, sanitize: this.sanitize })));
+        return (index.h(index.Host, { key: '03ee82eb0f6aae454d57b5f3c09c4188c72e7a69', class: "cty-icon" }, index.h("ion-icon", { key: 'e31b63f0721af3ade7af2ae7bd6f4cfc3e6e15d1', src: this._src || undefined, name: this._name || undefined, icon: this._icon || null, size: this.size, color: this.color, lazy: this.lazy, flipRtl: this.flipRtl, sanitize: this.sanitize })));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return index.getElement(this); }

package/dist/cjs/cty-image-upload.cjs.entry.js

@@ -94,7 +94,7 @@ const ImageUpload = class {
         this.ctyDeleteImage.emit(this.internalImages);
     }
     render() {
-        return (index.h(index.Host, { key: 'c74ff7c9782bd2d28df239249336aab72814307e', class: "cty-image-upload flex-wrap" }, this.internalImages.map((item, idx) => (index.h("div", { class: "cty-image-upload__item", onClick: () => this.handleImageTap(idx) }, index.h("img", { class: "cty-image-upload__item-img", src: item.url, style: { 'object-fit': item.fit } }), this.deleteable && (index.h("div", { class: "cty-image-upload__item-delete flex", onClick: e => this.handleImageDelete(e, idx) }, index.h("slot", { name: "deleteable" }, index.h("cty-icon", { class: "cty-image-upload__item-delete-icon", name: "cty-close2" }))))))), this.internalImages.length < this.count && (index.h("div", { key: 'bc2aca9606226e308fac0da596d9aa7d57c0cdc9', class: "cty-image-upload__item flex-column-center", onClick: () => this.handlePickerImage() }, !this.addImage && this.addIcon && index.h("cty-icon", { key: '71a7f9080d66c77ca6a13e85f442209f7c0ea42f', class: "cty-image-upload__add-icon", name: this.addIcon }), this.addImage && index.h("img", { key: '86c409c6007ab662098dd1c35d437e7b4ccf5192', class: "cty-image-upload__add-image", src: this.addImage }), index.h("slot", { key: '85eddf095240e759f6e8039b443da1b62e8cb206', name: "description" })))));
+        return (index.h(index.Host, { key: '6e38c0e2603eb6d73e3987bb7b1e39533a427667', class: "cty-image-upload flex-wrap" }, this.internalImages.map((item, idx) => (index.h("div", { class: "cty-image-upload__item", onClick: () => this.handleImageTap(idx) }, index.h("img", { class: "cty-image-upload__item-img", src: item.url, style: { 'object-fit': item.fit } }), this.deleteable && (index.h("div", { class: "cty-image-upload__item-delete flex", onClick: e => this.handleImageDelete(e, idx) }, index.h("slot", { name: "deleteable" }, index.h("cty-icon", { class: "cty-image-upload__item-delete-icon", name: "cty-close2" }))))))), this.internalImages.length < this.count && (index.h("div", { key: 'bce30f336e45c86a516d0eee56e74ce9b56d86a1', class: "cty-image-upload__item flex-column-center", onClick: () => this.handlePickerImage() }, !this.addImage && this.addIcon && index.h("cty-icon", { key: '6a9074c16b643bf53567bb50d6e38ed295556c9e', class: "cty-image-upload__add-icon", name: this.addIcon }), this.addImage && index.h("img", { key: 'a65c1c2ea4f9b2b415ff5f59cdb7c7b3d549b3d8', class: "cty-image-upload__add-image", src: this.addImage }), index.h("slot", { key: '1aa5b77ea858ed1cc44347754274b81d800e8be9', name: "description" })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-image-viewer_6.cjs.entry.js

@@ -16,7 +16,7 @@ require('./index-D3mJ1Cix.js');
 require('./index-CH3IFTaK.js');
 require('./platform-DJmEyHMN.js');
 
-const imageViewerCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}.cty-button-native{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin:0;padding:0;background:transparent;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;line-height:1;border:0;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;-webkit-box-shadow:none;box-shadow:none;cursor:pointer}:host{--cty-image-viewer-overlay-position:fixed;--cty-image-viewer-overlay-z-index:10;--cty-image-viewer-overlay-background:var(--cty-color-black);--cty-image-viewer-overlay-width:100vw;--cty-image-viewer-overlay-height:100vh;--cty-image-viewer-header-padding-top:var(--ion-safe-area-top, 44px);--cty-image-viewer-pager-padding:0;--cty-image-viewer-pager-index-color:var(--cty-text-color-white);--cty-image-viewer-pager-color:var(--cty-text-color-white);--cty-image-viewer-pager-font-size:var(--cty-font-size-extra-small);--cty-image-viewer-pager-align:center;--cty-image-viewer-pager-font-weight:600;--cty-image-viewer-pager-line-height:44px;--cty-image-viewer-pager-font-style:initial;--cty-image-viewer-close-offset-bottom:12px;--cty-image-viewer-close-offset-right:12px;--cty-image-viewer-close-color:var(--cty-text-color-white);--cty-image-viewer-close-size:20px;--cty-image-viewer-image-width:100%;--cty-image-viewer-image-height:auto}:host(.overlay-hidden){display:none}cty-backdrop{position:var(--cty-image-viewer-overlay-position);z-index:var(--cty-image-viewer-overlay-z-index);background:var(--cty-image-viewer-overlay-background);width:var(--cty-image-viewer-overlay-width);height:var(--cty-image-viewer-overlay-height)}.cty-image-viewer{position:relative;width:100%;height:100%}.cty-image-preview__header{position:absolute;z-index:2;top:0;left:0;width:100%;min-height:calc(var(--cty-image-viewer-header-padding-top) + var(--cty-image-viewer-pager-line-height));padding-top:var(--cty-image-viewer-header-padding-top)}.cty-image-preview__pager{padding:var(--cty-image-viewer-pager-padding);text-align:var(--cty-image-viewer-pager-align);line-height:var(--cty-image-viewer-pager-line-height);font-weight:var(--cty-image-viewer-pager-font-weight);font-size:var(--cty-image-viewer-pager-font-size);font-style:var(--cty-image-viewer-pager-font-style);color:var(--cty-image-viewer-pager-color)}.cty-image-preview__index{color:var(--cty-image-viewer-pager-index-color)}.cty-image-preview__close{position:absolute;bottom:var(--cty-image-viewer-close-offset-bottom);right:var(--cty-image-viewer-close-offset-right);font-size:var(--cty-image-viewer-close-size);color:var(--cty-image-viewer-close-color)}cty-swiper{--cty-swiper-img-width:var(--cty-image-viewer-image-width);--cty-swiper-img-height:var(--cty-image-viewer-image-height)}";
+const imageViewerCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}.cty-button-native{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin:0;padding:0;background:transparent;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;line-height:1;border:0;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;-webkit-box-shadow:none;box-shadow:none;cursor:pointer}.flex{display:-ms-flexbox;display:flex}.flex-wrap{display:-ms-flexbox;display:flex;-ms-flex-flow:wrap;flex-flow:wrap}.flex-align-start{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.flex-align-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.flex-align-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end}.flex-justify-start{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}.flex-justify-center{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.flex-justify-end{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}.flex-align-end-start{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:start;justify-content:flex-start}.flex-align-end-center{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}.flex-align-end-end{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:end;justify-content:flex-end}.flex-center{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-center-justify-end{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}.flex-between{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.flex-center-between{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}.flex-column{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}.flex-column-align-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center}.flex-column-justify-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:center;justify-content:center}.flex-column-center{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.flex-column-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:justify;justify-content:space-between}.flex-column-center-between{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host{--cty-image-viewer-overlay-position:fixed;--cty-image-viewer-overlay-z-index:10;--cty-image-viewer-overlay-background:var(--cty-color-black);--cty-image-viewer-overlay-width:100vw;--cty-image-viewer-overlay-height:100vh;--cty-image-viewer-header-padding-top:var(--ion-safe-area-top, 44px);--cty-image-viewer-pager-padding:0;--cty-image-viewer-pager-index-color:var(--cty-text-color-white);--cty-image-viewer-pager-color:var(--cty-text-color-white);--cty-image-viewer-pager-font-size:var(--cty-font-size-extra-small);--cty-image-viewer-pager-align:center;--cty-image-viewer-pager-font-weight:600;--cty-image-viewer-pager-min-height:44px;--cty-image-viewer-pager-font-style:initial;--cty-image-viewer-close-offset-bottom:12px;--cty-image-viewer-close-offset-right:12px;--cty-image-viewer-close-color:var(--cty-text-color-white);--cty-image-viewer-close-size:20px;--cty-image-viewer-image-width:100%;--cty-image-viewer-image-height:auto}:host(.overlay-hidden){display:none}cty-backdrop{position:var(--cty-image-viewer-overlay-position);z-index:var(--cty-image-viewer-overlay-z-index);background:var(--cty-image-viewer-overlay-background);width:var(--cty-image-viewer-overlay-width);height:var(--cty-image-viewer-overlay-height)}.cty-image-viewer{position:relative;width:100%;height:100%}.cty-image-viewer__hidden{opacity:0}.cty-image-preview__header{position:absolute;z-index:2;top:0;left:0;width:100%;min-height:calc(var(--cty-image-viewer-header-padding-top) + var(--cty-image-viewer-pager-line-height));padding-top:var(--cty-image-viewer-header-padding-top)}.cty-image-preview__pager{padding:var(--cty-image-viewer-pager-padding);text-align:var(--cty-image-viewer-pager-align);min-height:var(--cty-image-viewer-pager-min-height);font-weight:var(--cty-image-viewer-pager-font-weight);font-size:var(--cty-image-viewer-pager-font-size);font-style:var(--cty-image-viewer-pager-font-style);color:var(--cty-image-viewer-pager-color)}.cty-image-preview__pager-text{width:var(--cty-image-viewer-pager-text-width, auto);padding:var(--cty-image-viewer-pager-text-padding, 0);background:var(--cty-image-viewer-pager-text-bg, transparent);border-radius:var(--cty-image-viewer-pager-text-border-radius, 0);border:var(--cty-image-viewer-pager-text-border, none);font-size:inherit;color:inherit;font-weight:inherit;line-height:var(--cty-image-viewer-pager-text-line-height, 1)}.cty-image-preview__index{color:var(--cty-image-viewer-pager-index-color)}.cty-image-preview__close{position:absolute;bottom:var(--cty-image-viewer-close-offset-bottom);right:var(--cty-image-viewer-close-offset-right);padding:var(--cty-image-viewer-close-padding, 0);border-radius:var(--cty-image-viewer-close-border-radius, 0);border:var(--cty-image-viewer-close-border, none);background:var(--cty-image-viewer-close-bg, transparent);font-size:var(--cty-image-viewer-close-size);color:var(--cty-image-viewer-close-color)}cty-swiper{--cty-swiper-img-width:var(--cty-image-viewer-image-width);--cty-swiper-img-height:var(--cty-image-viewer-image-height)}";
 
 const ImageViewer = class {
     constructor(hostRef) {
@@ -46,6 +46,7 @@ const ImageViewer = class {
         this.root = 'default';
         this.animated = false;
         this.activeIndex = 0;
+        this.initialized = false;
     }
     triggerChanged() {
         const { trigger, el, triggerController } = this;
@@ -95,7 +96,10 @@ const ImageViewer = class {
                 }
                 swiper === null || swiper === void 0 ? void 0 : swiper.zoom.enable();
                 swiper.update();
-            }, 0);
+                setTimeout(() => {
+                    this.initialized = true;
+                }, 150);
+            }, 200);
         }
         catch (error) {
         }
@@ -108,16 +112,16 @@ const ImageViewer = class {
         return this.swiperEl.slideTo(index, speed);
     }
     render() {
-        const { images, speed, loop, zoom, attrs } = this;
+        const { images, speed, loop, zoom, attrs, initialized } = this;
         const swiperAttrs = {
             swipers: images,
             speed,
             loop,
             pagination: false,
             autoplay: false,
-            attrs: Object.assign({ zoom }, attrs)
+            attrs: Object.assign({ virtual: true, zoom }, attrs)
         };
-        return (index.h(index.Host, { key: '9cfd4cb9bc77162cd93c30da4dd3047a32751704', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden cty-pos-cover': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: '9b52a934cc16248bb26e9dae42a4f5b259eb60a0', backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: 'c7f9cd031822bc4b10dd7d11bec2701b1427ce84', class: "cty-image-viewer" }, index.h("slot", { key: '202457c1e05d77f3637ea3b477e13e6fa4a3ce9b', name: 'start' }), (this.closeable || this.pager || !this.backdropDismiss) && index.h("div", { key: 'eab832efec28a9f32a81a519bd498a41c5d0a237', class: "cty-image-preview__header", onClick: (e) => e.stopPropagation() }, this.pager && index.h("slot", { key: '235c46cb4a84eb9606e7599e12a701c24b0f8608', name: "pager" }, index.h("h6", { key: 'e4fcdd5c3b36ff06baafdc139a3aa44583f45657', class: "cty-image-preview__pager" }, index.h("span", { key: '66992955313486d30b9fa93c3f299babd2931f1c', class: "cty-image-preview__index" }, this.activeIndex + 1), " / ", this.images.length)), (this.closeable || !this.backdropDismiss) && index.h("slot", { key: '91b5c3c7ebd70c7d3ecb012c329734546ad4ca92', name: "close" }, index.h("button", { key: '6c1d06a82135c7e167729bf73a9cc3563bc7345b', class: "cty-image-preview__close cty-button-native", onClick: () => this.dismiss() }, index.h("cty-icon", { key: 'c12aba1f028a12e5e0c61295f2c0fa3184896640', name: "cty-close2" })))), index.h("cty-swiper", Object.assign({ key: '2f1728f9e2c71f0454a2bc2c233de7186841f294', ref: (el) => this.swiperEl = el }, swiperAttrs, { onCtySlideChange: (e) => this._slideChange(e) })), index.h("slot", { key: 'e0a0239853fbe9ddf654a0ca47a00dd11b990eff', name: 'end' })))));
+        return (index.h(index.Host, { key: '18b1464e3e7b8d103427546e83f7f02380d053de', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden cty-pos-cover': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: 'c7914de771c49f43365bcd2271511595dd94fe4f', backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: '42ecf8b9c942639eedd01286914c947bd1231aee', class: { 'cty-image-viewer': true, 'cty-image-viewer__hidden': !initialized } }, index.h("slot", { key: '42c9d2f8fae0ed835148e2eba6c28b219c02b040', name: 'start' }), (this.closeable || this.pager || !this.backdropDismiss) && index.h("div", { key: '1416c5b64c5d96d1557b1aaf485378dd26ff2925', class: "cty-image-preview__header", onClick: (e) => e.stopPropagation() }, this.pager && index.h("slot", { key: '62ccb2d8d005b4d958d8daa975bd593723bedbac', name: "pager" }, index.h("div", { key: 'df8e9d33b45cb52b622ac4b41bcef8573922eb3c', class: "cty-image-preview__pager flex-center" }, index.h("h6", { key: '5a77fa57b32f9000ea7678fabd4bdc32890314a0', class: "cty-image-preview__pager-text" }, index.h("span", { key: 'd7f8ab7eb983dc645825f66b1ba0485d1c937e92', class: "cty-image-preview__index" }, this.activeIndex + 1), " / ", this.images.length))), (this.closeable || !this.backdropDismiss) && index.h("slot", { key: 'c6e1d25d84545a19d829045e8b04da64f79576fa', name: "close" }, index.h("button", { key: 'ab92d1d5a9423cc086af1dbba7c13a11bcfb7488', class: "cty-image-preview__close cty-button-native", onClick: () => this.dismiss() }, index.h("cty-icon", { key: 'b2f1536e7454414af54fd9fb0f120c5855bdbfb7', name: "cty-close2" })))), index.h("cty-swiper", Object.assign({ key: 'd511309c54605a5ebab94c5fea3d3d63e3ff2e5c', ref: (el) => this.swiperEl = el }, swiperAttrs, { onCtySlideChange: (e) => this._slideChange(e) })), index.h("slot", { key: '90e5b1090d0c6454478076d453b7d3fdbdbf0e04', name: 'end' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -145,7 +149,7 @@ const NavBar = class {
     }
     render() {
         const { start, end, arrow, arrowIcon, type, title } = this;
-        return (index.h(index.Host, { key: 'f0fb718f0c907d2c17a77b0fe8fda4ad6edea635', class: { "cty-nav-bar": true, [type ? 'cty-nav-bar__' + type : '']: true } }, index.h("ion-header", { key: '6821ed299149af74d7207362014693bfc746274f' }, index.h("ion-toolbar", { key: '8431267147b9749f9f466a479186d6f200a201e7', class: "cty-nav-bar__toolbar" }, start && index.h("ion-buttons", { key: '2c32c5479fd375ad94d99f0c94bf7d4b8931ce70', slot: "start" }, index.h("slot", { key: 'd84df928944457a9f9cca198ea51b866b47889c1', name: "start" }, arrow && index.h("ion-button", { key: '183aa8ae2b7d9e7ac862550c00e398b4ebb8d1ae', class: "cty-nav-bar__arrow", onClick: () => this.action() }, index.h("cty-icon", { key: '6ee29d3f1581f80f730b53003e8852556b2d7c58', class: "cty-nav-bar__arrow-icon", name: arrowIcon })))), title && index.h("ion-title", { key: '6f44c318242bbf2e10a250cd36c535fab2670cc0', class: "cty-nav-bar__title" }, index.h("slot", { key: '4ca3fc89dee1bdf2fa51b0a1f0df4674172f61ff', name: 'title' }, title)), end && index.h("ion-buttons", { key: '96e0e7f960a653a4ecdb730e900c32495387e916', slot: "end" }, index.h("slot", { key: '9a103345ce785d4f6e18c32e27cbff564377fa1b', name: 'end' }))))));
+        return (index.h(index.Host, { key: 'a6fc9f0326ad6f7b85087348d5dcf2c3c15e78af', class: { "cty-nav-bar": true, [type ? 'cty-nav-bar__' + type : '']: true } }, index.h("ion-header", { key: '3ae9aa93e2b76d44e6b220058a857d132966aada' }, index.h("ion-toolbar", { key: '4f50bd3a5c89f530fe77cec0c6d3e3c633084373', class: "cty-nav-bar__toolbar" }, start && index.h("ion-buttons", { key: '02d4e96017a2fc258838e5c419157b49eae51504', slot: "start" }, index.h("slot", { key: '30449cb63c53a8e2abc9437cf3f113e4026cc2da', name: "start" }, arrow && index.h("ion-button", { key: '14b8964f2cb324ca621f45cee082d6b6bdbbd57a', class: "cty-nav-bar__arrow", onClick: () => this.action() }, index.h("cty-icon", { key: 'a57be5da16f0724d107e971245fff1c114a2b539', class: "cty-nav-bar__arrow-icon", name: arrowIcon })))), title && index.h("ion-title", { key: 'd190a2101879dc404365428c274a648562212496', class: "cty-nav-bar__title" }, index.h("slot", { key: '8c90403204f3bf65e9e266af8dd1f52dd84dfc73', name: 'title' }, title)), end && index.h("ion-buttons", { key: '5ffa889f317a33713dc384ce8ec0536406917bb5', slot: "end" }, index.h("slot", { key: '884a69b196cb434ca350cce621de7034b9d8c49d', name: 'end' }))))));
     }
     get el() { return index.getElement(this); }
 };
@@ -195,6 +199,10 @@ const Swiper = class {
         this._swiper = this.swiperEl.swiper;
         this.refreshSwiper();
     }
+    disconnectedCallback() {
+        var _a;
+        (_a = this._swiper) === null || _a === void 0 ? void 0 : _a.destroy();
+    }
     slideChange() {
         this.ctySlideChange.emit({
             realIndex: this._swiper.realIndex,
@@ -240,7 +248,7 @@ const Swiper = class {
         return this._swiper;
     }
     render() {
-        return (index.h(index.Host, { key: 'aa4df59ca9139127fc4b1fd82b8db09c9d9822da', class: "cty-swiper" }, index.h("swiper-container", Object.assign({ key: 'e8ab2140706022c8203552019b16eb5b0d69c3e7', class: "cty-swipe__container", ref: (el) => this.swiperEl = el, autoplay: this.autoplay, modules: this.swiperModules, direction: this.direction, loop: this.loop, pagination: this.pagination, observer: this.observer, "observer-parents": this.observerParents, onSwiperslidechangetransitionend: () => this.slideChange(), onSwiperclick: () => this.slideClick() }, this.attrs), this._swipers.map((item, idx) => index.h("swiper-slide", { class: "cty-swipe__slide" }, index.h("slot", { name: idx + '' }, index.h("div", { class: "swiper-zoom-container" }, index.h("img", { src: item[this.props.pic], alt: item[this.props.alt || ''] || '', onClick: (e) => e.stopPropagation() }))))), index.h("slot", { key: '2fdfb202c53cae9e5f805b5f046bac0da13de968', name: "container-start", slot: "container-start" }), index.h("slot", { key: '139dcd57bb0ce780d0be5cde0943603b3621d7a9', name: "container-end", slot: "container-end" }))));
+        return (index.h(index.Host, { key: '4279a041c842204c199d6ebc251f44128f0e3b65', class: "cty-swiper" }, index.h("swiper-container", Object.assign({ key: '61fa76ec459f33c92504fec0d3cdd9465e882b19', class: "cty-swipe__container", ref: (el) => this.swiperEl = el, autoplay: this.autoplay, modules: this.swiperModules, direction: this.direction, loop: this.loop, pagination: this.pagination, observer: this.observer, "observer-parents": this.observerParents, onSwiperslidechangetransitionend: () => this.slideChange(), onSwiperclick: () => this.slideClick() }, this.attrs), this._swipers.map((item, idx) => index.h("swiper-slide", { class: "cty-swipe__slide" }, index.h("slot", { name: idx + '' }, index.h("div", { class: "swiper-zoom-container" }, index.h("img", { src: item[this.props.pic], alt: item[this.props.alt || ''] || '', onClick: (e) => e.stopPropagation() }))))), index.h("slot", { key: 'be071f0b3e5059921d8febb081456659816e8765', name: "container-start", slot: "container-start" }), index.h("slot", { key: 'eb6160945f271cccb52bcdad7977f38dbda3552e', name: "container-end", slot: "container-end" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-index-bar.cjs.entry.js

@@ -92,10 +92,10 @@ const IndexBar = class {
         this.ctyScrollToPoint.emit(index);
     }
     render() {
-        return (index.h(index.Host, { key: 'a53f2aba840cde51fad96c3fa152f55f5eec29cb', class: "cty-index-bar" }, index.h("div", { key: '0b9cf94a3abaa9c0b6f634da2956067875bec151', class: "cty-index-bar__list" }, this.indexList.map((item, idx) => {
+        return (index.h(index.Host, { key: '0ee0647b1d9d5b5521c81e39b091f6b8a72bc811', class: "cty-index-bar" }, index.h("div", { key: '0dfdb54c8f8611021b37485aca28e0c19d3e5a44', class: "cty-index-bar__list" }, this.indexList.map((item, idx) => {
             var _a;
             return index.h("div", { class: "cty-index-bar__item" }, index.h("div", { part: "header", class: { 'cty-index-bar__item-header': true, 'cty-index-bar__item-header-active': this.alphabet === item.belong }, style: { position: this.sticky ? 'sticky' : 'initial', 'top': this.stickyTop + 'px' } }, index.h("span", null, item.belong), this.sum && index.h("span", { class: "cty-index-bar__item-header-sum" }, "(", item.sum, ")")), index.h("slot", { name: (_a = item.slot) !== null && _a !== void 0 ? _a : `${idx}` }));
-        })), index.h("div", { key: 'ff0cbe06ef99762719a251aad755841d37acc798', class: "cty-index-bar__sidebar", part: "sidebar" }, this.alphabets.map((item, i) => index.h("button", { class: { 'cty-index-bar__index cty-button-native': true, 'cty-index-bar__index-active': this.alphabet === item }, onClick: () => this.scrollToIndex(i), onKeyUp: (e) => this.onKeyUp(e, i), tabindex: "0" }, item)))));
+        })), index.h("div", { key: '495ff2f9bf7e5cfb09161d4f7c1989b2b250740c', class: "cty-index-bar__sidebar", part: "sidebar" }, this.alphabets.map((item, i) => index.h("button", { class: { 'cty-index-bar__index cty-button-native': true, 'cty-index-bar__index-active': this.alphabet === item }, onClick: () => this.scrollToIndex(i), onKeyUp: (e) => this.onKeyUp(e, i), tabindex: "0" }, item)))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-keyboard.cjs.entry.js

@@ -67,7 +67,7 @@ const Keyboard = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'd525c65b7c5e689b1569fb2216867221b67f0f09' }));
+        return (index.h(index.Host, { key: '92fe9ba9e7e0e2b0ea5a51f30637097cf8c2b8ec' }));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/cty-loading.cjs.entry.js

@@ -86,7 +86,7 @@ const Loading = class {
         return this.spinnerComponents[this.spinner] || null;
     }
     render() {
-        return (index.h(index.Host, { key: 'bd3ac53bbc22cc0222ee21c3428d52311d05ff31', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden cty-pos-cover': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: '0458cd35d0e0875f4c3d20a131df8e8829bc9af5', backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: '2b479bb6111d23af385ab4ebd433c575f0fc5dca', class: this.vertical ? 'cty-loading flex-column-center' : 'cty-loading flex-center', onClick: (e) => e.stopPropagation() }, this.renderSpinner(), index.h("div", { key: '06a9afa4f27f78e83bfa988eb48a39da95c35e67', class: { 'cty-loading__text': true, 'cty-loading__text-hor': !this.vertical } }, index.h("slot", { key: '615e24637383a1c57a98b59a9d87746b30116b52' }))))));
+        return (index.h(index.Host, { key: '44932eb236d219785e58868f61b472551af6767f', class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { 'overlay-hidden cty-pos-cover': true }), style: { zIndex: `${20000 + this.overlayIndex}` } }, index.h("cty-backdrop", { key: 'c252d39d00ce518d675e5fc863cd5f8088cc5bf2', backdropDismiss: this.backdropDismiss, onCtyDismiss: () => this.dismiss() }, index.h("div", { key: 'a2eb24e493f95ee488600f95b3922d3e4af9abed', class: this.vertical ? 'cty-loading flex-column-center' : 'cty-loading flex-center', onClick: (e) => e.stopPropagation() }, this.renderSpinner(), index.h("div", { key: '111268d2c84ee9707bfcb5c262aff574adcd583f', class: { 'cty-loading__text': true, 'cty-loading__text-hor': !this.vertical } }, index.h("slot", { key: '3c7763077212b665ee94be8d5033e92f46a8c17e' }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cty-media-capture.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-DCK462Hl.js');
 var statusBar = require('./status-bar-1jhnFEuR.js');
-var videoCapture = require('./video-capture-C-HjTI17.js');
+var videoCapture = require('./video-capture-BO4sLa1e.js');
 var index$1 = require('./index-DASUhQA3.js');
 require('./config-Bn2x7PFv.js');
 require('./format-BSDO5P-c.js');
@@ -30,11 +30,15 @@ const MediaCapture = class {
         this.controls = false;
         this.poster = '';
         this.timeLimit = 0; //大于0则有录制时间限制
+        this.permissionAlertTitle = '需要申请开启相机权限';
+        this.permissionAlertContent = '需要开启相机权限，用于拍摄视频。我们承诺仅在功能使用时调用摄像头。';
         this.isCaptured = false;
         this.capturing = false;
         this.captureDuration = 0;
         this.filePath = '';
         this.videoFileUrl = '';
+        this.hasPermission = false;
+        this.permissionAlertVisible = false;
         this.originalBodyBackground = '';
         this._timer = 0;
     }
@@ -55,7 +59,15 @@ const MediaCapture = class {
                     this.videoEl.play();
                 }, 150);
             }
-        }).catch(() => { });
+        }).catch((error) => {
+            const { code } = error || {};
+            if (code == 'PERMISSION_DENIED_NEED_SETTINGS') {
+                this.permissionAlertVisible = true;
+            }
+            else {
+                this.ctyDismiss.emit();
+            }
+        });
     }
     disconnectedCallback() {
         videoCapture.videoCapture.stopVideoCapture();
@@ -117,9 +129,27 @@ const MediaCapture = class {
     confirm() {
         this.ctyComplete.emit({ data: this.filePath, url: this.videoFileUrl });
     }
+    async toOpenAppSetting(event) {
+        const { item } = event.detail;
+        if (item.action == 'permission') {
+            try {
+                await videoCapture.videoCapture.openAppSettings();
+                this.permissionAlertVisible = false;
+                this.initVideoCapture();
+            }
+            catch (error) {
+                this.closePermissionAlert(event);
+            }
+        }
+    }
+    closePermissionAlert(e) {
+        e.stopPropagation();
+        this.permissionAlertVisible = false;
+        this.ctyDismiss.emit();
+    }
     render() {
         const captureDuration = statusBar.secondsToVehicle(this.captureDuration);
-        return (index.h(index.Host, { key: 'a2348b392a4dfc583c83f0aa45ca688c516d3a33', class: { 'cty-media-capture': true, 'cty-media-captured': this.isCaptured } }, index.h("div", { key: '8941dcb4cbca994d15aead39cf77dea0a621bde8', class: "cty-media-capture__header" }, index.h("button", { key: '603afe4b821ef29f29db2cd359d9722dc30f41f3', onClick: () => this.doHeaderAction(), class: "cty-button-native" }, index.h("cty-icon", { key: 'fd886d9f6fd97b34e8950a1e7cc77df9d035f8f5', class: "cty-capture__close-icon", name: this.isCaptured ? this.revocationIcon : this.closeIcon })), this.captureTime && (this.isCaptured || this.capturing) && (index.h("span", { key: 'b03a09ae0dc739a43961bc9bbde4a6a641fb467b', class: { 'cty-media-capture__time': true, 'cty-media-capture__time-active': this.capturing } }, captureDuration))), this.isCaptured && (index.h("video", { key: 'a31e886e82bb680bb3a8293f43b7a4231bfa5a31', ref: el => (this.videoEl = el), class: "cty-media-capture__video", autoplay: this.autoplay, loop: this.loop, poster: this.poster, src: this.videoFileUrl, playsinline: true, "webkit-playsinline": true, controls: this.controls, onClick: e => this.toggleVideo(e) })), index.h("div", { key: 'ad1dc5425bd7df3aafdd2ef1b169999b784ccd44', class: "cty-media-capture__footer flex-center" }, !this.isCaptured && (index.h("button", { key: '7c9f565bbfb783c28743c44b27dea30ec385e8ed', class: "cty-media-capture__switch cty-button-native", onClick: () => this.doCapture() }, index.h("span", { key: '27099ff17056b20c3b5615a564712e82727c33e5', class: { 'cty-media-capture__status': true, 'cty-media-capture__status-active': this.capturing } }))), this.isCaptured && (index.h("button", { key: '693f23683121bc970cd83d6a032be0a007c827de', class: "cty-media-capture__confirm cty-button-native", onClick: () => this.confirm() }, this.confirmText))), index.h("slot", { key: 'c767b7dac399530e54a34e49c712aefff61af093' })));
+        return (index.h(index.Host, { key: 'dea0fde2e775dac71b8d627fbf72502ce8b01ac6', class: { 'cty-media-capture': true, 'cty-media-captured': this.isCaptured } }, index.h("div", { key: '639152bb0476a2577a91268088efd50d251c3962', class: "cty-media-capture__header" }, index.h("button", { key: 'a2246e49b5e58c4623b1e2d65c7d14e216be179f', onClick: () => this.doHeaderAction(), class: "cty-button-native" }, index.h("cty-icon", { key: 'a47c9b4f70a9ffa317e6ed165ed05098eba5198f', class: "cty-capture__close-icon", name: this.isCaptured ? this.revocationIcon : this.closeIcon })), this.captureTime && (this.isCaptured || this.capturing) && (index.h("span", { key: '0bd480dc6ba6963ac65c14c55b6d7d242a1b79e2', class: { 'cty-media-capture__time': true, 'cty-media-capture__time-active': this.capturing } }, captureDuration))), this.isCaptured && (index.h("video", { key: '9bb3ad454c63e53d6acd2968b2281a5c152a9390', ref: el => (this.videoEl = el), class: "cty-media-capture__video", autoplay: this.autoplay, loop: this.loop, poster: this.poster, src: this.videoFileUrl, playsinline: true, "webkit-playsinline": true, controls: this.controls, onClick: e => this.toggleVideo(e) })), index.h("div", { key: '90101389dea8e43c50dddf98c6cea75f8d324bd9', class: "cty-media-capture__footer flex-center" }, !this.isCaptured && (index.h("button", { key: '71f330777cdabab5829a2dbcf703ba3a40d99647', class: "cty-media-capture__switch cty-button-native", onClick: () => this.doCapture() }, index.h("span", { key: '6957cf9034bd74ea7ae4653557f417b2c934ee81', class: { 'cty-media-capture__status': true, 'cty-media-capture__status-active': this.capturing } }))), this.isCaptured && (index.h("button", { key: 'f508c7bb4cca833a13b1cfe3957a10114c92377e', class: "cty-media-capture__confirm cty-button-native", onClick: () => this.confirm() }, this.confirmText))), index.h("slot", { key: 'f5f99097bc702e82912865d500172f4a88966623' }), this.permissionAlertVisible && index.h("cty-permission-alert", { key: '07ce58f2409b15db1621343acec4a7938cc87474', title: this.permissionAlertTitle, content: this.permissionAlertContent, buttons: this.permissionAlertbuttons, onCtyDismiss: (e) => this.closePermissionAlert(e), onCtyTap: (e) => this.toOpenAppSetting(e) })));
     }
     get el() { return index.getElement(this); }
 };