@ark-ui/solid 3.2.2 → 3.4.0

package/dist/source/components/file-upload/use-file-upload.js

@@ -2,13 +2,21 @@ import * as fileUpload from '@zag-js/file-upload';
 import { normalizeProps, useMachine } from '@zag-js/solid';
 import { createMemo, createUniqueId } from 'solid-js';
 import { useEnvironmentContext, useLocaleContext } from '../../providers';
+import { useFieldContext } from '../field';
 export const useFileUpload = (props) => {
     const locale = useLocaleContext();
     const environment = useEnvironmentContext();
     const id = createUniqueId();
+    const field = useFieldContext();
     const context = createMemo(() => ({
         id,
+        ids: {
+            label: field?.().ids.label,
+            hiddenInput: field?.().ids.control,
+        },
         dir: locale().dir,
+        disabled: field?.().disabled,
+        required: field?.().required,
         getRootNode: environment().getRootNode,
         ...props,
     }));

package/dist/source/components/format/format.js

@@ -1,2 +1,2 @@
-export { FormatByte as Byte } from './format-byte';
-export { FormatNumber as Number } from './format-number';
+export { FormatByte as Byte, } from './format-byte';
+export { FormatNumber as Number, } from './format-number';

package/dist/source/components/format/index.js

@@ -1,3 +1,3 @@
-export { FormatByte } from './format-byte';
-export { FormatNumber } from './format-number';
+export { FormatByte, } from './format-byte';
+export { FormatNumber, } from './format-number';
 export * as Format from './format';

package/dist/source/components/hover-card/hover-card.js

@@ -1,8 +1,8 @@
-export { HoverCardArrow as Arrow } from './hover-card-arrow';
+export { HoverCardArrow as Arrow, } from './hover-card-arrow';
 export { HoverCardArrowTip as ArrowTip, } from './hover-card-arrow-tip';
 export { HoverCardContent as Content, } from './hover-card-content';
 export { HoverCardContext as Context, } from './hover-card-context';
 export { HoverCardPositioner as Positioner, } from './hover-card-positioner';
-export { HoverCardRoot as Root } from './hover-card-root';
+export { HoverCardRoot as Root, } from './hover-card-root';
 export { HoverCardRootProvider as RootProvider, } from './hover-card-root-provider';
 export { HoverCardTrigger as Trigger, } from './hover-card-trigger';

package/dist/source/components/hover-card/index.js

@@ -1,11 +1,11 @@
-export { HoverCardArrow } from './hover-card-arrow';
-export { HoverCardArrowTip } from './hover-card-arrow-tip';
-export { HoverCardContent } from './hover-card-content';
-export { HoverCardContext } from './hover-card-context';
-export { HoverCardPositioner } from './hover-card-positioner';
-export { HoverCardRoot } from './hover-card-root';
-export { HoverCardRootProvider } from './hover-card-root-provider';
-export { HoverCardTrigger } from './hover-card-trigger';
+export { HoverCardArrow, } from './hover-card-arrow';
+export { HoverCardArrowTip, } from './hover-card-arrow-tip';
+export { HoverCardContent, } from './hover-card-content';
+export { HoverCardContext, } from './hover-card-context';
+export { HoverCardPositioner, } from './hover-card-positioner';
+export { HoverCardRoot, } from './hover-card-root';
+export { HoverCardRootProvider, } from './hover-card-root-provider';
+export { HoverCardTrigger, } from './hover-card-trigger';
 export { useHoverCard } from './use-hover-card';
 export { useHoverCardContext } from './use-hover-card-context';
 export * as HoverCard from './hover-card';

package/dist/source/components/index.js

@@ -10,6 +10,7 @@ export * from './date-picker';
 export * from './dialog';
 export * from './editable';
 export * from './factory';
+export * from './field';
 export * from './file-upload';
 export * from './format';
 export * from './hover-card';
@@ -20,10 +21,12 @@ export * from './pin-input';
 export * from './popover';
 export * from './presence';
 export * from './progress';
+export * from './qr-code';
 export * from './radio-group';
 export * from './rating-group';
 export * from './segment-group';
 export * from './select';
+export * from './signature-pad';
 export * from './slider';
 export * from './splitter';
 export * from './switch';

package/dist/source/components/menu/index.js

@@ -1,24 +1,24 @@
-export { MenuArrow } from './menu-arrow';
-export { MenuArrowTip } from './menu-arrow-tip';
-export { MenuCheckboxItem } from './menu-checkbox-item';
-export { MenuContent } from './menu-content';
-export { MenuContext } from './menu-context';
-export { MenuContextTrigger } from './menu-context-trigger';
-export { MenuIndicator } from './menu-indicator';
-export { MenuItem } from './menu-item';
-export { MenuItemContext } from './menu-item-context';
-export { MenuItemGroup } from './menu-item-group';
-export { MenuItemGroupLabel } from './menu-item-group-label';
-export { MenuItemIndicator } from './menu-item-indicator';
-export { MenuItemText } from './menu-item-text';
-export { MenuPositioner } from './menu-positioner';
-export { MenuRadioItem } from './menu-radio-item';
-export { MenuRadioItemGroup } from './menu-radio-item-group';
-export { MenuRoot } from './menu-root';
-export { MenuRootProvider } from './menu-root-provider';
-export { MenuSeparator } from './menu-separator';
-export { MenuTrigger } from './menu-trigger';
-export { MenuTriggerItem } from './menu-trigger-item';
+export { MenuArrow, } from './menu-arrow';
+export { MenuArrowTip, } from './menu-arrow-tip';
+export { MenuCheckboxItem, } from './menu-checkbox-item';
+export { MenuContent, } from './menu-content';
+export { MenuContext, } from './menu-context';
+export { MenuContextTrigger, } from './menu-context-trigger';
+export { MenuIndicator, } from './menu-indicator';
+export { MenuItem, } from './menu-item';
+export { MenuItemContext, } from './menu-item-context';
+export { MenuItemGroup, } from './menu-item-group';
+export { MenuItemGroupLabel, } from './menu-item-group-label';
+export { MenuItemIndicator, } from './menu-item-indicator';
+export { MenuItemText, } from './menu-item-text';
+export { MenuPositioner, } from './menu-positioner';
+export { MenuRadioItem, } from './menu-radio-item';
+export { MenuRadioItemGroup, } from './menu-radio-item-group';
+export { MenuRoot, } from './menu-root';
+export { MenuRootProvider, } from './menu-root-provider';
+export { MenuSeparator, } from './menu-separator';
+export { MenuTrigger, } from './menu-trigger';
+export { MenuTriggerItem, } from './menu-trigger-item';
 export { useMenu } from './use-menu';
 export { useMenuContext } from './use-menu-context';
 export { useMenuItemContext } from './use-menu-item-context';

package/dist/source/components/menu/menu-checkbox-item.jsx

@@ -19,9 +19,9 @@ export const MenuCheckboxItem = (props) => {
     });
     const context = useMenuContext();
     const mergedProps = mergeProps(() => context().getOptionItemProps(optionItemProps), localProps);
