@seed-design/react 1.1.17 → 1.2.0

package/lib/components/ImageFrame/ImageFrame.js

@@ -0,0 +1,129 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { imageFrame } from '@seed-design/css/recipes/image-frame';
+import { imageFrameIcon } from '@seed-design/css/recipes/image-frame-icon';
+import { imageFrameIndicator } from '@seed-design/css/recipes/image-frame-indicator';
+import { imageFrameReactionButton } from '@seed-design/css/recipes/image-frame-reaction-button';
+import { imageFrameFloater } from '@seed-design/css/vars/component';
+import { Image } from '@seed-design/react-image';
+import { Toggle } from '@seed-design/react-toggle';
+import clsx from 'clsx';
+import * as React from 'react';
+import { AspectRatio } from '../AspectRatio/AspectRatio.js';
+import { Badge } from '../Badge/Badge.js';
+import { Float } from '../Float/Float.js';
+import { Icon } from '../Icon/Icon.js';
+
+const ImageFrame = React.forwardRef(
+  ({
+    ratio = 4 / 3,
+    rounded,
+    stroke,
+    src,
+    alt,
+    fallback,
+    className,
+    loading,
+    decoding,
+    crossOrigin,
+    referrerPolicy,
+    sizes,
+    srcSet,
+    onLoad,
+    onError,
+    children,
+    ...rest
+  }, ref) => {
+    return /* @__PURE__ */ jsx(AspectRatio, { ref, ratio, className, ...rest, children: /* @__PURE__ */ jsxs(Image.Root, { className: imageFrame({ rounded, stroke }), children: [
+      /* @__PURE__ */ jsx(
+        Image.Content,
+        {
+          src,
+          alt,
+          loading,
+          decoding,
+          crossOrigin,
+          referrerPolicy,
+          sizes,
+          srcSet,
+          onLoad,
+          onError
+        }
+      ),
+      fallback && /* @__PURE__ */ jsx(Image.Fallback, { children: fallback }),
+      children
+    ] }) });
+  }
+);
+ImageFrame.displayName = "ImageFrame";
+const ImageFrameFloater = React.forwardRef(
+  ({
+    offsetX = imageFrameFloater.base.enabled.root.offset,
+    offsetY = imageFrameFloater.base.enabled.root.offset,
+    ...rest
+  }, ref) => {
+    return /* @__PURE__ */ jsx(Float, { ref, offsetX, offsetY, ...rest });
+  }
+);
+ImageFrameFloater.displayName = "ImageFrameFloater";
+const ImageFrameBadge = React.forwardRef(
+  (props, ref) => {
+    return /* @__PURE__ */ jsx(Badge, { ref, ...props });
+  }
+);
+ImageFrameBadge.displayName = "ImageFrameBadge";
+const ImageFrameIcon = React.forwardRef(
+  ({ svg, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsx("span", { ref, className: clsx(imageFrameIcon(), className), ...rest, children: /* @__PURE__ */ jsx(Icon, { svg }) });
+  }
+);
+ImageFrameIcon.displayName = "ImageFrameIcon";
+const ImageFrameIndicator = React.forwardRef(
+  ({ children, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsx("span", { ref, className: clsx(imageFrameIndicator(), className), ...rest, children });
+  }
+);
+ImageFrameIndicator.displayName = "ImageFrameIndicator";
+const HeartFillPath = "M15.5452 10C11.7873 10 9.25 12.9484 9.25 16.6267C9.25 19.8754 11.1219 22.0952 13.1877 23.969C13.7807 24.5069 14.4438 25.0617 15.095 25.6066C15.5434 25.9817 15.9862 26.3522 16.3967 26.7093C17.4501 27.6257 18.4191 28.557 19.1995 29.5994C19.3886 29.8518 19.6856 30.0003 20.001 30C20.3163 29.9997 20.6131 29.8507 20.8016 29.5979C21.5785 28.5562 22.5453 27.6253 23.598 26.7091C24.0105 26.35 24.4568 25.9766 24.9089 25.5984C25.5573 25.0559 26.2176 24.5035 26.807 23.9693C28.8739 22.096 30.75 19.8761 30.75 16.6267C30.75 12.9484 28.2127 10 24.4548 10C22.6365 10 21.1002 11.0545 20 12.4906C18.8998 11.0545 17.3635 10 15.5452 10Z";
+const HeartOutlineStrokePath = "M15.5452 12C13.0342 12 11.25 13.905 11.25 16.6267C11.25 18.9912 12.5659 20.7048 14.5314 22.4876C15.1157 23.0176 15.7038 23.5087 16.3148 24.019C16.7646 24.3946 17.2269 24.7807 17.7093 25.2003C18.4947 25.8835 19.2814 26.6141 19.9988 27.4215C20.7144 26.614 21.5001 25.8836 22.2849 25.2005C22.7714 24.7771 23.2368 24.3885 23.6895 24.0105C24.2967 23.5035 24.8813 23.0154 25.4639 22.4874C27.4317 20.704 28.75 18.9906 28.75 16.6267C28.75 13.905 26.9658 12 24.4548 12C23.069 12 21.747 12.8325 20.8919 14.5189C20.7215 14.8549 20.3768 15.0667 20 15.0667C19.6233 15.0667 19.2785 14.8549 19.1081 14.5189C18.2531 12.8325 16.931 12 15.5452 12ZM9.25 16.6267C9.25 12.9484 11.7873 10 15.5452 10C17.3146 10 18.8683 10.8364 20 12.2306C21.1317 10.8364 22.6854 10 24.4548 10C28.2127 10 30.75 12.9484 30.75 16.6267C30.75 19.8761 28.8739 22.096 26.807 23.9693C26.2176 24.5035 25.5573 25.0559 24.9089 25.5984C24.4568 25.9766 24.0105 26.35 23.598 26.7091C22.5453 27.6253 21.5785 28.5562 20.8016 29.5979C20.6131 29.8507 20.3163 29.9997 20.001 30C19.6856 30.0003 19.3886 29.8518 19.1995 29.5994C18.4191 28.557 17.4501 27.6257 16.3967 26.7093C15.9862 26.3522 15.5434 25.9817 15.095 25.6066C14.4438 25.0617 13.7807 24.5069 13.1877 23.969C11.1219 22.0952 9.25 19.8754 9.25 16.6267Z";
+const UnselectedHeartIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [
+  /* @__PURE__ */ jsx("path", { d: HeartFillPath, fill: "black", fillOpacity: "0.063" }),
+  /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: HeartOutlineStrokePath, fill: "white" })
+] });
+const SelectedHeartIcon = () => {
+  const id = React.useId();
+  const gradientId = `seed-heart-gradient${id.replace(/:/g, "")}`;
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: HeartFillPath, fill: `url(#${gradientId})` }),
+    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
+      "linearGradient",
+      {
+        id: gradientId,
+        x1: "7",
+        y1: "8.5",
+        x2: "26.0974",
+        y2: "10.5391",
+        gradientUnits: "userSpaceOnUse",
+        children: [
+          /* @__PURE__ */ jsx("stop", { stopColor: "#FF9A56" }),
+          /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#FF6600" })
+        ]
+      }
+    ) })
+  ] });
+};
+const ImageFrameReactionButton = React.forwardRef(({ className, pressed, ...rest }, ref) => {
+  return /* @__PURE__ */ jsx(
+    Toggle.Root,
+    {
+      ref,
+      className: clsx(imageFrameReactionButton(), className),
+      pressed,
+      ...rest,
+      children: /* @__PURE__ */ jsx(Icon, { svg: pressed ? /* @__PURE__ */ jsx(SelectedHeartIcon, {}) : /* @__PURE__ */ jsx(UnselectedHeartIcon, {}) })
+    }
+  );
+});
+ImageFrameReactionButton.displayName = "ImageFrameReactionButton";
+
+export { ImageFrame, ImageFrameBadge, ImageFrameFloater, ImageFrameIcon, ImageFrameIndicator, ImageFrameReactionButton };

