vite-plugin-taro-runtime 0.7.0 → 0.7.1-beta.2

package/dist/components/dist/components/taro-tabbar.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TaroTabbar extends Components.TaroTabbar, HTMLElement {}
+export const TaroTabbar: {
+  prototype: TaroTabbar;
+  new (): TaroTabbar;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dist/components/taro-tabbar.js

@@ -0,0 +1,371 @@
+import { h, proxyCustomElement, HTMLElement, createEvent, Host } from '@stencil/core/internal/client';
+import { stripSuffix, stripBasename, addLeadingSlash, getCurrentPage } from '@tarojs/runtime';
+import Taro from '@tarojs/taro';
+import { c as classnames } from './index2.js';
+import resolvePathname from 'resolve-pathname';
+import { a as isVisible } from './index3.js';
+
+const splitUrl = _url => {
+  let url = _url || '';
+  let pos;
+  const res = {
+    path: null,
+    query: null,
+    fragment: null
+  };
+  pos = url.indexOf('#');
+  if (pos > -1) {
+    res.fragment = url.substring(pos + 1);
+    url = url.substring(0, pos);
+  }
+  pos = url.indexOf('?');
+  if (pos > -1) {
+    res.query = url.substring(pos + 1);
+    url = url.substring(0, pos);
+  }
+  res.path = url;
+  return res;
+};
+
+const TabbarItem = ({ index, isSelected = false, textColor, iconPath, badgeText, showRedDot = false, pagePath, text, onSelect }) => {
+  const className = classnames('weui-tabbar__item', {
+    'weui-bar__item_on': isSelected
+  });
+  const badgeStyle = {
+    position: 'absolute',
+    top: '-2px',
+    right: '-13px'
+  };
+  const dotStyle = {
+    position: 'absolute',
+    top: '0',
+    right: '-6px'
+  };
+  function onClick() {
+    const page = Taro.getCurrentPages().shift();
+    if (typeof (page === null || page === void 0 ? void 0 : page.onTabItemTap) === 'function' && isVisible(this)) {
+      page.onTabItemTap({ index, pagePath, text });
+    }
+    onSelect(index);
+  }
+  return (h("a", { key: index, href: 'javascript:;', class: className, onClick: onClick },
+    h("span", { style: { display: 'inline-block', position: 'relative' } },
+      h("img", { src: iconPath, alt: '', class: 'weui-tabbar__icon' }),
+      !!badgeText && (h("span", { class: 'weui-badge taro-tabbar-badge', style: badgeStyle }, badgeText)),
+      showRedDot && (h("span", { class: 'weui-badge weui-badge_dot', style: dotStyle }))),
+    h("p", { class: 'weui-tabbar__label', style: { color: textColor } }, text)));
+};
+
+const indexCss = ".weui-tabbar{z-index:500;background-color:#f7f7fa;align-items:center;width:100%;display:flex;position:absolute;bottom:0}.weui-tabbar:before{content:\" \";color:#c0bfc4;transform-origin:0 0;border-top:1px solid #c0bfc4;height:1px;position:absolute;top:0;left:0;right:0;transform:scaleY(.5)}.weui-tabbar__item{padding:5px 0;padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom);color:#999;text-align:center;-webkit-tap-highlight-color:transparent;flex:1;font-size:0;display:block}.weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon,.weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon>i,.weui-tabbar__item.weui-bar__item_on .weui-tabbar__label{color:#09bb07}.weui-tabbar__icon{width:27px;height:27px;display:inline-block}.weui-tabbar__icon img{width:100%;height:100%}i.weui-tabbar__icon,.weui-tabbar__icon>i{color:#999;font-size:24px}.weui-tabbar__label{text-align:center;color:#999;font-size:10px;line-height:1.8}.weui-badge{color:#fff;text-align:center;vertical-align:middle;background-color:#f43530;border-radius:18px;min-width:8px;padding:.15em .4em;font-size:12px;line-height:1.2;display:inline-block}.weui-badge_dot{min-width:0;padding:.4em}:root{--taro-tabbar-height:50px}#app{height:100%}.taro-tabbar__border-white:before{border-top-color:#fff!important}.taro-tabbar__container{flex-direction:column;height:100%;display:flex;overflow:hidden}.taro-tabbar__panel{-webkit-overflow-scrolling:auto;flex:1;position:relative;overflow:auto}.taro-tabbar__tabbar{width:100%;height:var(--taro-tabbar-height);transition:bottom .2s,top .2s;position:relative}.taro-tabbar__tabbar-top{top:0}.taro-tabbar__tabbar-bottom{margin-bottom:constant(safe-area-inset-bottom);margin-bottom:env(safe-area-inset-bottom);bottom:0}.taro-tabbar__tabbar-hide{display:none}.taro-tabbar__tabbar-slideout{flex:0 0;top:-52px}.taro-tabbar__panel+.taro-tabbar__tabbar-slideout{top:auto;bottom:-52px}";
+
+const STATUS_SHOW = 0;
+const STATUS_HIDE = 1;
+const STATUS_SLIDEOUT = 2;
+const basicTabBarClassName = 'taro-tabbar__tabbar';
+const hideTabBarClassName = 'taro-tabbar__tabbar-hide';
+const hideTabBarWithAnimationClassName = 'taro-tabbar__tabbar-slideout';
+const Tabbar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.onLongPress = createEvent(this, "longpress", 7);
+    this.homePage = '';
+    this.customRoutes = [];
+    this.tabbarPos = 'bottom';
+    this.getOriginUrl = (url) => {
+      const customRoute = this.customRoutes.filter(([, customUrl]) => {
+        const pathA = splitUrl(customUrl).path;
+        const pathB = splitUrl(url).path;
+        return pathA === pathB;
+      });
+      return stripSuffix(customRoute.length ? customRoute[0][0] : url, '.html');
+    };
+    this.getSelectedIndex = (url) => {
+      let foundIndex = -1;
+      this.list.forEach(({ pagePath }, idx) => {
+        const pathA = splitUrl(url).path;
+        const pathB = splitUrl(pagePath).path;
+        if (pathA === pathB) {
+          foundIndex = idx;
+        }
+      });
+      return foundIndex;
+    };
+    this.switchTab = (index) => {
+      this.selectedIndex = index;
+      Taro.switchTab({
+        url: this.list[index].pagePath
+      });
+    };
+    this.switchTabHandler = ({ url, successHandler, errorHandler }) => {
+      const currentUrl = this.getOriginUrl(this.getCurrentUrl() || this.homePage);
+      const nextTab = resolvePathname(url, currentUrl);
+      const foundIndex = this.getSelectedIndex(nextTab);
+      if (foundIndex > -1) {
+        this.switchTab(foundIndex);
+        successHandler({
+          errMsg: 'switchTab:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: `switchTab:fail page "${nextTab}" is not found`
+        });
+      }
+    };
+    this.routerChangeHandler = (options) => {
+      var _a;
+      const to = (_a = options === null || options === void 0 ? void 0 : options.toLocation) === null || _a === void 0 ? void 0 : _a.path;
+      let currentPage;
+      if (typeof to === 'string') {
+        const routerBasename = this.conf.basename || '/';
+        currentPage = stripBasename(addLeadingSlash(to || this.homePage), routerBasename) || '/';
+      }
+      else {
+        currentPage = this.getCurrentUrl();
+      }
+      this.selectedIndex = this.getSelectedIndex(this.getOriginUrl(currentPage));
+    };
+    this.setTabBarBadgeHandler = ({ index, text, successHandler, errorHandler }) => {
+      const list = [...this.list];
+      if (index in list) {
+        list[index].showRedDot = false;
+        list[index].badgeText = text;
+        successHandler({
+          errMsg: 'setTabBarBadge:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: 'setTabBarBadge:fail tabbar item not found'
+        });
+      }
+      this.list = list;
+    };
+    this.removeTabBarBadgeHandler = ({ index, successHandler, errorHandler }) => {
+      const list = [...this.list];
+      if (index in list) {
+        list[index].badgeText = null;
+        list[index].badgeText = null;
+        successHandler({
+          errMsg: 'removeTabBarBadge:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: 'removeTabBarBadge:fail tabbar item not found'
+        });
+      }
+      this.list = list;
+    };
+    this.showTabBarRedDotHandler = ({ index, successHandler, errorHandler }) => {
+      const list = [...this.list];
+      if (index in list) {
+        list[index].badgeText = null;
+        list[index].showRedDot = true;
+        successHandler({
+          errMsg: 'showTabBarRedDot:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: 'showTabBarRedDot:fail tabbar item not found'
+        });
+      }
+      this.list = list;
+    };
+    this.hideTabBarRedDotHandler = ({ index, successHandler, errorHandler }) => {
+      const list = [...this.list];
+      if (index in list) {
+        list[index].showRedDot = false;
+        successHandler({
+          errMsg: 'hideTabBarRedDot:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: 'hideTabBarRedDot:fail tabbar item not found'
+        });
+      }
+      this.list = list;
+    };
+    this.showTabBarHandler = ({ successHandler }) => {
+      this.status = STATUS_SHOW;
+      successHandler({
+        errMsg: 'showTabBar:ok'
+      });
+    };
+    this.hideTabBarHandler = ({ animation, successHandler }) => {
+      this.status = animation ? STATUS_SLIDEOUT : STATUS_HIDE;
+      successHandler({
+        errMsg: 'hideTabBar:ok'
+      });
+    };
+    this.setTabBarStyleHandler = ({ color, selectedColor, backgroundColor, borderStyle, successHandler }) => {
+      if (backgroundColor)
+        this.backgroundColor = backgroundColor;
+      if (borderStyle)
+        this.borderStyle = borderStyle;
+      if (color)
+        this.color = color;
+      if (selectedColor)
+        this.selectedColor = selectedColor;
+      successHandler({
+        errMsg: 'setTabBarStyle:ok'
+      });
+    };
+    this.setTabBarItemHandler = ({ index, iconPath, selectedIconPath, text, successHandler, errorHandler }) => {
+      const list = [...this.list];
+      if (index in list) {
+        if (iconPath)
+          list[index].iconPath = iconPath;
+        if (selectedIconPath)
+          list[index].selectedIconPath = selectedIconPath;
+        if (text)
+          list[index].text = text;
+        successHandler({
+          errMsg: 'setTabBarItem:ok'
+        });
+      }
+      else {
+        errorHandler({
+          errMsg: 'setTabBarItem:fail tabbar item not found'
+        });
+      }
+      this.list = list;
+    };
+    this.conf = undefined;
+    this.list = undefined;
+    this.borderStyle = undefined;
+    this.backgroundColor = undefined;
+    this.color = undefined;
+    this.selectedColor = undefined;
+    this.selectedIndex = -1;
+    this.status = STATUS_SHOW;
+  }
+  componentWillLoad() {
+    var _a, _b;
+    const list = ((_a = this.conf) === null || _a === void 0 ? void 0 : _a.list) || [];
+    const customRoutes = ((_b = this.conf) === null || _b === void 0 ? void 0 : _b.customRoutes) || {};
+    if (Object.prototype.toString.call(list) !== '[object Array]' ||
+      list.length < 2 ||
+      list.length > 5) {
+      throw new Error('tabBar 配置错误');
+    }
+    this.homePage = addLeadingSlash(this.conf.homePage);
+    for (let key in customRoutes) {
+      const path = customRoutes[key];
+      key = addLeadingSlash(key);
+      if (typeof path === 'string') {
+        this.customRoutes.push([key, addLeadingSlash(path)]);
+      }
+      else if ((path === null || path === void 0 ? void 0 : path.length) > 0) {
+        this.customRoutes.push(...path.map(p => [key, addLeadingSlash(p)]));
+      }
+    }
+    list.forEach(item => {
+      if (item.pagePath.indexOf('/') !== 0) {
+        item.pagePath = '/' + item.pagePath;
+      }
+    });
+    this.list = list;
+    this.borderStyle = this.conf.borderStyle;
+    this.backgroundColor = this.conf.backgroundColor;
+    this.color = this.conf.color;
+    this.selectedColor = this.conf.selectedColor;
+  }
+  getCurrentUrl() {
+    const routePath = getCurrentPage(this.conf.mode, this.conf.basename);
+    return decodeURI(routePath === '/' ? this.homePage : routePath);
+  }
+  bindEvent() {
+    Taro.eventCenter.on('__taroRouterChange', this.routerChangeHandler);
+    Taro.eventCenter.on('__taroSwitchTab', this.switchTabHandler);
+    Taro.eventCenter.on('__taroSetTabBarBadge', this.setTabBarBadgeHandler);
+    Taro.eventCenter.on('__taroRemoveTabBarBadge', this.removeTabBarBadgeHandler);
+    Taro.eventCenter.on('__taroShowTabBarRedDotHandler', this.showTabBarRedDotHandler);
+    Taro.eventCenter.on('__taroHideTabBarRedDotHandler', this.hideTabBarRedDotHandler);
+    Taro.eventCenter.on('__taroShowTabBar', this.showTabBarHandler);
+    Taro.eventCenter.on('__taroHideTabBar', this.hideTabBarHandler);
+    Taro.eventCenter.on('__taroSetTabBarStyle', this.setTabBarStyleHandler);
+    Taro.eventCenter.on('__taroSetTabBarItem', this.setTabBarItemHandler);
+  }
+  removeEvent() {
+    Taro.eventCenter.off('__taroRouterChange', this.routerChangeHandler);
+    Taro.eventCenter.off('__taroSwitchTab', this.switchTabHandler);
+    Taro.eventCenter.off('__taroSetTabBarBadge', this.setTabBarBadgeHandler);
+    Taro.eventCenter.off('__taroRemoveTabBarBadge', this.removeTabBarBadgeHandler);
+    Taro.eventCenter.off('__taroShowTabBarRedDotHandler', this.showTabBarRedDotHandler);
+    Taro.eventCenter.off('__taroHideTabBarRedDotHandler', this.hideTabBarRedDotHandler);
+    Taro.eventCenter.off('__taroShowTabBar', this.showTabBarHandler);
+    Taro.eventCenter.off('__taroHideTabBar', this.hideTabBarHandler);
+    Taro.eventCenter.off('__taroSetTabBarStyle', this.setTabBarStyleHandler);
+    Taro.eventCenter.off('__taroSetTabBarItem', this.setTabBarItemHandler);
+  }
+  componentDidLoad() {
+    this.tabbarPos = this.tabbar.nextElementSibling ? 'top' : 'bottom';
+    this.bindEvent();
+    this.routerChangeHandler();
+  }
+  disconnectedCallback() {
+    this.removeEvent();
+  }
+  render() {
+    const { tabbarPos = 'bottom' } = this;
+    const status = this.status;
+    const containerCls = classnames('weui-tabbar', {
+      [`taro-tabbar__border-${this.borderStyle || 'black'}`]: true
+    });
+    const shouldHideTabBar = this.selectedIndex === -1 || status === STATUS_HIDE;
+    const shouldSlideout = status === STATUS_SLIDEOUT;
+    return (h(Host, { class: classnames(basicTabBarClassName, `${basicTabBarClassName}-${tabbarPos}`, {
+        [hideTabBarClassName]: shouldHideTabBar,
+        [hideTabBarWithAnimationClassName]: shouldSlideout
+      }) }, h("div", { class: containerCls, style: {
+        backgroundColor: this.backgroundColor || '',
+        height: 'inherit'
+      } }, this.list.map((item, index) => {
+      const isSelected = this.selectedIndex === index;
+      let textColor;
+      let iconPath;
+      if (isSelected) {
+        textColor = this.selectedColor || '';
+        iconPath = item.selectedIconPath;
+      }
+      else {
+        textColor = this.color || '';
+        iconPath = item.iconPath;
+      }
+      return (h(TabbarItem, { index: index, onSelect: this.switchTab.bind(this), isSelected: isSelected, textColor: textColor, iconPath: iconPath, pagePath: item.pagePath, text: item.text, badgeText: item.badgeText, showRedDot: item.showRedDot }));
+    }))));
+  }
+  get tabbar() { return this; }
+  static get style() { return indexCss; }
+}, [0, "taro-tabbar", {
+    "conf": [16],
+    "list": [32],
+    "borderStyle": [32],
+    "backgroundColor": [32],
+    "color": [32],
+    "selectedColor": [32],
+    "selectedIndex": [32],
+    "status": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["taro-tabbar"];
+  components.forEach(tagName => { switch (tagName) {
+    case "taro-tabbar":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Tabbar);
+      }
+      break;
+  } });
+}
+
+const TaroTabbar = Tabbar;
+const defineCustomElement = defineCustomElement$1;
+
+export { TabbarItem as T, TaroTabbar, Tabbar as a, defineCustomElement };

