musae 0.3.2 → 0.3.3

package/dist/components/notification/notifier.d.ts

@@ -1,4 +1,4 @@
-import type { NotificationConfig, TypedNotification } from "./types";
+import type { NotificationConfig, TypedNotification } from "musae/types/notification";
 export declare class Notifier {
     #private;
     constructor();

package/dist/components/number-input/number-input.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { NumberInputProps } from "./types";
+import type { NumberInputProps } from "musae/types/number-input";
 declare const NumberInput: ({ value: __value, formatter: _formatter }: NumberInputProps) => React.JSX.Element;
 export default NumberInput;

package/dist/components/otp-input/otp-input.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { OtpInputProps } from "./types";
+import type { OtpInputProps } from "musae/types/otp-input";
 declare const OtpInput: ({ length, onChange, value: _value }: OtpInputProps) => React.JSX.Element;
 export default OtpInput;

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

@@ -1,2 +1,2 @@
-import { ContextValue } from "../../types/picker";
+import type { ContextValue } from "musae/types/picker";
 export declare const Context: import("react").Context<ContextValue>;

package/dist/components/picker/picker.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { PickerProps, PickerRef } from "../../types/picker";
+import type { PickerProps, PickerRef } from "musae/types/picker";
 declare const Picker: React.ForwardRefExoticComponent<PickerProps & React.RefAttributes<PickerRef>>;
 export default Picker;

package/dist/components/popconfirm/popconfirm.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { PopconfirmProps, ChildProps } from "./types";
+import type { PopconfirmProps, ChildProps } from "musae/types/popconfirm";
 declare const Popconfirm: <P extends ChildProps<T>, T extends HTMLElement>({ content, title, onConfirm, onCancel, className, placement, children: _children, style, }: PopconfirmProps<P, T>) => React.JSX.Element;
 export default Popconfirm;

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

@@ -1,4 +1,4 @@
-import { type PopperRef } from "../popper";
+import type { PopperRef } from "musae/types/popper";
 type UsedIsOpen = [
     boolean,
     {

package/dist/components/popover/index.d.ts

@@ -1,4 +1,4 @@
 import Popover from "./popover";
-import type { PopoverProps, PopoverRef } from "./types";
+import type { PopoverProps, PopoverRef } from "musae/types/popover";
 export { Popover };
 export type { PopoverProps, PopoverRef };

package/dist/components/popover/popover.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { ChildProps, PopoverRef } from "./types";
+import type { ChildProps, PopoverRef } from "musae/types/popover";
 declare const Popover: React.ForwardRefExoticComponent<import("../../types/element").ComponentProps & {
     children: React.ReactElement<ChildProps<HTMLElement>, string | React.JSXElementConstructor<any>>;
     title?: React.ReactNode;

package/dist/components/popper/dropdown.cjs

@@ -35,9 +35,6 @@ var styles = {
         borderTopRightRadius: null,
         borderBottomLeftRadius: null,
         borderBottomRightRadius: null,
-        overflow: "musaex-ysyzu8",
-        overflowX: null,
-        overflowY: null,
         willChange: "musaex-19wnzia",
         $$css: true
       }, {

package/dist/components/popper/dropdown.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { PopperRef } from "./types";
-declare const Dropdown: React.ForwardRefExoticComponent<Omit<import("./types").PopperProps, "container" | "placement" | "portal"> & {
+import type { PopperRef } from "musae/types/popper";
+declare const Dropdown: React.ForwardRefExoticComponent<Omit<import("musae/types/popper").PopperProps, "container" | "placement" | "portal"> & {
     placement: import("@floating-ui/dom").Placement;
 } & React.RefAttributes<PopperRef>>;
 export default Dropdown;

package/dist/components/popper/dropdown.mjs

@@ -33,9 +33,6 @@ var styles = {
         borderTopRightRadius: null,
         borderBottomLeftRadius: null,
         borderBottomRightRadius: null,
-        overflow: "musaex-ysyzu8",
-        overflowX: null,
-        overflowY: null,
         willChange: "musaex-19wnzia",
         $$css: true
       }, {

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

@@ -1,4 +1,4 @@
-import type { DropdownProps, PopperProps } from "./types";
+import type { DropdownProps, PopperProps } from "musae/types/popper";
 /**
  * @description
  * offset converter

package/dist/components/popper/index.d.ts

@@ -1,4 +1,2 @@
 import Popper from "./popper";
-import type { PopperRef } from "./types";
 export { Popper };
-export type { PopperRef };

package/dist/components/popper/popper.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { PopperProps, PopperRef } from "./types";
+import type { PopperProps, PopperRef } from "musae/types/popper";
 declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<PopperRef>>;
 export default Popper;

package/dist/components/portal/portal.d.ts

@@ -1,4 +1,4 @@
-import type { PortalProps } from "./types";
+import type { PortalProps } from "musae/types/portal";
 import { type FC } from "react";
 declare const Portal: FC<PortalProps>;
 export default Portal;

package/dist/components/progress/circular.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { CircularProps } from "./types";
+import { CircularProps } from "musae/types/progress";
 declare const Circular: ({ value: _value, className, style }: CircularProps) => React.JSX.Element;
 export default Circular;

package/dist/components/progress/linear.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { LinearProps } from "./types";
+import type { LinearProps } from "musae/types/progress";
 declare const Linear: ({ value: _value, className, style }: LinearProps) => React.JSX.Element;
 export default Linear;

package/dist/components/progress/progress.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { ProgressProps } from "./types";
+import type { ProgressProps } from "musae/types/progress";
 declare const Progress: ({ variant, value }: ProgressProps) => React.JSX.Element;
 export default Progress;

package/dist/components/quote/quote.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { QuoteProps } from "./types";
+import { QuoteProps } from "musae/types/quote";
 declare const Quote: ({ className, children, style }: QuoteProps) => React.JSX.Element;
 export default Quote;

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

@@ -1,3 +1,3 @@
-import type { ContextValue } from "./types";
+import type { ContextValue } from "musae/types/radio";
 declare const Context: import("react").Context<ContextValue | null>;
 export default Context;

package/dist/components/radio/group.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { RadioGroupProps } from "./types";
+import type { RadioGroupProps } from "musae/types/radio";
 declare const Group: ({ disabled, children, ...props }: RadioGroupProps) => React.JSX.Element;
 export default Group;

package/dist/components/radio/index.d.ts

@@ -1,2 +1,2 @@
-import type { TypedRadio } from "./types";
+import type { TypedRadio } from "musae/types/radio";
 export declare const Radio: TypedRadio;

package/dist/components/radio/radio.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { RadioProps } from "./types";
+import type { RadioProps } from "musae/types/radio";
 declare const Radio: ({ children, value, checked, disabled, ...props }: RadioProps) => React.JSX.Element;
 export default Radio;

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

@@ -1,4 +1,4 @@
-import type { RateProps } from "./types";
+import type { RateProps } from "musae/types/rate";
 /**
  * @description
  * value hooks

package/dist/components/rate/rate.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { RateProps } from "./types";
+import type { RateProps } from "musae/types/rate";
 declare const Rate: ({ count, className, style, halfable, disabled, ...props }: RateProps) => React.JSX.Element;
 export default Rate;

package/dist/components/rate/star.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { StarProps } from "./types";
+import type { StarProps } from "musae/types/rate";
 declare const Star: ({ disabled, value, onEnter, at, onLeave, onClick }: StarProps) => React.JSX.Element;
 export default Star;

package/dist/components/rich-text-editor/dropdown.cjs

@@ -61,7 +61,7 @@ var Dropdown = function Dropdown(_ref) {
     return /*#__PURE__*/React.createElement(menu.default, {
       items: items,
       onClick: onClick,
-      selectedKeys: relax.toArray(value)
+      selectedKeys: value
     });
   }, [items, onClick, value]);
   return /*#__PURE__*/React.createElement(popover.default, {

package/dist/components/rich-text-editor/dropdown.d.ts

@@ -1,4 +1,4 @@
 import React, { type Key } from "react";
-import { DropdownProps } from "../../types/rich-text-editor";
+import type { DropdownProps } from "musae/types/rich-text-editor";
 declare const Dropdown: <T extends Key = React.Key>({ items: _items, value: _value, onChange, children, }: DropdownProps<T>) => React.JSX.Element;
 export default Dropdown;

package/dist/components/rich-text-editor/dropdown.mjs

@@ -59,7 +59,7 @@ var Dropdown = function Dropdown(_ref) {
     return /*#__PURE__*/React.createElement(Menu, {
       items: items,
       onClick: onClick,
-      selectedKeys: toArray(value)
+      selectedKeys: value
     });
   }, [items, onClick, value]);
   return /*#__PURE__*/React.createElement(Popover, {

package/dist/components/rich-text-editor/index.cjs

@@ -1,13 +1,31 @@
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
+var skeleton = require('../skeleton/skeleton.cjs');
+var useClassNames = require('../../hooks/use-class-names.cjs');
+var componentToken = require('../../utils/component-token.cjs');
+var relax = require('@aiszlab/relax');
+var className = require('../../utils/class-name.cjs');
 
+var _excluded = ["className"];
 var _RichTextEditor = /*#__PURE__*/React.lazy(function () {
   return Promise.resolve().then(function () { return require('./rich-text-editor.cjs'); });
 });
-var RichTextEditor = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var RichTextEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var className$1 = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var styled = {
+    className: "musaex-h22aca musaex-1k094eu musaex-qwu505"
+  };
+  var classNames = useClassNames.useClassNames(componentToken.ComponentToken.RichTextEditor);
   return /*#__PURE__*/React.createElement(React.Suspense, {
-    fallback: /*#__PURE__*/React.createElement("div", null, "Loading...")
+    fallback: /*#__PURE__*/React.createElement(skeleton.default, {
+      animation: true,
+      className: relax.clsx(classNames[className.RichTextEditorClassToken.Loading], styled.className),
+      style: styled.style
+    })
   }, /*#__PURE__*/React.createElement(_RichTextEditor, _objectSpread(_objectSpread({}, props), {}, {
+    className: relax.clsx(classNames[className.RichTextEditorClassToken.RichTextEditor], className$1),
     ref: ref
   })));
 });

package/dist/components/rich-text-editor/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import type { RichTextEditorRef } from "musae/types/rich-text-editor";
-declare const RichTextEditor: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement>, "aria-placeholder"> & {
+declare const RichTextEditor: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement>, "aria-placeholder"> & import("../../types/element").ComponentProps & {
     placeholder?: import("@lexical/react/LexicalContentEditable").Props["placeholder"];
     disabled?: boolean;
     defaultValue?: string;

package/dist/components/rich-text-editor/index.mjs

@@ -1,13 +1,31 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { forwardRef, Suspense, createElement, lazy } from 'react';
+import Skeleton from '../skeleton/skeleton.mjs';
+import { useClassNames } from '../../hooks/use-class-names.mjs';
+import { ComponentToken } from '../../utils/component-token.mjs';
+import { clsx } from '@aiszlab/relax';
+import { RichTextEditorClassToken } from '../../utils/class-name.mjs';
 
+var _excluded = ["className"];
 var _RichTextEditor = /*#__PURE__*/lazy(function () {
   return import('./rich-text-editor.mjs');
 });
-var RichTextEditor = /*#__PURE__*/forwardRef(function (props, ref) {
+var RichTextEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var styled = {
+    className: "musaex-h22aca musaex-1k094eu musaex-qwu505"
+  };
+  var classNames = useClassNames(ComponentToken.RichTextEditor);
   return /*#__PURE__*/React.createElement(Suspense, {
-    fallback: /*#__PURE__*/React.createElement("div", null, "Loading...")
+    fallback: /*#__PURE__*/React.createElement(Skeleton, {
+      animation: true,
+      className: clsx(classNames[RichTextEditorClassToken.Loading], styled.className),
+      style: styled.style
+    })
   }, /*#__PURE__*/createElement(_RichTextEditor, _objectSpread(_objectSpread({}, props), {}, {
+    className: clsx(classNames[RichTextEditorClassToken.RichTextEditor], className),
     ref: ref
   })));
 });

package/dist/components/rich-text-editor/plugins/controlled-state/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { Use } from "../../../../types/rich-text-editor";
+import type { Use } from "musae/types/rich-text-editor";
 interface Props {
     value?: string;
     onChange?: (value: string) => void;

package/dist/components/rich-text-editor/rich-text-editor.cjs

@@ -1,5 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
@@ -31,7 +32,7 @@ require('../checkbox/index.cjs');
 var markdown = require('@lexical/markdown');
 var styles$1 = require('../checkbox/styles.cjs');
 
-var _excluded = ["placeholder", "disabled", "defaultValue", "onChange", "value"];
+var _excluded = ["placeholder", "disabled", "defaultValue", "onChange", "value", "className", "style"];
 var styles = {
   shell: function shell(props) {
     return [{
@@ -81,7 +82,9 @@ var RichTextEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     defaultValue = _ref.defaultValue,
     onChange = _ref.onChange;
     _ref.value;
-    var props = _objectWithoutProperties(_ref, _excluded);
+    var className = _ref.className,
+    style = _ref.style,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _useIdentity = relax.useIdentity(),
     _useIdentity2 = _slicedToArray(_useIdentity, 1),
     id = _useIdentity2[0];
@@ -105,7 +108,7 @@ var RichTextEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       codeBackgroundColor: theme$1.colors[colors.ColorToken.SurfaceContainerHighest]
     })),
     editor: {
-      className: "musaex-1a2a7pz musaex-y0sash musaex-1vgzror musaex-igxgg9 musaex-1y06zzy"
+      className: "musaex-1a2a7pz musaex-y0sash musaex-1vgzror musaex-igxgg9 musaex-ktxt4i"
     },
     h1: stylex.default.props(theme.typography.display.large),
     h2: stylex.default.props(theme.typography.display.medium),
@@ -195,8 +198,8 @@ var RichTextEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   return /*#__PURE__*/React.createElement(LexicalComposer.LexicalComposer, {
     initialConfig: initialConfig
   }, /*#__PURE__*/React.createElement("div", {
-    className: styled.shell.className,
-    style: styled.shell.style
+    className: relax.clsx(className, styled.shell.className),
+    style: _objectSpread(_objectSpread({}, styled.shell.style), style)
   }, !disabled && /*#__PURE__*/React.createElement(index$1.default, null), /*#__PURE__*/React.createElement(LexicalRichTextPlugin.RichTextPlugin, {
     contentEditable: /*#__PURE__*/React.createElement(LexicalContentEditable.ContentEditable, {
       className: styled.editor.className,

package/dist/components/rich-text-editor/rich-text-editor.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import type { RichTextEditorRef } from "musae/types/rich-text-editor";
-declare const RichTextEditor: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement>, "aria-placeholder"> & {
+declare const RichTextEditor: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement>, "aria-placeholder"> & import("../../types/element").ComponentProps & {
     placeholder?: import("@lexical/react/LexicalContentEditable").Props["placeholder"];
     disabled?: boolean;
     defaultValue?: string;

package/dist/components/rich-text-editor/rich-text-editor.mjs

@@ -1,3 +1,4 @@
+import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
@@ -11,7 +12,7 @@ import { ClickableLinkPlugin } from '@lexical/react/LexicalClickableLinkPlugin';
 import { ListPlugin } from '@lexical/react/LexicalListPlugin';
 import CheckListPlugin from './plugins/check-list/index.mjs';
 import ControlledStatePlugin from './plugins/controlled-state/index.mjs';
-import { useIdentity, useDefault } from '@aiszlab/relax';
+import { useIdentity, useDefault, clsx } from '@aiszlab/relax';
 import { useMessage } from '../message/hooks.mjs';
 import _stylex from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { useTheme } from '../theme/hooks.mjs';
@@ -29,7 +30,7 @@ import '../checkbox/index.mjs';
 import { $convertFromMarkdownString } from '@lexical/markdown';
 import styles$1 from '../checkbox/styles.mjs';
 
-var _excluded = ["placeholder", "disabled", "defaultValue", "onChange", "value"];
+var _excluded = ["placeholder", "disabled", "defaultValue", "onChange", "value", "className", "style"];
 var styles = {
   shell: function shell(props) {
     return [{
@@ -79,7 +80,9 @@ var RichTextEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
     defaultValue = _ref.defaultValue,
     onChange = _ref.onChange;
     _ref.value;
-    var props = _objectWithoutProperties(_ref, _excluded);
+    var className = _ref.className,
+    style = _ref.style,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _useIdentity = useIdentity(),
     _useIdentity2 = _slicedToArray(_useIdentity, 1),
     id = _useIdentity2[0];
@@ -103,7 +106,7 @@ var RichTextEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
       codeBackgroundColor: theme.colors[ColorToken.SurfaceContainerHighest]
     })),
     editor: {
-      className: "musaex-1a2a7pz musaex-y0sash musaex-1vgzror musaex-igxgg9 musaex-1y06zzy"
+      className: "musaex-1a2a7pz musaex-y0sash musaex-1vgzror musaex-igxgg9 musaex-ktxt4i"
     },
     h1: _stylex.props(typography.display.large),
     h2: _stylex.props(typography.display.medium),
@@ -193,8 +196,8 @@ var RichTextEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
   return /*#__PURE__*/React.createElement(LexicalComposer, {
     initialConfig: initialConfig
   }, /*#__PURE__*/React.createElement("div", {
-    className: styled.shell.className,
-    style: styled.shell.style
+    className: clsx(className, styled.shell.className),
+    style: _objectSpread(_objectSpread({}, styled.shell.style), style)
   }, !disabled && /*#__PURE__*/React.createElement(ToolbarPlugin, null), /*#__PURE__*/React.createElement(RichTextPlugin, {
     contentEditable: /*#__PURE__*/React.createElement(ContentEditable, {
       className: styled.editor.className,

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

@@ -1,5 +1,5 @@
 import { type MouseEvent, type Key } from "react";
-import type { Ripple } from "./types";
+import type { Ripple } from "musae/types/ripple";
 export declare function useRipple(): {
     ripples: Ripple[];
     add: (event: MouseEvent<HTMLElement>) => void;

package/dist/components/ripple/ripple.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { RippleProps } from "./types";
+import { RippleProps } from "musae/types/ripple";
 declare const Ripple: ({ ripples, onClear }: RippleProps) => React.JSX.Element[];
 export default Ripple;

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

@@ -1,5 +1,5 @@
 import { type Key } from "react";
-import type { Mode, ReadableOptions, SelectProps, ValueOrValues } from "../../types/select";
+import type { Mode, ReadableOptions, SelectProps, ValueOrValues } from "musae/types/select";
 import type { Option } from "musae/types/option";
 /**
  * @description

package/dist/components/select/select.cjs

@@ -66,12 +66,15 @@ var Select = function Select(_ref) {
       className: "musaex-1pgy25r"
     }
   };
+  var selectedKeys = React.useMemo(function () {
+    return Array.from(readableValues.keys());
+  }, [readableValues]);
   return /*#__PURE__*/React.createElement(picker.default, _objectSpread({
     ref: ref,
     pickable: /*#__PURE__*/React.createElement(selections.default, {
       items: menuItems,
       onSelect: onChange,
-      selectedKeys: Array.from(readableValues.keys())
+      selectedKeys: selectedKeys
     }),
     className: relax.clsx(classNames[className.SelectClassToken.Select], className$1, styled.picker.className),
     style: _objectSpread(_objectSpread({}, styled.picker.style), style),

package/dist/components/select/select.mjs

@@ -1,5 +1,5 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import React, { useRef, useCallback } from 'react';
+import React, { useRef, useCallback, useMemo } from 'react';
 import Picker from '../picker/picker.mjs';
 import { useOptions, useValue } from './hooks.mjs';
 import { SelectClassToken } from '../../utils/class-name.mjs';
@@ -64,12 +64,15 @@ var Select = function Select(_ref) {
       className: "musaex-1pgy25r"
     }
   };
+  var selectedKeys = useMemo(function () {
+    return Array.from(readableValues.keys());
+  }, [readableValues]);
   return /*#__PURE__*/React.createElement(Picker, _objectSpread({
     ref: ref,
     pickable: /*#__PURE__*/React.createElement(Selections, {
       items: menuItems,
       onSelect: onChange,
-      selectedKeys: Array.from(readableValues.keys())
+      selectedKeys: selectedKeys
     }),
     className: clsx(classNames[SelectClassToken.Select], className, styled.picker.className),
     style: _objectSpread(_objectSpread({}, styled.picker.style), style),

package/dist/components/select/selections.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { SelectionsProps } from "../../types/select";
+import type { SelectionsProps } from "musae/types/select";
 /**
  * @description
  * just display the selections for user selectable like options

package/dist/components/select/selector.d.ts

@@ -1,4 +1,4 @@
 import { type ForwardRefExoticComponent, type PropsWithoutRef, type RefAttributes } from "react";
-import type { SelectorProps, SelectorRef } from "../../types/select";
+import type { SelectorProps, SelectorRef } from "musae/types/select";
 declare const Selector: ForwardRefExoticComponent<PropsWithoutRef<SelectorProps> & RefAttributes<SelectorRef>>;
 export default Selector;

package/dist/components/select/utils.d.ts

@@ -1,4 +1,4 @@
-import type { Filter, ReadableOptions, ToMenuItem, Value, ValueOrValues } from "../../types/select";
+import type { Filter, ReadableOptions, ToMenuItem, Value, ValueOrValues } from "musae/types/select";
 import type { Option } from "musae/types/option";
 import type { MenuItem } from "musae/types/menu";
 /**

package/dist/components/skeleton/skeleton.cjs

@@ -6,9 +6,22 @@ var React = require('react');
 var useClassNames = require('../../hooks/use-class-names.cjs');
 var className = require('../../utils/class-name.cjs');
 var relax = require('@aiszlab/relax');
+var tokens_stylex = require('../theme/tokens.stylex.cjs');
 var componentToken = require('../../utils/component-token.cjs');
+var hooks = require('../theme/hooks.cjs');
+var colors = require('../../utils/colors.cjs');
 
 var styles = {
+  variables: function variables(props) {
+    return [{
+      "--shadow": "musaex-36wvql",
+      "--lighter-shadow": "musaex-p8ugqh",
+      $$css: true
+    }, {
+      "----shadow": props.shadow != null ? props.shadow : "initial",
+      "----lighter-shadow": props.lighterShadow != null ? props.lighterShadow : "initial"
+    }];
+  },
   title: {
     width: "musaex-1fvqbsf",
     height: "musaex-1bti5vo",
@@ -52,7 +65,7 @@ var styles = {
     $$css: true
   },
   skeleton: {
-    background: "musaex-1csrv2e",
+    background: "musaex-uwpeme",
     backgroundAttachment: null,
     backgroundClip: null,
     backgroundColor: null,
@@ -66,7 +79,7 @@ var styles = {
     $$css: true
   },
   animation: {
-    background: "musaex-1jvh8g2",
+    background: "musaex-1br516c",
     backgroundAttachment: null,
     backgroundClip: null,
     backgroundColor: null,
@@ -91,7 +104,11 @@ var Skeleton = function Skeleton(_ref) {
     className$1 = _ref.className,
     style = _ref.style;
   var classNames = useClassNames.useClassNames(componentToken.ComponentToken.Skeleton);
-  var styled = stylex.default.props(!!variant && styles[variant], animation && styles.animation);
+  var theme = hooks.useTheme();
+  var styled = stylex.default.props(styles.variables({
+    shadow: colors.toRgba(theme.colors.shadow, tokens_stylex.OPACITY.thin),
+    lighterShadow: colors.toRgba(theme.colors.shadow, tokens_stylex.OPACITY.thick)
+  }), !!variant && styles[variant], animation && styles.animation);
   return /*#__PURE__*/React.createElement("div", {
     className: relax.clsx(classNames[className.SkeletonClassToken.Skeleton], className$1, styled.className),
     style: _objectSpread(_objectSpread({}, styled.style), style)

package/dist/components/skeleton/skeleton.d.ts

@@ -1,4 +1,4 @@
-import type { SkeletonProps } from "./types";
+import type { SkeletonProps } from "musae/types/skeleton";
 import React from "react";
 declare const Skeleton: ({ animation, variant, className, style }: SkeletonProps) => React.JSX.Element;
 export default Skeleton;