package/lib/components/ImageFrame/index.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const ImageFrame = require('./ImageFrame.cjs');
+
+
+
+exports.ImageFrame = ImageFrame.ImageFrame;
+exports.ImageFrameBadge = ImageFrame.ImageFrameBadge;
+exports.ImageFrameFloater = ImageFrame.ImageFrameFloater;
+exports.ImageFrameIcon = ImageFrame.ImageFrameIcon;
+exports.ImageFrameIndicator = ImageFrame.ImageFrameIndicator;
+exports.ImageFrameReactionButton = ImageFrame.ImageFrameReactionButton;

package/lib/components/ImageFrame/index.d.ts

@@ -0,0 +1,2 @@
+export { ImageFrame, ImageFrameFloater, ImageFrameBadge, ImageFrameIcon, ImageFrameIndicator, ImageFrameReactionButton, type ImageFrameProps, type ImageFrameFloaterProps, type ImageFrameBadgeProps, type ImageFrameIconProps, type ImageFrameIndicatorProps, type ImageFrameReactionButtonProps, } from './ImageFrame';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/ImageFrame/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImageFrame/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,mBAAmB,EACnB,wBAAwB,EACxB,KAAK,eAAe,EACpB,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,wBAAwB,EAC7B,KAAK,6BAA6B,GACnC,MAAM,cAAc,CAAC"}

package/lib/components/ImageFrame/index.js

@@ -0,0 +1 @@
+export { ImageFrame, ImageFrameBadge, ImageFrameFloater, ImageFrameIcon, ImageFrameIndicator, ImageFrameReactionButton } from './ImageFrame.js';

package/lib/components/MenuSheet/MenuSheet.cjs

@@ -9,9 +9,9 @@ const reactPrimitive = require('@seed-design/react-primitive');
 const menuSheet = require('@seed-design/css/recipes/menu-sheet');
 const menuSheetItem = require('@seed-design/css/recipes/menu-sheet-item');
 const React = require('react');
-const createRecipeContext = require('../../utils/createRecipeContext.cjs');
 const createSlotRecipeContext = require('../../utils/createSlotRecipeContext.cjs');
 const createWithStateProps = require('../../utils/createWithStateProps.cjs');
