@nutui/nutui-react-taro 3.0.0-beta.10 → 3.0.0-beta.12

package/dist/es/packages/switch/style/style.harmony.css

@@ -0,0 +1,91 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-switch {
+  cursor: pointer;
+  position: relative;
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  min-width: 46px;
+  height: 28px;
+  line-height: 28px;
+  background-color: #ff0f23;
+  border-radius: 50px;
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  background-position: center center;
+  flex: 0 0 auto;
+}
+.nut-switch-button {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  height: calc(28px - 2px * 2);
+  width: calc(28px - 2px * 2);
+  border-radius: 50%;
+  background: #ffffff;
+  transition: left 0.3s linear;
+  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
+}
+.nut-switch-button-open {
+  left: calc(100% - 28px + 2px);
+}
+.nut-switch-button-open-rtl {
+  left: 2px;
+}
+.nut-switch-button-close {
+  left: 2px;
+}
+.nut-switch-button-close-rtl {
+  left: calc(100% - 28px + 2px);
+}
+.nut-switch-close {
+  background-color: #c2c4cc;
+}
+.nut-switch-close-line {
+  width: calc((28px - 2px * 2) / 2);
+  height: 2px;
+  background: #ffffff;
+  border-radius: 2px;
+}
+.nut-switch-label {
+  display: inline-flex;
+  align-items: center;
+  height: 100%;
+  white-space: nowrap;
+  color: #ffffff;
+  font-size: 12px;
+}
+.nut-switch-label .nut-icon {
+  color: #ffffff;
+}
+.nut-switch-label-open {
+  margin: 0 calc(28px - 2px + 3px) 0 7px;
+}
+.nut-switch-label-open-rtl {
+  margin: 0 7px 0 calc(28px - 2px + 3px);
+}
+.nut-switch-label-close {
+  margin: 0 7px 0 calc(28px - 2px + 3px);
+}
+.nut-switch-label-close-rtl {
+  margin: 0 calc(28px - 2px + 3px) 0 7px;
+}
+.nut-switch-label-close-disabled {
+  color: #c2c4cc;
+}
+.nut-switch-label-close-disabled .nut-icon {
+  color: #c2c4cc;
+}
+.nut-switch-disabled {
+  background-color: #ffadbe;
+}
+.nut-switch-disabled-close {
+  background-color: #f2f3f5;
+}

package/dist/es/packages/tabbar/style/style.css

@@ -11,7 +11,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  background: var(--nutui-badge-background-color, var(--nutui-brand-6));
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
   padding: var(--nutui-badge-icon-padding, 2px);
   text-align: center;
   z-index: var(--nutui-badge-z-index, 1);
@@ -48,7 +48,7 @@
   white-space: nowrap;
   font-weight: normal;
   vertical-align: middle;
