@sheinx/shineout-style 3.9.4-beta.1 → 3.9.4-beta.11

package/esm/select/select.js

@@ -51,12 +51,6 @@ var inputBorder = border('wrapper', inputBorderToken);
 var wrapper = inputBorder.wrapper,
   wrapperDisabled = inputBorder.wrapperDisabled,
   resetWrapper = _objectWithoutProperties(inputBorder, ["wrapper", "wrapperDisabled"]);
-var selectTagHeightCssvar = "--select-tag-height";
-var selectSmallTagHeightCssvar = "--select-small-tag-height";
-var selectLargeTagHeightCssvar = "--select-large-tag-height";
-var selectTagHeight = "var(".concat(selectTagHeightCssvar, ")");
-var selectSmallTagHeight = "var(".concat(selectSmallTagHeightCssvar, ")");
-var selectLargeTagHeight = "var(".concat(selectLargeTagHeightCssvar, ")");
 var selectStyle = _objectSpread(_objectSpread({
   rootClass: {},
   wrapper: _objectSpread(_objectSpread({
@@ -65,70 +59,63 @@ var selectStyle = _objectSpread(_objectSpread({
     width: '100%',
     outline: 'none',
     cursor: 'pointer'
-  }, wrapper), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, selectTagHeightCssvar, token.selectTagHeight), selectSmallTagHeightCssvar, token.selectSmallTagHeight), selectLargeTagHeightCssvar, token.selectLargeTagHeight), '&$wrapperInnerTitle', {
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: 0,
-      marginBottom: 0
-    },
-    '& $tag': {
-      marginTop: 0,
-      marginBottom: token.selectInnerTitleMarginY,
-      paddingTop: 0,
-      paddingBottom: 0,
-      height: selectTagHeight,
-      border: 'none',
-      '&  *': {
-        lineHeight: selectTagHeight
+  }, wrapper), {}, {
+    '&$wrapperInnerTitle': {
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: 0,
+        marginBottom: 0
+      },
+      '& $tag': {
+        marginTop: 0,
+        marginBottom: token.selectInnerTitleMarginY,
+        paddingTop: 0,
+        paddingBottom: 0,
+        border: 'none'
+      },
+      '&$wrapperSmall $tag': {
+        marginBottom: 2
+      },
+      '&$wrapperLarge $tag': {
+        marginBottom: 2
       }
     },
-    '&$wrapperSmall $tag': {
-      height: selectSmallTagHeight,
-      marginBottom: 2,
-      '&$tag  *': {
-        lineHeight: selectSmallTagHeight
+    '&$wrapperSmall': {
+      '& $tag': {
+        marginTop: 1,
+        marginBottom: 1,
+        border: 'none'
+      },
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: 0,
+        marginBottom: 0
       }
     },
-    '&$wrapperLarge $tag': {
-      height: selectLargeTagHeight,
-      marginBottom: 2,
-      '&$tag  *': {
-        lineHeight: selectLargeTagHeight
+    '&$wrapperLarge': {
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: token.selectLargePlaceholderMarginY,
+        marginBottom: token.selectLargePlaceholderMarginY
+      },
+      '& $arrowIcon': {
+        width: token.selectLargeFontSize
       }
-    }
-  }), '&$wrapperSmall', {
-    '& $tag': {
-      height: selectSmallTagHeight,
-      lineHeight: '16px',
-      marginTop: 1,
-      marginBottom: 1
     },
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: 0,
-      marginBottom: 0
-    }
-  }), '&$wrapperLarge', {
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: token.selectLargePlaceholderMarginY,
-      marginBottom: token.selectLargePlaceholderMarginY
-    },
-    '& $arrowIcon': {
-      width: token.selectLargeFontSize
-    }
-  }), '&:hover', _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
-    cursor: 'pointer',
-    '&$clearable:not($wrapperEmpty):not($wrapperDisabled)': {
+    '&:hover': _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
+      cursor: 'pointer',
+      '&$clearable:not($wrapperEmpty):not($wrapperDisabled)': {
+        '& $clearIcon': {
+          display: 'block'
+        },
+        '& $arrowIcon': {
+          display: 'none'
+        }
+      }
+    }),
+    '&:not($wrapperEmpty):not($wrapperOpen)': {
       '& $clearIcon': {
-        display: 'block'
-      },
-      '& $arrowIcon': {
         display: 'none'
       }
     }
