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

package/dist/components/cascader/cascader.mjs

@@ -1,14 +1,17 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import React, { useRef, useCallback, useMemo } from 'react';
+import styles from './styles.mjs';
+import React, { useMemo } from 'react';
 import Picker from '../picker/picker.mjs';
 import Tag from '../tag/tag.mjs';
 import { useOptions, useValue } from './hooks.mjs';
 import Menu from '../menu/menu.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';
 
 var _excluded = ["mode", "separator", "options"];
 var Cascader = function Cascader(_ref) {
@@ -17,12 +20,7 @@ var Cascader = function Cascader(_ref) {
     separator = _ref$separator === void 0 ? "/" : _ref$separator,
     _ref$options = _ref.options,
     options = _ref$options === void 0 ? [] : _ref$options,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var ref = useRef(null);
-  var close = useCallback(function () {
-    var _ref$current;
-    return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.close();
-  }, []);
+    props$1 = _objectWithoutProperties(_ref, _excluded);
   var classNames = useClassNames(CLASS_NAMES);
   var _useOptions = useOptions([options]),
     readableOptions = _useOptions.readableOptions,
@@ -30,7 +28,7 @@ var Cascader = function Cascader(_ref) {
     additionalMenusItems = _useOptions.additionalMenusItems,
     presetedMenuItems = _useOptions.presetedMenuItems,
     setAdditionalMenusItems = _useOptions.setAdditionalMenusItems;
-  var _useValue = useValue([props.value, readableOptions, readablePaths, mode, close, setAdditionalMenusItems]),
+  var _useValue = useValue([props$1.value, readableOptions, readablePaths, mode, setAdditionalMenusItems]),
     values = _useValue.values,
     onChange = _useValue.onChange;
   // inputde value
@@ -55,28 +53,40 @@ var Cascader = function Cascader(_ref) {
       return label;
     }).join(" ".concat(separator, " "));
   }, [mode, values, separator]);
-  // options render
-  var menus = useMemo(function () {
-    var styled = {
-      className: "musaex-78zum5 musaex-5xj0sk musaex-15o2aup"
-    };
-    return /*#__PURE__*/React.createElement("div", {
-      className: stringify(classNames.options, styled.className),
-      style: styled.style
-    }, [presetedMenuItems].concat(_toConsumableArray(additionalMenusItems)).map(function (menuItems, index) {
-      return /*#__PURE__*/React.createElement(Menu, {
-        items: menuItems,
-        key: index,
-        onClick: onChange
-      });
-    }));
-  }, [additionalMenusItems, classNames, onChange, presetedMenuItems]);
+  var styled = {
+    options: props(styles.options)
+  };
   return /*#__PURE__*/React.createElement(Picker, {
-    ref: ref,
-    pickable: menus,
-    className: classNames.cascader,
+    pickable: function pickable(_ref5) {
+      var close = _ref5.close;
+      return /*#__PURE__*/React.createElement("div", {
+        className: stringify(classNames.options, styled.options.className),
+        style: styled.options.style
+      }, [presetedMenuItems].concat(_toConsumableArray(additionalMenusItems)).map(function (menuItems, index) {
+        return /*#__PURE__*/React.createElement(Menu, {
+          items: menuItems,
+          key: index,
+          onClick: function onClick(id) {
+            onChange(id, close);
+          }
+        });
+      }));
+    },
     popupWidth: false
-  }, inputed);
+  }, function (_ref6) {
+    var close = _ref6.close,
+      toggle = _ref6.toggle,
+      triggerRef = _ref6.triggerRef;
+    return /*#__PURE__*/React.createElement(Input, {
+      ref: triggerRef,
+      className: classNames.cascader,
+      value: typeof inputed === "string" ? inputed : "",
+      leading: mode === "multiple" ? inputed : undefined,
+      onBlur: close,
+      onClick: toggle,
+      readOnly: true
+    });
+  });
 };
 
 export { Cascader as default };

package/dist/components/cascader/hooks.cjs

@@ -7,17 +7,16 @@ var relax = require('@aiszlab/relax');
 var utils = require('./utils.cjs');
 
 /**
- * @description
- * cascader value
+ * @zh 管理级联选择值
+ * @en Manage cascader values
  */
 var useValue = function useValue(_ref) {
-  var _ref2 = _slicedToArray(_ref, 6),
+  var _ref2 = _slicedToArray(_ref, 5),
     valueInProps = _ref2[0],
     readableOptions = _ref2[1],
     readablePaths = _ref2[2],
     mode = _ref2[3],
-    close = _ref2[4],
-    setAdditionalMenusItems = _ref2[5];
+    setAdditionalMenusItems = _ref2[4];
   var _useControlledState = relax.useControlledState(valueInProps),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     _value = _useControlledState2[0],
@@ -49,7 +48,7 @@ var useValue = function useValue(_ref) {
     }, new Map());
   }, [_value, readableOptions]);
   // change handler
