npm - @arkyn/components - Versions diffs - 3.0.3 → 3.0.4 - Mend

@arkyn/components 3.0.3 → 3.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (151) hide show

package/dist/modules/components/phoneInput/index.js CHANGED Viewed

@@ -3,102 +3,102 @@ import { FieldTemplate as t } from "../../services/fieldTemplate.js";
 import { TYPES as n, applyMask as r, getMask as i } from "../../utils/phoneInputUtilities.js";
 import { PhoneInputContainer as a } from "./phoneInputContainer/index.js";
 import { PhoneInputCountriesOverlay as o } from "./phoneInputCountriesOverlay/index.js";
-import { PhoneInputCountryOption as ee } from "./phoneInputCountryOption/index.js";
-import { PhoneInputCountryOptionsContainer as s } from "./phoneInputCountryOptionsContainer/index.js";
-import { PhoneInputCountrySelector as te } from "./phoneInputCountrySelector/index.js";
-import { PhoneInputMask as c } from "./phoneInputMask/index.js";
-import { useId as l, useRef as u, useState as d } from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import { findCountryMask as ne, formatToPhone as re, removeNonNumeric as m } from "@arkyn/shared";
-import { countries as h } from "@arkyn/templates";
+import { PhoneInputCountryOption as s } from "./phoneInputCountryOption/index.js";
+import { PhoneInputCountryOptionsContainer as c } from "./phoneInputCountryOptionsContainer/index.js";
+import { PhoneInputCountrySelector as ee } from "./phoneInputCountrySelector/index.js";
+import { PhoneInputMask as l } from "./phoneInputMask/index.js";
+import { useId as u, useRef as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { findCountryMask as h, formatToPhone as g, removeNonNumeric as _ } from "@arkyn/shared";
+import { countries as v } from "@arkyn/templates";
 //#region src/components/phoneInput/index.tsx
-function g(e, t) {
-	let a = m(e);
-	return t.code === "+55" ? r(a, n[i(a)]) : r(a, typeof t.mask == "string" ? t.mask : t.mask[0], "_");
+function y(e, t) {
+	let a = _(e), o = _(t.code), s = e.trim().startsWith("+") && a.startsWith(o) ? a.slice(o.length) : a;
+	return t.code === "+55" ? r(s, n[i(s)]) : r(s, typeof t.mask == "string" ? t.mask : t.mask[0], "_");
 }
-function _(n) {
-	let { value: r, label: i, className: _ = "", disabled: v = !1, errorMessage: y, isLoading: b = !1, readOnly: x = !1, size: S = "md", defaultValue: C = "", variant: ie = "solid", showAsterisk: ae, name: w, onChange: oe, searchCountryPlaceholder: T = "Pesquisar país", notFoundCountryText: E = "Nenhum país encontrado", id: D, unShowFieldTemplate: O = !1, orientation: k = "vertical" } = n, A = h.find((e) => e.iso === "BR"), j = C ? re(C) : "", M = C ? ne(C)[1] : A, [N, P] = d(!1), [F, I] = d(""), [L, R] = d(!1), [z, B] = d(j), [V, H] = d(M), U = r === void 0 ? z : g(r, V), { fieldErrors: W } = e(), G = u(null), K = l(), q = D || K, J = y || W?.[w], se = !!J, Y = v || b, X = u(null);
+function b(n) {
+	let { value: r, label: i, className: b = "", disabled: x = !1, errorMessage: S, isLoading: C = !1, readOnly: w = !1, size: T = "md", defaultValue: E = "", variant: te = "solid", showAsterisk: ne, name: D, onChange: re, searchCountryPlaceholder: ie = "Pesquisar país", notFoundCountryText: ae = "Nenhum país encontrado", id: O, unShowFieldTemplate: k = !1, orientation: A = "vertical" } = n, j = v.find((e) => e.iso === "BR"), M = E ? g(E) : "", N = E ? h(E)[1] : j, [P, F] = f(!1), [I, L] = f(""), [R, z] = f(!1), [B, V] = f(M), [H, U] = f(N), W = r === void 0 ? B : y(r, H), { fieldErrors: G } = e(), K = d(null), q = u(), oe = O || q, J = S || G?.[D], se = !!J, Y = x || C, X = d(null);
 	function ce() {
-		Y || N || L || (P(!0), X.current && X.current.focus());
+		Y || P || R || (F(!0), X.current && X.current.focus());
 	}
 	function Z() {
-		R(!0), P(!0);
+		z(!0), F(!0);
 	}
 	function le() {
-		R(!1), P(!1);
+		z(!1), F(!1);
 	}
 	function ue() {
-		P(!0);
+		F(!0);
 	}
 	function de() {
-		P(!1);
+		F(!1);
 	}
 	function Q(e) {
-		return e.name.toLowerCase().includes(F.toLowerCase());
+		return e.name.toLowerCase().includes(I.toLowerCase());
 	}
 	function $(e) {
-		let t = V.code;
-		return t += m(e || U), t;
+		let t = H.code;
+		return t += _(e || W), t;
 	}
-	return /* @__PURE__ */ f(t, {
-		name: w,
+	return /* @__PURE__ */ p(t, {
+		name: D,
 		label: i,
-		showAsterisk: ae,
-		className: _,
+		showAsterisk: ne,
+		className: b,
 		errorMessage: J,
-		unShowFieldTemplate: O,
-		orientation: k,
-		children: /* @__PURE__ */ p(a, {
+		unShowFieldTemplate: k,
+		orientation: A,
+		children: /* @__PURE__ */ m(a, {
 			disabled: Y,
 			isError: se,
-			isLoading: b,
-			isFocused: N,
-			readOnly: x,
-			size: S,
-			variant: ie,
+			isLoading: C,
+			isFocused: P,
+			readOnly: w,
+			size: T,
+			variant: te,
 			onFocus: ce,
 			children: [
-				/* @__PURE__ */ f(te, {
-					currentCountry: V,
+				/* @__PURE__ */ p(ee, {
+					currentCountry: H,
 					onClick: Z,
-					size: S
+					size: T
 				}),
-				/* @__PURE__ */ p(s, {
-					isOpen: Y || x ? !1 : L,
-					search: F,
-					placeholder: T,
-					onSearch: I,
-					children: [h.filter((e) => Q(e)).map((e) => /* @__PURE__ */ f(ee, {
+				/* @__PURE__ */ m(c, {
+					isOpen: Y || w ? !1 : R,
+					search: I,
+					placeholder: ie,
+					onSearch: L,
+					children: [v.filter((e) => Q(e)).map((e) => /* @__PURE__ */ p(s, {
 						country: e,
 						handleChangeValue: () => {
-							H(e), R(!1), B("");
+							U(e), z(!1), V("");
 						},
-						isActive: e.iso === V.iso,
-						size: S
-					}, e.iso)), h.filter((e) => Q(e)).length === 0 && /* @__PURE__ */ f("p", { children: E })]
+						isActive: e.iso === H.iso,
+						size: T
+					}, e.iso)), v.filter((e) => Q(e)).length === 0 && /* @__PURE__ */ p("p", { children: ae })]
 				}),
-				/* @__PURE__ */ f(o, {
-					isOpen: Y || x ? !1 : L,
+				/* @__PURE__ */ p(o, {
+					isOpen: Y || w ? !1 : R,
 					onClick: le
 				}),
-				/* @__PURE__ */ f(c, {
-					id: q,
+				/* @__PURE__ */ p(l, {
+					id: oe,
 					ref: X,
-					readonly: x,
-					currentCountry: V,
-					value: U,
+					readonly: w,
+					currentCountry: H,
+					value: W,
 					disabled: Y,
 					onBlur: de,
 					onFocus: ue,
-					size: S,
+					size: T,
 					onChange: (e) => {
-						B(e), oe?.($(e));
+						V(e), re?.($(e));
 					}
 				}),
-				/* @__PURE__ */ f("input", {
-					ref: G,
+				/* @__PURE__ */ p("input", {
+					ref: K,
 					type: "hidden",
-					name: w,
+					name: D,
 					value: $()
 				})
 			]
@@ -106,6 +106,6 @@ function _(n) {
 	});
 }
 //#endregion
-export { _ as PhoneInput };
+export { b as PhoneInput };
 //# sourceMappingURL=index.js.map

package/dist/modules/components/phoneInput/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/phoneInput/index.tsx"],"sourcesContent":["import {\n\tfindCountryMask,\n\tformatToPhone,\n\tremoveNonNumeric,\n} from \"@arkyn/shared\";\nimport { countries } from \"@arkyn/templates\";\nimport { useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { applyMask, getMask, TYPES } from \"../../utils/phoneInputUtilities\";\n\nimport { PhoneInputContainer } from \"./phoneInputContainer\";\nimport { PhoneInputCountriesOverlay } from \"./phoneInputCountriesOverlay\";\nimport { PhoneInputCountryOption } from \"./phoneInputCountryOption\";\nimport { PhoneInputCountryOptionsContainer } from \"./phoneInputCountryOptionsContainer\";\nimport { PhoneInputCountrySelector } from \"./phoneInputCountrySelector\";\nimport { PhoneInputMask } from \"./phoneInputMask\";\n\ntype CountryType = {\n\tname: string;\n\tcode: string;\n\tiso: string;\n\tflag: string;\n\tmask: string \| string[];\n};\n\ntype PhoneInputProps = {\n\t/** Optional HTML id for the visible phone text input. /\n\tid?: string;\n\t/* Disables all interactions. @default false /\n\tdisabled?: boolean;\n\t/* Prevents value changes while keeping the current value visible. @default false /\n\treadOnly?: boolean;\n\t/* Validation error message (overrides the `useForm` context error for this field). /\n\terrorMessage?: string;\n\t/* Optional label text displayed above the input. /\n\tlabel?: string;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Shows a loading state and disables interactions. @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 * @default \"solid\"\n\t /\n\tvariant?: \"solid\" \| \"outline\";\n\t/* Additional CSS class applied to the field wrapper. /\n\tclassName?: string;\n\t/* Uncontrolled default phone value (numeric string with or without country code). @default \"\" /\n\tdefaultValue?: string;\n\t/* Text displayed when no country matches the search query. @default \"Nenhum país encontrado\" /\n\tnotFoundCountryText?: string;\n\t/* Field name for form submission (stored as numeric string with country code). Required. /\n\tname: string;\n\t/* Placeholder for the country search input. @default \"Pesquisar país\" /\n\tsearchCountryPlaceholder?: string;\n\t/* ISO 3166-1 alpha-2 code of the initially selected country. @default \"BR\" /\n\tdefaultCountryIso?: (typeof countries)[number][\"iso\"];\n\t/* Callback fired on value change. Receives a numeric string prefixed with the country dial code. /\n\tonChange?: (e: string) => void;\n\t/* Controlled phone value (without country code). /\n\tvalue?: string;\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"vertical\"\n\t /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\nfunction formatLocalValue(rawValue: string, country: CountryType) {\n\tconst digits = removeNonNumeric(rawValue);\n\n\tif (country.code === \"+55\") {\n\t\treturn applyMask(digits, TYPES[getMask(digits)]);\n\t}\n\n\tconst mask =\n\t\ttypeof country.mask === \"string\" ? country.mask : country.mask[0];\n\treturn applyMask(digits, mask, \"_\");\n}\n\n/\n PhoneInput — phone number field with an integrated country selector and automatic mask formatting.\n \n The visible input is masked according to the selected country's phone format.\n * The hidden `<input>` stores a numeric string prefixed with the country dial code for form submission.\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.showAsterisk - Appends `` to the label.\n @param props.errorMessage - Validation error message.\n * @param props.size - Input size (`md` \| `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.disabled - Disables all interactions. Default: false\n * @param props.readOnly - Prevents editing. Default: false\n * @param props.isLoading - Shows loading state and disables interactions. Default: false\n * @param props.defaultValue - Uncontrolled default phone value.\n * @param props.value - Controlled phone value (without country code).\n * @param props.onChange - Callback fired on change — receives numeric string with country code.\n * @param props.defaultCountryIso - ISO code of the initially selected country. Default: \"BR\"\n * @param props.searchCountryPlaceholder - Placeholder for country search. Default: \"Pesquisar país\"\n * @param props.notFoundCountryText - Text shown when no country matches. Default: \"Nenhum país encontrado\"\n * @param props.orientation - Layout direction. Default: \"vertical\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns PhoneInput JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <PhoneInput name=\"phone\" label=\"Phone\" />\n \n // Controlled with outline variant\n * <PhoneInput\n * name=\"contactPhone\"\n * label=\"Contact Phone\"\n * value={phone}\n * onChange={(v) => setPhone(v)}\n * variant=\"outline\"\n * size=\"lg\"\n * />\n \n // Pre-selected country (US)\n * <PhoneInput\n * name=\"phone\"\n * label=\"Phone\"\n * defaultCountryIso=\"US\"\n * showAsterisk\n * />\n * ```\n */\nfunction PhoneInput(props: PhoneInputProps) {\n\tconst {\n\t\tvalue: rawValue,\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tdisabled = false,\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tsize = \"md\",\n\t\tdefaultValue = \"\",\n\t\tvariant = \"solid\",\n\t\tshowAsterisk,\n\t\tname,\n\t\tonChange,\n\t\tsearchCountryPlaceholder = \"Pesquisar país\",\n\t\tnotFoundCountryText = \"Nenhum país encontrado\",\n\t\tid,\n\t\tunShowFieldTemplate = false,\n\t\torientation = \"vertical\",\n\t} = props;\n\n\t// biome-ignore lint/style/noNonNullAssertion: \"BR\" is always present in the countries list\n\tconst brasilCountry = countries.find((country) => country.iso === \"BR\")!;\n\n\tconst defaultData = defaultValue ? formatToPhone(defaultValue) : \"\";\n\tconst defaultCountry: CountryType = defaultValue\n\t\t? findCountryMask(defaultValue)[1]\n\t\t: brasilCountry;\n\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [search, setSearch] = useState(\"\");\n\tconst [showCountryOptions, setShowCountryOptions] = useState(false);\n\tconst [internalValue, setValue] = useState(defaultData);\n\n\tconst [currentCountry, setCurrentCountry] = useState(defaultCountry);\n\n\tconst value =\n\t\trawValue !== undefined\n\t\t\t? formatLocalValue(rawValue, currentCountry)\n\t\t\t: internalValue;\n\n\tconst { fieldErrors } = useForm();\n\n\tconst phoneInputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst phoneInputId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled \|\| isLoading;\n\n\tconst inputPhoneMaskRef = useRef<HTMLInputElement>(null);\n\n\tfunction handleContainerFocus() {\n\t\tif (isDisabled) return;\n\t\tif (isFocused \|\| showCountryOptions) return;\n\n\t\tsetIsFocused(true);\n\t\tif (inputPhoneMaskRef.current) inputPhoneMaskRef.current.focus();\n\t}\n\n\tfunction handleOpenCountryOptions() {\n\t\tsetShowCountryOptions(true);\n\t\tsetIsFocused(true);\n\t}\n\n\tfunction handleCloseCountryOptions() {\n\t\tsetShowCountryOptions(false);\n\t\tsetIsFocused(false);\n\t}\n\n\tfunction handleInputFocus() {\n\t\tsetIsFocused(true);\n\t}\n\n\tfunction handleInputBlur() {\n\t\tsetIsFocused(false);\n\t}\n\n\tfunction filterCountryFunction(country: CountryType) {\n\t\treturn country.name.toLowerCase().includes(search.toLowerCase());\n\t}\n\n\tfunction inputValue(props?: string) {\n\t\tlet returnValue = currentCountry.code;\n\t\treturnValue += removeNonNumeric(props \|\| value);\n\t\treturn returnValue;\n\t}\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<PhoneInputContainer\n\t\t\t\tdisabled={isDisabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t>\n\t\t\t\t<PhoneInputCountrySelector\n\t\t\t\t\tcurrentCountry={currentCountry}\n\t\t\t\t\tonClick={handleOpenCountryOptions}\n\t\t\t\t\tsize={size}\n\t\t\t\t/>\n\n\t\t\t\t<PhoneInputCountryOptionsContainer\n\t\t\t\t\tisOpen={isDisabled ? false : readOnly ? false : showCountryOptions}\n\t\t\t\t\tsearch={search}\n\t\t\t\t\tplaceholder={searchCountryPlaceholder}\n\t\t\t\t\tonSearch={setSearch}\n\t\t\t\t>\n\t\t\t\t\t{countries\n\t\t\t\t\t\t.filter((country) => filterCountryFunction(country))\n\t\t\t\t\t\t.map((country) => (\n\t\t\t\t\t\t\t<PhoneInputCountryOption\n\t\t\t\t\t\t\t\tkey={country.iso}\n\t\t\t\t\t\t\t\tcountry={country}\n\t\t\t\t\t\t\t\thandleChangeValue={() => {\n\t\t\t\t\t\t\t\t\tsetCurrentCountry(country);\n\t\t\t\t\t\t\t\t\tsetShowCountryOptions(false);\n\t\t\t\t\t\t\t\t\tsetValue(\"\");\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tisActive={country.iso === currentCountry.iso}\n\t\t\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t{countries.filter((country) => filterCountryFunction(country))\n\t\t\t\t\t\t.length === 0 && <p>{notFoundCountryText}</p>}\n\t\t\t\t</PhoneInputCountryOptionsContainer>\n\n\t\t\t\t<PhoneInputCountriesOverlay\n\t\t\t\t\tisOpen={isDisabled ? false : readOnly ? false : showCountryOptions}\n\t\t\t\t\tonClick={handleCloseCountryOptions}\n\t\t\t\t/>\n\n\t\t\t\t<PhoneInputMask\n\t\t\t\t\tid={phoneInputId}\n\t\t\t\t\tref={inputPhoneMaskRef}\n\t\t\t\t\treadonly={readOnly}\n\t\t\t\t\tcurrentCountry={currentCountry}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\tonBlur={handleInputBlur}\n\t\t\t\t\tonFocus={handleInputFocus}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\tsetValue(e);\n\t\t\t\t\t\tonChange?.(inputValue(e));\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tref={phoneInputRef}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={inputValue()}\n\t\t\t\t/>\n\t\t\t</PhoneInputContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { PhoneInput };\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/phoneInput/index.tsx"],"sourcesContent":["import {\n\tfindCountryMask,\n\tformatToPhone,\n\tremoveNonNumeric,\n} from \"@arkyn/shared\";\nimport { countries } from \"@arkyn/templates\";\nimport { useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { applyMask, getMask, TYPES } from \"../../utils/phoneInputUtilities\";\n\nimport { PhoneInputContainer } from \"./phoneInputContainer\";\nimport { PhoneInputCountriesOverlay } from \"./phoneInputCountriesOverlay\";\nimport { PhoneInputCountryOption } from \"./phoneInputCountryOption\";\nimport { PhoneInputCountryOptionsContainer } from \"./phoneInputCountryOptionsContainer\";\nimport { PhoneInputCountrySelector } from \"./phoneInputCountrySelector\";\nimport { PhoneInputMask } from \"./phoneInputMask\";\n\ntype CountryType = {\n\tname: string;\n\tcode: string;\n\tiso: string;\n\tflag: string;\n\tmask: string \| string[];\n};\n\ntype PhoneInputProps = {\n\t/** Optional HTML id for the visible phone text input. /\n\tid?: string;\n\t/* Disables all interactions. @default false /\n\tdisabled?: boolean;\n\t/* Prevents value changes while keeping the current value visible. @default false /\n\treadOnly?: boolean;\n\t/* Validation error message (overrides the `useForm` context error for this field). /\n\terrorMessage?: string;\n\t/* Optional label text displayed above the input. /\n\tlabel?: string;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Shows a loading state and disables interactions. @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 * @default \"solid\"\n\t /\n\tvariant?: \"solid\" \| \"outline\";\n\t/* Additional CSS class applied to the field wrapper. /\n\tclassName?: string;\n\t/* Uncontrolled default phone value (numeric string with or without country code). @default \"\" /\n\tdefaultValue?: string;\n\t/* Text displayed when no country matches the search query. @default \"Nenhum país encontrado\" /\n\tnotFoundCountryText?: string;\n\t/* Field name for form submission (stored as numeric string with country code). Required. /\n\tname: string;\n\t/* Placeholder for the country search input. @default \"Pesquisar país\" /\n\tsearchCountryPlaceholder?: string;\n\t/* ISO 3166-1 alpha-2 code of the initially selected country. @default \"BR\" /\n\tdefaultCountryIso?: (typeof countries)[number][\"iso\"];\n\t/* Callback fired on value change. Receives a numeric string prefixed with the country dial code. /\n\tonChange?: (e: string) => void;\n\t/* Controlled phone value (without country code). /\n\tvalue?: string;\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"vertical\"\n\t /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\nfunction formatLocalValue(rawValue: string, country: CountryType) {\n\tconst digits = removeNonNumeric(rawValue);\n\tconst codeDigits = removeNonNumeric(country.code);\n\tconst hasCountryCode = rawValue.trim().startsWith(\"+\");\n\tconst localDigits =\n\t\thasCountryCode && digits.startsWith(codeDigits)\n\t\t\t? digits.slice(codeDigits.length)\n\t\t\t: digits;\n\n\tif (country.code === \"+55\") {\n\t\treturn applyMask(localDigits, TYPES[getMask(localDigits)]);\n\t}\n\n\tconst mask =\n\t\ttypeof country.mask === \"string\" ? country.mask : country.mask[0];\n\treturn applyMask(localDigits, mask, \"_\");\n}\n\n/\n PhoneInput, phone number field with an integrated country selector and automatic mask formatting.\n \n The visible input is masked according to the selected country's phone format.\n * The hidden `<input>` stores a numeric string prefixed with the country dial code for form submission.\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.showAsterisk - Appends `` to the label.\n @param props.errorMessage - Validation error message.\n * @param props.size - Input size (`md` \| `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.disabled - Disables all interactions. Default: false\n * @param props.readOnly - Prevents editing. Default: false\n * @param props.isLoading - Shows loading state and disables interactions. Default: false\n * @param props.defaultValue - Uncontrolled default phone value.\n * @param props.value - Controlled phone value (without country code).\n * @param props.onChange - Callback fired on change, receives numeric string with country code.\n * @param props.defaultCountryIso - ISO code of the initially selected country. Default: \"BR\"\n * @param props.searchCountryPlaceholder - Placeholder for country search. Default: \"Pesquisar país\"\n * @param props.notFoundCountryText - Text shown when no country matches. Default: \"Nenhum país encontrado\"\n * @param props.orientation - Layout direction. Default: \"vertical\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns PhoneInput JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <PhoneInput name=\"phone\" label=\"Phone\" />\n \n // Controlled with outline variant\n * <PhoneInput\n * name=\"contactPhone\"\n * label=\"Contact Phone\"\n * value={phone}\n * onChange={(v) => setPhone(v)}\n * variant=\"outline\"\n * size=\"lg\"\n * />\n \n // Pre-selected country (US)\n * <PhoneInput\n * name=\"phone\"\n * label=\"Phone\"\n * defaultCountryIso=\"US\"\n * showAsterisk\n * />\n * ```\n */\nfunction PhoneInput(props: PhoneInputProps) {\n\tconst {\n\t\tvalue: rawValue,\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tdisabled = false,\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tsize = \"md\",\n\t\tdefaultValue = \"\",\n\t\tvariant = \"solid\",\n\t\tshowAsterisk,\n\t\tname,\n\t\tonChange,\n\t\tsearchCountryPlaceholder = \"Pesquisar país\",\n\t\tnotFoundCountryText = \"Nenhum país encontrado\",\n\t\tid,\n\t\tunShowFieldTemplate = false,\n\t\torientation = \"vertical\",\n\t} = props;\n\n\t// biome-ignore lint/style/noNonNullAssertion: \"BR\" is always present in the countries list\n\tconst brasilCountry = countries.find((country) => country.iso === \"BR\")!;\n\n\tconst defaultData = defaultValue ? formatToPhone(defaultValue) : \"\";\n\tconst defaultCountry: CountryType = defaultValue\n\t\t? findCountryMask(defaultValue)[1]\n\t\t: brasilCountry;\n\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [search, setSearch] = useState(\"\");\n\tconst [showCountryOptions, setShowCountryOptions] = useState(false);\n\tconst [internalValue, setValue] = useState(defaultData);\n\n\tconst [currentCountry, setCurrentCountry] = useState(defaultCountry);\n\n\tconst value =\n\t\trawValue !== undefined\n\t\t\t? formatLocalValue(rawValue, currentCountry)\n\t\t\t: internalValue;\n\n\tconst { fieldErrors } = useForm();\n\n\tconst phoneInputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst phoneInputId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled \|\| isLoading;\n\n\tconst inputPhoneMaskRef = useRef<HTMLInputElement>(null);\n\n\tfunction handleContainerFocus() {\n\t\tif (isDisabled) return;\n\t\tif (isFocused \|\| showCountryOptions) return;\n\n\t\tsetIsFocused(true);\n\t\tif (inputPhoneMaskRef.current) inputPhoneMaskRef.current.focus();\n\t}\n\n\tfunction handleOpenCountryOptions() {\n\t\tsetShowCountryOptions(true);\n\t\tsetIsFocused(true);\n\t}\n\n\tfunction handleCloseCountryOptions() {\n\t\tsetShowCountryOptions(false);\n\t\tsetIsFocused(false);\n\t}\n\n\tfunction handleInputFocus() {\n\t\tsetIsFocused(true);\n\t}\n\n\tfunction handleInputBlur() {\n\t\tsetIsFocused(false);\n\t}\n\n\tfunction filterCountryFunction(country: CountryType) {\n\t\treturn country.name.toLowerCase().includes(search.toLowerCase());\n\t}\n\n\tfunction inputValue(props?: string) {\n\t\tlet returnValue = currentCountry.code;\n\t\treturnValue += removeNonNumeric(props \|\| value);\n\t\treturn returnValue;\n\t}\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<PhoneInputContainer\n\t\t\t\tdisabled={isDisabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t>\n\t\t\t\t<PhoneInputCountrySelector\n\t\t\t\t\tcurrentCountry={currentCountry}\n\t\t\t\t\tonClick={handleOpenCountryOptions}\n\t\t\t\t\tsize={size}\n\t\t\t\t/>\n\n\t\t\t\t<PhoneInputCountryOptionsContainer\n\t\t\t\t\tisOpen={isDisabled ? false : readOnly ? false : showCountryOptions}\n\t\t\t\t\tsearch={search}\n\t\t\t\t\tplaceholder={searchCountryPlaceholder}\n\t\t\t\t\tonSearch={setSearch}\n\t\t\t\t>\n\t\t\t\t\t{countries\n\t\t\t\t\t\t.filter((country) => filterCountryFunction(country))\n\t\t\t\t\t\t.map((country) => (\n\t\t\t\t\t\t\t<PhoneInputCountryOption\n\t\t\t\t\t\t\t\tkey={country.iso}\n\t\t\t\t\t\t\t\tcountry={country}\n\t\t\t\t\t\t\t\thandleChangeValue={() => {\n\t\t\t\t\t\t\t\t\tsetCurrentCountry(country);\n\t\t\t\t\t\t\t\t\tsetShowCountryOptions(false);\n\t\t\t\t\t\t\t\t\tsetValue(\"\");\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tisActive={country.iso === currentCountry.iso}\n\t\t\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t{countries.filter((country) => filterCountryFunction(country))\n\t\t\t\t\t\t.length === 0 && <p>{notFoundCountryText}</p>}\n\t\t\t\t</PhoneInputCountryOptionsContainer>\n\n\t\t\t\t<PhoneInputCountriesOverlay\n\t\t\t\t\tisOpen={isDisabled ? false : readOnly ? false : showCountryOptions}\n\t\t\t\t\tonClick={handleCloseCountryOptions}\n\t\t\t\t/>\n\n\t\t\t\t<PhoneInputMask\n\t\t\t\t\tid={phoneInputId}\n\t\t\t\t\tref={inputPhoneMaskRef}\n\t\t\t\t\treadonly={readOnly}\n\t\t\t\t\tcurrentCountry={currentCountry}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\tonBlur={handleInputBlur}\n\t\t\t\t\tonFocus={handleInputFocus}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\tsetValue(e);\n\t\t\t\t\t\tonChange?.(inputValue(e));\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tref={phoneInputRef}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={inputValue()}\n\t\t\t\t/>\n\t\t\t</PhoneInputContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { PhoneInput };\n"],"mappings":"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"}

package/dist/modules/components/popover/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/popover/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from \"react\";\n\nimport { useScrollLock } from \"../../hooks/useScrollLock\";\nimport \"./styles.css\";\n\ntype OrientationProps =\n\t\| \"bottomLeft\"\n\t\| \"bottomRight\"\n\t\| \"topLeft\"\n\t\| \"topRight\"\n\t\| \"top\"\n\t\| \"left\"\n\t\| \"bottom\"\n\t\| \"right\";\n\ntype PopoverProps = {\n\t/** Content rendered inside the floating panel. Required. /\n\tchildren: ReactNode;\n\t/* Trigger element — clicking it opens the popover. Required. /\n\tbutton: ReactNode;\n\t/* When true, clicking the popover content also closes it. @default false /\n\tcloseOnClick?: boolean;\n\t/\n\t Position of the floating panel relative to the trigger.\n\t * Options: `\"bottomLeft\"` \| `\"bottomRight\"` \| `\"topLeft\"` \| `\"topRight\"` \| `\"top\"` \| `\"bottom\"` \| `\"left\"` \| `\"right\"`.\n\t * @default \"bottomLeft\"\n\t /\n\torientation?: OrientationProps;\n\t/* Additional CSS class applied to the popover root element. /\n\tclassName?: string;\n};\n\n/\n Popover — floating panel that appears relative to a trigger element.\n \n Clicking outside the popover (or clicking the content when `closeOnClick` is set)\n * dismisses it. Locks body scroll while open.\n \n @param props.children - Content to display inside the panel. Required.\n * @param props.button - Trigger element that opens the popover. Required.\n * @param props.closeOnClick - Clicking the content also closes the popover. Default: false\n * @param props.orientation - Panel position relative to the trigger. Default: \"bottomLeft\"\n * @param props.className - Additional CSS class for the root element.\n \n @returns Popover JSX element with trigger, animated panel, and outside-click overlay.\n \n @example\n * ```tsx\n * // Basic dropdown menu\n * <Popover button={<Button>Options</Button>} closeOnClick>\n * <ul>\n * <li onClick={handleEdit}>Edit</li>\n * <li onClick={handleDelete}>Delete</li>\n * </ul>\n * </Popover>\n \n // User profile menu (bottom-right)\n * <Popover\n * button={<IconButton icon={User} aria-label=\"Account\" />}\n * orientation=\"bottomRight\"\n * closeOnClick\n * >\n * <nav>\n * <a href=\"/profile\">Profile</a>\n * <a href=\"/settings\">Settings</a>\n * <a href=\"/logout\">Sign out</a>\n * </nav>\n * </Popover>\n \n // Filter panel (top-left)\n * <Popover button={<Badge>Filters</Badge>} orientation=\"topLeft\">\n * <Input name=\"search\" placeholder=\"Search...\" />\n * <Select name=\"status\" options={statusOptions} />\n * </Popover>\n * ```\n */\n\nfunction Popover(props: PopoverProps) {\n\tconst {\n\t\tchildren,\n\t\tbutton,\n\t\tcloseOnClick,\n\t\tclassName: baseClassName = \"\",\n\t\torientation = \"bottomLeft\",\n\t} = props;\n\tconst [isOpen, setIsOpen] = useState(false);\n\n\tconst visible = isOpen ? \"visibleTrue\" : \"visibleFalse\";\n\tconst className = `arkynPopover ${orientation} ${visible} ${baseClassName}`;\n\n\tfunction handleOpenPopover() {\n\t\tif (!isOpen) setIsOpen(true);\n\t}\n\n\tuseScrollLock(isOpen);\n\n\treturn (\n\t\t<div className={className} onClick={handleOpenPopover}>\n\t\t\t{button}\n\n\t\t\t<div\n\t\t\t\tstyle={{ visibility: isOpen ? \"visible\" : \"hidden\" }}\n\t\t\t\tonClick={() => closeOnClick && setIsOpen(false)}\n\t\t\t\tclassName=\"arkynPopoverContent\"\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\n\t\t\t{isOpen && (\n\t\t\t\t<div onClick={() => setIsOpen(false)} className=\"arkynPopoverOverlay\" />\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\nexport { Popover };\n"],"mappings":";;;;;AA6EA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,aACA,WACA,iBACA,WAAW,IAAgB,IAC3B,iBAAc,iBACX,GACE,CAAC,GAAQ,KAAa,EAAS,EAAK,GAGpC,IAAY,gBAAgB,EAAY,GAD9B,IAAS,gBAAgB,eACgB,GAAG;CAE5D,SAAS,IAAoB;EAC5B,AAAK,KAAQ,EAAU,EAAI;CAC5B;CAIA,OAFA,EAAc,CAAM,GAGnB,kBAAC,OAAD;EAAgB;EAAW,SAAS;YAApC;GACE;GAED,kBAAC,OAAD;IACC,OAAO,EAAE,YAAY,IAAS,YAAY,SAAS;IACnD,eAAe,KAAgB,EAAU,EAAK;IAC9C,WAAU;IAET;GACG,CAAA;GAEJ,KACA,kBAAC,OAAD;IAAK,eAAe,EAAU,EAAK;IAAG,WAAU;GAAuB,CAAA;EAEpE;;AAEP"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/popover/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from \"react\";\n\nimport { useScrollLock } from \"../../hooks/useScrollLock\";\nimport \"./styles.css\";\n\ntype OrientationProps =\n\t\| \"bottomLeft\"\n\t\| \"bottomRight\"\n\t\| \"topLeft\"\n\t\| \"topRight\"\n\t\| \"top\"\n\t\| \"left\"\n\t\| \"bottom\"\n\t\| \"right\";\n\ntype PopoverProps = {\n\t/** Content rendered inside the floating panel. Required. /\n\tchildren: ReactNode;\n\t/* Trigger element, clicking it opens the popover. Required. /\n\tbutton: ReactNode;\n\t/* When true, clicking the popover content also closes it. @default false /\n\tcloseOnClick?: boolean;\n\t/\n\t Position of the floating panel relative to the trigger.\n\t * Options: `\"bottomLeft\"` \| `\"bottomRight\"` \| `\"topLeft\"` \| `\"topRight\"` \| `\"top\"` \| `\"bottom\"` \| `\"left\"` \| `\"right\"`.\n\t * @default \"bottomLeft\"\n\t /\n\torientation?: OrientationProps;\n\t/* Additional CSS class applied to the popover root element. /\n\tclassName?: string;\n};\n\n/\n Popover, floating panel that appears relative to a trigger element.\n \n Clicking outside the popover (or clicking the content when `closeOnClick` is set)\n * dismisses it. Locks body scroll while open.\n \n @param props.children - Content to display inside the panel. Required.\n * @param props.button - Trigger element that opens the popover. Required.\n * @param props.closeOnClick - Clicking the content also closes the popover. Default: false\n * @param props.orientation - Panel position relative to the trigger. Default: \"bottomLeft\"\n * @param props.className - Additional CSS class for the root element.\n \n @returns Popover JSX element with trigger, animated panel, and outside-click overlay.\n \n @example\n * ```tsx\n * // Basic dropdown menu\n * <Popover button={<Button>Options</Button>} closeOnClick>\n * <ul>\n * <li onClick={handleEdit}>Edit</li>\n * <li onClick={handleDelete}>Delete</li>\n * </ul>\n * </Popover>\n \n // User profile menu (bottom-right)\n * <Popover\n * button={<IconButton icon={User} aria-label=\"Account\" />}\n * orientation=\"bottomRight\"\n * closeOnClick\n * >\n * <nav>\n * <a href=\"/profile\">Profile</a>\n * <a href=\"/settings\">Settings</a>\n * <a href=\"/logout\">Sign out</a>\n * </nav>\n * </Popover>\n \n // Filter panel (top-left)\n * <Popover button={<Badge>Filters</Badge>} orientation=\"topLeft\">\n * <Input name=\"search\" placeholder=\"Search...\" />\n * <Select name=\"status\" options={statusOptions} />\n * </Popover>\n * ```\n */\n\nfunction Popover(props: PopoverProps) {\n\tconst {\n\t\tchildren,\n\t\tbutton,\n\t\tcloseOnClick,\n\t\tclassName: baseClassName = \"\",\n\t\torientation = \"bottomLeft\",\n\t} = props;\n\tconst [isOpen, setIsOpen] = useState(false);\n\n\tconst visible = isOpen ? \"visibleTrue\" : \"visibleFalse\";\n\tconst className = `arkynPopover ${orientation} ${visible} ${baseClassName}`;\n\n\tfunction handleOpenPopover() {\n\t\tif (!isOpen) setIsOpen(true);\n\t}\n\n\tuseScrollLock(isOpen);\n\n\treturn (\n\t\t<div className={className} onClick={handleOpenPopover}>\n\t\t\t{button}\n\n\t\t\t<div\n\t\t\t\tstyle={{ visibility: isOpen ? \"visible\" : \"hidden\" }}\n\t\t\t\tonClick={() => closeOnClick && setIsOpen(false)}\n\t\t\t\tclassName=\"arkynPopoverContent\"\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\n\t\t\t{isOpen && (\n\t\t\t\t<div onClick={() => setIsOpen(false)} className=\"arkynPopoverOverlay\" />\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\nexport { Popover };\n"],"mappings":";;;;;AA6EA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,aACA,WACA,iBACA,WAAW,IAAgB,IAC3B,iBAAc,iBACX,GACE,CAAC,GAAQ,KAAa,EAAS,EAAK,GAGpC,IAAY,gBAAgB,EAAY,GAD9B,IAAS,gBAAgB,eACgB,GAAG;CAE5D,SAAS,IAAoB;EAC5B,AAAK,KAAQ,EAAU,EAAI;CAC5B;CAIA,OAFA,EAAc,CAAM,GAGnB,kBAAC,OAAD;EAAgB;EAAW,SAAS;YAApC;GACE;GAED,kBAAC,OAAD;IACC,OAAO,EAAE,YAAY,IAAS,YAAY,SAAS;IACnD,eAAe,KAAgB,EAAU,EAAK;IAC9C,WAAU;IAET;GACG,CAAA;GAEJ,KACA,kBAAC,OAAD;IAAK,eAAe,EAAU,EAAK;IAAG,WAAU;GAAuB,CAAA;EAEpE;;AAEP"}

package/dist/modules/components/radio/radioBox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/radio/radioBox/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\n\nimport { useRadioGroup } from \"../radioContext\";\nimport \"./styles.css\";\n\ntype RadioBoxProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n\t/** Value submitted to the form when this option is selected. Required. /\n\tvalue: string;\n\t/* Applies error styling. Inherited from `RadioGroup` when not set. /\n\tisError?: boolean;\n\t/* Size variant. Inherits from `RadioGroup` when not set. /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n};\n\n/\n RadioBox — individual option inside a `RadioGroup`. Renders as a `<label>` + hidden `<button>` pair.\n \n Reads active value, size, error state, and disabled state from `RadioGroup` context.\n * Must be used as a direct child of `RadioGroup`.\n \n @param props.value - Option value. Required.\n * @param props.children - Option label content (text, icons, or rich markup).\n * @param props.disabled - Disables this option (group can also disable all options).\n * @param props.size - Size override. Inherits from group by default.\n \n ...Other valid HTML `<button>` properties\n \n @returns RadioBox JSX element.\n \n @example\n * ```tsx\n * <RadioGroup name=\"plan\" label=\"Choose a plan\" onChange={setPlan}>\n * <RadioBox value=\"basic\">Basic — $9/mo</RadioBox>\n * <RadioBox value=\"pro\">Pro — $29/mo</RadioBox>\n * <RadioBox value=\"enterprise\" disabled>Enterprise — contact us</RadioBox>\n * </RadioGroup>\n * ```\n */\n\nfunction RadioBox(props: RadioBoxProps) {\n\tconst {\n\t\tvalue: componentValue,\n\t\tsize: componentSize,\n\t\tdisabled,\n\t\tchildren,\n\t\tclassName: baseClassName = \"\",\n\t\tonClick,\n\t\tonFocus,\n\t\t...rest\n\t} = props;\n\n\tconst {\n\t\thandleChange,\n\t\tsize: groupSize,\n\t\tvalue,\n\t\tisError,\n\t\tdisabled: groupDisabled,\n\t} = useRadioGroup();\n\n\tconst isChecked = value === componentValue;\n\tconst size = componentSize \|\| groupSize;\n\n\tconst isDisabled = disabled \|\| groupDisabled;\n\n\tconst checkedClass = isChecked ? \"checkedTrue\" : \"checkedFalse\";\n\tconst errorClass = isError ? \"errorTrue\" : \"errorFalse\";\n\tconst disabledClass = isDisabled ? \"disabledTrue\" : \"disabledFalse\";\n\tconst className = `arkynRadioBox ${size} ${checkedClass} ${errorClass} ${disabledClass} ${baseClassName}`;\n\n\tfunction handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n\t\tonClick?.(event);\n\t\thandleChange(componentValue);\n\t}\n\n\tfunction handleFocus(event: React.FocusEvent<HTMLButtonElement>) {\n\t\tonFocus?.(event);\n\t\thandleChange(componentValue);\n\t}\n\n\treturn (\n\t\t<label className={className.trim()}>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tdisabled={isDisabled}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tonFocus={handleFocus}\n\t\t\t\t{...rest}\n\t\t\t/>\n\n\t\t\t{children}\n\t\t</label>\n\t);\n}\n\nexport { RadioBox };\n"],"mappings":";;;;AAuCA,SAAS,EAAS,GAAsB;CACvC,IAAM,EACL,OAAO,GACP,MAAM,GACN,aACA,aACA,WAAW,IAAgB,IAC3B,YACA,YACA,GAAG,MACA,GAEE,EACL,iBACA,MAAM,GACN,UACA,YACA,UAAU,MACP,EAAc,GAEZ,IAAY,MAAU,GACtB,IAAO,KAAiB,GAExB,IAAa,KAAY,GAKzB,IAAY,iBAAiB,EAAK,GAHnB,IAAY,gBAAgB,eAGO,GAFrC,IAAU,cAAc,aAE2B,GADhD,IAAa,iBAAiB,gBACmC,GAAG;CAE1F,SAAS,EAAY,GAA4C;EAEhE,AADA,IAAU,CAAK,GACf,EAAa,CAAc;CAC5B;CAEA,SAAS,EAAY,GAA4C;EAEhE,AADA,IAAU,CAAK,GACf,EAAa,CAAc;CAC5B;CAEA,OACC,kBAAC,SAAD;EAAO,WAAW,EAAU,KAAK;YAAjC,CACC,kBAAC,UAAD;GACC,MAAK;GACL,UAAU;GACV,SAAS;GACT,SAAS;GACT,GAAI;EACJ,CAAA,GAEA,CACK;;AAET"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/radio/radioBox/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\n\nimport { useRadioGroup } from \"../radioContext\";\nimport \"./styles.css\";\n\ntype RadioBoxProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n\t/** Value submitted to the form when this option is selected. Required. /\n\tvalue: string;\n\t/* Applies error styling. Inherited from `RadioGroup` when not set. /\n\tisError?: boolean;\n\t/* Size variant. Inherits from `RadioGroup` when not set. /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n};\n\n/\n RadioBox, individual option inside a `RadioGroup`. Renders as a `<label>` + hidden `<button>` pair.\n \n Reads active value, size, error state, and disabled state from `RadioGroup` context.\n * Must be used as a direct child of `RadioGroup`.\n \n @param props.value - Option value. Required.\n * @param props.children - Option label content (text, icons, or rich markup).\n * @param props.disabled - Disables this option (group can also disable all options).\n * @param props.size - Size override. Inherits from group by default.\n \n ...Other valid HTML `<button>` properties\n \n @returns RadioBox JSX element.\n \n @example\n * ```tsx\n * <RadioGroup name=\"plan\" label=\"Choose a plan\" onChange={setPlan}>\n * <RadioBox value=\"basic\">Basic, $9/mo</RadioBox>\n * <RadioBox value=\"pro\">Pro, $29/mo</RadioBox>\n * <RadioBox value=\"enterprise\" disabled>Enterprise, contact us</RadioBox>\n * </RadioGroup>\n * ```\n */\n\nfunction RadioBox(props: RadioBoxProps) {\n\tconst {\n\t\tvalue: componentValue,\n\t\tsize: componentSize,\n\t\tdisabled,\n\t\tchildren,\n\t\tclassName: baseClassName = \"\",\n\t\tonClick,\n\t\tonFocus,\n\t\t...rest\n\t} = props;\n\n\tconst {\n\t\thandleChange,\n\t\tsize: groupSize,\n\t\tvalue,\n\t\tisError,\n\t\tdisabled: groupDisabled,\n\t} = useRadioGroup();\n\n\tconst isChecked = value === componentValue;\n\tconst size = componentSize \|\| groupSize;\n\n\tconst isDisabled = disabled \|\| groupDisabled;\n\n\tconst checkedClass = isChecked ? \"checkedTrue\" : \"checkedFalse\";\n\tconst errorClass = isError ? \"errorTrue\" : \"errorFalse\";\n\tconst disabledClass = isDisabled ? \"disabledTrue\" : \"disabledFalse\";\n\tconst className = `arkynRadioBox ${size} ${checkedClass} ${errorClass} ${disabledClass} ${baseClassName}`;\n\n\tfunction handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n\t\tonClick?.(event);\n\t\thandleChange(componentValue);\n\t}\n\n\tfunction handleFocus(event: React.FocusEvent<HTMLButtonElement>) {\n\t\tonFocus?.(event);\n\t\thandleChange(componentValue);\n\t}\n\n\treturn (\n\t\t<label className={className.trim()}>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tdisabled={isDisabled}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tonFocus={handleFocus}\n\t\t\t\t{...rest}\n\t\t\t/>\n\n\t\t\t{children}\n\t\t</label>\n\t);\n}\n\nexport { RadioBox };\n"],"mappings":";;;;AAuCA,SAAS,EAAS,GAAsB;CACvC,IAAM,EACL,OAAO,GACP,MAAM,GACN,aACA,aACA,WAAW,IAAgB,IAC3B,YACA,YACA,GAAG,MACA,GAEE,EACL,iBACA,MAAM,GACN,UACA,YACA,UAAU,MACP,EAAc,GAEZ,IAAY,MAAU,GACtB,IAAO,KAAiB,GAExB,IAAa,KAAY,GAKzB,IAAY,iBAAiB,EAAK,GAHnB,IAAY,gBAAgB,eAGO,GAFrC,IAAU,cAAc,aAE2B,GADhD,IAAa,iBAAiB,gBACmC,GAAG;CAE1F,SAAS,EAAY,GAA4C;EAEhE,AADA,IAAU,CAAK,GACf,EAAa,CAAc;CAC5B;CAEA,SAAS,EAAY,GAA4C;EAEhE,AADA,IAAU,CAAK,GACf,EAAa,CAAc;CAC5B;CAEA,OACC,kBAAC,SAAD;EAAO,WAAW,EAAU,KAAK;YAAjC,CACC,kBAAC,UAAD;GACC,MAAK;GACL,UAAU;GACV,SAAS;GACT,SAAS;GACT,GAAI;EACJ,CAAA,GAEA,CACK;;AAET"}

package/dist/modules/components/radio/radioGroup/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/radio/radioGroup/index.tsx"],"sourcesContent":["import { type HTMLAttributes, useState } from \"react\";\n\nimport { useForm } from \"../../../hooks/useForm\";\nimport { FieldTemplate } from \"../../../services/fieldTemplate\";\n\nimport { RadioProvider } from \"../radioContext\";\nimport \"./styles.css\";\n\ntype RadioGroupProps = Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> & {\n\t/** Field name used for form submission. Required. /\n\tname: string;\n\t/* Label displayed above the group. /\n\tlabel?: string;\n\t/* Appends an asterisk to the label. @default false /\n\tshowAsterisk?: boolean;\n\t/* Error message shown below the group. Overrides `fieldErrors[name]` from `FormProvider`. /\n\terrorMessage?: string;\n\t/* Controlled selected value. /\n\tvalue?: string;\n\t/* Initial selected value (uncontrolled). @default \"\" /\n\tdefaultValue?: string;\n\t/* Callback fired when the selected option changes. /\n\tonChange?: (value: string) => void;\n\t/* Size variant applied to all `RadioBox` children. @default \"md\" /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n\t/* Disables all `RadioBox` children. @default false /\n\tdisabled?: boolean;\n\t/* When `true`, skips the `FieldTemplate` wrapper (label, error message). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/* Layout direction of the `FieldWrapper`. @default \"horizontal\" /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\n/\n RadioGroup — managed group of `RadioBox` options with form integration.\n \n Renders a hidden `<input>` for native form submission. Reads `fieldErrors[name]` from\n * the nearest `FormProvider` when no `errorMessage` is explicitly provided.\n \n @param props.name - Form field name. Required.\n * @param props.label - Label displayed above the group.\n * @param props.showAsterisk - Appends `` to the label. Default: false\n @param props.value - Controlled selection.\n * @param props.defaultValue - Initial selection (uncontrolled). Default: `\"\"`\n * @param props.onChange - Called with the newly selected value.\n * @param props.size - Size for all child `RadioBox` elements. Default: `\"md\"`\n * @param props.disabled - Disables all options. Default: false\n * @param props.errorMessage - Validation error message.\n * @param props.unShowFieldTemplate - Omit label/error wrapper. Default: false\n \n ...Other valid HTML `<div>` properties\n \n @returns RadioGroup JSX element.\n \n @example\n * ```tsx\n * // Uncontrolled with label\n * <RadioGroup name=\"gender\" label=\"Gender\" showAsterisk defaultValue=\"male\">\n * <RadioBox value=\"male\">Male</RadioBox>\n * <RadioBox value=\"female\">Female</RadioBox>\n * <RadioBox value=\"other\">Other</RadioBox>\n * </RadioGroup>\n \n // Controlled with change handler\n * <RadioGroup name=\"plan\" label=\"Subscription plan\" value={plan} onChange={setPlan}>\n * <RadioBox value=\"basic\">Basic — $9/mo</RadioBox>\n * <RadioBox value=\"pro\">Pro — $29/mo</RadioBox>\n * </RadioGroup>\n * ```\n */\n\nfunction RadioGroup(props: RadioGroupProps) {\n\tconst {\n\t\tdefaultValue = \"\",\n\t\tname,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\terrorMessage: baseErrorMessage,\n\t\tvalue: forceValue,\n\t\tonChange,\n\t\tsize = \"md\",\n\t\tclassName: wrapperClassName = \"\",\n\t\tdisabled = false,\n\t\tunShowFieldTemplate = false,\n\t\torientation = \"vertical\",\n\t\t...rest\n\t} = props;\n\n\tconst [value, setValue] = useState(defaultValue);\n\tconst { fieldErrors } = useForm();\n\n\tfunction handleChange(value: string) {\n\t\tsetValue(value);\n\t\tif (onChange) onChange(value);\n\t}\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst className = `arkynRadioGroup ${size}`;\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<RadioProvider\n\t\t\t\tisError={isError}\n\t\t\t\tsize={size}\n\t\t\t\tvalue={forceValue \|\| value}\n\t\t\t\thandleChange={handleChange}\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tstyle={{ display: \"none\" }}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\treadOnly\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={forceValue \|\| value}\n\t\t\t\t/>\n\n\t\t\t\t<div className={className.trim()} {...rest} />\n\t\t\t</RadioProvider>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { RadioGroup };\n"],"mappings":";;;;;;;AAuEA,SAAS,EAAW,GAAwB;CAC3C,IAAM,EACL,kBAAe,IACf,SACA,UACA,iBACA,cAAc,GACd,OAAO,GACP,aACA,UAAO,MACP,WAAW,IAAmB,IAC9B,cAAW,IACX,yBAAsB,IACtB,iBAAc,YACd,GAAG,MACA,GAEE,CAAC,GAAO,KAAY,EAAS,CAAY,GACzC,EAAE,mBAAgB,EAAQ;CAEhC,SAAS,EAAa,GAAe;EAEpC,AADA,EAAS,CAAK,GACV,KAAU,EAAS,CAAK;CAC7B;CAEA,IAAM,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAY,mBAAmB;CAErC,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,GAAD;GACU;GACH;GACN,OAAO,KAAc;GACP;GACJ;aALX,CAOC,kBAAC,SAAD;IACC,OAAO,EAAE,SAAS,OAAO;IACzB,MAAK;IACL,UAAA;IACM;IACN,OAAO,KAAc;GACrB,CAAA,GAED,kBAAC,OAAD;IAAK,WAAW,EAAU,KAAK;IAAG,GAAI;GAAO,CAAA,CAC/B;;CACD,CAAA;AAEjB"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/radio/radioGroup/index.tsx"],"sourcesContent":["import { type HTMLAttributes, useState } from \"react\";\n\nimport { useForm } from \"../../../hooks/useForm\";\nimport { FieldTemplate } from \"../../../services/fieldTemplate\";\n\nimport { RadioProvider } from \"../radioContext\";\nimport \"./styles.css\";\n\ntype RadioGroupProps = Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> & {\n\t/** Field name used for form submission. Required. /\n\tname: string;\n\t/* Label displayed above the group. /\n\tlabel?: string;\n\t/* Appends an asterisk to the label. @default false /\n\tshowAsterisk?: boolean;\n\t/* Error message shown below the group. Overrides `fieldErrors[name]` from `FormProvider`. /\n\terrorMessage?: string;\n\t/* Controlled selected value. /\n\tvalue?: string;\n\t/* Initial selected value (uncontrolled). @default \"\" /\n\tdefaultValue?: string;\n\t/* Callback fired when the selected option changes. /\n\tonChange?: (value: string) => void;\n\t/* Size variant applied to all `RadioBox` children. @default \"md\" /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n\t/* Disables all `RadioBox` children. @default false /\n\tdisabled?: boolean;\n\t/* When `true`, skips the `FieldTemplate` wrapper (label, error message). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/* Layout direction of the `FieldWrapper`. @default \"horizontal\" /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\n/\n RadioGroup, managed group of `RadioBox` options with form integration.\n \n Renders a hidden `<input>` for native form submission. Reads `fieldErrors[name]` from\n * the nearest `FormProvider` when no `errorMessage` is explicitly provided.\n \n @param props.name - Form field name. Required.\n * @param props.label - Label displayed above the group.\n * @param props.showAsterisk - Appends `` to the label. Default: false\n @param props.value - Controlled selection.\n * @param props.defaultValue - Initial selection (uncontrolled). Default: `\"\"`\n * @param props.onChange - Called with the newly selected value.\n * @param props.size - Size for all child `RadioBox` elements. Default: `\"md\"`\n * @param props.disabled - Disables all options. Default: false\n * @param props.errorMessage - Validation error message.\n * @param props.unShowFieldTemplate - Omit label/error wrapper. Default: false\n \n ...Other valid HTML `<div>` properties\n \n @returns RadioGroup JSX element.\n \n @example\n * ```tsx\n * // Uncontrolled with label\n * <RadioGroup name=\"gender\" label=\"Gender\" showAsterisk defaultValue=\"male\">\n * <RadioBox value=\"male\">Male</RadioBox>\n * <RadioBox value=\"female\">Female</RadioBox>\n * <RadioBox value=\"other\">Other</RadioBox>\n * </RadioGroup>\n \n // Controlled with change handler\n * <RadioGroup name=\"plan\" label=\"Subscription plan\" value={plan} onChange={setPlan}>\n * <RadioBox value=\"basic\">Basic, $9/mo</RadioBox>\n * <RadioBox value=\"pro\">Pro, $29/mo</RadioBox>\n * </RadioGroup>\n * ```\n */\n\nfunction RadioGroup(props: RadioGroupProps) {\n\tconst {\n\t\tdefaultValue = \"\",\n\t\tname,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\terrorMessage: baseErrorMessage,\n\t\tvalue: forceValue,\n\t\tonChange,\n\t\tsize = \"md\",\n\t\tclassName: wrapperClassName = \"\",\n\t\tdisabled = false,\n\t\tunShowFieldTemplate = false,\n\t\torientation = \"vertical\",\n\t\t...rest\n\t} = props;\n\n\tconst [value, setValue] = useState(defaultValue);\n\tconst { fieldErrors } = useForm();\n\n\tfunction handleChange(value: string) {\n\t\tsetValue(value);\n\t\tif (onChange) onChange(value);\n\t}\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst className = `arkynRadioGroup ${size}`;\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<RadioProvider\n\t\t\t\tisError={isError}\n\t\t\t\tsize={size}\n\t\t\t\tvalue={forceValue \|\| value}\n\t\t\t\thandleChange={handleChange}\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tstyle={{ display: \"none\" }}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\treadOnly\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={forceValue \|\| value}\n\t\t\t\t/>\n\n\t\t\t\t<div className={className.trim()} {...rest} />\n\t\t\t</RadioProvider>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { RadioGroup };\n"],"mappings":";;;;;;;AAuEA,SAAS,EAAW,GAAwB;CAC3C,IAAM,EACL,kBAAe,IACf,SACA,UACA,iBACA,cAAc,GACd,OAAO,GACP,aACA,UAAO,MACP,WAAW,IAAmB,IAC9B,cAAW,IACX,yBAAsB,IACtB,iBAAc,YACd,GAAG,MACA,GAEE,CAAC,GAAO,KAAY,EAAS,CAAY,GACzC,EAAE,mBAAgB,EAAQ;CAEhC,SAAS,EAAa,GAAe;EAEpC,AADA,EAAS,CAAK,GACV,KAAU,EAAS,CAAK;CAC7B;CAEA,IAAM,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAY,mBAAmB;CAErC,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,GAAD;GACU;GACH;GACN,OAAO,KAAc;GACP;GACJ;aALX,CAOC,kBAAC,SAAD;IACC,OAAO,EAAE,SAAS,OAAO;IACzB,MAAK;IACL,UAAA;IACM;IACN,OAAO,KAAc;GACrB,CAAA,GAED,kBAAC,OAAD;IAAK,WAAW,EAAU,KAAK;IAAG,GAAI;GAAO,CAAA,CAC/B;;CACD,CAAA;AAEjB"}

package/dist/modules/components/richText/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/richText/index.tsx"],"sourcesContent":["import isHotkey from \"is-hotkey\";\nimport {\n\tAlignCenter,\n\tAlignJustify,\n\tAlignLeft,\n\tAlignRight,\n\tBold,\n\tCode,\n\tHeading1,\n\tHeading2,\n\tItalic,\n\tQuote,\n\tUnderline,\n} from \"lucide-react\";\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\";\nimport { createEditor, type Descendant } from \"slate\";\nimport { withHistory } from \"slate-history\";\nimport { Editable, Slate, withReact } from \"slate-react\";\nimport { useForm } from \"../../hooks/useForm\";\nimport { extractTextFromNode } from \"../../services/extractTextFromNode\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { toggleMark } from \"../../services/toggleMark\";\nimport { hotKeys, initialValue } from \"../../templates/richTextTemplates\";\nimport type {\n\tRichTextHiddenButtonKey,\n\tRichTextProps,\n} from \"../../types/richTextTypes\";\nimport { BlockButton } from \"./blockButton\";\nimport { Element } from \"./element\";\nimport { InsertImage } from \"./insertImage\";\nimport { InsertVideo } from \"./insertVideo\";\nimport { Leaf } from \"./leaf\";\nimport { MarkButton } from \"./markButton\";\nimport { Toolbar } from \"./toolbar\";\nimport \"./styles.css\";\n\n/*\n RichText — WYSIWYG rich-text editor built on Slate.js with a configurable toolbar.\n \n Toolbar features: bold, italic, underline, code, H1/H2, block quote, alignment (left/center/right/justify), image and video insertion.\n \n Editor content is stored as a Slate JSON string in a hidden `<input>` for form submission.\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 editor.\n * @param props.hiddenButtons - Toolbar button keys to hide (e.g. `[\"image\", \"code\"]`).\n * @param props.imageConfig - Enables image insertion; contains the upload endpoint and modal labels.\n * @param props.defaultValue - Initial editor content as a Slate JSON string. Default: \"[]\"\n * @param props.maxLimit - Maximum character count. Default: 10000\n * @param props.enforceCharacterLimit - Prevents typing past `maxLimit`. Default: false\n * @param props.onChangeCharactersCount - Callback fired on every keystroke — receives the current character count.\n * @param props.onChange - Callback fired when editor content changes — receives the Slate `Descendant[]`.\n * @param props.baseErrorMessage - Custom error message (overrides `useForm` context error).\n * @param props.isError - Forces the error visual state.\n * @param props.id - Custom id for the editable area element.\n * @param props.showAsterisk - Appends `` to the label.\n @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns RichText JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <RichText name=\"content\" />\n \n // With character limit and hidden toolbar buttons\n * <RichText\n * name=\"description\"\n * label=\"Description\"\n * maxLimit={500}\n * enforceCharacterLimit\n * hiddenButtons={[\"image\", \"video\", \"code\"]}\n * onChangeCharactersCount={(n) => setCharCount(n)}\n * />\n \n // With image upload support\n * <RichText\n * name=\"article\"\n * label=\"Article Body\"\n * imageConfig={{ action: \"/api/upload\" }}\n * />\n * ```\n */\n\nfunction RichText(props: RichTextProps) {\n\tconst {\n\t\tname,\n\t\thiddenButtons,\n\t\timageConfig,\n\t\tvideoConfig,\n\t\tclassName: wrapperClassName = \"\",\n\t\tdefaultValue = \"[]\",\n\t\tenforceCharacterLimit = false,\n\t\tonChangeCharactersCount,\n\t\tbaseErrorMessage,\n\t\tmaxLimit = 10000,\n\t\tonChange,\n\t\tisError: baseIsError,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tid,\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t} = props;\n\n\tconst editor = useMemo(() => withHistory(withReact(createEditor())), []);\n\n\tconst { fieldErrors } = useForm();\n\n\tconst defaultNodes = useMemo((): Descendant[] => {\n\t\ttry {\n\t\t\tconst parsedNodes = JSON.parse(defaultValue);\n\t\t\tif (!Array.isArray(parsedNodes) \|\| parsedNodes.length === 0) {\n\t\t\t\treturn structuredClone(initialValue);\n\t\t\t}\n\n\t\t\tconst isValidNodes = parsedNodes.every(\n\t\t\t\t(node) =>\n\t\t\t\t\ttypeof node === \"object\" &&\n\t\t\t\t\tnode !== null &&\n\t\t\t\t\t\"type\" in node &&\n\t\t\t\t\t\"children\" in node,\n\t\t\t);\n\n\t\t\treturn isValidNodes ? parsedNodes : structuredClone(initialValue);\n\t\t} catch (_error) {\n\t\t\treturn structuredClone(initialValue);\n\t\t}\n\t}, [defaultValue]);\n\n\tconst textFromNodes = extractTextFromNode(defaultNodes);\n\n\tconst [charactersCount, setCharactersCount] = useState(textFromNodes.length);\n\tconst [inputValue, setInputValue] = useState(\n\t\tJSON.stringify(defaultNodes) \|\| \"[]\",\n\t);\n\n\tconst [onFocus, setOnFocus] = useState(false);\n\n\tconst ref = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = baseIsError \|\| !!errorMessage;\n\n\tconst renderLeaf = useCallback(Leaf, []);\n\tconst renderElement = useCallback(Element, []);\n\n\tfunction handleChange(value: Descendant[]) {\n\t\tconst text = extractTextFromNode(value);\n\n\t\tsetCharactersCount(text.length);\n\t\tonChangeCharactersCount?.(text.length);\n\n\t\tif (enforceCharacterLimit && text.length >= maxLimit) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetInputValue(JSON.stringify(value));\n\t\tonChange?.(value);\n\t}\n\n\tconst focusClass = onFocus ? \"focusTrue\" : \"focusFalse\";\n\tconst errorClass = isError\n\t\t? \"errorTrue\"\n\t\t: maxLimit < charactersCount\n\t\t\t? \"errorTrue\"\n\t\t\t: \"errorFalse\";\n\n\tconst className = `arkynRichText ${errorClass} ${focusClass}`;\n\n\tconst restatesCharacters = maxLimit - charactersCount;\n\n\tfunction buttonIsNotHidden(format: RichTextHiddenButtonKey) {\n\t\treturn !hiddenButtons?.includes(format);\n\t}\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<Slate\n\t\t\t\teditor={editor}\n\t\t\t\tinitialValue={defaultNodes}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonValueChange={handleChange}\n\t\t\t>\n\t\t\t\t<div className={className}>\n\t\t\t\t\t<Toolbar>\n\t\t\t\t\t\t{buttonIsNotHidden(\"headingOne\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"headingOne\" icon={Heading1} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"headingTwo\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"headingTwo\" icon={Heading2} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"blockQuote\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"blockQuote\" icon={Quote} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"bold\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"bold\" icon={Bold} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"italic\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"italic\" icon={Italic} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"underline\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"underline\" icon={Underline} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"code\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"code\" icon={Code} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"left\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"left\" icon={AlignLeft} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"right\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"right\" icon={AlignRight} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"center\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"center\" icon={AlignCenter} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"justify\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"justify\" icon={AlignJustify} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{imageConfig && buttonIsNotHidden(\"image\") && (\n\t\t\t\t\t\t\t<InsertImage {...imageConfig} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"video\") && <InsertVideo {...videoConfig} />}\n\t\t\t\t\t</Toolbar>\n\n\t\t\t\t\t<Editable\n\t\t\t\t\t\tclassName=\"editorContainer\"\n\t\t\t\t\t\trenderElement={renderElement}\n\t\t\t\t\t\trenderLeaf={renderLeaf}\n\t\t\t\t\t\tspellCheck\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\tonFocus={() => setOnFocus(true)}\n\t\t\t\t\t\tonBlur={() => setOnFocus(false)}\n\t\t\t\t\t\tonKeyDown={(event) => {\n\t\t\t\t\t\t\tfor (const hotkey in hotKeys) {\n\t\t\t\t\t\t\t\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\t\t\t\t\t\t\t\tif (isHotkey(hotkey, event as any)) {\n\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\tconst mark = hotKeys[hotkey as keyof typeof hotKeys];\n\t\t\t\t\t\t\t\t\ttoggleMark(editor, mark);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{restatesCharacters < 0 && (\n\t\t\t\t\t\t<div className=\"restatesCharacters\">{restatesCharacters}</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={inputValue.slice(0, maxLimit)}\n\t\t\t\t/>\n\n\t\t\t\t<input type=\"hidden\" name={`${name}Count`} value={charactersCount} />\n\t\t\t</Slate>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { RichText };\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/richText/index.tsx"],"sourcesContent":["import isHotkey from \"is-hotkey\";\nimport {\n\tAlignCenter,\n\tAlignJustify,\n\tAlignLeft,\n\tAlignRight,\n\tBold,\n\tCode,\n\tHeading1,\n\tHeading2,\n\tItalic,\n\tQuote,\n\tUnderline,\n} from \"lucide-react\";\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\";\nimport { createEditor, type Descendant } from \"slate\";\nimport { withHistory } from \"slate-history\";\nimport { Editable, Slate, withReact } from \"slate-react\";\nimport { useForm } from \"../../hooks/useForm\";\nimport { extractTextFromNode } from \"../../services/extractTextFromNode\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { toggleMark } from \"../../services/toggleMark\";\nimport { hotKeys, initialValue } from \"../../templates/richTextTemplates\";\nimport type {\n\tRichTextHiddenButtonKey,\n\tRichTextProps,\n} from \"../../types/richTextTypes\";\nimport { BlockButton } from \"./blockButton\";\nimport { Element } from \"./element\";\nimport { InsertImage } from \"./insertImage\";\nimport { InsertVideo } from \"./insertVideo\";\nimport { Leaf } from \"./leaf\";\nimport { MarkButton } from \"./markButton\";\nimport { Toolbar } from \"./toolbar\";\nimport \"./styles.css\";\n\n/*\n RichText, WYSIWYG rich-text editor built on Slate.js with a configurable toolbar.\n \n Toolbar features: bold, italic, underline, code, H1/H2, block quote, alignment (left/center/right/justify), image and video insertion.\n \n Editor content is stored as a Slate JSON string in a hidden `<input>` for form submission.\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 editor.\n * @param props.hiddenButtons - Toolbar button keys to hide (e.g. `[\"image\", \"code\"]`).\n * @param props.imageConfig - Enables image insertion; contains the upload endpoint and modal labels.\n * @param props.defaultValue - Initial editor content as a Slate JSON string. Default: \"[]\"\n * @param props.maxLimit - Maximum character count. Default: 10000\n * @param props.enforceCharacterLimit - Prevents typing past `maxLimit`. Default: false\n * @param props.onChangeCharactersCount - Callback fired on every keystroke, receives the current character count.\n * @param props.onChange - Callback fired when editor content changes, receives the Slate `Descendant[]`.\n * @param props.baseErrorMessage - Custom error message (overrides `useForm` context error).\n * @param props.isError - Forces the error visual state.\n * @param props.id - Custom id for the editable area element.\n * @param props.showAsterisk - Appends `` to the label.\n @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns RichText JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <RichText name=\"content\" />\n \n // With character limit and hidden toolbar buttons\n * <RichText\n * name=\"description\"\n * label=\"Description\"\n * maxLimit={500}\n * enforceCharacterLimit\n * hiddenButtons={[\"image\", \"video\", \"code\"]}\n * onChangeCharactersCount={(n) => setCharCount(n)}\n * />\n \n // With image upload support\n * <RichText\n * name=\"article\"\n * label=\"Article Body\"\n * imageConfig={{ action: \"/api/upload\" }}\n * />\n * ```\n */\n\nfunction RichText(props: RichTextProps) {\n\tconst {\n\t\tname,\n\t\thiddenButtons,\n\t\timageConfig,\n\t\tvideoConfig,\n\t\tclassName: wrapperClassName = \"\",\n\t\tdefaultValue = \"[]\",\n\t\tenforceCharacterLimit = false,\n\t\tonChangeCharactersCount,\n\t\tbaseErrorMessage,\n\t\tmaxLimit = 10000,\n\t\tonChange,\n\t\tisError: baseIsError,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tid,\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t} = props;\n\n\tconst editor = useMemo(() => withHistory(withReact(createEditor())), []);\n\n\tconst { fieldErrors } = useForm();\n\n\tconst defaultNodes = useMemo((): Descendant[] => {\n\t\ttry {\n\t\t\tconst parsedNodes = JSON.parse(defaultValue);\n\t\t\tif (!Array.isArray(parsedNodes) \|\| parsedNodes.length === 0) {\n\t\t\t\treturn structuredClone(initialValue);\n\t\t\t}\n\n\t\t\tconst isValidNodes = parsedNodes.every(\n\t\t\t\t(node) =>\n\t\t\t\t\ttypeof node === \"object\" &&\n\t\t\t\t\tnode !== null &&\n\t\t\t\t\t\"type\" in node &&\n\t\t\t\t\t\"children\" in node,\n\t\t\t);\n\n\t\t\treturn isValidNodes ? parsedNodes : structuredClone(initialValue);\n\t\t} catch (_error) {\n\t\t\treturn structuredClone(initialValue);\n\t\t}\n\t}, [defaultValue]);\n\n\tconst textFromNodes = extractTextFromNode(defaultNodes);\n\n\tconst [charactersCount, setCharactersCount] = useState(textFromNodes.length);\n\tconst [inputValue, setInputValue] = useState(\n\t\tJSON.stringify(defaultNodes) \|\| \"[]\",\n\t);\n\n\tconst [onFocus, setOnFocus] = useState(false);\n\n\tconst ref = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = baseIsError \|\| !!errorMessage;\n\n\tconst renderLeaf = useCallback(Leaf, []);\n\tconst renderElement = useCallback(Element, []);\n\n\tfunction handleChange(value: Descendant[]) {\n\t\tconst text = extractTextFromNode(value);\n\n\t\tsetCharactersCount(text.length);\n\t\tonChangeCharactersCount?.(text.length);\n\n\t\tif (enforceCharacterLimit && text.length >= maxLimit) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetInputValue(JSON.stringify(value));\n\t\tonChange?.(value);\n\t}\n\n\tconst focusClass = onFocus ? \"focusTrue\" : \"focusFalse\";\n\tconst errorClass = isError\n\t\t? \"errorTrue\"\n\t\t: maxLimit < charactersCount\n\t\t\t? \"errorTrue\"\n\t\t\t: \"errorFalse\";\n\n\tconst className = `arkynRichText ${errorClass} ${focusClass}`;\n\n\tconst restatesCharacters = maxLimit - charactersCount;\n\n\tfunction buttonIsNotHidden(format: RichTextHiddenButtonKey) {\n\t\treturn !hiddenButtons?.includes(format);\n\t}\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<Slate\n\t\t\t\teditor={editor}\n\t\t\t\tinitialValue={defaultNodes}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonValueChange={handleChange}\n\t\t\t>\n\t\t\t\t<div className={className}>\n\t\t\t\t\t<Toolbar>\n\t\t\t\t\t\t{buttonIsNotHidden(\"headingOne\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"headingOne\" icon={Heading1} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"headingTwo\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"headingTwo\" icon={Heading2} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"blockQuote\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"blockQuote\" icon={Quote} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"bold\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"bold\" icon={Bold} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"italic\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"italic\" icon={Italic} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"underline\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"underline\" icon={Underline} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"code\") && (\n\t\t\t\t\t\t\t<MarkButton format=\"code\" icon={Code} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"left\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"left\" icon={AlignLeft} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"right\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"right\" icon={AlignRight} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"center\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"center\" icon={AlignCenter} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"justify\") && (\n\t\t\t\t\t\t\t<BlockButton format=\"justify\" icon={AlignJustify} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{imageConfig && buttonIsNotHidden(\"image\") && (\n\t\t\t\t\t\t\t<InsertImage {...imageConfig} />\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{buttonIsNotHidden(\"video\") && <InsertVideo {...videoConfig} />}\n\t\t\t\t\t</Toolbar>\n\n\t\t\t\t\t<Editable\n\t\t\t\t\t\tclassName=\"editorContainer\"\n\t\t\t\t\t\trenderElement={renderElement}\n\t\t\t\t\t\trenderLeaf={renderLeaf}\n\t\t\t\t\t\tspellCheck\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\tonFocus={() => setOnFocus(true)}\n\t\t\t\t\t\tonBlur={() => setOnFocus(false)}\n\t\t\t\t\t\tonKeyDown={(event) => {\n\t\t\t\t\t\t\tfor (const hotkey in hotKeys) {\n\t\t\t\t\t\t\t\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\t\t\t\t\t\t\t\tif (isHotkey(hotkey, event as any)) {\n\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\tconst mark = hotKeys[hotkey as keyof typeof hotKeys];\n\t\t\t\t\t\t\t\t\ttoggleMark(editor, mark);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{restatesCharacters < 0 && (\n\t\t\t\t\t\t<div className=\"restatesCharacters\">{restatesCharacters}</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={inputValue.slice(0, maxLimit)}\n\t\t\t\t/>\n\n\t\t\t\t<input type=\"hidden\" name={`${name}Count`} value={charactersCount} />\n\t\t\t</Slate>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { RichText };\n"],"mappings":"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"}

package/dist/modules/components/searchPlaces.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"searchPlaces.js","names":[],"sources":["../../../src/components/searchPlaces.tsx"],"sourcesContent":["import type { StandaloneSearchBoxProps } from \"@react-google-maps/api\";\nimport { StandaloneSearchBox } from \"@react-google-maps/api\";\nimport { type JSX, useState } from \"react\";\nimport { Input, type InputProps } from \"./input\";\n\ntype AddressComponentsType = {\n\tlong_name: string;\n\tshort_name: string;\n\ttypes: string[];\n}[];\n\n/** Structured address data extracted from a Google Places result. /\ntype PlaceData = {\n\t/* Street name (e.g. `\"Rua Exemplo\"`). /\n\tstreet: string;\n\t/* City name (e.g. `\"São Paulo\"`). /\n\tcity: string;\n\t/* Full state name (e.g. `\"São Paulo\"`). /\n\tstate: string;\n\t/* Neighborhood / district name. /\n\tneighborhood: string;\n\t/* Postal / ZIP code. /\n\tpostalCode: string;\n\t/* State abbreviation (e.g. `\"SP\"`). /\n\tstateShortName: string;\n\t/* Street number (e.g. `\"123\"`). /\n\tstreetNumber: string;\n\t/* Geographic coordinates of the place. /\n\tcoordinates: { lat: number; lng: number };\n};\n\ntype SearchPlacesProps = {\n\t/* Google Maps `StandaloneSearchBox` options (e.g. `componentRestrictions`, `bounds`). /\n\toptions?: StandaloneSearchBoxProps[\"options\"];\n\t/* Callback fired every time the input text changes. Receives the current string value. /\n\tonChange?: (e: string) => void;\n\t/\n\t Callback fired when the user selects a place from the autocomplete suggestions.\n\t * Receives a structured {@link PlaceData} object.\n\t /\n\tonPlaceChanged?: (e: PlaceData) => void;\n} & Omit<InputProps, \"onLoad\" \| \"onChange\" \| \"type\">;\n\n/\n SearchPlaces — text input with Google Places autocomplete that returns structured address data.\n \n Requires the Google Maps JavaScript API with the Places library to be loaded.\n * Built on `@react-google-maps/api`'s `StandaloneSearchBox`.\n \n @param props.options - Google Maps search box options (e.g. restrict by country).\n * @param props.onChange - Fires on every keystroke — receives the current text value.\n * @param props.onPlaceChanged - Fires when the user selects a suggestion — receives structured address data.\n \n ...Other valid `Input` properties (except `onLoad`, `onChange`, `type`)\n \n @returns SearchPlaces JSX element (an `Input` wrapped in `StandaloneSearchBox`).\n \n @example\n * ```tsx\n * <SearchPlaces\n * name=\"address\"\n * label=\"Address\"\n * placeholder=\"Start typing an address…\"\n * options={{ componentRestrictions: { country: \"br\" } }}\n * onChange={(v) => setRawAddress(v)}\n * onPlaceChanged={(place) => {\n * setAddress({\n * street: place.street,\n * city: place.city,\n * state: place.state,\n * postalCode: place.postalCode,\n * coordinates: place.coordinates,\n * });\n * }}\n * />\n * ```\n */\n\nfunction SearchPlaces(props: SearchPlacesProps): JSX.Element {\n\tconst { onChange, onPlaceChanged, options, ...rest } = props;\n\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tconst [searchBox, setSearchBox] = useState<any>(null);\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tconst handleLoad = (ref: any) => setSearchBox(ref);\n\n\tconst handlePlacesChanged = () => {\n\t\tconst places = searchBox?.getPlaces();\n\t\tconst place = places ? places[0] : null;\n\n\t\tconst address_components =\n\t\t\tplace?.address_components as AddressComponentsType;\n\n\t\tfunction findData(key: string) {\n\t\t\tconst data = address_components.find((item) => item.types[0] === key);\n\t\t\tif (data) return data.long_name;\n\t\t\treturn \"\";\n\t\t}\n\n\t\tfunction findDataShort(key: string) {\n\t\t\tconst data = address_components.find((item) => item.types[0] === key);\n\t\t\tif (data) return data.short_name;\n\t\t\treturn \"\";\n\t\t}\n\n\t\tfunction findDataByMultipleTypes(keys: string[]) {\n\t\t\tfor (const key of keys) {\n\t\t\t\tconst data = address_components.find((item) =>\n\t\t\t\t\titem.types.includes(key),\n\t\t\t\t);\n\t\t\t\tif (data) return data.long_name;\n\t\t\t}\n\t\t\treturn \"\";\n\t\t}\n\n\t\tif (place) {\n\t\t\tconst street = findData(\"route\");\n\t\t\tconst streetNumber = findData(\"street_number\");\n\t\t\tconst neighborhood = findDataByMultipleTypes([\n\t\t\t\t\"sublocality_level_1\",\n\t\t\t\t\"sublocality\",\n\t\t\t\t\"neighborhood\",\n\t\t\t]);\n\t\t\tconst city = findData(\"administrative_area_level_2\");\n\t\t\tconst state = findData(\"administrative_area_level_1\");\n\t\t\tconst stateShortName = findDataShort(\"administrative_area_level_1\");\n\t\t\tconst postalCode = findDataByMultipleTypes([\n\t\t\t\t\"postal_code\",\n\t\t\t\t\"postal_code_prefix\",\n\t\t\t]);\n\n\t\t\tconst lat = place.geometry?.location?.lat();\n\t\t\tconst lng = place.geometry?.location?.lng();\n\n\t\t\tconst sendPlace = {\n\t\t\t\tstreet,\n\t\t\t\tcity,\n\t\t\t\tstate,\n\t\t\t\tneighborhood,\n\t\t\t\tpostalCode,\n\t\t\t\tstreetNumber,\n\t\t\t\tstateShortName,\n\t\t\t\tcoordinates: { lat, lng },\n\t\t\t};\n\n\t\t\tonPlaceChanged?.(sendPlace);\n\t\t}\n\t};\n\n\treturn (\n\t\t<StandaloneSearchBox\n\t\t\tonLoad={handleLoad}\n\t\t\tonPlacesChanged={handlePlacesChanged}\n\t\t\toptions={options}\n\t\t>\n\t\t\t<Input\n\t\t\t\ttype=\"text\"\n\t\t\t\tautoComplete=\"off\"\n\t\t\t\tonChange={(e) => onChange?.(e.target.value)}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t</StandaloneSearchBox>\n\t);\n}\n\nexport { SearchPlaces };\n"],"mappings":";;;;;AA8EA,SAAS,EAAa,GAAuC;CAC5D,IAAM,EAAE,aAAU,mBAAgB,YAAS,GAAG,MAAS,GAGjD,CAAC,GAAW,KAAgB,EAAc,IAAI;CAmEpD,OACC,kBAAC,GAAD;EACC,SAnEkB,MAAa,EAAa,CAAG;EAoE/C,uBAlEgC;GACjC,IAAM,IAAS,GAAW,UAAU,GAC9B,IAAQ,IAAS,EAAO,KAAK,MAE7B,IACL,GAAO;GAER,SAAS,EAAS,GAAa;IAC9B,IAAM,IAAO,EAAmB,MAAM,MAAS,EAAK,MAAM,OAAO,CAAG;IAEpE,OADI,IAAa,EAAK,YACf;GACR;GAEA,SAAS,EAAc,GAAa;IACnC,IAAM,IAAO,EAAmB,MAAM,MAAS,EAAK,MAAM,OAAO,CAAG;IAEpE,OADI,IAAa,EAAK,aACf;GACR;GAEA,SAAS,EAAwB,GAAgB;IAChD,KAAK,IAAM,KAAO,GAAM;KACvB,IAAM,IAAO,EAAmB,MAAM,MACrC,EAAK,MAAM,SAAS,CAAG,CACxB;KACA,IAAI,GAAM,OAAO,EAAK;IACvB;IACA,OAAO;GACR;GAEA,IAAI,GAAO;IACV,IAAM,IAAS,EAAS,OAAO,GACzB,IAAe,EAAS,eAAe,GACvC,IAAe,EAAwB;KAC5C;KACA;KACA;IACD,CAAC,GACK,IAAO,EAAS,6BAA6B,GAC7C,IAAQ,EAAS,6BAA6B,GAC9C,IAAiB,EAAc,6BAA6B,GAS5D,IAAY;KACjB;KACA;KACA;KACA;KACA,YAbkB,EAAwB,CAC1C,eACA,oBACD,CAUC;KACA;KACA;KACA,aAAa;MAAE,KAXJ,EAAM,UAAU,UAAU,IAAI;MAWrB,KAVT,EAAM,UAAU,UAAU,IAAI;KAUjB;IACzB;IAEA,IAAiB,CAAS;GAC3B;EACD;EAMW;YAET,kBAAC,GAAD;GACC,MAAK;GACL,cAAa;GACb,WAAW,MAAM,IAAW,EAAE,OAAO,KAAK;GAC1C,GAAI;EACJ,CAAA;CACmB,CAAA;AAEvB"}
1	+ {"version":3,"file":"searchPlaces.js","names":[],"sources":["../../../src/components/searchPlaces.tsx"],"sourcesContent":["import type { StandaloneSearchBoxProps } from \"@react-google-maps/api\";\nimport { StandaloneSearchBox } from \"@react-google-maps/api\";\nimport { type JSX, useState } from \"react\";\nimport { Input, type InputProps } from \"./input\";\n\ntype AddressComponentsType = {\n\tlong_name: string;\n\tshort_name: string;\n\ttypes: string[];\n}[];\n\n/** Structured address data extracted from a Google Places result. /\ntype PlaceData = {\n\t/* Street name (e.g. `\"Rua Exemplo\"`). /\n\tstreet: string;\n\t/* City name (e.g. `\"São Paulo\"`). /\n\tcity: string;\n\t/* Full state name (e.g. `\"São Paulo\"`). /\n\tstate: string;\n\t/* Neighborhood / district name. /\n\tneighborhood: string;\n\t/* Postal / ZIP code. /\n\tpostalCode: string;\n\t/* State abbreviation (e.g. `\"SP\"`). /\n\tstateShortName: string;\n\t/* Street number (e.g. `\"123\"`). /\n\tstreetNumber: string;\n\t/* Geographic coordinates of the place. /\n\tcoordinates: { lat: number; lng: number };\n};\n\ntype SearchPlacesProps = {\n\t/* Google Maps `StandaloneSearchBox` options (e.g. `componentRestrictions`, `bounds`). /\n\toptions?: StandaloneSearchBoxProps[\"options\"];\n\t/* Callback fired every time the input text changes. Receives the current string value. /\n\tonChange?: (e: string) => void;\n\t/\n\t Callback fired when the user selects a place from the autocomplete suggestions.\n\t * Receives a structured {@link PlaceData} object.\n\t /\n\tonPlaceChanged?: (e: PlaceData) => void;\n} & Omit<InputProps, \"onLoad\" \| \"onChange\" \| \"type\">;\n\n/\n SearchPlaces, text input with Google Places autocomplete that returns structured address data.\n \n Requires the Google Maps JavaScript API with the Places library to be loaded.\n * Built on `@react-google-maps/api`'s `StandaloneSearchBox`.\n \n @param props.options - Google Maps search box options (e.g. restrict by country).\n * @param props.onChange - Fires on every keystroke, receives the current text value.\n * @param props.onPlaceChanged - Fires when the user selects a suggestion, receives structured address data.\n \n ...Other valid `Input` properties (except `onLoad`, `onChange`, `type`)\n \n @returns SearchPlaces JSX element (an `Input` wrapped in `StandaloneSearchBox`).\n \n @example\n * ```tsx\n * <SearchPlaces\n * name=\"address\"\n * label=\"Address\"\n * placeholder=\"Start typing an address…\"\n * options={{ componentRestrictions: { country: \"br\" } }}\n * onChange={(v) => setRawAddress(v)}\n * onPlaceChanged={(place) => {\n * setAddress({\n * street: place.street,\n * city: place.city,\n * state: place.state,\n * postalCode: place.postalCode,\n * coordinates: place.coordinates,\n * });\n * }}\n * />\n * ```\n */\n\nfunction SearchPlaces(props: SearchPlacesProps): JSX.Element {\n\tconst { onChange, onPlaceChanged, options, ...rest } = props;\n\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tconst [searchBox, setSearchBox] = useState<any>(null);\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\tconst handleLoad = (ref: any) => setSearchBox(ref);\n\n\tconst handlePlacesChanged = () => {\n\t\tconst places = searchBox?.getPlaces();\n\t\tconst place = places ? places[0] : null;\n\n\t\tconst address_components =\n\t\t\tplace?.address_components as AddressComponentsType;\n\n\t\tfunction findData(key: string) {\n\t\t\tconst data = address_components.find((item) => item.types[0] === key);\n\t\t\tif (data) return data.long_name;\n\t\t\treturn \"\";\n\t\t}\n\n\t\tfunction findDataShort(key: string) {\n\t\t\tconst data = address_components.find((item) => item.types[0] === key);\n\t\t\tif (data) return data.short_name;\n\t\t\treturn \"\";\n\t\t}\n\n\t\tfunction findDataByMultipleTypes(keys: string[]) {\n\t\t\tfor (const key of keys) {\n\t\t\t\tconst data = address_components.find((item) =>\n\t\t\t\t\titem.types.includes(key),\n\t\t\t\t);\n\t\t\t\tif (data) return data.long_name;\n\t\t\t}\n\t\t\treturn \"\";\n\t\t}\n\n\t\tif (place) {\n\t\t\tconst street = findData(\"route\");\n\t\t\tconst streetNumber = findData(\"street_number\");\n\t\t\tconst neighborhood = findDataByMultipleTypes([\n\t\t\t\t\"sublocality_level_1\",\n\t\t\t\t\"sublocality\",\n\t\t\t\t\"neighborhood\",\n\t\t\t]);\n\t\t\tconst city = findData(\"administrative_area_level_2\");\n\t\t\tconst state = findData(\"administrative_area_level_1\");\n\t\t\tconst stateShortName = findDataShort(\"administrative_area_level_1\");\n\t\t\tconst postalCode = findDataByMultipleTypes([\n\t\t\t\t\"postal_code\",\n\t\t\t\t\"postal_code_prefix\",\n\t\t\t]);\n\n\t\t\tconst lat = place.geometry?.location?.lat();\n\t\t\tconst lng = place.geometry?.location?.lng();\n\n\t\t\tconst sendPlace = {\n\t\t\t\tstreet,\n\t\t\t\tcity,\n\t\t\t\tstate,\n\t\t\t\tneighborhood,\n\t\t\t\tpostalCode,\n\t\t\t\tstreetNumber,\n\t\t\t\tstateShortName,\n\t\t\t\tcoordinates: { lat, lng },\n\t\t\t};\n\n\t\t\tonPlaceChanged?.(sendPlace);\n\t\t}\n\t};\n\n\treturn (\n\t\t<StandaloneSearchBox\n\t\t\tonLoad={handleLoad}\n\t\t\tonPlacesChanged={handlePlacesChanged}\n\t\t\toptions={options}\n\t\t>\n\t\t\t<Input\n\t\t\t\ttype=\"text\"\n\t\t\t\tautoComplete=\"off\"\n\t\t\t\tonChange={(e) => onChange?.(e.target.value)}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t</StandaloneSearchBox>\n\t);\n}\n\nexport { SearchPlaces };\n"],"mappings":";;;;;AA8EA,SAAS,EAAa,GAAuC;CAC5D,IAAM,EAAE,aAAU,mBAAgB,YAAS,GAAG,MAAS,GAGjD,CAAC,GAAW,KAAgB,EAAc,IAAI;CAmEpD,OACC,kBAAC,GAAD;EACC,SAnEkB,MAAa,EAAa,CAAG;EAoE/C,uBAlEgC;GACjC,IAAM,IAAS,GAAW,UAAU,GAC9B,IAAQ,IAAS,EAAO,KAAK,MAE7B,IACL,GAAO;GAER,SAAS,EAAS,GAAa;IAC9B,IAAM,IAAO,EAAmB,MAAM,MAAS,EAAK,MAAM,OAAO,CAAG;IAEpE,OADI,IAAa,EAAK,YACf;GACR;GAEA,SAAS,EAAc,GAAa;IACnC,IAAM,IAAO,EAAmB,MAAM,MAAS,EAAK,MAAM,OAAO,CAAG;IAEpE,OADI,IAAa,EAAK,aACf;GACR;GAEA,SAAS,EAAwB,GAAgB;IAChD,KAAK,IAAM,KAAO,GAAM;KACvB,IAAM,IAAO,EAAmB,MAAM,MACrC,EAAK,MAAM,SAAS,CAAG,CACxB;KACA,IAAI,GAAM,OAAO,EAAK;IACvB;IACA,OAAO;GACR;GAEA,IAAI,GAAO;IACV,IAAM,IAAS,EAAS,OAAO,GACzB,IAAe,EAAS,eAAe,GACvC,IAAe,EAAwB;KAC5C;KACA;KACA;IACD,CAAC,GACK,IAAO,EAAS,6BAA6B,GAC7C,IAAQ,EAAS,6BAA6B,GAC9C,IAAiB,EAAc,6BAA6B,GAS5D,IAAY;KACjB;KACA;KACA;KACA;KACA,YAbkB,EAAwB,CAC1C,eACA,oBACD,CAUC;KACA;KACA;KACA,aAAa;MAAE,KAXJ,EAAM,UAAU,UAAU,IAAI;MAWrB,KAVT,EAAM,UAAU,UAAU,IAAI;KAUjB;IACzB;IAEA,IAAiB,CAAS;GAC3B;EACD;EAMW;YAET,kBAAC,GAAD;GACC,MAAK;GACL,cAAa;GACb,WAAW,MAAM,IAAW,EAAE,OAAO,KAAK;GAC1C,GAAI;EACJ,CAAA;CACmB,CAAA;AAEvB"}

package/dist/modules/components/select/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/select/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport { type FocusEvent, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport { SelectChevron } from \"./selectChevron\";\nimport { SelectContainer } from \"./selectContainer\";\nimport { SelectContent } from \"./selectContent\";\nimport { SelectOption } from \"./selectOption\";\nimport { SelectOptionsContainer } from \"./selectOptionsContainer\";\nimport { SelectOverlay } from \"./selectOverlay\";\nimport { SelectSpinner } from \"./selectSpinner\";\n\ntype SelectProps = {\n\t/** Field name for form submission. Required. /\n\tname: string;\n\t/* Array of selectable options. Required. /\n\toptions: { label: string; value: string }[];\n\t/* Optional HTML id for the underlying hidden input. /\n\tid?: string;\n\t/* Controlled selected value. /\n\tvalue?: string;\n\t/* Uncontrolled default selected value. @default \"\" /\n\tdefaultValue?: string;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Optional label text displayed above the select. /\n\tlabel?: string;\n\t/* Validation error message displayed below the select. /\n\terrorMessage?: string;\n\t/* Placeholder text shown when no option is selected. @default \"Selecione...\" /\n\tplaceholder?: string;\n\t/* Text shown when no options match the search query. @default \"Sem opções disponíveis\" /\n\tnotFoundText?: string;\n\t/* Additional CSS class applied to the wrapper element. /\n\tclassName?: string;\n\t/* Disables all interactions. @default false /\n\tdisabled?: boolean;\n\t/* Prevents value changes while keeping the current value visible. @default false /\n\treadOnly?: boolean;\n\t/* Shows a loading spinner and disables interactions. @default false /\n\tisLoading?: boolean;\n\t/* Enables search/filter within the dropdown. @default false /\n\tisSearchable?: boolean;\n\t/* Closes the dropdown after an option is selected. @default true /\n\tcloseOnSelect?: boolean;\n\t/* Callback fired when the search query changes. Use for async option loading. /\n\tonSearch?: (value: string) => void;\n\t/* Callback fired when the selected value changes. /\n\tonChange?: (value: string) => void;\n\t/* Callback fired when the select gains focus. /\n\tonFocus?: () => void;\n\t/* Callback fired when the select loses focus. /\n\tonBlur?: (e: FocusEvent<HTMLDivElement>) => void;\n\t/\n\t Select 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 select area. /\n\tprefix?: string \| LucideIcon;\n\t/* Lucide icon rendered inside the select on the left. /\n\tleftIcon?: LucideIcon;\n\t/* Maximum height (in px) of the options dropdown. /\n\toptionMaxHeight?: number;\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontal\"\n\t /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\n/\n Select — single-option dropdown with optional search, label, validation, and form integration.\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.options - Array of selectable options (`{ label, value }`). Required.\n * @param props.value - Controlled selected value.\n * @param props.defaultValue - Uncontrolled default value. Default: \"\"\n * @param props.label - Label text displayed above the select.\n * @param props.placeholder - Placeholder shown when nothing is selected. Default: \"Selecione...\"\n * @param props.errorMessage - Validation error message.\n * @param props.isSearchable - Enables search/filter within the dropdown. Default: false\n * @param props.isLoading - Shows a loading spinner and disables interactions. Default: false\n * @param props.closeOnSelect - Closes the dropdown after selecting. Default: true\n * @param props.onChange - Callback fired when the selected value changes.\n * @param props.onSearch - Callback fired when the search query changes.\n * @param props.size - Select size (`md` \| `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns Select JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <Select\n * name=\"category\"\n * options={[\n * { label: \"Technology\", value: \"tech\" },\n * { label: \"Design\", value: \"design\" },\n * ]}\n * />\n \n // With label, validation, and searchable\n * <Select\n * name=\"country\"\n * label=\"Country\"\n * showAsterisk\n * isSearchable\n * options={countryOptions}\n * errorMessage={errors.country}\n * notFoundText=\"No countries found\"\n * />\n \n // Controlled with async search\n * <Select\n * name=\"tag\"\n * label=\"Tag\"\n * value={selectedTag}\n * onChange={setSelectedTag}\n * onSearch={fetchTagOptions}\n * isLoading={isLoadingTags}\n * options={tagOptions}\n * />\n * ```\n */\n\nfunction Select(props: SelectProps) {\n\tconst {\n\t\tname,\n\t\toptions,\n\t\tclassName: wrapperClassName = \"\",\n\t\tplaceholder = \"Selecione...\",\n\t\tcloseOnSelect = true,\n\t\tdefaultValue = \"\",\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tisSearchable = false,\n\t\tid,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tleftIcon: LeftIcon,\n\t\tonSearch,\n\t\tonChange,\n\t\tonBlur,\n\t\tnotFoundText = \"Sem opções disponíveis\",\n\t\tonFocus,\n\t\tdisabled: baseDisabled = false,\n\t\tprefix,\n\t\tsize = \"md\",\n\t\tvalue,\n\t\tvariant = \"solid\",\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\n\tconst selectRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst selectId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst disabled = baseDisabled \|\| isLoading \|\| readOnly;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst [search, setSearch] = useState(\"\");\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(defaultValue);\n\n\tconst forceSelectedOptions = value \|\| selectedOption;\n\n\tfunction optionHasSelected(value: string) {\n\t\treturn forceSelectedOptions === value;\n\t}\n\n\tfunction getOptionLabel(value: string) {\n\t\tconst option = options.find((option) => option.value === value);\n\t\treturn option?.label \|\| \"\";\n\t}\n\n\tfunction handleContainerFocus() {\n\t\tif (disabled \|\| !selectRef?.current \|\| isFocused) return;\n\t\tsetIsFocused(true);\n\t\tselectRef.current.focus();\n\t\tonFocus?.();\n\t}\n\n\tfunction handleBlur() {\n\t\tsetIsFocused(false);\n\t\tif (onBlur && selectRef.current) selectRef.current.blur();\n\t}\n\n\tfunction handleSearch(value: string) {\n\t\tsetSearch(value);\n\t\tif (onSearch) onSearch(value);\n\t}\n\n\tfunction handleChangeValue(value: string) {\n\t\tif (optionHasSelected(value)) {\n\t\t\tsetSelectedOption(\"\");\n\t\t\tif (onChange) onChange(\"\");\n\t\t} else {\n\t\t\tsetSelectedOption(value);\n\t\t\tif (onChange) onChange(value);\n\t\t}\n\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tconst mappedOptions = options.filter((option) => {\n\t\tif (props.onSearch) return true;\n\t\tif (!props.isSearchable) return true;\n\t\tif (option.label.toLowerCase().includes(search.toLowerCase())) return true;\n\t\treturn false;\n\t});\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<SelectContainer\n\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tprefixExists={!!prefix}\n\t\t\t\tid={selectId}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tref={selectRef}\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={forceSelectedOptions}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t<SelectContent size={size}>\n\t\t\t\t\t{forceSelectedOptions !== \"\" && (\n\t\t\t\t\t\t<p className=\"hasValue\">{getOptionLabel(forceSelectedOptions)}</p>\n\t\t\t\t\t)}\n\t\t\t\t\t{forceSelectedOptions === \"\" && <p>{placeholder}</p>}\n\t\t\t\t</SelectContent>\n\n\t\t\t\t<SelectOptionsContainer\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\tisSearchable={isSearchable}\n\t\t\t\t\tsearch={search}\n\t\t\t\t\tonSearch={handleSearch}\n\t\t\t\t>\n\t\t\t\t\t{mappedOptions.map(({ label, value }) => (\n\t\t\t\t\t\t<SelectOption\n\t\t\t\t\t\t\tkey={value}\n\t\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\t\thandleChangeValue={handleChangeValue}\n\t\t\t\t\t\t\toptionHasSelected={optionHasSelected}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\n\t\t\t\t\t{mappedOptions.length <= 0 && <p>{notFoundText}</p>}\n\t\t\t\t</SelectOptionsContainer>\n\n\t\t\t\t<SelectChevron\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t/>\n\n\t\t\t\t<SelectSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t<SelectOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t</SelectContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Select };\n"],"mappings":";;;;;;;;;;;;;AA+IA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,SACA,YACA,WAAW,IAAmB,IAC9B,iBAAc,gBACd,mBAAgB,IAChB,kBAAe,IACf,cAAc,GACd,eAAY,IACZ,cAAW,IACX,mBAAe,IACf,QACA,WACA,iBACA,UAAU,GACV,aACA,aACA,WACA,kBAAe,0BACf,YACA,UAAU,IAAe,IACzB,WACA,UAAO,MACP,UACA,aAAU,SACV,iBAAc,YACd,yBAAsB,OACnB,GAEE,EAAE,mBAAgB,EAAQ,GAE1B,IAAY,EAAyB,IAAI,GACzC,KAAc,EAAM,GACpB,IAAW,MAAM,IAEjB,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAW,KAAgB,KAAa,GAGxC,IAAW;EADG,IAAI;EAAI,IAAI;CACf,EAAU,IAErB,CAAC,GAAQ,KAAa,EAAS,EAAE,GACjC,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,CAAC,GAAgB,KAAqB,EAAS,CAAY,GAE3D,IAAuB,KAAS;CAEtC,SAAS,EAAkB,GAAe;EACzC,OAAO,MAAyB;CACjC;CAEA,SAAS,GAAe,GAAe;EAEtC,OADe,EAAQ,MAAM,MAAW,EAAO,UAAU,CAClD,CAAA,EAAQ,SAAS;CACzB;CAEA,SAAS,KAAuB;EAC3B,KAAY,CAAC,GAAW,WAAW,MACvC,EAAa,EAAI,GACjB,EAAU,QAAQ,MAAM,GACxB,IAAU;CACX;CAEA,SAAS,IAAa;EAErB,AADA,EAAa,EAAK,GACd,KAAU,EAAU,WAAS,EAAU,QAAQ,KAAK;CACzD;CAEA,SAAS,GAAa,GAAe;EAEpC,AADA,EAAU,CAAK,GACX,KAAU,EAAS,CAAK;CAC7B;CAEA,SAAS,GAAkB,GAAe;EASzC,AARI,EAAkB,CAAK,KAC1B,EAAkB,EAAE,GAChB,KAAU,EAAS,EAAE,MAEzB,EAAkB,CAAK,GACnB,KAAU,EAAS,CAAK,IAGzB,KAAe,EAAW;CAC/B;CAEA,IAAM,IAAgB,EAAQ,QAAQ,MAGrC,GAFI,EAAM,YACN,CAAC,EAAM,gBACP,EAAO,MAAM,YAAY,CAAC,CAAC,SAAS,EAAO,YAAY,CAAC,EAE5D;CAED,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,GAAD;GACuB;GACZ;GACD;GACE;GACA;GACD;GACJ;GACG;GACT,cAAc,CAAC,CAAC;GAChB,IAAI;aAVL;IAYC,kBAAC,SAAD;KACC,KAAK;KACC;KACN,OAAO;KACP,MAAK;IACL,CAAA;IAED,kBAAC,GAAD;KAAwB;KAAU,MAAM;KAAQ,WAAU;IAAU,CAAA;IAEnE,KAAY,kBAAC,GAAD;KAAU,MAAM;KAAU,aAAa;IAAM,CAAA;IAE1D,kBAAC,GAAD;KAAqB;eAArB,CACE,MAAyB,MACzB,kBAAC,KAAD;MAAG,WAAU;gBAAY,GAAe,CAAoB;KAAK,CAAA,GAEjE,MAAyB,MAAM,kBAAC,KAAD,EAAA,UAAI,EAAe,CAAA,CACrC;;IAEf,kBAAC,GAAD;KACY;KACG;KACN;KACR,UAAU;eAJX,CAME,EAAc,KAAK,EAAE,UAAO,eAC5B,kBAAC,GAAD;MAEQ;MACA;MACD;MACa;MACA;KACnB,GANK,CAML,CACD,GAEA,EAAc,UAAU,KAAK,kBAAC,KAAD,EAAA,UAAI,EAAgB,CAAA,CAC3B;;IAExB,kBAAC,GAAD;KACW;KACC;KACD;KACA;KACC;IACX,CAAA;IAED,kBAAC,IAAD;KAAyB;KAAqB;IAAY,CAAA;IAC1D,kBAAC,IAAD;KAA2B;KAAuB;IAAY,CAAA;GAC9C;;CACH,CAAA;AAEjB"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/select/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport { type FocusEvent, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport { SelectChevron } from \"./selectChevron\";\nimport { SelectContainer } from \"./selectContainer\";\nimport { SelectContent } from \"./selectContent\";\nimport { SelectOption } from \"./selectOption\";\nimport { SelectOptionsContainer } from \"./selectOptionsContainer\";\nimport { SelectOverlay } from \"./selectOverlay\";\nimport { SelectSpinner } from \"./selectSpinner\";\n\ntype SelectProps = {\n\t/** Field name for form submission. Required. /\n\tname: string;\n\t/* Array of selectable options. Required. /\n\toptions: { label: string; value: string }[];\n\t/* Optional HTML id for the underlying hidden input. /\n\tid?: string;\n\t/* Controlled selected value. /\n\tvalue?: string;\n\t/* Uncontrolled default selected value. @default \"\" /\n\tdefaultValue?: string;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Optional label text displayed above the select. /\n\tlabel?: string;\n\t/* Validation error message displayed below the select. /\n\terrorMessage?: string;\n\t/* Placeholder text shown when no option is selected. @default \"Selecione...\" /\n\tplaceholder?: string;\n\t/* Text shown when no options match the search query. @default \"Sem opções disponíveis\" /\n\tnotFoundText?: string;\n\t/* Additional CSS class applied to the wrapper element. /\n\tclassName?: string;\n\t/* Disables all interactions. @default false /\n\tdisabled?: boolean;\n\t/* Prevents value changes while keeping the current value visible. @default false /\n\treadOnly?: boolean;\n\t/* Shows a loading spinner and disables interactions. @default false /\n\tisLoading?: boolean;\n\t/* Enables search/filter within the dropdown. @default false /\n\tisSearchable?: boolean;\n\t/* Closes the dropdown after an option is selected. @default true /\n\tcloseOnSelect?: boolean;\n\t/* Callback fired when the search query changes. Use for async option loading. /\n\tonSearch?: (value: string) => void;\n\t/* Callback fired when the selected value changes. /\n\tonChange?: (value: string) => void;\n\t/* Callback fired when the select gains focus. /\n\tonFocus?: () => void;\n\t/* Callback fired when the select loses focus. /\n\tonBlur?: (e: FocusEvent<HTMLDivElement>) => void;\n\t/\n\t Select 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 select area. /\n\tprefix?: string \| LucideIcon;\n\t/* Lucide icon rendered inside the select on the left. /\n\tleftIcon?: LucideIcon;\n\t/* Maximum height (in px) of the options dropdown. /\n\toptionMaxHeight?: number;\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontal\"\n\t /\n\torientation?: \"horizontal\" \| \"vertical\" \| \"horizontalReverse\";\n};\n\n/\n Select, single-option dropdown with optional search, label, validation, and form integration.\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.options - Array of selectable options (`{ label, value }`). Required.\n * @param props.value - Controlled selected value.\n * @param props.defaultValue - Uncontrolled default value. Default: \"\"\n * @param props.label - Label text displayed above the select.\n * @param props.placeholder - Placeholder shown when nothing is selected. Default: \"Selecione...\"\n * @param props.errorMessage - Validation error message.\n * @param props.isSearchable - Enables search/filter within the dropdown. Default: false\n * @param props.isLoading - Shows a loading spinner and disables interactions. Default: false\n * @param props.closeOnSelect - Closes the dropdown after selecting. Default: true\n * @param props.onChange - Callback fired when the selected value changes.\n * @param props.onSearch - Callback fired when the search query changes.\n * @param props.size - Select size (`md` \| `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n \n @returns Select JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <Select\n * name=\"category\"\n * options={[\n * { label: \"Technology\", value: \"tech\" },\n * { label: \"Design\", value: \"design\" },\n * ]}\n * />\n \n // With label, validation, and searchable\n * <Select\n * name=\"country\"\n * label=\"Country\"\n * showAsterisk\n * isSearchable\n * options={countryOptions}\n * errorMessage={errors.country}\n * notFoundText=\"No countries found\"\n * />\n \n // Controlled with async search\n * <Select\n * name=\"tag\"\n * label=\"Tag\"\n * value={selectedTag}\n * onChange={setSelectedTag}\n * onSearch={fetchTagOptions}\n * isLoading={isLoadingTags}\n * options={tagOptions}\n * />\n * ```\n */\n\nfunction Select(props: SelectProps) {\n\tconst {\n\t\tname,\n\t\toptions,\n\t\tclassName: wrapperClassName = \"\",\n\t\tplaceholder = \"Selecione...\",\n\t\tcloseOnSelect = true,\n\t\tdefaultValue = \"\",\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tisSearchable = false,\n\t\tid,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tleftIcon: LeftIcon,\n\t\tonSearch,\n\t\tonChange,\n\t\tonBlur,\n\t\tnotFoundText = \"Sem opções disponíveis\",\n\t\tonFocus,\n\t\tdisabled: baseDisabled = false,\n\t\tprefix,\n\t\tsize = \"md\",\n\t\tvalue,\n\t\tvariant = \"solid\",\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\n\tconst selectRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst selectId = id \|\| generatedId;\n\n\tconst errorMessage = baseErrorMessage \|\| fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst disabled = baseDisabled \|\| isLoading \|\| readOnly;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst [search, setSearch] = useState(\"\");\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(defaultValue);\n\n\tconst forceSelectedOptions = value \|\| selectedOption;\n\n\tfunction optionHasSelected(value: string) {\n\t\treturn forceSelectedOptions === value;\n\t}\n\n\tfunction getOptionLabel(value: string) {\n\t\tconst option = options.find((option) => option.value === value);\n\t\treturn option?.label \|\| \"\";\n\t}\n\n\tfunction handleContainerFocus() {\n\t\tif (disabled \|\| !selectRef?.current \|\| isFocused) return;\n\t\tsetIsFocused(true);\n\t\tselectRef.current.focus();\n\t\tonFocus?.();\n\t}\n\n\tfunction handleBlur() {\n\t\tsetIsFocused(false);\n\t\tif (onBlur && selectRef.current) selectRef.current.blur();\n\t}\n\n\tfunction handleSearch(value: string) {\n\t\tsetSearch(value);\n\t\tif (onSearch) onSearch(value);\n\t}\n\n\tfunction handleChangeValue(value: string) {\n\t\tif (optionHasSelected(value)) {\n\t\t\tsetSelectedOption(\"\");\n\t\t\tif (onChange) onChange(\"\");\n\t\t} else {\n\t\t\tsetSelectedOption(value);\n\t\t\tif (onChange) onChange(value);\n\t\t}\n\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tconst mappedOptions = options.filter((option) => {\n\t\tif (props.onSearch) return true;\n\t\tif (!props.isSearchable) return true;\n\t\tif (option.label.toLowerCase().includes(search.toLowerCase())) return true;\n\t\treturn false;\n\t});\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<SelectContainer\n\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tprefixExists={!!prefix}\n\t\t\t\tid={selectId}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tref={selectRef}\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={forceSelectedOptions}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t<SelectContent size={size}>\n\t\t\t\t\t{forceSelectedOptions !== \"\" && (\n\t\t\t\t\t\t<p className=\"hasValue\">{getOptionLabel(forceSelectedOptions)}</p>\n\t\t\t\t\t)}\n\t\t\t\t\t{forceSelectedOptions === \"\" && <p>{placeholder}</p>}\n\t\t\t\t</SelectContent>\n\n\t\t\t\t<SelectOptionsContainer\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\tisSearchable={isSearchable}\n\t\t\t\t\tsearch={search}\n\t\t\t\t\tonSearch={handleSearch}\n\t\t\t\t>\n\t\t\t\t\t{mappedOptions.map(({ label, value }) => (\n\t\t\t\t\t\t<SelectOption\n\t\t\t\t\t\t\tkey={value}\n\t\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\t\thandleChangeValue={handleChangeValue}\n\t\t\t\t\t\t\toptionHasSelected={optionHasSelected}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\n\t\t\t\t\t{mappedOptions.length <= 0 && <p>{notFoundText}</p>}\n\t\t\t\t</SelectOptionsContainer>\n\n\t\t\t\t<SelectChevron\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t/>\n\n\t\t\t\t<SelectSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t<SelectOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t</SelectContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Select };\n"],"mappings":";;;;;;;;;;;;;AA+IA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,SACA,YACA,WAAW,IAAmB,IAC9B,iBAAc,gBACd,mBAAgB,IAChB,kBAAe,IACf,cAAc,GACd,eAAY,IACZ,cAAW,IACX,mBAAe,IACf,QACA,WACA,iBACA,UAAU,GACV,aACA,aACA,WACA,kBAAe,0BACf,YACA,UAAU,IAAe,IACzB,WACA,UAAO,MACP,UACA,aAAU,SACV,iBAAc,YACd,yBAAsB,OACnB,GAEE,EAAE,mBAAgB,EAAQ,GAE1B,IAAY,EAAyB,IAAI,GACzC,KAAc,EAAM,GACpB,IAAW,MAAM,IAEjB,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GACZ,IAAW,KAAgB,KAAa,GAGxC,IAAW;EADG,IAAI;EAAI,IAAI;CACf,EAAU,IAErB,CAAC,GAAQ,KAAa,EAAS,EAAE,GACjC,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,CAAC,GAAgB,KAAqB,EAAS,CAAY,GAE3D,IAAuB,KAAS;CAEtC,SAAS,EAAkB,GAAe;EACzC,OAAO,MAAyB;CACjC;CAEA,SAAS,GAAe,GAAe;EAEtC,OADe,EAAQ,MAAM,MAAW,EAAO,UAAU,CAClD,CAAA,EAAQ,SAAS;CACzB;CAEA,SAAS,KAAuB;EAC3B,KAAY,CAAC,GAAW,WAAW,MACvC,EAAa,EAAI,GACjB,EAAU,QAAQ,MAAM,GACxB,IAAU;CACX;CAEA,SAAS,IAAa;EAErB,AADA,EAAa,EAAK,GACd,KAAU,EAAU,WAAS,EAAU,QAAQ,KAAK;CACzD;CAEA,SAAS,GAAa,GAAe;EAEpC,AADA,EAAU,CAAK,GACX,KAAU,EAAS,CAAK;CAC7B;CAEA,SAAS,GAAkB,GAAe;EASzC,AARI,EAAkB,CAAK,KAC1B,EAAkB,EAAE,GAChB,KAAU,EAAS,EAAE,MAEzB,EAAkB,CAAK,GACnB,KAAU,EAAS,CAAK,IAGzB,KAAe,EAAW;CAC/B;CAEA,IAAM,IAAgB,EAAQ,QAAQ,MAGrC,GAFI,EAAM,YACN,CAAC,EAAM,gBACP,EAAO,MAAM,YAAY,CAAC,CAAC,SAAS,EAAO,YAAY,CAAC,EAE5D;CAED,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,GAAD;GACuB;GACZ;GACD;GACE;GACA;GACD;GACJ;GACG;GACT,cAAc,CAAC,CAAC;GAChB,IAAI;aAVL;IAYC,kBAAC,SAAD;KACC,KAAK;KACC;KACN,OAAO;KACP,MAAK;IACL,CAAA;IAED,kBAAC,GAAD;KAAwB;KAAU,MAAM;KAAQ,WAAU;IAAU,CAAA;IAEnE,KAAY,kBAAC,GAAD;KAAU,MAAM;KAAU,aAAa;IAAM,CAAA;IAE1D,kBAAC,GAAD;KAAqB;eAArB,CACE,MAAyB,MACzB,kBAAC,KAAD;MAAG,WAAU;gBAAY,GAAe,CAAoB;KAAK,CAAA,GAEjE,MAAyB,MAAM,kBAAC,KAAD,EAAA,UAAI,EAAe,CAAA,CACrC;;IAEf,kBAAC,GAAD;KACY;KACG;KACN;KACR,UAAU;eAJX,CAME,EAAc,KAAK,EAAE,UAAO,eAC5B,kBAAC,GAAD;MAEQ;MACA;MACD;MACa;MACA;KACnB,GANK,CAML,CACD,GAEA,EAAc,UAAU,KAAK,kBAAC,KAAD,EAAA,UAAI,EAAgB,CAAA,CAC3B;;IAExB,kBAAC,GAAD;KACW;KACC;KACD;KACA;KACC;IACX,CAAA;IAED,kBAAC,IAAD;KAAyB;KAAqB;IAAY,CAAA;IAC1D,kBAAC,IAAD;KAA2B;KAAuB;IAAY,CAAA;GAC9C;;CACH,CAAA;AAEjB"}

package/dist/modules/components/slider/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/slider/index.tsx"],"sourcesContent":["import {\n\ttype HTMLAttributes,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport \"./styles.css\";\n\ntype SliderProps = Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> & {\n\t/** Current slider position as a percentage (0–100). Required. /\n\tvalue: number;\n\t/* Callback fired whenever the value changes. Required. /\n\tonChange: (value: number) => void;\n\t/* Disables all drag and click interactions. @default false /\n\tdisabled?: boolean;\n\t/* Callback fired when the dragging state changes (`true` = drag started, `false` = drag ended). /\n\tonDragging?: (isDragging: boolean) => void;\n};\n\n/\n Slider — interactive track for selecting a numeric value between 0 and 100.\n \n Pair with `useSlider` for managed state.\n \n @param props.value - Current position as a percentage (0–100). Required.\n * @param props.onChange - Callback fired on value change. Required.\n * @param props.disabled - Disables interactions. Default: false\n * @param props.onDragging - Callback fired when dragging starts or stops.\n \n ...Other valid HTML properties for `<div>`\n \n @returns Slider JSX element.\n \n @example\n * ```tsx\n * // Controlled slider\n * const [value, setValue] = useState(50);\n * <Slider value={value} onChange={setValue} />\n \n // With useSlider hook\n * const [value, setValue] = useSlider(25);\n * <Slider value={value} onChange={setValue} onDragging={setIsDragging} />\n \n // Disabled\n * <Slider value={75} onChange={() => {}} disabled />\n * ```\n /\n\nfunction Slider(props: SliderProps) {\n\tconst {\n\t\tonChange,\n\t\tvalue,\n\t\tdisabled = false,\n\t\tonDragging,\n\t\tclassName = \"\",\n\t\t...rest\n\t} = props;\n\n\tconst [isDragging, setIsDragging] = useState(false);\n\tconst sliderRef = useRef<HTMLDivElement>(null);\n\n\tconst handleMouseDown = () => setIsDragging(true);\n\tconst handleMouseUp = useCallback(() => setIsDragging(false), []);\n\n\tconst handleMouseMove = useCallback(\n\t\t(event: MouseEvent) => {\n\t\t\tif (disabled) return;\n\t\t\tif (!isDragging \|\| !sliderRef.current) return;\n\n\t\t\tconst rect = sliderRef.current.getBoundingClientRect();\n\t\t\tconst offsetX = event.clientX - rect.left;\n\t\t\tconst newValue = Math.min(Math.max((offsetX / rect.width) 100, 0), 100);\n\n\t\t\tonChange(newValue);\n\t\t},\n\t\t[disabled, isDragging, onChange],\n\t);\n\n\tconst handleSliderClick = (event: React.MouseEvent<HTMLDivElement>) => {\n\t\tif (disabled) return;\n\t\tif (!sliderRef.current) return;\n\n\t\tconst rect = sliderRef.current.getBoundingClientRect();\n\t\tconst offsetX = event.clientX - rect.left;\n\t\tconst newValue = Math.min(Math.max((offsetX / rect.width) * 100, 0), 100);\n\n\t\tonChange(newValue);\n\t};\n\n\tuseEffect(() => {\n\t\tif (isDragging) {\n\t\t\tonDragging?.(true);\n\t\t\tdocument.addEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.addEventListener(\"mouseup\", handleMouseUp);\n\t\t} else {\n\t\t\tonDragging?.(false);\n\t\t\tdocument.removeEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.removeEventListener(\"mouseup\", handleMouseUp);\n\t\t}\n\n\t\treturn () => {\n\t\t\tdocument.removeEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.removeEventListener(\"mouseup\", handleMouseUp);\n\t\t};\n\t}, [isDragging, onDragging, handleMouseUp, handleMouseMove]);\n\n\tconst isDraggingClass = isDragging ? \"isDragging\" : \"isNotDragging\";\n\tconst disabledClass = disabled ? \"isDisabled\" : \"isEnabled\";\n\tconst sliderClassname = `arkynSliderTrack ${isDraggingClass} ${disabledClass} ${className}`;\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={sliderClassname}\n\t\t\tonMouseDown={handleMouseDown}\n\t\t\tonClick={handleSliderClick}\n\t\t\tref={sliderRef}\n\t\t>\n\t\t\t<div className=\"arkynSliderFill\" style={{ width: `${value}%` }} />\n\t\t\t<div className=\"arkynSliderThumb\" style={{ left: `${value}%` }} />\n\t\t</div>\n\t);\n}\n\nexport { Slider };\n"],"mappings":";;;;AAkDA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,aACA,UACA,cAAW,IACX,eACA,eAAY,IACZ,GAAG,MACA,GAEE,CAAC,GAAY,KAAiB,EAAS,EAAK,GAC5C,IAAY,EAAuB,IAAI,GAEvC,UAAwB,EAAc,EAAI,GAC1C,IAAgB,QAAkB,EAAc,EAAK,GAAG,CAAC,CAAC,GAE1D,IAAkB,GACtB,MAAsB;EAEtB,IADI,KACA,CAAC,KAAc,CAAC,EAAU,SAAS;EAEvC,IAAM,IAAO,EAAU,QAAQ,sBAAsB,GAC/C,IAAU,EAAM,UAAU,EAAK;EAGrC,EAFiB,KAAK,IAAI,KAAK,IAAK,IAAU,EAAK,QAAS,KAAK,CAAC,GAAG,GAE5D,CAAQ;CAClB,GACA;EAAC;EAAU;EAAY;CAAQ,CAChC,GAEM,KAAqB,MAA4C;EAEtE,IADI,KACA,CAAC,EAAU,SAAS;EAExB,IAAM,IAAO,EAAU,QAAQ,sBAAsB,GAC/C,IAAU,EAAM,UAAU,EAAK;EAGrC,EAFiB,KAAK,IAAI,KAAK,IAAK,IAAU,EAAK,QAAS,KAAK,CAAC,GAAG,GAE5D,CAAQ;CAClB;CAEA,SACK,KACH,IAAa,EAAI,GACjB,SAAS,iBAAiB,aAAa,CAAe,GACtD,SAAS,iBAAiB,WAAW,CAAa,MAElD,IAAa,EAAK,GAClB,SAAS,oBAAoB,aAAa,CAAe,GACzD,SAAS,oBAAoB,WAAW,CAAa,UAGzC;EAEZ,AADA,SAAS,oBAAoB,aAAa,CAAe,GACzD,SAAS,oBAAoB,WAAW,CAAa;CACtD,IACE;EAAC;EAAY;EAAY;EAAe;CAAe,CAAC;CAI3D,IAAM,IAAkB,oBAFA,IAAa,eAAe,gBAEQ,GADtC,IAAW,eAAe,YAC6B,GAAG;CAEhF,OACC,kBAAC,OAAD;EACC,GAAI;EACJ,WAAW;EACX,aAAa;EACb,SAAS;EACT,KAAK;YALN,CAOC,kBAAC,OAAD;GAAK,WAAU;GAAkB,OAAO,EAAE,OAAO,GAAG,EAAM,GAAG;EAAI,CAAA,GACjE,kBAAC,OAAD;GAAK,WAAU;GAAmB,OAAO,EAAE,MAAM,GAAG,EAAM,GAAG;EAAI,CAAA,CAC7D;;AAEP"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/slider/index.tsx"],"sourcesContent":["import {\n\ttype HTMLAttributes,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport \"./styles.css\";\n\ntype SliderProps = Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> & {\n\t/** Current slider position as a percentage (0–100). Required. /\n\tvalue: number;\n\t/* Callback fired whenever the value changes. Required. /\n\tonChange: (value: number) => void;\n\t/* Disables all drag and click interactions. @default false /\n\tdisabled?: boolean;\n\t/* Callback fired when the dragging state changes (`true` = drag started, `false` = drag ended). /\n\tonDragging?: (isDragging: boolean) => void;\n};\n\n/\n Slider, interactive track for selecting a numeric value between 0 and 100.\n \n Pair with `useSlider` for managed state.\n \n @param props.value - Current position as a percentage (0–100). Required.\n * @param props.onChange - Callback fired on value change. Required.\n * @param props.disabled - Disables interactions. Default: false\n * @param props.onDragging - Callback fired when dragging starts or stops.\n \n ...Other valid HTML properties for `<div>`\n \n @returns Slider JSX element.\n \n @example\n * ```tsx\n * // Controlled slider\n * const [value, setValue] = useState(50);\n * <Slider value={value} onChange={setValue} />\n \n // With useSlider hook\n * const [value, setValue] = useSlider(25);\n * <Slider value={value} onChange={setValue} onDragging={setIsDragging} />\n \n // Disabled\n * <Slider value={75} onChange={() => {}} disabled />\n * ```\n /\n\nfunction Slider(props: SliderProps) {\n\tconst {\n\t\tonChange,\n\t\tvalue,\n\t\tdisabled = false,\n\t\tonDragging,\n\t\tclassName = \"\",\n\t\t...rest\n\t} = props;\n\n\tconst [isDragging, setIsDragging] = useState(false);\n\tconst sliderRef = useRef<HTMLDivElement>(null);\n\n\tconst handleMouseDown = () => setIsDragging(true);\n\tconst handleMouseUp = useCallback(() => setIsDragging(false), []);\n\n\tconst handleMouseMove = useCallback(\n\t\t(event: MouseEvent) => {\n\t\t\tif (disabled) return;\n\t\t\tif (!isDragging \|\| !sliderRef.current) return;\n\n\t\t\tconst rect = sliderRef.current.getBoundingClientRect();\n\t\t\tconst offsetX = event.clientX - rect.left;\n\t\t\tconst newValue = Math.min(Math.max((offsetX / rect.width) 100, 0), 100);\n\n\t\t\tonChange(newValue);\n\t\t},\n\t\t[disabled, isDragging, onChange],\n\t);\n\n\tconst handleSliderClick = (event: React.MouseEvent<HTMLDivElement>) => {\n\t\tif (disabled) return;\n\t\tif (!sliderRef.current) return;\n\n\t\tconst rect = sliderRef.current.getBoundingClientRect();\n\t\tconst offsetX = event.clientX - rect.left;\n\t\tconst newValue = Math.min(Math.max((offsetX / rect.width) * 100, 0), 100);\n\n\t\tonChange(newValue);\n\t};\n\n\tuseEffect(() => {\n\t\tif (isDragging) {\n\t\t\tonDragging?.(true);\n\t\t\tdocument.addEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.addEventListener(\"mouseup\", handleMouseUp);\n\t\t} else {\n\t\t\tonDragging?.(false);\n\t\t\tdocument.removeEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.removeEventListener(\"mouseup\", handleMouseUp);\n\t\t}\n\n\t\treturn () => {\n\t\t\tdocument.removeEventListener(\"mousemove\", handleMouseMove);\n\t\t\tdocument.removeEventListener(\"mouseup\", handleMouseUp);\n\t\t};\n\t}, [isDragging, onDragging, handleMouseUp, handleMouseMove]);\n\n\tconst isDraggingClass = isDragging ? \"isDragging\" : \"isNotDragging\";\n\tconst disabledClass = disabled ? \"isDisabled\" : \"isEnabled\";\n\tconst sliderClassname = `arkynSliderTrack ${isDraggingClass} ${disabledClass} ${className}`;\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={sliderClassname}\n\t\t\tonMouseDown={handleMouseDown}\n\t\t\tonClick={handleSliderClick}\n\t\t\tref={sliderRef}\n\t\t>\n\t\t\t<div className=\"arkynSliderFill\" style={{ width: `${value}%` }} />\n\t\t\t<div className=\"arkynSliderThumb\" style={{ left: `${value}%` }} />\n\t\t</div>\n\t);\n}\n\nexport { Slider };\n"],"mappings":";;;;AAkDA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,aACA,UACA,cAAW,IACX,eACA,eAAY,IACZ,GAAG,MACA,GAEE,CAAC,GAAY,KAAiB,EAAS,EAAK,GAC5C,IAAY,EAAuB,IAAI,GAEvC,UAAwB,EAAc,EAAI,GAC1C,IAAgB,QAAkB,EAAc,EAAK,GAAG,CAAC,CAAC,GAE1D,IAAkB,GACtB,MAAsB;EAEtB,IADI,KACA,CAAC,KAAc,CAAC,EAAU,SAAS;EAEvC,IAAM,IAAO,EAAU,QAAQ,sBAAsB,GAC/C,IAAU,EAAM,UAAU,EAAK;EAGrC,EAFiB,KAAK,IAAI,KAAK,IAAK,IAAU,EAAK,QAAS,KAAK,CAAC,GAAG,GAE5D,CAAQ;CAClB,GACA;EAAC;EAAU;EAAY;CAAQ,CAChC,GAEM,KAAqB,MAA4C;EAEtE,IADI,KACA,CAAC,EAAU,SAAS;EAExB,IAAM,IAAO,EAAU,QAAQ,sBAAsB,GAC/C,IAAU,EAAM,UAAU,EAAK;EAGrC,EAFiB,KAAK,IAAI,KAAK,IAAK,IAAU,EAAK,QAAS,KAAK,CAAC,GAAG,GAE5D,CAAQ;CAClB;CAEA,SACK,KACH,IAAa,EAAI,GACjB,SAAS,iBAAiB,aAAa,CAAe,GACtD,SAAS,iBAAiB,WAAW,CAAa,MAElD,IAAa,EAAK,GAClB,SAAS,oBAAoB,aAAa,CAAe,GACzD,SAAS,oBAAoB,WAAW,CAAa,UAGzC;EAEZ,AADA,SAAS,oBAAoB,aAAa,CAAe,GACzD,SAAS,oBAAoB,WAAW,CAAa;CACtD,IACE;EAAC;EAAY;EAAY;EAAe;CAAe,CAAC;CAI3D,IAAM,IAAkB,oBAFA,IAAa,eAAe,gBAEQ,GADtC,IAAW,eAAe,YAC6B,GAAG;CAEhF,OACC,kBAAC,OAAD;EACC,GAAI;EACJ,WAAW;EACX,aAAa;EACb,SAAS;EACT,KAAK;YALN,CAOC,kBAAC,OAAD;GAAK,WAAU;GAAkB,OAAO,EAAE,OAAO,GAAG,EAAM,GAAG;EAAI,CAAA,GACjE,kBAAC,OAAD;GAAK,WAAU;GAAmB,OAAO,EAAE,MAAM,GAAG,EAAM,GAAG;EAAI,CAAA,CAC7D;;AAEP"}

package/dist/modules/components/switch/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/switch/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\nimport { useId, useRef, useState } from \"react\";\n\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport \"./styles.css\";\n\ntype SwitchProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" \| \"onChange\" \| \"defaultValue\" \| \"onCheck\" \| \"value\"\n> & {\n\t/** Optional label text displayed beside the switch. /\n\tlabel?: string;\n\t/\n\t Switch size.\n\t * @default \"lg\"\n\t /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n\t/* Uncontrolled initial checked state. @default false /\n\tdefaultChecked?: boolean;\n\t/* Controlled checked state. /\n\tchecked?: boolean;\n\t/* Value emitted when the switch is on. @default \"checked\" /\n\tvalue?: string;\n\t/* Value emitted when the switch is off. @default \"\" /\n\tunCheckedValue?: string;\n\t/* Field name for form submission. Required. /\n\tname: string;\n\t/* Callback fired on toggle — receives the current value string. /\n\tonCheck?: (value: string) => void;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontalReverse\"\n\t /\n\torientation?: \"vertical\" \| \"horizontal\" \| \"horizontalReverse\";\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Validation error message displayed below the switch. /\n\terrorMessage?: string;\n};\n\n/\n Switch — toggle input for binary on/off states.\n \n Stores value in a hidden `<input>` for native form submission.\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 beside the switch.\n * @param props.size - Switch size (`sm` \| `md` \| `lg`). Default: \"lg\"\n * @param props.defaultChecked - Uncontrolled initial checked state. Default: false\n * @param props.checked - Controlled checked state.\n * @param props.value - Value emitted when on. Default: \"checked\"\n * @param props.unCheckedValue - Value emitted when off. Default: \"\"\n * @param props.onCheck - Callback fired on toggle — receives the current value string.\n * @param props.orientation - Layout direction (`horizontal` \| `vertical` \| `horizontalReverse`). Default: \"horizontalReverse\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n * @param props.showAsterisk - Appends `` to the label.\n @param props.errorMessage - Validation error message.\n \n ...Other valid HTML properties for `<button>` (except `children`, `onChange`, `defaultValue`)\n \n @returns Switch JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <Switch name=\"notifications\" label=\"Enable notifications\" />\n \n // Custom on/off values\n * <Switch\n * name=\"theme\"\n * label=\"Dark mode\"\n * value=\"dark\"\n * unCheckedValue=\"light\"\n * onCheck={(v) => setTheme(v)}\n * />\n \n // Controlled\n * <Switch\n * name=\"autoSave\"\n * label=\"Auto-save\"\n * checked={isAutoSaveEnabled}\n * onCheck={(v) => setAutoSave(!!v)}\n * size=\"md\"\n * />\n * ```\n */\n\nfunction Switch(props: SwitchProps) {\n\tconst {\n\t\tlabel,\n\t\tsize = \"lg\",\n\t\tdefaultChecked = false,\n\t\tchecked: baseChecked = null,\n\t\tvalue,\n\t\tunCheckedValue = \"\",\n\t\tname,\n\t\tclassName: baseClassName = \"\",\n\t\tonCheck,\n\t\tid,\n\t\torientation = \"horizontalReverse\",\n\t\tclassName: wrapperClassName = \"\",\n\t\tshowAsterisk,\n\t\terrorMessage,\n\t\tunShowFieldTemplate = false,\n\t\t...rest\n\t} = props;\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id \|\| generatedId;\n\n\tconst [isChecked, setIsChecked] = useState(defaultChecked);\n\n\tconst currentChecked =\n\t\ttypeof baseChecked === \"boolean\" ? baseChecked : isChecked;\n\n\tfunction handleCheck() {\n\t\tsetIsChecked(!isChecked);\n\t\tonCheck?.(!currentChecked ? value \|\| \"checked\" : unCheckedValue);\n\t}\n\n\tconst checkedClass = currentChecked ? \"checkedTrue\" : \"checkedFalse\";\n\tconst className = `arkynSwitch ${checkedClass} ${size} ${baseClassName}`;\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<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={handleCheck}\n\t\t\t\tclassName={className}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tid={inputId}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonClick={handleCheck}\n\t\t\t\t\tvalue={currentChecked ? value \|\| \"checked\" : unCheckedValue}\n\t\t\t\t/>\n\t\t\t</button>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Switch };\n"],"mappings":";;;;;AA0FA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,UACA,UAAO,MACP,oBAAiB,IACjB,SAAS,IAAc,MACvB,UACA,oBAAiB,IACjB,SACA,WAAW,IAAgB,IAC3B,YACA,OACA,iBAAc,qBACd,WAAW,IAAmB,IAC9B,iBACA,iBACA,yBAAsB,IACtB,GAAG,MACA,GAEE,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAEhB,CAAC,GAAW,KAAgB,EAAS,CAAc,GAEnD,IACL,OAAO,KAAgB,YAAY,IAAc;CAElD,SAAS,IAAc;EAEtB,AADA,EAAa,CAAC,CAAS,GACvB,IAAW,IAAsC,IAArB,KAAS,SAA0B;CAChE;CAKA,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,UAAD;GACC,MAAK;GACL,SAAS;GACE,WAAA,eAhBO,IAAiB,gBAAgB,eACR,GAAG,EAAK,GAAG;GAgBtD,GAAI;aAEJ,kBAAC,SAAD;IACC,IAAI;IACJ,MAAK;IACC;IACN,KAAK;IACL,SAAS;IACT,OAAO,IAAiB,KAAS,YAAY;GAC7C,CAAA;EACM,CAAA;CACM,CAAA;AAEjB"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/switch/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\nimport { useId, useRef, useState } from \"react\";\n\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport \"./styles.css\";\n\ntype SwitchProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" \| \"onChange\" \| \"defaultValue\" \| \"onCheck\" \| \"value\"\n> & {\n\t/** Optional label text displayed beside the switch. /\n\tlabel?: string;\n\t/\n\t Switch size.\n\t * @default \"lg\"\n\t /\n\tsize?: \"sm\" \| \"md\" \| \"lg\";\n\t/* Uncontrolled initial checked state. @default false /\n\tdefaultChecked?: boolean;\n\t/* Controlled checked state. /\n\tchecked?: boolean;\n\t/* Value emitted when the switch is on. @default \"checked\" /\n\tvalue?: string;\n\t/* Value emitted when the switch is off. @default \"\" /\n\tunCheckedValue?: string;\n\t/* Field name for form submission. Required. /\n\tname: string;\n\t/* Callback fired on toggle, receives the current value string. /\n\tonCheck?: (value: string) => void;\n\t/\n\t Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontalReverse\"\n\t /\n\torientation?: \"vertical\" \| \"horizontal\" \| \"horizontalReverse\";\n\t/* When true, skips `FieldTemplate` wrapper (label and error text). @default false /\n\tunShowFieldTemplate?: boolean;\n\t/* Displays an asterisk on the label to signal a required field. /\n\tshowAsterisk?: boolean;\n\t/* Validation error message displayed below the switch. /\n\terrorMessage?: string;\n};\n\n/\n Switch, toggle input for binary on/off states.\n \n Stores value in a hidden `<input>` for native form submission.\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 beside the switch.\n * @param props.size - Switch size (`sm` \| `md` \| `lg`). Default: \"lg\"\n * @param props.defaultChecked - Uncontrolled initial checked state. Default: false\n * @param props.checked - Controlled checked state.\n * @param props.value - Value emitted when on. Default: \"checked\"\n * @param props.unCheckedValue - Value emitted when off. Default: \"\"\n * @param props.onCheck - Callback fired on toggle, receives the current value string.\n * @param props.orientation - Layout direction (`horizontal` \| `vertical` \| `horizontalReverse`). Default: \"horizontalReverse\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n * @param props.showAsterisk - Appends `` to the label.\n @param props.errorMessage - Validation error message.\n \n ...Other valid HTML properties for `<button>` (except `children`, `onChange`, `defaultValue`)\n \n @returns Switch JSX element wrapped in `FieldTemplate`.\n \n @example\n * ```tsx\n * // Basic\n * <Switch name=\"notifications\" label=\"Enable notifications\" />\n \n // Custom on/off values\n * <Switch\n * name=\"theme\"\n * label=\"Dark mode\"\n * value=\"dark\"\n * unCheckedValue=\"light\"\n * onCheck={(v) => setTheme(v)}\n * />\n \n // Controlled\n * <Switch\n * name=\"autoSave\"\n * label=\"Auto-save\"\n * checked={isAutoSaveEnabled}\n * onCheck={(v) => setAutoSave(!!v)}\n * size=\"md\"\n * />\n * ```\n */\n\nfunction Switch(props: SwitchProps) {\n\tconst {\n\t\tlabel,\n\t\tsize = \"lg\",\n\t\tdefaultChecked = false,\n\t\tchecked: baseChecked = null,\n\t\tvalue,\n\t\tunCheckedValue = \"\",\n\t\tname,\n\t\tclassName: baseClassName = \"\",\n\t\tonCheck,\n\t\tid,\n\t\torientation = \"horizontalReverse\",\n\t\tclassName: wrapperClassName = \"\",\n\t\tshowAsterisk,\n\t\terrorMessage,\n\t\tunShowFieldTemplate = false,\n\t\t...rest\n\t} = props;\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id \|\| generatedId;\n\n\tconst [isChecked, setIsChecked] = useState(defaultChecked);\n\n\tconst currentChecked =\n\t\ttypeof baseChecked === \"boolean\" ? baseChecked : isChecked;\n\n\tfunction handleCheck() {\n\t\tsetIsChecked(!isChecked);\n\t\tonCheck?.(!currentChecked ? value \|\| \"checked\" : unCheckedValue);\n\t}\n\n\tconst checkedClass = currentChecked ? \"checkedTrue\" : \"checkedFalse\";\n\tconst className = `arkynSwitch ${checkedClass} ${size} ${baseClassName}`;\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<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={handleCheck}\n\t\t\t\tclassName={className}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tid={inputId}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonClick={handleCheck}\n\t\t\t\t\tvalue={currentChecked ? value \|\| \"checked\" : unCheckedValue}\n\t\t\t\t/>\n\t\t\t</button>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Switch };\n"],"mappings":";;;;;AA0FA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,UACA,UAAO,MACP,oBAAiB,IACjB,SAAS,IAAc,MACvB,UACA,oBAAiB,IACjB,SACA,WAAW,IAAgB,IAC3B,YACA,OACA,iBAAc,qBACd,WAAW,IAAmB,IAC9B,iBACA,iBACA,yBAAsB,IACtB,GAAG,MACA,GAEE,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAEhB,CAAC,GAAW,KAAgB,EAAS,CAAc,GAEnD,IACL,OAAO,KAAgB,YAAY,IAAc;CAElD,SAAS,IAAc;EAEtB,AADA,EAAa,CAAC,CAAS,GACvB,IAAW,IAAsC,IAArB,KAAS,SAA0B;CAChE;CAKA,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,UAAD;GACC,MAAK;GACL,SAAS;GACE,WAAA,eAhBO,IAAiB,gBAAgB,eACR,GAAG,EAAK,GAAG;GAgBtD,GAAI;aAEJ,kBAAC,SAAD;IACC,IAAI;IACJ,MAAK;IACC;IACN,KAAK;IACL,SAAS;IACT,OAAO,IAAiB,KAAS,YAAY;GAC7C,CAAA;EACM,CAAA;CACM,CAAA;AAEjB"}

package/dist/modules/components/tab/tabButton/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/tab/tabButton/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, MouseEvent, ReactNode } from \"react\";\n\nimport { useTab } from \"../tabContext\";\nimport \"./styles.css\";\n\ntype TabButtonProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" \| \"value\" \| \"type\"\n> & {\n\t/** Content displayed inside the tab button. /\n\tchildren: ReactNode;\n\t/* Unique identifier for this tab; matched against the container's active value. /\n\tvalue: string;\n};\n\n/\n TabButton — individual tab button inside a `TabContainer`.\n \n Reads active state and disabled state from `TabContainer` context.\n * The button's own `disabled` prop is ORed with the container's `disabled`.\n \n @param props.children - Tab label content. Required.\n * @param props.value - Tab identifier. Required.\n * @param props.disabled - Disables this tab individually (container can also disable all tabs).\n \n ...Other valid HTML `<button>` properties except `type`\n \n @returns TabButton JSX element.\n \n @example\n * ```tsx\n * <TabContainer defaultValue=\"overview\" onChange={setTab}>\n * <TabButton value=\"overview\">Overview</TabButton>\n * <TabButton value=\"activity\">Activity</TabButton>\n * <TabButton value=\"settings\" disabled>Settings</TabButton>\n * </TabContainer>\n * ```\n */\n\nfunction TabButton(props: TabButtonProps) {\n\tconst {\n\t\tchildren,\n\t\tdisabled: rawDisabled = false,\n\t\tclassName: baseClassName = \"\",\n\t\tonClick,\n\t\tvalue,\n\t\t...rest\n\t} = props;\n\n\tconst { disabled, currentTab, changeCurrentTab } = useTab();\n\n\tconst isDisabled = disabled \|\| rawDisabled;\n\n\tconst disabledClass = isDisabled ? \"isDisabled\" : \"\";\n\tconst activeClass = currentTab === value && value ? \"isActive\" : \"\";\n\tconst className = `arkynTabButton ${disabledClass} ${activeClass} ${baseClassName}`;\n\n\tfunction handleClick(event: MouseEvent<HTMLButtonElement>) {\n\t\tchangeCurrentTab(value);\n\t\tonClick?.(event);\n\t}\n\n\treturn (\n\t\t<button\n\t\t\tonClick={handleClick}\n\t\t\tclassName={className.trim()}\n\t\t\t{...rest}\n\t\t\tdisabled={isDisabled}\n\t\t\ttype=\"button\"\n\t\t>\n\t\t\t{children}\n\t\t</button>\n\t);\n}\n\nexport { TabButton };\n"],"mappings":";;;;AAuCA,SAAS,EAAU,GAAuB;CACzC,IAAM,EACL,aACA,UAAU,IAAc,IACxB,WAAW,IAAgB,IAC3B,YACA,UACA,GAAG,MACA,GAEE,EAAE,aAAU,eAAY,wBAAqB,EAAO,GAEpD,IAAa,KAAY,GAIzB,IAAY,kBAFI,IAAa,eAAe,GAEA,GAD9B,MAAe,KAAS,IAAQ,aAAa,GACA,GAAG;CAEpE,SAAS,EAAY,GAAsC;EAE1D,AADA,EAAiB,CAAK,GACtB,IAAU,CAAK;CAChB;CAEA,OACC,kBAAC,UAAD;EACC,SAAS;EACT,WAAW,EAAU,KAAK;EAC1B,GAAI;EACJ,UAAU;EACV,MAAK;EAEJ;CACM,CAAA;AAEV"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/tab/tabButton/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, MouseEvent, ReactNode } from \"react\";\n\nimport { useTab } from \"../tabContext\";\nimport \"./styles.css\";\n\ntype TabButtonProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" \| \"value\" \| \"type\"\n> & {\n\t/** Content displayed inside the tab button. /\n\tchildren: ReactNode;\n\t/* Unique identifier for this tab; matched against the container's active value. /\n\tvalue: string;\n};\n\n/\n TabButton, individual tab button inside a `TabContainer`.\n \n Reads active state and disabled state from `TabContainer` context.\n * The button's own `disabled` prop is ORed with the container's `disabled`.\n \n @param props.children - Tab label content. Required.\n * @param props.value - Tab identifier. Required.\n * @param props.disabled - Disables this tab individually (container can also disable all tabs).\n \n ...Other valid HTML `<button>` properties except `type`\n \n @returns TabButton JSX element.\n \n @example\n * ```tsx\n * <TabContainer defaultValue=\"overview\" onChange={setTab}>\n * <TabButton value=\"overview\">Overview</TabButton>\n * <TabButton value=\"activity\">Activity</TabButton>\n * <TabButton value=\"settings\" disabled>Settings</TabButton>\n * </TabContainer>\n * ```\n */\n\nfunction TabButton(props: TabButtonProps) {\n\tconst {\n\t\tchildren,\n\t\tdisabled: rawDisabled = false,\n\t\tclassName: baseClassName = \"\",\n\t\tonClick,\n\t\tvalue,\n\t\t...rest\n\t} = props;\n\n\tconst { disabled, currentTab, changeCurrentTab } = useTab();\n\n\tconst isDisabled = disabled \|\| rawDisabled;\n\n\tconst disabledClass = isDisabled ? \"isDisabled\" : \"\";\n\tconst activeClass = currentTab === value && value ? \"isActive\" : \"\";\n\tconst className = `arkynTabButton ${disabledClass} ${activeClass} ${baseClassName}`;\n\n\tfunction handleClick(event: MouseEvent<HTMLButtonElement>) {\n\t\tchangeCurrentTab(value);\n\t\tonClick?.(event);\n\t}\n\n\treturn (\n\t\t<button\n\t\t\tonClick={handleClick}\n\t\t\tclassName={className.trim()}\n\t\t\t{...rest}\n\t\t\tdisabled={isDisabled}\n\t\t\ttype=\"button\"\n\t\t>\n\t\t\t{children}\n\t\t</button>\n\t);\n}\n\nexport { TabButton };\n"],"mappings":";;;;AAuCA,SAAS,EAAU,GAAuB;CACzC,IAAM,EACL,aACA,UAAU,IAAc,IACxB,WAAW,IAAgB,IAC3B,YACA,UACA,GAAG,MACA,GAEE,EAAE,aAAU,eAAY,wBAAqB,EAAO,GAEpD,IAAa,KAAY,GAIzB,IAAY,kBAFI,IAAa,eAAe,GAEA,GAD9B,MAAe,KAAS,IAAQ,aAAa,GACA,GAAG;CAEpE,SAAS,EAAY,GAAsC;EAE1D,AADA,EAAiB,CAAK,GACtB,IAAU,CAAK;CAChB;CAEA,OACC,kBAAC,UAAD;EACC,SAAS;EACT,WAAW,EAAU,KAAK;EAC1B,GAAI;EACJ,UAAU;EACV,MAAK;EAEJ;CACM,CAAA;AAEV"}

