@sheinx/shineout-style 3.2.0 → 3.3.0-beta.1

package/esm/tabs/tabs.js

@@ -176,12 +176,12 @@ var getLineStyle = function getLineStyle() {
         bottom: 0,
         left: 0,
         width: 2
-      })),
-      '& :not([data-soui-state="active"])$tab': {
-        '&:after': {
-          display: 'none'
-        }
-      }
+      }))
+      // '& :not([data-soui-state="active"])$tab': {
+      //   '&:after': {
+      //     display: 'none',
+      //   },
+      // },
     },
     '&[data-soui-position^="right-"][data-soui-shape="line"]': {
       '&[dir=ltr]': _objectSpread({
@@ -207,12 +207,7 @@ var getLineStyle = function getLineStyle() {
         bottom: 0,
         right: 0,
         width: 2
-      })),
-      '& :not([data-soui-state="active"])$tab': {
-        '&:after': {
-          display: 'none'
-        }
-      }
+      }))
     },
     '&[data-soui-position^="top-"][data-soui-shape="line"]': _objectSpread({
       '& $hr': {
@@ -240,7 +235,13 @@ var getLineStyle = function getLineStyle() {
     })), {}, {
       '& :not([data-soui-state="active"])$tab': {
         '&:after': {
-          display: 'none'
+          position: 'absolute',
+          content: '""',
+          top: 0,
+          left: 0,
+          width: '100%',
+          height: 1,
+          background: Token.tabsBorderColor
         }
       }
     })
@@ -300,12 +301,6 @@ var getFillStyle = function getFillStyle() {
             color: Token.tabsActiveFontColor
           }
         },