-    const itemState = createMemo(() => context().getItemState(optionItemProps));
+    const optionItemState = createMemo(() => context().getItemState(optionItemProps));
     return (<MenuOptionItemPropsProvider value={optionItemProps}>
-      <MenuItemProvider value={itemState}>
+      <MenuItemProvider value={optionItemState}>
         <ark.div {...mergedProps}/>
       </MenuItemProvider>
     </MenuOptionItemPropsProvider>);

package/dist/source/components/menu/menu-radio-item.jsx

@@ -21,9 +21,9 @@ export const MenuRadioItem = (props) => {
         onCheckedChange: () => itemGroup.onValueChange?.({ value: partialItemProps.value }),
     }));
     const mergedProps = mergeProps(() => context().getOptionItemProps(optionItemProps), localProps);
-    const itemState = createMemo(() => context().getItemState(optionItemProps));
+    const optionItemState = createMemo(() => context().getOptionItemState(optionItemProps));
     return (<MenuOptionItemPropsProvider value={optionItemProps}>
-      <MenuItemProvider value={itemState}>
+      <MenuItemProvider value={optionItemState}>
         <ark.div {...mergedProps}/>
       </MenuItemProvider>
     </MenuOptionItemPropsProvider>);

package/dist/source/components/menu/menu.js