package/dist/modules/components/tab/tabContainer/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/tab/tabContainer/index.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, useState } from \"react\";\n\nimport { TabProvider } from \"../tabContext\";\nimport \"./styles.css\";\n\ntype TabContainerProps = Omit<\n\tHTMLAttributes<HTMLElement>,\n\t\"onChange\" \| \"children\" \| \"ref\" \| \"onClick\"\n> & {\n\t/** `TabButton` components to render as tabs. Required. /\n\tchildren: ReactNode;\n\t/* Disables all tab buttons at once. @default false /\n\tdisabled?: boolean;\n\t/* Initially selected tab value. /\n\tdefaultValue?: string;\n\t/* Callback fired when the active tab changes, receiving the new value. /\n\tonChange?: (index: string) => void;\n};\n\n/\n TabContainer — wrapper that manages active state for a group of `TabButton` components.\n \n Renders as a `<nav>` element. Provides context consumed by each `TabButton`.\n \n @param props.children - `TabButton` elements. Required.\n * @param props.defaultValue - Initially selected tab value.\n * @param props.disabled - Disables all buttons. Default: false\n * @param props.onChange - Called with the new value whenever the active tab changes.\n \n ...Other valid HTML `<nav>` properties\n \n @returns TabContainer JSX element.\n \n @example\n * ```tsx\n * <TabContainer defaultValue=\"overview\" onChange={setActiveTab}>\n * <TabButton value=\"overview\">Overview</TabButton>\n * <TabButton value=\"analytics\">Analytics</TabButton>\n * <TabButton value=\"settings\">Settings</TabButton>\n * </TabContainer>\n \n {activeTab === 'overview' && <OverviewPanel />}\n * {activeTab === 'analytics' && <AnalyticsPanel />}\n * ```\n */\n\nfunction TabContainer(props: TabContainerProps) {\n\tconst {\n\t\tchildren,\n\t\tonChange,\n\t\tdefaultValue,\n\t\tdisabled = false,\n\t\tclassName: baseClassName,\n\t\t...rest\n\t} = props;\n\n\tconst [currentTab, setCurrentTab] = useState(defaultValue \|\| \"\");\n\n\tconst className = `arkynTabContainer ${baseClassName \|\| \"\"}`;\n\n\tfunction changeCurrentTab(value: string) {\n\t\tsetCurrentTab(value);\n\t\tif (onChange) onChange(value);\n\t}\n\n\treturn (\n\t\t<TabProvider\n\t\t\tdisabled={disabled}\n\t\t\tcurrentTab={currentTab}\n\t\t\tchangeCurrentTab={changeCurrentTab}\n\t\t>\n\t\t\t<nav className={className.trim()} {...rest}>\n\t\t\t\t{children}\n\t\t\t</nav>\n\t\t</TabProvider>\n\t);\n}\n\nexport { TabContainer };\n"],"mappings":";;;;;AA8CA,SAAS,EAAa,GAA0B;CAC/C,IAAM,EACL,aACA,aACA,iBACA,cAAW,IACX,WAAW,GACX,GAAG,MACA,GAEE,CAAC,GAAY,KAAiB,EAAS,KAAgB,EAAE,GAEzD,IAAY,qBAAqB,KAAiB;CAExD,SAAS,EAAiB,GAAe;EAExC,AADA,EAAc,CAAK,GACf,KAAU,EAAS,CAAK;CAC7B;CAEA,OACC,kBAAC,GAAD;EACW;EACE;EACM;YAElB,kBAAC,OAAD;GAAK,WAAW,EAAU,KAAK;GAAG,GAAI;GACpC;EACG,CAAA;CACO,CAAA;AAEf"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/tab/tabContainer/index.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, useState } from \"react\";\n\nimport { TabProvider } from \"../tabContext\";\nimport \"./styles.css\";\n\ntype TabContainerProps = Omit<\n\tHTMLAttributes<HTMLElement>,\n\t\"onChange\" \| \"children\" \| \"ref\" \| \"onClick\"\n> & {\n\t/** `TabButton` components to render as tabs. Required. /\n\tchildren: ReactNode;\n\t/* Disables all tab buttons at once. @default false /\n\tdisabled?: boolean;\n\t/* Initially selected tab value. /\n\tdefaultValue?: string;\n\t/* Callback fired when the active tab changes, receiving the new value. /\n\tonChange?: (index: string) => void;\n};\n\n/\n TabContainer, wrapper that manages active state for a group of `TabButton` components.\n \n Renders as a `<nav>` element. Provides context consumed by each `TabButton`.\n \n @param props.children - `TabButton` elements. Required.\n * @param props.defaultValue - Initially selected tab value.\n * @param props.disabled - Disables all buttons. Default: false\n * @param props.onChange - Called with the new value whenever the active tab changes.\n \n ...Other valid HTML `<nav>` properties\n \n @returns TabContainer JSX element.\n \n @example\n * ```tsx\n * <TabContainer defaultValue=\"overview\" onChange={setActiveTab}>\n * <TabButton value=\"overview\">Overview</TabButton>\n * <TabButton value=\"analytics\">Analytics</TabButton>\n * <TabButton value=\"settings\">Settings</TabButton>\n * </TabContainer>\n \n {activeTab === 'overview' && <OverviewPanel />}\n * {activeTab === 'analytics' && <AnalyticsPanel />}\n * ```\n */\n\nfunction TabContainer(props: TabContainerProps) {\n\tconst {\n\t\tchildren,\n\t\tonChange,\n\t\tdefaultValue,\n\t\tdisabled = false,\n\t\tclassName: baseClassName,\n\t\t...rest\n\t} = props;\n\n\tconst [currentTab, setCurrentTab] = useState(defaultValue \|\| \"\");\n\n\tconst className = `arkynTabContainer ${baseClassName \|\| \"\"}`;\n\n\tfunction changeCurrentTab(value: string) {\n\t\tsetCurrentTab(value);\n\t\tif (onChange) onChange(value);\n\t}\n\n\treturn (\n\t\t<TabProvider\n\t\t\tdisabled={disabled}\n\t\t\tcurrentTab={currentTab}\n\t\t\tchangeCurrentTab={changeCurrentTab}\n\t\t>\n\t\t\t<nav className={className.trim()} {...rest}>\n\t\t\t\t{children}\n\t\t\t</nav>\n\t\t</TabProvider>\n\t);\n}\n\nexport { TabContainer };\n"],"mappings":";;;;;AA8CA,SAAS,EAAa,GAA0B;CAC/C,IAAM,EACL,aACA,aACA,iBACA,cAAW,IACX,WAAW,GACX,GAAG,MACA,GAEE,CAAC,GAAY,KAAiB,EAAS,KAAgB,EAAE,GAEzD,IAAY,qBAAqB,KAAiB;CAExD,SAAS,EAAiB,GAAe;EAExC,AADA,EAAc,CAAK,GACf,KAAU,EAAS,CAAK;CAC7B;CAEA,OACC,kBAAC,GAAD;EACW;EACE;EACM;YAElB,kBAAC,OAAD;GAAK,WAAW,EAAU,KAAK;GAAG,GAAI;GACpC;EACG,CAAA;CACO,CAAA;AAEf"}