maxit-cli 0.1.0

package/registry/components/tabs/tabs.js

@@ -0,0 +1 @@
+import{__awaiter,__decorate}from"../common/tslib";import{SuperComponent,wxComponent}from"../common/src/index";import props from"./props";import config from"../common/config";import touch from"../common/mixins/touch";import{getRect,uniqueFactory}from"../common/utils";import{getObserver}from"../common/wechat";const{prefix:prefix}=config,name=`${prefix}-tabs`,getUniqueID=uniqueFactory("tabs");let Tabs=class extends SuperComponent{constructor(){super(...arguments),this.options={pureDataPattern:/^currentLabels$/},this.behaviors=[touch],this.externalClasses=[`${prefix}-class`,`${prefix}-class-item`,`${prefix}-class-active`,`${prefix}-class-track`,`${prefix}-class-content`],this.relations={"../tab-panel/tab-panel":{type:"descendant",linked(t){this.children.push(t),this.initChildId(),t.index=this.children.length-1,this.updateTabs()},unlinked(t){this.children=this.children.filter(e=>e.index!==t.index),this.updateTabs(()=>this.setTrack()),this.initChildId()}}},this.properties=props,this.controlledProps=[{key:"value",event:"change"}],this.observers={value(t){t!==this.getCurrentName()&&this.setCurrentIndexByName(t)}},this.data={prefix:prefix,classPrefix:name,tabs:[],currentLabels:[],currentIndex:-1,trackOption:{lineWidth:0,distance:0,isInit:!0},offset:0,scrollLeft:0,tabID:"",placement:"top"},this.lifetimes={created(){this.children=this.children||[]},attached(){wx.nextTick(()=>{this.setTrack()}),getRect(this,`.${name}`).then(t=>{this.containerWidth=t.width}),this.setData({tabID:getUniqueID()})}},this.methods={onScroll(t){const{scrollLeft:e}=t.detail;this.setData({scrollLeft:e})},updateTabs(t){const{children:e}=this,i=e.map(t=>t.data);i.forEach(t=>{"string"==typeof t.icon&&(t.icon={name:t.icon})}),this.setData({tabs:i},t),this.setCurrentIndexByName(this.properties.value)},setCurrentIndexByName(t){const{children:e}=this,i=e.findIndex(e=>e.getComputedName()===`${t}`);i>-1&&this.setCurrentIndex(i)},setCurrentIndex(t){if(t<=-1||t>=this.children.length)return;const e=[];this.children.forEach((i,s)=>{const r=t===s;r===i.data.active&&i.initialized||i.render(r,this),this.data.animation&&s<=t&&!i.data.hasActivated&&i.setData({hasActivated:!0}),e.push(i.data.label)});const{currentIndex:i,currentLabels:s}=this.data;i===t&&s.join("")===e.join("")||this.setData({currentIndex:t,currentLabels:e},()=>{this.setTrack()})},getCurrentName(){if(this.children){const t=this.children[this.data.currentIndex];if(t)return t.getComputedName()}},calcScrollOffset:(t,e,i,s)=>s+e-.5*t+i/2,getTabHeight(){return getRect(this,`.${name}`)},getTrackSize(){const{bottomLineMode:t}=this.properties,e={fixed:`.${prefix}-tabs__track`,auto:`.${prefix}-tabs__item--active .${prefix}-tabs__item-inner`,full:`.${prefix}-tabs__item--active`};return new Promise((i,s)=>{this.trackWidth?i(this.trackWidth):getRect(this,e[t]||e.fixed).then(t=>{t&&i(t.width)}).catch(s)})},setTrack(){return __awaiter(this,void 0,void 0,function*(){const{children:t}=this;if(!t)return;const{currentIndex:e}=this.data;if(!(e<=-1))try{const t=yield getRect(this,`.${prefix}-tabs__item`,!0),i=t[e];if(!i)return;let s=0,r=0,a=0;if(t.forEach(t=>{s<e&&(r+=t.width,s+=1),a+=t.width}),this.containerWidth){const t=this.calcScrollOffset(this.containerWidth,i.left,i.width,this.data.scrollLeft),e=a-this.containerWidth;this.setData({offset:Math.min(Math.max(t,0),e)})}else this._hasObserved||(this._hasObserved=!0,getObserver(this,`.${name}`).then(()=>this.setTrack()));const n=yield this.getTrackSize();"line"===this.data.theme&&(r+=(i.width-n)/2);const h=void 0===this.previousIndex;(h||this.previousIndex!==e)&&(this.previousIndex=e,this.setData({trackOption:{lineWidth:n,distance:r,isInit:h}}))}catch(t){this.triggerEvent("error",t)}})},onTabTap(t){const{index:e}=t.currentTarget.dataset;this.changeIndex(e)},onTouchStart(t){this.properties.swipeable&&this.touchStart(t)},onTouchMove(t){this.properties.swipeable&&this.touchMove(t)},onTouchEnd(){if(!this.properties.swipeable)return;const{direction:t,deltaX:e,offsetX:i}=this;if("horizontal"===t&&i>=50){const t=this.getAvailableTabIndex(e);-1!==t&&this.changeIndex(t)}},onTouchScroll(t){this._trigger("scroll",t.detail)},changeIndex(t){const e=this.data.tabs[t],{value:i,label:s}=e;(null==e?void 0:e.disabled)||t===this.data.currentIndex||this._trigger("change",{value:i,label:s}),this._trigger("click",{value:i,label:s})},getAvailableTabIndex(t){const e=t>0?-1:1,{currentIndex:i,tabs:s}=this.data,r=s.length;for(let t=e;i+e>=0&&i+e<r;t+=e){const e=i+t;if(!(e>=0&&e<r&&s[e]))return i;if(!s[e].disabled)return e}return-1}}}initChildId(){this.children.forEach((t,e)=>{t.setId(`${this.data.tabID}_panel_${e}`)})}};Tabs=__decorate([wxComponent()],Tabs);export default Tabs;

