@ark-ui/solid 0.9.0 → 0.10.0

package/radio-group/index.mjs

@@ -1,9 +1,18 @@
-export { Radio } from './radio.mjs';
+import { Radio } from './radio.mjs';
 export { useRadioContext } from './radio-context.mjs';
-export { RadioControl } from './radio-control.mjs';
-export { RadioGroup } from './radio-group.mjs';
+import { RadioControl } from './radio-control.mjs';
+import { RadioGroup as RadioGroup$1 } from './radio-group.mjs';
 export { useRadioGroupContext } from './radio-group-context.mjs';
-export { RadioGroupLabel } from './radio-group-label.mjs';
-export { RadioInput } from './radio-input.mjs';
-export { RadioLabel } from './radio-label.mjs';
+import { RadioGroupLabel } from './radio-group-label.mjs';
+import { RadioLabel } from './radio-label.mjs';
 export { anatomy as radioGroupAnatomy } from '@zag-js/radio-group';
+
+const RadioGroup = Object.assign(RadioGroup$1, {
+  Root: RadioGroup$1,
+  Label: RadioGroupLabel,
+  Radio,
+  RadioLabel,
+  RadioControl
+});
+
+export { Radio, RadioControl, RadioGroup, RadioGroupLabel, RadioLabel };

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

@@ -1,4 +1,4 @@
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type connect } from '@zag-js/radio-group';
 export type RadioContext = Parameters<ReturnType<typeof connect>['getRadioProps']>[0];
 export declare const RadioProvider: ContextProviderComponent<{

package/radio-group/radio-control.cjs

@@ -8,11 +8,16 @@ const factory = require('../factory.cjs');
 const radioContext = require('./radio-context.cjs');
 const radioGroupContext = require('./radio-group-context.cjs');
 
+const _tmpl$ = /*#__PURE__*/web.template(`<input>`);
 const RadioControl = props => {
   const api = radioGroupContext.useRadioGroupContext();
-  const radioParams = radioContext.useRadioContext();
-  const controlProps = solid.mergeProps(() => api().getRadioControlProps(radioParams), props);
-  return web.createComponent(factory.ark.div, controlProps);
+  const context = radioContext.useRadioContext();
+  const controlProps = solid.mergeProps(() => api().getRadioControlProps(context), props);
+  return [web.createComponent(factory.ark.div, controlProps), (() => {
+    const _el$ = _tmpl$();
+    web.spread(_el$, web.mergeProps(() => api().getRadioHiddenInputProps(context)), false, false);
+    return _el$;
+  })()];
 };
 
 exports.RadioControl = RadioControl;

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

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

package/radio-group/radio-control.mjs

@@ -1,14 +1,19 @@
-import { createComponent } from 'solid-js/web';
+import { createComponent, spread, mergeProps as mergeProps$1, template } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useRadioContext } from './radio-context.mjs';
 import { useRadioGroupContext } from './radio-group-context.mjs';
 
+const _tmpl$ = /*#__PURE__*/template(`<input>`);
 const RadioControl = props => {
   const api = useRadioGroupContext();
-  const radioParams = useRadioContext();
-  const controlProps = mergeProps(() => api().getRadioControlProps(radioParams), props);
-  return createComponent(ark.div, controlProps);
+  const context = useRadioContext();
+  const controlProps = mergeProps(() => api().getRadioControlProps(context), props);
+  return [createComponent(ark.div, controlProps), (() => {
+    const _el$ = _tmpl$();
+    spread(_el$, mergeProps$1(() => api().getRadioHiddenInputProps(context)), false, false);
+    return _el$;
+  })()];
 };
 
 export { RadioControl };

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

@@ -1,7 +1,4 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { PublicApi } from '@zag-js/radio-group';
-import type { Accessor } from 'solid-js';
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type UseRadioGroupReturn } from './use-radio-group';
 export type RadioGroupContext = UseRadioGroupReturn;
