dreambuilders-ui 0.1.3 → 0.1.5

package/dist/index.mjs

@@ -1,516 +0,0 @@
-import { Fragment as e, Transition as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, nextTick as u, normalizeClass as d, normalizeStyle as f, onMounted as p, openBlock as m, ref as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, unref as y, useSlots as b, useTemplateRef as x, watch as S, withCtx as C, withModifiers as w } from "vue";
-//#region src/components/button/src/Button.vue?vue&type=script&setup=true&lang.ts
-var T = {
-	key: 0,
-	class: "iconfont loading icon-loading"
-}, E = /*@__PURE__*/ l({
-	name: "DbButton",
-	__name: "Button",
-	props: {
-		type: { default: "default" },
-		size: { default: "default" },
-		nativeType: { default: "button" },
-		tag: { default: "button" },
-		loadingIcon: { default: "" },
-		icon: { default: "" },
-		color: { default: "" },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		loading: {
-			type: Boolean,
-			default: !1
-		},
-		plain: {
-			type: Boolean,
-			default: !1
-		},
-		round: {
-			type: Boolean,
-			default: !1
-		},
-		dashed: {
-			type: Boolean,
-			default: !1
-		},
-		circle: {
-			type: Boolean,
-			default: !1
-		},
-		link: {
-			type: Boolean,
-			default: !1
-		},
-		text: {
-			type: Boolean,
-			default: !1
-		},
-		autofocus: {
-			type: Boolean,
-			default: !1
-		}
-	},
-	emits: ["click"],
-	setup(e, { emit: t }) {
-		let o = e, s = t, c = n(() => o.disabled || o.loading), l = n(() => [
-			"db-button",
-			`db-button-type__${o.type}`,
-			`db-button-size__${o.size}`,
-			{
-				"is-disabled": c.value,
-				"is-plain": o.plain,
-				"is-round": o.round,
-				"is-dashed": o.dashed,
-				"is-circle": o.circle,
-				"is-link": o.link,
-				"is-text": o.text,
-				"is-loading": o.loading
-			}
-		]), u = n(() => {
-			if (!o.color) return {};
-			let e = o.color, t = {
-				"--db-button-background-color": e,
-				"--db-button-border-color": e,
-				"--db-button-color": "#ffffff",
-				"--db-button-background-color-hover": `color-mix(in srgb, ${e}, white 30%)`,
-				"--db-button-border-color-hover": `color-mix(in srgb, ${e}, white 30%)`,
-				"--db-button-color-hover": "#ffffff",
-				"--db-button-background-color-active": `color-mix(in srgb, ${e}, white 30%)`,
-				"--db-button-border-color-active": `color-mix(in srgb, ${e}, white 30%)`,
-				"--db-button-color-active": "#ffffff"
-			};
-			return o.plain && (t["--db-button-background-color"] = "transparent", t["--db-button-background-color-hover"] = "transparent", t["--db-button-background-color-active"] = "transparent", t["--db-button-color"] = e, t["--db-button-color-hover"] = `color-mix(in srgb, ${e}, white 30%)`, t["--db-button-color-active"] = `color-mix(in srgb, ${e}, white 30%)`, t["--db-button-border-color"] = e, t["--db-button-border-color-hover"] = `color-mix(in srgb, ${e}, white 30%)`, t["--db-button-border-color-active"] = `color-mix(in srgb, ${e}, white 30%)`), o.text && (t["--db-button-background-color"] = "transparent", t["--db-button-background-color-hover"] = `color-mix(in srgb, ${e}, white 92%)`, t["--db-button-background-color-active"] = `color-mix(in srgb, ${e}, white 92%)`, t["--db-button-border-color"] = "transparent", t["--db-button-border-color-hover"] = `color-mix(in srgb, ${e}, white 92%)`, t["--db-button-border-color-active"] = `color-mix(in srgb, ${e}, white 92%)`, t["--db-button-color"] = e, t["--db-button-color-hover"] = e, t["--db-button-color-active"] = e), o.link && (t["--db-button-background-color"] = "transparent", t["--db-button-background-color-hover"] = "transparent", t["--db-button-background-color-active"] = "transparent", t["--db-button-border-color"] = "transparent", t["--db-button-border-color-hover"] = "transparent", t["--db-button-border-color-active"] = "transparent", t["--db-button-color"] = e, t["--db-button-color-hover"] = `color-mix(in srgb, ${e}, white 30%)`, t["--db-button-color-active"] = `color-mix(in srgb, ${e}, white 30%)`), t;
-		});
-		function p(e) {
-			c.value || s("click", e);
-		}
-		return (t, n) => (m(), r(_(e.tag), {
-			class: d(l.value),
-			type: e.nativeType,
-			disabled: c.value,
-			autofocus: e.autofocus,
-			style: f(u.value),
-			onClick: p
-		}, {
-			default: C(() => [
-				e.loading && !e.loadingIcon ? (m(), a("i", T)) : i("", !0),
-				e.loading && e.loadingIcon ? (m(), a("image", {
-					key: 1,
-					class: d([
-						"iconfont",
-						"loading",
-						`icon-${e.loadingIcon}`
-					])
-				}, null, 2)) : i("", !0),
-				e.icon && !e.loading ? (m(), a("i", {
-					key: 2,
-					class: d(["iconfont", `icon-${e.icon}`])
-				}, null, 2)) : i("", !0),
-				g(t.$slots, "default", {}, void 0, !0)
-			]),
-			_: 3
-		}, 8, [
-			"class",
-			"type",
-			"disabled",
-			"autofocus",
-			"style"
-		]));
-	}
-}), D = (e, t) => {
-	let n = e.__vccOpts || e;
-	for (let [e, r] of t) n[e] = r;
-	return n;
-}, O = /*#__PURE__*/ D(E, [["__scopeId", "data-v-bc3a041a"]]), k = /*#__PURE__*/ D(/* @__PURE__ */ l({
-	name: "DbButtonGroup",
-	__name: "ButtonGroup",
-	props: { direction: { default: "horizontal" } },
-	setup(e) {
-		let t = e, r = n(() => ["db-button-group", `db-button-group-direction__${t.direction}`]);
-		return (e, t) => (m(), a("div", { class: d(r.value) }, [g(e.$slots, "default", {}, void 0, !0)], 2));
-	}
-}), [["__scopeId", "data-v-d8f67fe3"]]), A = {
-	key: 0,
-	class: "db-input-group__prepend"
-}, j = [
-	"value",
-	"placeholder",
-	"disabled",
-	"readonly",
-	"rows",
-	"name",
-	"autocomplete",
-	"autofocus",
-	"form",
-	"maxlength",
-	"minlength",
-	"tabindex"
-], M = {
-	key: 0,
-	class: "db-input-limit"
-}, N = { class: "db-input-limit__inner" }, P = [
-	"type",
-	"value",
-	"placeholder",
-	"disabled",
-	"readonly",
-	"name",
-	"autocomplete",
-	"autofocus",
-	"form",
-	"maxlength",
-	"minlength",
-	"tabindex"
-], F = {
-	key: 3,
-	class: "db-input-group__append"
-}, I = /*#__PURE__*/ D(/* @__PURE__ */ l({
-	name: "DbInput",
-	__name: "Input",
-	props: {
-		modelValue: { default: "" },
-		type: { default: "text" },
-		size: { default: "default" },
-		placeholder: { default: "" },
-		clearable: {
-			type: Boolean,
-			default: !1
-		},
-		showPassword: {
-			type: Boolean,
-			default: !1
-		},
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		readonly: {
-			type: Boolean,
-			default: !1
-		},
-		suffixIcon: {},
-		prefixIcon: {},
-		rows: { default: 2 },
-		autosize: {
-			type: [Boolean, Object],
-			default: !1
-		},
-		autocomplete: { default: "off" },
-		autofocus: {
-			type: Boolean,
-			default: !1
-		},
-		form: { default: "" },
-		name: { default: "" },
-		minlength: {},
-		maxlength: {},
-		showWordLimit: {
-			type: Boolean,
-			default: !1
-		},
-		resize: { default: "vertical" },
-		tabindex: { default: void 0 }
-	},
-	emits: [
-		"update:modelValue",
-		"input",
-		"change",
-		"focus",
-		"blur",
-		"clear",
-		"keydown",
-		"keyup",
-		"keypress"
-	],
-	setup(t, { expose: r, emit: s }) {
-		let c = t, l = s;
-		r({
-			focus: () => y.value?.focus(),
-			blur: () => y.value?.blur(),
-			select: () => y.value?.select()
-		});
-		let _ = b(), y = x("input-ref"), C = h(!1), T = h(!1), E = n(() => c.type === "textarea"), D = n(() => !!_.prepend), O = n(() => !!_.prepend), k = n(() => c.showPassword && c.type === "password" ? T.value ? "text" : "password" : c.type), I = n(() => String(c.modelValue ?? "")), L = n(() => c.clearable && I.value && !c.disabled && !c.readonly), R = n(() => I.value.length), z = n(() => c.showWordLimit && c.maxlength !== void 0), B = n(() => `db-input-size__${c.size}`), V = n(() => E.value ? [
-			"db-textarea",
-			B.value,
-			{
-				"is-disabled": c.disabled,
-				"is-focus": C.value
-			}
-		] : D.value || O.value ? ["db-input-group", B.value] : [
-			"db-input",
-			B.value,
-			{
-				"is-disabled": c.disabled,
-				"is-focus": C.value
-			}
-		]);
-		function H(e) {
-			let t = e.target.value;
-			l("update:modelValue", t), l("input", t), u(() => J());
-		}
-		function U(e) {
-			let t = e.target.value;
-			l("change", t);
-		}
-		function W(e) {
-			C.value = !0, l("focus", e);
-		}
-		function G(e) {
-			C.value = !1, l("blur", e);
-		}
-		function K() {
-			l("update:modelValue", ""), l("input", ""), l("change", ""), l("clear"), u(() => {
-				y.value?.focus(), J();
-			});
-		}
-		function q() {
-			T.value = !T.value;
-		}
-		function J() {
-			if (!E.value || !c.autosize || !y.value) return;
-			let e = y.value, { autosize: t } = c;
-			e.style.height = "auto";
-			let n = e.scrollHeight;
-			if (typeof t == "object") {
-				let { minRows: e, maxRows: r } = t;
-				if (e) {
-					let t = e * 20 + 22;
-					n = Math.max(n, t);
-				}
-				if (r) {
-					let e = r * 20 + 22;
-					n = Math.min(n, e);
-				}
-			}
-			e.style.height = `${n}px`;
-		}
-		return p(() => {
-			J();
-		}), S(() => c.modelValue, () => u(() => J())), (n, r) => (m(), a("div", { class: d(V.value) }, [
-			!E.value && D.value ? (m(), a("div", A, [g(n.$slots, "prepend", {}, void 0, !0)])) : i("", !0),
-			E.value ? (m(), a(e, { key: 1 }, [o("textarea", {
-				ref: "input-ref",
-				class: "db-textarea__inner",
-				style: f({ resize: t.resize }),
-				value: I.value,
-				placeholder: t.placeholder,
-				disabled: t.disabled,
-				readonly: t.readonly,
-				rows: t.rows,
-				name: t.name,
-				autocomplete: t.autocomplete,
-				autofocus: t.autofocus,
-				form: t.form,
-				maxlength: t.maxlength,
-				minlength: t.minlength,
-				tabindex: t.tabindex,
-				onInput: H,
-				onChange: U,
-				onFocus: W,
-				onBlur: G,
-				onKeydown: r[0] ||= (e) => l("keydown", e),
-				onKeyup: r[1] ||= (e) => l("keyup", e),
-				onKeypress: r[2] ||= (e) => l("keypress", e)
-			}, null, 44, j), z.value ? (m(), a("div", M, [o("span", N, v(R.value) + "/" + v(t.maxlength), 1)])) : i("", !0)], 64)) : i("", !0),
-			E.value ? i("", !0) : (m(), a("div", {
-				key: 2,
-				class: d(["db-input__wrapper", {
-					"is-focus": C.value,
-					"is-disabled": t.disabled
-				}])
-			}, [
-				t.prefixIcon ? (m(), a("i", {
-					key: 0,
-					class: d(["iconfont", `icon-${t.prefixIcon}`])
-				}, null, 2)) : i("", !0),
-				o("input", {
-					ref: "input-ref",
-					class: "db-input__inner",
-					type: k.value,
-					value: I.value,
-					placeholder: t.placeholder,
-					disabled: t.disabled,
-					readonly: t.readonly,
-					name: t.name,
-					autocomplete: t.autocomplete,
-					autofocus: t.autofocus,
-					form: t.form,
-					maxlength: t.maxlength,
-					minlength: t.minlength,
-					tabindex: t.tabindex,
-					onInput: H,
-					onChange: U,
-					onFocus: W,
-					onBlur: G,
-					onKeydown: r[3] ||= (e) => l("keydown", e),
-					onKeyup: r[4] ||= (e) => l("keyup", e),
-					onKeypress: r[5] ||= (e) => l("keypress", e)
-				}, null, 40, P),
-				L.value ? (m(), a("i", {
-					key: 1,
-					class: d(["iconfont", "icon-clear"]),
-					onClick: w(K, ["stop"])
-				})) : i("", !0),
-				t.type === "password" && t.showPassword ? (m(), a("image", {
-					key: 2,
-					class: d(["iconfont", "icon-showPassword"]),
-					onClick: w(q, ["stop"])
-				})) : i("", !0),
-				t.suffixIcon ? (m(), a("i", {
-					key: 3,
-					class: d(["iconfont", `icon-${t.suffixIcon}`])
-				}, null, 2)) : i("", !0)
-			], 2)),
-			!E.value && O.value ? (m(), a("div", F, [g(n.$slots, "append", {}, void 0, !0)])) : i("", !0)
-		], 2));
-	}
-}), [["__scopeId", "data-v-e3bb386b"]]), L = /*#__PURE__*/ D(/* @__PURE__ */ l({
-	name: "DbText",
-	__name: "Text",
-	props: {
-		type: { default: "default" },
-		size: { default: "default" },
-		tag: { default: "span" },
-		truncated: {
-			type: Boolean,
-			default: !1
-		},
-		lineClamp: { default: void 0 },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		strong: {
-			type: Boolean,
-			default: !1
-		},
-		italic: {
-			type: Boolean,
-			default: !1
-		},
-		underline: {
-			type: Boolean,
-			default: !1
-		},
-		delete: {
-			type: Boolean,
-			default: !1
-		},
-		marked: {
-			type: Boolean,
-			default: !1
-		},
-		code: {
-			type: Boolean,
-			default: !1
-		},
-		color: { default: "" }
-	},
-	setup(e) {
-		let t = e, i = n(() => [
-			"db-text",
-			`db-text-type__${t.type}`,
-			`db-text-size__${t.size}`,
-			{
-				"is-truncated": t.truncated && !t.lineClamp,
-				"is-disabled": t.disabled,
-				"is-strong": t.strong,
-				"is-italic": t.italic,
-				"is-underline": t.underline,
-				"is-delete": t.delete,
-				"is-marked": t.marked,
-				"is-code": t.code
-			}
-		]), a = n(() => {
-			let e = {};
-			return t.color && (e.color = t.color), t.lineClamp && (e.overflow = "hidden", e.display = "-webkit-box", e.WebkitBoxOrient = "vertical", e.WebkitLineClamp = t.lineClamp, e.wordBreak = "break-all"), e;
-		});
-		return (t, n) => (m(), r(_(e.tag), {
-			class: d(i.value),
-			style: f(a.value)
-		}, {
-			default: C(() => [g(t.$slots, "default", {}, void 0, !0)]),
-			_: 3
-		}, 8, ["class", "style"]));
-	}
-}), [["__scopeId", "data-v-b274d22b"]]), R = {
-	key: 0,
-	class: "db-alert__icon"
-}, z = { class: "db-alert__content" }, B = { class: "db-alert__title" }, V = {
-	key: 0,
-	class: "db-alert__description"
-}, H = /*#__PURE__*/ D(/* @__PURE__ */ l({
-	name: "DbAlert",
-	__name: "Alert",
-	props: {
-		type: { default: "info" },
-		title: { default: "" },
-		description: { default: "" },
-		closable: {
-			type: Boolean,
-			default: !0
-		},
-		closeText: { default: "" },
-		showIcon: {
-			type: Boolean,
-			default: !1
-		},
-		center: {
-			type: Boolean,
-			default: !1
-		},
-		effect: { default: "light" }
-	},
-	emits: ["close"],
-	setup(e, { emit: l }) {
-		let u = e, f = l, p = b(), _ = h(!0), x = n(() => u.description || p.description), S = n(() => [
-			"db-alert",
-			`db-alert--${u.type}`,
-			`db-alert--${u.effect}`,
-			{
-				"is-center": u.center,
-				"is-with-description": x.value,
-				"is-closable": u.closable
-			}
-		]);
-		function w(e) {
-			_.value = !1, f("close", e);
-		}
-		return (n, l) => (m(), r(t, { name: "alert-fade" }, {
-			default: C(() => [_.value ? (m(), a("div", {
-				key: 0,
-				class: d(S.value),
-				role: "alert"
-			}, [
-				e.showIcon || y(p).icon ? (m(), a("span", R, [g(n.$slots, "icon", {}, () => [o("i", { class: d(["iconfont", `icon-${e.type}`]) }, null, 2)], !0)])) : i("", !0),
-				o("div", z, [o("span", B, [g(n.$slots, "default", {}, () => [s(v(e.title), 1)], !0)]), x.value ? (m(), a("p", V, [g(n.$slots, "description", {}, () => [s(v(e.description), 1)], !0)])) : i("", !0)]),
-				e.closable ? (m(), a("span", {
-					key: 1,
-					class: "db-alert__closebtn",
-					onClick: w
-				}, [g(n.$slots, "close", {}, () => [c(y(O), {
-					link: "",
-					icon: "close",
-					onClick: w
-				}, {
-					default: C(() => [s(v(e.closeText), 1)]),
-					_: 1
-				})], !0)])) : i("", !0)
-			], 2)) : i("", !0)]),
-			_: 3
-		}));
-	}
-}), [["__scopeId", "data-v-54b0171d"]]), U = [
-	O,
-	k,
-	I,
-	L,
-	H
-];
-function W(e) {
-	U.forEach((t) => e.component(t.name, t));
-}
-var G = { install: W };
-//#endregion
-export { H as DbAlert, O as DbButton, k as DbButtonGroup, I as DbInput, L as DbText, G as default, W as install };