package/registry/components/tabs/tabs.json

@@ -0,0 +1 @@
+{"component":true,"styleIsolation":"apply-shared","usingComponents":{"o-sticky":"../sticky/sticky","o-badge":"../badge/badge","o-icon":"../icon/icon"}}

package/registry/components/tabs/tabs.wxml

@@ -0,0 +1 @@
+<import src="../common/template/badge.wxml"/><import src="../common/template/icon.wxml"/><wxs src="./tabs.wxs" module="_tabs"/><wxs src="../common/utils.wxs" module="_"/><view style="{{_._style([style, customStyle])}}" class="{{_.cls(classPrefix, [placement])}} class {{prefix}}-class"><o-sticky o-class="{{_.cls(classPrefix + '__sticky', [placement])}}" disabled="{{ !sticky }}" z-index="{{ stickyProps.zIndex || '1' }}" offset-top="{{ stickyProps.offsetTop || 0 }}" container="{{ stickyProps.container }}" bind:scroll="onTouchScroll"><view class="{{_.cls(classPrefix + '__wrapper', [theme])}}"><scroll-view class="{{_.cls(classPrefix + '__scroll', [placement, ['split', split]])}}" enhanced enable-flex scroll-left="{{offset}}" scroll-x="{{true}}" scroll-anchoring scroll-with-animation enable-passive show-scrollbar="{{false}}" type="list" bind:scroll="onScroll"><view class="{{_.cls(classPrefix + '__nav', [placement, ['evenly', spaceEvenly]])}}" aria-role="tablist"><view wx:for="{{tabs}}" wx:key="index" data-index="{{index}}" class="{{_.cls(classPrefix + '__item', [theme, ['evenly', spaceEvenly], placement, ['disabled', item.disabled], ['active', currentIndex === index]])}} {{currentIndex === index ? prefix + '-class-active' : ''}} {{prefix}}-class-item" bind:tap="onTabTap" aria-role="tab" aria-controls="{{tabID + '_panel_' + index}}" aria-selected="{{currentIndex === index}}" aria-disabled="{{item.disabled}}" aria-label="{{ ariaLabel || (item.badgeProps.dot || item.badgeProps.count ? item.label + _.getBadgeAriaLabel({ ...item.badgeProps }) : '') }}"><view class="{{_.cls(classPrefix + '__item-inner', [theme, ['active', currentIndex === index]])}}" aria-hidden="{{ item.badgeProps.dot || item.badgeProps.count }}"><template wx:if="{{item.icon}}" is="icon" data="{{ oClass: classPrefix + '__icon', ...item.icon }}"/><block wx:if="{{item.badgeProps}}"><template is="badge" data="{{ ...item.badgeProps, content: item.label, oClass: _.cls(classPrefix + '__badge', [ ['disabled', item.disabled], ['active', currentIndex === index]])}}"/></block><block wx:else>{{item.label}}</block></view><view wx:if="{{theme == 'card' && currentIndex - 1 == index}}" class="{{classPrefix}}__item-prefix"/><view wx:if="{{theme == 'card' && currentIndex + 1 == index}}" class="{{classPrefix}}__item-suffix"/></view><view wx:if="{{theme == 'line' && showBottomLine}}" class="{{_.cls(classPrefix + '__track', [placement])}} {{prefix}}-class-track" style="{{_tabs.trackStyle(trackOption)}}"/></view></scroll-view></view></o-sticky><slot name="middle"/><view class="{{_.cls(classPrefix + '__content', [['animated', animation]])}}" bind:touchstart="onTouchStart" bind:touchmove="onTouchMove" bind:touchend="onTouchEnd" bind:touchcancel="onTouchEnd"><view class="{{classPrefix}}__content-inner {{prefix}}-class-content" style="{{ _tabs.animate({duration: animation.duration, currentIndex:currentIndex}) }}"><slot/></view></view></view>

