grevlingui 0.1.44 → 0.2.0

package/dist/index.js

@@ -0,0 +1,583 @@
+import { Fragment as e, useEffect as t, useRef as n, useState as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import './index.css';//#region src/Library/Buttons/MenuButton.tsx
+var s = ({ open: e, setOpen: t, transitionTime: n = 300, stageDelay: s = 100, color: c, backgroundColor: l, styles: u, className: d = "" }) => {
+	let [f, p] = r(!1), m = ([t, r], i) => /* @__PURE__ */ a("path", {
+		style: {
+			transitionProperty: "d",
+			transitionDuration: `${n}ms`,
+			transitionDelay: e && i || !(e || i) ? "" : `${s}ms`
+		},
+		d: e ? r : t,
+		fill: c,
+		className: "mainShape"
+	}), h = /* @__PURE__ */ o("svg", {
+		className: "xburgerButton",
+		viewBox: "0 0 132.29166 132.29167",
+		height: "30",
+		width: "30",
+		children: [
+			m(f ? ["m 3.3906325,100.69908 125.3180175,0.008 -0.001,18.59162 -125.3180167,-0.008 z", "M 28.846694,14.020461 117.45992,106.30873 104.83715,119.455 16.223931,27.166726 Z"] : ["m 4.0263095,14.267981 125.3180305,-0.01822 0.003,18.591625 -125.3180367,0.01823 z", "M 16.175122,106.15278 104.78835,13.864516 117.41112,27.010786 28.79789,119.29905 Z"], !1),
+			m(["M 3.4245129,57.752314 H 128.74254 V 76.343939 H 3.4245129 Z", "M 67.752314,57.752314 H 67.752314 V 76.343939 H 67.752314 Z"], !0),
+			m(f ? ["m 4.0263095,14.267981 125.3180305,-0.01822 0.003,18.591625 -125.3180367,0.01823 z", "M 16.175122,106.15278 104.78835,13.864516 117.41112,27.010786 28.79789,119.29905 Z"] : ["m 3.3906325,100.69908 125.3180175,0.008 -0.001,18.59162 -125.3180167,-0.008 z", "M 28.846694,14.020461 117.45992,106.30873 104.83715,119.455 16.223931,27.166726 Z"], !1)
+		]
+	});
+	return /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("div", {
+		className: "thingy",
+		children: f
+	}), /* @__PURE__ */ a("button", {
+		className: `xburgerMenuButton styleOverride ${d}`,
+		onClick: () => {
+			e && p((e) => !e), t(!e);
+		},
+		style: {
+			...u,
+			backgroundColor: l
+		},
+		children: h
+	})] });
+}, c = ({ open: e, setOpen: t, transitionTime: n = 300, stageDelay: i = 100, color: s = "white", backgroundColor: c, styles: l, className: u = "", rounding: d = 7 }) => {
+	let [f] = r(Math.random()), p = e ? [0, 0] : [20, 35], m = (t, r) => /* @__PURE__ */ a("rect", {
+		style: {
+			transitionProperty: "x, width",
+			transitionDuration: `${n}ms, ${n}ms`,
+			transitionDelay: e ? "" : `${i}ms, ${i}ms`
+		},
+		x: r && e ? 40 : 0,
+		y: "41",
+		height: "18",
+		fill: s,
+		width: r && e ? 20 : 100,
+		transform: `rotate(${t} 50 50)`,
+		rx: d
+	}), h = (t, r) => /* @__PURE__ */ a("circle", {
+		style: {
+			transitionProperty: "r",
+			transitionDuration: `${n}ms`,
+			transitionDelay: e ? `${i}ms` : ""
+		},
+		fill: r ?? "black",
+		cx: "50",
+		cy: "50",
+		r: t
+	});
+	return /* @__PURE__ */ a("button", {
+		className: `settingsButton styleOverride ${u}`,
+		onClick: () => {
+			t(!e);
+		},
+		style: {
+			...l,
+			backgroundColor: c
+		},
+		children: /* @__PURE__ */ o("svg", {
+			viewBox: "0 0 100 100",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: [/* @__PURE__ */ o("mask", {
+				id: `gearMask${f}`,
+				children: [/* @__PURE__ */ a("rect", {
+					x: "0",
+					y: "0",
+					height: "100",
+					width: "100",
+					fill: "white"
+				}), h(p[0])]
+			}), /* @__PURE__ */ o("g", {
+				mask: `url(#gearMask${f})`,
+				id: "settingsButtonShapes",
+				children: [
+					m(0, !0),
+					m(45),
+					m(90, !0),
+					m(135),
+					h(p[1], s)
+				]
+			})]
+		})
+	});
+}, l = ({ children: t, onCloseClickOverride: n, shouldCloseOnClick: i, transitionTime: l = 300, zIndex: u = 2, color: d = "white", bgColor: f = "#333", menuBgColor: p, backdropColor: m = "#22222266", settings: h, renderButton: g, className: _ = "", fullSlider: v, fader: y, left: b }) => {
+	let [x, S] = r(!1), C;
+	C = g ? g(x, S, l, d, f) : /* @__PURE__ */ a(h ? c : s, {
+		className: `button ${b ? "left" : ""}`,
+		open: !!(x || n),
+		setOpen: (e) => {
+			n ? n() : S(e);
+		},
+		transitionTime: l,
+		stageDelay: l * .3,
+		color: d,
+		backgroundColor: f,
+		styles: {
+			zIndex: u + 2,
+			backgroundColor: f
+		}
+	});
+	let w, T = {
+		zIndex: u + 1,
+		color: d,
+		backgroundColor: p ?? f
+	}, E = (e) => {
+		i?.(e) && S(!1);
+	};
+	return w = y ? /* @__PURE__ */ a("div", {
+		className: `xburgerMenu fader ${x ? " show" : ""} ${_}`,
+		onClick: E,
+		style: {
+			...T,
+			transition: `opacity ${l}ms ease-out`
+		},
+		children: t
+	}) : /* @__PURE__ */ a("div", {
+		className: `xburgerMenu slider ${v ? "" : "partial"} ${x ? " show" : ""} ${b ? "left" : ""} ${_}`,
+		onClick: E,
+		style: {
+			...T,
+			transition: `left ${l}ms ease-out, right ${l}ms ease-out`
+		},
+		children: t
+	}), /* @__PURE__ */ o(e, { children: [
+		!v && !y && /* @__PURE__ */ a("div", {
+			className: `xburgerTouchOutsideSensor ${x ? " show" : ""}`,
+			onClick: () => S(!1),
+			style: {
+				transition: `opacity ${l}ms ease-out`,
+				zIndex: u,
+				backgroundColor: m
+			}
+		}),
+		C,
+		w
+	] });
+}, u = ({ onClick: e, color: t = "white", backgroundColor: n }) => {
+	let [i, s] = r(!1);
+	return /* @__PURE__ */ a("button", {
+		className: `resetButton ${i ? "spin" : ""}`,
+		onClick: () => {
+			e?.(), !i && (s(!0), setTimeout(() => {
+				s(!1);
+			}, 400));
+		},
+		style: { backgroundColor: n },
+		children: /* @__PURE__ */ o("svg", {
+			viewBox: "0 0 90 90",
+			xmlns: "http://www.w3.org/2000/svg",
+			fill: t,
+			style: i ? { animation: "spinCC 400ms linear" } : {},
+			children: [/* @__PURE__ */ a("path", { d: "M52.7646 16.0222C58.4958 17.5579 63.643 20.7586 67.5552 25.2196C71.4674 29.6806 73.9689 35.2015 74.7433 41.0842C75.5178 46.9669 74.5305 52.9471 71.9062 58.2686C69.2819 63.5902 65.1385 68.014 60 70.9807C54.8615 73.9475 48.9586 75.3238 43.0379 74.9357C37.1172 74.5477 31.4445 72.4126 26.7372 68.8006C22.0298 65.1885 18.4993 60.2617 16.5921 54.6432C14.6849 49.0246 14.4865 42.9667 16.0222 37.2354L26.5314 40.0513C25.5527 43.7041 25.6791 47.565 26.8946 51.1459C28.1102 54.7268 30.3603 57.8669 33.3604 60.169C36.3606 62.471 39.976 63.8318 43.7495 64.0791C47.523 64.3264 51.2851 63.4492 54.56 61.5584C57.835 59.6677 60.4757 56.8482 62.1483 53.4566C63.8208 50.065 64.4501 46.2535 63.9565 42.5043C63.4629 38.7551 61.8686 35.2364 59.3752 32.3932C56.8819 29.5501 53.6014 27.5101 49.9486 26.5314L52.7646 16.0222Z" }), /* @__PURE__ */ a("path", { d: "M60.8172 6.52009L38.3382 17.6037L49.0722 39.3736L57.9016 35.0202L51.3837 21.8011L65.0334 15.0709L60.8172 6.52009Z" })]
+		})
+	});
+}, d = ({ checked: e, setChecked: t, label: n, color: r = "white", v2: s, time: c = 200 }) => {
+	let l = (e, t) => ({
+		transition: `height ${c}ms, width ${c}ms ${e ? "ease-out" : "ease-in"}`,
+		transitionDelay: `${t * c / 5}ms`,
+		fill: r
+	});
+	return /* @__PURE__ */ a("div", {
+		className: `checkBoxWrapper ${e ? " checked" : ""}`,
+		style: { display: "inline-block" },
+		children: /* @__PURE__ */ o("div", {
+			className: `checkBox ${e ? " checked" : ""}`,
+			style: {
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "flex-start",
+				cursor: "default"
+			},
+			onClick: () => t(!e),
+			children: [/* @__PURE__ */ a("svg", {
+				viewBox: "0 0 132.29166 132.29167",
+				height: "35",
+				width: "35",
+				children: s ? /* @__PURE__ */ a("path", {
+					style: { transition: "d 250ms" },
+					d: e ? "m 11.120115,58.317116 7.120334,6.317823 6.026283,5.413084 26.863979,23.785172 0.08968,-0.0065 73.610599,-75.912909 0.19168,-0.208115 0.23209,-0.218791 0.25933,-0.293027 1.0137,-1.034147 -0.0487,17.386797 -74.521188,89.035537 -0.04318,-0.001 -40.699193,-50.569883 z" : "m 10.924959,17.515864 7.384214,-8.0947911 2.070114,7.0942151 0.0095,90.248492 89.714263,0.33483 0.54025,-90.469474 -90.263871,-0.113848 -2.070115,-7.0942151 96.390046,-0.033179 8.52678,11.0587641 -0.17363,92.233642 -9.78754,10.89971 -92.027722,-0.27385 -10.358292,-9.04231 z",
+					fill: r,
+					className: "mainShape"
+				}) : /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ o("mask", {
+					id: "checkMask",
+					children: [/* @__PURE__ */ a("rect", {
+						x: "-20",
+						y: "-20",
+						width: "200",
+						height: "200",
+						fill: "black"
+					}), /* @__PURE__ */ a("path", {
+						d: "M21.7652 124.127C18.2495 124.127 15.2398 122.875 12.7361 120.371C10.2325 117.868 8.98068 114.858 8.98068 111.342V21.8505C8.98068 18.3347 10.2325 15.3251 12.7361 12.8214C15.2398 10.3178 18.2495 9.06596 21.7652 9.06596H111.257C114.773 9.06596 117.782 10.3178 120.286 12.8214C122.79 15.3251 124.041 18.3347 124.041 21.8505V111.342C124.041 114.858 122.79 117.868 120.286 120.371C117.782 122.875 114.773 124.127 111.257 124.127H21.7652Z",
+						fill: "white"
+					})]
+				}), /* @__PURE__ */ o("g", {
+					mask: "url(#checkMask)",
+					className: "transformers",
+					children: [e ? /* @__PURE__ */ o(i, { children: [
+						/* @__PURE__ */ a("rect", {
+							style: l(!0, 0),
+							x: "72.3839",
+							y: "-31.2401",
+							width: "76.3103",
+							height: "88.4339",
+							transform: "rotate(50 72.3839 -31.2401)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!0, 1),
+							x: "71.5962",
+							y: "148.092",
+							width: "48.1662",
+							height: "103.342",
+							transform: "rotate(-130 71.5962 148.092)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!0, 2),
+							x: "35.078",
+							y: "136.193",
+							width: "65.7519",
+							height: "35.4406",
+							transform: "rotate(-130 35.078 136.193)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!0, 4),
+							x: "48.968",
+							y: "-28.5624",
+							width: "63.3354",
+							height: "93.5079",
+							transform: "rotate(50 48.968 -28.5624)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!0, 5),
+							x: "98.5041",
+							y: "2.19794",
+							width: "56.3159",
+							height: "27.3439",
+							transform: "rotate(50 98.5041 2.19794)"
+						})
+					] }) : /* @__PURE__ */ o(i, { children: [
+						/* @__PURE__ */ a("rect", {
+							style: l(!1, 2.6),
+							x: "72.3839",
+							y: "-31.2401",
+							width: "7.42665",
+							height: "88.4339",
+							transform: "rotate(50 72.3839 -31.2401)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!1, 2.3),
+							x: "71.5962",
+							y: "148.092",
+							width: "1.70323",
+							height: "103.342",
+							transform: "rotate(-130 71.5962 148.092)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!1, 1.5),
+							x: "35.078",
+							y: "136.193",
+							width: "65.7519",
+							height: "2.75196",
+							transform: "rotate(-130 35.078 136.193)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!1, .2),
+							x: "48.968",
+							y: "-28.5624",
+							width: "18.3253",
+							height: "93.5079",
+							transform: "rotate(50 48.968 -28.5624)"
+						}),
+						/* @__PURE__ */ a("rect", {
+							style: l(!1, 0),
+							x: "98.5041",
+							y: "2.19794",
+							width: "56.3159",
+							height: "1.80076",
+							transform: "rotate(50 98.5041 2.19794)"
+						})
+					] }), /* @__PURE__ */ a("path", {
+						d: "M21.7652 147.556C14.7876 147.556 -13.189 118.32 -13.189 111.342V21.8505C-13.189 14.8729 14.7876 -12.096 21.7652 -12.096H111.257C118.234 -12.096 141.928 14.8729 141.928 21.8505V111.342C141.928 118.32 118.234 147.556 111.257 147.556H21.7652ZM111.257 111.317V21.8505H21.7652V111.317C56.197 111.317 76.8251 111.317 111.257 111.317Z",
+						fill: r
+					})]
+				})] })
+			}), /* @__PURE__ */ a("span", {
+				style: {
+					marginLeft: "10px",
+					color: r
+				},
+				children: n
+			})]
+		})
+	});
+}, f = ({ active: e, text: t, className: n, color: r }) => {
+	let i = (e, t, n, r) => /* @__PURE__ */ a("circle", {
+		style: { transition: "r 300ms" },
+		cx: "67",
+		cy: "67",
+		r: e,
+		fill: r,
+		className: t,
+		mask: n
+	});
+	return /* @__PURE__ */ o("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "flex-start",
+			cursor: "default"
+		},
+		className: `radioButton ${e ? " active" : ""}`,
+		children: [/* @__PURE__ */ o("svg", {
+			className: `${n || ""}`,
+			viewBox: "0 0 132.29 132.29",
+			height: "35",
+			width: "35",
+			children: [
+				/* @__PURE__ */ o("mask", {
+					id: "mask",
+					children: [/* @__PURE__ */ a("rect", {
+						x: "0",
+						y: "0",
+						width: "200",
+						height: "200",
+						fill: "white"
+					}), i(55, "black", void 0, "#000")]
+				}),
+				i(65, "mainShape", "url(#mask)", r),
+				i(e ? 40 : 0, "mainShape", void 0, r)
+			]
+		}), /* @__PURE__ */ a("span", {
+			style: {
+				marginLeft: "10px",
+				color: r
+			},
+			children: t
+		})]
+	});
+}, p = ({ options: e, selected: t, onSelect: n, color: r }) => /* @__PURE__ */ a("div", {
+	className: "radioGroup",
+	children: e.map((e, i) => /* @__PURE__ */ a("div", { children: /* @__PURE__ */ a("div", {
+		onClick: () => n(e.key),
+		style: { display: "inline-block" },
+		children: /* @__PURE__ */ a(f, {
+			active: e.key === t,
+			text: e.label,
+			color: r
+		})
+	}) }, i))
+}), m = ({ value: e, setValue: n, min: i = 1, max: s = 10, size: c = 5, color: l = "white", numberBgColor: u = "#663399", selectorColor: d = "#1E90FF", timeout: f = 1e3, onOpenInput: p, closed: m, invert: h = !1, noFlick: g = !1 }) => {
+	let [_, v] = r(!1), [y, b] = r(!0), [x, S] = r(), [C, w] = r(), [T, E] = r(0), [D, O] = r(0), k = () => {
+		clearTimeout(x), v(!1), S(void 0), j();
+	};
+	t(() => {
+		m && k();
+	}, [m]);
+	let A = () => {
+		f && (clearTimeout(x), S(setTimeout(k, f)));
+	}, j = () => {
+		clearTimeout(C), w(setTimeout(() => {
+			b(!0), w(void 0);
+		}, 200));
+	}, M = `${c}rem`, N = `${c * .8}rem`, P = `-${c * .9}rem`, F = `${c * .1}rem`, I = `-${c / 3}rem`, L = {
+		height: N,
+		width: N,
+		backgroundColor: d,
+		right: F,
+		bottom: F
+	}, R = {
+		...L,
+		top: _ ? P : 0
+	}, z = {
+		...L,
+		bottom: _ ? P : 0
+	}, B = {
+		background: `radial-gradient(${u}FF, ${u}00, ${u}00)`,
+		left: I,
+		right: I,
+		top: P,
+		bottom: P
+	}, V = (e) => /* @__PURE__ */ a("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 -960 960 960",
+		fill: l,
+		children: e ? /* @__PURE__ */ a("path", { d: "m283-345-43-43 240-240 240 239-43 43-197-197-197 198Z" }) : /* @__PURE__ */ a("path", { d: "M480-345 240-585l43-43 197 198 197-197 43 43-240 239Z" })
+	}), H = (t, r) => () => {
+		let a = h ? -1 * t : t;
+		r || A();
+		let o = a + e;
+		o > s || o < i || n(o);
+	}, U = () => /* @__PURE__ */ o("div", {
+		className: `numberSelect_input ${_ ? "" : "numberSelect_input-hidden"}`,
+		children: [
+			/* @__PURE__ */ a("div", {
+				className: "numberSelect_increment numberSelect_add",
+				style: R,
+				onClick: H(1),
+				children: V(!0)
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "numberSelect_blur",
+				style: B
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "numberSelect_increment numberSelect_subtract",
+				style: z,
+				onClick: H(-1),
+				children: V()
+			})
+		]
+	}), W = (e) => e.touches[0].clientY, G = (e) => {
+		g || E(W(e));
+	}, K = (t) => {
+		if (g) return;
+		let n = T - W(t);
+		(i === e && !h || s === e && h) && n < 0 || (s === e && !h || i === e && h) && n > 0 || i === e && n < 0 || O(T - W(t));
+	}, q = () => {
+		g || _ || (Math.abs(D) > 30 && H(D > 0 ? 1 : -1, !0)(), O(0));
+	}, J = Math.min(Math.max(D, -30), 30) / 30, Y = 0, X = 0;
+	if (J !== 0) {
+		let e = Math.abs(J), t = `-${c / 5 * e}rem`;
+		J > 0 ? Y = t : X = t;
+	}
+	let Z = {
+		top: Y,
+		bottom: X
+	}, Q = Math.max(0, Math.abs(J) - .5) * 1.5;
+	return /* @__PURE__ */ o("div", {
+		onTouchStart: G,
+		onTouchMove: K,
+		onTouchEnd: q,
+		className: `numberSelect ${_ ? "numberSelect_editing" : ""} ${y ? "numberSelect_doneClosing" : ""}`,
+		children: [
+			/* @__PURE__ */ a("div", {
+				className: "plusMinus plus",
+				style: {
+					top: `-${c / 5}rem`,
+					opacity: J > 0 ? Q : 0,
+					height: `${c / 3}rem`
+				},
+				children: /* @__PURE__ */ a("svg", {
+					height: `${c / 4}rem`,
+					viewBox: "0 0 271 153",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ a("path", {
+						d: "M136.68 19.1619L17.4993 133.606H47.2944L136.68 64.9149L226.065 133.606H255.86L136.68 19.1619Z",
+						fill: l
+					})
+				})
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "plusMinus minus",
+				style: {
+					bottom: `-${c / 5}rem`,
+					opacity: J < 0 ? Q : 0,
+					height: `${c / 3}rem`
+				},
+				children: /* @__PURE__ */ a("svg", {
+					height: `${c / 4}rem`,
+					viewBox: "0 0 271 153",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ a("path", {
+						d: "M136.68 133.606L17.4993 19.1621H47.2944L136.68 87.8532L226.065 19.1621H255.86L136.68 133.606Z",
+						fill: l
+					})
+				})
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "swipeBlobContainer",
+				children: /* @__PURE__ */ a("div", {
+					className: "swipeBlob",
+					style: {
+						left: `${c * .02}rem`,
+						right: `${c * .02}rem`,
+						backgroundColor: u,
+						...Z
+					}
+				})
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "numberSelect_value",
+				onClick: () => {
+					g && (_ ? k() : (A(), p?.(), b(!1), v(!0)));
+				},
+				style: {
+					height: M,
+					width: M,
+					color: l,
+					backgroundColor: u,
+					fontSize: `${c / 2}rem`
+				},
+				children: e
+			}),
+			U()
+		]
+	});
+}, h = ({ children: e, styleOverride: r, startOnPane: i = 0 }) => {
+	let o = n(null);
+	t(() => {
+		let e = setTimeout(() => o.current?.scrollIntoView(), 1);
+		return () => clearTimeout(e);
+	}, []);
+	let s = (e, t) => /* @__PURE__ */ a("div", {
+		ref: (e) => {
+			i === t && (o.current = e);
+		},
+		className: "grevlingPaneViewPane",
+		children: e
+	}, `pane${t}`);
+	return /* @__PURE__ */ a("div", {
+		className: "grevlingPaneView",
+		style: r,
+		children: /* @__PURE__ */ a("div", {
+			className: "grevlingPaneViewScrollyContent",
+			children: Array.isArray(e) ? e.map(s) : s(e, 0)
+		})
+	});
+}, g = ({ color: e = "black", size: t = "10rem", speed: n = 5e3 }) => {
+	let r = (e) => ({
+		WebkitAnimation: `spin${e ? "CC" : ""} ${n}ms linear infinite`,
+		MozAnimation: `spin${e ? "CC" : ""} ${n}ms linear infinite`,
+		animation: `spin${e ? "CC" : ""} ${n}ms linear infinite`
+	});
+	return /* @__PURE__ */ o("svg", {
+		className: "grevloadinger",
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "-8.5 12.5 117 117",
+		height: t,
+		width: t,
+		style: r(),
+		children: [
+			/* @__PURE__ */ o("mask", {
+				id: "spinnyMask1",
+				children: [/* @__PURE__ */ a("rect", {
+					x: "-10",
+					y: "0",
+					width: "200",
+					height: "200",
+					fill: "white"
+				}), /* @__PURE__ */ a("polygon", {
+					points: "50 13.397, 100 100, 0 100",
+					fill: "black"
+				})]
+			}),
+			/* @__PURE__ */ a("circle", {
+				cx: "50",
+				cy: "71.1",
+				r: "58",
+				mask: "url(#spinnyMask1)",
+				fill: e
+			}),
+			/* @__PURE__ */ a("g", {
+				transform: "rotate(45 50 71)",
+				children: /* @__PURE__ */ a("rect", {
+					height: "40.8",
+					width: "40.8",
+					x: "29.6",
+					y: "50.6",
+					fill: e,
+					style: {
+						transformOrigin: "50px 71px",
+						...r(!0)
+					}
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { d as CheckBox, g as Loader, l as Menu, s as MenuButton, m as NumberSelect, h as PaneView, f as RadioButton, p as RadioGroup, u as ResetButton, c as SettingsButton };

package/package.json

@@ -1,15 +1,10 @@
 {
   "name": "grevlingui",
-  "version": "0.1.44",
-  "description": "GUI elements",
-  "module": "index.js",
-  "dependencies": {
-    "core-js": "^3.30.1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/sGrevling/gui"
-  },
+  "version": "0.2.0",
+  "description": "GUI elements for basic mobile web app stuff",
+  "type": "module",
+  "license": "MIT",
+  "author": "Sigve Grevling",
   "keywords": [
     "react",
     "gui",
@@ -17,11 +12,48 @@
     "menu",
     "buttons",
     "checkbox",
-    "toggle",
+    "radio",
+    "loader",
     "drawer",
-    "mobile"
+    "mobile",
+    "typescript"
   ],
-  "author": "Sigve Grevling",
-  "license": "MIT"
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build && tsc -p tsconfig.lib.json && node scripts/strip-css-imports.mjs dist",
+    "lint": "oxlint",
+    "preview": "vite preview",
+    "prepublishOnly": "npm run build",
+    "bap": "npm run build && npm publish --ignore-scripts"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^24.13.3",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.7",
+    "@vitejs/plugin-react": "^6.1.1",
+    "oxlint": "^1.81.0",
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "typescript": "~6.0.2",
+    "vite": "^8.3.0",
+    "vite-plugin-lib-inject-css": "^2.2.2"
+  }
 }
-