+const clsx = require('clsx');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -32,12 +32,13 @@ function _interopNamespaceDefault(e) {
 
 const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
-const { withRootProvider, withContext } = createSlotRecipeContext.createSlotRecipeContext(menuSheet.menuSheet);
+const { withRootProvider, withContext, useClassNames } = createSlotRecipeContext.createSlotRecipeContext(menuSheet.menuSheet);
 const {
-  withContext: withItemContext,
   PropsProvider: ItemPropsProvider,
-  useProps: useItemProps
-} = createRecipeContext.createRecipeContext(menuSheetItem.menuSheetItem);
+  useProps: useItemProps,
+  withContext: withItemContext,
+  ClassNamesProvider: ItemClassNamesProvider
+} = createSlotRecipeContext.createSlotRecipeContext(menuSheetItem.menuSheetItem);
 const withStateProps = createWithStateProps.createWithStateProps([reactDialog.useDialogContext]);
 const MenuSheetRoot = withRootProvider(reactDialog.Dialog.Root, {
   defaultProps: {
@@ -54,13 +55,18 @@ const MenuSheetBackdrop = withContext(
   reactDialog.Dialog.Backdrop,
   "backdrop"
 );
-const MenuSheetContentBase = withContext(
-  reactDialog.Dialog.Content,
-  "content"
-);
 const MenuSheetContent = React__namespace.forwardRef(
-  ({ labelAlign, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(ItemPropsProvider, { value: React__namespace.useMemo(() => ({ labelAlign }), [labelAlign]), children: /* @__PURE__ */ jsxRuntime.jsx(MenuSheetContentBase, { ref, ...props, children }) });
+  ({ className, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.menuSheetItem.splitVariantProps(props);
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsxRuntime.jsx(ItemPropsProvider, { value: variantProps, children: /* @__PURE__ */ jsxRuntime.jsx(
+      reactDialog.Dialog.Content,
+      {
+        className: clsx(classNames.content, className),
+        ref,
+        ...otherProps
+      }
+    ) });
   }
 );
 const MenuSheetHeader = withContext(
@@ -71,31 +77,57 @@ const MenuSheetTitle = withContext(
   withStateProps(reactPrimitive.Primitive.h2),
   "title"
 );
+const MenuSheetDescription = withContext(
+  withStateProps(reactPrimitive.Primitive.p),
+  "description"
+);
 const MenuSheetList = withContext(
   withStateProps(reactPrimitive.Primitive.div),
   "list"
 );
-const MenuSheetGroupBase = withContext(
-  withStateProps(reactPrimitive.Primitive.div),
-  "group"
-);
 const MenuSheetGroup = React__namespace.forwardRef(
-  ({ labelAlign: overriddenLabelAlign, children, ...props }, ref) => {
+  ({ className, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.menuSheetItem.splitVariantProps(props);
     const parentProps = useItemProps();
-    const labelAlign = overriddenLabelAlign ?? parentProps?.labelAlign;
-    return /* @__PURE__ */ jsxRuntime.jsx(ItemPropsProvider, { value: React__namespace.useMemo(() => ({ labelAlign }), [labelAlign]), children: /* @__PURE__ */ jsxRuntime.jsx(MenuSheetGroupBase, { ref, ...props, children }) });
+    const classNames = useClassNames();
+    const { stateProps } = reactDialog.useDialogContext();
+    return /* @__PURE__ */ jsxRuntime.jsx(ItemPropsProvider, { value: { ...parentProps, ...variantProps }, children: /* @__PURE__ */ jsxRuntime.jsx(
+      reactPrimitive.Primitive.div,
+      {
+        className: clsx(classNames.group, className),
+        ref,
+        ...stateProps,
+        ...otherProps
+      }
+    ) });
   }
 );
-const MenuSheetItemBase = withItemContext(
-  withStateProps(reactPrimitive.Primitive.button)
-);
 const MenuSheetItem = React__namespace.forwardRef(
-  ({ labelAlign: overriddenLabelAlign, ...props }, ref) => {
+  ({ className: propClassName, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.menuSheetItem.splitVariantProps(props);
     const parentProps = useItemProps();
-    const labelAlign = overriddenLabelAlign ?? parentProps?.labelAlign;
-    return /* @__PURE__ */ jsxRuntime.jsx(MenuSheetItemBase, { ref, labelAlign, ...props });
+    const classNames = menuSheetItem.menuSheetItem({ ...parentProps, ...variantProps });
+    const { stateProps } = reactDialog.useDialogContext();
+    return /* @__PURE__ */ jsxRuntime.jsx(ItemClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsxRuntime.jsx(
+      reactPrimitive.Primitive.button,
+      {
+        ref,
+        className: clsx(classNames.root, propClassName),
+        ...stateProps,
+        ...otherProps
+      }
+    ) });
   }
 );
+const MenuSheetItemContent = withItemContext(
+  withStateProps(reactPrimitive.Primitive.div),
+  "content"
+);
+const MenuSheetItemLabel = withItemContext(
+  withStateProps(reactPrimitive.Primitive.span),
+  "label"
+);
+const MenuSheetItemDescription = withItemContext(withStateProps(reactPrimitive.Primitive.span), "description");
 const MenuSheetFooter = withContext(
   withStateProps(reactPrimitive.Primitive.div),
   "footer"
@@ -108,10 +140,14 @@ const MenuSheetCloseButton = withContext(
 exports.MenuSheetBackdrop = MenuSheetBackdrop;
 exports.MenuSheetCloseButton = MenuSheetCloseButton;
 exports.MenuSheetContent = MenuSheetContent;
+exports.MenuSheetDescription = MenuSheetDescription;
 exports.MenuSheetFooter = MenuSheetFooter;
 exports.MenuSheetGroup = MenuSheetGroup;
 exports.MenuSheetHeader = MenuSheetHeader;
 exports.MenuSheetItem = MenuSheetItem;
+exports.MenuSheetItemContent = MenuSheetItemContent;
+exports.MenuSheetItemDescription = MenuSheetItemDescription;
+exports.MenuSheetItemLabel = MenuSheetItemLabel;
 exports.MenuSheetList = MenuSheetList;
 exports.MenuSheetPositioner = MenuSheetPositioner;
 exports.MenuSheetRoot = MenuSheetRoot;

package/lib/components/MenuSheet/MenuSheet.d.ts

@@ -32,6 +32,9 @@ export declare const MenuSheetHeader: React.ForwardRefExoticComponent<MenuSheetH
 export interface MenuSheetTitleProps extends DialogPrimitive.TitleProps {
 }
 export declare const MenuSheetTitle: React.ForwardRefExoticComponent<MenuSheetTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+export interface MenuSheetDescriptionProps extends DialogPrimitive.DescriptionProps {
+}
+export declare const MenuSheetDescription: React.ForwardRefExoticComponent<MenuSheetDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
 export interface MenuSheetListProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {
 }
 export declare const MenuSheetList: React.ForwardRefExoticComponent<MenuSheetListProps & React.RefAttributes<HTMLDivElement>>;
@@ -41,6 +44,15 @@ export declare const MenuSheetGroup: React.ForwardRefExoticComponent<MenuSheetGr
 export interface MenuSheetItemProps extends PrimitiveProps, MenuSheetItemVariantProps, React.HTMLAttributes<HTMLButtonElement> {
 }
 export declare const MenuSheetItem: React.ForwardRefExoticComponent<MenuSheetItemProps & React.RefAttributes<HTMLButtonElement>>;
+export interface MenuSheetItemContentProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {
+}
+export declare const MenuSheetItemContent: React.ForwardRefExoticComponent<MenuSheetItemContentProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuSheetItemLabelProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {
+}
+export declare const MenuSheetItemLabel: React.ForwardRefExoticComponent<MenuSheetItemLabelProps & React.RefAttributes<HTMLSpanElement>>;
+export interface MenuSheetItemDescriptionProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {
+}
+export declare const MenuSheetItemDescription: React.ForwardRefExoticComponent<MenuSheetItemDescriptionProps & React.RefAttributes<HTMLSpanElement>>;
 export interface MenuSheetFooterProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {
 }
 export declare const MenuSheetFooter: React.ForwardRefExoticComponent<MenuSheetFooterProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/MenuSheet/MenuSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuSheet.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/MenuSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAoB,MAAM,2BAA2B,CAAC;AACxF,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAC5F,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,0CAA0C,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB,EAAE,eAAe,CAAC,SAAS;IAC1F;;OAEG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;CAC5D;AAED,eAAO,MAAM,aAAa,qDAKxB,CAAC;AAIH,MAAM,WAAW,qBAAsB,SAAQ,eAAe,CAAC,YAAY;CAAG;AAE9E,eAAO,MAAM,gBAAgB,wGAA0B,CAAC;AAIxD,MAAM,WAAW,wBAAyB,SAAQ,eAAe,CAAC,eAAe;CAAG;AAEpF,eAAO,MAAM,mBAAmB,iGAG/B,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,eAAe,CAAC,aAAa;CAAG;AAEhF,eAAO,MAAM,iBAAiB,+FAG7B,CAAC;AAIF,MAAM,WAAW,qBACf,SAAQ,eAAe,CAAC,YAAY,EAClC,IAAI,CAAC,yBAAyB,EAAE,YAAY,CAAC;CAAG;AAOpD,eAAO,MAAM,gBAAgB,8FAU5B,CAAC;AAIF,MAAM,WAAW,oBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,eAAe,6FAG3B,CAAC;AAIF,MAAM,WAAW,mBAAoB,SAAQ,eAAe,CAAC,UAAU;CAAG;AAE1E,eAAO,MAAM,cAAc,gGAG1B,CAAC;AAIF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEnG,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,IAAI,CAAC,yBAAyB,EAAE,YAAY,CAAC;CAAG;AAOpD,eAAO,MAAM,cAAc,4FAa1B,CAAC;AAIF,MAAM,WAAW,kBACf,SAAQ,cAAc,EACpB,yBAAyB,EACzB,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;CAAG;AAM9C,eAAO,MAAM,aAAa,8FAOzB,CAAC;AAIF,MAAM,WAAW,oBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,eAAe,6FAG3B,CAAC;AAIF,MAAM,WAAW,yBAA0B,SAAQ,eAAe,CAAC,gBAAgB;CAAG;AAEtF,eAAO,MAAM,oBAAoB,kGAGhC,CAAC"}
+{"version":3,"file":"MenuSheet.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/MenuSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAoB,MAAM,2BAA2B,CAAC;AACxF,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAC5F,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,0CAA0C,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB,EAAE,eAAe,CAAC,SAAS;IAC1F;;OAEG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;CAC5D;AAED,eAAO,MAAM,aAAa,qDAKxB,CAAC;AAIH,MAAM,WAAW,qBAAsB,SAAQ,eAAe,CAAC,YAAY;CAAG;AAE9E,eAAO,MAAM,gBAAgB,wGAA0B,CAAC;AAIxD,MAAM,WAAW,wBAAyB,SAAQ,eAAe,CAAC,eAAe;CAAG;AAEpF,eAAO,MAAM,mBAAmB,iGAG/B,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,eAAe,CAAC,aAAa;CAAG;AAEhF,eAAO,MAAM,iBAAiB,+FAG7B,CAAC;AAIF,MAAM,WAAW,qBACf,SAAQ,eAAe,CAAC,YAAY,EAClC,IAAI,CAAC,yBAAyB,EAAE,YAAY,CAAC;CAAG;AAEpD,eAAO,MAAM,gBAAgB,8FAe5B,CAAC;AAIF,MAAM,WAAW,oBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,eAAe,6FAG3B,CAAC;AAKF,MAAM,WAAW,mBAAoB,SAAQ,eAAe,CAAC,UAAU;CAAG;AAE1E,eAAO,MAAM,cAAc,gGAG1B,CAAC;AAKF,MAAM,WAAW,yBAA0B,SAAQ,eAAe,CAAC,gBAAgB;CAAG;AAEtF,eAAO,MAAM,oBAAoB,wGAGhC,CAAC;AAIF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEnG,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,IAAI,CAAC,yBAAyB,EAAE,YAAY,CAAC;CAAG;AAEpD,eAAO,MAAM,cAAc,4FAmB1B,CAAC;AAIF,MAAM,WAAW,kBACf,SAAQ,cAAc,EACpB,yBAAyB,EACzB,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;CAAG;AAE9C,eAAO,MAAM,aAAa,8FAmBzB,CAAC;AAEF,MAAM,WAAW,yBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,oBAAoB,kGAGhC,CAAC;AAEF,MAAM,WAAW,uBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,kBAAkB,iGAG9B,CAAC;AAEF,MAAM,WAAW,6BACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,wBAAwB,uGAGW,CAAC;AAIjD,MAAM,WAAW,oBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,eAAe,6FAG3B,CAAC;AAIF,MAAM,WAAW,yBAA0B,SAAQ,eAAe,CAAC,gBAAgB;CAAG;AAEtF,eAAO,MAAM,oBAAoB,kGAGhC,CAAC"}

package/lib/components/MenuSheet/MenuSheet.js

@@ -5,16 +5,17 @@ import { Primitive } from '@seed-design/react-primitive';
 import { menuSheet } from '@seed-design/css/recipes/menu-sheet';
 import { menuSheetItem } from '@seed-design/css/recipes/menu-sheet-item';
 import * as React from 'react';
-import { createRecipeContext } from '../../utils/createRecipeContext.js';
 import { createSlotRecipeContext } from '../../utils/createSlotRecipeContext.js';
 import { createWithStateProps } from '../../utils/createWithStateProps.js';
+import clsx from 'clsx';
 
-const { withRootProvider, withContext } = createSlotRecipeContext(menuSheet);
+const { withRootProvider, withContext, useClassNames } = createSlotRecipeContext(menuSheet);
 const {
-  withContext: withItemContext,
   PropsProvider: ItemPropsProvider,
-  useProps: useItemProps
-} = createRecipeContext(menuSheetItem);
+  useProps: useItemProps,
+  withContext: withItemContext,
+  ClassNamesProvider: ItemClassNamesProvider
+} = createSlotRecipeContext(menuSheetItem);
 const withStateProps = createWithStateProps([useDialogContext]);
 const MenuSheetRoot = withRootProvider(Dialog.Root, {
   defaultProps: {
@@ -31,13 +32,18 @@ const MenuSheetBackdrop = withContext(
   Dialog.Backdrop,
   "backdrop"
 );
-const MenuSheetContentBase = withContext(
-  Dialog.Content,
-  "content"
-);
 const MenuSheetContent = React.forwardRef(
-  ({ labelAlign, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(ItemPropsProvider, { value: React.useMemo(() => ({ labelAlign }), [labelAlign]), children: /* @__PURE__ */ jsx(MenuSheetContentBase, { ref, ...props, children }) });
+  ({ className, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.splitVariantProps(props);
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsx(ItemPropsProvider, { value: variantProps, children: /* @__PURE__ */ jsx(
+      Dialog.Content,
+      {
+        className: clsx(classNames.content, className),
+        ref,
+        ...otherProps
+      }
+    ) });
   }
 );
 const MenuSheetHeader = withContext(
@@ -48,31 +54,57 @@ const MenuSheetTitle = withContext(
   withStateProps(Primitive.h2),
   "title"
 );
+const MenuSheetDescription = withContext(
+  withStateProps(Primitive.p),
+  "description"
+);
 const MenuSheetList = withContext(
   withStateProps(Primitive.div),
   "list"
 );
-const MenuSheetGroupBase = withContext(
-  withStateProps(Primitive.div),
-  "group"
-);
 const MenuSheetGroup = React.forwardRef(
-  ({ labelAlign: overriddenLabelAlign, children, ...props }, ref) => {
+  ({ className, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.splitVariantProps(props);
     const parentProps = useItemProps();
-    const labelAlign = overriddenLabelAlign ?? parentProps?.labelAlign;
-    return /* @__PURE__ */ jsx(ItemPropsProvider, { value: React.useMemo(() => ({ labelAlign }), [labelAlign]), children: /* @__PURE__ */ jsx(MenuSheetGroupBase, { ref, ...props, children }) });
+    const classNames = useClassNames();
+    const { stateProps } = useDialogContext();
+    return /* @__PURE__ */ jsx(ItemPropsProvider, { value: { ...parentProps, ...variantProps }, children: /* @__PURE__ */ jsx(
+      Primitive.div,
+      {
+        className: clsx(classNames.group, className),
+        ref,
+        ...stateProps,
+        ...otherProps
+      }
+    ) });
   }
 );
-const MenuSheetItemBase = withItemContext(
-  withStateProps(Primitive.button)
-);
 const MenuSheetItem = React.forwardRef(
-  ({ labelAlign: overriddenLabelAlign, ...props }, ref) => {
+  ({ className: propClassName, ...props }, ref) => {
+    const [variantProps, otherProps] = menuSheetItem.splitVariantProps(props);
     const parentProps = useItemProps();
-    const labelAlign = overriddenLabelAlign ?? parentProps?.labelAlign;
-    return /* @__PURE__ */ jsx(MenuSheetItemBase, { ref, labelAlign, ...props });
+    const classNames = menuSheetItem({ ...parentProps, ...variantProps });
+    const { stateProps } = useDialogContext();
+    return /* @__PURE__ */ jsx(ItemClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsx(
+      Primitive.button,
+      {
+        ref,
+        className: clsx(classNames.root, propClassName),
+        ...stateProps,
+        ...otherProps
+      }
+    ) });
   }
 );
+const MenuSheetItemContent = withItemContext(
+  withStateProps(Primitive.div),
+  "content"
+);
+const MenuSheetItemLabel = withItemContext(
+  withStateProps(Primitive.span),
+  "label"
+);
+const MenuSheetItemDescription = withItemContext(withStateProps(Primitive.span), "description");
 const MenuSheetFooter = withContext(
   withStateProps(Primitive.div),
   "footer"
@@ -82,4 +114,4 @@ const MenuSheetCloseButton = withContext(
   "closeButton"
 );
 
-export { MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger };
+export { MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetDescription, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetItemContent, MenuSheetItemDescription, MenuSheetItemLabel, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger };

package/lib/components/MenuSheet/MenuSheet.namespace.cjs

@@ -9,10 +9,14 @@ const MenuSheet = require('./MenuSheet.cjs');
 exports.Backdrop = MenuSheet.MenuSheetBackdrop;
 exports.CloseButton = MenuSheet.MenuSheetCloseButton;
 exports.Content = MenuSheet.MenuSheetContent;
+exports.Description = MenuSheet.MenuSheetDescription;
 exports.Footer = MenuSheet.MenuSheetFooter;
 exports.Group = MenuSheet.MenuSheetGroup;
 exports.Header = MenuSheet.MenuSheetHeader;
 exports.Item = MenuSheet.MenuSheetItem;
+exports.ItemContent = MenuSheet.MenuSheetItemContent;
+exports.ItemDescription = MenuSheet.MenuSheetItemDescription;
+exports.ItemLabel = MenuSheet.MenuSheetItemLabel;
 exports.List = MenuSheet.MenuSheetList;
 exports.Positioner = MenuSheet.MenuSheetPositioner;
 exports.Root = MenuSheet.MenuSheetRoot;

package/lib/components/MenuSheet/MenuSheet.namespace.d.ts

@@ -1,2 +1,2 @@
-export { MenuSheetBackdrop as Backdrop, MenuSheetPositioner as Positioner, MenuSheetContent as Content, MenuSheetFooter as Footer, MenuSheetHeader as Header, MenuSheetRoot as Root, MenuSheetTitle as Title, MenuSheetTrigger as Trigger, MenuSheetList as List, MenuSheetGroup as Group, MenuSheetItem as Item, MenuSheetCloseButton as CloseButton, type MenuSheetBackdropProps as BackdropProps, type MenuSheetPositionerProps as PositionerProps, type MenuSheetContentProps as ContentProps, type MenuSheetFooterProps as FooterProps, type MenuSheetHeaderProps as HeaderProps, type MenuSheetRootProps as RootProps, type MenuSheetTitleProps as TitleProps, type MenuSheetTriggerProps as TriggerProps, type MenuSheetListProps as ListProps, type MenuSheetGroupProps as GroupProps, type MenuSheetItemProps as ItemProps, type MenuSheetCloseButtonProps as CloseButtonProps, } from './MenuSheet';
+export { MenuSheetBackdrop as Backdrop, MenuSheetPositioner as Positioner, MenuSheetContent as Content, MenuSheetFooter as Footer, MenuSheetHeader as Header, MenuSheetRoot as Root, MenuSheetTitle as Title, MenuSheetDescription as Description, MenuSheetTrigger as Trigger, MenuSheetList as List, MenuSheetGroup as Group, MenuSheetItem as Item, MenuSheetItemContent as ItemContent, MenuSheetItemLabel as ItemLabel, MenuSheetItemDescription as ItemDescription, MenuSheetCloseButton as CloseButton, type MenuSheetBackdropProps as BackdropProps, type MenuSheetPositionerProps as PositionerProps, type MenuSheetContentProps as ContentProps, type MenuSheetFooterProps as FooterProps, type MenuSheetHeaderProps as HeaderProps, type MenuSheetRootProps as RootProps, type MenuSheetTitleProps as TitleProps, type MenuSheetDescriptionProps as DescriptionProps, type MenuSheetTriggerProps as TriggerProps, type MenuSheetListProps as ListProps, type MenuSheetGroupProps as GroupProps, type MenuSheetItemProps as ItemProps, type MenuSheetItemContentProps as ItemContentProps, type MenuSheetItemLabelProps as ItemLabelProps, type MenuSheetItemDescriptionProps as ItemDescriptionProps, type MenuSheetCloseButtonProps as CloseButtonProps, } from './MenuSheet';
 //# sourceMappingURL=MenuSheet.namespace.d.ts.map

package/lib/components/MenuSheet/MenuSheet.namespace.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuSheet.namespace.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/MenuSheet.namespace.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,IAAI,QAAQ,EAC7B,mBAAmB,IAAI,UAAU,EACjC,gBAAgB,IAAI,OAAO,EAC3B,eAAe,IAAI,MAAM,EACzB,eAAe,IAAI,MAAM,EACzB,aAAa,IAAI,IAAI,EACrB,cAAc,IAAI,KAAK,EACvB,gBAAgB,IAAI,OAAO,EAC3B,aAAa,IAAI,IAAI,EACrB,cAAc,IAAI,KAAK,EACvB,aAAa,IAAI,IAAI,EACrB,oBAAoB,IAAI,WAAW,EACnC,KAAK,sBAAsB,IAAI,aAAa,EAC5C,KAAK,wBAAwB,IAAI,eAAe,EAChD,KAAK,qBAAqB,IAAI,YAAY,EAC1C,KAAK,oBAAoB,IAAI,WAAW,EACxC,KAAK,oBAAoB,IAAI,WAAW,EACxC,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,mBAAmB,IAAI,UAAU,EACtC,KAAK,qBAAqB,IAAI,YAAY,EAC1C,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,mBAAmB,IAAI,UAAU,EACtC,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,yBAAyB,IAAI,gBAAgB,GACnD,MAAM,aAAa,CAAC"}
+{"version":3,"file":"MenuSheet.namespace.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/MenuSheet.namespace.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,IAAI,QAAQ,EAC7B,mBAAmB,IAAI,UAAU,EACjC,gBAAgB,IAAI,OAAO,EAC3B,eAAe,IAAI,MAAM,EACzB,eAAe,IAAI,MAAM,EACzB,aAAa,IAAI,IAAI,EACrB,cAAc,IAAI,KAAK,EACvB,oBAAoB,IAAI,WAAW,EACnC,gBAAgB,IAAI,OAAO,EAC3B,aAAa,IAAI,IAAI,EACrB,cAAc,IAAI,KAAK,EACvB,aAAa,IAAI,IAAI,EACrB,oBAAoB,IAAI,WAAW,EACnC,kBAAkB,IAAI,SAAS,EAC/B,wBAAwB,IAAI,eAAe,EAC3C,oBAAoB,IAAI,WAAW,EACnC,KAAK,sBAAsB,IAAI,aAAa,EAC5C,KAAK,wBAAwB,IAAI,eAAe,EAChD,KAAK,qBAAqB,IAAI,YAAY,EAC1C,KAAK,oBAAoB,IAAI,WAAW,EACxC,KAAK,oBAAoB,IAAI,WAAW,EACxC,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,mBAAmB,IAAI,UAAU,EACtC,KAAK,yBAAyB,IAAI,gBAAgB,EAClD,KAAK,qBAAqB,IAAI,YAAY,EAC1C,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,mBAAmB,IAAI,UAAU,EACtC,KAAK,kBAAkB,IAAI,SAAS,EACpC,KAAK,yBAAyB,IAAI,gBAAgB,EAClD,KAAK,uBAAuB,IAAI,cAAc,EAC9C,KAAK,6BAA6B,IAAI,oBAAoB,EAC1D,KAAK,yBAAyB,IAAI,gBAAgB,GACnD,MAAM,aAAa,CAAC"}

package/lib/components/MenuSheet/MenuSheet.namespace.js

@@ -1 +1 @@
-export { MenuSheetBackdrop as Backdrop, MenuSheetCloseButton as CloseButton, MenuSheetContent as Content, MenuSheetFooter as Footer, MenuSheetGroup as Group, MenuSheetHeader as Header, MenuSheetItem as Item, MenuSheetList as List, MenuSheetPositioner as Positioner, MenuSheetRoot as Root, MenuSheetTitle as Title, MenuSheetTrigger as Trigger } from './MenuSheet.js';
+export { MenuSheetBackdrop as Backdrop, MenuSheetCloseButton as CloseButton, MenuSheetContent as Content, MenuSheetDescription as Description, MenuSheetFooter as Footer, MenuSheetGroup as Group, MenuSheetHeader as Header, MenuSheetItem as Item, MenuSheetItemContent as ItemContent, MenuSheetItemDescription as ItemDescription, MenuSheetItemLabel as ItemLabel, MenuSheetList as List, MenuSheetPositioner as Positioner, MenuSheetRoot as Root, MenuSheetTitle as Title, MenuSheetTrigger as Trigger } from './MenuSheet.js';

package/lib/components/MenuSheet/index.cjs

@@ -10,10 +10,14 @@ const MenuSheet_namespace = require('./MenuSheet.namespace.cjs');
 exports.MenuSheetBackdrop = MenuSheet.MenuSheetBackdrop;
 exports.MenuSheetCloseButton = MenuSheet.MenuSheetCloseButton;
 exports.MenuSheetContent = MenuSheet.MenuSheetContent;
+exports.MenuSheetDescription = MenuSheet.MenuSheetDescription;
 exports.MenuSheetFooter = MenuSheet.MenuSheetFooter;
 exports.MenuSheetGroup = MenuSheet.MenuSheetGroup;
 exports.MenuSheetHeader = MenuSheet.MenuSheetHeader;
 exports.MenuSheetItem = MenuSheet.MenuSheetItem;
+exports.MenuSheetItemContent = MenuSheet.MenuSheetItemContent;
+exports.MenuSheetItemDescription = MenuSheet.MenuSheetItemDescription;
+exports.MenuSheetItemLabel = MenuSheet.MenuSheetItemLabel;
 exports.MenuSheetList = MenuSheet.MenuSheetList;
 exports.MenuSheetPositioner = MenuSheet.MenuSheetPositioner;
 exports.MenuSheetRoot = MenuSheet.MenuSheetRoot;

package/lib/components/MenuSheet/index.d.ts

@@ -1,3 +1,3 @@
-export { MenuSheetBackdrop, MenuSheetPositioner, MenuSheetContent, MenuSheetFooter, MenuSheetHeader, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger, MenuSheetList, MenuSheetGroup, MenuSheetItem, MenuSheetCloseButton, type MenuSheetBackdropProps, type MenuSheetPositionerProps, type MenuSheetContentProps, type MenuSheetFooterProps, type MenuSheetHeaderProps, type MenuSheetRootProps, type MenuSheetTitleProps, type MenuSheetTriggerProps, type MenuSheetListProps, type MenuSheetGroupProps, type MenuSheetItemProps, type MenuSheetCloseButtonProps, } from './MenuSheet';
+export { MenuSheetBackdrop, MenuSheetPositioner, MenuSheetContent, MenuSheetFooter, MenuSheetHeader, MenuSheetRoot, MenuSheetTitle, MenuSheetDescription, MenuSheetTrigger, MenuSheetList, MenuSheetGroup, MenuSheetItem, MenuSheetItemContent, MenuSheetItemLabel, MenuSheetItemDescription, MenuSheetCloseButton, type MenuSheetBackdropProps, type MenuSheetPositionerProps, type MenuSheetContentProps, type MenuSheetFooterProps, type MenuSheetHeaderProps, type MenuSheetRootProps, type MenuSheetTitleProps, type MenuSheetDescriptionProps, type MenuSheetTriggerProps, type MenuSheetListProps, type MenuSheetGroupProps, type MenuSheetItemProps, type MenuSheetItemContentProps, type MenuSheetItemLabelProps, type MenuSheetItemDescriptionProps, type MenuSheetCloseButtonProps, } from './MenuSheet';
 export * as MenuSheet from './MenuSheet.namespace';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/MenuSheet/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,aAAa,EACb,cAAc,EACd,aAAa,EACb,oBAAoB,EACpB,KAAK,sBAAsB,EAC3B,KAAK,wBAAwB,EAC7B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,qBAAqB,EAC1B,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,yBAAyB,GAC/B,MAAM,aAAa,CAAC;AAErB,OAAO,KAAK,SAAS,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MenuSheet/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,oBAAoB,EACpB,gBAAgB,EAChB,aAAa,EACb,cAAc,EACd,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,wBAAwB,EACxB,oBAAoB,EACpB,KAAK,sBAAsB,EAC3B,KAAK,wBAAwB,EAC7B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAC1B,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,yBAAyB,EAC9B,KAAK,uBAAuB,EAC5B,KAAK,6BAA6B,EAClC,KAAK,yBAAyB,GAC/B,MAAM,aAAa,CAAC;AAErB,OAAO,KAAK,SAAS,MAAM,uBAAuB,CAAC"}

package/lib/components/MenuSheet/index.js

@@ -1,3 +1,3 @@
-export { MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger } from './MenuSheet.js';
+export { MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetDescription, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetItemContent, MenuSheetItemDescription, MenuSheetItemLabel, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger } from './MenuSheet.js';
 import * as MenuSheet_namespace from './MenuSheet.namespace.js';
 export { MenuSheet_namespace as MenuSheet };

package/lib/components/RadioGroup/RadioGroup.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
 const radio = require('@seed-design/css/recipes/radio');
+const radioGroup = require('@seed-design/css/recipes/radio-group');
 const radiomark = require('@seed-design/css/recipes/radiomark');
 const domUtils = require('@seed-design/dom-utils');
 const reactRadioGroup = require('@seed-design/react-radio-group');
@@ -15,7 +16,9 @@ const createSlotRecipeContext = require('../../utils/createSlotRecipeContext.cjs
 const createWithStateProps = require('../../utils/createWithStateProps.cjs');
 const Icon = require('../private/Icon.cjs');
 const splitMultipleVariantsProps = require('../../utils/splitMultipleVariantsProps.cjs');
+const createRecipeContext = require('../../utils/createRecipeContext.cjs');
 
+const { withContext: withGroupContext } = createRecipeContext.createRecipeContext(radioGroup.radioGroup);
 const { ClassNamesProvider, withContext } = createSlotRecipeContext.createSlotRecipeContext(radio.radio);
 const {
   withProvider: withRadiomarkProvider,
@@ -23,7 +26,7 @@ const {
   PropsProvider: RadiomarkPropsProvider
 } = createSlotRecipeContext.createSlotRecipeContext(radiomark.radiomark);
 const withStateProps = createWithStateProps.createWithStateProps([reactRadioGroup.useRadioGroupItemContext]);
-const RadioGroupRoot = reactRadioGroup.RadioGroup.Root;
+const RadioGroupRoot = withGroupContext(reactPrimitive.Primitive.div);
 const RadioGroupItem = Object.assign(
   React.forwardRef(({ className, ...props }, ref) => {
     const [{ radio: radioVariantProps, radiomark: radiomarkVariantProps }, otherProps] = splitMultipleVariantsProps.splitMultipleVariantsProps(props, { radio: radio.radio, radiomark: radiomark.radiomark });

package/lib/components/RadioGroup/RadioGroup.d.ts

@@ -1,11 +1,12 @@
 import { RadioVariantProps } from '@seed-design/css/recipes/radio';
+import { RadioGroupVariantProps } from '@seed-design/css/recipes/radio-group';
 import { RadiomarkVariantProps } from '@seed-design/css/recipes/radiomark';
 import { RadioGroup as RadioGroupPrimitive } from '@seed-design/react-radio-group';
 import { PrimitiveProps } from '@seed-design/react-primitive';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
-export interface RadioGroupRootProps extends RadioGroupPrimitive.RootProps {
+export interface RadioGroupRootProps extends RadioGroupVariantProps, PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {
 }
-export declare const RadioGroupRoot: ForwardRefExoticComponent<RadioGroupPrimitive.RootProps & RefAttributes<HTMLDivElement>>;
+export declare const RadioGroupRoot: ForwardRefExoticComponent<RadioGroupRootProps & RefAttributes<HTMLDivElement>>;
 export interface RadioGroupItemProps extends RadioVariantProps, RadiomarkVariantProps, RadioGroupPrimitive.ItemProps {
 }
 export declare const RadioGroupItem: ForwardRefExoticComponent<RadioGroupItemProps & RefAttributes<HTMLLabelElement>> & {

package/lib/components/RadioGroup/RadioGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAE3F,OAAO,EACL,UAAU,IAAI,mBAAmB,EAElC,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAkB9E,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB,CAAC,SAAS;CAAG;AAE7E,eAAO,MAAM,cAAc,0HAA2B,CAAC;AAIvD,MAAM,WAAW,mBACf,SAAQ,iBAAiB,EACvB,qBAAqB,EACrB,mBAAmB,CAAC,SAAS;CAAG;AAEpC,eAAO,MAAM,cAAc;;CAsB1B,CAAC;AAIF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,sHAG/B,CAAC;AAIF,MAAM,WAAW,0BACf,SAAQ,qBAAqB,EAC3B,mBAAmB,CAAC,gBAAgB;CAAG;AAE3C,eAAO,MAAM,qBAAqB,uHAGQ,CAAC;AAI3C,MAAM,WAAW,4BAA6B,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IACtF;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,uBAAuB,wHA4BnC,CAAC;AAKF,MAAM,WAAW,8BAA+B,SAAQ,mBAAmB,CAAC,oBAAoB;CAAG;AAEnG,eAAO,MAAM,yBAAyB,uIAAsC,CAAC"}
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,EAAc,KAAK,sBAAsB,EAAE,MAAM,sCAAsC,CAAC;AAC/F,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAE3F,OAAO,EACL,UAAU,IAAI,mBAAmB,EAElC,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAoB9E,MAAM,WAAW,mBACf,SAAQ,sBAAsB,EAC5B,cAAc,EACd,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,cAAc,gHAAuE,CAAC;AAInG,MAAM,WAAW,mBACf,SAAQ,iBAAiB,EACvB,qBAAqB,EACrB,mBAAmB,CAAC,SAAS;CAAG;AAEpC,eAAO,MAAM,cAAc;;CAsB1B,CAAC;AAIF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,sHAG/B,CAAC;AAIF,MAAM,WAAW,0BACf,SAAQ,qBAAqB,EAC3B,mBAAmB,CAAC,gBAAgB;CAAG;AAE3C,eAAO,MAAM,qBAAqB,uHAGQ,CAAC;AAI3C,MAAM,WAAW,4BAA6B,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IACtF;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,uBAAuB,wHA4BnC,CAAC;AAKF,MAAM,WAAW,8BAA+B,SAAQ,mBAAmB,CAAC,oBAAoB;CAAG;AAEnG,eAAO,MAAM,yBAAyB,uIAAsC,CAAC"}

package/lib/components/RadioGroup/RadioGroup.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { radio } from '@seed-design/css/recipes/radio';
+import { radioGroup } from '@seed-design/css/recipes/radio-group';
 import { radiomark } from '@seed-design/css/recipes/radiomark';
 import { mergeProps } from '@seed-design/dom-utils';
 import { RadioGroup, useRadioGroupItemContext } from '@seed-design/react-radio-group';
@@ -11,7 +12,9 @@ import { createSlotRecipeContext } from '../../utils/createSlotRecipeContext.js'
 import { createWithStateProps } from '../../utils/createWithStateProps.js';
 import { InternalIcon } from '../private/Icon.js';
 import { splitMultipleVariantsProps } from '../../utils/splitMultipleVariantsProps.js';
+import { createRecipeContext } from '../../utils/createRecipeContext.js';
 
+const { withContext: withGroupContext } = createRecipeContext(radioGroup);
 const { ClassNamesProvider, withContext } = createSlotRecipeContext(radio);
 const {
   withProvider: withRadiomarkProvider,
@@ -19,7 +22,7 @@ const {
   PropsProvider: RadiomarkPropsProvider
 } = createSlotRecipeContext(radiomark);
 const withStateProps = createWithStateProps([useRadioGroupItemContext]);
-const RadioGroupRoot = RadioGroup.Root;
+const RadioGroupRoot = withGroupContext(Primitive.div);
 const RadioGroupItem = Object.assign(
   forwardRef(({ className, ...props }, ref) => {
     const [{ radio: radioVariantProps, radiomark: radiomarkVariantProps }, otherProps] = splitMultipleVariantsProps(props, { radio, radiomark });