@ark-ui/vue
Version:
A collection of unstyled, accessible UI components for Vue, utilizing state machines for seamless interaction.
39 lines (36 loc) • 970 B
JavaScript
import { defineComponent, h } from 'vue';
import { Dynamic } from '../utils/dynamic.js';
const withAsChild = (component) => {
return defineComponent({
name: "Polymorphic",
inheritAttrs: false,
props: {
asChild: {
type: Boolean,
default: false
}
},
setup(props, { attrs, slots }) {
if (!props.asChild) return () => h(component, { ...attrs }, slots.default?.());
return () => h(Dynamic, attrs, { default: slots.default });
}
});
};
function jsxFactory() {
const cache = /* @__PURE__ */ new Map();
const factory = new Proxy(withAsChild, {
apply(_target, _thisArg, argArray) {
return withAsChild(argArray[0]);
},
get(_, element) {
const asElement = element;
if (!cache.has(asElement)) {
cache.set(asElement, withAsChild(asElement));
}
return cache.get(asElement);
}
});
return factory;
}
const ark = jsxFactory();
export { ark, jsxFactory };