@synergy-design-system/vue
Version:
Vue3 wrappers for the Synergy Design System
66 lines (65 loc) • 2.58 kB
JavaScript
import { defineComponent, ref, computed, createElementBlock, openBlock, mergeProps, renderSlot } from "vue";
import "@synergy-design-system/components/components/select/select.js";
const _hoisted_1 = ["value"];
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "SynVueSelect",
props: {
delimiter: {},
name: {},
size: {},
placeholder: {},
multiple: {},
maxOptionsVisible: {},
disabled: {},
clearable: {},
open: {},
hoist: {},
label: {},
placement: {},
helpText: {},
form: {},
required: {},
getTag: {},
value: {},
modelValue: {}
},
emits: ["syn-change", "syn-clear", "syn-input", "syn-focus", "syn-blur", "syn-show", "syn-after-show", "syn-hide", "syn-after-hide", "syn-invalid", "update:modelValue"],
setup(__props, { expose: __expose }) {
const nativeElement = ref();
__expose({
nativeElement
});
const props = __props;
const visibleProps = computed(
() => Object.fromEntries(
Object.entries(props).filter(([, value]) => typeof value !== "undefined")
)
);
return (_ctx, _cache) => {
return openBlock(), createElementBlock("syn-select", mergeProps({
onSynChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-change", $event)),
onSynClear: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-clear", $event)),
onSynInput: _cache[2] || (_cache[2] = ($event) => {
_ctx.$emit("update:modelValue", $event.target.value);
_ctx.$emit("syn-input", $event);
}),
onSynFocus: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("syn-focus", $event)),
onSynBlur: _cache[4] || (_cache[4] = ($event) => _ctx.$emit("syn-blur", $event)),
onSynShow: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("syn-show", $event)),
onSynAfterShow: _cache[6] || (_cache[6] = ($event) => _ctx.$emit("syn-after-show", $event)),
onSynHide: _cache[7] || (_cache[7] = ($event) => _ctx.$emit("syn-hide", $event)),
onSynAfterHide: _cache[8] || (_cache[8] = ($event) => _ctx.$emit("syn-after-hide", $event)),
onSynInvalid: _cache[9] || (_cache[9] = ($event) => _ctx.$emit("syn-invalid", $event)),
value: typeof props.modelValue !== "undefined" ? props.modelValue : typeof props.value !== "undefined" ? props.value : void 0
}, visibleProps.value, {
ref_key: "nativeElement",
ref: nativeElement
}), [
renderSlot(_ctx.$slots, "default")
], 16, _hoisted_1);
};
}
});
export {
_sfc_main as default
};