@arkyn/components 3.0.1-beta.99 → 3.0.2

package/dist/modules/components/imageUpload/noFileContent/index.js

@@ -0,0 +1,38 @@
+import { Button as e } from "../../button/index.js";
+/* empty css       */
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/imageUpload/noFileContent/index.tsx
+function r(r) {
+	let { dropImageText: i, isLoading: a, acceptImage: o, handleSelectFile: s, selectImageButtonText: c, disabled: l } = r;
+	function u(e) {
+		if (l) return;
+		e.preventDefault();
+		let t = e.dataTransfer.files[0];
+		t && s(t);
+	}
+	function d() {
+		if (l) return;
+		let e = document.createElement("input");
+		e.type = "file", e.accept = o, e.onchange = (e) => {
+			let t = e.target.files?.[0];
+			t && s(t);
+		}, e.click();
+	}
+	return /* @__PURE__ */ n("div", {
+		onDrop: u,
+		className: "arkynImageUploadNoFileContent",
+		children: [/* @__PURE__ */ t(e, {
+			isLoading: a,
+			onClick: d,
+			variant: "ghost",
+			size: "sm",
+			type: "button",
+			disabled: l,
+			children: c
+		}), /* @__PURE__ */ t("p", { children: i })]
+	});
+}
+//#endregion
+export { r as NoFileContent };
+
+//# sourceMappingURL=index.js.map

package/dist/modules/components/imageUpload/noFileContent/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/imageUpload/noFileContent/index.tsx"],"sourcesContent":["import type { DragEvent } from \"react\";\n\nimport { Button } from \"../../button\";\nimport \"./styles.css\";\n\ntype NoFileContentProps = {\n\tdisabled: boolean;\n\tacceptImage: string;\n\tisLoading: boolean;\n\tselectImageButtonText: string;\n\tdropImageText: string;\n\thandleSelectFile: (file: File) => void;\n};\n\nfunction NoFileContent(props: NoFileContentProps) {\n\tconst {\n\t\tdropImageText,\n\t\tisLoading,\n\t\tacceptImage,\n\t\thandleSelectFile,\n\t\tselectImageButtonText,\n\t\tdisabled,\n\t} = props;\n\n\tfunction handleDrop(event: DragEvent<HTMLDivElement>) {\n\t\tif (disabled) return;\n\n\t\tevent.preventDefault();\n\t\tconst file = event.dataTransfer.files[0];\n\t\tif (file) handleSelectFile(file);\n\t}\n\n\tfunction handleClick() {\n\t\tif (disabled) return;\n\n\t\tconst input = document.createElement(\"input\");\n\n\t\tinput.type = \"file\";\n\t\tinput.accept = acceptImage;\n\n\t\tinput.onchange = (event) => {\n\t\t\tconst file = (event.target as HTMLInputElement).files?.[0];\n\t\t\tif (file) handleSelectFile(file);\n\t\t};\n\n\t\tinput.click();\n\t}\n\n\treturn (\n\t\t<div onDrop={handleDrop} className=\"arkynImageUploadNoFileContent\">\n\t\t\t<Button\n\t\t\t\tisLoading={isLoading}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tvariant=\"ghost\"\n\t\t\t\tsize=\"sm\"\n\t\t\t\ttype=\"button\"\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t{selectImageButtonText}\n\t\t\t</Button>\n\n\t\t\t<p>{dropImageText}</p>\n\t\t</div>\n\t);\n}\n\nexport { NoFileContent };\n"],"mappings":";;;;AAcA,SAAS,EAAc,GAA2B;CACjD,IAAM,EACL,kBACA,cACA,gBACA,qBACA,0BACA,gBACG;CAEJ,SAAS,EAAW,GAAkC;EACrD,IAAI,GAAU;EAEd,EAAM,eAAe;EACrB,IAAM,IAAO,EAAM,aAAa,MAAM;EACtC,AAAI,KAAM,EAAiB,CAAI;CAChC;CAEA,SAAS,IAAc;EACtB,IAAI,GAAU;EAEd,IAAM,IAAQ,SAAS,cAAc,OAAO;EAU5C,AARA,EAAM,OAAO,QACb,EAAM,SAAS,GAEf,EAAM,YAAY,MAAU;GAC3B,IAAM,IAAQ,EAAM,OAA4B,QAAQ;GACxD,AAAI,KAAM,EAAiB,CAAI;EAChC,GAEA,EAAM,MAAM;CACb;CAEA,OACC,kBAAC,OAAD;EAAK,QAAQ;EAAY,WAAU;YAAnC,CACC,kBAAC,GAAD;GACY;GACX,SAAS;GACT,SAAQ;GACR,MAAK;GACL,MAAK;GACK;aAET;EACM,CAAA,GAER,kBAAC,KAAD,EAAA,UAAI,EAAiB,CAAA,CACjB;;AAEP"}

package/dist/modules/components/imageUpload/noFileContent/styles.css