-  var onChange = React.useCallback(function (id) {
+  var onChange = React.useCallback(function (id, close) {
     // on menu click, when menu has children, add submenu
     // when menu has no children, just change value and close dropdown
     var _paths = readablePaths.get(id);
@@ -90,15 +89,15 @@ var useValue = function useValue(_ref) {
     // else add current values
     var isRemoved = values.has(id) && values["delete"](id);
     setValue([].concat(_toConsumableArray(_toConsumableArray(values.values()).map(utils.toKeys)), _toConsumableArray(isRemoved ? [] : [_values])));
-  }, [readablePaths, readableOptions, mode, values, setValue, setAdditionalMenusItems, close]);
+  }, [readablePaths, readableOptions, mode, values, setValue, setAdditionalMenusItems]);
   return {
     values: values,
     onChange: onChange
   };
 };
 /**
- * @description
- * options
+ * @zh 读取级联选择选项
+ * @en Read cascader options
  */
 var useOptions = function useOptions(_ref3) {
   var _ref4 = _slicedToArray(_ref3, 1),

package/dist/components/cascader/hooks.d.ts

@@ -3,16 +3,16 @@ import type { MenuItem } from "../../types/menu";
 import type { CascaderProps, Optionable, ReadableOptions, ReadablePaths } from "../../types/cascader";
 import type { Option } from "../../types/option";
 /**
- * @description
- * cascader value
+ * @zh 管理级联选择值
+ * @en Manage cascader values
  */
-export declare const useValue: ([valueInProps, readableOptions, readablePaths, mode, close, setAdditionalMenusItems,]: [CascaderProps["value"], ReadableOptions, ReadablePaths, CascaderProps["mode"], close: VoidFunction, Dispatch<SetStateAction<MenuItem[][]>>]) => {
+export declare const useValue: ([valueInProps, readableOptions, readablePaths, mode, setAdditionalMenusItems,]: [CascaderProps["value"], ReadableOptions, ReadablePaths, CascaderProps["mode"], Dispatch<SetStateAction<MenuItem[][]>>]) => {
     values: Map<number, Optionable[]>;
-    onChange: (id: number) => void;
+    onChange: (id: number, close: VoidFunction) => void;
 };
 /**
- * @description
- * options
+ * @zh 读取级联选择选项
+ * @en Read cascader options
  */
 export declare const useOptions: ([options]: [options: Option[]]) => {
     presetedMenuItems: MenuItem[];

package/dist/components/cascader/hooks.mjs

@@ -5,17 +5,16 @@ import { useControlledState } from '@aiszlab/relax';
 import { readOptions as _readOptions3, toMenuItem, toValues, toKey, toKeys } from './utils.mjs';
 
 /**
- * @description
- * cascader value
+ * @zh 管理级联选择值
+ * @en Manage cascader values
  */
 var useValue = function useValue(_ref) {
-  var _ref2 = _slicedToArray(_ref, 6),
+  var _ref2 = _slicedToArray(_ref, 5),
     valueInProps = _ref2[0],
     readableOptions = _ref2[1],
     readablePaths = _ref2[2],
     mode = _ref2[3],
-    close = _ref2[4],
-    setAdditionalMenusItems = _ref2[5];
+    setAdditionalMenusItems = _ref2[4];
   var _useControlledState = useControlledState(valueInProps),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     _value = _useControlledState2[0],
@@ -47,7 +46,7 @@ var useValue = function useValue(_ref) {
     }, new Map());
   }, [_value, readableOptions]);
   // change handler
-  var onChange = useCallback(function (id) {
+  var onChange = useCallback(function (id, close) {
     // on menu click, when menu has children, add submenu
     // when menu has no children, just change value and close dropdown
     var _paths = readablePaths.get(id);
@@ -88,15 +87,15 @@ var useValue = function useValue(_ref) {
     // else add current values
     var isRemoved = values.has(id) && values["delete"](id);
     setValue([].concat(_toConsumableArray(_toConsumableArray(values.values()).map(toKeys)), _toConsumableArray(isRemoved ? [] : [_values])));
-  }, [readablePaths, readableOptions, mode, values, setValue, setAdditionalMenusItems, close]);
+  }, [readablePaths, readableOptions, mode, values, setValue, setAdditionalMenusItems]);
   return {
     values: values,
     onChange: onChange
   };
 };
 /**
- * @description
- * options
+ * @zh 读取级联选择选项
+ * @en Read cascader options
  */
 var useOptions = function useOptions(_ref3) {
   var _ref4 = _slicedToArray(_ref3, 1),

package/dist/components/cascader/styles.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {
+  options: {
+    k1xSpc: "musaex-78zum5",
+    k1C7PZ: "musaex-5xj0sk",
+    kUOVxO: "musaex-15o2aup",
+    $$css: true
+  }
+};
+
+exports.default = styles;

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

@@ -0,0 +1,8 @@
+declare const styles: Readonly<{
+    readonly options: Readonly<{
+        readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+        readonly columnGap: import("@stylexjs/stylex").StyleXClassNameFor<"columnGap", string>;
+        readonly marginInline: import("@stylexjs/stylex").StyleXClassNameFor<"marginInline", string>;
+    }>;
+}>;
+export default styles;

package/dist/components/cascader/styles.mjs

@@ -0,0 +1,10 @@
+var styles = {
+  options: {
+    k1xSpc: "musaex-78zum5",
+    k1C7PZ: "musaex-5xj0sk",
+    kUOVxO: "musaex-15o2aup",
+    $$css: true
+  }
+};
+
+export { styles as default };

package/dist/components/chat/chat.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var styles = require('./styles.cjs');
 var React = require('react');
 var textarea = require('../textarea/textarea.cjs');
 var relax = require('@aiszlab/relax');
@@ -16,14 +17,6 @@ var iconButton = require('../icon-button/icon-button.cjs');
 var theme = require('../theme/theme.cjs');
 var rocketLaunch = require('../icon/icons/action/rocket-launch.cjs');
 
-var styles = {
-  chat: {
-    k1xSpc: "musaex-78zum5",
-    kXwgrk: "musaex-dt5ytf",
-    kOIVth: "musaex-1a0l1y6",
-    $$css: true
-  }
-};
 var Chat = function Chat(_ref) {
   var onMessage = _ref.onMessage,
     className$1 = _ref.className,
@@ -65,13 +58,9 @@ var Chat = function Chat(_ref) {
     });
   }, [id, message]);
   var styled = {
-    chat: stylex.props(styles.chat, theme.$body.medium),
-    messages: {
-      className: "musaex-98rzlu musaex-17p8e4n musaex-78zum5 musaex-dt5ytf musaex-1a0l1y6 musaex-ysyzu8"
-    },
-    footer: {
-      className: "musaex-17p8e4n musaex-78zum5 musaex-1q0g3np musaex-1a0l1y6"
-    }
+    chat: stylex.props(styles.default.chat.base, theme.$body.medium),
+    messages: stylex.props(styles.default.chat.messages),
+    footer: stylex.props(styles.default.chat.footer)
   };
   var messages = React.useMemo(function () {
     return Array.from(items.entries());

package/dist/components/chat/chat.mjs

@@ -1,5 +1,6 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
 import React, { useState, useCallback, useMemo } from 'react';
 import Textarea from '../textarea/textarea.mjs';
 import { useIdentity } from '@aiszlab/relax';
@@ -12,14 +13,6 @@ import IconButton from '../icon-button/icon-button.mjs';
 import { $body } from '../theme/theme.mjs';
 import IconRocketLaunch from '../icon/icons/action/rocket-launch.mjs';
 
-var styles = {
-  chat: {
-    k1xSpc: "musaex-78zum5",
-    kXwgrk: "musaex-dt5ytf",
-    kOIVth: "musaex-1a0l1y6",
-    $$css: true
-  }
-};
 var Chat = function Chat(_ref) {
   var onMessage = _ref.onMessage,
     className = _ref.className,
@@ -61,13 +54,9 @@ var Chat = function Chat(_ref) {
     });
   }, [id, message]);
   var styled = {
-    chat: props(styles.chat, $body.medium),
-    messages: {
-      className: "musaex-98rzlu musaex-17p8e4n musaex-78zum5 musaex-dt5ytf musaex-1a0l1y6 musaex-ysyzu8"
-    },
-    footer: {
-      className: "musaex-17p8e4n musaex-78zum5 musaex-1q0g3np musaex-1a0l1y6"
-    }
+    chat: props(styles.chat.base, $body.medium),
+    messages: props(styles.chat.messages),
+    footer: props(styles.chat.footer)
   };
   var messages = useMemo(function () {
     return Array.from(items.entries());

package/dist/components/chat/item.cjs

@@ -4,9 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var styles = require('./styles.cjs');
 var relax = require('@aiszlab/relax');
 var React = require('react');
 var context = require('./context.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 useThemeColorVars = require('../../hooks/use-theme-color-vars.cjs');
 
@@ -57,20 +59,9 @@ var Item = function Item(_ref) {
     });
   });
   var styled = {
-    item: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-1a0l1y6"
-    },
-    send: {
-      className: "musaex-pvyfi4 musaex-eq5yr9 musaex-1v4gb6w musaex-a0rzc7 musaex-1mu49yl musaex-1j14bxn musaex-m9kfsm"
-    },
-    receive: {
-      0: {
-        className: "musaex-qcrz7y musaex-1v4gb6w musaex-a0rzc7 musaex-17o6occ musaex-1j14bxn musaex-m9kfsm"
-      },
-      1: {
-        className: "musaex-qcrz7y musaex-1v4gb6w musaex-a0rzc7 musaex-17o6occ musaex-1j14bxn musaex-m9kfsm musaex-4s63nf musaex-1ok1ou musaex-mlyeqh musaex-15y3wy1 musaex-13ee8us"
-      }
-    }[!!(status === "loading") << 0]
+    item: stylex.props(styles.default.item.base),
+    send: stylex.props(styles.default.item.send),
+    receive: stylex.props(styles.default.item.receive, status === "loading" && styles.default.item.receiving)
   };
   return /*#__PURE__*/React.createElement("div", {
     className: className.stringify(classNames.item, styled.item.className),

package/dist/components/chat/item.mjs

@@ -1,8 +1,10 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
 import { useEvent, useMounted } from '@aiszlab/relax';
 import React, { useState, useContext } from 'react';
 import { Context } from './context.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 { useThemeColorVars } from '../../hooks/use-theme-color-vars.mjs';
 
@@ -53,20 +55,9 @@ var Item = function Item(_ref) {
     });
   });
   var styled = {
-    item: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-1a0l1y6"
-    },
-    send: {
-      className: "musaex-pvyfi4 musaex-eq5yr9 musaex-1v4gb6w musaex-a0rzc7 musaex-1mu49yl musaex-1j14bxn musaex-m9kfsm"
-    },
-    receive: {
-      0: {
-        className: "musaex-qcrz7y musaex-1v4gb6w musaex-a0rzc7 musaex-17o6occ musaex-1j14bxn musaex-m9kfsm"
-      },
-      1: {
-        className: "musaex-qcrz7y musaex-1v4gb6w musaex-a0rzc7 musaex-17o6occ musaex-1j14bxn musaex-m9kfsm musaex-4s63nf musaex-1ok1ou musaex-mlyeqh musaex-15y3wy1 musaex-13ee8us"
-      }
-    }[!!(status === "loading") << 0]
+    item: props(styles.item.base),
+    send: props(styles.item.send),
+    receive: props(styles.item.receive, status === "loading" && styles.item.receiving)
   };
   return /*#__PURE__*/React.createElement("div", {
     className: stringify(classNames.item, styled.item.className),

package/dist/components/chat/styles.cjs

@@ -0,0 +1,69 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var item = {
+  base: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  },
+  send: {
+    kSGwAc: "musaex-pvyfi4",
+    kzqmXN: "musaex-eq5yr9",
+    kg3NbH: "musaex-1v4gb6w",
+    k8WAf4: "musaex-a0rzc7",
+    kWkggS: "musaex-1mu49yl",
+    kMwMTN: "musaex-1j14bxn",
+    kaIpWk: "musaex-m9kfsm",
+    $$css: true
+  },
+  receive: {
+    kSGwAc: "musaex-qcrz7y",
+    kg3NbH: "musaex-1v4gb6w",
+    k8WAf4: "musaex-a0rzc7",
+    kWkggS: "musaex-17o6occ",
+    kMwMTN: "musaex-1j14bxn",
+    kaIpWk: "musaex-m9kfsm",
+    $$css: true
+  },
+  receiving: {
+    k5JduY: "musaex-4s63nf",
+    kFguJn: "musaex-1ok1ou",
+    kh3gPk: "musaex-mlyeqh",
+    kYqdJW: "musaex-15y3wy1",
+    kVUETb: "musaex-13ee8us",
+    $$css: true
+  }
+};
+var chat = {
+  base: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  },
+  messages: {
+    kUk6DE: "musaex-98rzlu",
+    kmVPX3: "musaex-17p8e4n",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    kVQacm: "musaex-ysyzu8",
+    $$css: true
+  },
+  footer: {
+    kmVPX3: "musaex-17p8e4n",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  }
+};
+var styles = {
+  item: item,
+  chat: chat
+};
+
+exports.default = styles;

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

