2020-08-30 02:19:46 +02:00
|
|
|
import Vue from "vue";
|
|
|
|
import App from "./App.vue";
|
|
|
|
import router from "./router";
|
2020-09-02 23:12:13 +02:00
|
|
|
import {
|
|
|
|
defineCustomElements,
|
|
|
|
setAssetPath,
|
|
|
|
SlInput
|
|
|
|
} from "@shoelace-style/shoelace";
|
2020-08-30 02:19:46 +02:00
|
|
|
import { VNode } from "vue/types/umd";
|
|
|
|
import { DirectiveBinding } from "vue/types/options";
|
|
|
|
|
2020-09-02 23:12:13 +02:00
|
|
|
// TODO: Remove when UI settles!
|
2020-08-30 02:19:46 +02:00
|
|
|
defineCustomElements();
|
2020-09-02 23:12:13 +02:00
|
|
|
setAssetPath(`${window.location.origin}/${process.env.VUE_APP_ASSET_PATH}/`);
|
2020-08-30 02:19:46 +02:00
|
|
|
|
|
|
|
Vue.directive("sl-model", {
|
2020-09-02 23:12:13 +02:00
|
|
|
inserted: (element: Element, binding: DirectiveBinding, vnode: VNode) => {
|
2020-08-30 02:19:46 +02:00
|
|
|
element.addEventListener("slInput", event => {
|
2020-09-02 23:12:13 +02:00
|
|
|
const slElement = event?.srcElement as
|
|
|
|
| typeof SlInput.prototype
|
|
|
|
| undefined;
|
|
|
|
const value = slElement?.value;
|
|
|
|
if (value) {
|
|
|
|
vnode.context?.$set(vnode.context, binding.expression, value);
|
2020-08-30 02:19:46 +02:00
|
|
|
}
|
|
|
|
});
|
2020-09-02 23:12:13 +02:00
|
|
|
},
|
|
|
|
update: (element: Element, binding: DirectiveBinding, vnode: VNode) => {
|
|
|
|
const slElement = element as typeof SlInput.prototype | undefined;
|
|
|
|
if (slElement) {
|
|
|
|
slElement.value = vnode.context?.$data[binding.expression];
|
|
|
|
}
|
2020-08-30 02:19:46 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
Vue.config.ignoredElements = [/^sl-/];
|
|
|
|
Vue.config.productionTip = false;
|
|
|
|
|
|
|
|
new Vue({
|
|
|
|
router,
|
|
|
|
render: h => h(App)
|
|
|
|
}).$mount("#app");
|