UNPKG

@scalar/api-client

Version:

the open source API testing client

43 lines (42 loc) 1.52 kB
import { defineComponent as m, createElementBlock as o, openBlock as n, normalizeProps as i, guardReactiveProps as f, unref as l, Fragment as v, createElementVNode as c, mergeProps as a, toDisplayString as h } from "vue"; import { useBindCx as x } from "@scalar/components"; const g = ["for"], y = ["id", "placeholder", "value"], k = /* @__PURE__ */ m({ __name: "LabelInput", props: { inputId: {}, placeholder: {}, value: {}, layout: {} }, emits: ["updateValue"], setup(e, { emit: p }) { const s = p, { cx: t } = x(), d = (u) => { const r = u.target; s("updateValue", r.value); }; return (u, r) => (n(), o("div", i(f(l(t)("flex-1 flex gap-1 items-center pointer-events-none group"))), [ e.layout !== "modal" ? (n(), o(v, { key: 0 }, [ c("label", a( l(t)( "absolute w-full h-full top-0 left-0 pointer-events-auto opacity-0 cursor-text" ), { for: e.inputId } ), null, 16, g), c("input", a( l(t)( "flex-1 text-c-1 rounded pointer-events-auto relative w-full pl-1.25 -ml-0.5 md:-ml-1.25 h-8 group-hover-input has-[:focus-visible]:outline z-10" ), { id: e.inputId, placeholder: e.placeholder, value: e.value, onInput: d } ), null, 16, y) ], 64)) : (n(), o("span", i(a({ key: 1 }, l(t)("flex items-center text-c-1 h-8"))), h(e.value), 17)) ], 16)); } }); export { k as default };