package/dist/components/dist/components/taro-tabs-core.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TaroTabsCore extends Components.TaroTabsCore, HTMLElement {}
+export const TaroTabsCore: {
+  prototype: TaroTabsCore;
+  new (): TaroTabsCore;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dist/components/taro-tabs-core.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { n as notSupport } from './helper.js';
+
+const Tabs = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  componentDidLoad() {
+    notSupport('Tabs', this);
+  }
+  render() {
+    return (h(Host, null));
+  }
+}, [0, "taro-tabs-core"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["taro-tabs-core"];
+  components.forEach(tagName => { switch (tagName) {
+    case "taro-tabs-core":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Tabs);
+      }
+      break;
+  } });
+}
+
+const TaroTabsCore = Tabs;
+const defineCustomElement = defineCustomElement$1;
+
+export { Tabs as T, TaroTabsCore, defineCustomElement };

package/dist/components/dist/components/taro-tap-gesture-handler-core.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TaroTapGestureHandlerCore extends Components.TaroTapGestureHandlerCore, HTMLElement {}
+export const TaroTapGestureHandlerCore: {
+  prototype: TaroTapGestureHandlerCore;
+  new (): TaroTapGestureHandlerCore;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dist/components/taro-tap-gesture-handler-core.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { n as notSupport } from './helper.js';
+
+const TapGestureHandler = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  componentDidLoad() {
+    notSupport('TapGestureHandler', this);
+  }
+  render() {
+    return (h(Host, null));
+  }
+}, [0, "taro-tap-gesture-handler-core"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["taro-tap-gesture-handler-core"];
+  components.forEach(tagName => { switch (tagName) {
+    case "taro-tap-gesture-handler-core":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TapGestureHandler);
+      }
+      break;
+  } });
+}
+
+const TaroTapGestureHandlerCore = TapGestureHandler;
+const defineCustomElement = defineCustomElement$1;
+
+export { TapGestureHandler as T, TaroTapGestureHandlerCore, defineCustomElement };