package/registry/components/tabs/tabs.wxs

@@ -0,0 +1,30 @@
+var utils = require('../common/utils.wxs');
+
+function animate(options) {
+  if (options.duration) {
+    return utils._style({
+      'transition-duration': options.duration + 's',
+      transform: 'translate3d( ' + -100 * options.currentIndex + '%,0, 0)',
+    });
+  }
+  return '';
+}
+
+function trackStyle(options) {
+  if (options.distance || options.lineWidth) {
+    return utils._style({
+      '-webkit-transform': 'translateX(' + options.distance + 'px)',
+      transform: 'translateX(' + options.distance + 'px)',
+      'transition-duration': options.isInit ? '0' : '0.3s',
+      width: options.lineWidth + 'px',
+      opacity: 1,
+    });
+  }
+
+  return '';
+}
+
+module.exports = {
+  animate: animate,
+  trackStyle: trackStyle,
+};

package/registry/components/tabs/tabs.wxss

@@ -0,0 +1,233 @@
+@import '../common/style/index.wxss';
+
+.o-tabs {
+    position: relative;
+    font: var(--o-tab-font,var(--o-font-body-medium,28rpx / 44rpx var(--o-font-family,Roboto,PingFang SC,Microsoft YaHei,Arial)));
+    background: var(--o-tab-nav-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+    flex-wrap: wrap;
+}
+
+.o-tabs__wrapper {
+    display: flex;
+    overflow: hidden;
+    background: var(--o-tab-nav-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tabs__wrapper--card {
+    background: var(--o-tab-item-tag-bg,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+    --o-tab-border-color: transparent;
+}
+
+.o-tabs__item {
+    position: relative;
+    display: flex;
+    flex: none;
+    align-items: center;
+    justify-content: center;
+    font-weight: 400;
+    color: var(--o-tab-item-color,var(--o-text-color-primary,var(--o-font-gray-1,#1c1b1f)));
+    padding: 0 var(--o-spacer-2,32rpx);
+    box-sizing: border-box;
+    white-space: nowrap;
+    overflow: hidden;
+    height: var(--o-tab-item-height,96rpx);
+}
+
+.o-tabs__item--active {
+    font-weight: 600;
+    color: var(--o-tab-item-active-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+}
+
+.o-tabs__item--disabled {
+    color: var(--o-tab-item-disabled-color,var(--o-text-color-disabled,var(--o-font-gray-4,rgba(0,0,0,.26))));
+}
+
+.o-tabs__item--evenly {
+    flex: 1 0 auto;
+}
+
+.o-tabs__item-inner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.o-tabs__item-inner--tag {
+    width: 100%;
+    text-align: center;
+    padding: 0 var(--o-spacer-2,32rpx);
+    line-height: var(--o-tab-item-tag-height,64rpx);
+    border-radius: calc(var(--o-tab-item-tag-height,64rpx)/ 2);
+    background-color: var(--o-tab-item-tag-bg,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+}
+
+.o-tabs__item-inner--active.o-tabs__item-inner--tag {
+    background-color: var(--o-tab-item-tag-active-bg,var(--o-brand-color-light,var(--o-primary-color-1,#fef3eb)));
+}
+
+.o-tabs__item--tag:not(.o-tabs__item--evenly) {
+    padding: 0 calc(var(--o-spacer,16rpx)/ 2);
+}
+
+.o-tabs__item--tag:not(.o-tabs__item--evenly):first-child {
+    margin-left: var(--o-spacer,16rpx);
+}
+
+.o-tabs__item--tag:not(.o-tabs__item--evenly):last-child {
+    padding-right: var(--o-spacer-1,24rpx);
+}
+
+.o-tabs__item--tag {
+    padding: 0 var(--o-spacer,16rpx);
+}
+
+.o-tabs__item--card.o-tabs__item--active {
+    background-color: var(--o-tab-nav-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+    border-radius: var(--o-radius-large,18rpx) var(--o-radius-large,18rpx) 0 0;
+}
+
+.o-tabs__item--card.o-tabs__item--active:first-child {
+    border-top-left-radius: 0;
+}
+
+.o-tabs__item--card.o-tabs__item--active:last-child {
+    border-top-right-radius: 0;
+}
+
+.o-tabs__item--card.o-tabs__item--pre {
+    border-bottom-right-radius: var(--o-radius-large,18rpx);
+}
+
+.o-tabs__item-prefix,
+.o-tabs__item-suffix {
+    position: absolute;
+    bottom: 0;
+    width: 18rpx;
+    height: 18rpx;
+    background-color: var(--o-tab-nav-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tabs__item-prefix::after,
+.o-tabs__item-suffix::after {
+    content: '';
+    display: block;
+    width: 100%;
+    height: 100%;
+    background-color: var(--o-tab-item-tag-bg,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+}
+
+.o-tabs__item-prefix {
+    right: 0;
+}
+
+.o-tabs__item-prefix::after {
+    border-bottom-right-radius: var(--o-radius-large,18rpx);
+}
+
+.o-tabs__item-suffix {
+    left: 0;
+}
+
+.o-tabs__item-suffix::after {
+    border-bottom-left-radius: var(--o-radius-large,18rpx);
+}
+
+.o-tabs__badge {
+    --o-badge-content-text-font: var(--o-tab-font, var(--o-font-body-medium, 28rpx / 44rpx var(--o-font-family, Roboto, PingFang SC, Microsoft YaHei, Arial)));
+}
+
+.o-tabs__badge--active {
+    --o-badge-content-text-font: var(--o-font-mark-medium, 600 28rpx / 44rpx var(--o-font-family, Roboto, PingFang SC, Microsoft YaHei, Arial));
+    --o-badge-content-text-color: var(--o-tab-item-active-color, var(--o-brand-color, var(--o-primary-color-7, #f16e00)));
+}
+
+.o-tabs__badge--disabled {
+    --o-badge-content-text-color: var(--o-tab-item-disabled-color, var(--o-text-color-disabled, var(--o-font-gray-4, rgba(0, 0, 0, 0.26))));
+}
+
+.o-tabs__icon {
+    font-size: var(--o-tab-icon-size,36rpx);
+    margin-right: calc(var(--o-spacer,16rpx)/ 4);
+}
+
+.o-tabs__content {
+    overflow: hidden;
+}
+
+.o-tabs__nav {
+    position: relative;
+    user-select: none;
+    display: flex;
+    flex-wrap: nowrap;
+    align-items: center;
+}
+
+.o-tabs__nav.o-tabs__nav--evenly {
+    width: 100%;
+}
+
+.o-tabs__track {
+    position: absolute;
+    font-weight: 600;
+    z-index: 1;
+    opacity: 0;
+    background-color: var(--o-tab-track-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    left: 0;
+    bottom: 1rpx;
+    width: var(--o-tab-track-width,32rpx);
+    height: var(--o-tab-track-thickness,6rpx);
+    border-radius: var(--o-tab-track-radius,8rpx);
+}
+
+.o-tabs__scroll {
+    position: relative;
+    height: var(--o-tab-item-height,96rpx);
+}
+
+.o-tabs__scroll--split {
+    position: relative;
+}
+
+.o-tabs__scroll--split::after {
+    content: '';
+    display: block;
+    position: absolute;
+    top: unset;
+    bottom: 0;
+    left: unset;
+    right: unset;
+    background-color: var(--o-tab-border-color,var(--o-component-stroke,var(--o-gray-color-3,#dddddd)));
+}
+
+.o-tabs__scroll--split::after {
+    height: 1px;
+    left: 0;
+    right: 0;
+    transform: scaleY(.5);
+}
+
+.o-tabs__scroll::-webkit-scrollbar {
+    display: none;
+}
+
+.o-tabs__content {
+    width: 100%;
+}
+
+.o-tabs__content-inner {
+    display: block;
+}
+
+.o-tabs__content--animated .o-tabs__content-inner {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    will-change: left;
+    transition-property: transform;
+}
+
+.o-tabs__item--active {
+    font-weight: var(--o-tab-item-active-weight,500);
+}
+

package/registry/components/tag/index.js

@@ -0,0 +1 @@
+export*from"./props";export*from"./tag";

package/registry/components/tag/props.js

@@ -0,0 +1 @@
+const props={closable:{type:null,value:!1},disabled:{type:Boolean,value:!1},icon:{type:null},maxWidth:{type:null},shape:{type:String,value:"square"},size:{type:String,value:"medium"},theme:{type:String,value:"default"},variant:{type:String,value:"dark"}};export default props;

package/registry/components/tag/tag.js

@@ -0,0 +1 @@
+import{__decorate}from"../common/tslib";import{wxComponent,SuperComponent}from"../common/src/index";import config from"../common/config";import props from"./props";import{classNames,calcIcon}from"../common/utils";import{isNumeric}from"../common/validator";const{prefix:prefix}=config,name=`${prefix}-tag`;let Tag=class extends SuperComponent{constructor(){super(...arguments),this.data={prefix:prefix,classPrefix:name,className:"",tagStyle:""},this.properties=props,this.externalClasses=[`${prefix}-class`],this.options={multipleSlots:!0},this.lifetimes={attached(){this.setClass(),this.setTagStyle()}},this.observers={"size, shape, theme, variant, closable, disabled"(){this.setClass()},maxWidth(){this.setTagStyle()},icon(s){this.setData({_icon:calcIcon(s)})},closable(s){this.setData({_closable:calcIcon(s,"close")})}},this.methods={setClass(){const{prefix:s,classPrefix:t}=this.data,{size:e,shape:a,theme:i,variant:o,closable:l,disabled:r}=this.properties,c=classNames([t,`${t}--${i||"default"}`,`${t}--${o}`,l?`${t}--closable ${s}-is-closable`:"",r?`${t}--disabled ${s}-is-disabled`:"",`${t}--${e}`,`${t}--${a}`]);this.setData({className:c})},setTagStyle(){const{maxWidth:s}=this.properties;if(!s)return"";const t=isNumeric(s)?`${s}px`:s;this.setData({tagStyle:`max-width:${t};`})},handleClick(s){this.data.disabled||this.triggerEvent("click",s)},handleClose(s){this.data.disabled||this.triggerEvent("close",s)}}}};Tag=__decorate([wxComponent()],Tag);export default Tag;

package/registry/components/tag/tag.json

@@ -0,0 +1 @@
+{"component":true,"styleIsolation":"apply-shared","usingComponents":{"o-icon":".././icon/icon"}}

package/registry/components/tag/tag.wxml

@@ -0,0 +1 @@
+<wxs src="../common/utils.wxs" module="_"/><import src="../common/template/icon.wxml"/><view class="{{className}} class {{prefix}}-class" style="{{_._style([tagStyle, style, customStyle])}}" bind:tap="handleClick"><view aria-hidden="{{true}}" class="{{classPrefix}}__icon"><template wx:if="{{_icon}}" is="icon" data="{{ oClass: prefix + '-icon', ..._icon }}"/><slot name="icon"/></view><view class="{{classPrefix}}__text"><slot/></view><o-icon wx:if="{{_closable}}" class="{{classPrefix}}__icon-close {{prefix}}-icon" prefix="{{_closable.prefix || ''}}" name="{{_closable.name || ''}}" size="{{_closable.size || ''}}" color="{{_closable.color || ''}}" aria-role="button" aria-label="Fermer" catch:tap="handleClose"/><slot wx:else name="closable"/></view>

package/registry/components/tag/tag.wxss

@@ -0,0 +1,268 @@
+@import '../common/style/index.wxss';
+
+.o-tag {
+    display: inline-flex;
+    align-items: center;
+    border: 2rpx solid transparent;
+    box-sizing: border-box;
+    border-radius: var(--o-tag-square-border-radius,8rpx);
+    user-select: none;
+    vertical-align: middle;
+}
+
+.o-tag__text {
+    word-wrap: normal;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.o-tag__icon,
+.o-tag__icon-close {
+    display: flex;
+    align-items: center;
+}
+
+.o-tag__icon-close {
+    color: var(--o-tag-close-icon-color,var(--o-text-color-placeholder,var(--o-font-gray-3,#8d8d8d)));
+}
+
+.o-tag__icon:not(:empty)+.o-tag__text:not(:empty),
+.o-tag__text:not(:empty)+.o-tag__icon-close:not(:empty) {
+    margin-left: calc(var(--o-spacer,16rpx)/ 2);
+}
+
+.o-tag.o-tag--small {
+    padding: var(--o-tag-small-padding,2rpx 10rpx);
+    font: var(--o-tag-small-font,var(--o-font-body-extraSmall,20rpx / 32rpx var(--o-font-family,Roboto,PingFang SC,Microsoft YaHei,Arial)));
+}
+
+.o-tag.o-tag--small .o-icon,
+.o-tag.o-tag--small .o-icon-close {
+    font-size: var(--o-tag-small-icon-size,24rpx);
+}
+
+.o-tag.o-tag--small .o-tag__icon:not(:empty)+.o-tag__text:not(:empty),
+.o-tag.o-tag--small .o-tag__text:not(:empty)+.o-tag__icon-close:not(:empty) {
+    margin-left: calc(var(--o-spacer,16rpx)/ 4);
+}
+
+.o-tag.o-tag--medium {
+    padding: var(--o-tag-medium-padding,2rpx 14rpx);
+    font: var(--o-tag-medium-font,var(--o-font-body-small,24rpx / 40rpx var(--o-font-family,Roboto,PingFang SC,Microsoft YaHei,Arial)));
+}
+
+.o-tag.o-tag--medium .o-icon,
+.o-tag.o-tag--medium .o-icon-close {
+    font-size: var(--o-tag-medium-icon-size,28rpx);
+}
+
+.o-tag.o-tag--large {
+    padding: var(--o-tag-large-padding,calc(var(--o-spacer,16rpx)/ 4) 14rpx);
+    font: var(--o-tag-large-font,var(--o-font-body-medium,28rpx / 44rpx var(--o-font-family,Roboto,PingFang SC,Microsoft YaHei,Arial)));
+}
+
+.o-tag.o-tag--large .o-icon,
+.o-tag.o-tag--large .o-icon-close {
+    font-size: var(--o-tag-large-icon-size,32rpx);
+}
+
+.o-tag.o-tag--extra-large {
+    padding: var(--o-tag-extra-large-padding,var(--o-spacer,16rpx) 30rpx);
+    font: var(--o-tag-extra-large-font,var(--o-font-body-medium,28rpx / 44rpx var(--o-font-family,Roboto,PingFang SC,Microsoft YaHei,Arial)));
+}
+
+.o-tag.o-tag--extra-large .o-icon,
+.o-tag.o-tag--extra-large .o-icon-close {
+    font-size: var(--o-tag-extra-large-icon-size,32rpx);
+}
+
+.o-tag.o-tag--square {
+    border-radius: var(--o-tag-square-border-radius,8rpx);
+}
+
+.o-tag.o-tag--round {
+    border-radius: var(--o-tag-round-border-radius,var(--o-radius-round,999px));
+}
+
+.o-tag.o-tag--mark {
+    border-radius: 0;
+    border-top-right-radius: var(--o-tag-mark-border-radius,var(--o-tag-round-border-radius,var(--o-radius-round,999px)));
+    border-bottom-right-radius: var(--o-tag-mark-border-radius,var(--o-tag-round-border-radius,var(--o-radius-round,999px)));
+}
+
+.o-tag--dark.o-tag--default {
+    color: var(--o-text-color-anti,var(--o-font-white-1,#fff));
+    border-color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    background-color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+}
+
+.o-tag--dark.o-tag--primary {
+    color: var(--o-tag-primary-text-color,#000);
+    border-color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    background-color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+}
+
+.o-tag--dark.o-tag--success {
+    color: var(--o-text-color-anti,var(--o-font-white-1,#fff));
+    border-color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    background-color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+}
+
+.o-tag--dark.o-tag--warning {
+    color: var(--o-text-color-anti,var(--o-font-white-1,#fff));
+    border-color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    background-color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+}
+
+.o-tag--dark.o-tag--danger {
+    color: var(--o-text-color-anti,var(--o-font-white-1,#fff));
+    border-color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    background-color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+}
+
+.o-tag--dark.o-tag--default {
+    color: var(--o-tag-default-font-color,var(--o-text-color-primary,var(--o-font-gray-1,#1c1b1f)));
+}
+
+.o-tag--outline.o-tag--default {
+    color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    border-color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    background-color: var(--o-tag-default-light-color,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+}
+
+.o-tag--outline.o-tag--primary {
+    color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    border-color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    background-color: var(--o-tag-primary-light-color,var(--o-brand-color-light,var(--o-primary-color-1,#fef3eb)));
+}
+
+.o-tag--outline.o-tag--success {
+    color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    border-color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    background-color: var(--o-tag-success-light-color,var(--o-success-color-1,#eaf7ee));
+}
+
+.o-tag--outline.o-tag--warning {
+    color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    border-color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    background-color: var(--o-tag-warning-light-color,var(--o-warning-color-1,#fff1e9));
+}
+
+.o-tag--outline.o-tag--danger {
+    color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    border-color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    background-color: var(--o-tag-danger-light-color,var(--o-error-color-1,#f9dedc));
+}
+
+.o-tag--outline.o-tag--default {
+    color: var(--o-tag-default-font-color,var(--o-text-color-primary,var(--o-font-gray-1,#1c1b1f)));
+}
+
+.o-tag--outline.o-tag--default {
+    background-color: var(--o-tag-outline-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tag--outline.o-tag--primary {
+    background-color: var(--o-tag-outline-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tag--outline.o-tag--success {
+    background-color: var(--o-tag-outline-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tag--outline.o-tag--warning {
+    background-color: var(--o-tag-outline-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tag--outline.o-tag--danger {
+    background-color: var(--o-tag-outline-bg-color,var(--o-bg-color-container,var(--o-font-white-1,#fff)));
+}
+
+.o-tag--light.o-tag--default {
+    color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    border-color: var(--o-tag-default-light-color,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+    background-color: var(--o-tag-default-light-color,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+}
+
+.o-tag--light.o-tag--primary {
+    color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    border-color: var(--o-tag-primary-light-color,var(--o-brand-color-light,var(--o-primary-color-1,#fef3eb)));
+    background-color: var(--o-tag-primary-light-color,var(--o-brand-color-light,var(--o-primary-color-1,#fef3eb)));
+}
+
+.o-tag--light.o-tag--success {
+    color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    border-color: var(--o-tag-success-light-color,var(--o-success-color-1,#eaf7ee));
+    background-color: var(--o-tag-success-light-color,var(--o-success-color-1,#eaf7ee));
+}
+
+.o-tag--light.o-tag--warning {
+    color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    border-color: var(--o-tag-warning-light-color,var(--o-warning-color-1,#fff1e9));
+    background-color: var(--o-tag-warning-light-color,var(--o-warning-color-1,#fff1e9));
+}
+
+.o-tag--light.o-tag--danger {
+    color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    border-color: var(--o-tag-danger-light-color,var(--o-error-color-1,#f9dedc));
+    background-color: var(--o-tag-danger-light-color,var(--o-error-color-1,#f9dedc));
+}
+
+.o-tag--light.o-tag--default {
+    color: var(--o-tag-default-font-color,var(--o-text-color-primary,var(--o-font-gray-1,#1c1b1f)));
+}
+
+.o-tag--light-outline.o-tag--default {
+    color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    border-color: var(--o-tag-default-color,var(--o-bg-color-component,var(--o-gray-color-3,#dddddd)));
+    background-color: var(--o-tag-default-light-color,var(--o-bg-color-secondarycontainer,var(--o-gray-color-1,#eeeeee)));
+}
+
+.o-tag--light-outline.o-tag--primary {
+    color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    border-color: var(--o-tag-primary-color,var(--o-brand-color,var(--o-primary-color-7,#f16e00)));
+    background-color: var(--o-tag-primary-light-color,var(--o-brand-color-light,var(--o-primary-color-1,#fef3eb)));
+}
+
+.o-tag--light-outline.o-tag--success {
+    color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    border-color: var(--o-tag-success-color,var(--o-success-color,var(--o-success-color-5,#028702)));
+    background-color: var(--o-tag-success-light-color,var(--o-success-color-1,#eaf7ee));
+}
+
+.o-tag--light-outline.o-tag--warning {
+    color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    border-color: var(--o-tag-warning-color,var(--o-warning-color,var(--o-warning-color-5,#e37318)));
+    background-color: var(--o-tag-warning-light-color,var(--o-warning-color-1,#fff1e9));
+}
+
+.o-tag--light-outline.o-tag--danger {
+    color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    border-color: var(--o-tag-danger-color,var(--o-error-color,var(--o-error-color-6,#cd3c14)));
+    background-color: var(--o-tag-danger-light-color,var(--o-error-color-1,#f9dedc));
+}
+
+.o-tag--light-outline.o-tag--default {
+    color: var(--o-tag-default-font-color,var(--o-text-color-primary,var(--o-font-gray-1,#1c1b1f)));
+    border-color: var(--o-component-border,var(--o-gray-color-4,#dddddd));
+}
+
+.o-tag.o-tag--closable.o-tag--disabled {
+    cursor: not-allowed;
+    color: var(--o-tag-disabled-color,var(--o-text-color-disabled,var(--o-font-gray-4,rgba(0,0,0,.26))));
+    background-color: var(--o-tag-disabled-background-color,var(--o-bg-color-component-disabled,var(--o-gray-color-2,#eee)));
+    border-color: var(--o-tag-disabled-border-color,var(--o-component-border,var(--o-gray-color-4,#dddddd)));
+}
+
+.o-tag--dark.o-tag--default {
+    color: var(--o-tag-default-fill-text-color,#1c1b1f);
+}
+
+.o-tag--dark.o-tag--warning,
+.o-tag--outline.o-tag--warning,
+.o-tag--light.o-tag--warning,
+.o-tag--light-outline.o-tag--warning {
+    color: var(--o-tag-warning-text-color,var(--o-static-on-canary,#000));
+}
+

package/registry/components/text/index.js

@@ -0,0 +1 @@
+export*from"./props";export*from"./text";

package/registry/components/text/props.js

@@ -0,0 +1 @@
+const props={code:{type:Boolean,value:!1},content:{type:String},copyable:{type:null,value:!1},delete:{type:Boolean,value:!1},disabled:{type:Boolean,value:!1},ellipsis:{type:null,value:!1},italic:{type:Boolean,value:!1},keyboard:{type:Boolean,value:!1},mark:{type:null,value:!1},strong:{type:Boolean,value:!1},theme:{type:String},underline:{type:Boolean,value:!1}};export default props;

package/registry/components/text/text.js

@@ -0,0 +1 @@
+import{__decorate}from"../common/tslib";import{SuperComponent,wxComponent}from"../common/src/index";import config from"../common/config";import props from"./props";import usingConfig from"../common/mixins/using-config";const{prefix:prefix}=config,componentName="typography";let Text=class extends SuperComponent{constructor(){super(...arguments),this.behaviors=[usingConfig({componentName:"typography"})],this.externalClasses=[`${prefix}-class`,`${prefix}-class-copy`],this.options={multipleSlots:!0},this.properties=props,this.data={prefix:prefix,classPrefix:`${prefix}-typography`,className:"",_delete:!1,isExpanded:!1,isCopied:!1},this.lifetimes={attached(){this.updateClass()}},this.observers={"theme, disabled"(){this.updateClass()},delete(e){this.setData({_delete:e})}},this.methods={updateClass(){const{classPrefix:e}=this.data,{theme:t,disabled:s}=this.properties,i=[e];s?i.push(`${e}--disabled`):t&&["primary","secondary","success","warning","error"].includes(t)&&i.push(`${e}--${t}`),this.setData({className:i.join(" ")})},onExpand(){this.setData({isExpanded:!0});const{ellipsis:e}=this.properties;"object"==typeof e&&this.triggerEvent("expand",{expanded:!0})},onCollapse(){this.setData({isExpanded:!1});const{ellipsis:e}=this.properties;"object"==typeof e&&this.triggerEvent("expand",{expanded:!1})},onCopy(){if(this.data.isCopied)return;const{copyable:e,content:t}=this.properties;let s=t||"";"object"==typeof e&&null!==e&&e.text&&(s=e.text),wx.setClipboardData({data:s,success:()=>{this.setData({isCopied:!0}),this.triggerEvent("copy",{text:s}),setTimeout(()=>{this.setData({isCopied:!1})},1500)}})}}}};Text=__decorate([wxComponent()],Text);export default Text;

package/registry/components/text/text.json

@@ -0,0 +1 @@
+{"component":true,"styleIsolation":"apply-shared","usingComponents":{"o-icon":"../icon/icon"}}

package/registry/components/text/text.wxml

@@ -0,0 +1 @@
+<wxs src="../common/utils.wxs" module="_"/><wxs src="../common/typography/typography.wxs" module="_this"/><import src="../common/typography/ellipsis.wxml"/><view class="{{className}} {{prefix}}-class {{_this.wrapperClass(classPrefix, ellipsis)}}" style="{{ellipsis ? '' : 'display:inline;'}}{{_._style([style, customStyle])}}{{ellipsis ? '' : _this.markStyle(mark)}}"><view wx:if="{{ellipsis}}" class="{{classPrefix}}__ellipsis-content {{_this.decorClass(classPrefix, strong, underline, _delete, code, mark, keyboard, italic)}}" style="{{_this.ellipsisStyle(ellipsis, isExpanded)}}{{_this.markStyle(mark)}}"><text wx:if="{{content}}">{{content}}</text><slot wx:else/></view><block wx:else><view class="{{_this.decorClass(classPrefix, strong, underline, _delete, code, mark, keyboard, italic)}}" style="display: inline"><text wx:if="{{content}}">{{content}}</text><slot wx:else/></view></block><template is="ellipsis-toggle" data="{{ellipsis, isExpanded, classPrefix, globalConfig, extraStyle: copyable ? 'margin-right:16rpx;' : ''}}"/><view wx:if="{{copyable}}" class="{{classPrefix}}__copy {{prefix}}-class-copy" bind:tap="onCopy"><block wx:if="{{isCopied}}"><o-icon name="check"/></block><block wx:elif="{{copyable.suffix}}"><slot name="suffix"/></block><block wx:else><o-icon name="file-copy"/></block></view></view>