summit-kit/dist/react-server.js

A React component library for building modern web applications with an earthy and outdoorsy flair.

import { _ as e, a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g, v as _, y as v } from "./Icon-x3Vo-tM0.js";
import { jsx as y, jsxs as b } from "react/jsx-runtime";
import { forwardRef as x, useId as S } from "react";
var C = {
	cols1: "qRVf7G_cols1",
	cols10: "qRVf7G_cols10",
	cols11: "qRVf7G_cols11",
	cols12: "qRVf7G_cols12",
	cols2: "qRVf7G_cols2",
	cols3: "qRVf7G_cols3",
	cols4: "qRVf7G_cols4",
	cols5: "qRVf7G_cols5",
	cols6: "qRVf7G_cols6",
	cols7: "qRVf7G_cols7",
	cols8: "qRVf7G_cols8",
	cols9: "qRVf7G_cols9",
	contentAround: "qRVf7G_contentAround",
	contentBetween: "qRVf7G_contentBetween",
	contentCenter: "qRVf7G_contentCenter",
	contentEnd: "qRVf7G_contentEnd",
	contentEvenly: "qRVf7G_contentEvenly",
	contentStart: "qRVf7G_contentStart",
	flex: "qRVf7G_flex",
	flexCol: "qRVf7G_flexCol",
	flexColReverse: "qRVf7G_flexColReverse",
	flexNowrap: "qRVf7G_flexNowrap",
	flexRow: "qRVf7G_flexRow",
	flexRowReverse: "qRVf7G_flexRowReverse",
	flexWrap: "qRVf7G_flexWrap",
	flexWrapReverse: "qRVf7G_flexWrapReverse",
	flowCol: "qRVf7G_flowCol",
	flowColDense: "qRVf7G_flowColDense",
	flowRow: "qRVf7G_flowRow",
	flowRowDense: "qRVf7G_flowRowDense",
	fullWidth: "qRVf7G_fullWidth",
	grid: "qRVf7G_grid",
	headerCell: "qRVf7G_headerCell",
	inlineFlex: "qRVf7G_inlineFlex",
	inlineGrid: "qRVf7G_inlineGrid",
	itemsBaseline: "qRVf7G_itemsBaseline",
	itemsCenter: "qRVf7G_itemsCenter",
	itemsEnd: "qRVf7G_itemsEnd",
	itemsStart: "qRVf7G_itemsStart",
	itemsStretch: "qRVf7G_itemsStretch",
	justifyAround: "qRVf7G_justifyAround",
	justifyBetween: "qRVf7G_justifyBetween",
	justifyCenter: "qRVf7G_justifyCenter",
	justifyEnd: "qRVf7G_justifyEnd",
	justifyEvenly: "qRVf7G_justifyEvenly",
	justifyStart: "qRVf7G_justifyStart",
	reading: "qRVf7G_reading",
	rows1: "qRVf7G_rows1",
	rows10: "qRVf7G_rows10",
	rows11: "qRVf7G_rows11",
	rows12: "qRVf7G_rows12",
	rows2: "qRVf7G_rows2",
	rows3: "qRVf7G_rows3",
	rows4: "qRVf7G_rows4",
	rows5: "qRVf7G_rows5",
	rows6: "qRVf7G_rows6",
	rows7: "qRVf7G_rows7",
	rows8: "qRVf7G_rows8",
	rows9: "qRVf7G_rows9",
	section: "qRVf7G_section"
}, w = v(C), T = x(({ as: e = "div", direction: t = "row", justify: n, items: r, align: i, content: o, wrap: s, gap: c, inline: l = !1, className: u, ...d }, f) => {
	let p = e, m = {
		row: w.flexRow,
		"row-reverse": w.flexRowReverse,
		col: w.flexCol,
		column: w.flexCol,
		"col-reverse": w.flexColReverse
	}, h = {
		start: w.justifyStart,
		"flex-start": w.justifyStart,
		end: w.justifyEnd,
		"flex-end": w.justifyEnd,
		center: w.justifyCenter,
		between: w.justifyBetween,
		"space-between": w.justifyBetween,
		around: w.justifyAround,
		"space-around": w.justifyAround,
		evenly: w.justifyEvenly,
		"space-evenly": w.justifyEvenly
	}, g = {
		start: w.itemsStart,
		"flex-start": w.itemsStart,
		end: w.itemsEnd,
		"flex-end": w.itemsEnd,
		center: w.itemsCenter,
		baseline: w.itemsBaseline,
		stretch: w.itemsStretch
	}, _ = {
		start: w.contentStart,
		"flex-start": w.contentStart,
		end: w.contentEnd,
		"flex-end": w.contentEnd,
		center: w.contentCenter,
		between: w.contentBetween,
		"space-between": w.contentBetween,
		around: w.contentAround,
		"space-around": w.contentAround,
		evenly: w.contentEvenly,
		"space-evenly": w.contentEvenly
	}, v = {
		wrap: w.flexWrap,
		"wrap-reverse": w.flexWrapReverse,
		nowrap: w.flexNowrap
	}, b = r ?? i, x = a(l ? w.inlineFlex : w.flex, m[t], n && h[n], b && g[b], o && _[o], s && v[s], u), { style: S, ...C } = d;
	return /* @__PURE__ */ y(p, {
		className: x,
		style: c == null ? S : {
			...S,
			gap: typeof c == "number" ? `${c}px` : c
		},
		...C
	});
});
T.displayName = "Flex";
//#endregion
//#region src/react/server/Areas/Grid.tsx
var E = v(C);
function D({ as: e = "div", className: t, cols: n, rows: r, flow: i, gap: o, rowGap: s, columnGap: c, inline: l = !1, fullWidth: u = !0, templateCols: d, templateRows: f, alignItems: p, justifyItems: m, children: h, ...g }) {
	let _ = e, v = {
		1: E.cols1,
		2: E.cols2,
		3: E.cols3,
		4: E.cols4,
		5: E.cols5,
		6: E.cols6,
		7: E.cols7,
		8: E.cols8,
		9: E.cols9,
		10: E.cols10,
		11: E.cols11,
		12: E.cols12
	}, b = {
		1: E.rows1,
		2: E.rows2,
		3: E.rows3,
		4: E.rows4,
		5: E.rows5,
		6: E.rows6,
		7: E.rows7,
		8: E.rows8,
		9: E.rows9,
		10: E.rows10,
		11: E.rows11,
		12: E.rows12
	}, x = {
		row: E.flowRow,
		col: E.flowCol,
		"row-dense": E.flowRowDense,
		"col-dense": E.flowColDense
	}, S = a(l ? E.inlineGrid : E.grid, n ? v[n] : null, r ? b[r] : null, i ? x[i] : null, u ? E.fullWidth : null, t), { style: C, ...w } = g;
	return /* @__PURE__ */ y(_, {
		className: S,
		style: {
			...C,
			...o == null ? {} : { gap: typeof o == "number" ? `${o}px` : o },
			...s == null ? {} : { rowGap: typeof s == "number" ? `${s}px` : s },
			...c == null ? {} : { columnGap: typeof c == "number" ? `${c}px` : c },
			...d ? { gridTemplateColumns: d } : {},
			...f ? { gridTemplateRows: f } : {},
			...p ? { alignItems: p } : {},
			...m ? { justifyItems: m } : {}
		},
		...w,
		children: h
	});
}
function O({ headers: e, className: t, cols: n, rows: r, flow: i, gap: a, rowGap: o, columnGap: s, inline: c, fullWidth: l, templateCols: u, templateRows: d, alignItems: f, justifyItems: p }) {
	return /* @__PURE__ */ y(D, {
		className: t,
		cols: n,
		rows: r,
		flow: i,
		gap: a,
		rowGap: o,
		columnGap: s,
		inline: c,
		fullWidth: l,
		templateCols: u,
		templateRows: d,
		alignItems: f,
		justifyItems: p,
		children: e.map((e) => /* @__PURE__ */ y("div", {
			className: E.headerCell,
			children: /* @__PURE__ */ y("strong", { children: e })
		}, e))
	});
}
function k({ children: e, className: t, cols: n, rows: r, flow: i, gap: a, rowGap: o, columnGap: s, inline: c, fullWidth: l, templateCols: u, templateRows: d, alignItems: f, justifyItems: p }) {
	return /* @__PURE__ */ y(D, {
		className: t,
		cols: n,
		rows: r,
		flow: i,
		gap: a,
		rowGap: o,
		columnGap: s,
		inline: c,
		fullWidth: l,
		templateCols: u,
		templateRows: d,
		alignItems: f,
		justifyItems: p,
		children: e
	});
}
//#endregion
//#region src/react/server/Areas/index.tsx
var A = (e) => /* @__PURE__ */ y("article", {
	className: C.reading,
	children: e.children
}), j = (e) => /* @__PURE__ */ y("section", {
	className: C.section,
	children: e.children
}), M = "X7vq6W_secondary", N = "X7vq6W_select", P = "X7vq6W_submit", F = {
	"form-field": "X7vq6W_form-field",
	"label-container": "X7vq6W_label-container",
	secondary: M,
	select: N,
	submit: P,
	"text-input": "X7vq6W_text-input"
}, I = v(F), L = ({ disabled: e = !1, onClick: t, classes: n, children: r, ...i }) => /* @__PURE__ */ y("button", {
	type: t ? "button" : "submit",
	onClick: t,
	disabled: e,
	className: a(I.submit, n),
	...i,
	children: r
}), R = ({ disabled: e = !1, onClick: t, classes: n, children: r, ...i }) => /* @__PURE__ */ y("button", {
	onClick: t,
	type: "button",
	disabled: e,
	className: a(I.secondary, n),
	...i,
	children: r
}), z = (e) => /* @__PURE__ */ y("form", {
	className: a(e.classes) || void 0,
	"aria-label": e["aria-label"],
	"aria-labelledby": e["aria-labelledby"],
	...e.onSubmit && { onSubmit: (t) => {
		e.onSubmit && (t.preventDefault(), e.onSubmit(t));
	} },
	...e.method && { method: e.method },
	...e.action && { action: e.action },
	children: e.children
}), B = v(F), V = (e) => {
	let { disabled: t = !1, required: n = !1 } = e, r = e.valueMissing || e.typeMismatch, i = r ? `${e.id}-error` : void 0;
	return /* @__PURE__ */ b("div", {
		className: a(B["form-field"], e.classes),
		children: [
			/* @__PURE__ */ y("div", {
				className: B["label-container"],
				children: /* @__PURE__ */ y("label", {
					className: B.label,
					htmlFor: e.id,
					children: e.label
				})
			}),
			/* @__PURE__ */ y("input", {
				id: e.id,
				name: e.id,
				className: B["text-input"],
				type: e.type,
				required: n,
				disabled: t,
				"aria-required": n || void 0,
				"aria-invalid": r ? !0 : void 0,
				"aria-describedby": i
			}),
			i && /* @__PURE__ */ y("span", {
				id: i,
				role: "alert",
				children: r
			})
		]
	});
}, H = v(F), U = x(({ className: e, label: t, labelClassName: n, containerClassName: r, invalid: i, descriptionId: o, errorId: s, id: c, options: l, children: u, ...d }, f) => {
	let p = a(H.select, e), m = S(), h = c ?? m, { "aria-describedby": g, ..._ } = d, v = [
		g,
		o,
		s
	].filter(Boolean).join(" ") || void 0;
	return /* @__PURE__ */ b(T, {
		className: r,
		direction: "col",
		gap: 10,
		children: [t ? /* @__PURE__ */ y("label", {
			htmlFor: h,
			className: n ?? H.label,
			children: t
		}) : null, /* @__PURE__ */ b("select", {
			ref: f,
			id: h,
			"aria-invalid": i || void 0,
			"aria-required": _.required ? !0 : void 0,
			"aria-describedby": v,
			className: p,
			..._,
			children: [l?.map((e) => /* @__PURE__ */ y("option", {
				value: e.value,
				disabled: e.disabled,
				children: e.label
			}, String(e.value))), u]
		})]
	});
});
U.displayName = "Select";
//#endregion
//#region src/react/server/Image/index.tsx
var W = (e) => {
	let { src: t, alt: n = "", width: r, ...i } = e;
	return /* @__PURE__ */ y("img", {
		src: t,
		alt: n,
		width: r,
		...i
	});
}, G = (e) => {
	let { src: t, alt: n, width: r, caption: i, ...a } = e;
	return /* @__PURE__ */ b("figure", { children: [/* @__PURE__ */ y(W, {
		src: t,
		alt: i ? "" : n,
		width: r,
		...a
	}), /* @__PURE__ */ y("figcaption", { children: i ?? n })] });
};
//#endregion
export { c as Code, G as Figure, T as Flex, z as Form, D as Grid, O as GridHeader, k as GridRow, p as H1, s as H2, t as H3, d as H4, m as H5, n as H6, h as Icon, W as Image, V as Input, g as Li, u as Link, r as Ol, i as P, L as PrimaryButton, f as Quote, A as Reading, R as SecondaryButton, j as Section, U as Select, l as Span, o as Ul, e as isHeadless, _ as setHeadless };

//# sourceMappingURL=react-server.js.map