vue3-picture-input
Version:
This is a simple input for pictures
530 lines (529 loc) • 14.6 kB
JavaScript
import { ssrUtils as m, initDirectivesForSSR as G, ref as $, computed as X, mergeProps as Z, useSSRContext as Q } from "vue";
/**
* @vue/shared v3.5.13
* (c) 2018-present Yuxi (Evan) You and Vue contributors
* @license MIT
**/
/*! #__NO_SIDE_EFFECTS__ */
// @__NO_SIDE_EFFECTS__
function x(e) {
const t = /* @__PURE__ */ Object.create(null);
for (const n of e.split(",")) t[n] = 1;
return (n) => n in t;
}
const v = process.env.NODE_ENV !== "production" ? Object.freeze({}) : {};
process.env.NODE_ENV !== "production" && Object.freeze([]);
const ee = () => {
}, te = (e) => e.charCodeAt(0) === 111 && e.charCodeAt(1) === 110 && // uppercase letter
(e.charCodeAt(2) > 122 || e.charCodeAt(2) < 97), h = Array.isArray, ne = (e) => C(e) === "[object Map]", re = (e) => C(e) === "[object Set]", _ = (e) => typeof e == "function", a = (e) => typeof e == "string", D = (e) => typeof e == "symbol", y = (e) => e !== null && typeof e == "object", j = Object.prototype.toString, C = (e) => j.call(e), oe = (e) => C(e) === "[object Object]", ie = (e) => {
const t = /* @__PURE__ */ Object.create(null);
return (n) => t[n] || (t[n] = e(n));
}, se = /\B([A-Z])/g, ce = ie(
(e) => e.replace(se, "-$1").toLowerCase()
);
let V;
const ae = () => V || (V = typeof globalThis < "u" ? globalThis : typeof self < "u" ? self : typeof window < "u" ? window : typeof global < "u" ? global : {});
function z(e) {
if (h(e)) {
const t = {};
for (let n = 0; n < e.length; n++) {
const r = e[n], o = a(r) ? de(r) : z(r);
if (o)
for (const i in o)
t[i] = o[i];
}
return t;
} else if (a(e) || y(e))
return e;
}
const ue = /;(?![^(]*\))/g, le = /:([^]+)/, fe = /\/\*[^]*?\*\//g;
function de(e) {
const t = {};
return e.replace(fe, "").split(ue).forEach((n) => {
if (n) {
const r = n.split(le);
r.length > 1 && (t[r[0].trim()] = r[1].trim());
}
}), t;
}
function pe(e) {
if (!e) return "";
if (a(e)) return e;
let t = "";
for (const n in e) {
const r = e[n];
if (a(r) || typeof r == "number") {
const o = n.startsWith("--") ? n : ce(n);
t += `${o}:${r};`;
}
}
return t;
}
function I(e) {
let t = "";
if (a(e))
t = e;
else if (h(e))
for (let n = 0; n < e.length; n++) {
const r = I(e[n]);
r && (t += r + " ");
}
else if (y(e))
for (const n in e)
e[n] && (t += n + " ");
return t.trim();
}
const ge = "itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly", me = /* @__PURE__ */ x(
ge + ",async,autofocus,autoplay,controls,default,defer,disabled,hidden,inert,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected"
);
function H(e) {
return !!e || e === "";
}
const he = /[>/="'\u0009\u000a\u000c\u0020]/, E = {};
function ye(e) {
if (E.hasOwnProperty(e))
return E[e];
const t = he.test(e);
return t && console.error(`unsafe attribute name: ${e}`), E[e] = !t;
}
const Se = {
acceptCharset: "accept-charset",
className: "class",
htmlFor: "for",
httpEquiv: "http-equiv"
};
function P(e) {
if (e == null)
return !1;
const t = typeof e;
return t === "string" || t === "number" || t === "boolean";
}
const be = /["'&<>]/;
function f(e) {
const t = "" + e, n = be.exec(t);
if (!n)
return t;
let r = "", o, i, s = 0;
for (i = n.index; i < t.length; i++) {
switch (t.charCodeAt(i)) {
case 34:
o = """;
break;
case 38:
o = "&";
break;
case 39:
o = "'";
break;
case 60:
o = "<";
break;
case 62:
o = ">";
break;
default:
continue;
}
s !== i && (r += t.slice(s, i)), s = i + 1, r += o;
}
return s !== i ? r + t.slice(s, i) : r;
}
const B = (e) => !!(e && e.__v_isRef === !0), L = (e) => a(e) ? e : e == null ? "" : h(e) || y(e) && (e.toString === j || !_(e.toString)) ? B(e) ? L(e.value) : JSON.stringify(e, U, 2) : String(e), U = (e, t) => B(t) ? U(e, t.value) : ne(t) ? {
[`Map(${t.size})`]: [...t.entries()].reduce(
(n, [r, o], i) => (n[O(r, i) + " =>"] = o, n),
{}
)
} : re(t) ? {
[`Set(${t.size})`]: [...t.values()].map((n) => O(n))
} : D(t) ? O(t) : y(t) && !h(t) && !oe(t) ? String(t) : t, O = (e, t = "") => {
var n;
return (
// Symbol.description in es2019+ so we need to cast here to pass
// the lib: es2016 check
D(e) ? `Symbol(${(n = e.description) != null ? n : t})` : e
);
};
/**
* @vue/server-renderer v3.5.13
* (c) 2018-present Yuxi (Evan) You and Vue contributors
* @license MIT
**/
const $e = /* @__PURE__ */ x(
",key,ref,innerHTML,textContent,ref_key,ref_for"
);
function Ee(e, t) {
let n = "";
for (const r in e) {
if ($e(r) || te(r) || t === "textarea")
continue;
const o = e[r];
r === "class" ? n += ` class="${M(o)}"` : r === "style" ? n += ` style="${d(o)}"` : r === "className" ? n += ` class="${String(o)}"` : n += Oe(r, o);
}
return n;
}
function Oe(e, t, n) {
if (!P(t))
return "";
const r = Se[e] || e.toLowerCase();
return me(r) ? H(t) ? ` ${r}` : "" : ye(r) ? t === "" ? ` ${r}` : ` ${r}="${f(t)}"` : (console.warn(
`[@vue/server-renderer] Skipped rendering unsafe attribute name: ${r}`
), "");
}
function A(e, t) {
return P(t) ? ` ${e}="${f(t)}"` : "";
}
function M(e) {
return f(I(e));
}
function d(e) {
if (!e)
return "";
if (a(e))
return f(e);
const t = z(e);
return f(pe(t));
}
const { ensureValidVNode: He } = m;
function Ne(e) {
return f(L(e));
}
Symbol(
process.env.NODE_ENV !== "production" ? "Object iterate" : ""
);
Symbol(
process.env.NODE_ENV !== "production" ? "Map keys iterate" : ""
);
Symbol(
process.env.NODE_ENV !== "production" ? "Array iterate" : ""
);
function R(e) {
const t = e && e.__v_raw;
return t ? R(t) : e;
}
function Re(e) {
return e ? e.__v_isRef === !0 : !1;
}
const u = [];
function _e(e) {
u.push(e);
}
function Ce() {
u.pop();
}
let N = !1;
function W(e, ...t) {
if (N) return;
N = !0;
const n = u.length ? u[u.length - 1].component : null, r = n && n.appContext.config.warnHandler, o = ke();
if (r)
F(
r,
n,
11,
[
// eslint-disable-next-line no-restricted-syntax
e + t.map((i) => {
var s, c;
return (c = (s = i.toString) == null ? void 0 : s.call(i)) != null ? c : JSON.stringify(i);
}).join(""),
n && n.proxy,
o.map(
({ vnode: i }) => `at <${J(n, i.type)}>`
).join(`
`),
o
]
);
else {
const i = [`[Vue warn]: ${e}`, ...t];
o.length && i.push(`
`, ...we(o)), console.warn(...i);
}
N = !1;
}
function ke() {
let e = u[u.length - 1];
if (!e)
return [];
const t = [];
for (; e; ) {
const n = t[0];
n && n.vnode === e ? n.recurseCount++ : t.push({
vnode: e,
recurseCount: 0
});
const r = e.component && e.component.parent;
e = r && r.vnode;
}
return t;
}
function we(e) {
const t = [];
return e.forEach((n, r) => {
t.push(...r === 0 ? [] : [`
`], ...Ve(n));
}), t;
}
function Ve({ vnode: e, recurseCount: t }) {
const n = t > 0 ? `... (${t} recursive calls)` : "", r = e.component ? e.component.parent == null : !1, o = ` at <${J(
e.component,
e.type,
r
)}`, i = ">" + n;
return e.props ? [o, ...Ae(e.props), i] : [o + i];
}
function Ae(e) {
const t = [], n = Object.keys(e);
return n.slice(0, 3).forEach((r) => {
t.push(...q(r, e[r]));
}), n.length > 3 && t.push(" ..."), t;
}
function q(e, t, n) {
return a(t) ? (t = JSON.stringify(t), n ? t : [`${e}=${t}`]) : typeof t == "number" || typeof t == "boolean" || t == null ? n ? t : [`${e}=${t}`] : Re(t) ? (t = q(e, R(t.value), !0), n ? t : [`${e}=Ref<`, t, ">"]) : _(t) ? [`${e}=fn${t.name ? `<${t.name}>` : ""}`] : (t = R(t), n ? t : [`${e}=`, t]);
}
const Y = {
sp: "serverPrefetch hook",
bc: "beforeCreate hook",
c: "created hook",
bm: "beforeMount hook",
m: "mounted hook",
bu: "beforeUpdate hook",
u: "updated",
bum: "beforeUnmount hook",
um: "unmounted hook",
a: "activated hook",
da: "deactivated hook",
ec: "errorCaptured hook",
rtc: "renderTracked hook",
rtg: "renderTriggered hook",
0: "setup function",
1: "render function",
2: "watcher getter",
3: "watcher callback",
4: "watcher cleanup function",
5: "native event handler",
6: "component event handler",
7: "vnode hook",
8: "directive hook",
9: "transition hook",
10: "app errorHandler",
11: "app warnHandler",
12: "ref function",
13: "async component loader",
14: "scheduler flush",
15: "component update",
16: "app unmount cleanup function"
};
function F(e, t, n, r) {
try {
return r ? e(...r) : e();
} catch (o) {
Te(o, t, n);
}
}
function Te(e, t, n, r = !0) {
const o = t ? t.vnode : null, { errorHandler: i, throwUnhandledErrorInProduction: s } = t && t.appContext.config || v;
if (t) {
let c = t.parent;
const p = t.proxy, w = process.env.NODE_ENV !== "production" ? Y[n] : `https://vuejs.org/error-reference/#runtime-${n}`;
for (; c; ) {
const S = c.ec;
if (S) {
for (let b = 0; b < S.length; b++)
if (S[b](e, p, w) === !1)
return;
}
c = c.parent;
}
if (i) {
F(i, null, 10, [
e,
p,
w
]);
return;
}
}
xe(e, n, o, r, s);
}
function xe(e, t, n, r = !0, o = !1) {
if (process.env.NODE_ENV !== "production") {
const i = Y[t];
if (n && _e(n), W(`Unhandled error${i ? ` during execution of ${i}` : ""}`), n && Ce(), r)
throw e;
console.error(e);
} else {
if (o)
throw e;
console.error(e);
}
}
let l, g = [];
function K(e, t) {
var n, r;
l = e, l ? (l.enabled = !0, g.forEach(({ event: o, args: i }) => l.emit(o, ...i)), g = []) : /* handle late devtools injection - only do this if we are in an actual */ /* browser environment to avoid the timer handle stalling test runner exit */ /* (#4815) */ typeof window < "u" && // some envs mock window but not fully
window.HTMLElement && // also exclude jsdom
// eslint-disable-next-line no-restricted-syntax
!((r = (n = window.navigator) == null ? void 0 : n.userAgent) != null && r.includes("jsdom")) ? ((t.__VUE_DEVTOOLS_HOOK_REPLAY__ = t.__VUE_DEVTOOLS_HOOK_REPLAY__ || []).push((i) => {
K(i, t);
}), setTimeout(() => {
l || (t.__VUE_DEVTOOLS_HOOK_REPLAY__ = null, g = []);
}, 3e3)) : g = [];
}
{
const e = ae(), t = (n, r) => {
let o;
return (o = e[n]) || (o = e[n] = []), o.push(r), (i) => {
o.length > 1 ? o.forEach((s) => s(i)) : o[0](i);
};
};
t(
"__VUE_INSTANCE_SETTERS__",
(n) => n
), t(
"__VUE_SSR_SETTERS__",
(n) => n
);
}
process.env.NODE_ENV;
const De = /(?:^|[-_])(\w)/g, je = (e) => e.replace(De, (t) => t.toUpperCase()).replace(/[-_]/g, "");
function ze(e, t = !0) {
return _(e) ? e.displayName || e.name : e.name || t && e.__name;
}
function J(e, t, n = !1) {
let r = ze(t);
if (!r && t.__file) {
const o = t.__file.match(/([^/\\]+)\.\w+$/);
o && (r = o[1]);
}
if (!r && e && e.parent) {
const o = (i) => {
for (const s in i)
if (i[s] === t)
return s;
};
r = o(
e.components || e.parent.type.components
) || o(e.appContext.components);
}
return r ? je(r) : n ? "App" : "Anonymous";
}
process.env.NODE_ENV;
process.env.NODE_ENV;
process.env.NODE_ENV;
const {
createComponentInstance: Pe,
setCurrentRenderingInstance: Be,
setupComponent: Le,
renderComponentRoot: Ue,
normalizeVNode: Me,
pushWarningContext: We,
popWarningContext: qe
} = m, { isVNode: Ye } = m, { isVNode: Fe } = m;
G();
const k = {
__name: "VueImageInput",
__ssrInlineRender: !0,
props: {
title: {
type: String,
default: "Drop here"
},
required: {
type: Boolean,
default: !1
},
fontSize: {
type: String,
default: ""
},
size: {
type: String,
default: ""
},
background: {
type: String,
default: ""
},
textColor: {
type: String,
default: ""
},
border: {
type: String,
default: ""
},
borderColor: {
type: String,
default: ""
},
mimes: {
type: String,
default: ".jpg,.png"
},
imageRounded: {
type: String,
default: ""
},
closeBtnColor: {
type: String,
default: ""
},
closeBtn: {
type: String,
default: ""
},
bgRounded: {
type: String,
default: ""
},
padding: {
type: String,
default: ""
},
paddingLeft: {
type: String,
default: ""
},
paddingRight: {
type: String,
default: ""
},
paddingTop: {
type: String,
default: ""
},
paddingBottom: {
type: String,
default: ""
},
paddingX: {
type: String,
default: ""
},
paddingY: {
type: String,
default: ""
}
},
setup(e, { emit: t }) {
const n = e, r = $("");
$(null), $(null);
const o = X(() => "w" + n.size.slice(4));
return (i, s, c, p) => {
s(`<div${Ee(Z({
class: `${o.value} container ${e.border}`,
style: `border-color: ${e.borderColor}; padding: ${e.padding ?? (e.paddingY ?? "0") + " " + (e.paddingX ?? "0")}; padding-left: ${e.paddingLeft}; padding-right: ${e.paddingRight}; padding-top: ${e.paddingTop}; padding-bottom: ${e.paddingBottom}`
}, p))} data-v-517cfa18>`), r.value ? s("<!---->") : s(`<!--[--><input class="input" type="file"${A("accept", e.mimes)}${H(e.required) ? " required" : ""} data-v-517cfa18><button class="${M(`${e.size} btn`)}" style="${d(`background: ${e.background}; color: ${e.textColor}; font-size: ${e.fontSize}; border-radius: ${e.bgRounded}`)}" data-v-517cfa18>${Ne(e.title)}</button><!--]-->`), r.value ? s(`<!--[--><img${A("src", r.value)} class="w-full image" style="${d(`border-radius: ${e.imageRounded}`)}" data-v-517cfa18><div class="close" data-v-517cfa18><div class="close-before" style="${d(`background: ${e.closeBtnColor}`)}" data-v-517cfa18></div><div class="close-after" style="${d(`background: ${e.closeBtnColor}`)}" data-v-517cfa18></div></div><!--]-->`) : s("<!---->"), s("</div>");
};
}
};
k.__scopeId = "data-v-517cfa18";
const T = k.setup;
k.setup = (e, t) => {
const n = Q();
return (n.modules || (n.modules = /* @__PURE__ */ new Set())).add("src/components/VueImageInput.vue"), T ? T(e, t) : void 0;
};
export {
k as VueImageInput
};