-export declare const RadioGroupProvider: ContextProviderComponent<Accessor<PublicApi<PropTypes>>>, useRadioGroupContext: () => Accessor<PublicApi<PropTypes>>;
+export declare const RadioGroupProvider: ContextProviderComponent<UseRadioGroupReturn>, useRadioGroupContext: () => UseRadioGroupReturn;

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

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

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type UseRadioGroupProps } from './use-radio-group';

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

@@ -0,0 +1,6 @@
+import { JSX } from 'solid-js';
+import type { Meta } from 'storybook-solidjs';
+declare const meta: Meta;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Disabled: () => JSX.Element;

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

@@ -0,0 +1 @@
+export {};

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

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

package/radio-group/radio.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type RadioContext } from './radio-context';

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

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const radio = require('@zag-js/radio-group');
 const solid = require('@zag-js/solid');
 const solidJs = require('solid-js');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

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

@@ -1,7 +1,7 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { Accessor } from 'solid-js';
 import * as radio from '@zag-js/radio-group';
+import { type PropTypes } from '@zag-js/solid';
+import { type Accessor } from 'solid-js';
 import { type Optional } from '../types';
 export type UseRadioGroupProps = Optional<radio.Context, 'id'>;
-export type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>;
-export declare const useRadioGroup: (props: UseRadioGroupProps) => Accessor<radio.PublicApi<PropTypes>>;
+export type UseRadioGroupReturn = Accessor<radio.Api<PropTypes>>;
+export declare const useRadioGroup: (props: UseRadioGroupProps) => UseRadioGroupReturn;

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

