musae 1.3.1-beta.2 → 1.3.1-beta.21

package/dist/components/date-range-picker/date-range-picker.cjs

@@ -4,22 +4,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var styles = require('./styles.cjs');
 var React = require('react');
 var picker = require('../picker/picker.cjs');
 var useDateRangeState = require('./hooks/use-date-range-state.cjs');
 var calendar = require('../calendar/calendar.cjs');
 var useClassNames = require('../../hooks/use-class-names.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 context = require('./context.cjs');
+var input = require('../input/input.cjs');
 var swapHoriz = require('../icon/icons/action/swap-horiz.cjs');
 
 var _excluded = ["onChange"];
 var DateRangePicker = function DateRangePicker(_ref) {
   var onChange = _ref.onChange,
     props = _objectWithoutProperties(_ref, _excluded);
-  var pickerRef = React.useRef(null);
   var _useDateRangeState = useDateRangeState.useDateRangeState(props.value, {
-      pickerRef: pickerRef,
       onChange: onChange
     }),
     value = _useDateRangeState.value,
@@ -29,32 +30,44 @@ var DateRangePicker = function DateRangePicker(_ref) {
     from = _value[0],
     to = _value[1];
   var styled = {
-    picker: {
-      className: "musaex-98rzlu musaex-78zum5 musaex-1bu9cvf musaex-6s0dn4 musaex-38mpvf"
-    },
-    trigger: {
-      className: "musaex-1iyjqo2 musaex-s83m0k musaex-4y2jaj musaex-uxw1ft musaex-b3r6kr musaex-lyipyv musaex-1mao3ak"
-    }
+    picker: stylex.props(styles.default.picker),
+    trigger: stylex.props(styles.default.trigger)
   };
   return /*#__PURE__*/React.createElement(picker.default, {
-    ref: pickerRef,
-    pickable: /*#__PURE__*/React.createElement(calendar.default, {
-      value: value,
-      onClick: change
-    }),
+    pickable: function pickable(_ref2) {
+      var close = _ref2.close;
+      return /*#__PURE__*/React.createElement(calendar.default, {
+        value: value,
+        onClick: function onClick(value) {
+          change(value, close);
+        }
+      });
+    },
     popupWidth: false
-  }, /*#__PURE__*/React.createElement("div", {
-    className: className.stringify(classNames.picker, styled.picker.className),
-    style: styled.picker.style
-  }, /*#__PURE__*/React.createElement("span", {
-    className: className.stringify(classNames.input, styled.trigger.className),
-    style: styled.trigger.style
-  }, from === null || from === void 0 ? void 0 : from.format("YYYY-MM-DD")), /*#__PURE__*/React.createElement(swapHoriz.default, {
-    className: classNames.separator
-  }), /*#__PURE__*/React.createElement("span", {
-    className: className.stringify(classNames.input, styled.trigger.className),
-    style: styled.trigger.style
-  }, to === null || to === void 0 ? void 0 : to.format("YYYY-MM-DD"))));
+  }, function (_ref3) {
+    var _from$format;
+    var close = _ref3.close,
+      toggle = _ref3.toggle,
+      triggerRef = _ref3.triggerRef;
+    return /*#__PURE__*/React.createElement("div", {
+      className: className.stringify(classNames.picker, styled.picker.className),
+      style: styled.picker.style
+    }, /*#__PURE__*/React.createElement(input.default, {
+      ref: triggerRef,
+      className: className.stringify(classNames.input, styled.trigger.className),
+      style: styled.trigger.style,
+      value: (_from$format = from === null || from === void 0 ? void 0 : from.format("YYYY-MM-DD")) !== null && _from$format !== void 0 ? _from$format : "",
+      onBlur: close,
+      onClick: toggle,
+      readOnly: true,
+      trailing: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(swapHoriz.default, {
+        className: classNames.separator
+      }), /*#__PURE__*/React.createElement("span", {
+        className: className.stringify(classNames.input, styled.trigger.className),
+        style: styled.trigger.style
+      }, to === null || to === void 0 ? void 0 : to.format("YYYY-MM-DD")))
+    }));
+  });
 };
 
 exports.default = DateRangePicker;