-        '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover $fillInner': {
-          background: Token.tabsExtraFillHoverBackgroundColor
-        },
-        '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active $fillInner': {
-          background: Token.tabsClickBackgroundColor
-        },
         '&:before': {
           content: '""',
           position: 'absolute',
@@ -448,7 +443,10 @@ var tabsStyle = {
   },
   hr: {
     position: 'absolute',
-    background: Token.tabsBorderColor
+    background: Token.tabsBorderColor,
+    '$headerWrapper[data-soui-shape="line"] &': {
+      background: Token.tabsLineHrBackgroundColor
+    }
   },
   cardHr: {
     // aflter
@@ -657,23 +655,27 @@ var tabsStyle = {
     '$headerWrapper[data-soui-shape="card"] &': {
       '& $tab': {
         position: 'relative',
-        border: "1px solid ".concat(Token.tabsBorderColor),
-        padding: "".concat(Token.tabsTabPaddingY, " ").concat(Token.tabsTabPaddingX),
-        background: Token.tabsBackgroundColor,
+        border: "1px solid ".concat(Token.tabsCardBorderColor),
+        padding: "".concat(Token.tabsCardPaddingY, " ").concat(Token.tabsCardPaddingX),
+        color: Token.tabsCardFontColor,
+        fontSize: Token.tabsCardFontSize,
+        fontWeight: Token.tabsCardFontWeight,
+        background: Token.tabsCardBackgroundColor,
         '&[data-soui-state="active"]': {
-          color: Token.tabsActiveFontColor,
-          background: Token.tabsActiveBackgroundColor,
-          fontWeight: 'bold'
+          color: Token.tabsCardCheckedFontColor,
+          fontSize: Token.tabsCardCheckedFontSize,
+          fontWeight: Token.tabsCardCheckedFontWeight,
+          background: Token.tabsCardCheckedBackgroundColor
         },
         '&[data-soui-state="disabled"]': {
-          color: Token.tabsDisabledFontColor,
+          color: Token.tabsCardDisabledFontColor,
           cursor: 'not-allowed'
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover': {
-          background: Token.tabsHoverBackgroundColor
+          background: Token.tabsCardHoverBackgroundColor
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active': {
-          background: Token.tabsClickBackgroundColor
+          background: Token.tabsCardActiveBackgroundColor
         }
       }
     },
@@ -681,17 +683,39 @@ var tabsStyle = {
       '& $tab': {
         position: 'relative',
         padding: "".concat(Token.tabsLinePaddingY, " ").concat(Token.tabsLinePaddingX),
-        // background: '#FFF',
-
+        color: Token.tabsLineFontColor,
+        fontSize: Token.tabsLineFontSize,
+        fontWeight: Token.tabsLineFontWeight,
+        background: Token.tabsLineBackgroundColor,
         '&[data-soui-state="active"]': {
-          color: Token.tabsActiveFontColor,
-          background: Token.tabsActiveBackgroundColor,
-          fontWeight: 'bold'
+          color: Token.tabsLineCheckedFontColor,
+          fontSize: Token.tabsLineCheckedFontSize,
+          background: Token.tabsLineCheckedBackgroundColor,
+          fontWeight: Token.tabsLineCheckedFontWeight,
+          '&:after': {
+            background: Token.tabsLineAfterBackgroundColor
+          }
         },
         '&[data-soui-state="disabled"]': {
-          color: Token.tabsDisabledFontColor,
+          color: Token.tabsLineDisabledFontColor,
           cursor: 'not-allowed'
         },
+        '[data-soui-position^="left-"] &': {
+          '&:after': {
+            width: 1,
+            right: 0,
+            left: 'auto',
+            height: '100%',
+            background: Token.tabsBorderColor
+          }
+        },
+        '[data-soui-position^="right-"] &': {
+          '&:after': {
+            width: 1,
+            height: '100%',
+            background: Token.tabsBorderColor
+          }
+        },
         '&:not([data-soui-state="active"])': {
           '&:after': {
             position: 'absolute',
@@ -704,41 +728,64 @@ var tabsStyle = {
           }
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover $lineInner': {
-          background: Token.tabsHoverBackgroundColor
+          background: Token.tabsLineHoverBackgroundColor
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active $lineInner': {
-          background: Token.tabsClickBackgroundColor
+          background: Token.tabsLineActiveBackgroundColor
         }
       }
     },
     '$headerWrapper[data-soui-shape="dash"] &': {
       '& $tab': {
         padding: "".concat(Token.tabsLinePaddingY, " ").concat(Token.tabsLinePaddingX),
+        color: Token.tabsLineFontColor,
+        fontSize: Token.tabsLineFontSize,
+        fontWeight: Token.tabsLineFontWeight,
+        background: Token.tabsLineBackgroundColor,
         '&[data-soui-state="active"]': {
-          color: Token.tabsActiveFontColor,
-          background: Token.tabsActiveBackgroundColor,
-          fontWeight: 'bold'
+          color: Token.tabsLineCheckedFontColor,
+          fontSize: Token.tabsLineCheckedFontSize,
+          background: Token.tabsLineCheckedBackgroundColor,
+          fontWeight: Token.tabsLineCheckedFontWeight,
+          '&:after': {
+            background: Token.tabsLineAfterBackgroundColor
+          }
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover $lineInner': {
-          background: Token.tabsHoverBackgroundColor
+          background: Token.tabsLineHoverBackgroundColor
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active  $lineInner': {
-          background: Token.tabsClickBackgroundColor
+          background: Token.tabsLineActiveBackgroundColor
         },
         '&[data-soui-state="disabled"]': {
-          color: Token.tabsDisabledFontColor,
+          color: Token.tabsLineDisabledFontColor,
           cursor: 'not-allowed'
         }
       }
     },
     '$headerWrapper[data-soui-shape="fill"] &': {
       '& $tab': {
+        color: Token.tabsFillFontColor,
+        fontSize: Token.tabsFillFontSize,
+        fontWeight: Token.tabsFillFontWeight,
+        background: Token.tabsFillBackgroundColor,
         '&[data-soui-state="active"]': {
-          fontWeight: 'bold'
+          color: Token.tabsFillCheckedFontColor,
+          // fontSize: Token.tabsFillCheckedFontSize,
+          fontWeight: Token.tabsFillCheckedFontWeight,
+          '& $fillInner': {
+            background: Token.tabsFillCheckedBackgroundColor
+          }
         },
         '&[data-soui-state="disabled"]': {
-          color: Token.tabsDisabledFontColor,
+          color: Token.tabsFillDisabledFontColor,
           cursor: 'not-allowed'
+        },
+        '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover $fillInner': {
+          background: Token.tabsFillHoverBackgroundColor
+        },
+        '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active $fillInner': {
+          background: Token.tabsFillActiveBackgroundColor
         }
       }
     },

package/esm/tag/tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AA+I1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CAwIxC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AA+I1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CA8IxC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/esm/tag/tag.js

@@ -56,7 +56,7 @@ var tag = function tag(type) {
         backgroundColor: Token["tag".concat(type, "FillDisabledBackgroundColor")],
         border: "1px solid ".concat(Token["tag".concat(type, "FillDisabledBorderColor")]),
         '& $closeIconWrapper': {
-          fill: Token["tag".concat(type, "FillFontColor")],
+          fill: Token["tag".concat(type, "FillDisabledFontColor")],
           '&:hover': {
             fill: Token["tag".concat(type, "FillFontColor")],
             backgroundColor: 'transparent'
@@ -67,7 +67,7 @@ var tag = function tag(type) {
     // outline 边框风格
     '&$outline': {
       background: '#fff',
-      color: Token["tag".concat(type, "FontColor")],
+      color: Token["tag".concat(type, "OutlineFontColor")],
       border: "1px solid ".concat(Token["tag".concat(type, "OutlineBorderColor")]),
       '& $closeIconWrapper': {
         // hover
@@ -119,6 +119,7 @@ var TagStyle = {
     display: 'inline-flex',
     padding: "0 ".concat(Token.tagPaddingX),
     fontSize: Token.tagFontSize,
+    fontWeight: Token.tagFontWeight,
     borderRadius: Token.tagBorderRadius,
     boxSizing: 'border-box',
     lineHeight: "calc(".concat(Token.tagFontSize, " + 4px)"),
@@ -147,6 +148,7 @@ var TagStyle = {
   large: {
     fontSize: Token.tagLargeFontSize,
     lineHeight: "calc(".concat(Token.tagLargeFontSize, " + 8px)"),
+    fontWeight: Token.tagLargeFontWeight,
     padding: "".concat(Token.tagLargePaddingY, " ").concat(Token.tagLargePaddingX),
     '& $closeIconWrapper': {
       '& svg': {
@@ -158,6 +160,10 @@ var TagStyle = {
   small: {
     lineHeight: "calc(".concat(Token.tagSmallFontSize, " + 6px)"),
     padding: "0 ".concat(Token.tagSmallPaddingX),
+    fontWeight: Token.tagSmallFontWeight,
+    '& $container': {
+      lineHeight: "calc(".concat(Token.tagSmallFontSize, " + 6px)")
+    },
     '& $wrapper': {
       lineHeight: "calc(".concat(Token.tagSmallFontSize, " + 6px)")
     },

package/esm/transfer/transfer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"transfer.d.ts","sourceRoot":"","sources":["transfer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,MAAM,aAAa,GAAG,MAAM,eAAe,CAAC;AAElD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,aAAa,CAuL1C,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"transfer.d.ts","sourceRoot":"","sources":["transfer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,MAAM,aAAa,GAAG,MAAM,eAAe,CAAC;AAElD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,aAAa,CA8L1C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/esm/transfer/transfer.js

@@ -88,7 +88,7 @@ var TransferStyle = {
     marginLeft: 3,
     '& svg': {
       width: 14,
-      color: Token.transferIconColor
+      color: Token.transferRemoveIconColor
     },
     '&:hover': {
       background: Token.transferIconBackgroundColor
@@ -146,7 +146,9 @@ var TransferStyle = {
     alignItems: 'center',
     boxSizing: 'border-box',
     justifyContent: 'space-between',
-    background: Token.transferHeaderBackgroundColor
+    background: Token.transferHeaderBackgroundColor,
+    borderRadius: "".concat(Token.transferBorderRadius, " ").concat(Token.transferBorderRadius, " 0 0"),
+    borderBottom: "1px solid ".concat(Token.transferHeaderBorderColor)
   },
   spinContainer: {},
   title: {
@@ -156,11 +158,14 @@ var TransferStyle = {
   count: {
     fontSize: Token.transferFontSize
   },
-  list: {},
+  list: {
+    background: Token.transferBackgroundColor
+  },
   footer: {
     height: 48,
     boxSizing: 'border-box',
-    borderTop: "1px solid ".concat(Token.transferBorderColor)
+    borderTop: "1px solid ".concat(Token.transferFooterBorderColor),
+    background: Token.transferFooterBackgroundColor
   },
   item: {
     padding: '1px 4px',
@@ -182,10 +187,12 @@ var TransferStyle = {
     }
   },
   itemWrapper: {
-    borderRadius: Token.transferBorderRadius,
+    borderRadius: Token.transferItemBorderRadius,
     cursor: 'pointer',
+    height: '100%',
     '& $checkbox': {
       width: '100%',
+      height: '100%',
       padding: '5px 8px',
       marginRight: 0
     }

package/esm/version.d.ts

@@ -1,3 +1,3 @@
-declare const _default: "3.2.0";
+declare const _default: "3.3.0-beta.1";
 export default _default;
 //# sourceMappingURL=version.d.ts.map

package/esm/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["version.ts"],"names":[],"mappings":";AAAA,wBAAuB"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["version.ts"],"names":[],"mappings":";AAAA,wBAA8B"}

package/esm/version.js

@@ -1 +1 @@
-export default '3.2.0';
+export default '3.3.0-beta.1';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sheinx/shineout-style",
-  "version": "3.2.0",
+  "version": "3.3.0-beta.1",
   "description": "",
   "keywords": [],
   "license": "MIT",
@@ -17,8 +17,8 @@
   "dependencies": {
     "jss": "10.9.2",
     "react-jss": "10.9.2",
-    "@sheinx/theme": "3.2.0",
-    "@sheinx/base": "3.2.0"
+    "@sheinx/theme": "3.3.0-beta.1",
+    "@sheinx/base": "3.3.0-beta.1"
   },
   "peerDependencies": {
     "core-js": ">=3"