@@ -0,0 +1 @@
+@layer arkyn{.arkynImageUploadNoFileContent{flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;height:100%;display:flex}.arkynImageUploadNoFileContent>p{text-align:center;white-space:nowrap;color:var(--text-body,#52525b);padding:0 24px;font-size:12px;font-weight:400;line-height:12px}}

package/dist/modules/components/imageUpload/styles.css

@@ -0,0 +1,17 @@
+@layer arkyn{.arkynImageUpload{border-width:1px;border-color:var(--border,#e2e8f0);background:var(--input-background,#fafafa);border-radius:8px;outline:1px solid #0000;width:100%;max-width:475px;height:174px}.arkynImageUpload.hasImage{border-style:solid}.arkynImageUpload.noHasImage{border-style:dashed}.arkynImageUpload.hasError{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}}
+
+@layer arkyn{.arkynFieldError{color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:12px}}
+
+@layer arkyn{.arkynFieldLabel{color:var(--text-body,#52525b);font-size:14px;font-weight:600;line-height:19.07px}.arkynFieldLabel.asteriskTrue:before{content:"* ";text-align:left;color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:16.34px}}
+
+@layer arkyn{.arkynFieldWrapper{gap:6px;height:max-content;display:flex}.arkynFieldWrapper.horizontal{flex-direction:row;align-items:center}.arkynFieldWrapper.horizontalReverse{flex-direction:row-reverse;align-items:center;margin-right:auto}.arkynFieldWrapper.vertical{flex-direction:column;align-items:flex-start}}
+
+@layer arkyn{.arkynImageUploadHasFileContent{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:6px;justify-content:end;align-items:end;gap:8px;width:100%;height:100%;padding:6px;display:flex}}
+
+@layer arkyn{.arkynButton{background:0 0;border:1px solid #0000;outline:1px solid #0000;position:relative}.arkynButton:hover{cursor:pointer;filter:brightness(.95);transition:all .3s}html.dark .arkynButton:hover{cursor:pointer;filter:brightness(1.2)}.arkynButton:disabled{cursor:not-allowed;opacity:.5}.arkynButton .arkynButtonContent{white-space:nowrap;justify-content:center;align-items:center;display:flex}.arkynButton .arkynButtonSpinner{white-space:nowrap;opacity:0;justify-content:center;align-items:center;display:flex}.arkynButton.solid{color:var(--white,#fff)}.arkynButton.solid.primary{background-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynButton.solid.secondary{background-color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynButton.solid.danger{background-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynButton.solid.success{background-color:rgb(var(--spotlight-success,16, 185, 129))}.arkynButton.solid.warning{background-color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynButton.solid.info{background-color:rgb(var(--spotlight-info,14, 165, 233))}.arkynButton.outline{background-color:var(--background-underground,#fafafa);border-color:var(--border,#e2e8f0)}.arkynButton.outline.primary{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynButton.outline.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynButton.outline.danger{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynButton.outline.success{color:rgb(var(--spotlight-success,16, 185, 129))}.arkynButton.outline.warning{color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynButton.outline.info{color:rgb(var(--spotlight-info,14, 165, 233))}.arkynButton.ghost.primary{color:rgb(var(--spotlight-primary,17, 109, 220));background-color:rgb(var(--spotlight-primary-foreground,231, 240, 252))}.arkynButton.ghost.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139));background-color:rgb(var(--spotlight-secondary-foreground,250, 250, 250))}.arkynButton.ghost.danger{color:rgb(var(--spotlight-danger,244, 63, 94));background-color:rgb(var(--spotlight-danger-foreground,254, 236, 239))}.arkynButton.ghost.success{color:rgb(var(--spotlight-success,16, 185, 129));background-color:rgb(var(--spotlight-success-foreground,231, 248, 242))}.arkynButton.ghost.warning{color:rgb(var(--spotlight-warning,249, 115, 22));background-color:rgb(var(--spotlight-warning-foreground,254, 241, 232))}.arkynButton.ghost.info{color:rgb(var(--spotlight-info,14, 165, 233));background-color:rgb(var(--spotlight-info-foreground,231, 246, 253))}.arkynButton.invisible.primary{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynButton.invisible.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynButton.invisible.danger{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynButton.invisible.success{color:rgb(var(--spotlight-success,16, 185, 129))}.arkynButton.invisible.warning{color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynButton.invisible.info{color:rgb(var(--spotlight-info,14, 165, 233))}.arkynButton.lg{border-radius:8px;height:44px;padding:0 20px;font-size:14px;font-weight:600;line-height:14px}.arkynButton.lg .arkynButtonContent,.arkynButton.lg .arkynButtonSpinner{gap:16px}.arkynButton.md{border-radius:8px;gap:16px;height:40px;padding:0 16px;font-size:14px;font-weight:600;line-height:14px}.arkynButton.md .arkynButtonContent,.arkynButton.md .arkynButtonSpinner{gap:14px}.arkynButton.sm{border-radius:6px;height:32px;padding:0 16px;font-size:12px;font-weight:600;line-height:12px}.arkynButton.sm .arkynButtonContent,.arkynButton.sm .arkynButtonSpinner{gap:12px}.arkynButton.xs{border-radius:4px;height:24px;padding:0 16px;font-size:10px;font-weight:600;line-height:10px}.arkynButton.xs .arkynButtonContent,.arkynButton.xs .arkynButtonSpinner{gap:8px}.arkynButton .arkynButtonSpinner>svg{animation:2s linear infinite spin}.arkynButton.loadingTextFalse .arkynButtonSpinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.arkynButton.loadingTextTrue .arkynButtonSpinner{max-height:0}.arkynButton.loadingTrue .arkynButtonContent{opacity:0;max-height:0}.arkynButton.loadingTrue .arkynButtonSpinner{opacity:1;max-height:unset}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}
+
+@layer arkyn{.arkynIconButton{background:0 0;border:1px solid #0000;outline:1px solid #0000;position:relative}.arkynIconButton:hover{cursor:pointer;filter:brightness(.9);transition:all .15s ease-out}html.dark .arkynIconButton:hover{cursor:pointer;filter:brightness(1.2)}.arkynIconButton:disabled{cursor:not-allowed;opacity:.5}.arkynIconButtonContent{justify-content:center;align-items:center;display:flex}.arkynIconButton.solid{color:var(--white,#fff)}.arkynIconButton.solid.primary{background-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynIconButton.solid.secondary{background-color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynIconButton.solid.danger{background-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynIconButton.solid.success{background-color:rgb(var(--spotlight-success,16, 185, 129))}.arkynIconButton.solid.warning{background-color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynIconButton.solid.info{background-color:rgb(var(--spotlight-info,14, 165, 233))}.arkynIconButton.outline{background-color:var(--background-underground,#fafafa);border-color:var(--border,#e2e8f0)}.arkynIconButton.outline.primary{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynIconButton.outline.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynIconButton.outline.danger{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynIconButton.outline.success{color:rgb(var(--spotlight-success,16, 185, 129))}.arkynIconButton.outline.warning{color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynIconButton.outline.info{color:rgb(var(--spotlight-info,14, 165, 233))}.arkynIconButton.ghost:hover{filter:brightness(.8)}.arkynIconButton.ghost.primary{color:rgb(var(--spotlight-primary,17, 109, 220));background-color:rgb(var(--spotlight-primary-foreground,231, 240, 252))}.arkynIconButton.ghost.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139));background-color:rgb(var(--spotlight-secondary-foreground,250, 250, 250))}.arkynIconButton.ghost.danger{color:rgb(var(--spotlight-danger,244, 63, 94));background-color:rgb(var(--spotlight-danger-foreground,254, 236, 239))}.arkynIconButton.ghost.success{color:rgb(var(--spotlight-success,16, 185, 129));background-color:rgb(var(--spotlight-success-foreground,231, 248, 242))}.arkynIconButton.ghost.warning{color:rgb(var(--spotlight-warning,249, 115, 22));background-color:rgb(var(--spotlight-warning-foreground,254, 241, 232))}.arkynIconButton.ghost.info{color:rgb(var(--spotlight-info,14, 165, 233));background-color:rgb(var(--spotlight-info-foreground,231, 246, 253))}.arkynIconButton.invisible.primary{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynIconButton.invisible.secondary{color:rgb(var(--spotlight-secondary,100, 116, 139))}.arkynIconButton.invisible.danger{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynIconButton.invisible.success{color:rgb(var(--spotlight-success,16, 185, 129))}.arkynIconButton.invisible.warning{color:rgb(var(--spotlight-warning,249, 115, 22))}.arkynIconButton.invisible.info{color:rgb(var(--spotlight-info,14, 165, 233))}.arkynIconButton.lg{border-radius:6px;width:44px;height:44px}.arkynIconButton.md{border-radius:6px;width:40px;height:40px}.arkynIconButton.sm{border-radius:6px;width:32px;height:32px}.arkynIconButton.xs{border-radius:4px;width:24px;height:24px}.arkynIconButtonSpinner{opacity:0;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.arkynIconButtonSpinner>svg{animation:2s linear infinite spin}.arkynIconButton.loadingTrue .arkynIconButtonSpinner{opacity:1}.arkynIconButton.loadingTrue .arkynIconButtonContent{opacity:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}
+
+@layer arkyn{.arkynTooltip{display:block;position:relative}.arkynTooltipText{visibility:hidden;opacity:0;white-space:nowrap;color:var(--tooltip-text,#fafafa);background-color:var(--tooltip-background,#27272a);z-index:9999;border-radius:4px;justify-content:center;align-items:center;font-weight:400;transition:all .15s ease-out;display:flex;position:absolute;transform:translate(-50%,-50%)}.arkynTooltip.lg .arkynTooltipText{padding:8px 12px;font-size:14px;line-height:130%}.arkynTooltip.md .arkynTooltipText{padding:8px 12px;font-size:12px;line-height:130%}.arkynTooltip:hover .arkynTooltipText{opacity:1;visibility:visible}.arkynTooltip.top .arkynTooltipText{bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkynTooltip.top .arkynTooltipText:before{content:"";border-style:solid;border-color:var(--tooltip-background,#27272a) transparent;border-width:6px 6px 0;position:absolute;top:100%;bottom:20px;left:50%;transform:translate(-50%)}.arkynTooltip.left .arkynTooltipText{top:50%;right:calc(100% + 10px);transform:translateY(-50%)}.arkynTooltip.left .arkynTooltipText:before{content:"";border-style:solid;border-color:transparent var(--tooltip-background,#27272a);border-width:6px 0 6px 6px;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.arkynTooltip.right .arkynTooltipText{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.arkynTooltip.right .arkynTooltipText:before{content:"";border-style:solid;border-color:transparent var(--tooltip-background,#27272a);border-width:6px 6px 6px 0;position:absolute;top:50%;left:0;transform:translate(-100%,-50%)}.arkynTooltip.bottom .arkynTooltipText{top:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkynTooltip.bottom .arkynTooltipText:before{content:"";border-style:solid;border-color:var(--tooltip-background,#27272a) transparent;border-width:0 6px 6px;position:absolute;top:0;left:50%;transform:translate(-50%,-100%)}}
+
+@layer arkyn{.arkynImageUploadNoFileContent{flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;height:100%;display:flex}.arkynImageUploadNoFileContent>p{text-align:center;white-space:nowrap;color:var(--text-body,#52525b);padding:0 24px;font-size:12px;font-weight:400;line-height:12px}}

package/dist/modules/components/input/index.js

@@ -0,0 +1,95 @@
+import { useForm as e } from "../../hooks/useForm.js";
+import { IconRenderer as t } from "../../services/iconRenderer.js";
+import { FieldTemplate as n } from "../../services/fieldTemplate.js";
+/* empty css      */
+import { useId as r, useRef as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Loader2 as c } from "lucide-react";
+//#region src/components/input/index.tsx
+function l(l) {
+	let { name: u, disabled: d, title: f, style: p, variant: m = "solid", label: h, className: g = "", prefix: _, suffix: v, isLoading: y = !1, leftIcon: b, readOnly: x, onFocus: S, onBlur: C, unShowFieldTemplate: w = !1, errorMessage: T, showAsterisk: E, rightIcon: D, type: O = "text", size: k = "md", id: A, value: j, placeholder: M, orientation: N, ...P } = l, { fieldErrors: F } = e(), [I, L] = a(!1), R = i(null), z = r(), B = A || z, V = T || F?.[u], H = !!V, U = d || y, W = {
+		md: 20,
+		lg: 20
+	}[k], G = D ? "right" : "left", K = G === "left" && y, q = G === "right" && y;
+	function J() {
+		U || !R?.current || (L(!0), R.current.focus());
+	}
+	function Y(e) {
+		L(!0), S && S(e);
+	}
+	function X(e) {
+		L(!1), C && C(e);
+	}
+	return O === "hidden" ? /* @__PURE__ */ o("input", {
+		style: { display: "none" },
+		readOnly: !0,
+		type: "text",
+		ref: R,
+		...P
+	}) : /* @__PURE__ */ o(n, {
+		name: u,
+		label: h,
+		showAsterisk: E,
+		className: g,
+		errorMessage: V,
+		unShowFieldTemplate: w,
+		orientation: N,
+		children: /* @__PURE__ */ s("section", {
+			title: f,
+			style: p,
+			onClick: J,
+			className: `arkynInput ${_ ? "hasPrefix" : ""} ${d ? "disabled" : ""} ${v ? "hasSuffix" : ""} ${m} ${k} ${U || x || y ? "opacity" : ""} ${H ? "errored" : ""} ${I ? "focused" : ""}`,
+			children: [
+				/* @__PURE__ */ o(t, {
+					iconSize: W,
+					icon: _,
+					className: "prefix"
+				}),
+				/* @__PURE__ */ o(t, {
+					show: K,
+					iconSize: W,
+					className: "spinner",
+					icon: c
+				}),
+				/* @__PURE__ */ o(t, {
+					show: !y,
+					icon: b,
+					iconSize: W
+				}),
+				/* @__PURE__ */ o("input", {
+					disabled: U,
+					readOnly: x,
+					ref: R,
+					onFocus: Y,
+					onBlur: X,
+					type: O,
+					id: B,
+					name: u,
+					placeholder: U && j || M,
+					value: U ? void 0 : j,
+					...P
+				}),
+				/* @__PURE__ */ o(t, {
+					show: !y,
+					icon: D,
+					iconSize: W
+				}),
+				/* @__PURE__ */ o(t, {
+					show: q,
+					iconSize: W,
+					className: "spinner",
+					icon: c
+				}),
+				/* @__PURE__ */ o(t, {
+					iconSize: W,
+					icon: v,
+					className: "suffix"
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { l as Input };
+
+//# sourceMappingURL=index.js.map

package/dist/modules/components/input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/input/index.tsx"],"sourcesContent":["import { Loader2, type LucideIcon } from \"lucide-react\";\nimport {\n\ttype FocusEvent,\n\ttype InputHTMLAttributes,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport \"./style.css\";\n\ntype InputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"size\" | \"prefix\" | \"name\" | \"value\" | \"defaultValue\"\n> & {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/** Optional label text displayed above the input. */\n\tlabel?: string;\n\t/** Validation error message displayed below the input. */\n\terrorMessage?: string;\n\t/** Shows a spinner and disables the input during async operations. @default false */\n\tisLoading?: boolean;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/**\n\t * Input size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/** Text or icon rendered at the far left, outside the input area (e.g. `\"https://\"`). */\n\tprefix?: string | LucideIcon;\n\t/** Text or icon rendered at the far right, outside the input area (e.g. `\".com\"`). */\n\tsuffix?: string | LucideIcon;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontal\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n\t/** Lucide icon rendered inside the input on the left. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered inside the input on the right. */\n\trightIcon?: LucideIcon;\n\t/** Controlled value. */\n\tvalue?: string;\n\t/** Uncontrolled default value. */\n\tdefaultValue?: string;\n};\n\n/**\n * Input — text input field with label, validation, icons, prefix/suffix, and loading state.\n *\n * Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.label - Label text displayed above the input.\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a spinner and disables the input. Default: false\n * @param props.size - Input size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.prefix - Text or icon at the far left (outside the input).\n * @param props.suffix - Text or icon at the far right (outside the input).\n * @param props.leftIcon - Lucide icon inside the input on the left.\n * @param props.rightIcon - Lucide icon inside the input on the right.\n * @param props.showAsterisk - Appends `*` to the label.\n * @param props.orientation - Layout direction (`horizontal` | `vertical` | `horizontalReverse`). Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * **...Other valid HTML properties for `<input>`**\n *\n * @returns Input JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Basic\n * <Input name=\"username\" placeholder=\"Enter username\" />\n *\n * // With label and validation\n * <Input\n *   name=\"email\"\n *   label=\"Email Address\"\n *   type=\"email\"\n *   showAsterisk\n *   errorMessage=\"Please enter a valid email\"\n * />\n *\n * // With icons and loading state\n * <Input name=\"search\" label=\"Search\" leftIcon={SearchIcon} isLoading />\n *\n * // With prefix/suffix\n * <Input name=\"website\" label=\"Website\" prefix=\"https://\" suffix=\".com\" variant=\"outline\" />\n * ```\n */\n\nfunction Input(props: InputProps) {\n\tconst {\n\t\tname,\n\t\tdisabled,\n\t\ttitle,\n\t\tstyle,\n\t\tvariant = \"solid\",\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tprefix,\n\t\tsuffix,\n\t\tisLoading = false,\n\t\tleftIcon,\n\t\treadOnly,\n\t\tonFocus,\n\t\tonBlur,\n\t\tunShowFieldTemplate = false,\n\t\terrorMessage: baseErrorMessage,\n\t\tshowAsterisk,\n\t\trightIcon,\n\t\ttype = \"text\",\n\t\tsize = \"md\",\n\t\tid,\n\t\tvalue,\n\t\tplaceholder,\n\t\torientation,\n\t\t...rest\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled || isLoading;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst loadingPosition = rightIcon ? \"right\" : \"left\";\n\n\tconst showLeftSpinner = loadingPosition === \"left\" && isLoading;\n\tconst showRightSpinner = loadingPosition === \"right\" && isLoading;\n\n\tfunction handleSectionClick() {\n\t\tif (isDisabled || !inputRef?.current) return;\n\t\tsetIsFocused(true);\n\t\tinputRef.current.focus();\n\t}\n\n\tfunction handleFocus(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(true);\n\t\tif (onFocus) onFocus(e);\n\t}\n\n\tfunction handleBlur(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(false);\n\t\tif (onBlur) onBlur(e);\n\t}\n\n\tif (type === \"hidden\") {\n\t\treturn (\n\t\t\t<input\n\t\t\t\tstyle={{ display: \"none\" }}\n\t\t\t\treadOnly\n\t\t\t\ttype=\"text\"\n\t\t\t\tref={inputRef}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst hasPrefix = prefix ? \"hasPrefix\" : \"\";\n\tconst hasSuffix = suffix ? \"hasSuffix\" : \"\";\n\tconst errored = isError ? \"errored\" : \"\";\n\tconst opacity = isDisabled || readOnly || isLoading ? \"opacity\" : \"\";\n\tconst focused = isFocused ? \"focused\" : \"\";\n\tconst disabledClass = disabled ? \"disabled\" : \"\";\n\n\tconst className = `arkynInput ${hasPrefix} ${disabledClass} ${hasSuffix} ${variant} ${size} ${opacity} ${errored} ${focused}`;\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<section\n\t\t\t\ttitle={title}\n\t\t\t\tstyle={style}\n\t\t\t\tonClick={handleSectionClick}\n\t\t\t\tclassName={className}\n\t\t\t>\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showLeftSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={leftIcon} iconSize={iconSize} />\n\n\t\t\t\t<input\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\ttype={type}\n\t\t\t\t\tid={inputId}\n\t\t\t\t\tname={name}\n\t\t\t\t\tplaceholder={isDisabled ? value || placeholder : placeholder}\n\t\t\t\t\tvalue={isDisabled ? undefined : value}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={rightIcon} iconSize={iconSize} />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showRightSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={suffix} className=\"suffix\" />\n\t\t\t</section>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Input, type InputProps };\n"],"mappings":";;;;;;;;AA4GA,SAAS,EAAM,GAAmB;CACjC,IAAM,EACL,SACA,aACA,UACA,UACA,aAAU,SACV,UACA,WAAW,IAAmB,IAC9B,WACA,WACA,eAAY,IACZ,aACA,aACA,YACA,WACA,yBAAsB,IACtB,cAAc,GACd,iBACA,cACA,UAAO,QACP,UAAO,MACP,OACA,UACA,gBACA,gBACA,GAAG,MACA,GAEE,EAAE,mBAAgB,EAAQ,GAC1B,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAEhB,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAa,KAAY,GAGzB,IAAW;EADG,IAAI;EAAI,IAAI;CACf,EAAU,IAErB,IAAkB,IAAY,UAAU,QAExC,IAAkB,MAAoB,UAAU,GAChD,IAAmB,MAAoB,WAAW;CAExD,SAAS,IAAqB;EACzB,KAAc,CAAC,GAAU,YAC7B,EAAa,EAAI,GACjB,EAAS,QAAQ,MAAM;CACxB;CAEA,SAAS,EAAY,GAAiC;EAErD,AADA,EAAa,EAAI,GACb,KAAS,EAAQ,CAAC;CACvB;CAEA,SAAS,EAAW,GAAiC;EAEpD,AADA,EAAa,EAAK,GACd,KAAQ,EAAO,CAAC;CACrB;CAuBA,OArBI,MAAS,WAEX,kBAAC,SAAD;EACC,OAAO,EAAE,SAAS,OAAO;EACzB,UAAA;EACA,MAAK;EACL,KAAK;EACL,GAAI;CACJ,CAAA,IAcF,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,WAAD;GACQ;GACA;GACP,SAAS;GACE,WAAA,cAvBI,IAAS,cAAc,GAOC,GAFpB,IAAW,aAAa,GAEa,GANzC,IAAS,cAAc,GAM+B,GAAG,EAAQ,GAAG,EAAK,GAJ3E,KAAc,KAAY,IAAY,YAAY,GAIoC,GALtF,IAAU,YAAY,GAK2E,GAHjG,IAAY,YAAY;aAetC;IAMC,kBAAC,GAAD;KAAwB;KAAU,MAAM;KAAQ,WAAU;IAAU,CAAA;IAEpE,kBAAC,GAAD;KACC,MAAM;KACI;KACV,WAAU;KACV,MAAM;IACN,CAAA;IAED,kBAAC,GAAD;KAAc,MAAM,CAAC;KAAW,MAAM;KAAoB;IAAW,CAAA;IAErE,kBAAC,SAAD;KACC,UAAU;KACA;KACV,KAAK;KACL,SAAS;KACT,QAAQ;KACF;KACN,IAAI;KACE;KACN,aAAa,KAAa,KAAuB;KACjD,OAAO,IAAa,KAAA,IAAY;KAChC,GAAI;IACJ,CAAA;IAED,kBAAC,GAAD;KAAc,MAAM,CAAC;KAAW,MAAM;KAAqB;IAAW,CAAA;IAEtE,kBAAC,GAAD;KACC,MAAM;KACI;KACV,WAAU;KACV,MAAM;IACN,CAAA;IAED,kBAAC,GAAD;KAAwB;KAAU,MAAM;KAAQ,WAAU;IAAU,CAAA;GAC5D;;CACK,CAAA;AAEjB"}

package/dist/modules/components/input/style.css

@@ -0,0 +1 @@
+@layer arkyn{.arkynInput{border:1px solid #0000;border-radius:8px;outline:1px solid #0000;align-items:center;gap:8px;width:100%;padding:0 16px;display:flex;position:relative}.arkynInput:hover{cursor:text}.arkynInput input{width:100%;color:var(--text-heading,#09090b);background:0 0;border:none;outline:none;line-height:100%}.arkynInput input:disabled{-webkit-user-select:none;user-select:none}.arkynInput .prefix,.arkynInput .suffix{color:var(--text-body,#52525b);background:var(--border,#e2e8f0);justify-content:center;align-items:center;font-weight:400;line-height:100%;display:flex;position:absolute}.arkynInput .prefix{border-right:1px solid var(--border,#e2e8f0);border-radius:7px 0 0 7px;top:0;bottom:0;left:0}.arkynInput .suffix{border-left:1px solid var(--border,#e2e8f0);border-radius:0 7px 7px 0;top:0;bottom:0;right:0}.arkynInput input::placeholder{color:var(--text-muted,#a1a1aa);line-height:100%}.arkynInput svg{color:var(--text-muted,#a1a1aa)}.arkynInput.errored svg{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).focused svg{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.opacity{opacity:.5}.arkynInput.solid{border-color:var(--border,#e2e8f0);background-color:var(--input-background,#fafafa)}.arkynInput.solid.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).solid.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.outline{border-color:var(--border,#e2e8f0);background-color:var(--background-foreground,#fff)}.arkynInput.outline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).outline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.underline{border-top:none;border-left:none;border-right:none;border-color:var(--border,#e2e8f0);border-radius:0;outline:none}.arkynInput.underline .suffix,.arkynInput.underline .prefix{display:none}.arkynInput.underline:before{content:" ";background:0 0;height:1px;position:absolute;bottom:-2px;left:0;right:0}.arkynInput.underline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput.underline.errored:before{background:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).underline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput:not(.opacity).underline.focused:before{background:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.md input{min-height:38px;max-height:38px;font-size:14px;font-weight:400;line-height:14px}.arkynInput.md input::placeholder{font-size:14px;font-weight:400;line-height:14px}.arkynInput.md.hasPrefix{padding-left:60px}.arkynInput.md.hasSuffix{padding-right:60px}.arkynInput.md .prefix,.arkynInput.md .suffix{width:44px;height:38px;font-size:14px}.arkynInput.lg input{min-height:44px;max-height:44px;font-size:16px;font-weight:400;line-height:16px}.arkynInput.lg input::placeholder{font-size:16px;font-weight:400;line-height:16px}.arkynInput.lg .prefix,.arkynInput.lg .suffix{width:48px;height:44px;font-size:16px}.arkynInput.lg.hasPrefix{padding-left:64px}.arkynInput.lg.hasSuffix{padding-right:64px}.arkynInput .spinner{animation:2s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}

package/dist/modules/components/input/styles.css

@@ -0,0 +1,7 @@
+@layer arkyn{.arkynInput{border:1px solid #0000;border-radius:8px;outline:1px solid #0000;align-items:center;gap:8px;width:100%;padding:0 16px;display:flex;position:relative}.arkynInput:hover{cursor:text}.arkynInput input{width:100%;color:var(--text-heading,#09090b);background:0 0;border:none;outline:none;line-height:100%}.arkynInput input:disabled{-webkit-user-select:none;user-select:none}.arkynInput .prefix,.arkynInput .suffix{color:var(--text-body,#52525b);background:var(--border,#e2e8f0);justify-content:center;align-items:center;font-weight:400;line-height:100%;display:flex;position:absolute}.arkynInput .prefix{border-right:1px solid var(--border,#e2e8f0);border-radius:7px 0 0 7px;top:0;bottom:0;left:0}.arkynInput .suffix{border-left:1px solid var(--border,#e2e8f0);border-radius:0 7px 7px 0;top:0;bottom:0;right:0}.arkynInput input::placeholder{color:var(--text-muted,#a1a1aa);line-height:100%}.arkynInput svg{color:var(--text-muted,#a1a1aa)}.arkynInput.errored svg{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).focused svg{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.opacity{opacity:.5}.arkynInput.solid{border-color:var(--border,#e2e8f0);background-color:var(--input-background,#fafafa)}.arkynInput.solid.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).solid.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.outline{border-color:var(--border,#e2e8f0);background-color:var(--background-foreground,#fff)}.arkynInput.outline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).outline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.underline{border-top:none;border-left:none;border-right:none;border-color:var(--border,#e2e8f0);border-radius:0;outline:none}.arkynInput.underline .suffix,.arkynInput.underline .prefix{display:none}.arkynInput.underline:before{content:" ";background:0 0;height:1px;position:absolute;bottom:-2px;left:0;right:0}.arkynInput.underline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput.underline.errored:before{background:rgb(var(--spotlight-danger,244, 63, 94))}.arkynInput:not(.opacity).underline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput:not(.opacity).underline.focused:before{background:rgb(var(--spotlight-primary,17, 109, 220))}.arkynInput.md input{min-height:38px;max-height:38px;font-size:14px;font-weight:400;line-height:14px}.arkynInput.md input::placeholder{font-size:14px;font-weight:400;line-height:14px}.arkynInput.md.hasPrefix{padding-left:60px}.arkynInput.md.hasSuffix{padding-right:60px}.arkynInput.md .prefix,.arkynInput.md .suffix{width:44px;height:38px;font-size:14px}.arkynInput.lg input{min-height:44px;max-height:44px;font-size:16px;font-weight:400;line-height:16px}.arkynInput.lg input::placeholder{font-size:16px;font-weight:400;line-height:16px}.arkynInput.lg .prefix,.arkynInput.lg .suffix{width:48px;height:44px;font-size:16px}.arkynInput.lg.hasPrefix{padding-left:64px}.arkynInput.lg.hasSuffix{padding-right:64px}.arkynInput .spinner{animation:2s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}
+
+@layer arkyn{.arkynFieldError{color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:12px}}
+
+@layer arkyn{.arkynFieldLabel{color:var(--text-body,#52525b);font-size:14px;font-weight:600;line-height:19.07px}.arkynFieldLabel.asteriskTrue:before{content:"* ";text-align:left;color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:16.34px}}
+
+@layer arkyn{.arkynFieldWrapper{gap:6px;height:max-content;display:flex}.arkynFieldWrapper.horizontal{flex-direction:row;align-items:center}.arkynFieldWrapper.horizontalReverse{flex-direction:row-reverse;align-items:center;margin-right:auto}.arkynFieldWrapper.vertical{flex-direction:column;align-items:flex-start}}

package/dist/modules/components/mapView/index.js

@@ -0,0 +1,31 @@
+import { ClientOnly as e } from "../clientOnly.js";
+import { ClientMapView as t } from "./mapView.client.js";
+/* empty css       */
+import { jsx as n } from "react/jsx-runtime";
+import { MapPinned as r } from "lucide-react";
+//#region src/components/mapView/index.tsx
+function i({ className: e }) {
+	return /* @__PURE__ */ n("div", {
+		className: `arkynMapViewPinnedEmpty ${e}`,
+		children: /* @__PURE__ */ n(r, {})
+	});
+}
+function a(r) {
+	let { coordinates: a, zoom: o = 18, accessToken: s, className: c, onMarkerClick: l, ...u } = r;
+	if (!a) return /* @__PURE__ */ n(i, { className: c });
+	let d = Array.isArray(a) ? a : [a];
+	return d.length === 0 ? /* @__PURE__ */ n(i, { className: c }) : /* @__PURE__ */ n(e, {
+		fallback: /* @__PURE__ */ n(i, { className: c }),
+		children: () => /* @__PURE__ */ n(t, {
+			accessToken: s,
+			coordinates: d,
+			center: d[0],
+			onMarkerClick: l,
+			...u
+		})
+	});
+}
+//#endregion
+export { a as MapView };
+
+//# sourceMappingURL=index.js.map

package/dist/modules/components/mapView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/mapView/index.tsx"],"sourcesContent":["import { MapPinned } from \"lucide-react\";\nimport type { HtmlHTMLAttributes, ReactNode } from \"react\";\n\nimport { ClientMapView } from \"./mapView.client\";\nimport \"./styles.css\";\nimport { ClientOnly } from \"../clientOnly\";\n\n/** Data for a single map marker. */\ntype Coordinate = {\n\t/** Latitude of the marker position. */\n\tlat: number;\n\t/** Longitude of the marker position. */\n\tlng: number;\n\t/** Arbitrary data attached to the marker — available in `onMarkerClick`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tdata?: any;\n\t/** Custom React node rendered inside the marker popup on click. */\n\tpopUp?: ReactNode;\n};\n\ntype MapViewProps = {\n\t/** Mapbox GL public access token from your Mapbox account. Required. */\n\taccessToken: string;\n\t/** Initial zoom level. @default 18 */\n\tzoom?: number;\n\t/** Single coordinate or array of coordinates to display as markers. */\n\tcoordinates?: Coordinate | Coordinate[];\n\t/** Callback fired when the user clicks a marker. Receives the coordinate's data. */\n\tonMarkerClick?: (coordinate: Coordinate) => void;\n} & HtmlHTMLAttributes<HTMLDivElement>;\n\ntype EmptyMapProps = {\n\tclassName?: string;\n};\n\nfunction EmptyMap({ className }: EmptyMapProps) {\n\treturn (\n\t\t<div className={`arkynMapViewPinnedEmpty ${className}`}>\n\t\t\t<MapPinned />\n\t\t</div>\n\t);\n}\n\n/**\n * MapView — interactive Mapbox map with optional click-able markers.\n *\n * Renders client-side only (via `ClientOnly`). Displays a placeholder icon\n * when `coordinates` is absent or empty, or before the component hydrates.\n *\n * @param props.accessToken - Mapbox GL public access token. Required.\n * @param props.zoom - Initial zoom level. Default: 18\n * @param props.coordinates - Marker(s) to display on the map.\n * @param props.onMarkerClick - Callback fired when a marker is clicked.\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns MapView JSX element, or a placeholder icon when no coordinates are provided.\n *\n * @example\n * ```tsx\n * // Single marker\n * <MapView\n *   accessToken=\"pk.your-mapbox-token\"\n *   coordinates={{ lat: -23.5505, lng: -46.6333 }}\n * />\n *\n * // Multiple markers with popup and click handler\n * <MapView\n *   accessToken=\"pk.your-mapbox-token\"\n *   zoom={12}\n *   coordinates={[\n *     { lat: -23.55, lng: -46.63, data: { id: 1 }, popUp: <p>Store A</p> },\n *     { lat: -23.56, lng: -46.64, data: { id: 2 }, popUp: <p>Store B</p> },\n *   ]}\n *   onMarkerClick={(coord) => selectStore(coord.data.id)}\n * />\n * ```\n */\nfunction MapView(props: MapViewProps) {\n\tconst {\n\t\tcoordinates,\n\t\tzoom = 18,\n\t\taccessToken,\n\t\tclassName,\n\t\tonMarkerClick,\n\t\t...rest\n\t} = props;\n\n\tif (!coordinates) return <EmptyMap className={className} />;\n\n\tconst coordArray = Array.isArray(coordinates) ? coordinates : [coordinates];\n\tif (coordArray.length === 0) return <EmptyMap className={className} />;\n\n\treturn (\n\t\t<ClientOnly fallback={<EmptyMap className={className} />}>\n\t\t\t{() => (\n\t\t\t\t<ClientMapView\n\t\t\t\t\taccessToken={accessToken}\n\t\t\t\t\tcoordinates={coordArray}\n\t\t\t\t\tcenter={coordArray[0]}\n\t\t\t\t\tonMarkerClick={onMarkerClick}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</ClientOnly>\n\t);\n}\n\nexport { MapView };\n"],"mappings":";;;;;;AAmCA,SAAS,EAAS,EAAE,gBAA4B;CAC/C,OACC,kBAAC,OAAD;EAAK,WAAW,2BAA2B;YAC1C,kBAAC,GAAD,CAAY,CAAA;CACR,CAAA;AAEP;AAqCA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,gBACA,UAAO,IACP,gBACA,cACA,kBACA,GAAG,MACA;CAEJ,IAAI,CAAC,GAAa,OAAO,kBAAC,GAAD,EAAqB,aAAY,CAAA;CAE1D,IAAM,IAAa,MAAM,QAAQ,CAAW,IAAI,IAAc,CAAC,CAAW;CAG1E,OAFI,EAAW,WAAW,IAAU,kBAAC,GAAD,EAAqB,aAAY,CAAA,IAGpE,kBAAC,GAAD;EAAY,UAAU,kBAAC,GAAD,EAAqB,aAAY,CAAA;kBAErD,kBAAC,GAAD;GACc;GACb,aAAa;GACb,QAAQ,EAAW;GACJ;GACf,GAAI;EACJ,CAAA;CAES,CAAA;AAEd"}

package/dist/modules/components/mapView/mapView.client.js

@@ -0,0 +1,58 @@
+/* empty css       */
+import { useEffect as e, useRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+import r from "mapbox-gl";
+import { createRoot as i } from "react-dom/client";
+//#region src/components/mapView/mapView.client.tsx
+function a({ center: a, coordinates: o, onMarkerClick: s, accessToken: c, ...l }) {
+	let u = t(null), d = t(null), f = a || o[0];
+	return e(() => (r.accessToken = c, u.current = new r.Map({
+		container: d.current,
+		style: "mapbox://styles/mapbox/light-v11",
+		center: [f.lng, f.lat],
+		zoom: 13,
+		language: "pt-BR"
+	}), o.forEach((e) => {
+		let { lat: t, lng: n, popUp: a } = e, o = document.createElement("img");
+		o.className = "arkynMarker", o.src = "https://i.postimg.cc/mgKggjk7/Pin.png";
+		let c = new r.Marker(o).setLngLat([n, t]).addTo(u.current);
+		if (a) {
+			let e = document.createElement("div");
+			i(e).render(a);
+			let t = new r.Popup({
+				offset: 25,
+				closeButton: !1,
+				className: "arkynMapViewPopup"
+			}).setDOMContent(e);
+			c.setPopup(t);
+		}
+		o.addEventListener("click", () => {
+			s && s(e), u.current?.flyTo({
+				center: [n, t],
+				zoom: 15,
+				duration: 1200
+			}), c.togglePopup();
+		});
+	}), () => {
+		u.current?.remove();
+	}), [
+		f.lat,
+		s,
+		o.forEach,
+		f.lng,
+		c
+	]), /* @__PURE__ */ n("div", {
+		id: "map-container",
+		ref: d,
+		style: {
+			height: "100%",
+			width: "100%",
+			borderRadius: "8px"
+		},
+		...l
+	});
+}
+//#endregion
+export { a as ClientMapView };
+
+//# sourceMappingURL=mapView.client.js.map

package/dist/modules/components/mapView/mapView.client.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mapView.client.js","names":[],"sources":["../../../../src/components/mapView/mapView.client.tsx"],"sourcesContent":["import mapBoxGl, { type Map as MapboxMap } from \"mapbox-gl\";\nimport { createRoot } from \"react-dom/client\";\nimport \"./mapbox.css\";\nimport {\n\ttype HtmlHTMLAttributes,\n\ttype ReactNode,\n\tuseEffect,\n\tuseRef,\n} from \"react\";\n\ntype Coordinate = {\n\tlat: number;\n\tlng: number;\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tdata?: any;\n\tpopUp?: ReactNode;\n};\n\ntype ClientMapViewProps = {\n\tcenter?: Coordinate;\n\tcoordinates: Coordinate[];\n\tonMarkerClick?: (coordinate: Coordinate) => void;\n\taccessToken: string;\n} & HtmlHTMLAttributes<HTMLDivElement>;\n\nfunction ClientMapView({\n\tcenter: rawCenter,\n\tcoordinates,\n\tonMarkerClick,\n\taccessToken,\n\t...rest\n}: ClientMapViewProps) {\n\tconst mapRef = useRef<MapboxMap | null>(null);\n\tconst mapContainerRef = useRef<HTMLDivElement>(null);\n\n\tconst center = rawCenter ? rawCenter : coordinates[0];\n\n\tuseEffect(() => {\n\t\tmapBoxGl.accessToken = accessToken;\n\n\t\tmapRef.current = new mapBoxGl.Map({\n\t\t\tcontainer: mapContainerRef.current as HTMLDivElement,\n\t\t\tstyle: \"mapbox://styles/mapbox/light-v11\",\n\t\t\tcenter: [center.lng, center.lat],\n\t\t\tzoom: 13,\n\t\t\tlanguage: \"pt-BR\",\n\t\t});\n\n\t\tcoordinates.forEach((props) => {\n\t\t\tconst { lat, lng, popUp } = props;\n\t\t\tconst el = document.createElement(\"img\");\n\n\t\t\tel.className = \"arkynMarker\";\n\t\t\tel.src = \"https://i.postimg.cc/mgKggjk7/Pin.png\";\n\n\t\t\tconst marker = new mapBoxGl.Marker(el)\n\t\t\t\t.setLngLat([lng, lat])\n\t\t\t\t.addTo(mapRef.current as MapboxMap);\n\n\t\t\tif (popUp) {\n\t\t\t\tconst popupNode = document.createElement(\"div\");\n\t\t\t\tconst root = createRoot(popupNode);\n\t\t\t\troot.render(popUp);\n\n\t\t\t\tconst popup = new mapBoxGl.Popup({\n\t\t\t\t\toffset: 25,\n\t\t\t\t\tcloseButton: false,\n\t\t\t\t\tclassName: \"arkynMapViewPopup\",\n\t\t\t\t}).setDOMContent(popupNode);\n\n\t\t\t\tmarker.setPopup(popup);\n\t\t\t}\n\n\t\t\tel.addEventListener(\"click\", () => {\n\t\t\t\tif (onMarkerClick) onMarkerClick(props);\n\t\t\t\tmapRef.current?.flyTo({ center: [lng, lat], zoom: 15, duration: 1200 });\n\t\t\t\tmarker.togglePopup();\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tmapRef.current?.remove();\n\t\t};\n\t}, [center.lat, onMarkerClick, coordinates.forEach, center.lng, accessToken]);\n\n\treturn (\n\t\t<div\n\t\t\tid=\"map-container\"\n\t\t\tref={mapContainerRef}\n\t\t\tstyle={{ height: \"100%\", width: \"100%\", borderRadius: \"8px\" }}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n\nexport { ClientMapView };\n"],"mappings":";;;;;;AAyBA,SAAS,EAAc,EACtB,QAAQ,GACR,gBACA,kBACA,gBACA,GAAG,KACmB;CACtB,IAAM,IAAS,EAAyB,IAAI,GACtC,IAAkB,EAAuB,IAAI,GAE7C,IAAS,KAAwB,EAAY;CAkDnD,OAhDA,SACC,EAAS,cAAc,GAEvB,EAAO,UAAU,IAAI,EAAS,IAAI;EACjC,WAAW,EAAgB;EAC3B,OAAO;EACP,QAAQ,CAAC,EAAO,KAAK,EAAO,GAAG;EAC/B,MAAM;EACN,UAAU;CACX,CAAC,GAED,EAAY,SAAS,MAAU;EAC9B,IAAM,EAAE,QAAK,QAAK,aAAU,GACtB,IAAK,SAAS,cAAc,KAAK;EAGvC,AADA,EAAG,YAAY,eACf,EAAG,MAAM;EAET,IAAM,IAAS,IAAI,EAAS,OAAO,CAAE,CAAC,CACpC,UAAU,CAAC,GAAK,CAAG,CAAC,CAAC,CACrB,MAAM,EAAO,OAAoB;EAEnC,IAAI,GAAO;GACV,IAAM,IAAY,SAAS,cAAc,KAAK;GAE9C,EADwB,CACxB,CAAA,CAAK,OAAO,CAAK;GAEjB,IAAM,IAAQ,IAAI,EAAS,MAAM;IAChC,QAAQ;IACR,aAAa;IACb,WAAW;GACZ,CAAC,CAAC,CAAC,cAAc,CAAS;GAE1B,EAAO,SAAS,CAAK;EACtB;EAEA,EAAG,iBAAiB,eAAe;GAGlC,AAFI,KAAe,EAAc,CAAK,GACtC,EAAO,SAAS,MAAM;IAAE,QAAQ,CAAC,GAAK,CAAG;IAAG,MAAM;IAAI,UAAU;GAAK,CAAC,GACtE,EAAO,YAAY;EACpB,CAAC;CACF,CAAC,SAEY;EACZ,EAAO,SAAS,OAAO;CACxB,IACE;EAAC,EAAO;EAAK;EAAe,EAAY;EAAS,EAAO;EAAK;CAAW,CAAC,GAG3E,kBAAC,OAAD;EACC,IAAG;EACH,KAAK;EACL,OAAO;GAAE,QAAQ;GAAQ,OAAO;GAAQ,cAAc;EAAM;EAC5D,GAAI;CACJ,CAAA;AAEH"}

package/dist/modules/components/mapView/mapbox.css

@@ -0,0 +1 @@
+@layer arkyn{.mapboxgl-map{-webkit-tap-highlight-color:#0000;font:12px/20px Helvetica Neue,Arial,Helvetica,sans-serif;position:relative;overflow:hidden}.mapboxgl-canvas{position:absolute;top:0;left:0}.mapboxgl-map:-webkit-full-screen{width:100%;height:100%}.mapboxgl-canary{background-color:salmon}.mapboxgl-canvas-container.mapboxgl-interactive,.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass{cursor:grab;-webkit-user-select:none;user-select:none}.mapboxgl-canvas-container.mapboxgl-interactive.mapboxgl-track-pointer{cursor:pointer}.mapboxgl-canvas-container.mapboxgl-interactive:active,.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass:active{cursor:grabbing}.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate .mapboxgl-canvas{touch-action:pan-x pan-y}.mapboxgl-canvas-container.mapboxgl-touch-drag-pan,.mapboxgl-canvas-container.mapboxgl-touch-drag-pan .mapboxgl-canvas{touch-action:pinch-zoom}.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan,.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan .mapboxgl-canvas{touch-action:none}.mapboxgl-ctrl-bottom,.mapboxgl-ctrl-bottom-left,.mapboxgl-ctrl-bottom-right,.mapboxgl-ctrl-left,.mapboxgl-ctrl-right,.mapboxgl-ctrl-top,.mapboxgl-ctrl-top-left,.mapboxgl-ctrl-top-right{pointer-events:none;z-index:2;position:absolute}.mapboxgl-ctrl-top-left{top:0;left:0}.mapboxgl-ctrl-top{top:0;left:50%;transform:translate(-50%)}.mapboxgl-ctrl-top-right{top:0;right:0}.mapboxgl-ctrl-right{top:50%;right:0;transform:translateY(-50%)}.mapboxgl-ctrl-bottom-right{bottom:0;right:0}.mapboxgl-ctrl-bottom{bottom:0;left:50%;transform:translate(-50%)}.mapboxgl-ctrl-bottom-left{bottom:0;left:0}.mapboxgl-ctrl-left{top:50%;left:0;transform:translateY(-50%)}.mapboxgl-ctrl{clear:both;pointer-events:auto;transform:translate(0)}.mapboxgl-ctrl-top-left .mapboxgl-ctrl{float:left;margin:10px 0 0 10px}.mapboxgl-ctrl-top .mapboxgl-ctrl{float:left;margin:10px 0}.mapboxgl-ctrl-top-right .mapboxgl-ctrl{float:right;margin:10px 10px 0 0}.mapboxgl-ctrl-bottom-right .mapboxgl-ctrl,.mapboxgl-ctrl-right .mapboxgl-ctrl{float:right;margin:0 10px 10px 0}.mapboxgl-ctrl-bottom .mapboxgl-ctrl{float:left;margin:10px 0}.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl,.mapboxgl-ctrl-left .mapboxgl-ctrl{float:left;margin:0 0 10px 10px}.mapboxgl-ctrl-group{background:#fff;border-radius:4px}.mapboxgl-ctrl-group:not(:empty){box-shadow:0 0 0 2px #0000001a}@media (-ms-high-contrast:active){.mapboxgl-ctrl-group:not(:empty){box-shadow:0 0 0 2px buttontext}}.mapboxgl-ctrl-group button{background-color:initial;box-sizing:border-box;cursor:pointer;border:0;outline:none;width:32px;height:32px;padding:0;display:block;overflow:hidden}.mapboxgl-ctrl-group button+button{border-top:1px solid #ddd}.mapboxgl-ctrl button .mapboxgl-ctrl-icon{background-position:50%;background-repeat:no-repeat;width:100%;height:100%;display:block}@media (-ms-high-contrast:active){.mapboxgl-ctrl-icon{background-color:initial}.mapboxgl-ctrl-group button+button{border-top:1px solid buttontext}}.mapboxgl-ctrl-attrib-button:focus,.mapboxgl-ctrl-group button:focus{box-shadow:0 0 2px 2px #0096ff}.mapboxgl-ctrl button:disabled{cursor:not-allowed}.mapboxgl-ctrl button:disabled .mapboxgl-ctrl-icon{opacity:.25}.mapboxgl-ctrl-group button:first-child{border-radius:4px 4px 0 0}.mapboxgl-ctrl-group button:last-child{border-radius:0 0 4px 4px}.mapboxgl-ctrl-group button:only-child{border-radius:inherit}.mapboxgl-ctrl button:not(:disabled):hover{background-color:#eee}.mapboxgl-ctrl-group button:focus:focus-visible{box-shadow:0 0 2px 2px #0096ff}.mapboxgl-ctrl-group button:focus:not(:focus-visible){box-shadow:none}.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E")}@media (-ms-high-contrast:active){.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E")}}.mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E")}@media (-ms-high-contrast:active){.mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){.mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E")}}.mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E")}@media (-ms-high-contrast:active){.mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23999'/%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){.mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E")}}.mapboxgl-ctrl button.mapboxgl-ctrl-arrow-up .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 11.7071C4.68342 12.0976 5.31658 12.0976 5.70711 11.7071L9 8.41421L12.2929 11.7071C12.6834 12.0976 13.3166 12.0976 13.7071 11.7071C14.0976 11.3166 14.0976 10.6834 13.7071 10.2929L9.70711 6.29289C9.31658 5.90237 8.68342 5.90237 8.29289 6.29289L4.29289 10.2929C3.90237 10.6834 3.90237 11.3166 4.29289 11.7071Z' fill='%23333333'/%3E%3C/svg%3E");background-size:18px 18px}.mapboxgl-ctrl button.mapboxgl-ctrl-arrow-down .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 6.29289C4.68342 5.90237 5.31658 5.90237 5.70711 6.29289L9 9.58579L12.2929 6.29289C12.6834 5.90237 13.3166 5.90237 13.7071 6.29289C14.0976 6.68342 14.0976 7.31658 13.7071 7.70711L9.70711 11.7071C9.31658 12.0976 8.68342 12.0976 8.29289 11.7071L4.29289 7.70711C3.90237 7.31658 3.90237 6.68342 4.29289 6.29289Z' fill='%23333333'/%3E%3C/svg%3E");background-size:18px 18px}.mapboxgl-ctrl button.mapboxgl-ctrl-indoor-toggle .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.0017 3.0017L4.0017 15.0017L10.0017 15.0017V12.0017H12.0017V15.0017H14.0017L14.0017 3.0017C14.0097 2.86829 13.9894 2.73469 13.9419 2.60973C13.8945 2.48477 13.8211 2.37129 13.7266 2.27678C13.6321 2.18228 13.5186 2.10889 13.3937 2.06147C13.2687 2.01405 13.1351 1.99368 13.0017 2.0017L5.0017 2.0017C4.86829 1.99368 4.73469 2.01405 4.60973 2.06147C4.48477 2.10889 4.37129 2.18228 4.27678 2.27678C4.18228 2.37129 4.10889 2.48477 4.06147 2.60973C4.01405 2.73469 3.99368 2.86829 4.0017 3.0017ZM8.0017 14.0017H6.0017V12.0017H8.0017V14.0017ZM8.0017 10.0017H6.0017L6.0017 8.0017H8.0017V10.0017ZM8.0017 6.0017L6.0017 6.0017V4.0017H8.0017V6.0017ZM12.0017 10.0017H10.0017V8.0017H12.0017V10.0017ZM12.0017 6.0017H10.0017V4.0017L12.0017 4.0017V6.0017Z' fill='%23333333'/%3E%3C/svg%3E");background-size:18px 18px}@media (-ms-high-contrast:active){.mapboxgl-ctrl button.mapboxgl-ctrl-indoor-toggle .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.0017 3.0017L4.0017 15.0017L10.0017 15.0017V12.0017H12.0017V15.0017H14.0017L14.0017 3.0017C14.0097 2.86829 13.9894 2.73469 13.9419 2.60973C13.8945 2.48477 13.8211 2.37129 13.7266 2.27678C13.6321 2.18228 13.5186 2.10889 13.3937 2.06147C13.2687 2.01405 13.1351 1.99368 13.0017 2.0017L5.0017 2.0017C4.86829 1.99368 4.73469 2.01405 4.60973 2.06147C4.48477 2.10889 4.37129 2.18228 4.27678 2.27678C4.18228 2.37129 4.10889 2.48477 4.06147 2.60973C4.01405 2.73469 3.99368 2.86829 4.0017 3.0017ZM8.0017 14.0017H6.0017V12.0017H8.0017V14.0017ZM8.0017 10.0017H6.0017L6.0017 8.0017H8.0017V10.0017ZM8.0017 6.0017L6.0017 6.0017V4.0017H8.0017V6.0017ZM12.0017 10.0017H10.0017V8.0017H12.0017V10.0017ZM12.0017 6.0017H10.0017V4.0017L12.0017 4.0017V6.0017Z' fill='%23333333'/%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){.mapboxgl-ctrl button.mapboxgl-ctrl-indoor-toggle .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23000' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.0017 3.0017L4.0017 15.0017L10.0017 15.0017V12.0017H12.0017V15.0017H14.0017L14.0017 3.0017C14.0097 2.86829 13.9894 2.73469 13.9419 2.60973C13.8945 2.48477 13.8211 2.37129 13.7266 2.27678C13.6321 2.18228 13.5186 2.10889 13.3937 2.06147C13.2687 2.01405 13.1351 1.99368 13.0017 2.0017L5.0017 2.0017C4.86829 1.99368 4.73469 2.01405 4.60973 2.06147C4.48477 2.10889 4.37129 2.18228 4.27678 2.27678C4.18228 2.37129 4.10889 2.48477 4.06147 2.60973C4.01405 2.73469 3.99368 2.86829 4.0017 3.0017ZM8.0017 14.0017H6.0017V12.0017H8.0017V14.0017ZM8.0017 10.0017H6.0017L6.0017 8.0017H8.0017V10.0017ZM8.0017 6.0017L6.0017 6.0017V4.0017H8.0017V6.0017ZM12.0017 10.0017H10.0017V8.0017H12.0017V10.0017ZM12.0017 6.0017H10.0017V4.0017L12.0017 4.0017V6.0017Z' fill='%23333333'/%3E%3C/svg%3E")}}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23aaa'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-waiting .mapboxgl-ctrl-icon{animation:2s linear infinite mapboxgl-spin}@media (-ms-high-contrast:active){.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23999'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23000'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E")}.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23666'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E")}}@keyframes mapboxgl-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}a.mapboxgl-ctrl-logo{cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='0.3' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='0.9' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E");background-repeat:no-repeat;width:88px;height:23px;margin:0 0 -4px -4px;display:block;overflow:hidden}a.mapboxgl-ctrl-logo.mapboxgl-compact{width:23px}@media (-ms-high-contrast:active){a.mapboxgl-ctrl-logo{background-color:initial;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E")}}@media (-ms-high-contrast:black-on-white){a.mapboxgl-ctrl-logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23fff' stroke-width='3' fill='%23fff'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23000'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E")}}.mapboxgl-ctrl.mapboxgl-ctrl-attrib{background-color:#ffffff80;margin:0;padding:0 5px}@media screen{.mapboxgl-ctrl-attrib.mapboxgl-compact{box-sizing:initial;background-color:#fff;border-radius:12px;min-height:20px;margin:10px;padding:2px 24px 2px 0;position:relative}.mapboxgl-ctrl-attrib.mapboxgl-compact-show{visibility:visible;padding:2px 28px 2px 8px}.mapboxgl-ctrl-bottom-left>.mapboxgl-ctrl-attrib.mapboxgl-compact-show,.mapboxgl-ctrl-left>.mapboxgl-ctrl-attrib.mapboxgl-compact-show,.mapboxgl-ctrl-top-left>.mapboxgl-ctrl-attrib.mapboxgl-compact-show{border-radius:12px;padding:2px 8px 2px 28px}.mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner{display:none}.mapboxgl-ctrl-attrib-button{box-sizing:border-box;cursor:pointer;background-color:#ffffff80;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");border:0;border-radius:12px;outline:none;width:24px;height:24px;display:none;position:absolute;top:0;right:0}.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-attrib-button,.mapboxgl-ctrl-left .mapboxgl-ctrl-attrib-button,.mapboxgl-ctrl-top-left .mapboxgl-ctrl-attrib-button{left:0}.mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button,.mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-inner{display:block}.mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-button{background-color:#0000000d}.mapboxgl-ctrl-bottom-right>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{bottom:0;right:0}.mapboxgl-ctrl-right>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{right:0}.mapboxgl-ctrl-top-right>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{top:0;right:0}.mapboxgl-ctrl-top-left>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{top:0;left:0}.mapboxgl-ctrl-bottom-left>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{bottom:0;left:0}.mapboxgl-ctrl-left>.mapboxgl-ctrl-attrib.mapboxgl-compact:after{left:0}}@media screen and (-ms-high-contrast:active){.mapboxgl-ctrl-attrib.mapboxgl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' fill='%23fff'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}@media screen and (-ms-high-contrast:black-on-white){.mapboxgl-ctrl-attrib.mapboxgl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}.mapboxgl-ctrl-attrib a{color:#000000bf;text-decoration:none}.mapboxgl-ctrl-attrib a:hover{color:inherit;text-decoration:underline}.mapboxgl-ctrl-attrib .mapbox-improve-map{margin-left:2px;font-weight:700}.mapboxgl-attrib-empty{display:none}.mapboxgl-ctrl-scale{box-sizing:border-box;color:#333;white-space:nowrap;background-color:#ffffffbf;border:2px solid #333;border-top:#333;padding:0 5px;font-size:10px}.mapboxgl-popup{pointer-events:none;will-change:transform;display:flex;position:absolute;top:0;left:0}.mapboxgl-popup-anchor-top,.mapboxgl-popup-anchor-top-left,.mapboxgl-popup-anchor-top-right{flex-direction:column}.mapboxgl-popup-anchor-bottom,.mapboxgl-popup-anchor-bottom-left,.mapboxgl-popup-anchor-bottom-right{flex-direction:column-reverse}.mapboxgl-popup-anchor-left{flex-direction:row}.mapboxgl-popup-anchor-right{flex-direction:row-reverse}.mapboxgl-popup-tip{z-index:1;border:10px solid #0000;width:0;height:0}.mapboxgl-popup-anchor-top .mapboxgl-popup-tip{border-top:none;border-bottom-color:#fff;align-self:center}.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip{border-top:none;border-bottom-color:#fff;border-left:none;align-self:flex-start}.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip{border-top:none;border-bottom-color:#fff;border-right:none;align-self:flex-end}.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip{border-top-color:#fff;border-bottom:none;align-self:center}.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip{border-top-color:#fff;border-bottom:none;border-left:none;align-self:flex-start}.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip{border-top-color:#fff;border-bottom:none;border-right:none;align-self:flex-end}.mapboxgl-popup-anchor-left .mapboxgl-popup-tip{border-left:none;border-right-color:#fff;align-self:center}.mapboxgl-popup-anchor-right .mapboxgl-popup-tip{border-left-color:#fff;border-right:none;align-self:center}.mapboxgl-popup-close-button{background-color:initial;cursor:pointer;border:0;border-radius:0 3px 0 0;position:absolute;top:0;right:0}.mapboxgl-popup-close-button:hover{background-color:#eee}.mapboxgl-popup-content{pointer-events:auto;background:#fff;border-radius:3px;padding:10px 10px 15px;position:relative;box-shadow:0 1px 2px #0000001a}.mapboxgl-popup-anchor-top-left .mapboxgl-popup-content{border-top-left-radius:0}.mapboxgl-popup-anchor-top-right .mapboxgl-popup-content{border-top-right-radius:0}.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-content{border-bottom-left-radius:0}.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-content{border-bottom-right-radius:0}.mapboxgl-popup-track-pointer{display:none}.mapboxgl-popup-track-pointer *{pointer-events:none;-webkit-user-select:none;user-select:none}.mapboxgl-map:hover .mapboxgl-popup-track-pointer{display:flex}.mapboxgl-map:active .mapboxgl-popup-track-pointer{display:none}.mapboxgl-marker{opacity:1;will-change:transform;transition:opacity .2s;position:absolute;top:0;left:0}.mapboxgl-user-location-dot,.mapboxgl-user-location-dot:before{background-color:#1da1f2;border-radius:50%;width:15px;height:15px}.mapboxgl-user-location-dot:before{content:"";animation:2s infinite mapboxgl-user-location-dot-pulse;position:absolute}.mapboxgl-user-location-dot:after{box-sizing:border-box;content:"";border:2px solid #fff;border-radius:50%;width:19px;height:19px;position:absolute;top:-2px;left:-2px;box-shadow:0 0 3px #00000059}.mapboxgl-user-location-show-heading .mapboxgl-user-location-heading{width:0;height:0}.mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after,.mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before{content:"";border-bottom:7.5px solid #4aa1eb;position:absolute}.mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before{border-left:7.5px solid #0000;transform:translateY(-28px)skewY(-20deg)}.mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after{border-right:7.5px solid #0000;transform:translate(7.5px,-28px)skewY(20deg)}@keyframes mapboxgl-user-location-dot-pulse{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(3)}to{opacity:0;transform:scale(1)}}.mapboxgl-user-location-dot-stale{background-color:#aaa}.mapboxgl-user-location-dot-stale:after{display:none}.mapboxgl-user-location-accuracy-circle{background-color:#1da1f233;border-radius:100%;width:1px;height:1px}.mapboxgl-crosshair,.mapboxgl-crosshair .mapboxgl-interactive,.mapboxgl-crosshair .mapboxgl-interactive:active{cursor:crosshair}.mapboxgl-boxzoom{opacity:.5;background:#fff;border:2px dotted #202020;width:0;height:0;position:absolute;top:0;left:0}@media print{.mapbox-improve-map{display:none}}.mapboxgl-scroll-zoom-blocker,.mapboxgl-touch-pan-blocker{color:#fff;opacity:0;pointer-events:none;text-align:center;background:#000000b3;justify-content:center;align-items:center;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;transition:opacity .75s ease-in-out 1s;display:flex;position:absolute;top:0;left:0}.mapboxgl-scroll-zoom-blocker-show,.mapboxgl-touch-pan-blocker-show{opacity:1;transition:opacity .1s ease-in-out}.mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page,.mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page .mapboxgl-canvas{touch-action:pan-x pan-y}.mapboxgl-ctrl button.mapboxgl-ctrl-level-button{text-align:center;font-size:16px;font-weight:700}.mapboxgl-ctrl button.mapboxgl-ctrl-level-button-selected{color:#000;background-color:#ccc}.mapboxgl-ctrl button.mapboxgl-ctrl-level-button-selected:hover{background-color:#ccc}}

package/dist/modules/components/mapView/styles.css

@@ -0,0 +1 @@
+@layer arkyn{.arkynMapViewPinnedEmpty{border:2px dashed var(--border,#e2e8f0);background-color:rgba(var(--spotlight-secondary,100, 116, 139), 1);border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.arkynMapViewPinnedEmpty>svg{width:64px;height:64px;color:var(--text-muted,#a1a1aa);stroke-width:1px}.arkynMapViewPinned{border-radius:8px;width:100%;height:100%;display:flex}.arkynMapViewPinned .gm-style-iw-d{max-height:none;overflow:hidden}.arkynMapViewPinned .gm-style-iw{overflow:visible}.arkynMapViewPinned .gm-ui-hover-effect{display:none}.mapboxgl-popup-content{background-color:#0000;padding:0;box-shadow:0 4px 16px #0003}.mapboxgl-popup-tip{display:none}}

package/dist/modules/components/maskedInput/index.js

@@ -0,0 +1,104 @@
+import { useForm as e } from "../../hooks/useForm.js";
+import { FieldError as t } from "../fieldError/index.js";
+import { FieldLabel as n } from "../fieldLabel/index.js";
+import { FieldWrapper as r } from "../fieldWrapper/index.js";
+import { IconRenderer as i } from "../../services/iconRenderer.js";
+/* empty css      */
+import { forwardRef as a, useId as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Loader2 as d } from "lucide-react";
+import { InputMask as f } from "@react-input/mask";
+//#region src/components/maskedInput/index.tsx
+var p = a((e, t) => /* @__PURE__ */ l("input", {
+	ref: t,
+	...e
+}));
+function m(a) {
+	let { name: m, disabled: h, title: g, style: _, variant: v = "solid", separate: y, mask: b, showMask: x, replacement: S, label: C, className: w = "", prefix: T, suffix: E, isLoading: D = !1, leftIcon: O, readOnly: k, onFocus: A, onBlur: j, errorMessage: M, defaultValue: N, showAsterisk: P, rightIcon: F, size: I = "md", id: L, value: R, placeholder: z, ...B } = a, { fieldErrors: V } = e(), [H, U] = c(!1), W = s(null), G = o(), K = L || G, q = M || V?.[m], J = !!q, Y = h || D, X = {
+		md: 20,
+		lg: 20
+	}[I], Z = F ? "right" : "left", Q = Z === "left" && D, $ = Z === "right" && D;
+	function ee() {
+		Y || !W?.current || (U(!0), W.current.focus());
+	}
+	function te(e) {
+		U(!0), A && A(e);
+	}
+	function ne(e) {
+		U(!1), j && j(e);
+	}
+	let re = `arkynMaskedInput ${T ? "hasPrefix" : ""} ${E ? "hasSuffix" : ""} ${v} ${I} ${Y || k || D ? "opacity" : ""} ${J ? "errored" : ""} ${H ? "focused" : ""}`;
+	return /* @__PURE__ */ u(r, {
+		className: w,
+		children: [
+			C && /* @__PURE__ */ l(n, {
+				showAsterisk: P,
+				htmlFor: K,
+				children: C
+			}),
+			/* @__PURE__ */ u("section", {
+				title: g,
+				style: _,
+				onClick: ee,
+				className: re,
+				children: [
+					/* @__PURE__ */ l(i, {
+						iconSize: X,
+						icon: T,
+						className: "prefix"
+					}),
+					/* @__PURE__ */ l(i, {
+						show: Q,
+						iconSize: X,
+						className: "spinner",
+						icon: d
+					}),
+					/* @__PURE__ */ l(i, {
+						show: !D,
+						icon: O,
+						iconSize: X
+					}),
+					/* @__PURE__ */ l(f, {
+						component: p,
+						mask: b,
+						replacement: S,
+						separate: y,
+						showMask: x,
+						ref: W,
+						onFocus: te,
+						onBlur: ne,
+						disabled: Y,
+						readOnly: k,
+						id: K,
+						name: m,
+						defaultValue: N || void 0,
+						placeholder: Y && R || z,
+						value: Y ? void 0 : R,
+						...B
+					}),
+					/* @__PURE__ */ l(i, {
+						show: !D,
+						icon: F,
+						iconSize: X
+					}),
+					/* @__PURE__ */ l(i, {
+						show: $,
+						iconSize: X,
+						className: "spinner",
+						icon: d
+					}),
+					/* @__PURE__ */ l(i, {
+						iconSize: X,
+						icon: E,
+						className: "suffix"
+					})
+				]
+			}),
+			q && /* @__PURE__ */ l(t, { children: q })
+		]
+	});
+}
+//#endregion
+export { m as MaskedInput };
+
+//# sourceMappingURL=index.js.map

package/dist/modules/components/maskedInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/maskedInput/index.tsx"],"sourcesContent":["import { InputMask, type Replacement } from \"@react-input/mask\";\nimport { Loader2, type LucideIcon } from \"lucide-react\";\nimport {\n\ttype FocusEvent,\n\tforwardRef,\n\ttype InputHTMLAttributes,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport { FieldError } from \"../fieldError\";\nimport { FieldLabel } from \"../fieldLabel\";\nimport { FieldWrapper } from \"../fieldWrapper\";\n\nimport \"./style.css\";\n\ntype MaskedInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"size\" | \"prefix\" | \"name\" | \"type\"\n> & {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/**\n\t * Mask pattern string. Use the replacement character as an editable placeholder.\n\t * Example: `\"(__) _____-____\"` for a Brazilian mobile phone number.\n\t * Required.\n\t */\n\tmask: string;\n\t/**\n\t * Character or replacement map that marks editable positions in the mask.\n\t * - String: `\"_\"` — every `_` in the mask becomes editable.\n\t * - Object: `{ _: /\\d/ }` — only accepts digits in those positions.\n\t * Required.\n\t */\n\treplacement: string | Replacement;\n\t/**\n\t * When true, strips mask characters from the underlying value,\n\t * keeping only the user-typed characters.\n\t */\n\tseparate?: boolean;\n\t/** When true, shows the full mask pattern in the input before the user types. */\n\tshowMask?: boolean;\n\t/** Optional label text displayed above the input. */\n\tlabel?: string;\n\t/** Validation error message displayed below the input. */\n\terrorMessage?: string;\n\t/** Shows a spinner and disables the input during async operations. @default false */\n\tisLoading?: boolean;\n\t/**\n\t * Input size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/** Text or icon rendered at the far left, outside the input area. */\n\tprefix?: string | LucideIcon;\n\t/** Text or icon rendered at the far right, outside the input area. */\n\tsuffix?: string | LucideIcon;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** Lucide icon rendered inside the input on the left. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered inside the input on the right. */\n\trightIcon?: LucideIcon;\n\t/** Controlled value. */\n\tvalue?: string;\n\t/** Uncontrolled default value. */\n\tdefaultValue?: string;\n};\n\nconst BaseInput = forwardRef<\n\tHTMLInputElement,\n\tInputHTMLAttributes<HTMLInputElement>\n>((props, ref) => {\n\treturn <input ref={ref} {...props} />;\n});\n\n/**\n * MaskedInput — text input with a configurable mask for structured values (phones, CPF, credit cards, etc.).\n *\n * Built on `@react-input/mask`. Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.mask - Mask pattern string. Required.\n * @param props.replacement - Character or map that marks editable positions. Required.\n * @param props.separate - Strips mask chars from the value, keeping only typed characters.\n * @param props.showMask - Shows the full mask pattern before the user types.\n * @param props.label - Label text displayed above the input.\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a spinner and disables the input. Default: false\n * @param props.size - Input size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.prefix - Text or icon at the far left.\n * @param props.suffix - Text or icon at the far right.\n * @param props.leftIcon - Lucide icon inside the input on the left.\n * @param props.rightIcon - Lucide icon inside the input on the right.\n * @param props.showAsterisk - Appends `*` to the label.\n *\n * **...Other valid HTML properties for `<input>` (except `type`)**\n *\n * @returns MaskedInput JSX element wrapped in `FieldWrapper`.\n *\n * @example\n * ```tsx\n * // Brazilian mobile phone\n * <MaskedInput\n *   name=\"phone\"\n *   mask=\"(__) _____-____\"\n *   replacement={{ _: /\\d/ }}\n *   label=\"Phone\"\n * />\n *\n * // CPF with mask visible and validation\n * <MaskedInput\n *   name=\"cpf\"\n *   label=\"CPF\"\n *   mask=\"___.___.___-__\"\n *   replacement=\"_\"\n *   showMask\n *   showAsterisk\n *   errorMessage=\"Invalid CPF\"\n * />\n *\n * // Credit card\n * <MaskedInput\n *   name=\"card\"\n *   label=\"Credit Card\"\n *   mask=\"____ ____ ____ ____\"\n *   replacement={{ _: /\\d/ }}\n *   leftIcon={CreditCard}\n * />\n * ```\n */\n\nfunction MaskedInput(props: MaskedInputProps) {\n\tconst {\n\t\tname,\n\t\tdisabled,\n\t\ttitle,\n\t\tstyle,\n\t\tvariant = \"solid\",\n\t\tseparate,\n\t\tmask,\n\t\tshowMask,\n\t\treplacement,\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tprefix,\n\t\tsuffix,\n\t\tisLoading = false,\n\t\tleftIcon,\n\t\treadOnly,\n\t\tonFocus,\n\t\tonBlur,\n\t\terrorMessage: baseErrorMessage,\n\t\tdefaultValue,\n\t\tshowAsterisk,\n\t\trightIcon,\n\t\tsize = \"md\",\n\t\tid,\n\t\tvalue,\n\t\tplaceholder,\n\t\t...rest\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled || isLoading;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst loadingPosition = rightIcon ? \"right\" : \"left\";\n\n\tconst showLeftSpinner = loadingPosition === \"left\" && isLoading;\n\tconst showRightSpinner = loadingPosition === \"right\" && isLoading;\n\n\tfunction handleSectionClick() {\n\t\tif (isDisabled || !inputRef?.current) return;\n\t\tsetIsFocused(true);\n\t\tinputRef.current.focus();\n\t}\n\n\tfunction handleFocus(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(true);\n\t\tif (onFocus) onFocus(e);\n\t}\n\n\tfunction handleBlur(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(false);\n\t\tif (onBlur) onBlur(e);\n\t}\n\n\tconst hasPrefix = prefix ? \"hasPrefix\" : \"\";\n\tconst hasSuffix = suffix ? \"hasSuffix\" : \"\";\n\tconst errored = isError ? \"errored\" : \"\";\n\tconst opacity = isDisabled || readOnly || isLoading ? \"opacity\" : \"\";\n\tconst focused = isFocused ? \"focused\" : \"\";\n\n\tconst className = `arkynMaskedInput ${hasPrefix} ${hasSuffix} ${variant} ${size} ${opacity} ${errored} ${focused}`;\n\n\treturn (\n\t\t<FieldWrapper className={wrapperClassName}>\n\t\t\t{label && (\n\t\t\t\t<FieldLabel showAsterisk={showAsterisk} htmlFor={inputId}>\n\t\t\t\t\t{label}\n\t\t\t\t</FieldLabel>\n\t\t\t)}\n\n\t\t\t<section\n\t\t\t\ttitle={title}\n\t\t\t\tstyle={style}\n\t\t\t\tonClick={handleSectionClick}\n\t\t\t\tclassName={className}\n\t\t\t>\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showLeftSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={leftIcon} iconSize={iconSize} />\n\n\t\t\t\t<InputMask\n\t\t\t\t\tcomponent={BaseInput}\n\t\t\t\t\tmask={mask}\n\t\t\t\t\treplacement={replacement}\n\t\t\t\t\tseparate={separate}\n\t\t\t\t\tshowMask={showMask}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tid={inputId}\n\t\t\t\t\tname={name}\n\t\t\t\t\tdefaultValue={defaultValue || undefined}\n\t\t\t\t\tplaceholder={isDisabled ? value || placeholder : placeholder}\n\t\t\t\t\tvalue={isDisabled ? undefined : value}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={rightIcon} iconSize={iconSize} />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showRightSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={suffix} className=\"suffix\" />\n\t\t\t</section>\n\n\t\t\t{errorMessage && <FieldError>{errorMessage}</FieldError>}\n\t\t</FieldWrapper>\n\t);\n}\n\nexport { MaskedInput };\n"],"mappings":";;;;;;;;;;;AAiFA,IAAM,IAAY,GAGf,GAAO,MACF,kBAAC,SAAD;CAAY;CAAK,GAAI;AAAQ,CAAA,CACpC;AA2DD,SAAS,EAAY,GAAyB;CAC7C,IAAM,EACL,SACA,aACA,UACA,UACA,aAAU,SACV,aACA,SACA,aACA,gBACA,UACA,WAAW,IAAmB,IAC9B,WACA,WACA,eAAY,IACZ,aACA,aACA,YACA,WACA,cAAc,GACd,iBACA,iBACA,cACA,UAAO,MACP,OACA,UACA,gBACA,GAAG,MACA,GAEE,EAAE,mBAAgB,EAAQ,GAC1B,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAEhB,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAa,KAAY,GAGzB,IAAW;EADG,IAAI;EAAI,IAAI;CACf,EAAU,IAErB,IAAkB,IAAY,UAAU,QAExC,IAAkB,MAAoB,UAAU,GAChD,IAAmB,MAAoB,WAAW;CAExD,SAAS,KAAqB;EACzB,KAAc,CAAC,GAAU,YAC7B,EAAa,EAAI,GACjB,EAAS,QAAQ,MAAM;CACxB;CAEA,SAAS,GAAY,GAAiC;EAErD,AADA,EAAa,EAAI,GACb,KAAS,EAAQ,CAAC;CACvB;CAEA,SAAS,GAAW,GAAiC;EAEpD,AADA,EAAa,EAAK,GACd,KAAQ,EAAO,CAAC;CACrB;CAQA,IAAM,KAAY,oBANA,IAAS,cAAc,GAMO,GAL9B,IAAS,cAAc,GAKoB,GAAG,EAAQ,GAAG,EAAK,GAHhE,KAAc,KAAY,IAAY,YAAY,GAGyB,GAJ3E,IAAU,YAAY,GAIgE,GAFtF,IAAY,YAAY;CAIxC,OACC,kBAAC,GAAD;EAAc,WAAW;YAAzB;GACE,KACA,kBAAC,GAAD;IAA0B;IAAc,SAAS;cAC/C;GACU,CAAA;GAGb,kBAAC,WAAD;IACQ;IACA;IACP,SAAS;IACE;cAJZ;KAMC,kBAAC,GAAD;MAAwB;MAAU,MAAM;MAAQ,WAAU;KAAU,CAAA;KAEpE,kBAAC,GAAD;MACC,MAAM;MACI;MACV,WAAU;MACV,MAAM;KACN,CAAA;KAED,kBAAC,GAAD;MAAc,MAAM,CAAC;MAAW,MAAM;MAAoB;KAAW,CAAA;KAErE,kBAAC,GAAD;MACC,WAAW;MACL;MACO;MACH;MACA;MACV,KAAK;MACL,SAAS;MACT,QAAQ;MACR,UAAU;MACA;MACV,IAAI;MACE;MACN,cAAc,KAAgB,KAAA;MAC9B,aAAa,KAAa,KAAuB;MACjD,OAAO,IAAa,KAAA,IAAY;MAChC,GAAI;KACJ,CAAA;KAED,kBAAC,GAAD;MAAc,MAAM,CAAC;MAAW,MAAM;MAAqB;KAAW,CAAA;KAEtE,kBAAC,GAAD;MACC,MAAM;MACI;MACV,WAAU;MACV,MAAM;KACN,CAAA;KAED,kBAAC,GAAD;MAAwB;MAAU,MAAM;MAAQ,WAAU;KAAU,CAAA;IAC5D;;GAER,KAAgB,kBAAC,GAAD,EAAA,UAAa,EAAyB,CAAA;EAC1C;;AAEhB"}

package/dist/modules/components/maskedInput/style.css

@@ -0,0 +1 @@
+@layer arkyn{.arkynMaskedInput{border:1px solid #0000;border-radius:8px;outline:1px solid #0000;align-items:center;gap:8px;width:100%;padding:0 16px;display:flex;position:relative}.arkynMaskedInput:hover{cursor:text}.arkynMaskedInput input{width:100%;color:var(--text-heading,#09090b);background:0 0;border:none;outline:none;line-height:100%}.arkynMaskedInput .prefix,.arkynMaskedInput .suffix{color:var(--text-body,#52525b);background:var(--border,#e2e8f0);justify-content:center;align-items:center;font-weight:400;line-height:100%;display:flex;position:absolute}.arkynMaskedInput .prefix{border-right:1px solid var(--border,#e2e8f0);border-radius:7px 0 0 7px;top:0;bottom:0;left:0}.arkynMaskedInput .suffix{border-left:1px solid var(--border,#e2e8f0);border-radius:0 7px 7px 0;top:0;bottom:0;right:0}.arkynMaskedInput input::placeholder{color:var(--text-muted,#a1a1aa);line-height:100%}.arkynMaskedInput svg{color:var(--text-muted,#a1a1aa)}.arkynMaskedInput.errored svg{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).focused svg{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.opacity{opacity:.5}.arkynMaskedInput.solid{border-color:var(--border,#e2e8f0);background-color:var(--input-background,#fafafa)}.arkynMaskedInput.solid.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).solid.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.outline{border-color:var(--border,#e2e8f0);background-color:var(--background-foreground,#fff)}.arkynMaskedInput.outline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).outline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.underline{border-top:none;border-left:none;border-right:none;border-color:var(--border,#e2e8f0);border-radius:0;outline:none}.arkynMaskedInput.underline .suffix,.arkynMaskedInput.underline .prefix{display:none}.arkynMaskedInput.underline:before{content:" ";background:0 0;height:1px;position:absolute;bottom:-2px;left:0;right:0}.arkynMaskedInput.underline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput.underline.errored:before{background:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).underline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput:not(.opacity).underline.focused:before{background:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.md input{min-height:38px;max-height:38px;font-size:14px;font-weight:400;line-height:14px}.arkynMaskedInput.md input::placeholder{font-size:14px;font-weight:400;line-height:14px}.arkynMaskedInput.md.hasPrefix{padding-left:60px}.arkynMaskedInput.md.hasSuffix{padding-right:60px}.arkynMaskedInput.md .prefix,.arkynMaskedInput.md .suffix{width:44px;height:38px;font-size:14px}.arkynMaskedInput.lg input{min-height:44px;max-height:44px;font-size:16px;font-weight:400;line-height:16px}.arkynMaskedInput.lg input::placeholder{font-size:16px;font-weight:400;line-height:16px}.arkynMaskedInput.lg .prefix,.arkynMaskedInput.lg .suffix{width:48px;height:44px;font-size:16px}.arkynMaskedInput.lg.hasPrefix{padding-left:64px}.arkynMaskedInput.lg.hasSuffix{padding-right:64px}.arkynMaskedInput .spinner{animation:2s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}

package/dist/modules/components/maskedInput/styles.css

@@ -0,0 +1,7 @@
+@layer arkyn{.arkynMaskedInput{border:1px solid #0000;border-radius:8px;outline:1px solid #0000;align-items:center;gap:8px;width:100%;padding:0 16px;display:flex;position:relative}.arkynMaskedInput:hover{cursor:text}.arkynMaskedInput input{width:100%;color:var(--text-heading,#09090b);background:0 0;border:none;outline:none;line-height:100%}.arkynMaskedInput .prefix,.arkynMaskedInput .suffix{color:var(--text-body,#52525b);background:var(--border,#e2e8f0);justify-content:center;align-items:center;font-weight:400;line-height:100%;display:flex;position:absolute}.arkynMaskedInput .prefix{border-right:1px solid var(--border,#e2e8f0);border-radius:7px 0 0 7px;top:0;bottom:0;left:0}.arkynMaskedInput .suffix{border-left:1px solid var(--border,#e2e8f0);border-radius:0 7px 7px 0;top:0;bottom:0;right:0}.arkynMaskedInput input::placeholder{color:var(--text-muted,#a1a1aa);line-height:100%}.arkynMaskedInput svg{color:var(--text-muted,#a1a1aa)}.arkynMaskedInput.errored svg{color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).focused svg{color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.opacity{opacity:.5}.arkynMaskedInput.solid{border-color:var(--border,#e2e8f0);background-color:var(--input-background,#fafafa)}.arkynMaskedInput.solid.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).solid.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.outline{border-color:var(--border,#e2e8f0);background-color:var(--background-foreground,#fff)}.arkynMaskedInput.outline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94));outline-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).outline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220));outline-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.underline{border-top:none;border-left:none;border-right:none;border-color:var(--border,#e2e8f0);border-radius:0;outline:none}.arkynMaskedInput.underline .suffix,.arkynMaskedInput.underline .prefix{display:none}.arkynMaskedInput.underline:before{content:" ";background:0 0;height:1px;position:absolute;bottom:-2px;left:0;right:0}.arkynMaskedInput.underline.errored{border-color:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput.underline.errored:before{background:rgb(var(--spotlight-danger,244, 63, 94))}.arkynMaskedInput:not(.opacity).underline.focused{border-color:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput:not(.opacity).underline.focused:before{background:rgb(var(--spotlight-primary,17, 109, 220))}.arkynMaskedInput.md input{min-height:38px;max-height:38px;font-size:14px;font-weight:400;line-height:14px}.arkynMaskedInput.md input::placeholder{font-size:14px;font-weight:400;line-height:14px}.arkynMaskedInput.md.hasPrefix{padding-left:60px}.arkynMaskedInput.md.hasSuffix{padding-right:60px}.arkynMaskedInput.md .prefix,.arkynMaskedInput.md .suffix{width:44px;height:38px;font-size:14px}.arkynMaskedInput.lg input{min-height:44px;max-height:44px;font-size:16px;font-weight:400;line-height:16px}.arkynMaskedInput.lg input::placeholder{font-size:16px;font-weight:400;line-height:16px}.arkynMaskedInput.lg .prefix,.arkynMaskedInput.lg .suffix{width:48px;height:44px;font-size:16px}.arkynMaskedInput.lg.hasPrefix{padding-left:64px}.arkynMaskedInput.lg.hasSuffix{padding-right:64px}.arkynMaskedInput .spinner{animation:2s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}
+
+@layer arkyn{.arkynFieldError{color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:12px}}
+
+@layer arkyn{.arkynFieldLabel{color:var(--text-body,#52525b);font-size:14px;font-weight:600;line-height:19.07px}.arkynFieldLabel.asteriskTrue:before{content:"* ";text-align:left;color:rgb(var(--spotlight-danger,244, 63, 94));font-size:12px;font-weight:600;line-height:16.34px}}
+
+@layer arkyn{.arkynFieldWrapper{gap:6px;height:max-content;display:flex}.arkynFieldWrapper.horizontal{flex-direction:row;align-items:center}.arkynFieldWrapper.horizontalReverse{flex-direction:row-reverse;align-items:center;margin-right:auto}.arkynFieldWrapper.vertical{flex-direction:column;align-items:flex-start}}