UNPKG

@ark-ui/vue

Version:

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

37 lines (34 loc) 1.4 kB
import { defineComponent, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue'; import { useForwardExpose } from '../../utils/use-forward-expose.js'; import { ark } from '../factory.js'; import { useAccordionContext } from './use-accordion-context.js'; import { useAccordionItemPropsContext } from './use-accordion-item-props-context.js'; import { useCollapsibleContext } from '../collapsible/use-collapsible-context.js'; const _sfc_main = /* @__PURE__ */ defineComponent({ __name: "accordion-item-trigger", props: { asChild: { type: Boolean } }, setup(__props) { const accordion = useAccordionContext(); const itemProps = useAccordionItemPropsContext(); const collapsible = useCollapsibleContext(); const triggerProps = computed(() => { const { "aria-controls": ariaControls, ...otherProps } = accordion.value.getItemTriggerProps(itemProps); return { ...otherProps, ...collapsible.value.unmounted ? {} : { "aria-controls": ariaControls } }; }); useForwardExpose(); return (_ctx, _cache) => { return openBlock(), createBlock(unref(ark).button, mergeProps(triggerProps.value, { "as-child": _ctx.asChild }), { default: withCtx(() => [ renderSlot(_ctx.$slots, "default") ]), _: 3 }, 16, ["as-child"]); }; } }); export { _sfc_main as default };