@ark-ui/solid 1.3.0 → 2.0.0

package/types/pin-input/pin-input-input.d.ts

@@ -1,7 +1,9 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 export interface PinInputInputProps extends Assign<HTMLArkProps<'input'>, {
     index: number;
 }> {
 }
-export declare const PinInputInput: (props: PinInputInputProps) => import("solid-js").JSX.Element;
+export declare const PinInputInput: ArkComponent<'input', {
+    index: number;
+}>;

package/types/pin-input/pin-input-label.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PinInputLabelProps extends HTMLArkProps<'label'> {
 }
-export declare const PinInputLabel: (props: PinInputLabelProps) => import("solid-js").JSX.Element;
+export declare const PinInputLabel: ArkComponent<'label'>;

package/types/pin-input/pin-input-root.d.ts

@@ -0,0 +1,6 @@
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UsePinInputProps } from './use-pin-input';
+export interface PinInputRootProps extends Assign<HTMLArkProps<'div'>, UsePinInputProps> {
+}
+export declare const PinInputRoot: ArkComponent<'div', UsePinInputProps>;

package/types/popover/index.d.ts

@@ -1,5 +1,4 @@
 import type { OpenChangeDetails as PopoverOpenChangeDetails } from '@zag-js/popover';
-import { type PopoverProps } from './popover';
 import { PopoverAnchor, type PopoverAnchorProps } from './popover-anchor';
 import { PopoverArrow, type PopoverArrowProps } from './popover-arrow';
 import { PopoverArrowTip, type PopoverArrowTipProps } from './popover-arrow-tip';
@@ -9,20 +8,21 @@ import { usePopoverContext, type PopoverContext } from './popover-context';
 import { PopoverDescription, type PopoverDescriptionProps } from './popover-description';
 import { PopoverIndicator, type PopoverIndicatorProps } from './popover-indicator';
 import { PopoverPositioner, type PopoverPositionerProps } from './popover-positioner';
+import { PopoverRoot, type PopoverRootProps } from './popover-root';
 import { PopoverTitle, type PopoverTitleProps } from './popover-title';
 import { PopoverTrigger, type PopoverTriggerProps } from './popover-trigger';
