@ark-ui/react 1.3.0 → 2.0.0

package/progress/stories/linear-progress.stories.d.ts

@@ -1,8 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Progress } from '../';
-type ProgressType = typeof Progress;
-declare const meta: Meta<ProgressType>;
+declare const meta: Meta;
 export default meta;
 export declare const Basic: () => JSX.Element;
 export declare const InitialValue: () => JSX.Element;

package/progress/tests/basic.d.ts

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type ProgressRootProps } from '../';
+export declare const ComponentUnderTest: (props: ProgressRootProps) => JSX.Element;

package/progress/use-progress.cjs

@@ -6,7 +6,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const progress = require('@zag-js/progress');
 const react$1 = require('@zag-js/react');
 const react = require('react');
-require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

package/progress/use-progress.mjs

@@ -2,7 +2,6 @@
 import * as progress from '@zag-js/progress';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
-import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useProgress = (props) => {

package/radio-group/index.cjs

@@ -3,7 +3,6 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const radioGroup = require('./radio-group.cjs');
 const radioGroupContext = require('./radio-group-context.cjs');
 const radioGroupIndicator = require('./radio-group-indicator.cjs');
 const radioGroupItem = require('./radio-group-item.cjs');
@@ -11,15 +10,16 @@ const radioGroupItemContext = require('./radio-group-item-context.cjs');
 const radioGroupItemControl = require('./radio-group-item-control.cjs');
 const radioGroupItemText = require('./radio-group-item-text.cjs');
 const radioGroupLabel = require('./radio-group-label.cjs');
+const radioGroupRoot = require('./radio-group-root.cjs');
 
-const RadioGroup = Object.assign(radioGroup.RadioGroup, {
-  Root: radioGroup.RadioGroup,
+const RadioGroup = {
+  Root: radioGroupRoot.RadioGroupRoot,
   Indicator: radioGroupIndicator.RadioGroupIndicator,
   Item: radioGroupItem.RadioGroupItem,
   ItemControl: radioGroupItemControl.RadioGroupItemControl,
   ItemText: radioGroupItemText.RadioGroupItemText,
   Label: radioGroupLabel.RadioGroupLabel
-});
+};
 
 exports.useRadioGroupContext = radioGroupContext.useRadioGroupContext;
 exports.RadioGroupItem = radioGroupItem.RadioGroupItem;
@@ -27,4 +27,5 @@ exports.useRadioGroupItemContext = radioGroupItemContext.useRadioGroupItemContex
 exports.RadioGroupItemControl = radioGroupItemControl.RadioGroupItemControl;
 exports.RadioGroupItemText = radioGroupItemText.RadioGroupItemText;
 exports.RadioGroupLabel = radioGroupLabel.RadioGroupLabel;
+exports.RadioGroupRoot = radioGroupRoot.RadioGroupRoot;
 exports.RadioGroup = RadioGroup;

package/radio-group/index.d.ts

@@ -1,7 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import type { ValueChangeDetails as RadioGroupValueChangeDetails } from '@zag-js/radio-group';
-import { type RadioGroupProps } from './radio-group';
 import { useRadioGroupContext, type RadioGroupContext } from './radio-group-context';
 import { type RadioGroupIndicatorProps } from './radio-group-indicator';
 import { RadioGroupItem, type RadioGroupItemProps } from './radio-group-item';
@@ -9,13 +8,14 @@ import { useRadioGroupItemContext, type RadioGroupItemContext } from './radio-gr
 import { RadioGroupItemControl, type RadioGroupItemControlProps } from './radio-group-item-control';
 import { RadioGroupItemText, type RadioGroupItemTextProps } from './radio-group-item-text';
 import { RadioGroupLabel, type RadioGroupLabelProps } from './radio-group-label';
-declare const RadioGroup: ForwardRefExoticComponent<RadioGroupProps & RefAttributes<HTMLDivElement>> & {
-    Root: ForwardRefExoticComponent<RadioGroupProps & RefAttributes<HTMLDivElement>>;
+import { RadioGroupRoot, type RadioGroupRootProps } from './radio-group-root';
+export declare const RadioGroup: {
+    Root: ForwardRefExoticComponent<RadioGroupRootProps & RefAttributes<HTMLDivElement>>;
     Indicator: ForwardRefExoticComponent<RadioGroupIndicatorProps & RefAttributes<HTMLDivElement>>;
     Item: ForwardRefExoticComponent<RadioGroupItemProps & RefAttributes<HTMLLabelElement>>;
     ItemControl: ForwardRefExoticComponent<RadioGroupItemControlProps & RefAttributes<HTMLDivElement>>;
     ItemText: ForwardRefExoticComponent<RadioGroupItemTextProps & RefAttributes<HTMLSpanElement>>;
     Label: ForwardRefExoticComponent<RadioGroupLabelProps & RefAttributes<HTMLLabelElement>>;
 };
-export { RadioGroup, RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel, useRadioGroupContext, useRadioGroupItemContext, };
-export type { RadioGroupContext, RadioGroupIndicatorProps, RadioGroupItemContext, RadioGroupItemControlProps, RadioGroupItemProps, RadioGroupItemTextProps, RadioGroupLabelProps, RadioGroupProps, RadioGroupValueChangeDetails, };
+export { RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot, useRadioGroupContext, useRadioGroupItemContext, };
+export type { RadioGroupContext, RadioGroupIndicatorProps, RadioGroupItemContext, RadioGroupItemControlProps, RadioGroupItemProps, RadioGroupItemTextProps, RadioGroupLabelProps, RadioGroupRootProps, RadioGroupValueChangeDetails, };

package/radio-group/index.mjs

@@ -1,5 +1,4 @@
 'use client';
-import { RadioGroup as RadioGroup$1 } from './radio-group.mjs';
 export { useRadioGroupContext } from './radio-group-context.mjs';
 import { RadioGroupIndicator } from './radio-group-indicator.mjs';
 import { RadioGroupItem } from './radio-group-item.mjs';
@@ -7,14 +6,15 @@ export { useRadioGroupItemContext } from './radio-group-item-context.mjs';
 import { RadioGroupItemControl } from './radio-group-item-control.mjs';
 import { RadioGroupItemText } from './radio-group-item-text.mjs';
 import { RadioGroupLabel } from './radio-group-label.mjs';
+import { RadioGroupRoot } from './radio-group-root.mjs';
 
-const RadioGroup = Object.assign(RadioGroup$1, {
-  Root: RadioGroup$1,
+const RadioGroup = {
+  Root: RadioGroupRoot,
   Indicator: RadioGroupIndicator,
   Item: RadioGroupItem,
   ItemControl: RadioGroupItemControl,
   ItemText: RadioGroupItemText,
   Label: RadioGroupLabel
-});
+};
 
-export { RadioGroup, RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel };
+export { RadioGroup, RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot };

package/radio-group/{radio-group.cjs → radio-group-root.cjs}

@@ -11,7 +11,7 @@ const factory = require('../factory.cjs');
 const radioGroupContext = require('./radio-group-context.cjs');
 const useRadioGroup = require('./use-radio-group.cjs');
 
-const RadioGroup = react.forwardRef((props, ref) => {
+const RadioGroupRoot = react.forwardRef((props, ref) => {
   const [useRadioGroupProps, localProps] = createSplitProps.createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -29,6 +29,6 @@ const RadioGroup = react.forwardRef((props, ref) => {
   const mergedProps = react$1.mergeProps(api.rootProps, localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(radioGroupContext.RadioGroupProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });
-RadioGroup.displayName = "RadioGroup";
+RadioGroupRoot.displayName = "RadioGroupRoot";
 
-exports.RadioGroup = RadioGroup;
+exports.RadioGroupRoot = RadioGroupRoot;

package/radio-group/{radio-group.d.ts → radio-group-root.d.ts}

@@ -3,6 +3,6 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
 import { type UseRadioGroupProps } from './use-radio-group';
-export interface RadioGroupProps extends Assign<HTMLArkProps<'div'>, UseRadioGroupProps> {
+export interface RadioGroupRootProps extends Assign<HTMLArkProps<'div'>, UseRadioGroupProps> {
 }
-export declare const RadioGroup: ForwardRefExoticComponent<RadioGroupProps & RefAttributes<HTMLDivElement>>;
+export declare const RadioGroupRoot: ForwardRefExoticComponent<RadioGroupRootProps & RefAttributes<HTMLDivElement>>;

package/radio-group/{radio-group.mjs → radio-group-root.mjs}

@@ -7,7 +7,7 @@ import { ark } from '../factory.mjs';
 import { RadioGroupProvider } from './radio-group-context.mjs';
 import { useRadioGroup } from './use-radio-group.mjs';
 
-const RadioGroup = forwardRef((props, ref) => {
+const RadioGroupRoot = forwardRef((props, ref) => {
   const [useRadioGroupProps, localProps] = createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -25,6 +25,6 @@ const RadioGroup = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api.rootProps, localProps);
   return /* @__PURE__ */ jsx(RadioGroupProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });
-RadioGroup.displayName = "RadioGroup";
+RadioGroupRoot.displayName = "RadioGroupRoot";
 
-export { RadioGroup };
+export { RadioGroupRoot };

package/radio-group/stories/radio-group.stories.d.ts

@@ -1,8 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { RadioGroup } from '../';
-type RadioGroupType = typeof RadioGroup;
-declare const meta: Meta<RadioGroupType>;
+declare const meta: Meta;
 export default meta;
 export declare const Basic: () => JSX.Element;
 export declare const Disabled: () => JSX.Element;

package/radio-group/tests/basic.d.ts

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type RadioGroupRootProps } from '../';
+export declare const ComponentUnderTest: (props: RadioGroupRootProps) => JSX.Element;

package/radio-group/use-radio-group.cjs

@@ -6,9 +6,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const radio = require('@zag-js/radio-group');
 const react$1 = require('@zag-js/react');
 const react = require('react');
-require('../environment/index.cjs');
-const useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

package/radio-group/use-radio-group.mjs

@@ -2,9 +2,8 @@
 import * as radio from '@zag-js/radio-group';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
-import '../environment/index.mjs';
-import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
+import { useEvent } from '../use-event.mjs';
 
 const useRadioGroup = (props) => {
   const initialContext = {

package/rating-group/index.cjs

@@ -3,23 +3,24 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const ratingGroup = require('./rating-group.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 const ratingGroupControl = require('./rating-group-control.cjs');
 const ratingGroupItem = require('./rating-group-item.cjs');
 const ratingGroupItemContext = require('./rating-group-item-context.cjs');
 const ratingGroupLabel = require('./rating-group-label.cjs');
+const ratingGroupRoot = require('./rating-group-root.cjs');
 
-const RatingGroup = Object.assign(ratingGroup.RatingGroup, {
-  Root: ratingGroup.RatingGroup,
+const RatingGroup = {
+  Root: ratingGroupRoot.RatingGroupRoot,
   Control: ratingGroupControl.RatingGroupControl,
   Label: ratingGroupLabel.RatingGroupLabel,
   Item: ratingGroupItem.RatingGroupItem
-});
+};
 
 exports.useRatingGroupContext = ratingGroupContext.useRatingGroupContext;
 exports.RatingGroupControl = ratingGroupControl.RatingGroupControl;
 exports.RatingGroupItem = ratingGroupItem.RatingGroupItem;
 exports.useRatingGroupItemContext = ratingGroupItemContext.useRatingGroupItemContext;
 exports.RatingGroupLabel = ratingGroupLabel.RatingGroupLabel;
+exports.RatingGroupRoot = ratingGroupRoot.RatingGroupRoot;
 exports.RatingGroup = RatingGroup;

package/rating-group/index.d.ts

@@ -1,17 +1,17 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import type { HoverChangeDetails as RatingGroupHoverChangeDetails, ValueChangeDetails as RatingGroupValueChangeDetails } from '@zag-js/rating-group';
-import { type RatingGroupProps } from './rating-group';
 import { useRatingGroupContext, type RatingGroupContext } from './rating-group-context';
 import { RatingGroupControl, type RatingGroupControlProps } from './rating-group-control';
 import { RatingGroupItem, type RatingGroupItemProps } from './rating-group-item';
 import { useRatingGroupItemContext, type RatingGroupItemContext } from './rating-group-item-context';
 import { RatingGroupLabel, type RatingGroupLabelProps } from './rating-group-label';
-declare const RatingGroup: ForwardRefExoticComponent<RatingGroupProps & RefAttributes<HTMLDivElement>> & {
-    Root: ForwardRefExoticComponent<RatingGroupProps & RefAttributes<HTMLDivElement>>;
+import { RatingGroupRoot, type RatingGroupRootProps } from './rating-group-root';
+export declare const RatingGroup: {
+    Root: ForwardRefExoticComponent<RatingGroupRootProps & RefAttributes<HTMLDivElement>>;
     Control: ForwardRefExoticComponent<RatingGroupControlProps & RefAttributes<HTMLDivElement>>;
     Label: ForwardRefExoticComponent<RatingGroupLabelProps & RefAttributes<HTMLLabelElement>>;
     Item: ForwardRefExoticComponent<RatingGroupItemProps & RefAttributes<HTMLSpanElement>>;
 };
-export { RatingGroup, RatingGroupControl, RatingGroupItem, RatingGroupLabel, useRatingGroupContext, useRatingGroupItemContext, };
-export type { RatingGroupContext, RatingGroupControlProps, RatingGroupHoverChangeDetails, RatingGroupItemContext, RatingGroupItemProps, RatingGroupLabelProps, RatingGroupProps, RatingGroupValueChangeDetails, };
+export { RatingGroupControl, RatingGroupItem, RatingGroupLabel, RatingGroupRoot, useRatingGroupContext, useRatingGroupItemContext, };
+export type { RatingGroupContext, RatingGroupControlProps, RatingGroupHoverChangeDetails, RatingGroupItemContext, RatingGroupItemProps, RatingGroupLabelProps, RatingGroupRootProps, RatingGroupValueChangeDetails, };

package/rating-group/index.mjs

@@ -1,16 +1,16 @@
 'use client';
-import { RatingGroup as RatingGroup$1 } from './rating-group.mjs';
 export { useRatingGroupContext } from './rating-group-context.mjs';
 import { RatingGroupControl } from './rating-group-control.mjs';
 import { RatingGroupItem } from './rating-group-item.mjs';
 export { useRatingGroupItemContext } from './rating-group-item-context.mjs';
 import { RatingGroupLabel } from './rating-group-label.mjs';
+import { RatingGroupRoot } from './rating-group-root.mjs';
 
-const RatingGroup = Object.assign(RatingGroup$1, {
-  Root: RatingGroup$1,
+const RatingGroup = {
+  Root: RatingGroupRoot,
   Control: RatingGroupControl,
   Label: RatingGroupLabel,
   Item: RatingGroupItem
-});
+};
 
-export { RatingGroup, RatingGroupControl, RatingGroupItem, RatingGroupLabel };
+export { RatingGroup, RatingGroupControl, RatingGroupItem, RatingGroupLabel, RatingGroupRoot };

package/rating-group/{rating-group.cjs → rating-group-root.cjs}

@@ -11,7 +11,7 @@ const factory = require('../factory.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 const useRatingGroup = require('./use-rating-group.cjs');
 
-const RatingGroup = react.forwardRef((props, ref) => {
+const RatingGroupRoot = react.forwardRef((props, ref) => {
   const [useRatingProps, localProps] = createSplitProps.createSplitProps()(props, [
     "allowHalf",
     "autoFocus",
@@ -34,6 +34,6 @@ const RatingGroup = react.forwardRef((props, ref) => {
   const mergedProps = react$1.mergeProps(api.rootProps, localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(ratingGroupContext.RatingGroupProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });
-RatingGroup.displayName = "RatingGroup";
+RatingGroupRoot.displayName = "RatingGroupRoot";
 
-exports.RatingGroup = RatingGroup;
+exports.RatingGroupRoot = RatingGroupRoot;

package/rating-group/{rating-group.d.ts → rating-group-root.d.ts}

@@ -3,6 +3,6 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
 import { type UseRatingGroupProps } from './use-rating-group';
-export interface RatingGroupProps extends Assign<HTMLArkProps<'div'>, UseRatingGroupProps> {
+export interface RatingGroupRootProps extends Assign<HTMLArkProps<'div'>, UseRatingGroupProps> {
 }
-export declare const RatingGroup: ForwardRefExoticComponent<RatingGroupProps & RefAttributes<HTMLDivElement>>;
+export declare const RatingGroupRoot: ForwardRefExoticComponent<RatingGroupRootProps & RefAttributes<HTMLDivElement>>;

package/rating-group/{rating-group.mjs → rating-group-root.mjs}

@@ -7,7 +7,7 @@ import { ark } from '../factory.mjs';
 import { RatingGroupProvider } from './rating-group-context.mjs';
 import { useRatingGroup } from './use-rating-group.mjs';
 
-const RatingGroup = forwardRef((props, ref) => {
+const RatingGroupRoot = forwardRef((props, ref) => {
   const [useRatingProps, localProps] = createSplitProps()(props, [
     "allowHalf",
     "autoFocus",
@@ -30,6 +30,6 @@ const RatingGroup = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api.rootProps, localProps);
   return /* @__PURE__ */ jsx(RatingGroupProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });
-RatingGroup.displayName = "RatingGroup";
+RatingGroupRoot.displayName = "RatingGroupRoot";
 
-export { RatingGroup };
+export { RatingGroupRoot };

package/rating-group/stories/rating-group.stories.d.ts

@@ -1,8 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { RatingGroup } from '../';
-type RatingGroupType = typeof RatingGroup;
-declare const meta: Meta<RatingGroupType>;
+declare const meta: Meta;
 export default meta;
 export declare const Basic: () => JSX.Element;
 export declare const HalfRatings: () => JSX.Element;

package/rating-group/tests/basic.d.ts

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type RatingGroupRootProps } from '../';
+export declare const ComponentUnderTest: (props: RatingGroupRootProps) => JSX.Element;

package/rating-group/use-rating-group.cjs

@@ -6,9 +6,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const rating = require('@zag-js/rating-group');
 const react$1 = require('@zag-js/react');
 const react = require('react');
-require('../environment/index.cjs');
-const useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

package/rating-group/use-rating-group.mjs

@@ -2,9 +2,8 @@
 import * as rating from '@zag-js/rating-group';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
-import '../environment/index.mjs';
-import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
+import { useEvent } from '../use-event.mjs';
 
 const useRatingGroup = (props) => {
   const initialContext = {

package/segment-group/index.cjs

@@ -3,7 +3,6 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const segmentGroup = require('./segment-group.cjs');
 const segmentGroupContext = require('./segment-group-context.cjs');
 const segmentGroupIndicator = require('./segment-group-indicator.cjs');
 const segmentGroupItem = require('./segment-group-item.cjs');
@@ -11,15 +10,16 @@ const segmentGroupItemContext = require('./segment-group-item-context.cjs');
 const segmentGroupItemControl = require('./segment-group-item-control.cjs');
 const segmentGroupItemText = require('./segment-group-item-text.cjs');
 const segmentGroupLabel = require('./segment-group-label.cjs');
+const segmentGroupRoot = require('./segment-group-root.cjs');
 
-const SegmentGroup = Object.assign(segmentGroup.SegmentGroup, {
-  Root: segmentGroup.SegmentGroup,
+const SegmentGroup = {
+  Root: segmentGroupRoot.SegmentGroupRoot,
   Indicator: segmentGroupIndicator.SegmentGroupIndicator,
   Item: segmentGroupItem.SegmentGroupItem,
   ItemControl: segmentGroupItemControl.SegmentGroupItemControl,
   ItemText: segmentGroupItemText.SegmentGroupItemText,
   Label: segmentGroupLabel.SegmentGroupLabel
-});
+};
 
 exports.useSegmentGroupContext = segmentGroupContext.useSegmentGroupContext;
 exports.SegmentGroupIndicator = segmentGroupIndicator.SegmentGroupIndicator;
@@ -28,4 +28,5 @@ exports.useSegmentGroupItemContext = segmentGroupItemContext.useSegmentGroupItem
 exports.SegmentGroupItemControl = segmentGroupItemControl.SegmentGroupItemControl;
 exports.SegmentGroupItemText = segmentGroupItemText.SegmentGroupItemText;
 exports.SegmentGroupLabel = segmentGroupLabel.SegmentGroupLabel;
+exports.SegmentGroupRoot = segmentGroupRoot.SegmentGroupRoot;
 exports.SegmentGroup = SegmentGroup;

package/segment-group/index.d.ts

@@ -1,7 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import type { ValueChangeDetails as SegmentGroupValueChangeDetails } from '@zag-js/radio-group';
-import { type SegmentGroupProps } from './segment-group';
 import { useSegmentGroupContext, type SegmentGroupContext } from './segment-group-context';
 import { SegmentGroupIndicator, type SegmentGroupIndicatorProps } from './segment-group-indicator';
 import { SegmentGroupItem, type SegmentGroupItemProps } from './segment-group-item';
@@ -9,13 +8,14 @@ import { useSegmentGroupItemContext, type SegmentGroupItemContext } from './segm
 import { SegmentGroupItemControl, type SegmentGroupItemControlProps } from './segment-group-item-control';
 import { SegmentGroupItemText, type SegmentGroupItemTextProps } from './segment-group-item-text';
 import { SegmentGroupLabel, type SegmentGroupLabelProps } from './segment-group-label';
-declare const SegmentGroup: ForwardRefExoticComponent<SegmentGroupProps & RefAttributes<HTMLDivElement>> & {
-    Root: ForwardRefExoticComponent<SegmentGroupProps & RefAttributes<HTMLDivElement>>;
+import { SegmentGroupRoot, type SegmentGroupRootProps } from './segment-group-root';
+export declare const SegmentGroup: {
+    Root: ForwardRefExoticComponent<SegmentGroupRootProps & RefAttributes<HTMLDivElement>>;
     Indicator: ForwardRefExoticComponent<SegmentGroupIndicatorProps & RefAttributes<HTMLDivElement>>;
     Item: ForwardRefExoticComponent<SegmentGroupItemProps & RefAttributes<HTMLLabelElement>>;
     ItemControl: ForwardRefExoticComponent<SegmentGroupItemControlProps & RefAttributes<HTMLDivElement>>;
     ItemText: ForwardRefExoticComponent<SegmentGroupItemTextProps & RefAttributes<HTMLSpanElement>>;
     Label: ForwardRefExoticComponent<SegmentGroupLabelProps & RefAttributes<HTMLLabelElement>>;
 };
-export { SegmentGroup, SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel, useSegmentGroupContext, useSegmentGroupItemContext, };
-export type { SegmentGroupContext, SegmentGroupIndicatorProps, SegmentGroupItemContext, SegmentGroupItemControlProps, SegmentGroupItemProps, SegmentGroupItemTextProps, SegmentGroupLabelProps, SegmentGroupProps, SegmentGroupValueChangeDetails, };
+export { SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel, SegmentGroupRoot, useSegmentGroupContext, useSegmentGroupItemContext, };
+export type { SegmentGroupContext, SegmentGroupIndicatorProps, SegmentGroupItemContext, SegmentGroupItemControlProps, SegmentGroupItemProps, SegmentGroupItemTextProps, SegmentGroupLabelProps, SegmentGroupRootProps, SegmentGroupValueChangeDetails, };

package/segment-group/index.mjs

@@ -1,5 +1,4 @@
 'use client';
-import { SegmentGroup as SegmentGroup$1 } from './segment-group.mjs';
 export { useSegmentGroupContext } from './segment-group-context.mjs';
 import { SegmentGroupIndicator } from './segment-group-indicator.mjs';
 import { SegmentGroupItem } from './segment-group-item.mjs';
@@ -7,14 +6,15 @@ export { useSegmentGroupItemContext } from './segment-group-item-context.mjs';
 import { SegmentGroupItemControl } from './segment-group-item-control.mjs';
 import { SegmentGroupItemText } from './segment-group-item-text.mjs';
 import { SegmentGroupLabel } from './segment-group-label.mjs';
+import { SegmentGroupRoot } from './segment-group-root.mjs';
 
-const SegmentGroup = Object.assign(SegmentGroup$1, {
-  Root: SegmentGroup$1,
+const SegmentGroup = {
+  Root: SegmentGroupRoot,
   Indicator: SegmentGroupIndicator,
   Item: SegmentGroupItem,
   ItemControl: SegmentGroupItemControl,
   ItemText: SegmentGroupItemText,
   Label: SegmentGroupLabel
-});
+};
 
-export { SegmentGroup, SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel };
+export { SegmentGroup, SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel, SegmentGroupRoot };

package/segment-group/{segment-group.cjs → segment-group-root.cjs}

@@ -12,7 +12,7 @@ const factory = require('../factory.cjs');
 const segmentGroupContext = require('./segment-group-context.cjs');
 const useSegmentGroup = require('./use-segment-group.cjs');
 
-const SegmentGroup = react.forwardRef((props, ref) => {
+const SegmentGroupRoot = react.forwardRef((props, ref) => {
   const [useSegmentGroupProps, localProps] = createSplitProps.createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -34,6 +34,6 @@ const SegmentGroup = react.forwardRef((props, ref) => {
   );
   return /* @__PURE__ */ jsxRuntime.jsx(segmentGroupContext.SegmentGroupProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });
-SegmentGroup.displayName = "SegmentGroup";
+SegmentGroupRoot.displayName = "SegmentGroupRoot";
 
-exports.SegmentGroup = SegmentGroup;
+exports.SegmentGroupRoot = SegmentGroupRoot;

package/segment-group/{segment-group.d.ts → segment-group-root.d.ts}

@@ -3,6 +3,6 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
 import { type UseSegmentGroupProps } from './use-segment-group';
-export interface SegmentGroupProps extends Assign<HTMLArkProps<'div'>, UseSegmentGroupProps> {
+export interface SegmentGroupRootProps extends Assign<HTMLArkProps<'div'>, UseSegmentGroupProps> {
 }
-export declare const SegmentGroup: ForwardRefExoticComponent<SegmentGroupProps & RefAttributes<HTMLDivElement>>;
+export declare const SegmentGroupRoot: ForwardRefExoticComponent<SegmentGroupRootProps & RefAttributes<HTMLDivElement>>;

package/segment-group/{segment-group.mjs → segment-group-root.mjs}

@@ -8,7 +8,7 @@ import { ark } from '../factory.mjs';
 import { SegmentGroupProvider } from './segment-group-context.mjs';
 import { useSegmentGroup } from './use-segment-group.mjs';
 
-const SegmentGroup = forwardRef((props, ref) => {
+const SegmentGroupRoot = forwardRef((props, ref) => {
   const [useSegmentGroupProps, localProps] = createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -30,6 +30,6 @@ const SegmentGroup = forwardRef((props, ref) => {
   );
   return /* @__PURE__ */ jsx(SegmentGroupProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });
-SegmentGroup.displayName = "SegmentGroup";
+SegmentGroupRoot.displayName = "SegmentGroupRoot";
 
-export { SegmentGroup };
+export { SegmentGroupRoot };

package/segment-group/stories/segment-group.stories.d.ts

@@ -1,8 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { SegmentGroup } from '../';
-type SegmentGroupType = typeof SegmentGroup;
-declare const meta: Meta<SegmentGroupType>;
+declare const meta: Meta;
 export default meta;
 export declare const Basic: () => JSX.Element;
 export declare const InitialValue: () => JSX.Element;

package/segment-group/tests/basic.d.ts

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type SegmentGroupRootProps } from '../';
+export declare const ComponentUnderTest: (props: SegmentGroupRootProps) => JSX.Element;

package/segment-group/use-segment-group.cjs

@@ -6,9 +6,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const radio = require('@zag-js/radio-group');
 const react$1 = require('@zag-js/react');
 const react = require('react');
-require('../environment/index.cjs');
-const useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

package/segment-group/use-segment-group.mjs

@@ -2,9 +2,8 @@
 import * as radio from '@zag-js/radio-group';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
-import '../environment/index.mjs';
-import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
+import { useEvent } from '../use-event.mjs';
 
 const useSegmentGroup = (props) => {
   const initialContext = {

package/select/index.cjs

@@ -3,7 +3,6 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const select = require('./select.cjs');
 const selectClearTrigger = require('./select-clear-trigger.cjs');
 const selectContent = require('./select-content.cjs');
 const selectContext = require('./select-context.cjs');
@@ -17,11 +16,12 @@ const selectItemIndicator = require('./select-item-indicator.cjs');
 const selectItemText = require('./select-item-text.cjs');
 const selectLabel = require('./select-label.cjs');
 const selectPositioner = require('./select-positioner.cjs');
+const selectRoot = require('./select-root.cjs');
 const selectTrigger = require('./select-trigger.cjs');
 const selectValueText = require('./select-value-text.cjs');
 
-const Select = Object.assign(select.Select, {
-  Root: select.Select,
+const Select = {
+  Root: selectRoot.SelectRoot,
   ClearTrigger: selectClearTrigger.SelectClearTrigger,
   Content: selectContent.SelectContent,
   Control: selectControl.SelectControl,
@@ -35,7 +35,7 @@ const Select = Object.assign(select.Select, {
   Positioner: selectPositioner.SelectPositioner,
   Trigger: selectTrigger.SelectTrigger,
   ValueText: selectValueText.SelectValueText
-});
+};
 
 exports.SelectClearTrigger = selectClearTrigger.SelectClearTrigger;
 exports.SelectContent = selectContent.SelectContent;
@@ -50,6 +50,7 @@ exports.SelectItemIndicator = selectItemIndicator.SelectItemIndicator;
 exports.SelectItemText = selectItemText.SelectItemText;
 exports.SelectLabel = selectLabel.SelectLabel;
 exports.SelectPositioner = selectPositioner.SelectPositioner;
+exports.SelectRoot = selectRoot.SelectRoot;
 exports.SelectTrigger = selectTrigger.SelectTrigger;
 exports.SelectValueText = selectValueText.SelectValueText;
 exports.Select = Select;