musae 1.3.0 → 1.3.1-beta.2

package/dist/__test__/table.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom";

package/dist/components/search/search.cjs

@@ -35,7 +35,8 @@ var Search = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$clearable = _ref.clearable,
     clearable = _ref$clearable === void 0 ? true : _ref$clearable,
     searchButton = _ref.searchButton,
-    onSearch = _ref.onSearch;
+    onSearch = _ref.onSearch,
+    onClear = _ref.onClear;
   var inputRef = React.useRef(null);
   var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
   var themeColorVars = useThemeColorVars.useThemeColorVars(["primary", "outline", "surface-container-high", "on-surface-variant", ["on-surface-variant", tokens_stylex.OPACITY.thin], ["on-surface", tokens_stylex.OPACITY.thickest], ["on-surface", tokens_stylex.OPACITY.thin]]);
@@ -74,6 +75,7 @@ var Search = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var handleClear = relax.useEvent(function () {
     _setValue("");
     onChange === null || onChange === void 0 || onChange("");
+    onClear === null || onClear === void 0 || onClear();
   });
   var handleKeyDown = React.useCallback(function (e) {
     if (e.key === "Enter") {

package/dist/components/search/search.d.ts

@@ -13,5 +13,6 @@ declare const Search: React.ForwardRefExoticComponent<import("../../types/elemen
     clearable?: boolean;
     searchButton?: React.ReactNode;
     onSearch?: (keyword?: string) => void;
+    onClear?: () => void;
 } & React.RefAttributes<SearchRef>>;
 export default Search;

package/dist/components/search/search.mjs

@@ -31,7 +31,8 @@ var Search = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _ref$clearable = _ref.clearable,
     clearable = _ref$clearable === void 0 ? true : _ref$clearable,
     searchButton = _ref.searchButton,
-    onSearch = _ref.onSearch;
+    onSearch = _ref.onSearch,
+    onClear = _ref.onClear;
   var inputRef = useRef(null);
   var classNames = useClassNames(CLASS_NAMES);
   var themeColorVars = useThemeColorVars(["primary", "outline", "surface-container-high", "on-surface-variant", ["on-surface-variant", OPACITY.thin], ["on-surface", OPACITY.thickest], ["on-surface", OPACITY.thin]]);
@@ -70,6 +71,7 @@ var Search = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var handleClear = useEvent(function () {
     _setValue("");
     onChange === null || onChange === void 0 || onChange("");
+    onClear === null || onClear === void 0 || onClear();
   });
   var handleKeyDown = useCallback(function (e) {
     if (e.key === "Enter") {

package/dist/components/sheet/sheet.cjs

@@ -88,6 +88,15 @@ var styles = {
     kVQacm: "musaex-ysyzu8",
     kZeWKH: "musaex-ish69e",
     $$css: true
+  },
+  panelFullscreen: {
+    kRDq7Z: "musaex-1ej3teu",
+    kllhKz: "musaex-1pzvw0h",
+    kIfGbc: "musaex-1se81xg",
+    kBJAon: "musaex-19wv56r",
+    kGHaHD: "musaex-1m33i82",
+    kYNdYH: "musaex-1uogugb",
+    $$css: true
   }
 };
 /**
@@ -106,6 +115,7 @@ var Sheet = function Sheet(_ref) {
     _ref$closable = _ref.closable,
     closable = _ref$closable === void 0 ? true : _ref$closable,
     header = _ref.header,
+    footer = _ref.footer,
     className$1 = _ref.className,
     panelClassName = _ref.panelClassName,
     panelStyle = _ref.panelStyle,
@@ -201,7 +211,7 @@ var Sheet = function Sheet(_ref) {
     overlay: {
       className: "musaex-10l6tqk musaex-10a8y8t musaex-67bb7w musaex-g01cxk musaex-11we2rp"
     },
-    panel: stylex.props(styles.panel, styles[placement]),
+    panel: stylex.props(styles.panel, styles[placement], styles.panelFullscreen),
     body: {
       className: "musaex-98rzlu musaex-ysyzu8 musaex-ish69e"
     }
@@ -220,7 +230,7 @@ var Sheet = function Sheet(_ref) {
     className: className.stringify(classNames.sheet, className$1, styled.container.className),
     style: _objectSpread(_objectSpread(_objectSpread({}, styled.container.style), themeColorVars), {}, {
       "--default-position": relax.at(_placement, 0),
-      "--size": "".concat(size, "px")
+      "--size": typeof size === "number" ? "".concat(size, "px") : size
     }),
     onKeyDown: onKeyDown
   }, /*#__PURE__*/React.createElement("div", {
@@ -235,7 +245,7 @@ var Sheet = function Sheet(_ref) {
   }, header, /*#__PURE__*/React.createElement("div", {
     className: className.stringify(classNames.body, styled.body.className),
     style: styled.body.style
-  }, children)))));
+  }, children), footer))));
 };
 
 exports.default = Sheet;

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, className, panelClassName, panelStyle, modal, children, }: SheetProps) => React.JSX.Element;
+declare const Sheet: ({ visible, onClose, placement, size, closable, header, footer, className, panelClassName, panelStyle, modal, children, }: SheetProps) => React.JSX.Element;
 export default Sheet;