@@ -0,0 +1,57 @@
+declare const styles: {
+    item: Readonly<{
+        readonly base: 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 send: Readonly<{
+            readonly alignSelf: import("@stylexjs/stylex").StyleXClassNameFor<"alignSelf", "flex-end">;
+            readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", "fit-content">;
+            readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface-container-highest)">;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface)">;
+            readonly borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
+        }>;
+        readonly receive: Readonly<{
+            readonly alignSelf: import("@stylexjs/stylex").StyleXClassNameFor<"alignSelf", "flex-start">;
+            readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface-container)">;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface)">;
+            readonly borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
+        }>;
+        readonly receiving: Readonly<{
+            readonly "::after": import("@stylexjs/stylex").StyleXClassNameFor<"::after", {
+                readonly content: "|";
+                readonly animationName: string;
+                readonly animationDuration: "1s";
+                readonly animationTimingFunction: "linear";
+                readonly animationIterationCount: "infinite";
+            }>;
+        }>;
+    }>;
+    chat: Readonly<{
+        readonly base: 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 messages: Readonly<{
+            readonly flex: import("@stylexjs/stylex").StyleXClassNameFor<"flex", 1>;
+            readonly padding: import("@stylexjs/stylex").StyleXClassNameFor<"padding", string>;
+            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 overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "auto">;
+        }>;
+        readonly footer: Readonly<{
+            readonly padding: import("@stylexjs/stylex").StyleXClassNameFor<"padding", string>;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "row">;
+            readonly gap: import("@stylexjs/stylex").StyleXClassNameFor<"gap", string>;
+        }>;
+    }>;
+};
+export default styles;