@@ -1,6 +1,7 @@
 import * as radio from '@zag-js/radio-group';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
 import { createUniqueId, createMemo } from 'solid-js';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useRadioGroup = props => {

package/range-slider/index.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const rangeSlider = require('./range-slider.cjs');
+const rangeSlider$1 = require('./range-slider.cjs');
 const rangeSliderContext = require('./range-slider-context.cjs');
 const rangeSliderControl = require('./range-slider-control.cjs');
 const rangeSliderLabel = require('./range-slider-label.cjs');
@@ -12,11 +12,20 @@ const rangeSliderOutput = require('./range-slider-output.cjs');
 const rangeSliderRange = require('./range-slider-range.cjs');
 const rangeSliderThumb = require('./range-slider-thumb.cjs');
 const rangeSliderTrack = require('./range-slider-track.cjs');
-const rangeSlider$1 = require('@zag-js/range-slider');
-
+const rangeSlider = require('@zag-js/range-slider');
 
+const RangeSlider = Object.assign(rangeSlider$1.RangeSlider, {
+  Root: rangeSlider$1.RangeSlider,
+  Control: rangeSliderControl.RangeSliderControl,
+  Label: rangeSliderLabel.RangeSliderLabel,
+  Marker: rangeSliderMarker.RangeSliderMarker,
+  MarkerGroup: rangeSliderMarkerGroup.RangeSliderMarkerGroup,
+  Output: rangeSliderOutput.RangeSliderOutput,
+  Range: rangeSliderRange.RangeSliderRange,
+  Thumb: rangeSliderThumb.RangeSliderThumb,
+  Track: rangeSliderTrack.RangeSliderTrack
+});
 
-exports.RangeSlider = rangeSlider.RangeSlider;
 exports.useRangeSliderContext = rangeSliderContext.useRangeSliderContext;
 exports.RangeSliderControl = rangeSliderControl.RangeSliderControl;
 exports.RangeSliderLabel = rangeSliderLabel.RangeSliderLabel;
@@ -28,5 +37,6 @@ exports.RangeSliderThumb = rangeSliderThumb.RangeSliderThumb;
 exports.RangeSliderTrack = rangeSliderTrack.RangeSliderTrack;
 Object.defineProperty(exports, 'rangeSliderAnatomy', {
   enumerable: true,
-  get: () => rangeSlider$1.anatomy
+  get: () => rangeSlider.anatomy
 });
+exports.RangeSlider = RangeSlider;

package/range-slider/index.d.ts

@@ -1,11 +1,25 @@
-export { RangeSlider, type RangeSliderProps } from './range-slider';
-export { useRangeSliderContext } from './range-slider-context';
-export { RangeSliderControl, type RangeSliderControlProps } from './range-slider-control';
-export { RangeSliderLabel, type RangeSliderLabelProps } from './range-slider-label';
-export { RangeSliderMarker, type RangeSliderMarkerProps } from './range-slider-marker';
-export { RangeSliderMarkerGroup, type RangeSliderMarkerGroupProps, } from './range-slider-marker-group';
-export { RangeSliderOutput, type RangeSliderOutputProps } from './range-slider-output';
-export { RangeSliderRange, type RangeSliderRangeProps } from './range-slider-range';
-export { RangeSliderThumb, type RangeSliderThumbProps } from './range-slider-thumb';
-export { RangeSliderTrack, type RangeSliderTrackProps } from './range-slider-track';
-export { rangeSliderAnatomy } from './range-slider.anatomy';
+import { JSX } from 'solid-js';
+import { type RangeSliderProps } from './range-slider';
+import { useRangeSliderContext } from './range-slider-context';
+import { RangeSliderControl, type RangeSliderControlProps } from './range-slider-control';
+import { RangeSliderLabel, type RangeSliderLabelProps } from './range-slider-label';
+import { RangeSliderMarker, type RangeSliderMarkerProps } from './range-slider-marker';
+import { RangeSliderMarkerGroup, type RangeSliderMarkerGroupProps } from './range-slider-marker-group';
+import { RangeSliderOutput, type RangeSliderOutputProps } from './range-slider-output';
+import { RangeSliderRange, type RangeSliderRangeProps } from './range-slider-range';
+import { RangeSliderThumb, type RangeSliderThumbProps } from './range-slider-thumb';
+import { RangeSliderTrack, type RangeSliderTrackProps } from './range-slider-track';
+import { rangeSliderAnatomy } from './range-slider.anatomy';
+declare const RangeSlider: ((props: RangeSliderProps) => JSX.Element) & {
+    Root: (props: RangeSliderProps) => JSX.Element;
+    Control: (props: RangeSliderControlProps) => JSX.Element;
+    Label: (props: RangeSliderLabelProps) => JSX.Element;
+    Marker: (props: RangeSliderMarkerProps) => JSX.Element;
+    MarkerGroup: (props: RangeSliderMarkerGroupProps) => JSX.Element;
+    Output: (props: RangeSliderOutputProps) => JSX.Element;
+    Range: (props: RangeSliderRangeProps) => JSX.Element;
+    Thumb: (props: RangeSliderThumbProps) => JSX.Element;
+    Track: (props: RangeSliderTrackProps) => JSX.Element;
+};
+export { RangeSlider, RangeSliderControl, RangeSliderLabel, RangeSliderMarker, RangeSliderMarkerGroup, RangeSliderOutput, RangeSliderRange, RangeSliderThumb, RangeSliderTrack, rangeSliderAnatomy, useRangeSliderContext, };
+export type { RangeSliderControlProps, RangeSliderLabelProps, RangeSliderMarkerGroupProps, RangeSliderMarkerProps, RangeSliderOutputProps, RangeSliderProps, RangeSliderRangeProps, RangeSliderThumbProps, RangeSliderTrackProps, };

package/range-slider/index.mjs

@@ -1,11 +1,25 @@
-export { RangeSlider } from './range-slider.mjs';
+import { RangeSlider as RangeSlider$1 } from './range-slider.mjs';
 export { useRangeSliderContext } from './range-slider-context.mjs';
-export { RangeSliderControl } from './range-slider-control.mjs';
-export { RangeSliderLabel } from './range-slider-label.mjs';
-export { RangeSliderMarker } from './range-slider-marker.mjs';
-export { RangeSliderMarkerGroup } from './range-slider-marker-group.mjs';
-export { RangeSliderOutput } from './range-slider-output.mjs';
-export { RangeSliderRange } from './range-slider-range.mjs';
-export { RangeSliderThumb } from './range-slider-thumb.mjs';
-export { RangeSliderTrack } from './range-slider-track.mjs';
+import { RangeSliderControl } from './range-slider-control.mjs';
+import { RangeSliderLabel } from './range-slider-label.mjs';
+import { RangeSliderMarker } from './range-slider-marker.mjs';
+import { RangeSliderMarkerGroup } from './range-slider-marker-group.mjs';
+import { RangeSliderOutput } from './range-slider-output.mjs';
+import { RangeSliderRange } from './range-slider-range.mjs';
+import { RangeSliderThumb } from './range-slider-thumb.mjs';
+import { RangeSliderTrack } from './range-slider-track.mjs';
 export { anatomy as rangeSliderAnatomy } from '@zag-js/range-slider';
+
+const RangeSlider = Object.assign(RangeSlider$1, {
+  Root: RangeSlider$1,
+  Control: RangeSliderControl,
+  Label: RangeSliderLabel,
+  Marker: RangeSliderMarker,
+  MarkerGroup: RangeSliderMarkerGroup,
+  Output: RangeSliderOutput,
+  Range: RangeSliderRange,
+  Thumb: RangeSliderThumb,
+  Track: RangeSliderTrack
+});
+
+export { RangeSlider, RangeSliderControl, RangeSliderLabel, RangeSliderMarker, RangeSliderMarkerGroup, RangeSliderOutput, RangeSliderRange, RangeSliderThumb, RangeSliderTrack };

package/range-slider/range-slider-context.d.ts

@@ -1,7 +1,4 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { PublicApi } from '@zag-js/range-slider';
-import type { Accessor } from 'solid-js';
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type UseRangeSliderReturn } from './use-range-slider';
 export type RangeSliderContext = UseRangeSliderReturn;
