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

package/dist/components/breadcrumb/item.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 hooks = require('../theme/hooks.cjs');
 var className = require('@aiszlab/relax/class-name');
 var context = require('./context.cjs');
@@ -18,20 +20,9 @@ var Item = function Item(_ref) {
   var _useContext = React.useContext(context.Context),
     classNames = _useContext.classNames;
   var styled = {
-    navigation: {
-      0: {
-        className: "musaex-tem6mo"
-      },
-      1: {
-        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-5nhjnm musaex-1i6b086 musaex-fagghw musaex-1ptezny"
-      }
-    }[!!isLink << 0],
-    separator: {
-      className: "musaex-1erkn4t"
-    },
-    anchor: {
-      className: "musaex-1hl2dhg musaex-1heor9g"
-    }
+    navigation: stylex.props(styles.default.navigation.base, isLink && styles.default.navigation.link),
+    separator: stylex.props(styles.default.separator.base),
+    anchor: stylex.props(styles.default.anchor.base)
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
     className: className.stringify(classNames.item, styled.navigation.className),

package/dist/components/breadcrumb/item.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 { useTheme } from '../theme/hooks.mjs';
 import { stringify } from '@aiszlab/relax/class-name';
 import { Context } from './context.mjs';
@@ -14,20 +16,9 @@ var Item = function Item(_ref) {
   var _useContext = useContext(Context),
     classNames = _useContext.classNames;
   var styled = {
-    navigation: {
-      0: {
-        className: "musaex-tem6mo"
-      },
-      1: {
-        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-5nhjnm musaex-1i6b086 musaex-fagghw musaex-1ptezny"
-      }
-    }[!!isLink << 0],
-    separator: {
-      className: "musaex-1erkn4t"
-    },
-    anchor: {
-      className: "musaex-1hl2dhg musaex-1heor9g"
-    }
+    navigation: props(styles.navigation.base, isLink && styles.navigation.link),
+    separator: props(styles.separator.base),
+    anchor: props(styles.anchor.base)
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
     className: stringify(classNames.item, styled.navigation.className),

package/dist/components/breadcrumb/styles.cjs

@@ -0,0 +1,54 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var navigation = {
+  base: {
+    kDBZe2: "musaex-tem6mo",
+    $$css: true
+  },
+  link: {
+    kg3NbH: "musaex-ipt7de",
+    kaIpWk: "musaex-db68te",
+    kWkggS: "musaex-5nhjnm",
+    kMwMTN: "musaex-1i6b086",
+    k1ekBW: "musaex-fagghw",
+    kIyJzY: "musaex-1ptezny",
+    $$css: true
+  }
+};
+var anchor = {
+  base: {
+    kybGjl: "musaex-1hl2dhg",
+    kMwMTN: "musaex-1heor9g",
+    $$css: true
+  }
+};
+var separator = {
+  base: {
+    kUOVxO: "musaex-1erkn4t",
+    $$css: true
+  }
+};
+var breadcrumb = {
+  base: {
+    kMwMTN: "musaex-bq1wot",
+    $$css: true
+  },
+  navigations: {
+    kogj98: "musaex-q3gua8",
+    kmVPX3: "musaex-1n775ky",
+    kH6xsr: "musaex-3ct3a4",
+    k1xSpc: "musaex-78zum5",
+    kwnvtZ: "musaex-1a02dak",
+    $$css: true
+  }
+};
+var styles = {
+  navigation: navigation,
+  anchor: anchor,
+  separator: separator,
+  breadcrumb: breadcrumb
+};
+
+exports.default = styles;

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

@@ -0,0 +1,45 @@
+declare const styles: {
+    navigation: Readonly<{
+        readonly base: Readonly<{
+            readonly ":last-of-type": import("@stylexjs/stylex").StyleXClassNameFor<":last-of-type", {
+                readonly color: "var(--color-on-surface)";
+            }>;
+        }>;
+        readonly link: Readonly<{
+            readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
+            readonly borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
+            readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", {
+                readonly "@media (hover: hover)": "var(--color-surface)";
+            } | null>;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", {
+                readonly "@media (hover: hover)": "var(--color-on-surface)";
+            } | null>;
+            readonly transitionProperty: import("@stylexjs/stylex").StyleXClassNameFor<"transitionProperty", "all">;
+            readonly transitionDuration: import("@stylexjs/stylex").StyleXClassNameFor<"transitionDuration", string>;
+        }>;
+    }>;
+    anchor: Readonly<{
+        readonly base: Readonly<{
+            readonly textDecoration: import("@stylexjs/stylex").StyleXClassNameFor<"textDecoration", "none">;
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "inherit">;
+        }>;
+    }>;
+    separator: Readonly<{
+        readonly base: Readonly<{
+            readonly marginInline: import("@stylexjs/stylex").StyleXClassNameFor<"marginInline", string>;
+        }>;
+    }>;
+    breadcrumb: Readonly<{
+        readonly base: Readonly<{
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface-variant)">;
+        }>;
+        readonly navigations: Readonly<{
+            readonly margin: import("@stylexjs/stylex").StyleXClassNameFor<"margin", string>;
+            readonly padding: import("@stylexjs/stylex").StyleXClassNameFor<"padding", string>;
+            readonly listStyleType: import("@stylexjs/stylex").StyleXClassNameFor<"listStyleType", "none">;
+            readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
+            readonly flexWrap: import("@stylexjs/stylex").StyleXClassNameFor<"flexWrap", "wrap">;
+        }>;
+    }>;
+};
+export default styles;

package/dist/components/breadcrumb/styles.mjs

@@ -0,0 +1,50 @@
+var navigation = {
+  base: {
+    kDBZe2: "musaex-tem6mo",
+    $$css: true
+  },
+  link: {
+    kg3NbH: "musaex-ipt7de",
+    kaIpWk: "musaex-db68te",
+    kWkggS: "musaex-5nhjnm",
+    kMwMTN: "musaex-1i6b086",
+    k1ekBW: "musaex-fagghw",
+    kIyJzY: "musaex-1ptezny",
+    $$css: true
+  }
+};
+var anchor = {
+  base: {
+    kybGjl: "musaex-1hl2dhg",
+    kMwMTN: "musaex-1heor9g",
+    $$css: true
+  }
+};
+var separator = {
+  base: {
+    kUOVxO: "musaex-1erkn4t",
+    $$css: true
+  }
+};
+var breadcrumb = {
+  base: {
+    kMwMTN: "musaex-bq1wot",
+    $$css: true
+  },
+  navigations: {
+    kogj98: "musaex-q3gua8",
+    kmVPX3: "musaex-1n775ky",
+    kH6xsr: "musaex-3ct3a4",
+    k1xSpc: "musaex-78zum5",
+    kwnvtZ: "musaex-1a02dak",
+    $$css: true
+  }
+};
+var styles = {
+  navigation: navigation,
+  anchor: anchor,
+  separator: separator,
+  breadcrumb: breadcrumb
+};
+
+export { styles as default };

package/dist/components/button/button.cjs

@@ -63,7 +63,7 @@ var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
   var themeColorVars = useThemeColorVars.useThemeColorVars([["on-surface", tokens_stylex.OPACITY.medium], ["on-surface", tokens_stylex.OPACITY.thickest]]);
   var styled = {
-    button: stylex.props(styles.default.button["default"], ripple$1 && styles.default.button.rippleable, styles.default.size[size], styles.default.variant[variant], isDisabled && [styles.default.disabled["default"], styles.default.disabled[variant]],
+    button: stylex.props(styles.default.button.base, ripple$1 && styles.default.button.rippleable, styles.default.size[size], styles.default.variant[variant], isDisabled && [styles.default.disabled.base, styles.default.disabled[variant]],
     // shape styles
     styles.default.shape[shape].medium, styles.default.shape[shape][size],
     // typography

package/dist/components/button/button.mjs

@@ -59,7 +59,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var classNames = useClassNames(CLASS_NAMES);
   var themeColorVars = useThemeColorVars([["on-surface", OPACITY.medium], ["on-surface", OPACITY.thickest]]);
   var styled = {
-    button: props(styles.button["default"], ripple && styles.button.rippleable, styles.size[size], styles.variant[variant], isDisabled && [styles.disabled["default"], styles.disabled[variant]],
+    button: props(styles.button.base, ripple && styles.button.rippleable, styles.size[size], styles.variant[variant], isDisabled && [styles.disabled.base, styles.disabled[variant]],
     // shape styles
     styles.shape[shape].medium, styles.shape[shape][size],
     // typography

package/dist/components/button/styles.cjs

@@ -4,55 +4,106 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var theme = require('../theme/theme.cjs');
 
-var styles = {
-  button: {
-    "default": {
-      k1xSpc: "musaex-3nfvp2",
-      kGNEyG: "musaex-6s0dn4",
-      kjj79g: "musaex-l56j7k",
-      kOIVth: "musaex-1wm2zkp",
-      k1ekBW: "musaex-1yyhn7k",
-      kIyJzY: "musaex-1dg6om",
-      k6sLGO: "musaex-19v51jg",
-      kMzoRj: "musaex-k59kd",
-      kWkggS: "musaex-jbqb8w",
-      kVQacm: "musaex-b3r6kr",
-      khDVqt: "musaex-uxw1ft",
-      kg5iWk: "musaex-lyipyv",
-      kkrTdU: "musaex-1ypdohk",
-      kMv6JI: "musaex-jb2p0i",
-      kB7OPa: "musaex-9f619",
-      kZKoxP: "musaex-g7h5cd",
-      kmuXW: "musaex-2lah0s",
-      $$css: true
-    },
-    rippleable: {
-      kVAEAm: "musaex-1n2onr6",
-      $$css: true
-    }
+var button = {
+  base: {
+    k1xSpc: "musaex-3nfvp2",
+    kGNEyG: "musaex-6s0dn4",
+    kjj79g: "musaex-l56j7k",
+    kOIVth: "musaex-1wm2zkp",
+    k1ekBW: "musaex-1yyhn7k",
+    kIyJzY: "musaex-1dg6om",
+    k6sLGO: "musaex-19v51jg",
+    kMzoRj: "musaex-k59kd",
+    kWkggS: "musaex-jbqb8w",
+    kVQacm: "musaex-b3r6kr",
+    khDVqt: "musaex-uxw1ft",
+    kg5iWk: "musaex-lyipyv",
+    kkrTdU: "musaex-1ypdohk",
+    kMv6JI: "musaex-jb2p0i",
+    kB7OPa: "musaex-9f619",
+    kmuXW: "musaex-2lah0s",
+    $$css: true
   },
-  variant: {
-    filled: {
-      kMzoRj: "musaex-k59kd",
-      kWkggS: "musaex-onffnr",
-      kMwMTN: "musaex-1nt3oiv",
-      kkqDRM: "musaex-52rqan",
-      $$css: true
-    },
-    outlined: {
-      kMzoRj: "musaex-1iyq3db",
-      ksu8eU: "musaex-1y0btm7",
-      kVAM5u: "musaex-1u22kak",
-      kMwMTN: "musaex-erz01e",
-      kHE3J0: "musaex-iy4r31",
-      $$css: true
-    },
-    text: {
-      kMwMTN: "musaex-erz01e",
-      kHE3J0: "musaex-iy4r31",
-      $$css: true
-    }
+  rippleable: {
+    kVAEAm: "musaex-1n2onr6",
+    $$css: true
+  }
+};
+var variant = {
+  filled: {
+    kMzoRj: "musaex-k59kd",
+    kWkggS: "musaex-onffnr",
+    kMwMTN: "musaex-1nt3oiv",
+    kkqDRM: "musaex-52rqan",
+    $$css: true
+  },
+  outlined: {
+    kMzoRj: "musaex-1iyq3db",
+    ksu8eU: "musaex-1y0btm7",
+    kVAM5u: "musaex-1u22kak",
+    kMwMTN: "musaex-erz01e",
+    kHE3J0: "musaex-iy4r31",
+    $$css: true
+  },
+  text: {
+    kMwMTN: "musaex-erz01e",
+    kHE3J0: "musaex-iy4r31",
+    $$css: true
+  }
+};
+var size = {
+  xsmall: {
+    kZKoxP: "musaex-1si1pn3",
+    kg3NbH: "musaex-81lxrv",
+    $$css: true
+  },
+  small: {
+    kZKoxP: "musaex-12ez60q",
+    kg3NbH: "musaex-1v4gb6w",
+    $$css: true
+  },
+  medium: {
+    kZKoxP: "musaex-1s2k5h2",
+    kg3NbH: "musaex-1pyhihf",
+    $$css: true
+  },
+  large: {
+    kZKoxP: "musaex-1nrwtz4",
+    kg3NbH: "musaex-116ub19",
+    $$css: true
+  },
+  xlarge: {
+    kZKoxP: "musaex-1do9ykw",
+    kg3NbH: "musaex-sxb18w",
+    $$css: true
+  }
+};
+var disabled = {
+  base: {
+    kMwMTN: "musaex-1ldep6k",
+    kkrTdU: "musaex-1h6gzvc",
+    kGVxlE: null,
+    kVAM5u: null,
+    kWkggS: null,
+    kkqDRM: null,
+    $$css: true
+  },
+  filled: {
+    kWkggS: "musaex-1j73dxc",
+    $$css: true
+  },
+  outlined: {
+    kVAM5u: "musaex-1edbmam",
+    $$css: true
   },
+  text: {
+    kHE3J0: null,
+    $$css: true
+  }
+};
+var styles = {
+  button: button,
+  variant: variant,
   shape: {
     round: {
       medium: {
@@ -83,56 +134,8 @@ var styles = {
       }
     }
   },
-  size: {
-    xsmall: {
-      k8WAf4: "musaex-1nsg7hs",
-      kg3NbH: "musaex-81lxrv",
-      $$css: true
-    },
-    small: {
-      k8WAf4: "musaex-bge23m",
-      kg3NbH: "musaex-1v4gb6w",
-      $$css: true
-    },
-    medium: {
-      k8WAf4: "musaex-1aur8i7",
-      kg3NbH: "musaex-1pyhihf",
-      $$css: true
-    },
-    large: {
-      k8WAf4: "musaex-gr5jxa",
-      kg3NbH: "musaex-116ub19",
-      $$css: true
-    },
-    xlarge: {
-      k8WAf4: "musaex-1a4cq7x",
-      kg3NbH: "musaex-sxb18w",
-      $$css: true
-    }
-  },
-  disabled: {
-    "default": {
-      kMwMTN: "musaex-1ldep6k",
-      kkrTdU: "musaex-1h6gzvc",
-      kGVxlE: null,
-      kVAM5u: null,
-      kWkggS: null,
-      kkqDRM: null,
-      $$css: true
-    },
-    filled: {
-      kWkggS: "musaex-1j73dxc",
-      $$css: true
-    },
-    outlined: {
-      kVAM5u: "musaex-1edbmam",
-      $$css: true
-    },
-    text: {
-      kHE3J0: null,
-      $$css: true
-    }
-  }
+  size: size,
+  disabled: disabled
 };
 /**
  * `Button` `Typography`

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

@@ -1,8 +1,8 @@
 import { type CompiledStyles, type StyleXArray } from "@stylexjs/stylex";
-import type { Size } from "../../types/button";
+import { Size } from "../../types/button";
 declare const styles: {
     button: Readonly<{
-        readonly default: Readonly<{
+        readonly base: Readonly<{
             readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "inline-flex">;
             readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
             readonly justifyContent: import("@stylexjs/stylex").StyleXClassNameFor<"justifyContent", "center">;
@@ -18,7 +18,6 @@ declare const styles: {
             readonly cursor: import("@stylexjs/stylex").StyleXClassNameFor<"cursor", "pointer">;
             readonly fontFamily: import("@stylexjs/stylex").StyleXClassNameFor<"fontFamily", "inherit">;
             readonly boxSizing: import("@stylexjs/stylex").StyleXClassNameFor<"boxSizing", "border-box">;
-            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", "fit-content">;
             readonly flexShrink: import("@stylexjs/stylex").StyleXClassNameFor<"flexShrink", 0>;
         }>;
         readonly rippleable: Readonly<{
@@ -58,16 +57,16 @@ declare const styles: {
     }>;
     shape: {
         round: Readonly<{
-            xsmall?: Readonly<{
+            medium?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
             small?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
-            medium?: Readonly<{
+            large?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
-            large?: Readonly<{
+            xsmall?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
             xlarge?: Readonly<{
@@ -75,16 +74,16 @@ declare const styles: {
             } | undefined>;
         }>;
         square: Readonly<{
-            xsmall?: Readonly<{
+            medium?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
             small?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
-            medium?: Readonly<{
+            large?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
-            large?: Readonly<{
+            xsmall?: Readonly<{
                 borderRadius: import("@stylexjs/stylex").StyleXClassNameFor<"borderRadius", string>;
             } | undefined>;
             xlarge?: Readonly<{
@@ -94,28 +93,28 @@ declare const styles: {
     };
     size: Readonly<{
         readonly xsmall: Readonly<{
-            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
             readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
         }>;
         readonly small: Readonly<{
-            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
             readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
         }>;
         readonly medium: Readonly<{
-            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
             readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
         }>;
         readonly large: Readonly<{
-            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
             readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
         }>;
         readonly xlarge: Readonly<{
-            readonly paddingBlock: import("@stylexjs/stylex").StyleXClassNameFor<"paddingBlock", string>;
+            readonly height: import("@stylexjs/stylex").StyleXClassNameFor<"height", string>;
             readonly paddingInline: import("@stylexjs/stylex").StyleXClassNameFor<"paddingInline", string>;
         }>;
     }>;
     disabled: Readonly<{
-        readonly default: Readonly<{
+        readonly base: Readonly<{
             readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface-opacity-38)">;
             readonly cursor: import("@stylexjs/stylex").StyleXClassNameFor<"cursor", "not-allowed">;
             readonly boxShadow: import("@stylexjs/stylex").StyleXClassNameFor<"boxShadow", null>;