package/dist/components/chat/styles.mjs

@@ -0,0 +1,65 @@
+var item = {
+  base: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  },
+  send: {
+    kSGwAc: "musaex-pvyfi4",
+    kzqmXN: "musaex-eq5yr9",
+    kg3NbH: "musaex-1v4gb6w",
+    k8WAf4: "musaex-a0rzc7",
+    kWkggS: "musaex-1mu49yl",
+    kMwMTN: "musaex-1j14bxn",
+    kaIpWk: "musaex-m9kfsm",
+    $$css: true
+  },
+  receive: {
+    kSGwAc: "musaex-qcrz7y",
+    kg3NbH: "musaex-1v4gb6w",
+    k8WAf4: "musaex-a0rzc7",
+    kWkggS: "musaex-17o6occ",
+    kMwMTN: "musaex-1j14bxn",
+    kaIpWk: "musaex-m9kfsm",
+    $$css: true
+  },
+  receiving: {
+    k5JduY: "musaex-4s63nf",
+    kFguJn: "musaex-1ok1ou",
+    kh3gPk: "musaex-mlyeqh",
+    kYqdJW: "musaex-15y3wy1",
+    kVUETb: "musaex-13ee8us",
+    $$css: true
+  }
+};
+var chat = {
+  base: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  },
+  messages: {
+    kUk6DE: "musaex-98rzlu",
+    kmVPX3: "musaex-17p8e4n",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kOIVth: "musaex-1a0l1y6",
+    kVQacm: "musaex-ysyzu8",
+    $$css: true
+  },
+  footer: {
+    kmVPX3: "musaex-17p8e4n",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kOIVth: "musaex-1a0l1y6",
+    $$css: true
+  }
+};
+var styles = {
+  item: item,
+  chat: chat
+};
+
+export { styles as default };

