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

package/dist/components/upload/uploaded-item/index.cjs

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var styles = require('../styles.cjs');
 var React = require('react');
 var stylex = require('../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var relax = require('@aiszlab/relax');
@@ -15,15 +16,6 @@ var loading = require('../../icon/icons/mock/loading.cjs');
 var attachFile = require('../../icon/icons/editor/attach-file.cjs');
 var _delete = require('../../icon/icons/action/delete.cjs');
 
-var styles = {
-  item: {
-    "default": {
-      k1xSpc: "musaex-78zum5",
-      kGNEyG: "musaex-6s0dn4",
-      kOIVth: "musaex-1wm2zkp",
-      $$css: true
-    }
-  }};
 var UploadedItem = function UploadedItem(_ref) {
   var _fileItem$file$name, _fileItem$file, _item$url;
   var item = _ref.item,
@@ -46,10 +38,8 @@ var UploadedItem = function UploadedItem(_ref) {
   var isPicture = renderItem === "picture";
   var isLoading = fileItem.status === "loading";
   var styled = {
-    item: stylex.props(styles.item["default"], theme.$body.small),
-    filename: {
-      className: "musaex-98rzlu musaex-b3r6kr musaex-lyipyv"
-    }
+    item: stylex.props(styles.default.item.base, theme.$body.small),
+    filename: stylex.props(styles.default.filename.base)
   };
   var remove = relax.useEvent(function () {
     onRemove(index);

package/dist/components/upload/uploaded-item/index.mjs

@@ -1,3 +1,4 @@
+import styles from '../styles.mjs';
 import React, { useContext, useMemo } from 'react';
 import { props } from '../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { useEvent } from '@aiszlab/relax';
@@ -11,15 +12,6 @@ import IconLoading from '../../icon/icons/mock/loading.mjs';
 import IconAttachFile from '../../icon/icons/editor/attach-file.mjs';
 import IconDelete from '../../icon/icons/action/delete.mjs';
 
-var styles = {
-  item: {
-    "default": {
-      k1xSpc: "musaex-78zum5",
-      kGNEyG: "musaex-6s0dn4",
-      kOIVth: "musaex-1wm2zkp",
-      $$css: true
-    }
-  }};
 var UploadedItem = function UploadedItem(_ref) {
   var _fileItem$file$name, _fileItem$file, _item$url;
   var item = _ref.item,
@@ -42,10 +34,8 @@ var UploadedItem = function UploadedItem(_ref) {
   var isPicture = renderItem === "picture";
   var isLoading = fileItem.status === "loading";
   var styled = {
-    item: props(styles.item["default"], $body.small),
-    filename: {
-      className: "musaex-98rzlu musaex-b3r6kr musaex-lyipyv"
-    }
+    item: props(styles.item.base, $body.small),
+    filename: props(styles.filename.base)
   };
   var remove = useEvent(function () {
     onRemove(index);

package/dist/components/upload/uploaded-item/picture.cjs

@@ -3,9 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+var styles = require('../styles.cjs');
 var React = require('react');
 var context$1 = require('../../image/context.cjs');
 var index = require('../../image/index.cjs');
+var stylex = require('../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var useThemeColorVars = require('../../../hooks/use-theme-color-vars.cjs');
 var className = require('@aiszlab/relax/class-name');
 var context = require('../context.cjs');
@@ -20,12 +22,8 @@ var UploadedPicture = function UploadedPicture(_ref) {
   var _useContext = React.useContext(context.Context),
     classNames = _useContext.classNames;
   var styled = {
-    wrapper: {
-      className: "musaex-1iyq3db musaex-1y0btm7 musaex-axmpxa musaex-db68te musaex-17p8e4n"
-    },
-    image: {
-      className: "musaex-11mck8i musaex-10vnh4r"
-    }
+    wrapper: stylex.props(styles.default.picture.wrapper),
+    image: stylex.props(styles.default.picture.base)
   };
   return /*#__PURE__*/React.createElement(context$1.default, {
     value: {

package/dist/components/upload/uploaded-item/picture.mjs

@@ -1,7 +1,9 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import styles from '../styles.mjs';
 import React, { useContext } from 'react';
 import ImageContext from '../../image/context.mjs';
 import { Image } from '../../image/index.mjs';
+import { props } from '../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { useThemeColorVars } from '../../../hooks/use-theme-color-vars.mjs';
 import { stringify } from '@aiszlab/relax/class-name';
 import { Context } from '../context.mjs';
@@ -16,12 +18,8 @@ var UploadedPicture = function UploadedPicture(_ref) {
   var _useContext = useContext(Context),
     classNames = _useContext.classNames;
   var styled = {
-    wrapper: {
-      className: "musaex-1iyq3db musaex-1y0btm7 musaex-axmpxa musaex-db68te musaex-17p8e4n"
-    },
-    image: {
-      className: "musaex-11mck8i musaex-10vnh4r"
-    }
+    wrapper: props(styles.picture.wrapper),
+    image: props(styles.picture.base)
   };
   return /*#__PURE__*/React.createElement(ImageContext, {
     value: {

package/dist/components/upload/uploaded-list.cjs

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var styles = require('./styles.cjs');
 var React = require('react');
 var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var index = require('./uploaded-item/index.cjs');
@@ -9,14 +10,6 @@ var context = require('./context.cjs');
 var className = require('@aiszlab/relax/class-name');
 var theme = require('../theme/theme.cjs');
 
-var styles = {
-  item: {
-    k1xSpc: "musaex-78zum5",
-    kGNEyG: "musaex-6s0dn4",
-    kOIVth: "musaex-1wm2zkp",
-    $$css: true
-  }
-};
 var UploadedList = function UploadedList(_ref) {
   var value = _ref.value,
     onRemove = _ref.onRemove;
@@ -29,10 +22,10 @@ var UploadedList = function UploadedList(_ref) {
     return null;
   }
   var styled = {
-    list: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-1wm2zkp"
-    },
-    item: stylex.props(styles.item, theme.$body.small)};
+    list: stylex.props(styles.default.uploadedList.list),
+    item: stylex.props(styles.default.uploadedList.item, theme.$body.small),
+    filename: stylex.props(styles.default.uploadedList.filename)
+  };
   return /*#__PURE__*/React.createElement("div", {
     className: className.stringify(classNames.uploadedList, styled.list.className),
     style: styled.list.style

package/dist/components/upload/uploaded-list.mjs

@@ -1,3 +1,4 @@
+import styles from './styles.mjs';
 import React, { useContext } from 'react';
 import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import UploadedItem from './uploaded-item/index.mjs';
@@ -5,14 +6,6 @@ import { Context } from './context.mjs';
 import { stringify } from '@aiszlab/relax/class-name';
 import { $body } from '../theme/theme.mjs';
 
-var styles = {
-  item: {
-    k1xSpc: "musaex-78zum5",
-    kGNEyG: "musaex-6s0dn4",
-    kOIVth: "musaex-1wm2zkp",
-    $$css: true
-  }
-};
 var UploadedList = function UploadedList(_ref) {
   var value = _ref.value,
     onRemove = _ref.onRemove;
@@ -25,10 +18,10 @@ var UploadedList = function UploadedList(_ref) {
     return null;
   }
   var styled = {
-    list: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-1wm2zkp"
-    },
-    item: props(styles.item, $body.small)};
+    list: props(styles.uploadedList.list),
+    item: props(styles.uploadedList.item, $body.small),
+    filename: props(styles.uploadedList.filename)
+  };
   return /*#__PURE__*/React.createElement("div", {
     className: stringify(classNames.uploadedList, styled.list.className),
     style: styled.list.style

package/dist/components/visually-hidden/styles.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {
+  hidden: {
+    kzqmXN: "musaex-1yv54sy",
+    kZKoxP: "musaex-12yrczq",
+    kogj98: "musaex-1hi0jjc",
+    kVAEAm: "musaex-10l6tqk",
+    kMcinP: "musaex-zpqnlu",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  }
+};
+
+exports.default = styles;

package/dist/components/visually-hidden/styles.d.ts

@@ -0,0 +1,11 @@
+declare const styles: Readonly<{
+    readonly hidden: Readonly<{
+        readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", string>;
+        readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
+        readonly margin: import("@stylexjs/stylex").StyleXClassNameFor<"margin", string>;
+        readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "absolute">;
+        readonly clip: import("@stylexjs/stylex").StyleXClassNameFor<"clip", "rect(0, 0, 0, 0)">;
+        readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "hidden">;
+    }>;
+}>;
+export default styles;

package/dist/components/visually-hidden/styles.mjs

@@ -0,0 +1,13 @@
+var styles = {
+  hidden: {
+    kzqmXN: "musaex-1yv54sy",
+    kZKoxP: "musaex-12yrczq",
+    kogj98: "musaex-1hi0jjc",
+    kVAEAm: "musaex-10l6tqk",
+    kMcinP: "musaex-zpqnlu",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  }
+};
+
+export { styles as default };

package/dist/components/visually-hidden/visually-hidden.cjs

@@ -4,6 +4,8 @@ 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 stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var React = require('react');
 var className = require('@aiszlab/relax/class-name');
 var useClassNames = require('../../hooks/use-class-names.cjs');
@@ -14,9 +16,7 @@ var VisuallyHidden = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     dangerouslySetInnerHTML = _ref.dangerouslySetInnerHTML,
     props = _objectWithoutProperties(_ref, _excluded);
-  var styled = {
-    className: "musaex-1yv54sy musaex-12yrczq musaex-1hi0jjc musaex-10l6tqk musaex-zpqnlu musaex-b3r6kr"
-  };
+  var styled = stylex.props(styles.default.hidden);
   var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
   return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, props), {}, {
     className: className.stringify(classNames.visuallyHidden, styled.className),

package/dist/components/visually-hidden/visually-hidden.mjs

@@ -1,5 +1,7 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import styles from './styles.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import React, { forwardRef } from 'react';
 import { stringify } from '@aiszlab/relax/class-name';
 import { useClassNames } from '../../hooks/use-class-names.mjs';
@@ -9,12 +11,10 @@ var _excluded = ["children", "dangerouslySetInnerHTML"];
 var VisuallyHidden = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
     dangerouslySetInnerHTML = _ref.dangerouslySetInnerHTML,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var styled = {
-    className: "musaex-1yv54sy musaex-12yrczq musaex-1hi0jjc musaex-10l6tqk musaex-zpqnlu musaex-b3r6kr"
-  };
+    props$1 = _objectWithoutProperties(_ref, _excluded);
+  var styled = props(styles.hidden);
   var classNames = useClassNames(CLASS_NAMES);
-  return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, props$1), {}, {
     className: stringify(classNames.visuallyHidden, styled.className),
     style: styled.style,
     dangerouslySetInnerHTML: dangerouslySetInnerHTML,

package/dist/components/waterfall/sequential.cjs

@@ -3,7 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var styles = require('./styles.cjs');
 var React = require('react');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 
 var Sequential = function Sequential(_ref) {
   var children = _ref.children,
@@ -29,9 +31,7 @@ var Sequential = function Sequential(_ref) {
       return column.length > 0;
     });
   }, [children, columns]);
-  var styled = {
-    className: "musaex-98rzlu musaex-78zum5 musaex-dt5ytf musaex-1wj6dh3 musaex-ysyzu8"
-  };
+  var styled = stylex.props(styles.default.sequential.column);
   return /*#__PURE__*/React.createElement("div", {
     className: className,
     style: style

package/dist/components/waterfall/sequential.mjs

@@ -1,5 +1,7 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
 import React, { useMemo } from 'react';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 
 var Sequential = function Sequential(_ref) {
   var children = _ref.children,
@@ -25,9 +27,7 @@ var Sequential = function Sequential(_ref) {
       return column.length > 0;
     });
   }, [children, columns]);
-  var styled = {
-    className: "musaex-98rzlu musaex-78zum5 musaex-dt5ytf musaex-1wj6dh3 musaex-ysyzu8"
-  };
+  var styled = props(styles.sequential.column);
   return /*#__PURE__*/React.createElement("div", {
     className: className,
     style: style

package/dist/components/waterfall/styles.cjs

@@ -0,0 +1,45 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var waterfall = {
+  base: {
+    kzqmXN: "musaex-92755x",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kwnvtZ: "musaex-1a02dak",
+    kfiyM8: "musaex-8gbvx8",
+    kZKoxP: "musaex-g7h5cd",
+    k1C7PZ: "musaex-n1rw23",
+    khm7nJ: "musaex-1wj6dh3",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  },
+  repainted: {
+    kXwgrk: "musaex-dt5ytf",
+    kZKoxP: "musaex-1evh9kd",
+    $$css: true
+  },
+  item: {
+    kayTVb: "musaex-zbmny2",
+    kzqmXN: "musaex-o4cs04",
+    kZKoxP: "musaex-g7h5cd",
+    $$css: true
+  }
+};
+var sequential = {
+  column: {
+    kUk6DE: "musaex-98rzlu",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    khm7nJ: "musaex-1wj6dh3",
+    kVQacm: "musaex-ysyzu8",
+    $$css: true
+  }
+};
+var styles = {
+  waterfall: waterfall,
+  sequential: sequential
+};
+
+exports.default = styles;

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

@@ -0,0 +1,34 @@
+declare const styles: {
+    waterfall: Readonly<{
+        readonly base: Readonly<{
+            readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", string>;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "row">;
+            readonly flexWrap: import("@stylexjs/stylex").StyleXClassNameFor<"flexWrap", "wrap">;
+            readonly alignContent: import("@stylexjs/stylex").StyleXClassNameFor<"alignContent", "flex-start">;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "fit-content">;
+            readonly columnGap: import("@stylexjs/stylex").StyleXClassNameFor<"columnGap", "var(--column-gap)">;
+            readonly rowGap: import("@stylexjs/stylex").StyleXClassNameFor<"rowGap", "var(--row-gap)">;
+            readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "hidden">;
+        }>;
+        readonly repainted: Readonly<{
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "column">;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "var(--max-height)">;
+        }>;
+        readonly item: Readonly<{
+            readonly order: import("@stylexjs/stylex").StyleXClassNameFor<"order", "var(--order)">;
+            readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", "calc((100% - (var(--columns) - 1) * var(--column-gap)) / var(--columns))">;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "fit-content">;
+        }>;
+    }>;
+    sequential: Readonly<{
+        readonly column: Readonly<{
+            readonly flex: import("@stylexjs/stylex").StyleXClassNameFor<"flex", 1>;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "column">;
+            readonly rowGap: import("@stylexjs/stylex").StyleXClassNameFor<"rowGap", "var(--row-gap)">;
+            readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "auto">;
+        }>;
+    }>;
+};
+export default styles;

package/dist/components/waterfall/styles.mjs

@@ -0,0 +1,41 @@
+var waterfall = {
+  base: {
+    kzqmXN: "musaex-92755x",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kwnvtZ: "musaex-1a02dak",
+    kfiyM8: "musaex-8gbvx8",
+    kZKoxP: "musaex-g7h5cd",
+    k1C7PZ: "musaex-n1rw23",
+    khm7nJ: "musaex-1wj6dh3",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  },
+  repainted: {
+    kXwgrk: "musaex-dt5ytf",
+    kZKoxP: "musaex-1evh9kd",
+    $$css: true
+  },
+  item: {
+    kayTVb: "musaex-zbmny2",
+    kzqmXN: "musaex-o4cs04",
+    kZKoxP: "musaex-g7h5cd",
+    $$css: true
+  }
+};
+var sequential = {
+  column: {
+    kUk6DE: "musaex-98rzlu",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    khm7nJ: "musaex-1wj6dh3",
+    kVQacm: "musaex-ysyzu8",
+    $$css: true
+  }
+};
+var styles = {
+  waterfall: waterfall,
+  sequential: sequential
+};
+
+export { styles as default };

package/dist/components/waterfall/waterfall.cjs

@@ -4,6 +4,8 @@ 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 stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var React = require('react');
 var hooks = require('./hooks.cjs');
 var useGutters = require('../../hooks/use-gutters.cjs');
@@ -62,14 +64,7 @@ var Waterfall = function Waterfall(_ref2) {
     };
   });
   if (children.length === 0) return null;
-  var styled = {
-    0: {
-      className: "musaex-92755x musaex-78zum5 musaex-1q0g3np musaex-1a02dak musaex-8gbvx8 musaex-g7h5cd musaex-n1rw23 musaex-1wj6dh3 musaex-b3r6kr"
-    },
-    1: {
-      className: "musaex-92755x musaex-78zum5 musaex-1a02dak musaex-8gbvx8 musaex-n1rw23 musaex-1wj6dh3 musaex-b3r6kr musaex-dt5ytf musaex-1evh9kd"
-    }
-  }[!!(!sequential$1 && maxHeight > 0) << 0];
+  var styled = stylex.props(styles.default.waterfall.base, !sequential$1 && maxHeight > 0 && styles.default.waterfall.repainted);
   // sequential waterfall
   if (sequential$1) {
     return /*#__PURE__*/React.createElement(sequential.default, {
@@ -92,9 +87,7 @@ var Waterfall = function Waterfall(_ref2) {
     })
   }, children.map(function (item, index) {
     var _order = order(index);
-    var _$props = {
-        className: "musaex-zbmny2 musaex-o4cs04 musaex-g7h5cd"
-      },
+    var _$props = stylex.props(styles.default.waterfall.item),
       className = _$props.className,
       style = _$props.style;
     return /*#__PURE__*/React.createElement("div", {

package/dist/components/waterfall/waterfall.mjs

@@ -1,5 +1,7 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import React from 'react';
 import { useRepaint } from './hooks.mjs';
 import { useGutters } from '../../hooks/use-gutters.mjs';
@@ -58,14 +60,7 @@ var Waterfall = function Waterfall(_ref2) {
     };
   });
   if (children.length === 0) return null;
-  var styled = {
-    0: {
-      className: "musaex-92755x musaex-78zum5 musaex-1q0g3np musaex-1a02dak musaex-8gbvx8 musaex-g7h5cd musaex-n1rw23 musaex-1wj6dh3 musaex-b3r6kr"
-    },
-    1: {
-      className: "musaex-92755x musaex-78zum5 musaex-1a02dak musaex-8gbvx8 musaex-n1rw23 musaex-1wj6dh3 musaex-b3r6kr musaex-dt5ytf musaex-1evh9kd"
-    }
-  }[!!(!sequential && maxHeight > 0) << 0];
+  var styled = props(styles.waterfall.base, !sequential && maxHeight > 0 && styles.waterfall.repainted);
   // sequential waterfall
   if (sequential) {
     return /*#__PURE__*/React.createElement(Sequential, {
@@ -88,9 +83,7 @@ var Waterfall = function Waterfall(_ref2) {
     })
   }, children.map(function (item, index) {
     var _order = order(index);
-    var _$props = {
-        className: "musaex-zbmny2 musaex-o4cs04 musaex-g7h5cd"
-      },
+    var _$props = props(styles.waterfall.item),
       className = _$props.className,
       style = _$props.style;
     return /*#__PURE__*/React.createElement("div", {

package/dist/components/watermark/styles.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {
+  watermark: {
+    kVAEAm: "musaex-1n2onr6",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  },
+  marks: {
+    kzqmXN: "musaex-92755x",
+    kZKoxP: "musaex-qg7gut",
+    $$css: true
+  }
+};
+
+exports.default = styles;

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

@@ -0,0 +1,11 @@
+declare const styles: Readonly<{
+    readonly watermark: Readonly<{
+        readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "relative">;
+        readonly overflow: import("@stylexjs/stylex").StyleXClassNameFor<"overflow", "hidden">;
+    }>;
+    readonly marks: Readonly<{
+        readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", string>;
+        readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
+    }>;
+}>;
+export default styles;

package/dist/components/watermark/styles.mjs

@@ -0,0 +1,14 @@
+var styles = {
+  watermark: {
+    kVAEAm: "musaex-1n2onr6",
+    kVQacm: "musaex-b3r6kr",
+    $$css: true
+  },
+  marks: {
+    kzqmXN: "musaex-92755x",
+    kZKoxP: "musaex-qg7gut",
+    $$css: true
+  }
+};
+
+export { styles as default };

package/dist/components/watermark/watermark.cjs

@@ -4,7 +4,9 @@ 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 stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var tokens_stylex = require('../theme/tokens.stylex.cjs');
 var relax = require('@aiszlab/relax');
 var hooks = require('./hooks.cjs');
@@ -36,9 +38,9 @@ var Watermark = function Watermark(_ref) {
     add = _useWatermarks.add,
     isWatermarkRewritten = _useWatermarks.isWatermarkRewritten;
   var styled = {
-    watermark: {
-      className: "musaex-1n2onr6 musaex-b3r6kr"
-    }};
+    watermark: stylex.props(styles.default.watermark),
+    marks: stylex.props(styles.default.marks)
+  };
   var _useClips = hooks.useClips(),
     draw = _useClips.draw;
   var _React$useState = React.useState(null),

package/dist/components/watermark/watermark.mjs

@@ -1,6 +1,8 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
 import React, { useRef, useMemo, useEffect } from 'react';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { OPACITY } from '../theme/tokens.stylex.mjs';
 import { useDevicePixelRatio, useRaf, useMutateObserver } from '@aiszlab/relax';
 import { useWatermarks, useClips } from './hooks.mjs';
@@ -32,9 +34,9 @@ var Watermark = function Watermark(_ref) {
     add = _useWatermarks.add,
     isWatermarkRewritten = _useWatermarks.isWatermarkRewritten;
   var styled = {
-    watermark: {
-      className: "musaex-1n2onr6 musaex-b3r6kr"
-    }};
+    watermark: props(styles.watermark),
+    marks: props(styles.marks)
+  };
   var _useClips = useClips(),
     draw = _useClips.draw;
   var _React$useState = React.useState(null),

package/dist/index.d.ts

@@ -73,6 +73,7 @@ export { Ellipsis } from "./components/ellipsis";
 export { SplitPanel } from "./components/split-panel";
 export { SessionStorage } from "./components/session-storage";
 export { Search } from "./components/search";
+export type { ResolvedSearchView, SearchItem, SearchProps, SearchRef, SearchView, } from "./components/search";
 /**
  * @description
  * hooks