@@ -1,21 +1,21 @@
-export { MenuArrow as Arrow } from './menu-arrow';
-export { MenuArrowTip as ArrowTip } from './menu-arrow-tip';
+export { MenuArrow as Arrow, } from './menu-arrow';
+export { MenuArrowTip as ArrowTip, } from './menu-arrow-tip';
 export { MenuCheckboxItem as CheckboxItem, } from './menu-checkbox-item';
-export { MenuContent as Content } from './menu-content';
+export { MenuContent as Content, } from './menu-content';
 export { MenuContext as Context } from './menu-context';
 export { MenuContextTrigger as ContextTrigger, } from './menu-context-trigger';
 export { MenuIndicator as Indicator, } from './menu-indicator';
-export { MenuItem as Item } from './menu-item';
+export { MenuItem as Item, } from './menu-item';
 export { MenuItemContext as ItemContext, } from './menu-item-context';
 export { MenuItemGroup as ItemGroup, } from './menu-item-group';
 export { MenuItemGroupLabel as ItemGroupLabel, } from './menu-item-group-label';
 export { MenuItemIndicator as ItemIndicator, } from './menu-item-indicator';
-export { MenuItemText as ItemText } from './menu-item-text';
+export { MenuItemText as ItemText, } from './menu-item-text';
 export { MenuPositioner as Positioner, } from './menu-positioner';
 export { MenuRadioItem as RadioItem, } from './menu-radio-item';
 export { MenuRadioItemGroup as RadioItemGroup, } from './menu-radio-item-group';
-export { MenuRoot as Root } from './menu-root';
+export { MenuRoot as Root, } from './menu-root';
 export { MenuRootProvider as RootProvider, } from './menu-root-provider';
 export { MenuSeparator as Separator, } from './menu-separator';
-export { MenuTrigger as Trigger } from './menu-trigger';
+export { MenuTrigger as Trigger, } from './menu-trigger';
 export { MenuTriggerItem as TriggerItem, } from './menu-trigger-item';

package/dist/source/components/number-input/index.js

@@ -1,12 +1,12 @@
-export { NumberInputContext } from './number-input-context';
-export { NumberInputControl } from './number-input-control';
+export { NumberInputContext, } from './number-input-context';
+export { NumberInputControl, } from './number-input-control';
 export { NumberInputDecrementTrigger, } from './number-input-decrement-trigger';
 export { NumberInputIncrementTrigger, } from './number-input-increment-trigger';
-export { NumberInputInput } from './number-input-input';
-export { NumberInputLabel } from './number-input-label';
-export { NumberInputRoot } from './number-input-root';
+export { NumberInputInput, } from './number-input-input';
+export { NumberInputLabel, } from './number-input-label';
+export { NumberInputRoot, } from './number-input-root';
 export { NumberInputRootProvider, } from './number-input-root-provider';
-export { NumberInputScrubber } from './number-input-scrubber';
+export { NumberInputScrubber, } from './number-input-scrubber';
 export { useNumberInput, } from './use-number-input';
 export { useNumberInputContext } from './use-number-input-context';
 export * as NumberInput from './number-input';

package/dist/source/components/number-input/number-input-input.jsx

@@ -1,8 +1,10 @@
 import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory';