-  background: var(--nutui-badge-background-color, var(--nutui-brand-6));
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
   z-index: 1;
 }
 .nut-badge-number {
@@ -93,10 +93,10 @@
 }
 .nut-badge-outline {
   background: #ffffff;
-  color: var(--nutui-badge-outline-color, var(--nutui-brand-6));
+  color: var(--nutui-badge-outline-color, var(--nutui-color-primary, #ff0f23));
 }
 .nut-badge-outline::after {
-  border: var(--nutui-badge-outline-border, 1px solid var(--nutui-brand-6));
+  border: var(--nutui-badge-outline-border, 1px solid var(--nutui-color-primary, #ff0f23));
 }
 
 .nut-tabbar-item {
@@ -107,7 +107,7 @@
   flex: 1;
   text-align: center;
   text-decoration: none;
-  color: var(--nutui-tabbar-inactive-color, var(--nutui-gray-7));
+  color: var(--nutui-tabbar-inactive-color, var(--nutui-color-title, #1a1a1a));
   height: 100%;
 }
 .nut-tabbar-item-icon-box {
@@ -124,7 +124,7 @@
 }
 .nut-tabbar-item-icon-box-nav {
   display: block;
-  color: var(--nutui-gray-6);
+  color: var(--nutui-color-text, #505259);
   font-size: var(--nutui-tabbar-text-font-size, var(--nutui-font-size-xs, 11px));
   line-height: var(--nutui-tabbar-text-font-size, var(--nutui-font-size-xs, 11px));
   margin-top: var(--nutui-tabbar-text-margin-top, 3px);
@@ -136,11 +136,11 @@
   font-weight: var(--nutui-tabbar-text-large-font-weight, var(--nutui-font-weight, 400));
 }
 .nut-tabbar-item-active {
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
 }
 .nut-tabbar-item-active .nut-tabbar-item-icon-box {
   /* #ifdef harmony*/
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
   /* #endif*/
   /* #ifndef harmony*/
   color: inherit;
@@ -148,7 +148,7 @@
 }
 .nut-tabbar-item-active .nut-tabbar-item-icon-box .nut-icon {
   /* #ifdef harmony*/
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
   /* #endif*/
   /* #ifndef harmony*/
   color: inherit;
@@ -166,7 +166,7 @@
   justify-content: center;
   align-items: center;
   box-sizing: border-box;
-  background: var(--nutui-gray-1);
+  background: var(--nutui-color-background-overlay, #ffffff);
 }
 .nut-tabbar-wrap {
   width: 100%;

package/dist/es/packages/tabbar/style/style.harmony.css

@@ -0,0 +1,50 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-tabbar {
+  border: 0px;
+  box-shadow: none;
+  border-bottom: 1px solid #eee;
+  border-top: 1px solid #eee;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  box-sizing: border-box;
+  background: #ffffff;
+}
+.nut-tabbar-wrap {
+  width: 100%;
+  height: 50px;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+.nut-tabbar:last-child {
+  border-right: 0;
+}
+.nut-tabbar-fixed {
+  position: fixed;
+  bottom: 0px;
+  left: 0px;
+}
+.nut-tabbar-safe-area {
+  display: block;
+  width: 100%;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+[dir=rtl] .nut-tabbar:last-child,
+.nut-rtl .nut-tabbar:last-child {
+  border-right: none;
+  border-left: 0;
+}
+[dir=rtl] .nut-tabbar-fixed,
+.nut-rtl .nut-tabbar-fixed {
+  left: auto;
+  right: 0px;
+}

package/dist/es/packages/tabbaritem/style/style.css

@@ -11,7 +11,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  background: var(--nutui-badge-background-color, var(--nutui-brand-6));
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
   padding: var(--nutui-badge-icon-padding, 2px);
   text-align: center;
   z-index: var(--nutui-badge-z-index, 1);
@@ -48,7 +48,7 @@
   white-space: nowrap;
   font-weight: normal;
   vertical-align: middle;
-  background: var(--nutui-badge-background-color, var(--nutui-brand-6));
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
   z-index: 1;
 }
 .nut-badge-number {
@@ -93,10 +93,10 @@
 }
 .nut-badge-outline {
   background: #ffffff;
-  color: var(--nutui-badge-outline-color, var(--nutui-brand-6));
+  color: var(--nutui-badge-outline-color, var(--nutui-color-primary, #ff0f23));
 }
 .nut-badge-outline::after {
-  border: var(--nutui-badge-outline-border, 1px solid var(--nutui-brand-6));
+  border: var(--nutui-badge-outline-border, 1px solid var(--nutui-color-primary, #ff0f23));
 }
 
 .nut-tabbar-item {
@@ -107,7 +107,7 @@
   flex: 1;
   text-align: center;
   text-decoration: none;
-  color: var(--nutui-tabbar-inactive-color, var(--nutui-gray-7));
+  color: var(--nutui-tabbar-inactive-color, var(--nutui-color-title, #1a1a1a));
   height: 100%;
 }
 .nut-tabbar-item-icon-box {
@@ -124,7 +124,7 @@
 }
 .nut-tabbar-item-icon-box-nav {
   display: block;
-  color: var(--nutui-gray-6);
+  color: var(--nutui-color-text, #505259);
   font-size: var(--nutui-tabbar-text-font-size, var(--nutui-font-size-xs, 11px));
   line-height: var(--nutui-tabbar-text-font-size, var(--nutui-font-size-xs, 11px));
   margin-top: var(--nutui-tabbar-text-margin-top, 3px);
@@ -136,11 +136,11 @@
   font-weight: var(--nutui-tabbar-text-large-font-weight, var(--nutui-font-weight, 400));
 }
 .nut-tabbar-item-active {
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
 }
 .nut-tabbar-item-active .nut-tabbar-item-icon-box {
   /* #ifdef harmony*/
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
   /* #endif*/
   /* #ifndef harmony*/
   color: inherit;
@@ -148,7 +148,7 @@
 }
 .nut-tabbar-item-active .nut-tabbar-item-icon-box .nut-icon {
   /* #ifdef harmony*/
-  color: var(--nutui-tabbar-active-color, var(--nutui-brand-6));
+  color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
   /* #endif*/
   /* #ifndef harmony*/
   color: inherit;

package/dist/es/packages/tabbaritem/style/style.harmony.css

@@ -0,0 +1,59 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-tabbar-item {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  flex: 1;
+  text-align: center;
+  text-decoration: none;
+  color: #1a1a1a;
+  height: 100%;
+}
+.nut-tabbar-item-icon-box {
+  padding: 0px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+.nut-tabbar-item-icon-box .nut-icon {
+  width: 22px;
+  height: 22px;
+  font-size: 22px;
+}
+.nut-tabbar-item-icon-box-nav {
+  display: block;
+  color: #505259;
+  font-size: 11px;
+  line-height: 11px;
+  margin-top: 3px;
+}
+.nut-tabbar-item-icon-box-large {
+  font-size: 16px;
+  margin-top: 0;
+  line-height: 20px;
+  font-weight: 400;
+}
+.nut-tabbar-item-active {
+  color: #ff0f23;
+}
+.nut-tabbar-item-active .nut-tabbar-item-icon-box {
+  /* #ifdef harmony*/
+  color: #ff0f23;
+  /* #endif*/
+  /* #ifndef harmony*/
+  color: inherit;
+  /* #endif*/
+}
+.nut-tabbar-item-active .nut-tabbar-item-icon-box .nut-icon {
+  /* #ifdef harmony*/
+  color: #ff0f23;
+  /* #endif*/
+  /* #ifndef harmony*/
+  color: inherit;
+  /* #endif*/
+}

package/dist/es/packages/table/style/style.css

@@ -13,11 +13,11 @@
   width: 100%;
   flex-direction: column;
   font-size: var(--nutui-font-size-base, 14px);
-  color: var(--nutui-gray-7);
+  color: var(--nutui-color-title, #1a1a1a);
   overflow-y: auto;
   overflow-x: hidden;
   position: relative;
-  border: 1px solid var(--nutui-table-border-color, var(--nutui-black-3));
+  border: 1px solid var(--nutui-table-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
 }
 .nut-table-wrapper-sticky {
   overflow-x: auto;
@@ -25,21 +25,21 @@
 .nut-table-main {
   display: table;
   overflow-x: auto;
-  color: var(--nutui-gray-7);
-  background-color: var(--nutui-gray-1);
+  color: var(--nutui-color-title, #1a1a1a);
+  background-color: var(--nutui-color-background-overlay, #ffffff);
   table-layout: fixed;
   width: max-content;
   min-width: 100%;
   position: relative;
 }
 .nut-table-main-striped .nut-table-main-head-tr {
-  background-color: var(--nutui-table-tr-even-bg-color, var(--nutui-gray-3));
+  background-color: var(--nutui-table-tr-even-bg-color, var(--nutui-color-background, #f2f3f5));
 }
 .nut-table-main-striped .nut-table-main-body-tr:nth-child(odd) {
   background-color: var(--nutui-table-tr-odd-bg-color, #ffffff);
 }
 .nut-table-main-striped .nut-table-main-body-tr:nth-child(even) {
-  background-color: var(--nutui-table-tr-even-bg-color, var(--nutui-gray-3));
+  background-color: var(--nutui-table-tr-even-bg-color, var(--nutui-color-background, #f2f3f5));
 }
 .nut-table-main-head, .nut-table-main-body {
   background: inherit;
@@ -81,8 +81,8 @@
   justify-content: center;
 }
 .nut-table-main-head-tr-border, .nut-table-main-body-tr-border {
-  border-right: 1px solid var(--nutui-table-border-color, var(--nutui-black-3));
-  border-bottom: 1px solid var(--nutui-table-border-color, var(--nutui-black-3));
+  border-right: 1px solid var(--nutui-table-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  border-bottom: 1px solid var(--nutui-table-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
 }
 .nut-table-main-head-tr-alignleft, .nut-table-main-head-tr-align, .nut-table-main-body-tr-alignleft, .nut-table-main-body-tr-align {
   text-align: start;
@@ -131,8 +131,8 @@
   border-right: none;
 }
 .nut-table-summary {
-  color: var(--nutui-gray-7);
-  background-color: var(--nutui-gray-1);
+  color: var(--nutui-color-title, #1a1a1a);
+  background-color: var(--nutui-color-background-overlay, #ffffff);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -158,7 +158,7 @@
 .nut-rtl .nut-table-main-head-tr-border,
 .nut-rtl .nut-table-main-body-tr-border {
   border-right: none;
-  border-left: 1px solid var(--nutui-table-border-color, var(--nutui-black-3));
+  border-left: 1px solid var(--nutui-table-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
 }
 [dir=rtl] .nut-table-main-head-tr-alignleft, [dir=rtl] .nut-table-main-head-tr-align, [dir=rtl] .nut-table-main-body-tr-alignleft, [dir=rtl] .nut-table-main-body-tr-align,
 .nut-rtl .nut-table-main-head-tr-alignleft,

package/dist/es/packages/table/style/style.harmony.css

@@ -0,0 +1,230 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-table {
+  overflow: hidden;
+  position: relative;
+  word-wrap: break-word;
+  word-break: break-all;
+}
+.nut-table-wrapper {
+  display: flex;
+  width: 100%;
+  flex-direction: column;
+  font-size: 14px;
+  color: #1a1a1a;
+  overflow-y: auto;
+  overflow-x: hidden;
+  position: relative;
+  border: 1px solid rgba(0, 0, 0, 0.06);
+}
+.nut-table-wrapper-sticky {
+  overflow-x: auto;
+}
+.nut-table-main {
+  display: table;
+  overflow-x: auto;
+  color: #1a1a1a;
+  background-color: #ffffff;
+  table-layout: fixed;
+  width: max-content;
+  min-width: 100%;
+  position: relative;
+}
+.nut-table-main-striped .nut-table-main-head-tr {
+  background-color: #f2f3f5;
+}
+.nut-table-main-striped .nut-table-main-body-tr:nth-child(odd) {
+  background-color: #ffffff;
+}
+.nut-table-main-striped .nut-table-main-body-tr:nth-child(even) {
+  background-color: #f2f3f5;
+}
+.nut-table-main-head, .nut-table-main-body {
+  background: inherit;
+}
+.nut-table-main-head-tr, .nut-table-main-body-tr {
+  display: table-row;
+  background: inherit;
+}
+.nut-table-main-head-tr:last-child .nut-table-main-body-tr-td, .nut-table-main-body-tr:last-child .nut-table-main-body-tr-td {
+  border-bottom: none;
+}
+.nut-table-main-head-tr-th {
+  display: table-cell;
+  padding: 10px;
+  table-layout: fixed;
+  background: inherit;
+  position: sticky;
+  top: 0;
+}
+.nut-table-main-body-tr-th {
+  display: table-cell;
+  padding: 10px;
+  table-layout: fixed;
+  background: inherit;
+  position: sticky;
+  top: 0;
+}
+.nut-table-main-head-tr-th.nut-table-fixed-left, .nut-table-main-head-tr-th.nut-table-fixed-right, .nut-table-main-body-tr-th.nut-table-fixed-left, .nut-table-main-body-tr-th.nut-table-fixed-right {
+  z-index: 4;
+}
+.nut-table-main-head-tr-th:last-child, .nut-table-main-body-tr-th:last-child {
+  border-right: none;
+}
+.nut-table-main-head-tr-td {
+  display: table-cell;
+  padding: 10px;
+  table-layout: fixed;
+  background: inherit;
+}
+.nut-table-main-body-tr-td {
+  display: table-cell;
+  padding: 10px;
+  table-layout: fixed;
+  background: inherit;
+}
+.nut-table-main-head-tr-td:last-child, .nut-table-main-body-tr-td:last-child {
+  border-right: none;
+}
+.nut-table-main-head-tr-td-nodata, .nut-table-main-body-tr-td-nodata {
+  display: flex;
+  height: 50px;
+  align-items: center;
+  justify-content: center;
+}
+.nut-table-main-head-tr-border {
+  border-right: 1px solid rgba(0, 0, 0, 0.06);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+.nut-table-main-body-tr-border {
+  border-right: 1px solid rgba(0, 0, 0, 0.06);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+.nut-table-main-head-tr-alignleft, .nut-table-main-head-tr-align, .nut-table-main-body-tr-alignleft, .nut-table-main-body-tr-align {
+  text-align: start;
+}
+.nut-table-main-head-tr-aligncenter, .nut-table-main-body-tr-aligncenter {
+  text-align: center;
+}
+.nut-table-main-head-tr-alignright, .nut-table-main-body-tr-alignright {
+  text-align: end;
+}
+.nut-table-main-head {
+  display: table-header-group;
+}
+.nut-table-main-body {
+  display: table-row-group;
+}
+.nut-table-sticky-left, .nut-table-sticky-right {
+  position: absolute;
+  top: 0px;
+  width: 8px;
+  bottom: -1px;
+  overflow-x: hidden;
+  overflow-y: hidden;
+  box-shadow: none;
+  touch-action: none;
+  pointer-events: none;
+  z-index: 3;
+  background: transparent;
+}
+.nut-table-sticky-left {
+  left: 1px;
+  box-shadow: 4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+.nut-table-sticky-right {
+  right: 1px;
+  box-shadow: -4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+.nut-table-fixed-left, .nut-table-fixed-right {
+  position: sticky;
+  z-index: 2;
+}
+.nut-table-fixed-left.h5-div {
+  padding: 10px 0;
+}
+.nut-table-fixed-right.h5-div {
+  padding: 10px 0;
+}
+.nut-table-fixed-left-last {
+  border-right: none;
+}
+.nut-table-summary {
+  color: #1a1a1a;
+  background-color: #ffffff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 30px;
+  padding: 10px;
+  position: relative;
+  z-index: 5;
+}
+
+[dir=rtl] .nut-table-main-head-tr-th:last-child, [dir=rtl] .nut-table-main-body-tr-th:last-child,
+.nut-rtl .nut-table-main-head-tr-th:last-child,
+.nut-rtl .nut-table-main-body-tr-th:last-child {
+  border-right: none;
+  border-left: none;
+}
+[dir=rtl] .nut-table-main-head-tr-td:last-child, [dir=rtl] .nut-table-main-body-tr-td:last-child,
+.nut-rtl .nut-table-main-head-tr-td:last-child,
+.nut-rtl .nut-table-main-body-tr-td:last-child {
+  border-right: none;
+  border-left: none;
+}
+[dir=rtl] .nut-table-main-head-tr-border {
+  border-right: none;
+  border-left: 1px solid rgba(0, 0, 0, 0.06);
+}
+[dir=rtl] .nut-table-main-body-tr-border {
+  border-right: none;
+  border-left: 1px solid rgba(0, 0, 0, 0.06);
+}
+.nut-rtl .nut-table-main-head-tr-border {
+  border-right: none;
+  border-left: 1px solid rgba(0, 0, 0, 0.06);
+}
+.nut-rtl .nut-table-main-body-tr-border {
+  border-right: none;
+  border-left: 1px solid rgba(0, 0, 0, 0.06);
+}
+[dir=rtl] .nut-table-main-head-tr-alignleft, [dir=rtl] .nut-table-main-head-tr-align, [dir=rtl] .nut-table-main-body-tr-alignleft, [dir=rtl] .nut-table-main-body-tr-align,
+.nut-rtl .nut-table-main-head-tr-alignleft,
+.nut-rtl .nut-table-main-head-tr-align,
+.nut-rtl .nut-table-main-body-tr-alignleft,
+.nut-rtl .nut-table-main-body-tr-align {
+  text-align: right;
+}
+[dir=rtl] .nut-table-main-head-tr-alignright, [dir=rtl] .nut-table-main-body-tr-alignright,
+.nut-rtl .nut-table-main-head-tr-alignright,
+.nut-rtl .nut-table-main-body-tr-alignright {
+  text-align: left;
+}
+[dir=rtl] .nut-table-sticky-left {
+  left: auto;
+  right: 1px;
+  box-shadow: -4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+.nut-rtl .nut-table-sticky-left {
+  left: auto;
+  right: 1px;
+  box-shadow: -4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+[dir=rtl] .nut-table-sticky-right {
+  right: auto;
+  left: 1px;
+  box-shadow: 4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+.nut-rtl .nut-table-sticky-right {
+  right: auto;
+  left: 1px;
+  box-shadow: 4px 0 8px 0 rgba(0, 0, 0, 0.1);
+}
+[dir=rtl] .nut-table-fixed-left-last,
+.nut-rtl .nut-table-fixed-left-last {
+  border-right: none;
+  border-left: none;
+}

package/dist/es/packages/table/table.js

@@ -8,7 +8,7 @@ import React, { useEffect, useRef } from "react";
 import classNames from "classnames";
 import { ArrowDown } from "@nutui/icons-react-taro";
 import { View } from "@tarojs/components";
-import { useConfig, useRtl } from "../configprovider/configprovider";
+import { useConfig, useRtl } from "../configprovider/index";
 import { ComponentDefaults } from "../../utils/typings";
 import { usePropsValue } from "../../utils/use-props-value";
 import { useTableSticky } from "./utils";

package/dist/es/packages/tabpane/style/style.css

@@ -7,7 +7,7 @@
   flex-shrink: 0;
   display: block;
   background-color: var(--nutui-tabs-tabpane-backgroundColor, #fff);
-  color: var(--nutui-gray-7);
+  color: var(--nutui-color-title, #1a1a1a);
   padding: var(--nutui-tabs-tabpane-padding, 24px 20px);
   box-sizing: border-box;
   overflow: auto;

package/dist/es/packages/tabpane/style/style.harmony.css

@@ -0,0 +1,18 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-tabpane {
+  width: 100%;
+  flex-shrink: 0;
+  display: block;
+  background-color: #fff;
+  color: #1a1a1a;
+  padding: 24px 20px;
+  box-sizing: border-box;
+  overflow: auto;
+}
+.nut-tabpane.inactive {
+  overflow: visible;
+  height: 0;
+}

package/dist/es/packages/tabpane/tabpane.js

@@ -13,7 +13,7 @@ export var TabPane = function(props) {
     var classes = classNames(classPrefix, {
         active: !disabled && props.active
     }, autoHeightClassName, className);
-    return children ? /*#__PURE__*/ React.createElement(View, {
+    return children && /*#__PURE__*/ React.createElement(View, {
         className: classes
-    }, !disabled && children) : null;
+    }, !disabled && children);
 };