-export declare const RangeSliderProvider: ContextProviderComponent<Accessor<PublicApi<PropTypes>>>, useRangeSliderContext: () => Accessor<PublicApi<PropTypes>>;
+export declare const RangeSliderProvider: ContextProviderComponent<UseRangeSliderReturn>, useRangeSliderContext: () => UseRangeSliderReturn;

package/range-slider/range-slider-control.d.ts

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

package/range-slider/range-slider-label.d.ts

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

package/range-slider/range-slider-marker-group.d.ts

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

package/range-slider/range-slider-marker.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 type GetMarkerPropsArgs = {

package/range-slider/range-slider-range.d.ts

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

package/range-slider/range-slider-thumb.cjs

@@ -8,11 +8,16 @@ const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 const rangeSliderContext = require('./range-slider-context.cjs');
 
+const _tmpl$ = /*#__PURE__*/web.template(`<input>`);
 const RangeSliderThumb = props => {
   const [thumbParams, restProps] = createSplitProps.createSplitProps()(props, ['index']);
   const api = rangeSliderContext.useRangeSliderContext();
-  const thumbProps = solid.mergeProps(() => api().getThumbProps(thumbParams.index()), restProps);
-  return web.createComponent(factory.ark.div, thumbProps);
+  const thumbProps = solid.mergeProps(() => api().getThumbProps(thumbParams.index), restProps);
+  return [web.createComponent(factory.ark.div, thumbProps), (() => {
+    const _el$ = _tmpl$();
+    web.spread(_el$, web.mergeProps(() => api().getHiddenInputProps(thumbParams.index)), false, false);
+    return _el$;
+  })()];
 };
 
 exports.RangeSliderThumb = RangeSliderThumb;

package/range-slider/range-slider-thumb.d.ts

@@ -1,8 +1,8 @@
-import type { JSX, type Accessor } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 type RangeSliderThumbParams = {
-    index: Accessor<number>;
+    index: number;
 };
 export type RangeSliderThumbProps = Assign<HTMLArkProps<'div'>, RangeSliderThumbParams>;
 export declare const RangeSliderThumb: (props: RangeSliderThumbProps) => JSX.Element;

package/range-slider/range-slider-thumb.mjs

@@ -1,14 +1,19 @@
-import { createComponent } from 'solid-js/web';
+import { createComponent, spread, mergeProps as mergeProps$1, template } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { useRangeSliderContext } from './range-slider-context.mjs';
 
+const _tmpl$ = /*#__PURE__*/template(`<input>`);
 const RangeSliderThumb = props => {
   const [thumbParams, restProps] = createSplitProps()(props, ['index']);
   const api = useRangeSliderContext();
-  const thumbProps = mergeProps(() => api().getThumbProps(thumbParams.index()), restProps);
-  return createComponent(ark.div, thumbProps);
+  const thumbProps = mergeProps(() => api().getThumbProps(thumbParams.index), restProps);
+  return [createComponent(ark.div, thumbProps), (() => {
+    const _el$ = _tmpl$();
+    spread(_el$, mergeProps$1(() => api().getHiddenInputProps(thumbParams.index)), false, false);
+    return _el$;
+  })()];
 };
 
 export { RangeSliderThumb };

package/range-slider/range-slider-track.d.ts

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

package/range-slider/range-slider.cjs

@@ -10,7 +10,7 @@ const rangeSliderContext = require('./range-slider-context.cjs');
 const useRangeSlider = require('./use-range-slider.cjs');
 
 const RangeSlider = props => {
-  const [useRangeSliderProps, divProps] = createSplitProps.createSplitProps()(props, ['aria-label', 'aria-labelledby', 'dir', 'disabled', 'form', 'getAriaValueText', 'getRootNode', 'id', 'ids', 'invalid', 'max', 'min', 'minStepsBetweenThumbs', 'name', 'onChange', 'onChangeEnd', 'onChangeStart', 'orientation', 'readOnly', 'step', 'thumbAlignment', 'value']);
+  const [useRangeSliderProps, divProps] = createSplitProps.createSplitProps()(props, ['aria-label', 'aria-labelledby', 'dir', 'disabled', 'form', 'getAriaValueText', 'getRootNode', 'id', 'ids', 'invalid', 'max', 'min', 'minStepsBetweenThumbs', 'name', 'onChange', 'onChangeEnd', 'onChangeStart', 'onFocusChange', 'orientation', 'readOnly', 'step', 'thumbAlignment', 'thumbSize', 'value']);
   const api = useRangeSlider.useRangeSlider(useRangeSliderProps);
   const getChildren = () => runIfFn.runIfFn(props.children, api);
   return web.createComponent(rangeSliderContext.RangeSliderProvider, {

package/range-slider/range-slider.mjs

@@ -6,7 +6,7 @@ import { RangeSliderProvider } from './range-slider-context.mjs';
 import { useRangeSlider } from './use-range-slider.mjs';
 
 const RangeSlider = props => {
-  const [useRangeSliderProps, divProps] = createSplitProps()(props, ['aria-label', 'aria-labelledby', 'dir', 'disabled', 'form', 'getAriaValueText', 'getRootNode', 'id', 'ids', 'invalid', 'max', 'min', 'minStepsBetweenThumbs', 'name', 'onChange', 'onChangeEnd', 'onChangeStart', 'orientation', 'readOnly', 'step', 'thumbAlignment', 'value']);
+  const [useRangeSliderProps, divProps] = createSplitProps()(props, ['aria-label', 'aria-labelledby', 'dir', 'disabled', 'form', 'getAriaValueText', 'getRootNode', 'id', 'ids', 'invalid', 'max', 'min', 'minStepsBetweenThumbs', 'name', 'onChange', 'onChangeEnd', 'onChangeStart', 'onFocusChange', 'orientation', 'readOnly', 'step', 'thumbAlignment', 'thumbSize', 'value']);
   const api = useRangeSlider(useRangeSliderProps);
   const getChildren = () => runIfFn(props.children, api);
   return createComponent(RangeSliderProvider, {

package/range-slider/range-slider.stories.d.ts

@@ -0,0 +1,5 @@
+import { JSX } from 'solid-js';
+import type { Meta } from 'storybook-solidjs';
+declare const meta: Meta;
+export default meta;
+export declare const Basic: () => JSX.Element;

package/range-slider/range-slider.test.d.ts

@@ -0,0 +1 @@
+export {};

package/range-slider/use-range-slider.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const rangeSlider = require('@zag-js/range-slider');
 const solid = require('@zag-js/solid');
 const solidJs = require('solid-js');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

package/range-slider/use-range-slider.d.ts

@@ -1,7 +1,7 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { Accessor } from 'solid-js';
 import * as rangeSlider from '@zag-js/range-slider';
+import { type PropTypes } from '@zag-js/solid';
+import { type Accessor } from 'solid-js';
 import { type Optional } from '../types';
 export type UseRangeSliderProps = Optional<rangeSlider.Context, 'id'>;
-export type UseRangeSliderReturn = ReturnType<typeof useRangeSlider>;
-export declare const useRangeSlider: (props: UseRangeSliderProps) => Accessor<rangeSlider.PublicApi<PropTypes>>;
+export type UseRangeSliderReturn = Accessor<rangeSlider.Api<PropTypes>>;
+export declare const useRangeSlider: (props: UseRangeSliderProps) => UseRangeSliderReturn;

package/range-slider/use-range-slider.mjs

@@ -1,6 +1,7 @@
 import * as rangeSlider from '@zag-js/range-slider';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
 import { createUniqueId, createMemo } from 'solid-js';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useRangeSlider = (props) => {

package/rating-group/index.cjs

@@ -10,15 +10,20 @@ const ratingGroupControl = require('./rating-group-control.cjs');
 const ratingGroupLabel = require('./rating-group-label.cjs');
 const rating$1 = require('@zag-js/rating-group');
 
-
+const RatingGroup = Object.assign(ratingGroup.RatingGroup, {
+  Root: ratingGroup.RatingGroup,
+  Control: ratingGroupControl.RatingGroupControl,
+  Label: ratingGroupLabel.RatingGroupLabel,
+  Rating: rating.Rating
+});
 
 exports.Rating = rating.Rating;
 exports.useRatingContext = ratingContext.useRatingContext;
-exports.RatingGroup = ratingGroup.RatingGroup;
 exports.useRatingGroupContext = ratingGroupContext.useRatingGroupContext;
 exports.RatingGroupControl = ratingGroupControl.RatingGroupControl;
 exports.RatingGroupLabel = ratingGroupLabel.RatingGroupLabel;
 Object.defineProperty(exports, 'ratingGroupAnatomy', {
-	enumerable: true,
-	get: () => rating$1.anatomy
+  enumerable: true,
+  get: () => rating$1.anatomy
 });
+exports.RatingGroup = RatingGroup;

package/rating-group/index.d.ts

@@ -1,7 +1,16 @@
-export { Rating, type RatingProps } from './rating';
-export { useRatingContext } from './rating-context';
-export { RatingGroup, type RatingGroupProps } from './rating-group';
-export { useRatingGroupContext } from './rating-group-context';
-export { RatingGroupControl, type RatingGroupControlProps } from './rating-group-control';
-export { RatingGroupLabel, type RatingGroupLabelProps } from './rating-group-label';
-export { ratingGroupAnatomy } from './rating-group.anatomy';
+import { JSX } from 'solid-js';
+import { Rating, type RatingProps } from './rating';
+import { useRatingContext } from './rating-context';
+import { type RatingGroupProps } from './rating-group';
+import { useRatingGroupContext } from './rating-group-context';
+import { RatingGroupControl, type RatingGroupControlProps } from './rating-group-control';
+import { RatingGroupLabel, type RatingGroupLabelProps } from './rating-group-label';
+import { ratingGroupAnatomy } from './rating-group.anatomy';
+declare const RatingGroup: ((props: RatingGroupProps) => JSX.Element) & {
+    Root: (props: RatingGroupProps) => JSX.Element;
+    Control: (props: RatingGroupControlProps) => JSX.Element;
+    Label: (props: RatingGroupLabelProps) => JSX.Element;
+    Rating: (props: RatingProps) => JSX.Element;
+};
+export { Rating, RatingGroup, RatingGroupControl, RatingGroupLabel, ratingGroupAnatomy, useRatingContext, useRatingGroupContext, };
+export type { RatingGroupControlProps, RatingGroupLabelProps, RatingGroupProps, RatingProps };

package/rating-group/index.mjs

@@ -1,7 +1,16 @@
-export { Rating } from './rating.mjs';
+import { Rating } from './rating.mjs';
 export { useRatingContext } from './rating-context.mjs';
-export { RatingGroup } from './rating-group.mjs';
+import { RatingGroup as RatingGroup$1 } from './rating-group.mjs';
 export { useRatingGroupContext } from './rating-group-context.mjs';
-export { RatingGroupControl } from './rating-group-control.mjs';
-export { RatingGroupLabel } from './rating-group-label.mjs';
+import { RatingGroupControl } from './rating-group-control.mjs';
+import { RatingGroupLabel } from './rating-group-label.mjs';
 export { anatomy as ratingGroupAnatomy } from '@zag-js/rating-group';
+
+const RatingGroup = Object.assign(RatingGroup$1, {
+  Root: RatingGroup$1,
+  Control: RatingGroupControl,
+  Label: RatingGroupLabel,
+  Rating
+});
+
+export { Rating, RatingGroup, RatingGroupControl, RatingGroupLabel };

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

@@ -1,5 +1,4 @@
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
-import type { ItemState, type connect } from '@zag-js/rating-group';
-import type { Accessor } from 'solid-js';
+import { ItemState, type connect } from '@zag-js/rating-group';
+import { ContextProviderComponent, Accessor } from 'solid-js';
 export type RatingContext = ReturnType<ReturnType<typeof connect>['getRatingState']>;
 export declare const RatingProvider: ContextProviderComponent<Accessor<ItemState>>, useRatingContext: () => Accessor<ItemState>;

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

@@ -1,7 +1,4 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { PublicApi } from '@zag-js/rating-group';
-import type { Accessor } from 'solid-js';
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type UseRatingGroupReturn } from './use-rating-group';
 export type RatingGroupContext = UseRatingGroupReturn;
-export declare const RatingGroupProvider: ContextProviderComponent<Accessor<PublicApi<PropTypes>>>, useRatingGroupContext: () => Accessor<PublicApi<PropTypes>>;
+export declare const RatingGroupProvider: ContextProviderComponent<UseRatingGroupReturn>, useRatingGroupContext: () => UseRatingGroupReturn;

package/rating-group/rating-group-control.cjs

@@ -8,15 +8,20 @@ const factory = require('../factory.cjs');
 const runIfFn = require('../run-if-fn.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 
+const _tmpl$ = /*#__PURE__*/web.template(`<input>`);
 const RatingGroupControl = props => {
   const api = ratingGroupContext.useRatingGroupContext();
   const getChildren = () => runIfFn.runIfFn(props.children, api);
   const controlProps = solid.mergeProps(() => api().controlProps, props);
-  return web.createComponent(factory.ark.div, web.mergeProps(controlProps, {
+  return [web.createComponent(factory.ark.div, web.mergeProps(controlProps, {
     get children() {
       return getChildren();
     }
-  }));
+  })), (() => {
+    const _el$ = _tmpl$();
+    web.spread(_el$, web.mergeProps(() => api().hiddenInputProps), false, false);
+    return _el$;
+  })()];
 };
 
 exports.RatingGroupControl = RatingGroupControl;

package/rating-group/rating-group-control.mjs

@@ -1,18 +1,23 @@
-import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { createComponent, mergeProps as mergeProps$1, spread, template } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { runIfFn } from '../run-if-fn.mjs';
 import { useRatingGroupContext } from './rating-group-context.mjs';
 
+const _tmpl$ = /*#__PURE__*/template(`<input>`);
 const RatingGroupControl = props => {
   const api = useRatingGroupContext();
   const getChildren = () => runIfFn(props.children, api);
   const controlProps = mergeProps(() => api().controlProps, props);
-  return createComponent(ark.div, mergeProps$1(controlProps, {
+  return [createComponent(ark.div, mergeProps$1(controlProps, {
     get children() {
       return getChildren();
     }
-  }));
+  })), (() => {
+    const _el$ = _tmpl$();
+    spread(_el$, mergeProps$1(() => api().hiddenInputProps), false, false);
+    return _el$;
+  })()];
 };
 
 export { RatingGroupControl };

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

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