@sheinx/shineout-style 3.9.10 → 3.9.11-beta.10

package/cjs/list/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["list.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,CA6HtC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["list.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,CAgItC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/cjs/list/list.js

@@ -89,7 +89,10 @@ var listStyle = {
     minWidth: 0
   },
   pagination: {
-    margin: "".concat(_theme.default.listPaginationMarginY, " 0")
+    marginTop: _theme.default.listPaginationMarginTop,
+    marginBottom: _theme.default.listPaginationMarginBottom,
+    marginLeft: 0,
+    marginRight: 0
   },
   // baseItem
   baseItem: {

package/cjs/menu/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["menu.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,MAAM,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC;AAM9C,QAAA,MAAM,SAAS,EAAE,QAAQ,CAAC,aAAa,CA8iBtC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["menu.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,MAAM,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC;AAM9C,QAAA,MAAM,SAAS,EAAE,QAAQ,CAAC,aAAa,CAijBtC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/cjs/menu/menu.js

@@ -84,15 +84,18 @@ var menuStyle = {
   },
   popArrow: {
     '&&&': {
-      boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
-      width: '6px',
-      height: '6px'
+      filter: 'drop-shadow(0 2px 8px rgba(0, 0, 0, 0.15))',
+      '&::before': {
+        backgroundColor: _theme.default.menuItemBackgroundColor
+      }
     }
   },
   popArrowDark: {
     '&&&': {
-      backgroundColor: _theme.default.menuDarkItemBackgroundColor,
-      boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)'
+      filter: 'drop-shadow(0 2px 8px rgba(0, 0, 0, 0.15))',
+      '&::before': {
+        backgroundColor: _theme.default.menuDarkItemBackgroundColor
+      }
     }
   },
   scrollbox: {

package/cjs/modal/modal.js

@@ -277,26 +277,26 @@ var modalStyle = _objectSpread(_objectSpread({
     }
   },
   wrapperDrawerLeft: {
-    '& $panel': {
+    '& > $mask > $panel': {
       left: 0,
       height: '100vh'
     }
   },
   wrapperDrawerRight: {
-    '& $panel': {
+    '& > $mask > $panel': {
       right: 0,
       height: '100vh'
     }
   },
   wrapperDrawerTop: {
-    '& $panel': {
+    '& > $mask > $panel': {
       top: 0,
       left: 0,
       width: '100vw'
     }
   },
   wrapperDrawerBottom: {
-    '& $panel': {
+    '& > $mask > $panel': {
       bottom: 0,
       left: 0,
       width: '100vw'

package/cjs/popover/popover.js

@@ -44,7 +44,7 @@ var popoverStyle = _objectSpread(_objectSpread({}, _tooltip.tooltipAnimation), {
         bottom: 0,
         width: '100%',
         height: '100%',
-        backgroundColor: _theme.default.popoverBackgroundColor,
+        backgroundColor: "var(--popover-background-color, ".concat(_theme.default.popoverBackgroundColor, ")"),
         clipPath: "path('".concat(_tooltip.arrowClipPath, "')")
       }
     },

package/cjs/table/table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["table.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAWxC,MAAM,MAAM,cAAc,GAAG,MAAM,YAAY,CAAC;AAUhD,QAAA,MAAM,UAAU,EAAE,QAAQ,CAAC,cAAc,CA+oBxC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["table.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAWxC,MAAM,MAAM,cAAc,GAAG,MAAM,YAAY,CAAC;AAUhD,QAAA,MAAM,UAAU,EAAE,QAAQ,CAAC,cAAc,CA6nBxC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/cjs/table/table.js

@@ -50,23 +50,11 @@ var tableStyle = _objectSpread(_objectSpread({
         wordBreak: 'break-all',
         position: 'relative',
         borderBottom: "1px solid ".concat(_theme.default.tableCellBorderColor),
+        borderRight: "var(--table-cell-border-width, 0px) solid ".concat(_theme.default.tableCellBorderColor),
         boxSizing: 'border-box',
         lineHeight: _theme.default.lineHeightDynamic,
-        '$bordered&': {
-          '&::after': {
-            content: '""',
-            position: 'absolute',
-            zIndex: cellBaseIndex,
-            top: 0,
-            bottom: 0,
-            borderLeft: "1px solid ".concat(_theme.default.tableCellBorderColor)
-          },
-          '[dir=ltr]&::after': {
-            right: 0
-          },
-          '[dir=rtl]&::after': {
-            left: 0
-          }
+        '&$cellIgnoreBorder': {
+          borderRight: 'none'
         }
       },
       '& td': {
@@ -149,6 +137,7 @@ var tableStyle = _objectSpread(_objectSpread({
     borderRight: "1px solid ".concat(_theme.default.tableCellBorderColor),
     borderBottom: 'none',
     borderTop: 'none',
+    '--table-cell-border-width': '1px',
     '&::before': {
       position: 'absolute',
       zIndex: fixedFixedIndex + 3,
@@ -318,12 +307,12 @@ var tableStyle = _objectSpread(_objectSpread({
     }
   },
   cellHover: {
-    'table tbody td&&': {
+    'table tbody td&': {
       background: "".concat(_theme.default.tableTbodyHoverBackgroundColor)
     }
   },
   rowHover: {
-    '&&:hover td': {
+    '&:hover > td': {
       transition: 'background-color 0.2s',
       background: "".concat(_theme.default.tableTbodyHoverBackgroundColor)
     }
@@ -572,11 +561,7 @@ var tableStyle = _objectSpread(_objectSpread({
       opacity: 0
     }
   },
-  cellIgnoreBorder: {
-    '&::after': {
-      display: 'none'
-    }
-  },
+  cellIgnoreBorder: {},
   cellSortable: {
     cursor: 'pointer',
     '&:hover': {
@@ -635,17 +620,17 @@ var tableStyle = _objectSpread(_objectSpread({
     alignItems: 'center'
   },
   rowStriped: {
-    '&& td': {
+    'table & > td': {
       background: _theme.default.tableTbodyStripedBackgroundColor
     }
   },
   rowChecked: {
-    '&& td': {
+    'table & > td': {
       background: _theme.default.tableTbodyActiveBackgroundColor
     }
   },
   rowExpand: {
-    '&& > td': {
+    'table & > td': {
       background: _theme.default.tableExpandBackgroundColor
     }
   },
@@ -662,10 +647,11 @@ var tableStyle = _objectSpread(_objectSpread({
       textAlign: 'left'
     },
     '$bordered&': {
-      '& th:last-child, & td:last-child': {
-        '&:after': {
-          display: 'none'
-        }
+      '& th:last-child[dir=ltr], & td:last-child[dir=ltr]': {
+        borderRight: 'none'
+      },
+      '& th:last-child[dir=rtl], & td:last-child[dir=rtl]': {
+        borderLeft: 'none'
       }
     },
     '& table tr:hover td': {

package/cjs/version.d.ts

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

package/cjs/version.d.ts.map

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

package/cjs/version.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = '3.9.10';
+var _default = exports.default = '3.9.11-beta.10';

package/esm/button/button-group.d.ts

@@ -0,0 +1,5 @@
+import { JsStyles } from '../jss-style';
+import { ButtonGroupClasses } from '@sheinx/base';
+declare const ButtonGroupStyle: JsStyles<keyof ButtonGroupClasses>;
+export default ButtonGroupStyle;
+//# sourceMappingURL=button-group.d.ts.map

package/esm/button/button-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group.d.ts","sourceRoot":"","sources":["button-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAU,MAAM,cAAc,CAAC;AAEhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AA6KlD,QAAA,MAAM,gBAAgB,EAAE,QAAQ,CAAC,MAAM,kBAAkB,CAgKxD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/esm/button/button-group.js

@@ -0,0 +1,267 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { prefix } from "../jss-style";
+import Token from '@sheinx/theme';
+// 引用 button stylesheet 的常量类名（元素同时拥有 hash class 和常量 class）
+var bc = function bc(key) {
+  return ".".concat(prefix, "-button-").concat(key);
+};
+var beforeLine = function beforeLine() {
+  return _defineProperty(_defineProperty({
+    '&::before': {
+      position: 'absolute',
+      content: '" "',
+      height: 'calc(50% - 2px)',
+      top: 'calc(25% + 1px)',
+      width: 1,
+      background: Token.buttonSplitlineFullBackgroundColor
+    },
+    '&[dir=ltr]::before': {
+      left: -1
+    },
+    '&[dir=rtl]::before': {
+      right: -1
+    }
+  }, "&".concat(bc('dashed'), ":hover"), _defineProperty({
+    '&::before': {
+      height: '100%',
+      top: 0,
+      bottom: 0,
+      borderLeft: '1px dashed currentColor',
+      background: 'none'
+    },
+    // 使用 ::after 在右侧创建分割线，颜色使用当前按钮的 currentColor
+    '&:not(:last-child)::after': {
+      content: '" "',
+      position: 'absolute',
+      height: '100%',
+      top: 0,
+      width: 1,
+      borderLeft: '1px dashed currentColor',
+      background: 'none',
+      zIndex: 1
+    },
+    '&:not(:last-child)[dir=ltr]::after': {
+      right: -1
+    },
+    '&:not(:last-child)[dir=rtl]::after': {
+      left: -1
+    }
+  }, "& + ".concat(bc('button'), "::before"), {
+    opacity: 0
+  })), "&:not(".concat(bc('disabled'), "):not(").concat(bc('dashed'), "):hover"), _defineProperty({
+    '&::before': {
+      background: 'transparent'
+    }
+  }, "& + ".concat(bc('button'), ",& + * ").concat(bc('button')), {
+    '&::before': {
+      background: 'transparent'
+    }
+  }));
+};
+var outlineBeforeLine = function outlineBeforeLine(type, styles) {
+  return _defineProperty({
+    '&::before': {
+      position: 'absolute',
+      content: '" "',
+      height: 'calc(50% - 2px)',
+      top: 'calc(25% + 1px)',
+      width: 1,
+      background: Token["button".concat(type).concat(styles, "BorderColor")]
+    },
+    '&[dir=ltr]::before': {
+      left: -1
+    },
+    '&[dir=rtl]::before': {
+      right: -1
+    },
+    '&:not(:disabled):hover': _defineProperty(_defineProperty({
+      // before
+      '&::before': {
+        height: 'calc(100% + 1.8px)',
+        top: -0.8,
+        left: -1,
+        width: 1,
+        background: Token["button".concat(type).concat(styles, "HoverBorderColor")]
+      }
+    }, "& + ".concat(bc('button'), ",& + * ").concat(bc('button')), {
+      '&::before': {
+        height: 'calc(100% + 1.8px)',
+        top: -0.8,
+        left: -1,
+        width: 1,
+        background: Token["button".concat(type).concat(styles, "HoverBorderColor")]
+      }
+    }), '&:active', _defineProperty({
+      '&::before': {
+        background: Token["button".concat(type).concat(styles, "ActiveBorderColor")]
+      }
+    }, "& + ".concat(bc('button'), ",& + * ").concat(bc('button')), {
+      '&::before': {
+        background: Token["button".concat(type).concat(styles, "ActiveBorderColor")]
+      }
+    }))
+  }, "&".concat(bc('primary'), ",&").concat(bc('success'), ",&").concat(bc('warning'), ",&").concat(bc('danger'), ",").concat(bc('secondary')), {
+    '&::before': {
+      height: 'calc(100% + 2px)',
+      top: -1,
+      left: -1,
+      width: 1,
+      bottom: -1,
+      background: "".concat(Token["button".concat(type).concat(styles, "BorderColor")])
+    },
+    '& + :not(&)': {
+      '&::before': {
+        height: 'calc(100% + 2px)',
+        top: -1,
+        left: -1,
+        width: 1,
+        bottom: -1,
+        background: Token["button".concat(type).concat(styles, "BorderColor")]
+      }
+    },
+    '&:disabled': {
+      '&::before': {
+        background: Token["button".concat(type).concat(styles, "DisabledBorderColor")]
+      },
+      '& + :not(&)': {
+        '&::before': {
+          background: Token["button".concat(type).concat(styles, "DisabledBorderColor")]
+        }
+      }
+    }
+  });
+};
+var textBeforeLine = function textBeforeLine() {
+  return _defineProperty({
+    '&::before': {
+      transition: 'all 0.3s',
+      position: 'absolute',
+      content: '" "',
+      height: 'calc(50% - 2px)',
+      top: 'calc(25% + 1px)',
+      width: 1,
+      background: Token.buttonSplitlineOutlineBackgroundColor
+    },
+    '&[dir=ltr]::before': {
+      left: -1
+    },
+    '&[dir=rtl]::before': {
+      right: -1
+    }
+  }, "&:not(".concat(bc('disabled'), "):hover"), _defineProperty({
+    '&::before': {
+      background: 'transparent'
+    }
+  }, "& + ".concat(bc('button'), ",& + * ").concat(bc('button')), {
+    '&::before': {
+      background: 'transparent'
+    }
+  }));
+};
+var ButtonGroupStyle = {
+  rootClass: {},
+  group: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    // 2.x 之前非 inline-block
+    display: 'inline-flex',
+    // 处理 dropdown 下的 button
+    '& [data-role="dropdown"]': _defineProperty(_defineProperty({}, "& ".concat(bc('button')), {
+      height: '100%'
+    }), '& [data-role="caret"]', {
+      margin: 0
+    })
+  }, "& > :first-child".concat(bc('button'), ",& > :first-child ").concat(bc('button')), {
+    '&::before': {
+      display: 'none'
+    }
+  }), "& > :first-child:not(:last-child)".concat(bc('button'), ",& > :first-child:not(:last-child) ").concat(bc('button')), {
+    '&[dir=ltr]': {
+      borderTopRightRadius: 0,
+      borderBottomRightRadius: 0,
+      borderRight: 'none'
+    },
+    '&[dir=rtl]': {
+      borderTopLeftRadius: 0,
+      borderBottomLeftRadius: 0,
+      borderRight: 'none'
+    }
+  }), "& > :last-child:not(:first-child)".concat(bc('button'), ",& > :last-child:not(:first-child) ").concat(bc('button')), {
+    '&[dir=ltr]': {
+      borderTopLeftRadius: 0,
+      borderBottomLeftRadius: 0,
+      borderLeft: 'none'
+    },
+    '&[dir=rtl]': {
+      borderTopRightRadius: 0,
+      borderBottomRightRadius: 0,
+      borderLeft: 'none'
+    }
+  }), "& > :not(:first-child):not(:last-child)".concat(bc('button'), ",& > :not(:first-child):not(:last-child) ").concat(bc('button')), {
+    borderRadius: 0,
+    borderLeft: 'none',
+    borderRight: 'none'
+  }), "& ".concat(bc('button'), ":not(").concat(bc('outline'), "):not(").concat(bc('text'), ")"), _defineProperty(_defineProperty(_defineProperty({
+    position: 'relative',
+    '&::before': {
+      transition: 'all 0.3s'
+    }
+  }, "&".concat(bc('secondary')), _objectSpread(_objectSpread({}, beforeLine()), {}, _defineProperty({
+    '&::before': {
+      position: 'absolute',
+      content: '" "',
+      height: 'calc(50% - 2px)',
+      top: 'calc(25% + 1px)',
+      width: 1,
+      background: Token.buttonSplitlineOutlineBackgroundColor,
+      transition: 'none'
+    },
+    '&[dir=ltr]::before': {
+      left: -1
+    },
+    '&[dir=rtl]::before': {
+      right: -1
+    }
+  }, "& + :not(&),& + * ".concat(bc('button'), ":not(&)"), {
+    '&::before': {
+      background: 'transparent'
+    }
+  }))), "&".concat(bc('primary'), ",&").concat(bc('success'), ",&").concat(bc('warning'), ",&").concat(bc('danger')), _objectSpread({}, beforeLine())), "&".concat(bc('primary'), ",&").concat(bc('success'), ",&").concat(bc('warning'), ",&").concat(bc('danger'), ",").concat(bc('secondary')), _defineProperty(_defineProperty({}, "& + :not(&),& + * ".concat(bc('button'), ":not(&)"), {
+    '&::before': {
+      background: 'transparent'
+    }
+  }), "& + ".concat(bc('button'), ":not(&)"), {
+    '&::before': {
+      background: 'transparent'
+    }
+  }))), "& ".concat(bc('outline')), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    position: 'relative',
+    '&::before': {
+      transition: 'all 0.3s'
+    }
+  }, "&".concat(bc('secondary')), _objectSpread(_objectSpread({}, outlineBeforeLine('Secondary', 'Outline')), {}, {
+    '&::before': {
+      position: 'absolute',
+      content: '" "',
+      height: 'calc(50% - 2px)',
+      top: 'calc(25% + 1px)',
+      width: 1,
+      background: Token.buttonSplitlineOutlineBackgroundColor // Neutral-border-1
+    },
+    '&[dir=ltr]::before': {
+      left: -1
+    },
+    '&[dir=rtl]::before': {
+      right: -1
+    }
+  })), "&".concat(bc('primary')), _objectSpread({}, outlineBeforeLine('Primary', 'Outline'))), "&".concat(bc('success')), _objectSpread({}, outlineBeforeLine('Success', 'Outline'))), "&".concat(bc('warning')), _objectSpread({}, outlineBeforeLine('Warning', 'Outline'))), "&".concat(bc('danger')), _objectSpread({}, outlineBeforeLine('Danger', 'Outline')))), "& ".concat(bc('text')), _objectSpread({
+    position: 'relative'
+  }, textBeforeLine())), "&".concat(bc('dashed')), {
+    position: 'relative',
+    borderStyle: 'none'
+  })
+};
+export default ButtonGroupStyle;

package/esm/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAiN7C,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,MAAM,aAAa,CAqZ9C,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AA8C7C,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,MAAM,aAAa,CAkP9C,CAAC;AAEF,eAAe,WAAW,CAAC"}