musae 1.3.1-beta.8 → 1.3.1-beta.9

package/dist/components/bottom-sheet/bottom-sheet.cjs

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var styles = require('./styles.cjs');
 var React = require('react');
 var sheet = require('../sheet/sheet.cjs');
@@ -13,7 +12,6 @@ var className = require('@aiszlab/relax/class-name');
 var useThemeColorVars = require('../../hooks/use-theme-color-vars.cjs');
 var context = require('./context.cjs');
 
-var _excluded = ["open", "height", "closable", "modal"];
 /**
  * @zh BottomSheet 组件。从底部滑入的模态面板，带有拖拽手柄指示器。
  * 基于共享的 Sheet 基础组件构建。
@@ -29,7 +27,12 @@ var BottomSheet = function BottomSheet(_ref) {
     closable = _ref$closable === void 0 ? true : _ref$closable,
     _ref$modal = _ref.modal,
     modal = _ref$modal === void 0 ? true : _ref$modal,
-    props = _objectWithoutProperties(_ref, _excluded);
+    onClose = _ref.onClose,
+    className$1 = _ref.className,
+    style = _ref.style,
+    panelClassName = _ref.panelClassName,
+    panelStyle = _ref.panelStyle,
+    children = _ref.children;
   var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
   var themeColorVars = useThemeColorVars.useThemeColorVars(["on-surface-variant"]);
   var styled = {
@@ -50,11 +53,13 @@ var BottomSheet = function BottomSheet(_ref) {
     size: height,
     closable: closable,
     modal: modal,
-    onClose: props.onClose,
-    className: classNames.sheet,
+    onClose: onClose,
+    className: className.stringify(classNames.sheet, className$1),
+    style: style,
     header: header,
-    panelClassName: styled.panel.className
-  }, props.children);
+    panelClassName: className.stringify(styled.panel.className, panelClassName),
+    panelStyle: _objectSpread(_objectSpread({}, styled.panel.style), panelStyle)
+  }, children);
 };
 
 exports.default = BottomSheet;

package/dist/components/bottom-sheet/bottom-sheet.d.ts

@@ -6,5 +6,5 @@ import type { BottomSheetProps } from "../../types/bottom-sheet";
  * @en BottomSheet component. A modal panel that slides up from the bottom
  * with a drag handle indicator. Built on the shared Sheet base component.
  */
-declare const BottomSheet: ({ open, height, closable, modal, ...props }: BottomSheetProps) => React.JSX.Element;
+declare const BottomSheet: ({ open, height, closable, modal, onClose, className, style, panelClassName, panelStyle, children, }: BottomSheetProps) => React.JSX.Element;
 export default BottomSheet;

package/dist/components/bottom-sheet/bottom-sheet.mjs

@@ -1,5 +1,4 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import styles from './styles.mjs';
 import React from 'react';
 import Sheet from '../sheet/sheet.mjs';
@@ -9,7 +8,6 @@ import { stringify } from '@aiszlab/relax/class-name';
 import { useThemeColorVars } from '../../hooks/use-theme-color-vars.mjs';
 import { CLASS_NAMES } from './context.mjs';
 
