UNPKG

@ark-ui/vue

Version:

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

73 lines (66 loc) 2.41 kB
'use strict'; Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); const tour = require('@zag-js/tour'); const vue$1 = require('@zag-js/vue'); const vue = require('vue'); const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs'); const useLocaleContext = require('../../providers/locale/use-locale-context.cjs'); const cleanProps = require('../../utils/clean-props.cjs'); function _interopNamespaceDefault(e) { const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } }); if (e) { for (const k in e) { if (k !== 'default') { const d = Object.getOwnPropertyDescriptor(e, k); Object.defineProperty(n, k, d.get ? d : { enumerable: true, get: () => e[k] }); } } } n.default = e; return Object.freeze(n); } const tour__namespace = /*#__PURE__*/_interopNamespaceDefault(tour); const useTour = (props = {}, emit) => { const id = vue.useId(); const env = useEnvironmentContext.useEnvironmentContext(useEnvironmentContext.DEFAULT_ENVIRONMENT); const locale = useLocaleContext.useLocaleContext(useLocaleContext.DEFAULT_LOCALE); const context = vue.computed(() => { const localProps = vue.toValue(props); return { id, dir: locale.value.dir, getRootNode: env?.value.getRootNode, ...cleanProps.cleanProps(localProps), onFocusOutside: (details) => { emit?.("focusOutside", details); localProps.onFocusOutside?.(details); }, onInteractOutside: (details) => { emit?.("interactOutside", details); localProps.onInteractOutside?.(details); }, onPointerDownOutside: (details) => { emit?.("pointerDownOutside", details); localProps.onPointerDownOutside?.(details); }, onStatusChange: (details) => { emit?.("statusChange", details); localProps.onStatusChange?.(details); }, onStepChange: (details) => { emit?.("stepChange", details); localProps.onStepChange?.(details); }, onStepsChange(details) { emit?.("stepsChange", details); localProps.onStepsChange?.(details); } }; }); const service = vue$1.useMachine(tour__namespace.machine, context); return vue.computed(() => tour__namespace.connect(service, vue$1.normalizeProps)); }; exports.useTour = useTour;