@shopware-ag/meteor-component-library
Version:
The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).
54 lines (53 loc) • 2.02 kB
JavaScript
import '../mt-search.css';
;
const vue = require("vue");
const vueI18n = require("vue-i18n");
const mtIcon_vue_vue_type_style_index_0_lang = require("../mt-icon.vue_vue_type_style_index_0_lang-0a28c7b6.js");
const _pluginVue_exportHelper = require("../_plugin-vue_export-helper-9c783a34.js");
const _hoisted_1 = ["value", "disabled", "placeholder"];
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
__name: "mt-search",
props: {
modelValue: {},
placeholder: {},
size: { default: "default" },
disabled: { type: Boolean }
},
emits: ["change", "update:modelValue"],
setup(__props) {
const { t } = vueI18n.useI18n({
messages: {
en: {
placeholder: "Search"
},
de: {
placeholder: "Suchen"
}
}
});
return (_ctx, _cache) => {
return vue.openBlock(), vue.createElementBlock("div", {
class: vue.normalizeClass(["mt-search", `mt-search--size-${_ctx.size}`, { "mt-search--disabled": _ctx.disabled }])
}, [
vue.createElementVNode("input", {
value: _ctx.modelValue,
onInput: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.value)),
onChange: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("change", $event.target.value)),
class: "mt-search__input",
disabled: _ctx.disabled,
type: "search",
placeholder: _ctx.placeholder || vue.unref(t)("placeholder")
}, null, 40, _hoisted_1),
vue.createVNode(mtIcon_vue_vue_type_style_index_0_lang._sfc_main, {
name: "regular-search-s",
size: "var(--scale-size-16)",
color: "var(--color-icon-primary-default)"
})
], 2);
};
}
});
const mtSearch_vue_vue_type_style_index_0_scoped_7a3a41ec_lang = "";
const MtSearch = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-7a3a41ec"]]);
module.exports = MtSearch;
//# sourceMappingURL=MtSearch.js.map