+import { useFieldContext } from '../field';
 import { useNumberInputContext } from './use-number-input-context';
 export const NumberInputInput = (props) => {
     const api = useNumberInputContext();
     const mergedProps = mergeProps(() => api().getInputProps(), props);
-    return <ark.input {...mergedProps}/>;
+    const field = useFieldContext();
+    return <ark.input aria-describedby={field?.().ariaDescribedby} {...mergedProps}/>;
 };

package/dist/source/components/number-input/number-input-root.jsx

@@ -26,6 +26,7 @@ export const NumberInputRoot = (props) => {
         'onValueInvalid',
         'pattern',
         'readOnly',
+        'required',
         'spinOnPress',
         'step',
         'translations',

package/dist/source/components/number-input/number-input.js

@@ -5,4 +5,5 @@ export { NumberInputIncrementTrigger as IncrementTrigger, } from './number-input
 export { NumberInputInput as Input, } from './number-input-input';
 export { NumberInputLabel as Label, } from './number-input-label';
 export { NumberInputRoot as Root, } from './number-input-root';
+export { NumberInputRootProvider as RootProvider, } from './number-input-root-provider';
 export { NumberInputScrubber as Scrubber, } from './number-input-scrubber';

package/dist/source/components/number-input/use-number-input.js

@@ -2,12 +2,22 @@ import * as numberInput from '@zag-js/number-input';
 import { normalizeProps, useMachine } from '@zag-js/solid';
 import { createMemo, createUniqueId } from 'solid-js';
 import { useEnvironmentContext, useLocaleContext } from '../../providers';
+import { useFieldContext } from '../field';
 export const useNumberInput = (props) => {
     const locale = useLocaleContext();
     const environment = useEnvironmentContext();
     const id = createUniqueId();
+    const field = useFieldContext();
     const context = createMemo(() => ({
         id,
+        ids: {
+            label: field?.().ids.label,
+            input: field?.().ids.control,
+        },
+        disabled: field?.().disabled,
+        readOnly: field?.().readOnly,
+        required: field?.().required,
+        invalid: field?.().invalid,
         dir: locale().dir,
         getRootNode: environment().getRootNode,
         value: props.defaultValue,

package/dist/source/components/pagination/index.js

@@ -1,9 +1,9 @@
-export { PaginationContext } from './pagination-context';
-export { PaginationEllipsis } from './pagination-ellipsis';
-export { PaginationItem } from './pagination-item';
-export { PaginationNextTrigger } from './pagination-next-trigger';
-export { PaginationPrevTrigger } from './pagination-prev-trigger';
-export { PaginationRoot } from './pagination-root';
+export { PaginationContext, } from './pagination-context';
+export { PaginationEllipsis, } from './pagination-ellipsis';
+export { PaginationItem, } from './pagination-item';
+export { PaginationNextTrigger, } from './pagination-next-trigger';
+export { PaginationPrevTrigger, } from './pagination-prev-trigger';
+export { PaginationRoot, } from './pagination-root';
 export { PaginationRootProvider, } from './pagination-root-provider';
 export { usePagination } from './use-pagination';
 export { usePaginationContext } from './use-pagination-context';

package/dist/source/components/pagination/pagination.js

@@ -1,7 +1,7 @@
 export { PaginationContext as Context, } from './pagination-context';
 export { PaginationEllipsis as Ellipsis, } from './pagination-ellipsis';
-export { PaginationItem as Item } from './pagination-item';
+export { PaginationItem as Item, } from './pagination-item';
 export { PaginationNextTrigger as NextTrigger, } from './pagination-next-trigger';
 export { PaginationPrevTrigger as PrevTrigger, } from './pagination-prev-trigger';
-export { PaginationRoot as Root } from './pagination-root';
+export { PaginationRoot as Root, } from './pagination-root';
 export { PaginationRootProvider as RootProvider, } from './pagination-root-provider';

package/dist/source/components/pin-input/index.js

@@ -1,10 +1,10 @@
-export { PinInputContext } from './pin-input-context';
-export { PinInputControl } from './pin-input-control';
-export { PinInputHiddenInput } from './pin-input-hidden-input';
-export { PinInputInput } from './pin-input-input';
-export { PinInputLabel } from './pin-input-label';
-export { PinInputRoot } from './pin-input-root';
-export { PinInputRootProvider } from './pin-input-root-provider';
+export { PinInputContext, } from './pin-input-context';
+export { PinInputControl, } from './pin-input-control';
+export { PinInputHiddenInput, } from './pin-input-hidden-input';
+export { PinInputInput, } from './pin-input-input';
+export { PinInputLabel, } from './pin-input-label';
+export { PinInputRoot, } from './pin-input-root';
+export { PinInputRootProvider, } from './pin-input-root-provider';
 export { usePinInput } from './use-pin-input';
 export { usePinInputContext } from './use-pin-input-context';
 export * as PinInput from './pin-input';

package/dist/source/components/pin-input/pin-input-hidden-input.jsx

@@ -1,8 +1,10 @@
 import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory';
+import { useFieldContext } from '../field';
 import { usePinInputContext } from './use-pin-input-context';
 export const PinInputHiddenInput = (props) => {
     const pinInput = usePinInputContext();
     const mergedProps = mergeProps(() => pinInput().getHiddenInputProps(), props);
-    return <ark.input {...mergedProps}/>;
+    const field = useFieldContext();
+    return <ark.input aria-describedby={field?.().ariaDescribedby} {...mergedProps}/>;
 };

package/dist/source/components/pin-input/pin-input-root.jsx

@@ -21,6 +21,8 @@ export const PinInputRoot = (props) => {
         'otp',
         'pattern',
         'placeholder',
+        'readOnly',
+        'required',
         'selectOnFocus',
         'translations',
         'type',

package/dist/source/components/pin-input/pin-input.js

@@ -1,7 +1,7 @@
 export { PinInputContext as Context, } from './pin-input-context';
 export { PinInputControl as Control, } from './pin-input-control';
 export { PinInputHiddenInput as HiddenInput, } from './pin-input-hidden-input';
-export { PinInputInput as Input } from './pin-input-input';
-export { PinInputLabel as Label } from './pin-input-label';
-export { PinInputRoot as Root } from './pin-input-root';
+export { PinInputInput as Input, } from './pin-input-input';
+export { PinInputLabel as Label, } from './pin-input-label';
+export { PinInputRoot as Root, } from './pin-input-root';
 export { PinInputRootProvider as RootProvider, } from './pin-input-root-provider';

package/dist/source/components/pin-input/use-pin-input.js

@@ -2,12 +2,22 @@ import * as pinInput from '@zag-js/pin-input';
 import { normalizeProps, useMachine } from '@zag-js/solid';
 import { createMemo, createUniqueId } from 'solid-js';
 import { useEnvironmentContext, useLocaleContext } from '../../providers';
+import { useFieldContext } from '../field';
 export const usePinInput = (props) => {
     const locale = useLocaleContext();
     const environment = useEnvironmentContext();
     const id = createUniqueId();
+    const field = useFieldContext();
     const context = createMemo(() => ({
         id,
+        ids: {
+            label: field?.().ids.label,
+            hiddenInput: field?.().ids.control,
+        },
+        disabled: field?.().disabled,
+        readOnly: field?.().readOnly,
+        required: field?.().required,
+        invalid: field?.().invalid,
         dir: locale().dir,
         getRootNode: environment().getRootNode,
         value: props.defaultValue,

package/dist/source/components/popover/index.js

@@ -1,16 +1,16 @@
-export { PopoverAnchor } from './popover-anchor';
-export { PopoverArrow } from './popover-arrow';
-export { PopoverArrowTip } from './popover-arrow-tip';
-export { PopoverCloseTrigger } from './popover-close-trigger';
-export { PopoverContent } from './popover-content';
-export { PopoverContext } from './popover-context';
-export { PopoverDescription } from './popover-description';
-export { PopoverIndicator } from './popover-indicator';
-export { PopoverPositioner } from './popover-positioner';
-export { PopoverRoot } from './popover-root';
-export { PopoverRootProvider } from './popover-root-provider';
-export { PopoverTitle } from './popover-title';
-export { PopoverTrigger } from './popover-trigger';
+export { PopoverAnchor, } from './popover-anchor';
+export { PopoverArrow, } from './popover-arrow';
+export { PopoverArrowTip, } from './popover-arrow-tip';
+export { PopoverCloseTrigger, } from './popover-close-trigger';
+export { PopoverContent, } from './popover-content';
+export { PopoverContext, } from './popover-context';
+export { PopoverDescription, } from './popover-description';
+export { PopoverIndicator, } from './popover-indicator';
+export { PopoverPositioner, } from './popover-positioner';
+export { PopoverRoot, } from './popover-root';
+export { PopoverRootProvider, } from './popover-root-provider';
+export { PopoverTitle, } from './popover-title';
+export { PopoverTrigger, } from './popover-trigger';
 export { usePopover } from './use-popover';
 export { usePopoverContext } from './use-popover-context';
 export * as Popover from './popover';

package/dist/source/components/popover/popover.js

@@ -1,5 +1,5 @@
-export { PopoverAnchor as Anchor } from './popover-anchor';
-export { PopoverArrow as Arrow } from './popover-arrow';
+export { PopoverAnchor as Anchor, } from './popover-anchor';
+export { PopoverArrow as Arrow, } from './popover-arrow';
 export { PopoverArrowTip as ArrowTip, } from './popover-arrow-tip';
 export { PopoverCloseTrigger as CloseTrigger, } from './popover-close-trigger';
 export { PopoverContent as Content, } from './popover-content';
@@ -7,7 +7,7 @@ export { PopoverContext as Context, } from './popover-context';
 export { PopoverDescription as Description, } from './popover-description';
 export { PopoverIndicator as Indicator, } from './popover-indicator';
 export { PopoverPositioner as Positioner, } from './popover-positioner';
-export { PopoverRoot as Root } from './popover-root';
+export { PopoverRoot as Root, } from './popover-root';
 export { PopoverRootProvider as RootProvider, } from './popover-root-provider';
-export { PopoverTitle as Title } from './popover-title';
+export { PopoverTitle as Title, } from './popover-title';
 export { PopoverTrigger as Trigger, } from './popover-trigger';

package/dist/source/components/presence/split-presence-props.js

@@ -1,5 +1,6 @@
 import { createSplitProps } from '../../utils/create-split-props';
 export const splitPresenceProps = (props) => createSplitProps()(props, [
+    'immediate',
     'lazyMount',
     'onExitComplete',
     'present',

package/dist/source/components/progress/index.js

@@ -1,14 +1,14 @@
-export { ProgressCircle } from './progress-circle';
-export { ProgressCircleRange } from './progress-circle-range';
-export { ProgressCircleTrack } from './progress-circle-track';
-export { ProgressContext } from './progress-context';
-export { ProgressLabel } from './progress-label';
-export { ProgressRange } from './progress-range';
-export { ProgressRoot } from './progress-root';
-export { ProgressRootProvider } from './progress-root-provider';
-export { ProgressTrack } from './progress-track';
-export { ProgressValueText } from './progress-value-text';
-export { ProgressView } from './progress-view';
+export { ProgressCircle, } from './progress-circle';
+export { ProgressCircleRange, } from './progress-circle-range';
+export { ProgressCircleTrack, } from './progress-circle-track';
+export { ProgressContext, } from './progress-context';
+export { ProgressLabel, } from './progress-label';
+export { ProgressRange, } from './progress-range';
+export { ProgressRoot, } from './progress-root';
+export { ProgressRootProvider, } from './progress-root-provider';
+export { ProgressTrack, } from './progress-track';
+export { ProgressValueText, } from './progress-value-text';
+export { ProgressView, } from './progress-view';
 export { useProgress } from './use-progress';
 export { useProgressContext } from './use-progress-context';
 export * as Progress from './progress';

package/dist/source/components/progress/progress.js

@@ -2,10 +2,10 @@ export { ProgressCircle as Circle, } from './progress-circle';
 export { ProgressCircleRange as CircleRange, } from './progress-circle-range';
 export { ProgressCircleTrack as CircleTrack, } from './progress-circle-track';
 export { ProgressContext as Context, } from './progress-context';
-export { ProgressLabel as Label } from './progress-label';
-export { ProgressRange as Range } from './progress-range';
-export { ProgressRoot as Root } from './progress-root';
+export { ProgressLabel as Label, } from './progress-label';
+export { ProgressRange as Range, } from './progress-range';
+export { ProgressRoot as Root, } from './progress-root';
 export { ProgressRootProvider as RootProvider, } from './progress-root-provider';
-export { ProgressTrack as Track } from './progress-track';
+export { ProgressTrack as Track, } from './progress-track';
 export { ProgressValueText as ValueText, } from './progress-value-text';
-export { ProgressView as View } from './progress-view';
+export { ProgressView as View, } from './progress-view';

package/dist/source/components/qr-code/index.js

@@ -0,0 +1,9 @@
+export { QrCodeContext, } from './qr-code-context';
+export { QrCodeFrame, } from './qr-code-frame';
+export { QrCodeOverlay, } from './qr-code-overlay';
+export { QrCodePattern, } from './qr-code-pattern';
+export { QrCodeRoot, } from './qr-code-root';
+export { QrCodeRootProvider, } from './qr-code-root-provider';
+export { useQrCode } from './use-qr-code';
+export { useQrCodeContext } from './use-qr-code-context';
+export * as QrCode from './qr-code';

package/dist/source/components/qr-code/qr-code-context.js

@@ -0,0 +1,2 @@
+import { useQrCodeContext } from './use-qr-code-context';
+export const QrCodeContext = (props) => props.children(useQrCodeContext());

package/dist/source/components/qr-code/qr-code-frame.jsx

@@ -0,0 +1,8 @@
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory';
+import { useQrCodeContext } from './use-qr-code-context';
+export const QrCodeFrame = (props) => {
+    const qrCode = useQrCodeContext();
+    const mergedProps = mergeProps(() => qrCode().getFrameProps(), props);
+    return <ark.svg {...mergedProps}/>;
+};

package/dist/source/components/qr-code/qr-code-overlay.jsx

@@ -0,0 +1,8 @@
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory';
+import { useQrCodeContext } from './use-qr-code-context';
+export const QrCodeOverlay = (props) => {
+    const qrCode = useQrCodeContext();
+    const mergedProps = mergeProps(() => qrCode().getOverlayProps(), props);
+    return <ark.div {...mergedProps}/>;
+};

package/dist/source/components/qr-code/qr-code-pattern.jsx

@@ -0,0 +1,8 @@
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory';
+import { useQrCodeContext } from './use-qr-code-context';
+export const QrCodePattern = (props) => {
+    const qrCode = useQrCodeContext();
+    const mergedProps = mergeProps(() => qrCode().getPatternProps(), props);
+    return <ark.path {...mergedProps}/>;
+};

package/dist/source/components/qr-code/qr-code-root-provider.jsx

@@ -0,0 +1,11 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../../utils/create-split-props';
+import { ark } from '../factory';
+import { QrCodeProvider } from './use-qr-code-context';
+export const QrCodeRootProvider = (props) => {
+    const [{ value: qrCode }, localProps] = createSplitProps()(props, ['value']);
+    const mergedProps = mergeProps(() => qrCode().getRootProps(), localProps);
+    return (<QrCodeProvider value={qrCode}>
+      <ark.div {...mergedProps}/>
+    </QrCodeProvider>);
+};

package/dist/source/components/qr-code/qr-code-root.jsx

@@ -0,0 +1,18 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../../utils/create-split-props';
+import { ark } from '../factory';
+import { useQrCode } from './use-qr-code';
+import { QrCodeProvider } from './use-qr-code-context';
+export const QrCodeRoot = (props) => {
+    const [useQrCodeProps, restProps] = createSplitProps()(props, [
+        'encoding',
+        'id',
+        'ids',
+        'value',
+    ]);
+    const api = useQrCode(useQrCodeProps);
+    const mergedProps = mergeProps(() => api().getRootProps(), restProps);
+    return (<QrCodeProvider value={api}>
+      <ark.div {...mergedProps}/>
+    </QrCodeProvider>);
+};

package/dist/source/components/qr-code/qr-code.js

@@ -0,0 +1,6 @@
+export { QrCodeContext } from './qr-code-context';
+export { QrCodeFrame as Frame, } from './qr-code-frame';
+export { QrCodeOverlay as Overlay, } from './qr-code-overlay';
+export { QrCodePattern as Pattern, } from './qr-code-pattern';
+export { QrCodeRoot as Root, } from './qr-code-root';
+export { QrCodeRootProvider as RootProvider, } from './qr-code-root-provider';

package/dist/source/components/qr-code/use-qr-code-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/create-context';
+export const [QrCodeProvider, useQrCodeContext] = createContext({
+    hookName: 'useQrCodeContext',
+    providerName: '<QrCodeProvider />',
+});

package/dist/source/components/qr-code/use-qr-code.js

@@ -0,0 +1,19 @@
+import * as qrCode from '@zag-js/qr-code';
+import { normalizeProps, useMachine } from '@zag-js/solid';
+import { createMemo, createUniqueId } from 'solid-js';
+import { useEnvironmentContext, useLocaleContext } from '../../providers';
+export const useQrCode = (props) => {
+    const locale = useLocaleContext();
+    const environment = useEnvironmentContext();
+    const id = createUniqueId();
+    const context = createMemo(() => ({
+        id,
+        dir: locale().dir,
+        getRootNode: environment().getRootNode,
+        ...props,
+    }));
+    const [state, send] = useMachine(qrCode.machine(context()), {
+        context,
+    });
+    return createMemo(() => qrCode.connect(state, send, normalizeProps));
+};

package/dist/source/components/radio-group/index.js

@@ -1,12 +1,12 @@
-export { RadioGroupContext } from './radio-group-context';
-export { RadioGroupIndicator } from './radio-group-indicator';
-export { RadioGroupItem } from './radio-group-item';
-export { RadioGroupItemContext } from './radio-group-item-context';
-export { RadioGroupItemControl } from './radio-group-item-control';
+export { RadioGroupContext, } from './radio-group-context';
+export { RadioGroupIndicator, } from './radio-group-indicator';
+export { RadioGroupItem, } from './radio-group-item';
+export { RadioGroupItemContext, } from './radio-group-item-context';
+export { RadioGroupItemControl, } from './radio-group-item-control';
 export { RadioGroupItemHiddenInput, } from './radio-group-item-hidden-input';
-export { RadioGroupItemText } from './radio-group-item-text';
-export { RadioGroupLabel } from './radio-group-label';
-export { RadioGroupRoot } from './radio-group-root';
+export { RadioGroupItemText, } from './radio-group-item-text';
+export { RadioGroupLabel, } from './radio-group-label';
+export { RadioGroupRoot, } from './radio-group-root';
 export { RadioGroupRootProvider, } from './radio-group-root-provider';
 export { useRadioGroup } from './use-radio-group';
 export { useRadioGroupContext } from './use-radio-group-context';