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

package/dist/components/icon-button/styles.mjs

@@ -0,0 +1,39 @@
+var styles = {
+  base: {
+    kZglDW: "musaex-hkfzi4",
+    kKklSC: "musaex-3e2p9r",
+    $$css: true
+  },
+  xsmall: {
+    kzqmXN: "musaex-1po6ib",
+    k7Eaqz: "musaex-1mao3ak",
+    kZKoxP: "musaex-1si1pn3",
+    $$css: true
+  },
+  small: {
+    kzqmXN: "musaex-19dbm5w",
+    k7Eaqz: "musaex-14dj9iu",
+    kZKoxP: "musaex-12ez60q",
+    $$css: true
+  },
+  medium: {
+    kzqmXN: "musaex-x7tnyf",
+    k7Eaqz: "musaex-pigv26",
+    kZKoxP: "musaex-1s2k5h2",
+    $$css: true
+  },
+  large: {
+    kzqmXN: "musaex-irjzkq",
+    k7Eaqz: "musaex-193eezx",
+    kZKoxP: "musaex-1nrwtz4",
+    $$css: true
+  },
+  xlarge: {
+    kzqmXN: "musaex-h0ce78",
+    k7Eaqz: "musaex-mhg31v",
+    kZKoxP: "musaex-1do9ykw",
+    $$css: true
+  }
+};
+
+export { styles as default };

package/dist/components/image/image.cjs

@@ -5,10 +5,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var styles = require('./styles.cjs');
 var React = require('react');
 var preview = require('./preview/preview.cjs');
 var context = require('./preview/context.cjs');
 var relax = require('@aiszlab/relax');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var skeleton = require('../skeleton/skeleton.cjs');
 var useClassNames = require('../../hooks/use-class-names.cjs');
 var className = require('@aiszlab/relax/class-name');