-declare const Popover: ((props: PopoverProps) => import("solid-js").JSX.Element) & {
-    Root: (props: PopoverProps) => import("solid-js").JSX.Element;
-    Anchor: (props: PopoverAnchorProps) => import("solid-js").JSX.Element;
-    Arrow: (props: PopoverArrowProps) => import("solid-js").JSX.Element;
-    ArrowTip: (props: PopoverArrowTipProps) => import("solid-js").JSX.Element;
-    CloseTrigger: (props: PopoverCloseTriggerProps) => import("solid-js").JSX.Element;
-    Content: (props: PopoverContentProps) => import("solid-js").JSX.Element;
-    Description: (props: PopoverDescriptionProps) => import("solid-js").JSX.Element;
-    Indicator: (props: PopoverIndicatorProps) => import("solid-js").JSX.Element;
-    Positioner: (props: PopoverPositionerProps) => import("solid-js").JSX.Element;
-    Title: (props: PopoverTitleProps) => import("solid-js").JSX.Element;
-    Trigger: (props: PopoverTriggerProps) => import("solid-js").JSX.Element;
+export declare const Popover: {
+    Root: (props: PopoverRootProps) => import("solid-js").JSX.Element;
+    Anchor: import("..").ArkComponent<"div", object>;
+    Arrow: import("..").ArkComponent<"div", object>;
+    ArrowTip: import("..").ArkComponent<"div", object>;
+    CloseTrigger: import("..").ArkComponent<"button", object>;
+    Content: import("..").ArkComponent<"div", object>;
+    Description: import("..").ArkComponent<"p", object>;
+    Indicator: import("..").ArkComponent<"div", object>;
+    Positioner: import("..").ArkComponent<"div", object>;
+    Title: import("..").ArkComponent<"div", object>;
+    Trigger: import("..").ArkComponent<"button", object>;
 };
-export { Popover, PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverIndicator, PopoverPositioner, PopoverTitle, PopoverTrigger, usePopoverContext, };
-export type { PopoverAnchorProps, PopoverArrowProps, PopoverArrowTipProps, PopoverCloseTriggerProps, PopoverContentProps, PopoverContext, PopoverDescriptionProps, PopoverIndicatorProps, PopoverOpenChangeDetails, PopoverPositionerProps, PopoverProps, PopoverTitleProps, PopoverTriggerProps, };
+export { PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverIndicator, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, usePopoverContext, };
+export type { PopoverAnchorProps, PopoverArrowProps, PopoverArrowTipProps, PopoverCloseTriggerProps, PopoverContentProps, PopoverContext, PopoverDescriptionProps, PopoverIndicatorProps, PopoverOpenChangeDetails, PopoverPositionerProps, PopoverRootProps, PopoverTitleProps, PopoverTriggerProps, };

package/types/popover/popover-anchor.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverAnchorProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverAnchor: (props: PopoverAnchorProps) => import("solid-js").JSX.Element;
+export declare const PopoverAnchor: ArkComponent<'div'>;

package/types/popover/popover-arrow-tip.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverArrowTipProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverArrowTip: (props: PopoverArrowTipProps) => import("solid-js").JSX.Element;
+export declare const PopoverArrowTip: ArkComponent<'div'>;

package/types/popover/popover-arrow.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverArrowProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverArrow: (props: PopoverArrowProps) => import("solid-js").JSX.Element;
+export declare const PopoverArrow: ArkComponent<'div'>;

package/types/popover/popover-close-trigger.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverCloseTriggerProps extends HTMLArkProps<'button'> {
 }
-export declare const PopoverCloseTrigger: (props: PopoverCloseTriggerProps) => import("solid-js").JSX.Element;
+export declare const PopoverCloseTrigger: ArkComponent<'button'>;

package/types/popover/popover-content.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverContentProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverContent: (props: PopoverContentProps) => import("solid-js").JSX.Element;
+export declare const PopoverContent: ArkComponent<'div'>;

package/types/popover/popover-description.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverDescriptionProps extends HTMLArkProps<'p'> {
 }
-export declare const PopoverDescription: (props: PopoverDescriptionProps) => import("solid-js").JSX.Element;
+export declare const PopoverDescription: ArkComponent<'p'>;

package/types/popover/popover-indicator.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverIndicatorProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverIndicator: (props: PopoverIndicatorProps) => import("solid-js").JSX.Element;
+export declare const PopoverIndicator: ArkComponent<'div'>;

package/types/popover/popover-positioner.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverPositionerProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverPositioner: (props: PopoverPositionerProps) => import("solid-js").JSX.Element;
+export declare const PopoverPositioner: ArkComponent<'div'>;

package/types/popover/{popover.d.ts → popover-root.d.ts}

@@ -1,7 +1,7 @@
 import { type JSX } from 'solid-js';
 import { type UsePresenceProps } from '../presence';
 import { type UsePopoverProps, type UsePopoverReturn } from './use-popover';
-export interface PopoverProps extends UsePopoverProps, UsePresenceProps {
+export interface PopoverRootProps extends UsePopoverProps, UsePresenceProps {
     children?: JSX.Element | ((api: UsePopoverReturn) => JSX.Element);
 }
-export declare const Popover: (props: PopoverProps) => JSX.Element;
+export declare const PopoverRoot: (props: PopoverRootProps) => JSX.Element;

package/types/popover/popover-title.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverTitleProps extends HTMLArkProps<'div'> {
 }
-export declare const PopoverTitle: (props: PopoverTitleProps) => import("solid-js").JSX.Element;
+export declare const PopoverTitle: ArkComponent<'div'>;

package/types/popover/popover-trigger.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface PopoverTriggerProps extends HTMLArkProps<'button'> {
 }
-export declare const PopoverTrigger: (props: PopoverTriggerProps) => import("solid-js").JSX.Element;
+export declare const PopoverTrigger: ArkComponent<'button'>;

package/types/presence/index.d.ts

@@ -1,10 +1,7 @@
-import { type PresenceProps } from './presence';
+import { Presence, type PresenceProps } from './presence';
 import { PresenceProvider, usePresenceContext, type PresenceContext } from './presence-context';
 import { PresencePropsProvider, usePresencePropsContext, type PresencePropsContext } from './presence-props-context';
 import { splitPresenceProps } from './split-presence-props';
 import { usePresence, type UsePresenceProps, type UsePresenceReturn } from './use-presence';
-declare const Presence: ((props: PresenceProps) => import("solid-js").JSX.Element) & {
-    Root: (props: PresenceProps) => import("solid-js").JSX.Element;
-};
 export { Presence, PresencePropsProvider, PresenceProvider, splitPresenceProps, usePresence, usePresenceContext, usePresencePropsContext, };
 export type { PresenceContext, PresenceProps, PresencePropsContext, UsePresenceProps, UsePresenceReturn, };

package/types/presence/presence.d.ts

@@ -1,6 +1,6 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type UsePresenceProps } from './use-presence';
 export interface PresenceProps extends Assign<HTMLArkProps<'div'>, UsePresenceProps> {
 }
-export declare const Presence: (props: PresenceProps) => import("solid-js").JSX.Element;
+export declare const Presence: ArkComponent<'div', UsePresenceProps>;

package/types/progress/index.d.ts

@@ -1,23 +1,23 @@
-import { type ProgressProps } from './progress';
 import { ProgressCircle, type ProgressCircleProps } from './progress-circle';
 import { ProgressCircleRange, type ProgressCircleRangeProps } from './progress-circle-range';
 import { ProgressCircleTrack, type ProgressCircleTrackProps } from './progress-circle-track';
 import { useProgressContext, type ProgressContext } from './progress-context';
-import { ProgressIndicator, type ProgressIndicatorProps } from './progress-indicator';
 import { ProgressLabel, type ProgressLabelProps } from './progress-label';
 import { ProgressRange, type ProgressRangeProps } from './progress-range';
+import { ProgressRoot, type ProgressRootProps } from './progress-root';
 import { ProgressTrack, type ProgressTrackProps } from './progress-track';
 import { ProgressValueText, type ProgressValueTextProps } from './progress-value-text';
-declare const Progress: ((props: ProgressProps) => import("solid-js").JSX.Element) & {
-    Root: (props: ProgressProps) => import("solid-js").JSX.Element;
-    Label: (props: ProgressLabelProps) => import("solid-js").JSX.Element;
-    Track: (props: ProgressTrackProps) => import("solid-js").JSX.Element;
-    Range: (props: ProgressRangeProps) => import("solid-js").JSX.Element;
-    ValueText: (props: ProgressValueTextProps) => import("solid-js").JSX.Element;
-    Indicator: (props: ProgressIndicatorProps) => import("solid-js").JSX.Element;
-    Circle: (props: ProgressCircleProps) => import("solid-js").JSX.Element;
-    CircleTrack: (props: ProgressCircleTrackProps) => import("solid-js").JSX.Element;
-    CircleRange: (props: ProgressCircleRangeProps) => import("solid-js").JSX.Element;
+import { ProgressView, type ProgressViewProps } from './progress-view';
+export declare const Progress: {
+    Root: import("..").ArkComponent<"div", ProgressRootProps>;
+    Label: import("..").ArkComponent<"label", object>;
+    Track: import("..").ArkComponent<"div", object>;
+    Range: import("..").ArkComponent<"div", object>;
+    ValueText: import("..").ArkComponent<"span", object>;
+    View: import("..").ArkComponent<"span", import("@zag-js/progress").ViewProps>;
+    Circle: import("..").ArkComponent<"svg", object>;
+    CircleTrack: import("..").ArkComponent<"circle", object>;
+    CircleRange: import("..").ArkComponent<"circle", object>;
 };
-export { Progress, ProgressCircle, ProgressCircleRange, ProgressCircleTrack, ProgressIndicator, ProgressLabel, ProgressRange, ProgressTrack, ProgressValueText, useProgressContext, };
-export type { ProgressCircleProps, ProgressCircleRangeProps, ProgressCircleTrackProps, ProgressContext, ProgressIndicatorProps, ProgressLabelProps, ProgressProps, ProgressRangeProps, ProgressTrackProps, ProgressValueTextProps, };
+export { ProgressCircle, ProgressCircleRange, ProgressCircleTrack, ProgressLabel, ProgressRange, ProgressRoot, ProgressTrack, ProgressValueText, ProgressView, useProgressContext, };
+export type { ProgressCircleProps, ProgressCircleRangeProps, ProgressCircleTrackProps, ProgressContext, ProgressLabelProps, ProgressRangeProps, ProgressRootProps, ProgressTrackProps, ProgressValueTextProps, ProgressViewProps, };

package/types/progress/progress-circle-range.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressCircleRangeProps extends HTMLArkProps<'circle'> {
 }
-export declare const ProgressCircleRange: (props: ProgressCircleRangeProps) => import("solid-js").JSX.Element;
+export declare const ProgressCircleRange: ArkComponent<'circle'>;

package/types/progress/progress-circle-track.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressCircleTrackProps extends HTMLArkProps<'circle'> {
 }
-export declare const ProgressCircleTrack: (props: ProgressCircleTrackProps) => import("solid-js").JSX.Element;
+export declare const ProgressCircleTrack: ArkComponent<'circle'>;

package/types/progress/progress-circle.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressCircleProps extends HTMLArkProps<'svg'> {
 }
-export declare const ProgressCircle: (props: ProgressCircleProps) => import("solid-js").JSX.Element;
+export declare const ProgressCircle: ArkComponent<'svg'>;

package/types/progress/progress-label.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressLabelProps extends HTMLArkProps<'label'> {
 }
-export declare const ProgressLabel: (props: ProgressLabelProps) => import("solid-js").JSX.Element;
+export declare const ProgressLabel: ArkComponent<'label'>;

package/types/progress/progress-range.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressRangeProps extends HTMLArkProps<'div'> {
 }
-export declare const ProgressRange: (props: ProgressRangeProps) => import("solid-js").JSX.Element;
+export declare const ProgressRange: ArkComponent<'div'>;

package/types/progress/progress-root.d.ts

@@ -0,0 +1,11 @@
+import type { JSX } from 'solid-js';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import { type Assign } from '../types';
+import { type UseProgressProps, type UseProgressReturn } from './use-progress';
+interface ElementProps extends UseProgressProps {
+    children?: JSX.Element | ((api: UseProgressReturn) => JSX.Element);
+}
+export interface ProgressRootProps extends Assign<HTMLArkProps<'div'>, ElementProps> {
+}
+export declare const ProgressRoot: ArkComponent<'div', ProgressRootProps>;
+export {};

package/types/progress/progress-track.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressTrackProps extends HTMLArkProps<'div'> {
 }
-export declare const ProgressTrack: (props: ProgressTrackProps) => import("solid-js").JSX.Element;
+export declare const ProgressTrack: ArkComponent<'div'>;

package/types/progress/progress-value-text.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface ProgressValueTextProps extends HTMLArkProps<'span'> {
 }
-export declare const ProgressValueText: (props: ProgressValueTextProps) => import("solid-js").JSX.Element;
+export declare const ProgressValueText: ArkComponent<'span'>;

package/types/progress/progress-view.d.ts

@@ -0,0 +1,6 @@
+import type { ViewProps } from '@zag-js/progress';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export interface ProgressViewProps extends Assign<HTMLArkProps<'span'>, ViewProps> {
+}
+export declare const ProgressView: ArkComponent<'span', ViewProps>;

package/types/radio-group/index.d.ts

@@ -1,5 +1,4 @@
 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';
@@ -7,13 +6,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: ((props: RadioGroupProps) => import("solid-js").JSX.Element) & {
-    Root: (props: RadioGroupProps) => import("solid-js").JSX.Element;
-    Indicator: (props: RadioGroupIndicatorProps) => import("solid-js").JSX.Element;
-    Item: (props: RadioGroupItemProps) => import("solid-js").JSX.Element;
-    ItemControl: (props: RadioGroupItemControlProps) => import("solid-js").JSX.Element;
-    ItemText: (props: RadioGroupItemTextProps) => import("solid-js").JSX.Element;
-    Label: (props: RadioGroupLabelProps) => import("solid-js").JSX.Element;
+import { RadioGroupRoot, type RadioGroupRootProps } from './radio-group-root';
+export declare const RadioGroup: {
+    Root: import("..").ArkComponent<"div", import("./use-radio-group").UseRadioGroupProps>;
+    Indicator: import("..").ArkComponent<"div", object>;
+    Item: import("..").ArkComponent<"label", RadioGroupItemProps>;
+    ItemControl: import("..").ArkComponent<"div", object>;
+    ItemText: import("..").ArkComponent<"span", object>;
+    Label: import("..").ArkComponent<"label", object>;
 };
-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/types/radio-group/radio-group-indicator.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface RadioGroupIndicatorProps extends HTMLArkProps<'div'> {
 }
-export declare const RadioGroupIndicator: (props: RadioGroupIndicatorProps) => import("solid-js").JSX.Element;
+export declare const RadioGroupIndicator: ArkComponent<'div'>;

package/types/radio-group/radio-group-item-control.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface RadioGroupItemControlProps extends HTMLArkProps<'div'> {
 }
-export declare const RadioGroupItemControl: (props: RadioGroupItemControlProps) => import("solid-js").JSX.Element;
+export declare const RadioGroupItemControl: ArkComponent<'div'>;

package/types/radio-group/radio-group-item-text.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface RadioGroupItemTextProps extends HTMLArkProps<'span'> {
 }
-export declare const RadioGroupItemText: (props: RadioGroupItemTextProps) => import("solid-js").JSX.Element;
+export declare const RadioGroupItemText: ArkComponent<'span'>;

package/types/radio-group/radio-group-item.d.ts

@@ -1,9 +1,11 @@
 import type { ItemProps, ItemState } from '@zag-js/radio-group';
 import type { JSX } from 'solid-js/jsx-runtime';
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
-export interface RadioGroupItemProps extends Assign<HTMLArkProps<'label'>, {
+interface ElementProps extends ItemProps {
     children?: ((state: ItemState) => JSX.Element) | JSX.Element;
-}>, ItemProps {
 }
-export declare const RadioGroupItem: (props: RadioGroupItemProps) => JSX.Element;
+export interface RadioGroupItemProps extends Assign<HTMLArkProps<'label'>, ElementProps> {
+}
+export declare const RadioGroupItem: ArkComponent<'label', RadioGroupItemProps>;
+export {};

package/types/radio-group/radio-group-label.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface RadioGroupLabelProps extends HTMLArkProps<'label'> {
 }
-export declare const RadioGroupLabel: (props: RadioGroupLabelProps) => import("solid-js").JSX.Element;
+export declare const RadioGroupLabel: ArkComponent<'label'>;

package/types/radio-group/radio-group-root.d.ts

@@ -0,0 +1,6 @@
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UseRadioGroupProps } from './use-radio-group';
+export interface RadioGroupRootProps extends Assign<HTMLArkProps<'div'>, UseRadioGroupProps> {
+}
+export declare const RadioGroupRoot: ArkComponent<'div', UseRadioGroupProps>;

package/types/rating-group/rating-group-control.d.ts

@@ -1,9 +1,11 @@
 import { type JSX } from 'solid-js';
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import type { UseRatingGroupReturn } from './use-rating-group';
-export interface RatingGroupControlProps extends Assign<HTMLArkProps<'div'>, {
+interface ElementProps {
     children?: JSX.Element | ((api: UseRatingGroupReturn) => JSX.Element);
-}> {
 }
-export declare const RatingGroupControl: (props: RatingGroupControlProps) => JSX.Element;
+export interface RatingGroupControlProps extends Assign<HTMLArkProps<'div'>, ElementProps> {
+}
+export declare const RatingGroupControl: ArkComponent<'div', ElementProps>;
+export {};

package/types/rating-group/rating-group-item.d.ts

@@ -1,9 +1,11 @@
 import type { ItemProps, ItemState } from '@zag-js/rating-group';
 import { type Accessor, type JSX } from 'solid-js';
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
-export interface RatingGroupItemProps extends Assign<HTMLArkProps<'span'>, {
+interface ElementProps extends ItemProps {
     children?: JSX.Element | ((state: Accessor<ItemState>) => JSX.Element);
-}>, ItemProps {
 }
-export declare const RatingGroupItem: (props: RatingGroupItemProps) => JSX.Element;
+export interface RatingGroupItemProps extends Assign<HTMLArkProps<'span'>, ElementProps> {
+}
+export declare const RatingGroupItem: ArkComponent<'span', ElementProps>;
+export {};

package/types/rating-group/rating-group-label.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface RatingGroupLabelProps extends HTMLArkProps<'label'> {
 }
-export declare const RatingGroupLabel: (props: RatingGroupLabelProps) => import("solid-js").JSX.Element;
+export declare const RatingGroupLabel: ArkComponent<'label'>;

package/types/rating-group/rating-group-root.d.ts

@@ -0,0 +1,6 @@
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UseRatingGroupProps } from './use-rating-group';
+export interface RatingGroupRootProps extends Assign<HTMLArkProps<'div'>, UseRatingGroupProps> {
+}
+export declare const RatingGroupRoot: ArkComponent<'div', UseRatingGroupProps>;

package/types/segment-group/segment-group-indicator.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SegmentGroupIndicatorProps extends HTMLArkProps<'div'> {
 }
-export declare const SegmentGroupIndicator: (props: SegmentGroupIndicatorProps) => import("solid-js").JSX.Element;
+export declare const SegmentGroupIndicator: ArkComponent<'div'>;

package/types/segment-group/segment-group-item-control.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SegmentGroupItemControlProps extends HTMLArkProps<'div'> {
 }
-export declare const SegmentGroupItemControl: (props: SegmentGroupItemControlProps) => import("solid-js").JSX.Element;
+export declare const SegmentGroupItemControl: ArkComponent<'div'>;

package/types/segment-group/segment-group-item-text.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SegmentGroupItemTextProps extends HTMLArkProps<'span'> {
 }
-export declare const SegmentGroupItemText: (props: SegmentGroupItemTextProps) => import("solid-js").JSX.Element;
+export declare const SegmentGroupItemText: ArkComponent<'span'>;

package/types/segment-group/segment-group-item.d.ts

@@ -1,10 +1,12 @@
 import type { ItemState } from '@zag-js/radio-group';
 import type { JSX } from 'solid-js/jsx-runtime';
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type SegmentGroupItemContext } from './segment-group-item-context';
-export interface SegmentGroupItemProps extends Assign<HTMLArkProps<'label'>, {
-    children?: ((state: ItemState) => JSX.Element) | JSX.Element;
-}>, SegmentGroupItemContext {
+interface ElementProps extends SegmentGroupItemContext {
+    children?: JSX.Element | ((state: ItemState) => JSX.Element);
 }
-export declare const SegmentGroupItem: (props: SegmentGroupItemProps) => JSX.Element;
+export interface SegmentGroupItemProps extends Assign<HTMLArkProps<'label'>, ElementProps> {
+}
+export declare const SegmentGroupItem: ArkComponent<'label', ElementProps>;
+export {};

package/types/segment-group/segment-group-label.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SegmentGroupLabelProps extends HTMLArkProps<'label'> {
 }
-export declare const SegmentGroupLabel: (props: SegmentGroupLabelProps) => import("solid-js").JSX.Element;
+export declare const SegmentGroupLabel: ArkComponent<'label'>;

package/types/segment-group/segment-group-root.d.ts

@@ -0,0 +1,6 @@
+import { type ArkComponent, type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UseSegmentGroupProps } from './use-segment-group';
+export interface SegmentGroupRootProps extends Assign<HTMLArkProps<'div'>, UseSegmentGroupProps> {
+}
+export declare const SegmentGroupRoot: ArkComponent<'div', UseSegmentGroupProps>;

package/types/select/select-clear-trigger.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectClearTriggerProps extends HTMLArkProps<'button'> {
 }
-export declare const SelectClearTrigger: (props: SelectClearTriggerProps) => import("solid-js").JSX.Element;
+export declare const SelectClearTrigger: ArkComponent<'button'>;

package/types/select/select-content.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectContentProps extends HTMLArkProps<'div'> {
 }
-export declare const SelectContent: (props: SelectContentProps) => import("solid-js").JSX.Element;
+export declare const SelectContent: ArkComponent<'div'>;

package/types/select/select-control.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectControlProps extends HTMLArkProps<'div'> {
 }
-export declare const SelectControl: (props: SelectControlProps) => import("solid-js").JSX.Element;
+export declare const SelectControl: ArkComponent<'div'>;

package/types/select/select-indicator.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectIndicatorProps extends HTMLArkProps<'div'> {
 }
-export declare const SelectIndicator: (props: SelectIndicatorProps) => import("solid-js").JSX.Element;
+export declare const SelectIndicator: ArkComponent<'div'>;

package/types/select/select-item-group-label.d.ts

@@ -1,9 +1,9 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 interface ItemGroupLabelProps {
     for: string;
 }
 export interface SelectItemGroupLabelProps extends Assign<HTMLArkProps<'div'>, ItemGroupLabelProps> {
 }
-export declare const SelectItemGroupLabel: (props: SelectItemGroupLabelProps) => import("solid-js").JSX.Element;
+export declare const SelectItemGroupLabel: ArkComponent<'div', ItemGroupLabelProps>;
 export {};

package/types/select/select-item-group.d.ts

@@ -1,6 +1,6 @@
 import type { ItemGroupProps } from '@zag-js/select';
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 export interface SelectItemGroupProps extends Assign<HTMLArkProps<'div'>, ItemGroupProps> {
 }
-export declare const SelectItemGroup: (props: SelectItemGroupProps) => import("solid-js").JSX.Element;
+export declare const SelectItemGroup: ArkComponent<'div', ItemGroupProps>;

package/types/select/select-item-indicator.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectItemIndicatorProps extends HTMLArkProps<'div'> {
 }
-export declare const SelectItemIndicator: (props: SelectItemIndicatorProps) => import("solid-js").JSX.Element;
+export declare const SelectItemIndicator: ArkComponent<'div'>;

package/types/select/select-item-text.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLArkProps } from '../factory';
+import { type ArkComponent, type HTMLArkProps } from '../factory';
 export interface SelectItemTextProps extends HTMLArkProps<'span'> {
 }
-export declare const SelectItemText: (props: SelectItemTextProps) => import("solid-js").JSX.Element;
+export declare const SelectItemText: ArkComponent<'span'>;