package/dist/components/dist/components/taro-text-core.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TaroTextCore extends Components.TaroTextCore, HTMLElement {}
+export const TaroTextCore: {
+  prototype: TaroTextCore;
+  new (): TaroTextCore;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dist/components/taro-text-core.js

@@ -0,0 +1,45 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const indexCss = "taro-text-core{user-select:none;display:inline}taro-text-core[selectable=true],taro-text-core[user-select=true]{user-select:text;display:inline-block}taro-text-core[space]{white-space:pre-wrap}taro-text-core[space=ensp]{word-spacing:.5em}taro-text-core[space=nbsp]{word-spacing:1em}taro-text-core[number-of-lines]{--line-clamp:2;word-wrap:break-word;text-overflow:ellipsis;-webkit-line-clamp:var(--line-clamp);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}";
+
+const Text = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.selectable = false;
+    this.userSelect = false;
+    this.space = undefined;
+    this.numberOfLines = undefined;
+  }
+  render() {
+    const style = {};
+    if (typeof this.numberOfLines === 'number') {
+      style['--line-clamp'] = this.numberOfLines;
+    }
+    return (h(Host, { style: style }, h("slot", null)));
+  }
+  static get style() { return indexCss; }
+}, [4, "taro-text-core", {
+    "selectable": [1028],
+    "userSelect": [1028, "user-select"],
+    "space": [1025],
+    "numberOfLines": [2, "number-of-lines"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["taro-text-core"];
+  components.forEach(tagName => { switch (tagName) {
+    case "taro-text-core":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Text);
+      }
+      break;
+  } });
+}
+
+const TaroTextCore = Text;
+const defineCustomElement = defineCustomElement$1;
+
+export { Text as T, TaroTextCore, defineCustomElement };

package/dist/components/dist/components/taro-textarea-core.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TaroTextareaCore extends Components.TaroTextareaCore, HTMLElement {}
+export const TaroTextareaCore: {
+  prototype: TaroTextareaCore;
+  new (): TaroTextareaCore;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;