UNPKG

@ark-ui/vue

Version:

A collection of unstyled, accessible UI components for Vue, utilizing state machines for seamless interaction.

39 lines (38 loc) 1.59 kB
import { DEFAULT_ENVIRONMENT, useEnvironmentContext } from "../../providers/environment/use-environment-context.js"; import { DEFAULT_LOCALE, useLocaleContext } from "../../providers/locale/use-locale-context.js"; import { cleanProps } from "../../utils/clean-props.js"; import { toBooleanValue } from "../../utils/boolean.js"; import { useFieldsetContext } from "../fieldset/use-fieldset-context.js"; import * as radioGroup from "@zag-js/radio-group"; import { computed, toValue, useId } from "vue"; import { normalizeProps as normalizeProps$1, useMachine } from "@zag-js/vue"; //#region src/components/radio-group/use-radio-group.ts var useRadioGroup = (props = {}, emit) => { const id = useId(); const env = useEnvironmentContext(DEFAULT_ENVIRONMENT); const locale = useLocaleContext(DEFAULT_LOCALE); const fieldset = useFieldsetContext(); const context = computed(() => { const localProps = toValue(props); const fieldsetContext = fieldset?.value; return { id, ids: { label: fieldsetContext?.ids?.legend }, disabled: toBooleanValue(fieldsetContext?.disabled), invalid: fieldsetContext?.invalid, dir: locale.value.dir, value: localProps.modelValue, getRootNode: env?.value.getRootNode, ...cleanProps(localProps), onValueChange: (details) => { emit?.("valueChange", details); emit?.("update:modelValue", details.value); localProps.onValueChange?.(details); } }; }); const service = useMachine(radioGroup.machine, context); return computed(() => radioGroup.connect(service, normalizeProps$1)); }; //#endregion export { useRadioGroup };