-var _excluded = ["open", "height", "closable", "modal"];
 /**
  * @zh BottomSheet 组件。从底部滑入的模态面板，带有拖拽手柄指示器。
  * 基于共享的 Sheet 基础组件构建。
@@ -25,7 +23,12 @@ var BottomSheet = function BottomSheet(_ref) {
     closable = _ref$closable === void 0 ? true : _ref$closable,
     _ref$modal = _ref.modal,
     modal = _ref$modal === void 0 ? true : _ref$modal,
-    props$1 = _objectWithoutProperties(_ref, _excluded);
+    onClose = _ref.onClose,
+    className = _ref.className,
+    style = _ref.style,
+    panelClassName = _ref.panelClassName,
+    panelStyle = _ref.panelStyle,
+    children = _ref.children;
   var classNames = useClassNames(CLASS_NAMES);
   var themeColorVars = useThemeColorVars(["on-surface-variant"]);
   var styled = {
@@ -46,11 +49,13 @@ var BottomSheet = function BottomSheet(_ref) {
     size: height,
     closable: closable,
     modal: modal,
-    onClose: props$1.onClose,
-    className: classNames.sheet,
+    onClose: onClose,
+    className: stringify(classNames.sheet, className),
+    style: style,
     header: header,
-    panelClassName: styled.panel.className
-  }, props$1.children);
+    panelClassName: stringify(styled.panel.className, panelClassName),
+    panelStyle: _objectSpread(_objectSpread({}, styled.panel.style), panelStyle)
+  }, children);
 };
 
 export { BottomSheet as default };

package/dist/components/sheet/sheet.cjs

@@ -40,6 +40,7 @@ var Sheet = function Sheet(_ref) {
     header = _ref.header,
     footer = _ref.footer,
     className$1 = _ref.className,
+    style = _ref.style,
     panelClassName = _ref.panelClassName,
     panelStyle = _ref.panelStyle,
     _ref$modal = _ref.modal,
@@ -140,7 +141,7 @@ var Sheet = function Sheet(_ref) {
     style: _objectSpread(_objectSpread(_objectSpread({}, styled.container.style), themeColorVars), {}, {
       "--default-position": relax.at(_placement, 0),
       "--size": typeof size === "number" ? "".concat(size, "px") : size
-    }),
+    }, style),
     onKeyDown: onKeyDown
   }, /*#__PURE__*/React.createElement("div", {
     ref: overlayRef,

package/dist/components/sheet/sheet.d.ts

@@ -7,5 +7,5 @@ import type { SheetProps } from "../../types/sheet";
  * placement-driven slide animation, focus management, and body scroll lock.
  * Drawer and BottomSheet are thin wrappers around this component.
  */
-declare const Sheet: ({ visible, onClose, placement, size, closable, header, footer, className, panelClassName, panelStyle, modal, children, }: SheetProps) => React.JSX.Element;
+declare const Sheet: ({ visible, onClose, placement, size, closable, header, footer, className, style, panelClassName, panelStyle, modal, children, }: SheetProps) => React.JSX.Element;
 export default Sheet;

package/dist/components/sheet/sheet.mjs

@@ -36,6 +36,7 @@ var Sheet = function Sheet(_ref) {
     header = _ref.header,
     footer = _ref.footer,
     className = _ref.className,
+    style = _ref.style,
     panelClassName = _ref.panelClassName,
     panelStyle = _ref.panelStyle,
     _ref$modal = _ref.modal,
@@ -136,7 +137,7 @@ var Sheet = function Sheet(_ref) {
     style: _objectSpread(_objectSpread(_objectSpread({}, styled.container.style), themeColorVars), {}, {
       "--default-position": at(_placement, 0),
       "--size": typeof size === "number" ? "".concat(size, "px") : size
-    }),
+    }, style),
     onKeyDown: onKeyDown
   }, /*#__PURE__*/React.createElement("div", {
     ref: overlayRef,

package/dist/types/bottom-sheet.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import type { CSSProperties, ReactNode } from "react";
 import type { ComponentProps } from "./element";
 import type { Closable } from "../hooks/use-closable";
 export interface BottomSheetProps extends ComponentProps {
@@ -20,6 +20,18 @@ export interface BottomSheetProps extends ComponentProps {
      * @default void 0
      */
     children?: ReactNode;
+    /**
+     * @zh 应用到 Bottom Sheet 面板元素上的额外类名。
+     * @en Additional class name applied to the Bottom Sheet panel element.
+     * @default void 0
+     */
+    panelClassName?: string;
+    /**
+     * @zh 应用到 Bottom Sheet 面板元素上的额外内联样式。
+     * @en Additional inline styles applied to the Bottom Sheet panel element.
+     * @default void 0
+     */
+    panelStyle?: CSSProperties;
     /**
      * @zh 面板高度，接受数字（px）或任意 CSS 高度值。
      * @en Height of the sheet panel. Accepts a number (px) or any CSS height value.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "musae",
-  "version": "1.3.1-beta.8",
+  "version": "1.3.1-beta.9",
   "description": "musae-ui",
   "author": "tutu@fantufantu.com",
   "license": "MIT",