@sheinx/shineout-style 3.1.0-rc.2 → 3.1.0

package/esm/tabs/tabs.js

@@ -30,38 +30,86 @@ var getHeaderPositionStyle = function getHeaderPositionStyle(position, options)
 };
 var getCardStyle = function getCardStyle() {
   return {
-    '&[data-soui-position^="left-"][data-soui-shape="card"]': _objectSpread({
+    '&[data-soui-position^="left-"][data-soui-shape="card"]': {
       '& $tab,& $next,& $prev': {
-        borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius)
+        '&[dir=ltr]': {
+          borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius)
+        },
+        '&[dir=rtl]': {
+          borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0")
+        }
       },
-      '& $hr': {
-        right: 0,
+      '&[dir=ltr]': _objectSpread({
+        '& $cardHr': {
+          '&:after': {
+            right: 0,
+            width: '1px',
+            height: '100%'
+          }
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
+        right: -1,
         width: 1,
-        height: '100%'
-      }
-    }, active({
-      top: 0,
-      bottom: 0,
-      right: -1,
-      width: 1,
-      background: '#FFFFFF'
-    })),
-    '&[data-soui-position^="right-"][data-soui-shape="card"]': _objectSpread({
+        background: '#FFFFFF'
+      })),
+      '&[dir=rtl]': _objectSpread(_objectSpread({}, active({
+        top: 0,
+        bottom: 0,
+        left: -1,
+        width: 1,
+        background: '#FFFFFF'
+      })), {}, {
+        '& $cardHr': {
+          '&:after': {
+            left: 0,
+            width: 1,
+            height: '100%'
+          }
+        }
+      })
+    },
+    '&[data-soui-position^="right-"][data-soui-shape="card"]': {
       '& $tab,& $next,& $prev': {
-        borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0")
+        '&[dir=ltr]': {
+          borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0")
+        },
+        '&[dir=rtl]': {
+          borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius)
+        }
       },
-      '& $hr': {
-        left: 0,
+      '&[dir=ltr]': _objectSpread({
+        '& $cardHr': {
+          '&:after': {
+            left: 0,
+            width: 1,
+            height: '100%'
+          }
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
+        left: -1,
         width: 1,
-        height: '100%'
-      }
-    }, active({
-      top: 0,
-      bottom: 0,
-      left: -1,
-      width: 1,
-      background: '#FFFFFF'
-    })),
+        background: '#FFFFFF'
+      })),
+      '&[dir=rtl]': _objectSpread({
+        '& $cardHr': {
+          '&:after': {
+            right: 0,
+            width: 1,
+            height: '100%'
+          }
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
+        right: -1,
+        width: 1,
+        background: '#FFFFFF'
+      }))
+    },
     '&[data-soui-position^="top-"][data-soui-shape="card"]': _objectSpread({
       '& $tab,& $next,& $prev': {
         borderRadius: "".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0 0")
@@ -104,42 +152,68 @@ var getCardStyle = function getCardStyle() {
 };
 var getLineStyle = function getLineStyle() {
   return {
-    '&[data-soui-position^="left-"][data-soui-shape="line"]': _objectSpread(_objectSpread({
-      '& $hr': {
+    '&[data-soui-position^="left-"][data-soui-shape="line"]': {
+      '&[dir=ltr]': _objectSpread({
+        '& $hr': {
+          right: 0,
+          width: 1,
+          height: '100%'
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
         right: 0,
-        width: 1,
-        height: '100%'
-      }
-    }, active({
-      top: 0,
-      bottom: 0,
-      right: 0,
-      width: 2
-    })), {}, {
+        width: 2
+      })),
+      '&[dir=rtl]': _objectSpread({
+        '& $hr': {
+          left: 0,
+          width: 1,
+          height: '100%'
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
+        left: 0,
+        width: 2
+      })),
       '& :not([data-soui-state="active"])$tab': {
         '&:after': {
           display: 'none'
         }
       }
-    }),
-    '&[data-soui-position^="right-"][data-soui-shape="line"]': _objectSpread(_objectSpread({
-      '& $hr': {
+    },
+    '&[data-soui-position^="right-"][data-soui-shape="line"]': {
+      '&[dir=ltr]': _objectSpread({
+        '& $hr': {
+          left: 0,
+          width: 1,
+          height: '100%'
+        }
+      }, active({
+        top: 0,
+        bottom: 0,
         left: 0,
-        width: 1,
-        height: '100%'
-      }
-    }, active({
-      top: 0,
-      bottom: 0,
-      left: 0,
-      width: 2
-    })), {}, {
+        width: 2
+      })),
+      '&[dir=rtl]': _objectSpread({
+        '& $hr': {
+          right: 0,
+          width: 1,
+          height: '100%'
+        }
+      }, active({
+        top: 0,
+        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': {
         bottom: 0,
@@ -174,18 +248,34 @@ var getLineStyle = function getLineStyle() {
 };
 var getDashStyle = function getDashStyle() {
   return {
-    '&[data-soui-position^="left-"][data-soui-shape="dash"]': _objectSpread({}, active({
-      top: "calc(50% - 12px)",
-      width: 2,
-      height: 24,
-      right: 0
-    })),
-    '&[data-soui-position^="right-"][data-soui-shape="dash"]': _objectSpread({}, active({
-      top: "calc(50% - 12px)",
-      width: 2,
-      height: 24,
-      left: 0
-    })),
+    '&[data-soui-position^="left-"][data-soui-shape="dash"]': {
+      '&[dir=ltr]': _objectSpread({}, active({
+        top: "calc(50% - 12px)",
+        width: 2,
+        height: 24,
+        right: 0
+      })),
+      '&[dir=rtl]': _objectSpread({}, active({
+        top: "calc(50% - 12px)",
+        width: 2,
+        height: 24,
+        left: 0
+      }))
+    },
+    '&[data-soui-position^="right-"][data-soui-shape="dash"]': {
+      '&[dir=ltr]': _objectSpread({}, active({
+        top: "calc(50% - 12px)",
+        width: 2,
+        height: 24,
+        left: 0
+      })),
+      '&[dir=rtl]': _objectSpread({}, active({
+        top: "calc(50% - 12px)",
+        width: 2,
+        height: 24,
+        right: 0
+      }))
+    },
     '&[data-soui-position^="top-"][data-soui-shape="dash"]': _objectSpread({}, active({
       bottom: 0,
       left: "calc(50% - 12px)",
@@ -211,7 +301,6 @@ var getFillStyle = function getFillStyle() {
           }
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):hover $fillInner': {
-          // background: Token.tabsHoverBackgroundColor,
           background: Token.tabsExtraFillHoverBackgroundColor
         },
         '&:not([data-soui-state="active"]):not([data-soui-state="disabled"]):active $fillInner': {
@@ -220,12 +309,17 @@ var getFillStyle = function getFillStyle() {
         '&:before': {
           content: '""',
           position: 'absolute',
-          left: 0,
           top: 'calc(50% - 7px)',
           width: 1,
           height: 14,
           background: 'transparent',
           transition: 'background .15s ease-out'
+        },
+        '&[dir=ltr]::before': {
+          left: 0
+        },
+        '&[dir=rtl]::before': {
+          right: 0
         }
       },
       '& $tab:not([data-soui-state="active"]):not(:hover) + $tab:not([data-soui-state="active"]):not(:hover)': {
@@ -270,15 +364,24 @@ var getHeaderStyle = function getHeaderStyle() {
     '&[data-soui-shape="fill"] $header': {
       '& $tab': {
         background: Token.tabsBackgroundColor,
-        // padding: `${Token.tabsFillPaddingY} ${Token.tabsFillPaddingX}`,
         padding: "".concat(Token.tabsFillPaddingY, " 0")
       },
       '& $tab:first-child': {
-        borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius),
+        '&[dir=ltr]': {
+          borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius)
+        },
+        '&[dir=rtl]': {
+          borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0")
+        },
         paddingLeft: Token.tabsFillPaddingX
       },
       '& $tab:last-child': {
-        borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0"),
+        '&[dir=rtl]': {
+          borderRadius: "".concat(Token.tabsTabBorderRadius, " 0 0 ").concat(Token.tabsTabBorderRadius)
+        },
+        '&[dir=ltr]': {
+          borderRadius: "0 ".concat(Token.tabsTabBorderRadius, " ").concat(Token.tabsTabBorderRadius, " 0")
+        },
         paddingRight: Token.tabsFillPaddingX
       }
     },
@@ -672,12 +775,18 @@ var tabsStyle = {
   prev: {
     textAlign: 'center',
     color: Token.tabsArrowFontColor,
-    lineHeight: Token.lineHeightDynamic
+    lineHeight: Token.lineHeightDynamic,
+    '&[dir=rtl] svg': {
+      transform: 'rotate(180deg)'
+    }
   },
   next: {
     textAlign: 'center',
     color: Token.tabsArrowFontColor,
-    lineHeight: Token.lineHeightDynamic
+    lineHeight: Token.lineHeightDynamic,
+    '&[dir=rtl] svg': {
+      transform: 'rotate(180deg)'
+    }
   },
   extra: {},
   collapsible: {

package/esm/textarea/textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["textarea.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AA6CxC,QAAA,MAAM,KAAK,EAAE,QAAQ,CAAC,MAAM,eAAe,CAqF1C,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["textarea.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AA6CxC,QAAA,MAAM,KAAK,EAAE,QAAQ,CAAC,MAAM,eAAe,CA4F1C,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/esm/textarea/textarea.js

@@ -76,7 +76,12 @@ var input = _objectSpread(_objectSpread(_objectSpread({}, inputBorder), {}, {
   },
   info: {
     position: 'absolute',
-    right: '0',
+    '&[dir=ltr]': {
+      right: '0'
+    },
+    '&[dir=rtl]': {
+      left: '0'
+    },
     top: '100%',
     transformOrigin: '100% 0',
     marginTop: '10px',
@@ -91,7 +96,6 @@ var input = _objectSpread(_objectSpread(_objectSpread({}, inputBorder), {}, {
     '&::before': {
       display: 'block',
       position: 'absolute',
-      right: '4px',
       bottom: '100%',
       transform: 'rotate(45deg) translateY(3px)',
       width: '6px',
@@ -100,6 +104,12 @@ var input = _objectSpread(_objectSpread(_objectSpread({}, inputBorder), {}, {
       borderWidth: '1px 0 0 1px',
       background: 'inherit',
       content: "'  '"
+    },
+    '&[dir=ltr]::before': {
+      right: '4px'
+    },
+    '&[dir=rtl]::before': {
+      left: '8px'
     }
   },
   infoError: {

package/esm/tooltip/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAmJhD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAuJhD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/esm/tooltip/tooltip.js

@@ -58,6 +58,7 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
     borderRadius: token.tooltipBorderRadius,
     boxShadow: token.tooltipShadow,
     color: token.tooltipColor,
+    wordWrap: 'break-word',
     '&[data-soui-type^="light"]': {
       backgroundColor: token.tooltipLightBackgroundColor,
       color: token.tooltipLightColor,
@@ -89,7 +90,6 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
       height: '8.4px',
       boxSizing: 'content-box',
       background: 'inherit',
-      borderLeft: 'none',
       borderBottom: 'none'
     },
     '&[data-soui-position^="bottom"]': {
@@ -132,6 +132,12 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
     },
     '&[data-soui-position^="left"]': {
       marginLeft: (arrowGap - 2) * -1,
+      '&[dir=ltr]': {
+        marginLeft: (arrowGap - 2) * -1
+      },
+      '&[dir=rtl]': {
+        marginRight: (arrowGap - 2) * -1
+      },
       '&::before': {
         right: 0,
         transform: 'translate(50%, 0) rotate(45deg)',
@@ -151,6 +157,12 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
     },
     '&[data-soui-position^="right"]': {
       marginLeft: arrowGap - 2,
+      '&[dir=ltr]': {
+        marginLeft: arrowGap - 2
+      },
+      '&[dir=rtl]': {
+        marginRight: arrowGap - 2
+      },
       '&::before': {
         left: '0',
         transform: 'translate(-50%, 0) rotate(-135deg)',

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

@@ -1 +1 @@
-{"version":3,"file":"tree.d.ts","sourceRoot":"","sources":["tree.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC;AAE9C,QAAA,MAAM,SAAS,EAAE,QAAQ,CAAC,aAAa,CA8LtC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"tree.d.ts","sourceRoot":"","sources":["tree.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC;AAE9C,QAAA,MAAM,SAAS,EAAE,QAAQ,CAAC,aAAa,CAmMtC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/esm/tree/tree.js

@@ -3,20 +3,30 @@ var treeStyle = {
   tree: {},
   line: {
     '& $node': {
+      '&[dir=ltr]::before': {
+        left: 0
+      },
+      '&[dir=rtl]::before': {
+        right: 0
+      },
       '&::before': {
         content: '""',
         position: 'absolute',
-        left: 0,
         top: -6,
         height: 'calc(100% + 6px)',
         width: 1,
         background: '#ebebeb'
       },
+      '&[dir=ltr]::after': {
+        left: 0
+      },
+      '&[dir=rtl]::after': {
+        right: 0
+      },
       '&::after': {
         content: '""',
         position: 'absolute',
         top: 18,
-        left: 0,
         height: 1,
         width: 16,
         background: '#ebebeb'
@@ -36,7 +46,12 @@ var treeStyle = {
     },
     '& $contentWrapper': {},
     '& $iconWrapper': {
-      left: 16,
+      '&[dir=ltr]': {
+        left: 16
+      },
+      '&[dir=rtl]': {
+        right: 16
+      },
       width: 24,
       '& $icon': {
         // width: 16,
@@ -52,7 +67,12 @@ var treeStyle = {
     },
     '& $iconWrapper[data-expanded="false"][data-icon="false"]': {
       '& $icon': {
-        transform: 'rotate(-90deg)'
+        '&[dir=ltr]': {
+          transform: 'rotate(-90deg)'
+        },
+        '&[dir=rtl]': {
+          transform: 'rotate(90deg)'
+        }
       }
     },
     '& $iconWrapper[data-expanded="true"][data-icon="false"]': {
@@ -137,8 +157,13 @@ var treeStyle = {
   leaf: {},
   childnode: {},
   iconWrapper: {
+    '&[dir=ltr]': {
+      left: 0
+    },
+    '&[dir=rtl]': {
+      right: 0
+    },
     position: 'absolute',
-    left: 0,
     width: 24,
     height: 26,
     display: 'inline-flex',

package/esm/upload/upload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["upload.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,MAAM,MAAM,eAAe,GAAG,MAAM,aAAa,CAAC;AAElD,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,eAAe,CA2U1C,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["upload.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,MAAM,MAAM,eAAe,GAAG,MAAM,aAAa,CAAC;AAElD,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,eAAe,CAkV1C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/esm/upload/upload.js

@@ -101,6 +101,7 @@ var uploadStyle = {
     display: 'flex',
     alignItems: 'center',
     minWidth: '0',
+    wordBreak: 'break-all',
     flex: 1,
     gap: token.uploadResultGap,
     fontSize: token.uploadResultFontSize,
@@ -235,8 +236,14 @@ var uploadStyle = {
   imageResultTopBtn: {
     position: 'absolute',
     top: 0,
-    right: 0,
-    transform: 'translate(50%, -50%)',
+    '&[dir=ltr]': {
+      right: 0,
+      transform: 'translate(50%, -50%)'
+    },
+    '&[dir=rtl]': {
+      left: 0,
+      transform: 'translate(-50%, -50%)'
+    },
     color: token.uploadImageResultBtnCloseColor,
     cursor: 'pointer',
     '$resultDeleted &': {

package/esm/version.d.ts

@@ -1,3 +1,3 @@
-declare const _default: "3.1.0-rc.2";
+declare const _default: "3.1.0";
 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,wBAA4B"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["version.ts"],"names":[],"mappings":";AAAA,wBAAuB"}

package/esm/version.js

@@ -1 +1 @@
-export default '3.1.0-rc.2';
+export default '3.1.0';

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@sheinx/shineout-style",
-  "version": "3.1.0-rc.2",
+  "version": "3.1.0",
   "description": "",
   "keywords": [],
-  "license": "ISC",
+  "license": "MIT",
   "author": "",
   "sideEffects": [
     "./*/index.ts",
@@ -17,10 +17,15 @@
   "dependencies": {
     "jss": "10.9.2",
     "react-jss": "10.9.2",
-    "@sheinx/theme": "3.1.0-rc.2",
-    "@sheinx/base": "3.1.0-rc.2"
+    "@sheinx/theme": "3.1.0",
+    "@sheinx/base": "3.1.0"
   },
   "peerDependencies": {
     "core-js": ">=3"
-  }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/sheinsight/shineout-next"
+  },
+  "authors": ""
 }