package/dist/components/date-range-picker/date-range-picker.mjs

@@ -1,21 +1,22 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import React, { useRef } from 'react';
+import styles from './styles.mjs';
+import React from 'react';
 import Picker from '../picker/picker.mjs';
 import { useDateRangeState } from './hooks/use-date-range-state.mjs';
 import Calendar from '../calendar/calendar.mjs';
 import { useClassNames } from '../../hooks/use-class-names.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 { CLASS_NAMES } from './context.mjs';
+import Input from '../input/input.mjs';
 import IconSwapHoriz from '../icon/icons/action/swap-horiz.mjs';
 
 var _excluded = ["onChange"];
 var DateRangePicker = function DateRangePicker(_ref) {
   var onChange = _ref.onChange,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var pickerRef = useRef(null);
-  var _useDateRangeState = useDateRangeState(props.value, {
-      pickerRef: pickerRef,
+    props$1 = _objectWithoutProperties(_ref, _excluded);
+  var _useDateRangeState = useDateRangeState(props$1.value, {
       onChange: onChange
     }),
     value = _useDateRangeState.value,
@@ -25,32 +26,44 @@ var DateRangePicker = function DateRangePicker(_ref) {
     from = _value[0],
     to = _value[1];
   var styled = {
-    picker: {
-      className: "musaex-98rzlu musaex-78zum5 musaex-1bu9cvf musaex-6s0dn4 musaex-38mpvf"
-    },
-    trigger: {
-      className: "musaex-1iyjqo2 musaex-s83m0k musaex-4y2jaj musaex-uxw1ft musaex-b3r6kr musaex-lyipyv musaex-1mao3ak"
-    }
+    picker: props(styles.picker),
+    trigger: props(styles.trigger)
   };
   return /*#__PURE__*/React.createElement(Picker, {
-    ref: pickerRef,
-    pickable: /*#__PURE__*/React.createElement(Calendar, {
-      value: value,
-      onClick: change
-    }),
+    pickable: function pickable(_ref2) {
+      var close = _ref2.close;
+      return /*#__PURE__*/React.createElement(Calendar, {
+        value: value,
+        onClick: function onClick(value) {
+          change(value, close);
+        }
+      });
+    },
     popupWidth: false
-  }, /*#__PURE__*/React.createElement("div", {
-    className: stringify(classNames.picker, styled.picker.className),
-    style: styled.picker.style
-  }, /*#__PURE__*/React.createElement("span", {
-    className: stringify(classNames.input, styled.trigger.className),
-    style: styled.trigger.style
-  }, from === null || from === void 0 ? void 0 : from.format("YYYY-MM-DD")), /*#__PURE__*/React.createElement(IconSwapHoriz, {
-    className: classNames.separator
-  }), /*#__PURE__*/React.createElement("span", {
-    className: stringify(classNames.input, styled.trigger.className),
-    style: styled.trigger.style
-  }, to === null || to === void 0 ? void 0 : to.format("YYYY-MM-DD"))));
+  }, function (_ref3) {
+    var _from$format;
+    var close = _ref3.close,
+      toggle = _ref3.toggle,
+      triggerRef = _ref3.triggerRef;
+    return /*#__PURE__*/React.createElement("div", {
+      className: stringify(classNames.picker, styled.picker.className),
+      style: styled.picker.style
+    }, /*#__PURE__*/React.createElement(Input, {
+      ref: triggerRef,
+      className: stringify(classNames.input, styled.trigger.className),
+      style: styled.trigger.style,
+      value: (_from$format = from === null || from === void 0 ? void 0 : from.format("YYYY-MM-DD")) !== null && _from$format !== void 0 ? _from$format : "",
+      onBlur: close,
+      onClick: toggle,
+      readOnly: true,
+      trailing: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconSwapHoriz, {
+        className: classNames.separator
+      }), /*#__PURE__*/React.createElement("span", {
+        className: stringify(classNames.input, styled.trigger.className),
+        style: styled.trigger.style
+      }, to === null || to === void 0 ? void 0 : to.format("YYYY-MM-DD")))
+    }));
+  });
 };
 
 export { DateRangePicker as default };

