@sigx/lynx-daisyui 0.1.0

package/dist/index.js

@@ -0,0 +1,552 @@
+import { component as e, compound as t, signal as n } from "@sigx/lynx";
+import { jsx as r, jsxs as i } from "@sigx/lynx/jsx-runtime";
+//#region src/feedback/Loading.tsx
+var a = e(({ props: e }) => {
+	let t = () => {
+		let t = ["loading"];
+		return t.push(`loading-${e.type ?? "spinner"}`), e.size && t.push(`loading-${e.size}`), e.color && t.push(`text-${e.color}`), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("view", { class: t() });
+}), o = {
+	primary: "btn-primary",
+	secondary: "btn-secondary",
+	accent: "btn-accent",
+	info: "btn-info",
+	success: "btn-success",
+	warning: "btn-warning",
+	error: "btn-error",
+	ghost: "btn-ghost",
+	link: "btn-link",
+	neutral: "btn-neutral"
+}, s = {
+	xs: "btn-xs",
+	sm: "btn-sm",
+	md: "",
+	lg: "btn-lg",
+	xl: "btn-xl"
+}, c = e(({ props: e, slots: t, emit: n }) => {
+	let i = () => {
+		let t = ["btn"];
+		if (e.variant && t.push(o[e.variant]), e.size) {
+			let n = s[e.size];
+			n && t.push(n);
+		}
+		return e.outline && t.push("btn-outline"), e.soft && t.push("btn-soft"), e.wide && t.push("btn-wide"), e.loading && t.push("btn-loading"), e.block && t.push("btn-block"), e.circle && t.push("btn-circle"), e.square && t.push("btn-square"), e.active && t.push("btn-active"), e.disabled && t.push("btn-disabled"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: i(),
+		bindtap: () => {
+			!e.disabled && !e.loading && n("press");
+		},
+		children: e.loading ? /* @__PURE__ */ r(a, {
+			type: "spinner",
+			size: "sm"
+		}) : t.default?.()
+	});
+}), l = t(e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = ["card"];
+		return e.bordered && t.push("card-bordered"), e.compact && t.push("card-compact"), e.shadow === !0 ? t.push("shadow-md") : e.shadow === "sm" ? t.push("shadow-sm") : e.shadow === "md" ? t.push("shadow-md") : e.shadow === "lg" ? t.push("shadow-lg") : e.shadow === void 0 && t.push("shadow-md"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: n(),
+		children: t.default?.()
+	});
+}), {
+	Body: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+		class: `card-body${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	})),
+	Title: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("text", {
+		class: `card-title${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	})),
+	Actions: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+		class: `card-actions${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	}))
+});
+//#endregion
+//#region src/shared/styles.ts
+function u(e, t) {
+	if (e === void 0) return {};
+	if (typeof e == "number") return {
+		[`${t}Top`]: e,
+		[`${t}Right`]: e,
+		[`${t}Bottom`]: e,
+		[`${t}Left`]: e
+	};
+	let n = {};
+	return e.top === void 0 ? e.y !== void 0 && (n[`${t}Top`] = e.y) : n[`${t}Top`] = e.top, e.bottom === void 0 ? e.y !== void 0 && (n[`${t}Bottom`] = e.y) : n[`${t}Bottom`] = e.bottom, e.right === void 0 ? e.x !== void 0 && (n[`${t}Right`] = e.x) : n[`${t}Right`] = e.right, e.left === void 0 ? e.x !== void 0 && (n[`${t}Left`] = e.x) : n[`${t}Left`] = e.left, n;
+}
+function d(e) {
+	let t = {};
+	return e.width !== void 0 && (t.width = e.width), e.height !== void 0 && (t.height = e.height), e.flex !== void 0 && (t.flex = e.flex), e.background !== void 0 && (t.backgroundColor = e.background), e.borderRadius !== void 0 && (t.borderRadius = e.borderRadius), Object.assign(t, u(e.padding, "padding")), Object.assign(t, u(e.margin, "margin")), t;
+}
+//#endregion
+//#region src/layout/Row.tsx
+var f = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = {
+			display: "flex",
+			flexDirection: "row"
+		};
+		e.gap !== void 0 && (t.gap = e.gap), e.align && (t.alignItems = e.align), e.justify && (t.justifyContent = e.justify), e.wrap && (t.flexWrap = "wrap");
+		let n = d({
+			width: e.width,
+			height: e.height,
+			flex: e.flex,
+			background: e.background,
+			borderRadius: e.borderRadius,
+			padding: e.padding,
+			margin: e.margin
+		});
+		for (let e in n) t[e] = n[e];
+		return t;
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: e.class,
+		style: n(),
+		children: t.default?.()
+	});
+}), p = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = {
+			display: "flex",
+			flexDirection: "column"
+		};
+		e.gap !== void 0 && (t.gap = e.gap), e.align && (t.alignItems = e.align), e.justify && (t.justifyContent = e.justify), e.wrap && (t.flexWrap = "wrap");
+		let n = d({
+			width: e.width,
+			height: e.height,
+			flex: e.flex,
+			background: e.background,
+			borderRadius: e.borderRadius,
+			padding: e.padding,
+			margin: e.margin
+		});
+		for (let e in n) t[e] = n[e];
+		return t;
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: e.class,
+		style: n(),
+		children: t.default?.()
+	});
+}), m = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = {
+			display: "flex",
+			justifyContent: "center",
+			alignItems: "center"
+		}, n = d({
+			width: e.width,
+			height: e.height,
+			flex: e.flex,
+			background: e.background,
+			borderRadius: e.borderRadius
+		});
+		for (let e in n) t[e] = n[e];
+		return t;
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: e.class,
+		style: n(),
+		children: t.default?.()
+	});
+}), h = e(({ props: e }) => {
+	let t = () => e.size === void 0 ? { flex: 1 } : {
+		width: e.size,
+		height: e.size
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: e.class,
+		style: t()
+	});
+}), g = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = {};
+		return e.height !== void 0 && (t.height = e.height), e.width !== void 0 && (t.width = e.width), e.flex !== void 0 && (t.flex = e.flex), t;
+	};
+	return () => {
+		let i = e.direction ?? "vertical";
+		return /* @__PURE__ */ r("scroll-view", {
+			class: e.class,
+			style: n(),
+			"scroll-orientation": i,
+			"scroll-y": i === "vertical" ? !0 : void 0,
+			"scroll-x": i === "horizontal" ? !0 : void 0,
+			"show-scrollbar": e.showScrollbar,
+			bounces: e.bounces,
+			children: t.default?.()
+		});
+	};
+}), _ = e(({ props: e }) => {
+	let t = () => {
+		let t = [e.vertical ? "divider-vertical" : "divider"];
+		return e.class && t.push(e.class), t.join(" ");
+	}, n = () => {
+		let t = {};
+		return e.color && (t.backgroundColor = e.color), e.margin !== void 0 && (e.vertical ? (t.marginLeft = e.margin, t.marginRight = e.margin) : (t.marginTop = e.margin, t.marginBottom = e.margin)), t;
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: t(),
+		style: n()
+	});
+}), v = {
+	xs: "input-xs",
+	sm: "input-sm",
+	md: "",
+	lg: "input-lg"
+}, y = e(({ props: e }) => {
+	let t = () => {
+		let t = ["input"];
+		if (e.variant === "bordered" && t.push("input-bordered"), e.variant === "ghost" && t.push("input-ghost"), e.color && t.push(`input-${e.color}`), e.size) {
+			let n = v[e.size];
+			n && t.push(n);
+		}
+		return e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("input", {
+		class: t(),
+		placeholder: e.placeholder,
+		type: e.type ?? "text",
+		disabled: e.disabled,
+		model: e.model
+	});
+}), b = {
+	xs: 10,
+	sm: 16,
+	md: 20,
+	lg: 24
+}, x = e(({ props: e, emit: t }) => {
+	let n = () => {
+		let t = ["toggle"], n = e.size ?? "md";
+		return t.push(`toggle-${n}`), e.color && t.push(`toggle-${e.color}`), e.checked && t.push("toggle-checked"), e.disabled && t.push("toggle-disabled"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => {
+		let i = !!e.checked, a = e.size ?? "md", o = i ? b[a] : 0;
+		return /* @__PURE__ */ r("view", {
+			class: n(),
+			bindtap: () => {
+				e.disabled || t("change", !i);
+			},
+			children: /* @__PURE__ */ r("view", {
+				class: "toggle-thumb",
+				style: { transform: `translateX(${o}px)` }
+			})
+		});
+	};
+}), S = {
+	xs: 10,
+	sm: 12,
+	md: 14,
+	lg: 19
+}, C = e(({ props: e, emit: t }) => {
+	let n = () => {
+		let t = ["checkbox"], n = e.size ?? "md";
+		return n !== "md" && t.push(`checkbox-${n}`), e.color && t.push(`checkbox-${e.color}`), e.checked && t.push("checkbox-checked"), e.disabled && t.push("checkbox-disabled"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => {
+		let i = !!e.checked, a = e.size ?? "md";
+		return /* @__PURE__ */ r("view", {
+			class: n(),
+			bindtap: () => {
+				e.disabled || t("change", !i);
+			},
+			children: i ? /* @__PURE__ */ r("text", {
+				class: "checkbox-mark",
+				style: { fontSize: S[a] },
+				children: "✓"
+			}) : null
+		});
+	};
+}), w = e(({ props: e, emit: t }) => {
+	let a = n({ open: !1 }), o = () => {
+		let t = ["select"];
+		return e.variant === "bordered" && t.push("select-bordered"), e.variant === "ghost" && t.push("select-ghost"), e.color && t.push(`select-${e.color}`), e.size && t.push(`select-${e.size}`), e.class && t.push(e.class), t.join(" ");
+	}, s = () => {
+		let t = (e.options ?? []).find((t) => t.value === e.value);
+		return t ? t.label : e.placeholder ?? "Select...";
+	};
+	return () => /* @__PURE__ */ i("view", {
+		style: {
+			position: "relative",
+			opacity: e.disabled ? .5 : 1
+		},
+		children: [/* @__PURE__ */ i("view", {
+			class: o(),
+			bindtap: () => {
+				e.disabled || (a.open = !a.open);
+			},
+			children: [/* @__PURE__ */ r("text", { children: s() }), /* @__PURE__ */ r("view", {
+				style: { marginLeft: "auto" },
+				children: /* @__PURE__ */ r("text", { children: a.open ? "▲" : "▼" })
+			})]
+		}), a.open && !e.disabled && /* @__PURE__ */ r("view", {
+			class: "select-dropdown",
+			style: {
+				position: "absolute",
+				top: "100%",
+				left: 0,
+				right: 0,
+				zIndex: 10
+			},
+			children: (e.options ?? []).map((n) => /* @__PURE__ */ r("view", {
+				class: `select-option${n.value === e.value ? " select-option-active" : ""}`,
+				bindtap: () => {
+					t("change", n.value), a.open = !1;
+				},
+				children: /* @__PURE__ */ r("text", { children: n.label })
+			}))
+		})]
+	});
+}), T = e(({ props: e, emit: t }) => {
+	let n = () => {
+		let t = ["radio"];
+		return e.color && t.push(`radio-${e.color}`), e.size && t.push(`radio-${e.size}`), e.checked && t.push("radio-checked"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ i("view", {
+		style: {
+			flexDirection: "row",
+			alignItems: "center",
+			gap: 8,
+			opacity: e.disabled ? .5 : 1
+		},
+		bindtap: () => {
+			!e.disabled && e.value != null && t("select", e.value);
+		},
+		children: [/* @__PURE__ */ r("view", {
+			class: n(),
+			children: e.checked && /* @__PURE__ */ r("view", { class: "radio-mark" })
+		}), e.label && /* @__PURE__ */ r("text", { children: e.label })]
+	});
+}), E = t(e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+	class: e.class ?? "",
+	style: { gap: 8 },
+	children: t.default?.()
+})), { Item: T }), D = {
+	xs: "textarea-xs",
+	sm: "textarea-sm",
+	md: "",
+	lg: "textarea-lg"
+}, O = e(({ props: e }) => {
+	let t = () => {
+		let t = ["textarea"];
+		if (e.variant === "bordered" && t.push("textarea-bordered"), e.variant === "ghost" && t.push("textarea-ghost"), e.color && t.push(`textarea-${e.color}`), e.size) {
+			let n = D[e.size];
+			n && t.push(n);
+		}
+		return e.class && t.push(e.class), t.join(" ");
+	}, n = () => (e.rows ?? 3) * 20 + 16;
+	return () => /* @__PURE__ */ r("textarea", {
+		class: t(),
+		placeholder: e.placeholder,
+		disabled: e.disabled,
+		model: e.model,
+		style: { height: n() }
+	});
+}), k = e(({ props: e, slots: t }) => () => /* @__PURE__ */ i("view", {
+	class: ["form-control", e.class].filter(Boolean).join(" "),
+	style: { gap: 4 },
+	children: [
+		e.label && /* @__PURE__ */ r("view", {
+			class: "label",
+			children: /* @__PURE__ */ r("text", {
+				class: "label-text",
+				children: e.required ? `${e.label} *` : e.label
+			})
+		}),
+		t.default?.(),
+		e.error && /* @__PURE__ */ r("view", {
+			class: "label",
+			children: /* @__PURE__ */ r("text", {
+				class: "label-text-error",
+				children: e.error
+			})
+		})
+	]
+})), A = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = ["badge"];
+		return e.variant && t.push(`badge-${e.variant}`), e.size && t.push(`badge-${e.size}`), e.outline && t.push("badge-outline"), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: n(),
+		children: t.default?.()
+	});
+}), j = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = ["alert"];
+		return e.variant && t.push(`alert-${e.variant}`), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("view", {
+		class: n(),
+		children: t.default?.()
+	});
+}), M = e(({ props: e }) => {
+	let t = () => {
+		let t = ["progress"];
+		return e.color && t.push(`progress-${e.color}`), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => {
+		let n = e.max ?? 100, i = Math.min(Math.max((e.value ?? 0) / n, 0), 1) * 100;
+		return /* @__PURE__ */ r("view", {
+			class: t(),
+			children: /* @__PURE__ */ r("view", {
+				class: "progress-bar",
+				style: { width: `${i}%` }
+			})
+		});
+	};
+}), N = t(e(({ props: e, slots: t }) => () => e.open ? /* @__PURE__ */ r("view", {
+	class: "modal-overlay",
+	bindtap: () => {
+		e.onClose?.();
+	},
+	children: /* @__PURE__ */ r("view", {
+		class: `modal-box${e.class ? " " + e.class : ""}`,
+		bindtap: (e) => {
+			e?.stopPropagation?.();
+		},
+		children: t.default?.()
+	})
+}) : /* @__PURE__ */ r("view", { style: { display: "none" } })), {
+	Header: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+		class: `modal-header${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	})),
+	Body: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+		class: `modal-body${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	})),
+	Actions: e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+		class: `modal-action${e.class ? " " + e.class : ""}`,
+		children: t.default?.()
+	}))
+}), P = e(({ props: e }) => () => {
+	let t = {};
+	if (e.width != null && (t.width = e.width), e.height != null && (t.height = e.height), e.circle) {
+		let n = e.width ?? e.height ?? 48;
+		t.width = n, t.height = n, t.borderRadius = typeof n == "number" ? n / 2 : "50%";
+	}
+	return /* @__PURE__ */ r("view", {
+		class: `skeleton${e.class ? " " + e.class : ""}`,
+		style: t
+	});
+}), F = t(e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+	class: `steps${e.vertical ?? !1 ? " steps-vertical" : " steps-horizontal"}${e.class ? " " + e.class : ""}`,
+	children: t.default?.()
+})), { Step: e(({ props: e, slots: t }) => () => {
+	let n = e.color, a = n ? ` step-${n}` : "";
+	return /* @__PURE__ */ i("view", {
+		class: `step${a}${e.class ? " " + e.class : ""}`,
+		children: [/* @__PURE__ */ r("view", {
+			class: `step-indicator${a}`,
+			children: e.content ? /* @__PURE__ */ r("text", {
+				style: { fontSize: 14 },
+				children: e.content
+			}) : null
+		}), t.default?.()]
+	});
+}) }), I = t(e(({ props: e, slots: t }) => () => /* @__PURE__ */ r("view", {
+	class: `tabs${e.class ? " " + e.class : ""}`,
+	children: t.default?.()
+})), { Tab: e(({ props: e, slots: t }) => () => /* @__PURE__ */ i("view", {
+	class: `tab${e.active ?? !1 ? " tab-active" : ""}${e.class ? " " + e.class : ""}`,
+	bindtap: () => {
+		e.onPress?.();
+	},
+	children: [t.default?.(), e.label ? /* @__PURE__ */ r("text", { children: e.label }) : null]
+})) }), L = {
+	xs: 24,
+	sm: 32,
+	md: 48,
+	lg: 64,
+	xl: 96
+}, R = {
+	xs: 10,
+	sm: 12,
+	md: 18,
+	lg: 24,
+	xl: 36
+}, z = e(({ props: e }) => () => {
+	let t = e.size || "md", n = L[t], i = ["avatar"];
+	e.online && i.push("online"), e.offline && i.push("offline"), e.placeholder && !e.src && i.push("placeholder"), e.class && i.push(e.class);
+	let a = e.rounded, o = a === "full" || a === !0 ? n / 2 : 8, s = {
+		width: n,
+		height: n,
+		borderRadius: o,
+		overflow: "hidden",
+		alignItems: "center",
+		justifyContent: "center",
+		display: "flex"
+	};
+	return e.src ? /* @__PURE__ */ r("view", {
+		class: i.join(" "),
+		children: /* @__PURE__ */ r("view", {
+			style: s,
+			children: /* @__PURE__ */ r("image", {
+				src: e.src,
+				style: {
+					width: n,
+					height: n,
+					borderRadius: o
+				}
+			})
+		})
+	}) : /* @__PURE__ */ r("view", {
+		class: i.join(" "),
+		children: /* @__PURE__ */ r("view", {
+			class: "avatar-placeholder",
+			style: s,
+			children: /* @__PURE__ */ r("text", {
+				style: { fontSize: R[t] },
+				children: e.placeholder || "?"
+			})
+		})
+	});
+}), B = {
+	xs: "text-xs",
+	sm: "text-sm",
+	base: "text-base",
+	lg: "text-lg",
+	xl: "text-xl",
+	"2xl": "text-2xl",
+	"3xl": "text-3xl"
+}, V = {
+	light: "font-light",
+	normal: "font-normal",
+	medium: "font-medium",
+	semibold: "font-semibold",
+	bold: "font-bold"
+}, H = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = [];
+		return e.size && t.push(B[e.size]), e.weight && t.push(V[e.weight]), e.color && t.push(`text-${e.color}`), e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("text", {
+		class: n(),
+		children: t.default?.()
+	});
+}), U = {
+	1: "text-3xl font-bold",
+	2: "text-2xl font-bold",
+	3: "text-xl font-semibold",
+	4: "text-lg font-semibold",
+	5: "text-base font-semibold",
+	6: "text-sm font-semibold"
+}, W = e(({ props: e, slots: t }) => {
+	let n = () => {
+		let t = [U[e.level ?? 2], "text-base-content"];
+		return e.class && t.push(e.class), t.join(" ");
+	};
+	return () => /* @__PURE__ */ r("text", {
+		class: n(),
+		children: t.default?.()
+	});
+});
+//#endregion
+export { j as Alert, z as Avatar, A as Badge, c as Button, l as Card, m as Center, C as Checkbox, p as Col, _ as Divider, k as FormField, W as Heading, y as Input, a as Loading, N as Modal, M as Progress, E as Radio, f as Row, g as ScrollView, w as Select, P as Skeleton, h as Spacer, F as Steps, I as Tabs, H as Text, O as Textarea, x as Toggle };
+
+//# sourceMappingURL=index.js.map