-  })), '&:not($wrapperEmpty):not($wrapperOpen)', {
-    '& $clearIcon': {
-      display: 'none'
-    }
-  })),
+  }),
   wrapperEmpty: {},
   wrapperOpen: {},
   wrapperDisabled: _objectSpread(_objectSpread({}, wrapperDisabled), {}, {
@@ -313,7 +300,7 @@ var selectStyle = _objectSpread(_objectSpread({
       fontSize: token.selectLargeFontSize
     },
     '& $optionGroupTitle': {
-      padding: "calc(".concat(token.selectFontSize, " + 2px) ").concat(token.selectGroupTitlePaddingX, " ").concat(token.selectGroupTitleLargeBottom, " ").concat(token.selectGroupTitlePaddingX)
+      padding: "calc(".concat(token.selectFontSize, " + 2px) calc(").concat(token.selectOptionPaddingX, " + ").concat(token.selectLargeOptionInnerPaddingX, ") ").concat(token.selectGroupTitleLargeBottom, " calc(").concat(token.selectOptionPaddingX, " + ").concat(token.selectLargeOptionInnerPaddingX, ")")
     }
   },
   iconWrapper: {
@@ -327,12 +314,18 @@ var selectStyle = _objectSpread(_objectSpread({
   clearable: {},
   clearIcon: {
     cursor: 'pointer',
-    width: token.selectFontSize,
+    width: token.selectClearIconSize,
     lineHeight: 0,
     color: token.selectClearColor,
     verticalAlign: 'middle',
     '&:hover': {
       color: token.selectIconColor
+    },
+    '$wrapperSmall &': {
+      width: token.selectSmallClearIconSize
+    },
+    '$wrapperLarge &': {
+      width: token.selectLargeClearIconSize
     }
   },
   arrowIcon: {

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;AAqJ1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CAwNxC,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;AAqJ1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CAqNxC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/esm/tag/tag.js

@@ -164,8 +164,8 @@ var TagStyle = {
     padding: "".concat(Token.tagLargePaddingY, " ").concat(Token.tagLargePaddingX),
     '& $closeIconWrapper': {
       '& svg': {
-        width: 14,
-        height: 14
+        width: Token.tagLargeFontSize,
+        height: Token.tagLargeFontSize
       }
     },
     '& $wrapper': {
@@ -185,15 +185,12 @@ var TagStyle = {
       lineHeight: "var(".concat(Token.tagSmallLineHeight, ", calc(").concat(Token.tagSmallFontSize, " + 6px))")
     },
     '& $closeIcon': {
-      height: "var(".concat(Token.tagSmallLineHeight, ", calc(").concat(Token.tagSmallFontSize, " + 6px))")
+      height: "var(".concat(Token.tagSmallLineHeight, ", calc(").concat(Token.tagSmallFontSize, " + 4px))")
     },
     '& $closeIconWrapper': {
-      width: "calc(".concat(Token.tagSmallFontSize, " + 6px)"),
-      height: "calc(".concat(Token.tagSmallFontSize, " + 6px)"),
-      lineHeight: "calc(".concat(Token.tagSmallFontSize, " + 6px)"),
       '& svg': {
-        width: 12,
-        height: 12
+        width: Token.tagSmallFontSize,
+        height: Token.tagSmallFontSize
       }
     }
   },
@@ -204,7 +201,7 @@ var TagStyle = {
     }
   },
   closeIcon: {
-    marginLeft: 4,
+    marginLeft: 2,
     alignItems: 'center',
     display: 'inline-flex',
     cursor: 'pointer',
@@ -219,8 +216,8 @@ var TagStyle = {
     width: "calc(1em + 4px)",
     height: "calc(1em + 4px)",
     '& svg': {
-      width: 12,
-      height: 12
+      width: Token.tagFontSize,
+      height: Token.tagFontSize
     }
   },
   info: _objectSpread({}, brightTag('info', 'Info')),

package/esm/tree-select/tree-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tree-select.d.ts","sourceRoot":"","sources":["tree-select.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,MAAM,mBAAmB,GAAG,MAAM,iBAAiB,CAAC;AA+D1D,QAAA,MAAM,eAAe,EAAE,QAAQ,CAAC,mBAAmB,CA6gBlD,CAAC;AACF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"tree-select.d.ts","sourceRoot":"","sources":["tree-select.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,MAAM,mBAAmB,GAAG,MAAM,iBAAiB,CAAC;AAuD1D,QAAA,MAAM,eAAe,EAAE,QAAQ,CAAC,mBAAmB,CAmgBlD,CAAC;AACF,eAAe,eAAe,CAAC"}

package/esm/tree-select/tree-select.js

@@ -51,12 +51,6 @@ var inputBorder = border('wrapper', inputBorderToken);
 var wrapper = inputBorder.wrapper,
   wrapperDisabled = inputBorder.wrapperDisabled,
   resetWrapper = _objectWithoutProperties(inputBorder, ["wrapper", "wrapperDisabled"]);
-var selectTagHeightCssvar = "--select-tag-height";
-var selectSmallTagHeightCssvar = "--select-small-tag-height";
-var selectLargeTagHeightCssvar = "--select-large-tag-height";
-var selectTagHeight = "var(".concat(selectTagHeightCssvar, ")");
-var selectSmallTagHeight = "var(".concat(selectSmallTagHeightCssvar, ")");
-var selectLargeTagHeight = "var(".concat(selectLargeTagHeightCssvar, ")");
 var treeSelectStyle = _objectSpread(_objectSpread({
   rootClass: {},
   wrapper: _objectSpread(_objectSpread({
@@ -65,90 +59,83 @@ var treeSelectStyle = _objectSpread(_objectSpread({
     width: '100%',
     outline: 'none',
     cursor: 'pointer'
-  }, wrapper), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, selectTagHeightCssvar, token.selectTagHeight), selectSmallTagHeightCssvar, token.selectSmallTagHeight), selectLargeTagHeightCssvar, token.selectLargeTagHeight), '&$wrapperInnerTitle', {
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: 0,
-      marginBottom: 0
-    },
-    '& $tag': {
-      marginTop: 0,
-      marginBottom: token.selectInnerTitleMarginY,
-      paddingTop: 0,
-      paddingBottom: 0,
-      height: selectTagHeight,
-      border: 'none',
-      '&  *': {
-        lineHeight: selectTagHeight
+  }, wrapper), {}, {
+    '&$wrapperInnerTitle': {
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: 0,
+        marginBottom: 0
+      },
+      '& $tag': {
+        marginTop: 0,
+        marginBottom: token.selectInnerTitleMarginY,
+        paddingTop: 0,
+        paddingBottom: 0,
+        border: 'none'
+      },
+      '&$wrapperSmall $tag': {
+        marginBottom: 2
+      },
+      '&$wrapperLarge $tag': {
+        marginBottom: 2
       }
     },
-    '&$wrapperSmall $tag': {
-      height: selectSmallTagHeight,
-      marginBottom: 2,
-      '&$tag  *': {
-        lineHeight: selectSmallTagHeight
+    '&$wrapperSmall': {
+      '& $tag': {
+        marginTop: 1,
+        marginBottom: 1,
+        border: 'none'
+      },
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: 0,
+        marginBottom: 0
+      },
+      '& $optionInner': {
+        paddingTop: token.treeSelectSmallOptionInnerPaddingY,
+        paddingBottom: token.treeSelectSmallOptionInnerPaddingY,
+        paddingLeft: token.treeSelectSmallOptionInnerPaddingX,
+        // padding: `${token.treeSelectSmallOptionInnerPaddingY} ${token.treeSelectSmallOptionInnerPaddingX}`,
+        fontSize: token.treeSelectSmallFontSize
+      },
+      '& $clearIcon': {
+        right: token.treeSelectSmallPaddingX
       }
     },
-    '&$wrapperLarge $tag': {
-      height: selectLargeTagHeight,
-      marginBottom: 2,
-      '&$tag  *': {
-        lineHeight: selectLargeTagHeight
+    '&$wrapperLarge': {
+      '& $placeholder,$ellipsis,$space,input': {
+        marginTop: token.treeSelectLargePlaceholderMarginY,
+        marginBottom: token.treeSelectLargePlaceholderMarginY
+      },
+      '& $optionInner': {
+        // padding: `${token.treeSelectLargeOptionInnerPaddingY} ${token.treeSelectLargeOptionInnerPaddingX}`,
+        paddingTop: token.treeSelectLargeOptionInnerPaddingY,
+        paddingBottom: token.treeSelectLargeOptionInnerPaddingY,
+        paddingLeft: token.treeSelectLargeOptionInnerPaddingX,
+        fontSize: token.treeSelectLargeFontSize
+      },
+      '& $arrowIcon': {
+        width: token.treeSelectLargeFontSize
+      },
+      '& $clearIcon': {
+        right: token.treeSelectLargePaddingX
       }
-    }
-  }), '&$wrapperSmall', {
-    '& $tag': {
-      height: selectSmallTagHeight,
-      lineHeight: '16px',
-      marginTop: 1,
-      marginBottom: 1
-    },
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: 0,
-      marginBottom: 0
-    },
-    '& $optionInner': {
-      paddingTop: token.treeSelectSmallOptionInnerPaddingY,
-      paddingBottom: token.treeSelectSmallOptionInnerPaddingY,
-      paddingLeft: token.treeSelectSmallOptionInnerPaddingX,
-      // padding: `${token.treeSelectSmallOptionInnerPaddingY} ${token.treeSelectSmallOptionInnerPaddingX}`,
-      fontSize: token.treeSelectSmallFontSize
-    },
-    '& $clearIcon': {
-      right: token.treeSelectSmallPaddingX
-    }
-  }), '&$wrapperLarge', {
-    '& $placeholder,$ellipsis,$space,input': {
-      marginTop: token.treeSelectLargePlaceholderMarginY,
-      marginBottom: token.treeSelectLargePlaceholderMarginY
-    },
-    '& $optionInner': {
-      // padding: `${token.treeSelectLargeOptionInnerPaddingY} ${token.treeSelectLargeOptionInnerPaddingX}`,
-      paddingTop: token.treeSelectLargeOptionInnerPaddingY,
-      paddingBottom: token.treeSelectLargeOptionInnerPaddingY,
-      paddingLeft: token.treeSelectLargeOptionInnerPaddingX,
-      fontSize: token.treeSelectLargeFontSize
     },
-    '& $arrowIcon': {
-      width: token.treeSelectLargeFontSize
+    '&:hover': {
+      cursor: 'pointer',
+      '&$clearable:not($wrapperEmpty)': {
+        '& $clearIcon': {
+          display: 'block'
+        },
+        '& $arrowIcon': {
+          display: 'none'
+        }
+      }
     },
-    '& $clearIcon': {
-      right: token.treeSelectLargePaddingX
-    }
-  }), '&:hover', {
-    cursor: 'pointer',
-    '&$clearable:not($wrapperEmpty)': {
+    '&:not($wrapperEmpty):not($wrapperOpen)': {
       '& $clearIcon': {
-        display: 'block'
-      },
-      '& $arrowIcon': {
         display: 'none'
       }
     }
-  }), '&:not($wrapperEmpty):not($wrapperOpen)', {
-    '& $clearIcon': {
-      display: 'none'
-    }
-  })),
+  }),
   treeWrapper: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, getTokenName('treeFontColor'), token.treeSelectOptionFontColor), getTokenName('treeContentHoverFontColor'), token.treeSelectContentHoverFontColor), getTokenName('treeContentHoverBackgroundColor'), token.treeSelectContentHoverBackgroundColor), getTokenName('treeContentActiveBackgroundColor'), token.treeSelectContentActiveBackgroundColor), getTokenName('treeContentActiveFontColor'), token.treeSelectContentActiveFontColor), getTokenName('treeContentDisabledFontColor'), token.treeSelectContentDisabledFontColor), getTokenName('treeContentDisabledBackgroundColor'), token.treeSelectContentDisabledBackgroundColor),
   wrapperEmpty: {},
   wrapperOpen: {},
@@ -304,12 +291,18 @@ var treeSelectStyle = _objectSpread(_objectSpread({
   clearable: {},
   clearIcon: {
     cursor: 'pointer',
-    width: token.treeSelectFontSize,
+    width: token.treeSelectClearIconSize,
     lineHeight: 0,
     color: token.treeSelectClearColor,
     verticalAlign: 'middle',
     '&:hover svg': {
       color: token.treeSelectClearHoverColor
+    },
+    '$wrapperSmall &': {
+      width: token.treeSelectSmallClearIconSize
+    },
+    '$wrapperLarge &': {
+      width: token.treeSelectLargeClearIconSize
     }
   },
   arrowIcon: {

package/esm/version.d.ts

@@ -1,3 +1,3 @@
-declare const _default: "3.9.4-beta.1";
+declare const _default: "3.9.4-beta.11";
 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,wBAA8B"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["version.ts"],"names":[],"mappings":";AAAA,wBAA+B"}

package/esm/version.js

@@ -1 +1 @@
-export default '3.9.4-beta.1';
+export default '3.9.4-beta.11';

package/package.json

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