package/dist/components/date-range-picker/hooks/use-date-range-state.cjs

@@ -4,19 +4,19 @@ var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var relax = require('@aiszlab/relax');
 
 /**
- * @description component state
+ * @zh 管理日期范围选择状态
+ * @en Manage the date range selection state
  */
 var useDateRangeState = function useDateRangeState(controlledState, _ref) {
-  var pickerRef = _ref.pickerRef,
-    onChange = _ref.onChange;
+  var onChange = _ref.onChange;
   var _useControlledState = relax.useControlledState(controlledState, {
       defaultState: [void 0, void 0]
     }),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     value = _useControlledState2[0],
     setValue = _useControlledState2[1];
-  var change = relax.useEvent(function (_value) {
-    var _value$filter$length, _value$filter, _pickerRef$current;
+  var change = relax.useEvent(function (_value, close) {
+    var _value$filter$length, _value$filter;
     // click first time
     if (new Set([0, 2]).has((_value$filter$length = (_value$filter = value.filter(function (_value) {
       return !!_value;
@@ -28,7 +28,7 @@ var useDateRangeState = function useDateRangeState(controlledState, _ref) {
     var _range = [value[0], _value];
     setValue(_range);
     onChange === null || onChange === void 0 || onChange(_range);
-    (_pickerRef$current = pickerRef.current) === null || _pickerRef$current === void 0 || _pickerRef$current.close();
+    close();
   });
   return {
     value: value,

package/dist/components/date-range-picker/hooks/use-date-range-state.d.ts

@@ -1,17 +1,14 @@
 import { type Dayjs } from "dayjs";
-import { RefObject } from "react";
-import { PickerRef } from "../../../types/picker";
-import { DateRangePickerProps } from "../../../types/date-range-picker";
-import { Nullable } from "@aiszlab/relax/types";
+import type { DateRangePickerProps } from "../../../types/date-range-picker";
 interface Props {
     onChange?: (value: [Dayjs, Dayjs]) => void;
-    pickerRef: RefObject<Nullable<PickerRef>>;
 }
 /**
- * @description component state
+ * @zh 管理日期范围选择状态
+ * @en Manage the date range selection state
  */
-export declare const useDateRangeState: (controlledState: DateRangePickerProps["value"], { pickerRef, onChange }: Props) => {
+export declare const useDateRangeState: (controlledState: DateRangePickerProps["value"], { onChange }: Props) => {
     value: [import("@aiszlab/relax/types").Partialable<Dayjs>, import("@aiszlab/relax/types").Partialable<Dayjs>];
-    change: (_value: Dayjs) => void;
+    change: (_value: Dayjs, close: VoidFunction) => void;
 };
 export {};

package/dist/components/date-range-picker/hooks/use-date-range-state.mjs

@@ -2,19 +2,19 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { useControlledState, useEvent } from '@aiszlab/relax';
 
 /**
- * @description component state
+ * @zh 管理日期范围选择状态
+ * @en Manage the date range selection state
  */
 var useDateRangeState = function useDateRangeState(controlledState, _ref) {
-  var pickerRef = _ref.pickerRef,
-    onChange = _ref.onChange;
+  var onChange = _ref.onChange;
   var _useControlledState = useControlledState(controlledState, {
       defaultState: [void 0, void 0]
     }),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     value = _useControlledState2[0],
     setValue = _useControlledState2[1];
-  var change = useEvent(function (_value) {
-    var _value$filter$length, _value$filter, _pickerRef$current;
+  var change = useEvent(function (_value, close) {
+    var _value$filter$length, _value$filter;
     // click first time
     if (new Set([0, 2]).has((_value$filter$length = (_value$filter = value.filter(function (_value) {
       return !!_value;
@@ -26,7 +26,7 @@ var useDateRangeState = function useDateRangeState(controlledState, _ref) {
     var _range = [value[0], _value];
     setValue(_range);
     onChange === null || onChange === void 0 || onChange(_range);
-    (_pickerRef$current = pickerRef.current) === null || _pickerRef$current === void 0 || _pickerRef$current.close();
+    close();
   });
   return {
     value: value,

package/dist/components/date-range-picker/styles.cjs

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {
+  picker: {
+    kUk6DE: "musaex-98rzlu",
+    k1xSpc: "musaex-78zum5",
+    k1C7PZ: "musaex-1bu9cvf",
+    kGNEyG: "musaex-6s0dn4",
+    ks0D6T: "musaex-38mpvf",
+    $$css: true
+  },
+  trigger: {
+    kzQI83: "musaex-1iyjqo2",
+    kmuXW: "musaex-s83m0k",
+    kCS8Yb: "musaex-4y2jaj",
+    khDVqt: "musaex-uxw1ft",
+    kVQacm: "musaex-b3r6kr",
+    kg5iWk: "musaex-lyipyv",
+    k7Eaqz: "musaex-1mao3ak",
+    $$css: true
+  }
+};
+
+exports.default = styles;

package/dist/components/date-range-picker/styles.d.ts

@@ -0,0 +1,19 @@
+declare const styles: Readonly<{
+    readonly picker: Readonly<{
+        readonly flex: import("@stylexjs/stylex").StyleXClassNameFor<"flex", 1>;
+        readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+        readonly columnGap: import("@stylexjs/stylex").StyleXClassNameFor<"columnGap", string>;
+        readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+        readonly maxWidth: import("@stylexjs/stylex").StyleXClassNameFor<"maxWidth", string>;
+    }>;
+    readonly trigger: Readonly<{
+        readonly flexGrow: import("@stylexjs/stylex").StyleXClassNameFor<"flexGrow", 1>;
+        readonly flexShrink: import("@stylexjs/stylex").StyleXClassNameFor<"flexShrink", 1>;
+        readonly flexBasis: import("@stylexjs/stylex").StyleXClassNameFor<"flexBasis", "fit-content">;
+        readonly whiteSpace: import("@stylexjs/stylex").StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "hidden">;
+        readonly textOverflow: import("@stylexjs/stylex").StyleXClassNameFor<"textOverflow", "ellipsis">;
+        readonly minWidth: import("@stylexjs/stylex").StyleXClassNameFor<"minWidth", string>;
+    }>;
+}>;
+export default styles;

package/dist/components/date-range-picker/styles.mjs

@@ -0,0 +1,22 @@
+var styles = {
+  picker: {
+    kUk6DE: "musaex-98rzlu",
+    k1xSpc: "musaex-78zum5",
+    k1C7PZ: "musaex-1bu9cvf",
+    kGNEyG: "musaex-6s0dn4",
+    ks0D6T: "musaex-38mpvf",
+    $$css: true
+  },
+  trigger: {
+    kzQI83: "musaex-1iyjqo2",
+    kmuXW: "musaex-s83m0k",
+    kCS8Yb: "musaex-4y2jaj",
+    khDVqt: "musaex-uxw1ft",
+    kVQacm: "musaex-b3r6kr",
+    kg5iWk: "musaex-lyipyv",
+    k7Eaqz: "musaex-1mao3ak",
+    $$css: true
+  }
+};
+
+export { styles as default };

package/dist/components/dialog/popup.cjs

@@ -6,6 +6,7 @@ var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _regenerator = require('@babel/runtime/helpers/regenerator');
 var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var styles = require('./styles.cjs');
 var React = require('react');
 var hooks$1 = require('./hooks.cjs');
 var react = require('motion/react');
@@ -20,19 +21,6 @@ var relax = require('@aiszlab/relax');
 var theme = require('../theme/theme.cjs');
 
 var _excluded = ["onClose", "open", "closable", "onClosed", "className", "onConfirm", "confirm", "cancel"];
-var styles = {
-  header: {
-    kg3NbH: "musaex-1pyhihf",
-    $$css: true
-  },
-  body: {
-    kUk6DE: "musaex-98rzlu",
-    kTgw9: "musaex-13faqbe",
-    kVQacm: "musaex-ysyzu8",
-    kg3NbH: "musaex-1pyhihf",
-    $$css: true
-  }
-};
 var Popup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _props$styles, _props$styles2;
   var onClose = _ref.onClose,
@@ -114,20 +102,12 @@ var Popup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 || _containerRef$current.focus();
   }, [open]);
   var styled = {
-    popup: {
-      className: "musaex-ixxii4 musaex-13vifvy musaex-u96u03 musaex-n9wirt musaex-1dr59a3 musaex-47corl musaex-p1v8q3 musaex-78zum5 musaex-l56j7k musaex-6s0dn4"
-    },
-    overlay: {
-      className: "musaex-10l6tqk musaex-13vifvy musaex-u96u03 musaex-n9wirt musaex-1dr59a3 musaex-67bb7w musaex-11we2rp musaex-g01cxk"
-    },
-    panel: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-g4b44g musaex-15cq3s0 musaex-19nmtej musaex-bwpcu0 musaex-m9kfsm musaex-67bb7w musaex-9nqi4b musaex-g01cxk musaex-1n2onr6 musaex-g98ter"
-    },
-    header: stylex.props(theme.$headline.small, styles.header),
-    body: stylex.props(theme.$body.medium, styles.body),
-    footer: {
-      className: "musaex-1eodh35 musaex-78zum5 musaex-dt5ytf musaex-uk3077 musaex-1pyhihf"
-    }
+    popup: stylex.props(styles.default.popup),
+    overlay: stylex.props(styles.default.overlay),
+    panel: stylex.props(styles.default.panel),
+    header: stylex.props(theme.$headline.small, styles.default.header),
+    body: stylex.props(theme.$body.medium, styles.default.body),
+    footer: stylex.props(styles.default.footer)
   };
   return /*#__PURE__*/React.createElement("div", {
     ref: composedRef,

package/dist/components/dialog/popup.mjs

@@ -2,6 +2,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _regenerator from '@babel/runtime/helpers/regenerator';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import styles from './styles.mjs';
 import React, { forwardRef, useRef, useEffect } from 'react';
 import { useFooter } from './hooks.mjs';
 import { animate } from 'motion/react';
@@ -16,19 +17,6 @@ import { useComposedRef, useAsyncEffect } from '@aiszlab/relax';
 import { $body, $headline } from '../theme/theme.mjs';
 
 var _excluded = ["onClose", "open", "closable", "onClosed", "className", "onConfirm", "confirm", "cancel"];
-var styles = {
-  header: {
-    kg3NbH: "musaex-1pyhihf",
-    $$css: true
-  },
-  body: {
-    kUk6DE: "musaex-98rzlu",
-    kTgw9: "musaex-13faqbe",
-    kVQacm: "musaex-ysyzu8",
-    kg3NbH: "musaex-1pyhihf",
-    $$css: true
-  }
-};
 var Popup = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _props$styles, _props$styles2;
   var onClose = _ref.onClose,
@@ -110,20 +98,12 @@ var Popup = /*#__PURE__*/forwardRef(function (_ref, ref) {
     (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 || _containerRef$current.focus();
   }, [open]);
   var styled = {
-    popup: {
-      className: "musaex-ixxii4 musaex-13vifvy musaex-u96u03 musaex-n9wirt musaex-1dr59a3 musaex-47corl musaex-p1v8q3 musaex-78zum5 musaex-l56j7k musaex-6s0dn4"
-    },
-    overlay: {
-      className: "musaex-10l6tqk musaex-13vifvy musaex-u96u03 musaex-n9wirt musaex-1dr59a3 musaex-67bb7w musaex-11we2rp musaex-g01cxk"
-    },
-    panel: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-g4b44g musaex-15cq3s0 musaex-19nmtej musaex-bwpcu0 musaex-m9kfsm musaex-67bb7w musaex-9nqi4b musaex-g01cxk musaex-1n2onr6 musaex-g98ter"
-    },
+    popup: props(styles.popup),
+    overlay: props(styles.overlay),
+    panel: props(styles.panel),
     header: props($headline.small, styles.header),
     body: props($body.medium, styles.body),
-    footer: {
-      className: "musaex-1eodh35 musaex-78zum5 musaex-dt5ytf musaex-uk3077 musaex-1pyhihf"
-    }
+    footer: props(styles.footer)
   };
   return /*#__PURE__*/React.createElement("div", {
     ref: composedRef,

package/dist/components/dialog/styles.cjs

@@ -0,0 +1,66 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {
+  popup: {
+    kVAEAm: "musaex-ixxii4",
+    k87sOh: "musaex-13vifvy",
+    kbCHJM: "musaex-u96u03",
+    kzqmXN: "musaex-n9wirt",
+    kZKoxP: "musaex-1dr59a3",
+    kfzvcC: "musaex-47corl",
+    kY2c9j: "musaex-p1v8q3",
+    k1xSpc: "musaex-78zum5",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  },
+  overlay: {
+    kVAEAm: "musaex-10l6tqk",
+    k87sOh: "musaex-13vifvy",
+    kbCHJM: "musaex-u96u03",
+    kzqmXN: "musaex-n9wirt",
+    kZKoxP: "musaex-1dr59a3",
+    kfzvcC: "musaex-67bb7w",
+    kWkggS: "musaex-11we2rp",
+    kSiTet: "musaex-g01cxk",
+    $$css: true
+  },
+  panel: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-g4b44g",
+    k7Eaqz: "musaex-15cq3s0",
+    kskxy: "musaex-19nmtej",
+    kogj98: "musaex-bwpcu0",
+    kaIpWk: "musaex-m9kfsm",
+    kfzvcC: "musaex-67bb7w",
+    kWkggS: "musaex-9nqi4b",
+    kSiTet: "musaex-g01cxk",
+    kVAEAm: "musaex-1n2onr6",
+    k8WAf4: "musaex-g98ter",
+    $$css: true
+  },
+  header: {
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  },
+  body: {
+    kUk6DE: "musaex-98rzlu",
+    kTgw9: "musaex-13faqbe",
+    kVQacm: "musaex-ysyzu8",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  },
+  footer: {
+    keoZOQ: "musaex-1eodh35",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kGNEyG: "musaex-uk3077",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  }
+};
+
+exports.default = styles;

package/dist/components/dialog/styles.d.ts

@@ -0,0 +1,55 @@
+declare const styles: Readonly<{
+    readonly popup: Readonly<{
+        readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "fixed">;
+        readonly top: import("@stylexjs/stylex").StyleXClassNameFor<"top", 0>;
+        readonly left: import("@stylexjs/stylex").StyleXClassNameFor<"left", 0>;
+        readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", "100vw">;
+        readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "100vh">;
+        readonly pointerEvents: import("@stylexjs/stylex").StyleXClassNameFor<"pointerEvents", "none">;
+        readonly zIndex: import("@stylexjs/stylex").StyleXClassNameFor<"zIndex", string>;
+        readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+        readonly justifyContent: import("@stylexjs/stylex").StyleXClassNameFor<"justifyContent", "center">;
+        readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+    }>;
+    readonly overlay: Readonly<{
+        readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "absolute">;
+        readonly top: import("@stylexjs/stylex").StyleXClassNameFor<"top", 0>;
+        readonly left: import("@stylexjs/stylex").StyleXClassNameFor<"left", 0>;
+        readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", "100vw">;
+        readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "100vh">;
+        readonly pointerEvents: import("@stylexjs/stylex").StyleXClassNameFor<"pointerEvents", "auto">;
+        readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface-dim)">;
+        readonly opacity: import("@stylexjs/stylex").StyleXClassNameFor<"opacity", 0>;
+    }>;
+    readonly panel: Readonly<{
+        readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "column">;
+        readonly gap: import("@stylexjs/stylex").StyleXClassNameFor<"gap", string>;
+        readonly minWidth: import("@stylexjs/stylex").StyleXClassNameFor<"minWidth", 480>;
+        readonly maxHeight: import("@stylexjs/stylex").StyleXClassNameFor<"maxHeight", `calc(100% - ${import("@stylexjs/stylex").StyleXVar<string>} * 2)`>;
+        readonly margin: import("@stylexjs/stylex").StyleXClassNameFor<"margin", string>;
+        readonly borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
+        readonly pointerEvents: import("@stylexjs/stylex").StyleXClassNameFor<"pointerEvents", "auto">;
+        readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface-container-lowest)">;
+        readonly opacity: import("@stylexjs/stylex").StyleXClassNameFor<"opacity", 0>;
+        readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "relative">;
+        readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+    }>;
+    readonly header: Readonly<{
+        readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+    }>;
+    readonly body: Readonly<{
+        readonly flex: import("@stylexjs/stylex").StyleXClassNameFor<"flex", 1>;
+        readonly wordBreak: import("@stylexjs/stylex").StyleXClassNameFor<"wordBreak", "break-word">;
+        readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "auto">;
+        readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+    }>;
+    readonly footer: Readonly<{
+        readonly marginBlockStart: import("@stylexjs/stylex").StyleXClassNameFor<"marginBlockStart", string>;
+        readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "column">;
+        readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "flex-end">;
+        readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+    }>;
+}>;
+export default styles;

package/dist/components/dialog/styles.mjs

@@ -0,0 +1,62 @@
+var styles = {
+  popup: {
+    kVAEAm: "musaex-ixxii4",
+    k87sOh: "musaex-13vifvy",
+    kbCHJM: "musaex-u96u03",
+    kzqmXN: "musaex-n9wirt",
+    kZKoxP: "musaex-1dr59a3",
+    kfzvcC: "musaex-47corl",
+    kY2c9j: "musaex-p1v8q3",
+    k1xSpc: "musaex-78zum5",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  },
+  overlay: {
+    kVAEAm: "musaex-10l6tqk",
+    k87sOh: "musaex-13vifvy",
+    kbCHJM: "musaex-u96u03",
+    kzqmXN: "musaex-n9wirt",
+    kZKoxP: "musaex-1dr59a3",
+    kfzvcC: "musaex-67bb7w",
+    kWkggS: "musaex-11we2rp",
+    kSiTet: "musaex-g01cxk",
+    $$css: true
+  },
+  panel: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-g4b44g",
+    k7Eaqz: "musaex-15cq3s0",
+    kskxy: "musaex-19nmtej",
+    kogj98: "musaex-bwpcu0",
+    kaIpWk: "musaex-m9kfsm",
+    kfzvcC: "musaex-67bb7w",
+    kWkggS: "musaex-9nqi4b",
+    kSiTet: "musaex-g01cxk",
+    kVAEAm: "musaex-1n2onr6",
+    k8WAf4: "musaex-g98ter",
+    $$css: true
+  },
+  header: {
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  },
+  body: {
+    kUk6DE: "musaex-98rzlu",
+    kTgw9: "musaex-13faqbe",
+    kVQacm: "musaex-ysyzu8",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  },
+  footer: {
+    keoZOQ: "musaex-1eodh35",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kGNEyG: "musaex-uk3077",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  }
+};
+
+export { styles as default };