package/dist/components/sheet/sheet.mjs

@@ -84,6 +84,15 @@ var styles = {
     kVQacm: "musaex-ysyzu8",
     kZeWKH: "musaex-ish69e",
     $$css: true
+  },
+  panelFullscreen: {
+    kRDq7Z: "musaex-1ej3teu",
+    kllhKz: "musaex-1pzvw0h",
+    kIfGbc: "musaex-1se81xg",
+    kBJAon: "musaex-19wv56r",
+    kGHaHD: "musaex-1m33i82",
+    kYNdYH: "musaex-1uogugb",
+    $$css: true
   }
 };
 /**
@@ -102,6 +111,7 @@ var Sheet = function Sheet(_ref) {
     _ref$closable = _ref.closable,
     closable = _ref$closable === void 0 ? true : _ref$closable,
     header = _ref.header,
+    footer = _ref.footer,
     className = _ref.className,
     panelClassName = _ref.panelClassName,
     panelStyle = _ref.panelStyle,
@@ -197,7 +207,7 @@ var Sheet = function Sheet(_ref) {
     overlay: {
       className: "musaex-10l6tqk musaex-10a8y8t musaex-67bb7w musaex-g01cxk musaex-11we2rp"
     },
-    panel: props(styles.panel, styles[placement]),
+    panel: props(styles.panel, styles[placement], styles.panelFullscreen),
     body: {
       className: "musaex-98rzlu musaex-ysyzu8 musaex-ish69e"
     }
@@ -216,7 +226,7 @@ var Sheet = function Sheet(_ref) {
     className: stringify(classNames.sheet, className, styled.container.className),
     style: _objectSpread(_objectSpread(_objectSpread({}, styled.container.style), themeColorVars), {}, {
       "--default-position": at(_placement, 0),
-      "--size": "".concat(size, "px")
+      "--size": typeof size === "number" ? "".concat(size, "px") : size
     }),
     onKeyDown: onKeyDown
   }, /*#__PURE__*/React.createElement("div", {
@@ -231,7 +241,7 @@ var Sheet = function Sheet(_ref) {
   }, header, /*#__PURE__*/React.createElement("div", {
     className: stringify(classNames.body, styled.body.className),
     style: styled.body.style
-  }, children)))));
+  }, children), footer))));
 };
 
 export { Sheet as default };

package/dist/components/side-sheet/__test__/index.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom";

package/dist/components/side-sheet/context.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+/**
+ * @zh SideSheet 的 class 名称
+ * @en class names for SideSheet
+ */
+var CLASS_NAMES = {
+  sideSheet: "side-sheet",
+  header: "side-sheet__header",
+  title: "side-sheet__title",
+  content: "side-sheet__content",
+  actions: "side-sheet__actions"
+};
+
+exports.CLASS_NAMES = CLASS_NAMES;

package/dist/components/side-sheet/context.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @zh SideSheet 的 class 名称
+ * @en class names for SideSheet
+ */
+export declare const CLASS_NAMES: {
+    readonly sideSheet: "side-sheet";
+    readonly header: "side-sheet__header";
+    readonly title: "side-sheet__title";
+    readonly content: "side-sheet__content";
+    readonly actions: "side-sheet__actions";
+};

package/dist/components/side-sheet/context.mjs