@@ -70,29 +72,10 @@ var Image = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     turnOn();
   });
   var styled = {
-    loading: {
-      className: "musaex-3nfvp2 musaex-1n2onr6 musaex-l56j7k musaex-6s0dn4"
-    },
-    image: {
-      className: "musaex-3nfvp2 musaex-1n2onr6 musaex-l56j7k musaex-6s0dn4"
-    },
-    overlay: {
-      0: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-1hc1fzr musaex-19991ni musaex-1dg6om"
-      },
-      2: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-19991ni musaex-1dg6om musaex-g01cxk"
-      },
-      1: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-1hc1fzr musaex-19991ni musaex-1dg6om musaex-1ypdohk"
-      },
-      3: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-19991ni musaex-1dg6om musaex-g01cxk musaex-1ypdohk"
-      }
-    }[!!!isHovered << 1 | !!(actions.size === 1 && actions.has("preview")) << 0],
-    img: {
-      className: "musaex-92755x musaex-qg7gut musaex-l1xv1r"
-    }
+    loading: stylex.props(styles.default.image.base),
+    image: stylex.props(styles.default.image.base),
+    overlay: stylex.props(styles.default.overlay.base, !isHovered && styles.default.overlay.hidden, actions.size === 1 && actions.has("preview") && styles.default.overlay.previewable),
+    img: stylex.props(styles.default.img.base)
   };
   React.useImperativeHandle(ref, function () {
     var _imageRef$current;

package/dist/components/image/image.mjs

@@ -1,10 +1,12 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import styles from './styles.mjs';
 import React, { forwardRef, useContext, useRef, useMemo, useImperativeHandle } from 'react';
 import Preview from './preview/preview.mjs';
 import PreviewGroupContext from './preview/context.mjs';
 import { useBoolean, useHover, useImageLoader, useEvent } from '@aiszlab/relax';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import Skeleton from '../skeleton/skeleton.mjs';
 import { useClassNames } from '../../hooks/use-class-names.mjs';
 import { stringify } from '@aiszlab/relax/class-name';
@@ -66,29 +68,10 @@ var Image = /*#__PURE__*/forwardRef(function (_ref, ref) {
     turnOn();
   });
   var styled = {
-    loading: {
-      className: "musaex-3nfvp2 musaex-1n2onr6 musaex-l56j7k musaex-6s0dn4"
-    },
-    image: {
-      className: "musaex-3nfvp2 musaex-1n2onr6 musaex-l56j7k musaex-6s0dn4"
-    },
-    overlay: {
-      0: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-1hc1fzr musaex-19991ni musaex-1dg6om"
-      },
-      2: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-19991ni musaex-1dg6om musaex-g01cxk"
-      },
-      1: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-1hc1fzr musaex-19991ni musaex-1dg6om musaex-1ypdohk"
-      },
-      3: {
-        className: "musaex-10l6tqk musaex-10a8y8t musaex-78zum5 musaex-l56j7k musaex-6s0dn4 musaex-1wm2zkp musaex-72g52x musaex-1szb5uh musaex-87ps6o musaex-19991ni musaex-1dg6om musaex-g01cxk musaex-1ypdohk"
-      }
-    }[!!!isHovered << 1 | !!(actions.size === 1 && actions.has("preview")) << 0],
-    img: {
-      className: "musaex-92755x musaex-qg7gut musaex-l1xv1r"
-    }
+    loading: props(styles.image.base),
+    image: props(styles.image.base),
+    overlay: props(styles.overlay.base, !isHovered && styles.overlay.hidden, actions.size === 1 && actions.has("preview") && styles.overlay.previewable),
+    img: props(styles.img.base)
   };
   useImperativeHandle(ref, function () {
     var _imageRef$current;

package/dist/components/image/preview/operations.cjs

@@ -3,7 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+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 portal = require('../../portal/portal.cjs');
 var hooks = require('../../theme/hooks.cjs');
 var hooks$1 = require('../hooks.cjs');
@@ -24,21 +26,11 @@ var Operations = function Operations(_ref) {
     onFlipY = _ref.onFlipY;
   var theme = hooks.useTheme();
   var styled = {
-    operations: {
-      className: "musaex-ixxii4 musaex-1dx3pxl"
-    },
-    closer: {
-      className: "musaex-eevl6q musaex-75f684 musaex-ob9i47"
-    },
-    navigations: {
-      className: "musaex-ixxii4 musaex-u96u03 musaex-3m8u43 musaex-wa60dl musaex-81lxrv musaex-78zum5 musaex-1q0g3np musaex-1qughib musaex-6s0dn4"
-    },
-    footer: {
-      className: "musaex-ixxii4 musaex-u96u03 musaex-3m8u43 musaex-vktm6t musaex-78zum5 musaex-dt5ytf musaex-6s0dn4 musaex-1j14bxn"
-    },
-    handlers: {
-      className: "musaex-78zum5 musaex-1q0g3np musaex-15wobh7 musaex-6s0dn4 musaex-k7eln3 musaex-shxsqp musaex-1pyhihf musaex-11owsmz"
-    }
+    operations: stylex.props(styles.default.operations.base),
+    closer: stylex.props(styles.default.operations.closer),
+    navigations: stylex.props(styles.default.operations.navigations),
+    footer: stylex.props(styles.default.operations.footer),
+    handlers: stylex.props(styles.default.operations.handlers)
   };
   var handlers = hooks$1.useHandlers({
     onFlipX: onFlipX,

package/dist/components/image/preview/operations.mjs

@@ -1,5 +1,7 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+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 Portal from '../../portal/portal.mjs';
 import { useTheme } from '../../theme/hooks.mjs';
 import { useHandlers } from '../hooks.mjs';
@@ -20,21 +22,11 @@ var Operations = function Operations(_ref) {
     onFlipY = _ref.onFlipY;
   var theme = useTheme();
   var styled = {
-    operations: {
-      className: "musaex-ixxii4 musaex-1dx3pxl"
-    },
-    closer: {
-      className: "musaex-eevl6q musaex-75f684 musaex-ob9i47"
-    },
-    navigations: {
-      className: "musaex-ixxii4 musaex-u96u03 musaex-3m8u43 musaex-wa60dl musaex-81lxrv musaex-78zum5 musaex-1q0g3np musaex-1qughib musaex-6s0dn4"
-    },
-    footer: {
-      className: "musaex-ixxii4 musaex-u96u03 musaex-3m8u43 musaex-vktm6t musaex-78zum5 musaex-dt5ytf musaex-6s0dn4 musaex-1j14bxn"
-    },
-    handlers: {
-      className: "musaex-78zum5 musaex-1q0g3np musaex-15wobh7 musaex-6s0dn4 musaex-k7eln3 musaex-shxsqp musaex-1pyhihf musaex-11owsmz"
-    }
+    operations: props(styles.operations.base),
+    closer: props(styles.operations.closer),
+    navigations: props(styles.operations.navigations),
+    footer: props(styles.operations.footer),
+    handlers: props(styles.operations.handlers)
   };
   var handlers = useHandlers({
     onFlipX: onFlipX,

package/dist/components/image/preview/preview.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 React = require('react');
 var dialog = require('../../dialog/dialog.cjs');
 var operations = require('./operations.cjs');
+var stylex = require('../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 
 var DEFAULT_STYLE = {
   scale: 1,
@@ -72,9 +74,7 @@ var Preview = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     };
   }, []);
   var isSmallest = scale <= 1;
-  var styled = {
-    className: "musaex-1jsi7ff musaex-1so62im musaex-11xpdln musaex-1ptezny musaex-67bb7w"
-  };
+  var styled = stylex.props(styles.default.preview.image);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(dialog.default, {
     open: true,
     onClose: onClose,

package/dist/components/image/preview/preview.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 React, { forwardRef, useState, useImperativeHandle } from 'react';
 import Dialog from '../../dialog/dialog.mjs';
 import Operations from './operations.mjs';
+import { props } from '../../../node_modules/.pnpm/@stylexjs_stylex@0.19.0/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 
 var DEFAULT_STYLE = {
   scale: 1,
@@ -68,9 +70,7 @@ var Preview = /*#__PURE__*/forwardRef(function (_ref, ref) {
     };
   }, []);
   var isSmallest = scale <= 1;
-  var styled = {
-    className: "musaex-1jsi7ff musaex-1so62im musaex-11xpdln musaex-1ptezny musaex-67bb7w"
-  };
+  var styled = props(styles.preview.image);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dialog, {
     open: true,
     onClose: onClose,

package/dist/components/image/styles.cjs

@@ -0,0 +1,112 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var image = {
+  base: {
+    k1xSpc: "musaex-3nfvp2",
+    kVAEAm: "musaex-1n2onr6",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  }
+};
+var overlay = {
+  base: {
+    kVAEAm: "musaex-10l6tqk",
+    kpwlN0: "musaex-10a8y8t",
+    k1xSpc: "musaex-78zum5",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    kOIVth: "musaex-1wm2zkp",
+    kWkggS: "musaex-72g52x",
+    kMwMTN: "musaex-1szb5uh",
+    kfSwDN: "musaex-87ps6o",
+    kSiTet: "musaex-1hc1fzr",
+    k1ekBW: "musaex-19991ni",
+    kIyJzY: "musaex-1dg6om",
+    $$css: true
+  },
+  hidden: {
+    kSiTet: "musaex-g01cxk",
+    $$css: true
+  },
+  previewable: {
+    kkrTdU: "musaex-1ypdohk",
+    $$css: true
+  }
+};
+var img = {
+  base: {
+    kzqmXN: "musaex-92755x",
+    kZKoxP: "musaex-qg7gut",
+    kVIFPx: "musaex-l1xv1r",
+    $$css: true
+  }
+};
+var preview = {
+  image: {
+    k3aq6I: "musaex-1jsi7ff",
+    k6sLGO: "musaex-1so62im",
+    k1ekBW: "musaex-11xpdln",
+    kIyJzY: "musaex-1ptezny",
+    kfzvcC: "musaex-67bb7w",
+    $$css: true
+  }
+};
+var operations = {
+  base: {
+    kVAEAm: "musaex-ixxii4",
+    kY2c9j: "musaex-1dx3pxl",
+    $$css: true
+  },
+  closer: {
+    kdh0IS: "musaex-eevl6q",
+    kILoXP: "musaex-75f684",
+    kTCo9J: "musaex-ob9i47",
+    $$css: true
+  },
+  navigations: {
+    kVAEAm: "musaex-ixxii4",
+    kbCHJM: "musaex-u96u03",
+    kCIrl2: "musaex-3m8u43",
+    k87sOh: "musaex-wa60dl",
+    kg3NbH: "musaex-81lxrv",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kjj79g: "musaex-1qughib",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  },
+  footer: {
+    kVAEAm: "musaex-ixxii4",
+    kbCHJM: "musaex-u96u03",
+    kCIrl2: "musaex-3m8u43",
+    krVfgx: "musaex-vktm6t",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kGNEyG: "musaex-6s0dn4",
+    kMwMTN: "musaex-1j14bxn",
+    $$css: true
+  },
+  handlers: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kOIVth: "musaex-15wobh7",
+    kGNEyG: "musaex-6s0dn4",
+    kWkggS: "musaex-k7eln3",
+    kaIpWk: "musaex-shxsqp",
+    kg3NbH: "musaex-1pyhihf",
+    k8WAf4: "musaex-11owsmz",
+    $$css: true
+  }
+};
+var styles = {
+  image: image,
+  overlay: overlay,
+  img: img,
+  preview: preview,
+  operations: operations
+};
+
+exports.default = styles;

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

@@ -0,0 +1,93 @@
+declare const styles: {
+    image: Readonly<{
+        readonly base: Readonly<{
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "inline-flex">;
+            readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "relative">;
+            readonly justifyContent: import("@stylexjs/stylex").StyleXClassNameFor<"justifyContent", "center">;
+            readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+        }>;
+    }>;
+    overlay: Readonly<{
+        readonly base: Readonly<{
+            readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "absolute">;
+            readonly inset: import("@stylexjs/stylex").StyleXClassNameFor<"inset", 0>;
+            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 gap: import("@stylexjs/stylex").StyleXClassNameFor<"gap", string>;
+            readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface-dim-opacity-90)">;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-primary)">;
+            readonly userSelect: import("@stylexjs/stylex").StyleXClassNameFor<"userSelect", "none">;
+            readonly opacity: import("@stylexjs/stylex").StyleXClassNameFor<"opacity", 1>;
+            readonly transitionProperty: import("@stylexjs/stylex").StyleXClassNameFor<"transitionProperty", "opacity">;
+            readonly transitionDuration: import("@stylexjs/stylex").StyleXClassNameFor<"transitionDuration", string>;
+        }>;
+        readonly hidden: Readonly<{
+            readonly opacity: import("@stylexjs/stylex").StyleXClassNameFor<"opacity", 0>;
+        }>;
+        readonly previewable: Readonly<{
+            readonly cursor: import("@stylexjs/stylex").StyleXClassNameFor<"cursor", "pointer">;
+        }>;
+    }>;
+    img: Readonly<{
+        readonly base: Readonly<{
+            readonly width: import("@stylexjs/stylex").StyleXClassNameFor<"width", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
+            readonly objectFit: import("@stylexjs/stylex").StyleXClassNameFor<"objectFit", "cover">;
+        }>;
+    }>;
+    preview: Readonly<{
+        readonly image: Readonly<{
+            readonly transform: import("@stylexjs/stylex").StyleXClassNameFor<"transform", "translate3d(0px, 0px, 0px) scale3d(calc(var(--scale) * var(--flip-x)), calc(var(--scale) * var(--flip-y)), 1) rotate(var(--rotate))">;
+            readonly willChange: import("@stylexjs/stylex").StyleXClassNameFor<"willChange", "transform">;
+            readonly transitionProperty: import("@stylexjs/stylex").StyleXClassNameFor<"transitionProperty", "transform">;
+            readonly transitionDuration: import("@stylexjs/stylex").StyleXClassNameFor<"transitionDuration", string>;
+            readonly pointerEvents: import("@stylexjs/stylex").StyleXClassNameFor<"pointerEvents", "auto">;
+        }>;
+    }>;
+    operations: Readonly<{
+        readonly base: Readonly<{
+            readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "fixed">;
+            readonly zIndex: import("@stylexjs/stylex").StyleXClassNameFor<"zIndex", string>;
+        }>;
+        readonly closer: Readonly<{
+            readonly ":not(#\\#)": import("@stylexjs/stylex").StyleXClassNameFor<":not(#\\#)", {
+                readonly top: import("@stylexjs/stylex").StyleXVar<string>;
+                readonly right: import("@stylexjs/stylex").StyleXVar<string>;
+                readonly position: "fixed";
+            }>;
+        }>;
+        readonly navigations: Readonly<{
+            readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "fixed">;
+            readonly left: import("@stylexjs/stylex").StyleXClassNameFor<"left", 0>;
+            readonly right: import("@stylexjs/stylex").StyleXClassNameFor<"right", 0>;
+            readonly top: import("@stylexjs/stylex").StyleXClassNameFor<"top", "50%">;
+            readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "row">;
+            readonly justifyContent: import("@stylexjs/stylex").StyleXClassNameFor<"justifyContent", "space-between">;
+            readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+        }>;
+        readonly footer: Readonly<{
+            readonly position: import("@stylexjs/stylex").StyleXClassNameFor<"position", "fixed">;
+            readonly left: import("@stylexjs/stylex").StyleXClassNameFor<"left", 0>;
+            readonly right: import("@stylexjs/stylex").StyleXClassNameFor<"right", 0>;
+            readonly bottom: import("@stylexjs/stylex").StyleXClassNameFor<"bottom", string>;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "column">;
+            readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface)">;
+        }>;
+        readonly handlers: Readonly<{
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexDirection: import("@stylexjs/stylex").StyleXClassNameFor<"flexDirection", "row">;
+            readonly gap: import("@stylexjs/stylex").StyleXClassNameFor<"gap", string>;
+            readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
+            readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-surface)">;
+            readonly borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
+            readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+        }>;
+    }>;
+};
+export default styles;

package/dist/components/image/styles.mjs

@@ -0,0 +1,108 @@
+var image = {
+  base: {
+    k1xSpc: "musaex-3nfvp2",
+    kVAEAm: "musaex-1n2onr6",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  }
+};
+var overlay = {
+  base: {
+    kVAEAm: "musaex-10l6tqk",
+    kpwlN0: "musaex-10a8y8t",
+    k1xSpc: "musaex-78zum5",
+    kjj79g: "musaex-l56j7k",
+    kGNEyG: "musaex-6s0dn4",
+    kOIVth: "musaex-1wm2zkp",
+    kWkggS: "musaex-72g52x",
+    kMwMTN: "musaex-1szb5uh",
+    kfSwDN: "musaex-87ps6o",
+    kSiTet: "musaex-1hc1fzr",
+    k1ekBW: "musaex-19991ni",
+    kIyJzY: "musaex-1dg6om",
+    $$css: true
+  },
+  hidden: {
+    kSiTet: "musaex-g01cxk",
+    $$css: true
+  },
+  previewable: {
+    kkrTdU: "musaex-1ypdohk",
+    $$css: true
+  }
+};
+var img = {
+  base: {
+    kzqmXN: "musaex-92755x",
+    kZKoxP: "musaex-qg7gut",
+    kVIFPx: "musaex-l1xv1r",
+    $$css: true
+  }
+};
+var preview = {
+  image: {
+    k3aq6I: "musaex-1jsi7ff",
+    k6sLGO: "musaex-1so62im",
+    k1ekBW: "musaex-11xpdln",
+    kIyJzY: "musaex-1ptezny",
+    kfzvcC: "musaex-67bb7w",
+    $$css: true
+  }
+};
+var operations = {
+  base: {
+    kVAEAm: "musaex-ixxii4",
+    kY2c9j: "musaex-1dx3pxl",
+    $$css: true
+  },
+  closer: {
+    kdh0IS: "musaex-eevl6q",
+    kILoXP: "musaex-75f684",
+    kTCo9J: "musaex-ob9i47",
+    $$css: true
+  },
+  navigations: {
+    kVAEAm: "musaex-ixxii4",
+    kbCHJM: "musaex-u96u03",
+    kCIrl2: "musaex-3m8u43",
+    k87sOh: "musaex-wa60dl",
+    kg3NbH: "musaex-81lxrv",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kjj79g: "musaex-1qughib",
+    kGNEyG: "musaex-6s0dn4",
+    $$css: true
+  },
+  footer: {
+    kVAEAm: "musaex-ixxii4",
+    kbCHJM: "musaex-u96u03",
+    kCIrl2: "musaex-3m8u43",
+    krVfgx: "musaex-vktm6t",
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-dt5ytf",
+    kGNEyG: "musaex-6s0dn4",
+    kMwMTN: "musaex-1j14bxn",
+    $$css: true
+  },
+  handlers: {
+    k1xSpc: "musaex-78zum5",
+    kXwgrk: "musaex-1q0g3np",
+    kOIVth: "musaex-15wobh7",
+    kGNEyG: "musaex-6s0dn4",
+    kWkggS: "musaex-k7eln3",
+    kaIpWk: "musaex-shxsqp",
+    kg3NbH: "musaex-1pyhihf",
+    k8WAf4: "musaex-11owsmz",
+    $$css: true
+  }
+};
+var styles = {
+  image: image,
+  overlay: overlay,
+  img: img,
+  preview: preview,
+  operations: operations
+};
+
+export { styles as default };

package/dist/components/input/__test__/input-appearance.test.d.ts

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

package/dist/components/input/__test__/input.test.d.ts

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

package/dist/components/input/__test__/style-consumers.test.d.ts

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

package/dist/components/input/__test__/style-contract.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/input/context.cjs

@@ -1,14 +1,20 @@
 'use strict';
 
 /**
- * @description
- * class names
+ * @zh Input 组件类名
+ * @en Input component class names
  */
 var CLASS_NAMES = {
   inputor: "input__inputor",
   input: "input",
+  leading: "input__leading",
+  trailing: "input__trailing",
   focused: "input__inputor--focused",
-  invalid: "input__inputor--invalid"
+  invalid: "input__inputor--invalid",
+  outline: "notched-outline",
+  outlineLeading: "notched-outline__leading",
+  outlineNotch: "notched-outline__notch",
+  outlineTrailing: "notched-outline__trailing"
 };
 
 exports.CLASS_NAMES = CLASS_NAMES;

package/dist/components/input/context.d.ts

@@ -1,10 +1,16 @@
 /**
- * @description
- * class names
+ * @zh Input 组件类名
+ * @en Input component class names
  */
 export declare const CLASS_NAMES: {
     inputor: string;
     input: string;
+    leading: string;
+    trailing: string;
     focused: string;
     invalid: string;
+    outline: string;
+    outlineLeading: string;
+    outlineNotch: string;
+    outlineTrailing: string;
 };

package/dist/components/input/context.mjs

@@ -1,12 +1,18 @@
 /**
- * @description
- * class names
+ * @zh Input 组件类名
+ * @en Input component class names
  */
 var CLASS_NAMES = {
   inputor: "input__inputor",
   input: "input",
+  leading: "input__leading",
+  trailing: "input__trailing",
   focused: "input__inputor--focused",
-  invalid: "input__inputor--invalid"
+  invalid: "input__inputor--invalid",
+  outline: "notched-outline",
+  outlineLeading: "notched-outline__leading",
+  outlineNotch: "notched-outline__notch",
+  outlineTrailing: "notched-outline__trailing"
 };
 
 export { CLASS_NAMES };