package/dist/components/checkbox/checkbox.cjs

@@ -74,12 +74,12 @@ var Checkbox = function Checkbox(_ref) {
     onChange === null || onChange === void 0 || onChange(event);
   });
   var styled = {
-    checkbox: stylex.props(styles.default.checkbox["default"], styles.default.checkbox.medium, isDisabled && styles.default.checkbox.disabled),
-    layer: stylex.props(styles.default.layer["default"]["default"], ripple$1 && [styles.default.layer.rippleable["default"], (isChecked || indeterminate) && styles.default.layer.rippleable.checked, invalid && styles.default.layer.rippleable.invalid, isDisabled && styles.default.layer.rippleable.disabled]),
-    inputer: stylex.props(styles.default.inputer["default"]["default"], isDisabled && styles.default.inputer["default"].disabled, (isChecked || indeterminate) && [styles.default.inputer.checked["default"], isDisabled && styles.default.inputer.checked.disabled], invalid && [styles.default.inputer.invalid["default"], (isChecked || indeterminate) && styles.default.inputer.invalid.checked, isDisabled && styles.default.inputer.invalid.disabled]),
-    input: stylex.props(styles.default.input["default"]),
-    check: stylex.props(styles.default.check["default"]),
-    label: stylex.props(theme.$label.small, styles.default.label["default"], invalid && styles.default.label.invalid)
+    checkbox: stylex.props(styles.default.checkbox.base, styles.default.checkbox.medium, isDisabled && styles.default.checkbox.disabled),
+    layer: stylex.props(styles.default.layer.base.base, ripple$1 && [styles.default.layer.rippleable.base, (isChecked || indeterminate) && styles.default.layer.rippleable.checked, invalid && styles.default.layer.rippleable.invalid, isDisabled && styles.default.layer.rippleable.disabled]),
+    inputer: stylex.props(styles.default.inputer.base.base, isDisabled && styles.default.inputer.base.disabled, (isChecked || indeterminate) && [styles.default.inputer.checked.base, isDisabled && styles.default.inputer.checked.disabled], invalid && [styles.default.inputer.invalid.base, (isChecked || indeterminate) && styles.default.inputer.invalid.checked, isDisabled && styles.default.inputer.invalid.disabled]),
+    input: stylex.props(styles.default.input.base),
+    check: stylex.props(styles.default.check.base),
+    label: stylex.props(theme.$label.small, styles.default.label.base, invalid && styles.default.label.invalid)
   };
   return /*#__PURE__*/React.createElement("label", {
     className: className.stringify(classNames.checkbox, className$1, styled.checkbox.className),

package/dist/components/checkbox/checkbox.mjs

@@ -70,12 +70,12 @@ var Checkbox = function Checkbox(_ref) {
     onChange === null || onChange === void 0 || onChange(event);
   });
   var styled = {
-    checkbox: props(styles.checkbox["default"], styles.checkbox.medium, isDisabled && styles.checkbox.disabled),
-    layer: props(styles.layer["default"]["default"], ripple && [styles.layer.rippleable["default"], (isChecked || indeterminate) && styles.layer.rippleable.checked, invalid && styles.layer.rippleable.invalid, isDisabled && styles.layer.rippleable.disabled]),
-    inputer: props(styles.inputer["default"]["default"], isDisabled && styles.inputer["default"].disabled, (isChecked || indeterminate) && [styles.inputer.checked["default"], isDisabled && styles.inputer.checked.disabled], invalid && [styles.inputer.invalid["default"], (isChecked || indeterminate) && styles.inputer.invalid.checked, isDisabled && styles.inputer.invalid.disabled]),
-    input: props(styles.input["default"]),
-    check: props(styles.check["default"]),
-    label: props($label.small, styles.label["default"], invalid && styles.label.invalid)
+    checkbox: props(styles.checkbox.base, styles.checkbox.medium, isDisabled && styles.checkbox.disabled),
+    layer: props(styles.layer.base.base, ripple && [styles.layer.rippleable.base, (isChecked || indeterminate) && styles.layer.rippleable.checked, invalid && styles.layer.rippleable.invalid, isDisabled && styles.layer.rippleable.disabled]),
+    inputer: props(styles.inputer.base.base, isDisabled && styles.inputer.base.disabled, (isChecked || indeterminate) && [styles.inputer.checked.base, isDisabled && styles.inputer.checked.disabled], invalid && [styles.inputer.invalid.base, (isChecked || indeterminate) && styles.inputer.invalid.checked, isDisabled && styles.inputer.invalid.disabled]),
+    input: props(styles.input.base),
+    check: props(styles.check.base),
+    label: props($label.small, styles.label.base, invalid && styles.label.invalid)
   };
   return /*#__PURE__*/React.createElement("label", {
     className: stringify(classNames.checkbox, className, styled.checkbox.className),