@@ -0,0 +1,13 @@
+/**
+ * @zh SideSheet 的 class 名称
+ * @en class names for SideSheet
+ */
+var CLASS_NAMES = {
+  sideSheet: "side-sheet",
+  header: "side-sheet__header",
+  title: "side-sheet__title",
+  content: "side-sheet__content",
+  actions: "side-sheet__actions"
+};
+
+export { CLASS_NAMES };

package/dist/components/side-sheet/index.d.ts

@@ -0,0 +1,2 @@
+import SideSheet from "./side-sheet";
+export { SideSheet };

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

@@ -0,0 +1,140 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var React = require('react');
+var sheet = require('../sheet/sheet.cjs');
+var divider = require('../divider/divider.cjs');
+var button = require('../button/button.cjs');
+var iconButton = require('../icon-button/icon-button.cjs');
+var useClosable = require('../../hooks/use-closable.cjs');
+var useClassNames = require('../../hooks/use-class-names.cjs');
+var useThemeColorVars = require('../../hooks/use-theme-color-vars.cjs');
+var useLocale = require('../../locale/use-locale.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var className = require('@aiszlab/relax/class-name');
+var theme = require('../theme/theme.cjs');
+var context = require('./context.cjs');
+var styles = require('./styles.cjs');
+var arrowBack = require('../icon/icons/navigation/arrow-back.cjs');
+
+/**
+ * @zh SideSheet 组件。Material Design 3 侧边栏：承载补充内容或操作的面板，
+ * 支持从屏幕四边（left/right/top/bottom）滑入。`modal` 类型基于共享的 Sheet
+ * 基础组件构建（遮罩层 + 滑入动画），mobile 下全屏展示；`standard` 类型内嵌
+ * 在布局中展示（无遮罩层，停靠边缘带分割线）。
+ * @en SideSheet component. A Material Design 3 side sheet: a surface for
+ * supplementary content or actions, sliding in from any screen edge
+ * (left/right/top/bottom). The `modal` type is built on the shared Sheet base
+ * component (scrim + slide animation) and goes fullscreen on mobile;
+ * the `standard` type renders inline in the layout (no scrim, with a divider
+ * on the anchored edge).
+ */
+var SideSheet = function SideSheet(_ref) {
+  var open = _ref.open,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? "modal" : _ref$type,
+    title = _ref.title,
+    onBack = _ref.onBack,
+    onConfirm = _ref.onConfirm,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? true : _ref$closable,
+    onClose = _ref.onClose,
+    actions = _ref.actions,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 400 : _ref$size,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? "right" : _ref$placement,
+    className$1 = _ref.className,
+    style = _ref.style,
+    children = _ref.children;
+  var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
+  var themeColorVars = useThemeColorVars.useThemeColorVars(["surface", "surface-container-low", "on-surface-variant", "outline-variant"]);
+  var _useLocale = useLocale.useLocale("drawer"),
+    _useLocale2 = _slicedToArray(_useLocale, 1),
+    locale = _useLocale2[0];
+  var _useClosable = useClosable.useClosable({
+      closable: closable,
+      onClose: onClose
+    }),
+    closer = _useClosable.closer;
+  var styled = {
+    panel: stylex.props(styles.styles.panel["default"]),
+    standard: stylex.props(styles.styles.standard["default"], styles.styles.standard[placement]),
+    header: stylex.props(styles.styles.header["default"], onBack ? styles.styles.header.withBack : styles.styles.header.withTitle),
+    title: stylex.props(theme.$title.large, styles.styles.title["default"]),
+    content: stylex.props(styles.styles.content["default"]),
+    actions: stylex.props(styles.styles.actions["default"]),
+    actionsRow: stylex.props(styles.styles.actions.row)
+  };
+  /**
+   * @zh 头部栏：可选的返回按钮、标题和关闭按钮。
+   * 三者都不存在时不渲染头部，避免空置的占位空间。
+   * @en Header bar: optional back button, headline, and closer.
+   * Not rendered when all three are absent, avoiding empty placeholder space.
+   */
+  var hasHeader = !!title || !!onBack || !!onConfirm || !!closer;
+  var header = hasHeader ? (/*#__PURE__*/React.createElement("div", {
+    className: className.stringify(classNames.header, styled.header.className),
+    style: styled.header.style
+  }, onBack && (/*#__PURE__*/React.createElement(iconButton.default, {
+    variant: "text",
+    onClick: onBack
+  }, /*#__PURE__*/React.createElement(arrowBack.default, null))), /*#__PURE__*/React.createElement("div", {
+    className: className.stringify(classNames.title, styled.title.className),
+    style: styled.title.style
+  }, title), onConfirm && /*#__PURE__*/React.createElement(button.Button, {
+    onClick: onConfirm
+  }, locale.confirm), closer)) : null;
+  /**
+   * @zh 底部操作区：分割线 + 操作按钮行。
+   * @en Footer actions: a divider above the actions row.
+   */
+  var footer = actions ? (/*#__PURE__*/React.createElement("div", {
+    className: className.stringify(classNames.actions, styled.actions.className),
+    style: styled.actions.style
+  }, /*#__PURE__*/React.createElement(divider.default, {
+    margin: 0
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styled.actionsRow.className,
+    style: styled.actionsRow.style
+  }, actions))) : null;
+  /**
+   * @zh 标准类型：内嵌在布局中展示，无遮罩层，停靠边缘带分割线。
+   * @en Standard type: rendered inline in the layout, without a scrim,
+   * with a divider on the anchored edge.
+   */
+  if (type === "standard") {
+    if (!open) return null;
+    return /*#__PURE__*/React.createElement("div", {
+      className: className.stringify(classNames.sideSheet, className$1, styled.standard.className),
+      style: _objectSpread(_objectSpread(_objectSpread({}, styled.standard.style), themeColorVars), {}, {
+        "--size": typeof size === "number" ? "".concat(size, "px") : size
+      }, style)
+    }, header, /*#__PURE__*/React.createElement("div", {
+      className: className.stringify(classNames.content, styled.content.className),
+      style: styled.content.style
+    }, children), footer);
+  }
+  /**
+   * @zh 模态类型：基于共享的 Sheet 基础组件，带遮罩层和滑入动画。
+   * @en Modal type: built on the shared Sheet base component, with a scrim
+   * and slide animation.
+   */
+  return /*#__PURE__*/React.createElement(sheet.default, {
+    visible: open,
+    placement: placement,
+    size: size,
+    closable: closable,
+    onClose: onClose,
+    className: classNames.sideSheet,
+    header: header,
+    footer: footer,
+    panelClassName: styled.panel.className,
+    panelStyle: _objectSpread(_objectSpread({}, themeColorVars), styled.panel.style)
+  }, children);
+};
+
+exports.default = SideSheet;

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

@@ -0,0 +1,16 @@
+import React from "react";
+import type { SideSheetProps } from "../../types/side-sheet";
+/**
+ * @zh SideSheet 组件。Material Design 3 侧边栏：承载补充内容或操作的面板，
+ * 支持从屏幕四边（left/right/top/bottom）滑入。`modal` 类型基于共享的 Sheet
+ * 基础组件构建（遮罩层 + 滑入动画），mobile 下全屏展示；`standard` 类型内嵌
+ * 在布局中展示（无遮罩层，停靠边缘带分割线）。
+ * @en SideSheet component. A Material Design 3 side sheet: a surface for
+ * supplementary content or actions, sliding in from any screen edge
+ * (left/right/top/bottom). The `modal` type is built on the shared Sheet base
+ * component (scrim + slide animation) and goes fullscreen on mobile;
+ * the `standard` type renders inline in the layout (no scrim, with a divider
+ * on the anchored edge).
+ */
+declare const SideSheet: ({ open, type, title, onBack, onConfirm, closable, onClose, actions, size, placement, className, style, children, }: SideSheetProps) => React.JSX.Element | null;
+export default SideSheet;

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

@@ -0,0 +1,136 @@
+import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import React from 'react';
+import Sheet from '../sheet/sheet.mjs';
+import Divider from '../divider/divider.mjs';
+import { Button } from '../button/button.mjs';
+import IconButton from '../icon-button/icon-button.mjs';
+import { useClosable } from '../../hooks/use-closable.mjs';
+import { useClassNames } from '../../hooks/use-class-names.mjs';
+import { useThemeColorVars } from '../../hooks/use-theme-color-vars.mjs';
+import { useLocale } from '../../locale/use-locale.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { stringify } from '@aiszlab/relax/class-name';
+import { $title } from '../theme/theme.mjs';
+import { CLASS_NAMES } from './context.mjs';
+import { styles } from './styles.mjs';
+import IconArrowBack from '../icon/icons/navigation/arrow-back.mjs';
+
+/**
+ * @zh SideSheet 组件。Material Design 3 侧边栏：承载补充内容或操作的面板，
+ * 支持从屏幕四边（left/right/top/bottom）滑入。`modal` 类型基于共享的 Sheet
+ * 基础组件构建（遮罩层 + 滑入动画），mobile 下全屏展示；`standard` 类型内嵌
+ * 在布局中展示（无遮罩层，停靠边缘带分割线）。
+ * @en SideSheet component. A Material Design 3 side sheet: a surface for
+ * supplementary content or actions, sliding in from any screen edge
+ * (left/right/top/bottom). The `modal` type is built on the shared Sheet base
+ * component (scrim + slide animation) and goes fullscreen on mobile;
+ * the `standard` type renders inline in the layout (no scrim, with a divider
+ * on the anchored edge).
+ */
+var SideSheet = function SideSheet(_ref) {
+  var open = _ref.open,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? "modal" : _ref$type,
+    title = _ref.title,
+    onBack = _ref.onBack,
+    onConfirm = _ref.onConfirm,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? true : _ref$closable,
+    onClose = _ref.onClose,
+    actions = _ref.actions,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 400 : _ref$size,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? "right" : _ref$placement,
+    className = _ref.className,
+    style = _ref.style,
+    children = _ref.children;
+  var classNames = useClassNames(CLASS_NAMES);
+  var themeColorVars = useThemeColorVars(["surface", "surface-container-low", "on-surface-variant", "outline-variant"]);
+  var _useLocale = useLocale("drawer"),
+    _useLocale2 = _slicedToArray(_useLocale, 1),
+    locale = _useLocale2[0];
+  var _useClosable = useClosable({
+      closable: closable,
+      onClose: onClose
+    }),
+    closer = _useClosable.closer;
+  var styled = {
+    panel: props(styles.panel["default"]),
+    standard: props(styles.standard["default"], styles.standard[placement]),
+    header: props(styles.header["default"], onBack ? styles.header.withBack : styles.header.withTitle),
+    title: props($title.large, styles.title["default"]),
+    content: props(styles.content["default"]),
+    actions: props(styles.actions["default"]),
+    actionsRow: props(styles.actions.row)
+  };
+  /**
+   * @zh 头部栏：可选的返回按钮、标题和关闭按钮。
+   * 三者都不存在时不渲染头部，避免空置的占位空间。
+   * @en Header bar: optional back button, headline, and closer.
+   * Not rendered when all three are absent, avoiding empty placeholder space.
+   */
+  var hasHeader = !!title || !!onBack || !!onConfirm || !!closer;
+  var header = hasHeader ? (/*#__PURE__*/React.createElement("div", {
+    className: stringify(classNames.header, styled.header.className),
+    style: styled.header.style
+  }, onBack && (/*#__PURE__*/React.createElement(IconButton, {
+    variant: "text",
+    onClick: onBack
+  }, /*#__PURE__*/React.createElement(IconArrowBack, null))), /*#__PURE__*/React.createElement("div", {
+    className: stringify(classNames.title, styled.title.className),
+    style: styled.title.style
+  }, title), onConfirm && /*#__PURE__*/React.createElement(Button, {
+    onClick: onConfirm
+  }, locale.confirm), closer)) : null;
+  /**
+   * @zh 底部操作区：分割线 + 操作按钮行。
+   * @en Footer actions: a divider above the actions row.
+   */
+  var footer = actions ? (/*#__PURE__*/React.createElement("div", {
+    className: stringify(classNames.actions, styled.actions.className),
+    style: styled.actions.style
+  }, /*#__PURE__*/React.createElement(Divider, {
+    margin: 0
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styled.actionsRow.className,
+    style: styled.actionsRow.style
+  }, actions))) : null;
+  /**
+   * @zh 标准类型：内嵌在布局中展示，无遮罩层，停靠边缘带分割线。
+   * @en Standard type: rendered inline in the layout, without a scrim,
+   * with a divider on the anchored edge.
+   */
+  if (type === "standard") {
+    if (!open) return null;
+    return /*#__PURE__*/React.createElement("div", {
+      className: stringify(classNames.sideSheet, className, styled.standard.className),
+      style: _objectSpread(_objectSpread(_objectSpread({}, styled.standard.style), themeColorVars), {}, {
+        "--size": typeof size === "number" ? "".concat(size, "px") : size
+      }, style)
+    }, header, /*#__PURE__*/React.createElement("div", {
+      className: stringify(classNames.content, styled.content.className),
+      style: styled.content.style
+    }, children), footer);
+  }
+  /**
+   * @zh 模态类型：基于共享的 Sheet 基础组件，带遮罩层和滑入动画。
+   * @en Modal type: built on the shared Sheet base component, with a scrim
+   * and slide animation.
+   */
+  return /*#__PURE__*/React.createElement(Sheet, {
+    visible: open,
+    placement: placement,
+    size: size,
+    closable: closable,
+    onClose: onClose,
+    className: classNames.sideSheet,
+    header: header,
+    footer: footer,
+    panelClassName: styled.panel.className,
+    panelStyle: _objectSpread(_objectSpread({}, themeColorVars), styled.panel.style)
+  }, children);
+};
+
+export { SideSheet as default };

package/dist/components/side-sheet/styles.cjs

@@ -0,0 +1,106 @@
+'use strict';
+
+var panel = {
+  "default": {
+    kWkggS: "musaex-1eai1fy",
+    kGO01o: "musaex-1oxn6w8",
+    $$css: true
+  }
+};
+var standard = {
+  "default": {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kzqmXN: "musaex-1fjlwjz",
+    kZKoxP: "musaex-qg7gut",
+    kmuXW: "musaex-2lah0s",
+    kWkggS: "musaex-k7eln3",
+    kGO01o: "musaex-1oxn6w8",
+    $$css: true
+  },
+  right: {
+    kZ1KPB: "musaex-6vwjc",
+    k4WBpm: "musaex-19ypqd9",
+    kaZRDh: "musaex-svd4c5",
+    $$css: true
+  },
+  left: {
+    kWqL5O: "musaex-a640vs",
+    kSWEuD: "musaex-32b0ac",
+    k26BEO: "musaex-imfbgf",
+    $$css: true
+  },
+  top: {
+    kt9PQ7: "musaex-d1xpcx",
+    kfdmCh: "musaex-1q0q8m5",
+    kL6WhQ: "musaex-quqrak",
+    $$css: true
+  },
+  bottom: {
+    kEafiO: "musaex-uvson1",
+    kPef9Z: "musaex-13fuv20",
+    kLZC3w: "musaex-6ogecl",
+    $$css: true
+  }
+};
+var header = {
+  "default": {
+    k1xSpc: "musaex-78zum5",
+    kGNEyG: "musaex-1cy8zhl",
+    kLKAdn: "musaex-h1u3e4",
+    kGO01o: "musaex-5ynjmo",
+    kwRFfy: "musaex-1max5gj",
+    $$css: true
+  },
+  withTitle: {
+    kZCmMZ: "musaex-150i2hq",
+    $$css: true
+  },
+  withBack: {
+    kZCmMZ: "musaex-1rl4tsp",
+    $$css: true
+  }
+};
+var content = {
+  "default": {
+    kUk6DE: "musaex-98rzlu",
+    kAzted: "musaex-2lwn1j",
+    kVQacm: "musaex-ysyzu8",
+    kZeWKH: "musaex-ish69e",
+    $$css: true
+  }
+};
+var title = {
+  "default": {
+    kUk6DE: "musaex-98rzlu",
+    k7Eaqz: "musaex-euugli",
+    kLKAdn: "musaex-h1u3e4",
+    kMwMTN: "musaex-bq1wot",
+    $$css: true
+  }
+};
+var actions = {
+  "default": {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    $$css: true
+  },
+  row: {
+    k1xSpc: "musaex-78zum5",
+    kGNEyG: "musaex-6s0dn4",
+    kOIVth: "musaex-1wm2zkp",
+    kLKAdn: "musaex-1oop6c3",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  }
+};
+var styles = {
+  panel: panel,
+  standard: standard,
+  header: header,
+  title: title,
+  content: content,
+  actions: actions
+};
+
+exports.styles = styles;