初始化项目, 添加TDesign等包

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/props.d.ts

@@ -0,0 +1,3 @@
+import { TdTabBarItemProps } from './type';
+declare const props: TdTabBarItemProps;
+export default props;

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/props.js

@@ -0,0 +1 @@
+const props={badgeProps:{type:Object},icon:{type:null},subTabBar:{type:Array},value:{type:null}};export default props;

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/tab-bar-item.d.ts

@@ -0,0 +1,37 @@
+import { SuperComponent, RelationsOptions } from '../common/src/index';
+export default class TabBarItem extends SuperComponent {
+    externalClasses: string[];
+    parent: any;
+    relations: RelationsOptions;
+    options: {
+        multipleSlots: boolean;
+    };
+    data: {
+        prefix: string;
+        classPrefix: string;
+        isSpread: boolean;
+        isChecked: boolean;
+        hasChildren: boolean;
+        currentName: string;
+        split: boolean;
+        iconOnly: boolean;
+        theme: string;
+        crowded: boolean;
+        shape: string;
+    };
+    properties: import("./type").TdTabBarItemProps;
+    observers: {
+        subTabBar(value: Record<string, any>[]): void;
+        icon(v: any): void;
+    };
+    lifetimes: {
+        attached(): Promise<void>;
+    };
+    methods: {
+        showSpread(): void;
+        toggle(): void;
+        selectChild(event: any): void;
+        checkActive(value: any): void;
+        closeSpread(): void;
+    };
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/tab-bar-item.js

@@ -0,0 +1 @@
+import{__awaiter,__decorate}from"tslib";import{wxComponent,SuperComponent}from"../common/src/index";import config from"../common/config";import props from"./props";import{getRect,calcIcon}from"../common/utils";const{prefix:prefix}=config,classPrefix=`${prefix}-tab-bar-item`;let TabBarItem=class extends SuperComponent{constructor(){super(...arguments),this.externalClasses=[`${prefix}-class`],this.parent=null,this.relations={"../tab-bar/tab-bar":{type:"ancestor",linked(t){const{theme:e,split:a,shape:s}=t.data;this.setData({theme:e,split:a,shape:s,currentName:this.properties.value?this.properties.value:t.initName()}),t.updateChildren()}}},this.options={multipleSlots:!0},this.data={prefix:prefix,classPrefix:classPrefix,isSpread:!1,isChecked:!1,hasChildren:!1,currentName:"",split:!0,iconOnly:!1,theme:"",crowded:!1,shape:"normal"},this.properties=props,this.observers={subTabBar(t){this.setData({hasChildren:t.length>0})},icon(t){this.setData({_icon:calcIcon(t)})}},this.lifetimes={attached(){return __awaiter(this,void 0,void 0,function*(){const t=yield getRect(this,`.${classPrefix}__text`);this.setData({iconOnly:0===t.height})})}},this.methods={showSpread(){this.setData({isSpread:!0})},toggle(){const{currentName:t,hasChildren:e,isSpread:a}=this.data;e&&this.setData({isSpread:!a}),this.$parent.updateValue(t),this.$parent.changeOtherSpread(t)},selectChild(t){const{value:e}=t.target.dataset;this.$parent.updateValue(e),this.setData({isSpread:!1})},checkActive(t){const{currentName:e,subTabBar:a}=this.data,s=(null==a?void 0:a.some(e=>e.value===t))||e===t;this.setData({isChecked:s})},closeSpread(){this.setData({isSpread:!1})}}}};TabBarItem=__decorate([wxComponent()],TabBarItem);export default TabBarItem;

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/tab-bar-item.json

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

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/tab-bar-item.wxml

@@ -0,0 +1 @@
+<import src="../common/template/icon.wxml"/><wxs src="../common/utils.wxs" module="_"/><view style="{{_._style([style, customStyle])}}" class="{{_.cls(classPrefix, [['split', split], ['text-only', !icon], ['crowded', crowded], shape])}} class {{prefix}}-class"><view class="{{_.cls(classPrefix + '__content', [['checked', isChecked], theme])}}" hover-class="{{classPrefix}}__content--active" hover-stay-time="{{200}}" bindtap="toggle" aria-selected="{{(!hasChildren || !isSpread) && isChecked ? true : false}}" aria-expanded="{{hasChildren && isSpread ? true : ''}}" aria-role="{{hasChildren ? 'button' : 'tab'}}" aria-label="{{ ariaLabel || (badgeProps.dot || badgeProps.count ? _.getBadgeAriaLabel({ ...badgeProps }) : '') }}"><view class="{{classPrefix}}__icon" style="height: {{iconOnly ? 24 : 20}}px" aria-hidden="{{ badgeProps.dot || badgeProps.count }}"><t-badge wx:if="{{badgeProps.dot || badgeProps.count}}" count="{{badgeProps.count || 0}}" max-count="{{badgeProps.maxCount || 99}}" dot="{{badgeProps.dot || false}}" content="{{badgeProps.content || ''}}" size="{{badgeProps.size || 'medium'}}" visible="{{badgeProps.visible}}" offset="{{badgeProps.offset || [0,0]}}" t-class-count="{{prefix + '-badge-class'}}"><template is="icon" data="{{ size: iconOnly ? 24 : 20, ..._icon }}"/></t-badge><template wx:elif="{{!!icon}}" is="icon" data="{{ ariaHidden: !iconOnly, size: iconOnly ? 24 : 20, ..._icon }}"/><slot name="icon"/></view><view class="{{_.cls(classPrefix + '__text', [['small', !!icon]])}}"><t-icon wx:if="{{hasChildren}}" name="view-list" size="32rpx" t-class="{{classPrefix}}__icon-menu"/><slot/></view></view><view class="{{classPrefix}}__spread" wx:if="{{hasChildren && isSpread}}"><view class="{{classPrefix}}__spread-item" hover-class="{{classPrefix}}__spread-item--active" hover-stay-time="{{200}}" wx:for="{{subTabBar}}" wx:for-item="child" wx:for-index="index" wx:key="value" bind:tap="selectChild" data-value="{{child.value || index}}" aria-role="tab"><view class="{{classPrefix}}__spread-item-split" wx:if="{{index !== 0}}"/><view class="{{classPrefix}}__spread-item-text" data-value="{{child.value || index}}">{{ child.label }}</view></view></view></view>

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/tab-bar-item.wxss

@@ -0,0 +1,21 @@
+@import '../common/style/index.wxss';:host{flex:1;}
+.t-tab-bar-item{flex:1;height:var(--td-tab-bar-height,80rpx);box-sizing:border-box;user-select:none;position:relative;margin:16rpx 0;padding:0 24rpx;}
+.t-tab-bar-item--text-only{font-size:32rpx;}
+.t-tab-bar-item--split+.t-tab-bar-item--split::before{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;top:0;bottom:0;left:0;border-left:1px solid var(--td-tab-bar-border-color,var(--td-border-color,var(--td-gray-color-3,#e7e7e7)));transform:scaleX(.5);top:16rpx;bottom:16rpx;}
+.t-tab-bar-item--crowded{padding:0 16rpx;}
+.t-tab-bar-item--round{border-radius:99px;}
+.t-tab-bar-item__content{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:16rpx;color:var(--td-tab-bar-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));}
+.t-tab-bar-item__content--checked{color:var(--td-tab-bar-active-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));font-weight:600;}
+.t-tab-bar-item__content--tag{border-radius:99px;}
+.t-tab-bar-item__content--tag.t-tab-bar-item__content--checked{background-color:var(--td-tab-bar-active-bg,var(--td-brand-color-light,var(--td-primary-color-1,#f2f3ff)));}
+.t-tab-bar-item__icon{display:contents;}
+.t-tab-bar-item__icon:empty{display:none;}
+.t-tab-bar-item__text{display:flex;align-items:center;}
+.t-tab-bar-item__text--small{font-size:20rpx;line-height:32rpx;}
+.t-tab-bar-item__icon-menu{margin-right:8rpx;}
+.t-tab-bar-item__spread{position:absolute;top:0;left:7%;width:86%;background-color:var(--td-tab-bar-bg-color,var(--td-bg-color-container,var(--td-font-white-1,#fff)));transform:translate3d(0,calc(-100% - 32rpx),0);z-index:1;border-radius:12rpx;color:var(--td-tab-bar-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));box-shadow:var(--td-tab-bar-spread-shadow,var(--td-shadow-3,0 6px 30px 5px rgba(0,0,0,.05),0 16px 24px 2px rgba(0,0,0,.04),0 8px 10px -5px rgba(0,0,0,.08)));}
+.t-tab-bar-item__spread::before{display:block;content:'';position:absolute;bottom:0;left:50%;width:0;height:0;border:16rpx solid transparent;border-top:16rpx solid var(--td-tab-bar-bg-color,var(--td-bg-color-container,var(--td-font-white-1,#fff)));transform:translate3d(-50%,32rpx,0);}
+.t-tab-bar-item__spread-item{width:100%;height:96rpx;display:flex;align-items:center;justify-content:flex-start;position:relative;flex-direction:column;}
+.t-tab-bar-item__spread-item--active{background-color:var(--td-tab-bar-hover-bg-color,rgba(0,0,0,.05));}
+.t-tab-bar-item__spread-item-split{box-sizing:border-box;content:' ';pointer-events:none;background-color:var(--td-tab-bar-spread-border-color,var(--td-border-color,var(--td-gray-color-3,#e7e7e7)));width:80%;height:1px;transform:translateY(.5);}
+.t-tab-bar-item__spread-item-text{padding-top:24rpx;}

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/type.d.ts

@@ -0,0 +1,23 @@
+import { BadgeProps } from '../badge/index';
+export interface TdTabBarItemProps {
+    badgeProps?: {
+        type: ObjectConstructor;
+        value?: BadgeProps;
+    };
+    icon?: {
+        type: null;
+        value?: string | object;
+    };
+    subTabBar?: {
+        type: ArrayConstructor;
+        value?: SubTabBarItem[];
+    };
+    value?: {
+        type: null;
+        value?: string | number;
+    };
+}
+export interface SubTabBarItem {
+    value: string;
+    label: string;
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/tab-bar-item/type.js

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