@arkyn/components 3.0.9 → 3.0.10

package/dist/modules/components/calendar/_calendarProvider.js

@@ -1,42 +1,55 @@
 import { ViewService as e } from "./_viewService.js";
-import { createContext as t, useContext as n, useState as r } from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { createContext as t, useCallback as n, useContext as r, useMemo as i, useState as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
 //#region src/components/calendar/_calendarProvider.tsx
-var a = t({});
-function o() {
-	return n(a);
+var s = t({});
+function c() {
+	return r(s);
 }
-function s(t) {
-	let { calendarType: n, children: o, defaultValue: s, defaultViewValue: c = /* @__PURE__ */ new Date(), language: l = "pt-BR", onChange: u, onChangeView: d, value: f, viewValue: p } = t, m = n === "single" ? [s || /* @__PURE__ */ new Date(), s || /* @__PURE__ */ new Date()] : s || [/* @__PURE__ */ new Date(), /* @__PURE__ */ new Date()], [h, g] = r(c), [_, v] = r(m), y = p || h, b = f ? n === "single" ? [f, f] : f : _, x = new e();
-	function S(e) {
-		let t = [new Date(e[0]), new Date(e[1])];
-		u && n === "range" && u(t), u && n === "single" && u(t[0]), v(t);
-	}
-	function C(e) {
-		d && d(e), g(e);
-	}
-	return /* @__PURE__ */ i(a.Provider, {
-		value: {
-			valueDate: b,
-			viewDate: y,
-			currentDate: y.toLocaleDateString(l).slice(3),
-			currentDay: x.currentDay(y),
-			currentMonth: x.currentMonth(y),
-			currentYear: x.currentYear(y),
-			listWeek: x.listWeek(l),
-			listMonths: x.listMonths(y, l),
-			listYears: x.listYears(100),
-			listMatrix: x.listMatrix(y, b),
-			changeDay: (e, t, r) => x.changeDay(e, t, r, n, b, S, C),
-			changeMonth: (e) => x.changeMonth(e, y, C),
-			changeYear: (e) => x.changeYear(e, y, C),
-			nextMonth: () => x.nextMonth(y, C),
-			previousMonth: () => x.previousMonth(y, C)
-		},
-		children: o
+var l = new e();
+function u(e) {
+	let { calendarType: t, children: r, defaultValue: c, defaultViewValue: u = /* @__PURE__ */ new Date(), language: d = "pt-BR", onChange: f, onChangeView: p, value: m, viewValue: h } = e, g = t === "single" ? [c || /* @__PURE__ */ new Date(), c || /* @__PURE__ */ new Date()] : c || [/* @__PURE__ */ new Date(), /* @__PURE__ */ new Date()], [_, v] = a(u), [y, b] = a(g), x = h || _, S = m ? t === "single" ? [m, m] : m : y, C = n((e) => {
+		let n = [new Date(e[0]), new Date(e[1])];
+		f && t === "range" && f(n), f && t === "single" && f(n[0]), b(n);
+	}, [t, f]), w = n((e) => {
+		p && p(e), v(e);
+	}, [p]), T = n((e, n, r) => l.changeDay(e, n, r, t, S, C, w), [
+		t,
+		S,
+		C,
+		w
+	]), E = n((e) => l.changeMonth(e, x, w), [x, w]), D = n((e) => l.changeYear(e, x, w), [x, w]), O = n(() => l.nextMonth(x, w), [x, w]), k = n(() => l.previousMonth(x, w), [x, w]), A = i(() => ({
+		valueDate: S,
+		viewDate: x,
+		currentDate: x.toLocaleDateString(d).slice(3),
+		currentDay: l.currentDay(x),
+		currentMonth: l.currentMonth(x),
+		currentYear: l.currentYear(x),
+		listWeek: l.listWeek(d),
+		listMonths: l.listMonths(x, d),
+		listYears: l.listYears(100),
+		listMatrix: l.listMatrix(x, S),
+		changeDay: T,
+		changeMonth: E,
+		changeYear: D,
+		nextMonth: O,
+		previousMonth: k
+	}), [
+		S,
+		x,
+		d,
+		T,
+		E,
+		D,
+		O,
+		k
+	]);
+	return /* @__PURE__ */ o(s.Provider, {
+		value: A,
+		children: r
 	});
 }
 //#endregion
-export { s as CalendarProvider, o as useCalendar };
+export { u as CalendarProvider, c as useCalendar };
 
 //# sourceMappingURL=_calendarProvider.js.map

package/dist/modules/components/calendar/_calendarProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"_calendarProvider.js","names":[],"sources":["../../../../src/components/calendar/_calendarProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from \"react\";\nimport { type CalendarMatrix, ViewService } from \"./_viewService\";\n\ntype CalendarContextProps = {\n\tvalueDate: Date[];\n\tviewDate: Date;\n\tcurrentDate: string;\n\tcurrentDay: string;\n\tcurrentMonth: string;\n\tcurrentYear: string;\n\tlistWeek: string[];\n\tlistMonths: { label: string; value: string }[];\n\tlistYears: { label: string; value: string }[];\n\tlistMatrix: CalendarMatrix;\n\tchangeDay: (day: number, month: number, year: number) => void;\n\tchangeMonth: (month: number) => void;\n\tchangeYear: (year: number) => void;\n\tnextMonth: () => void;\n\tpreviousMonth: () => void;\n};\n\ntype SingleCalendarProviderProps = {\n\tchildren: ReactNode;\n\tcalendarType: \"single\";\n\tlanguage?: string;\n\tonChangeView?: (date: Date) => void;\n\tdefaultValue?: Date;\n\tonChange?: (date: Date) => void;\n\tvalue?: Date;\n\tviewValue?: Date;\n\tdefaultViewValue?: Date;\n};\n\ntype RangeCalendarProviderProps = {\n\tchildren: ReactNode;\n\tcalendarType: \"range\";\n\tlanguage?: string;\n\tonChangeView?: (date: Date) => void;\n\tdefaultValue?: [Date, Date];\n\tonChange?: (date: [Date, Date]) => void;\n\tvalue?: [Date, Date];\n\tviewValue?: Date;\n\tdefaultViewValue?: Date;\n};\n\ntype CalendarProviderProps =\n\t| SingleCalendarProviderProps\n\t| RangeCalendarProviderProps;\n\nconst CalendarContext = createContext({} as CalendarContextProps);\n\nfunction useCalendar() {\n\treturn useContext(CalendarContext);\n}\n\nfunction CalendarProvider(props: CalendarProviderProps) {\n\tconst {\n\t\tcalendarType,\n\t\tchildren,\n\t\tdefaultValue: rawDefaultValue,\n\t\tdefaultViewValue = new Date(),\n\t\tlanguage = \"pt-BR\",\n\t\tonChange,\n\t\tonChangeView,\n\t\tvalue,\n\t\tviewValue,\n\t} = props;\n\n\tconst defaultValue: [Date, Date] =\n\t\tcalendarType === \"single\"\n\t\t\t? [rawDefaultValue || new Date(), rawDefaultValue || new Date()]\n\t\t\t: rawDefaultValue || [new Date(), new Date()];\n\n\tconst [rawViewDate, rawSetViewDate] = useState(defaultViewValue);\n\tconst [rawValueDate, rawSetValueDate] = useState<[Date, Date]>(defaultValue);\n\n\tconst viewDate = viewValue || rawViewDate;\n\tconst valueDate: [Date, Date] = value\n\t\t? calendarType === \"single\"\n\t\t\t? [value, value]\n\t\t\t: value\n\t\t: rawValueDate;\n\n\tconst viewService = new ViewService();\n\n\tfunction setValueDate(value: [Date, Date]) {\n\t\tconst normalizedValue: [Date, Date] = [\n\t\t\tnew Date(value[0]),\n\t\t\tnew Date(value[1]),\n\t\t];\n\n\t\tif (onChange && calendarType === \"range\") {\n\t\t\tonChange(normalizedValue);\n\t\t}\n\n\t\tif (onChange && calendarType === \"single\") {\n\t\t\tonChange(normalizedValue[0]);\n\t\t}\n\n\t\trawSetValueDate(normalizedValue);\n\t}\n\n\tfunction setViewDate(date: Date) {\n\t\tif (onChangeView) onChangeView(date);\n\t\trawSetViewDate(date);\n\t}\n\n\treturn (\n\t\t<CalendarContext.Provider\n\t\t\tvalue={{\n\t\t\t\tvalueDate,\n\t\t\t\tviewDate,\n\t\t\t\tcurrentDate: viewDate.toLocaleDateString(language).slice(3),\n\t\t\t\tcurrentDay: viewService.currentDay(viewDate),\n\t\t\t\tcurrentMonth: viewService.currentMonth(viewDate),\n\t\t\t\tcurrentYear: viewService.currentYear(viewDate),\n\t\t\t\tlistWeek: viewService.listWeek(language),\n\t\t\t\tlistMonths: viewService.listMonths(viewDate, language),\n\t\t\t\tlistYears: viewService.listYears(100),\n\t\t\t\tlistMatrix: viewService.listMatrix(viewDate, valueDate),\n\t\t\t\tchangeDay: (day, month, year) =>\n\t\t\t\t\tviewService.changeDay(\n\t\t\t\t\t\tday,\n\t\t\t\t\t\tmonth,\n\t\t\t\t\t\tyear,\n\t\t\t\t\t\tcalendarType,\n\t\t\t\t\t\tvalueDate,\n\t\t\t\t\t\tsetValueDate,\n\t\t\t\t\t\tsetViewDate,\n\t\t\t\t\t),\n\t\t\t\tchangeMonth: (month) =>\n\t\t\t\t\tviewService.changeMonth(month, viewDate, setViewDate),\n\t\t\t\tchangeYear: (year) =>\n\t\t\t\t\tviewService.changeYear(year, viewDate, setViewDate),\n\t\t\t\tnextMonth: () => viewService.nextMonth(viewDate, setViewDate),\n\t\t\t\tpreviousMonth: () => viewService.previousMonth(viewDate, setViewDate),\n\t\t\t}}\n\t\t>\n\t\t\t{children}\n\t\t</CalendarContext.Provider>\n\t);\n}\n\nexport { CalendarProvider, useCalendar };\n"],"mappings":";;;;AAiDA,IAAM,IAAkB,EAAc,CAAC,CAAyB;AAEhE,SAAS,IAAc;CACtB,OAAO,EAAW,CAAe;AAClC;AAEA,SAAS,EAAiB,GAA8B;CACvD,IAAM,EACL,iBACA,aACA,cAAc,GACd,sCAAmB,IAAI,KAAK,GAC5B,cAAW,SACX,aACA,iBACA,UACA,iBACG,GAEE,IACL,MAAiB,WACd,CAAC,qBAAmB,IAAI,KAAK,GAAG,qBAAmB,IAAI,KAAK,CAAC,IAC7D,KAAmB,iBAAC,IAAI,KAAK,mBAAG,IAAI,KAAK,CAAC,GAExC,CAAC,GAAa,KAAkB,EAAS,CAAgB,GACzD,CAAC,GAAc,KAAmB,EAAuB,CAAY,GAErE,IAAW,KAAa,GACxB,IAA0B,IAC7B,MAAiB,WAChB,CAAC,GAAO,CAAK,IACb,IACD,GAEG,IAAc,IAAI,EAAY;CAEpC,SAAS,EAAa,GAAqB;EAC1C,IAAM,IAAgC,CACrC,IAAI,KAAK,EAAM,EAAE,GACjB,IAAI,KAAK,EAAM,EAAE,CAClB;EAUA,AARI,KAAY,MAAiB,WAChC,EAAS,CAAe,GAGrB,KAAY,MAAiB,YAChC,EAAS,EAAgB,EAAE,GAG5B,EAAgB,CAAe;CAChC;CAEA,SAAS,EAAY,GAAY;EAEhC,AADI,KAAc,EAAa,CAAI,GACnC,EAAe,CAAI;CACpB;CAEA,OACC,kBAAC,EAAgB,UAAjB;EACC,OAAO;GACN;GACA;GACA,aAAa,EAAS,mBAAmB,CAAQ,CAAC,CAAC,MAAM,CAAC;GAC1D,YAAY,EAAY,WAAW,CAAQ;GAC3C,cAAc,EAAY,aAAa,CAAQ;GAC/C,aAAa,EAAY,YAAY,CAAQ;GAC7C,UAAU,EAAY,SAAS,CAAQ;GACvC,YAAY,EAAY,WAAW,GAAU,CAAQ;GACrD,WAAW,EAAY,UAAU,GAAG;GACpC,YAAY,EAAY,WAAW,GAAU,CAAS;GACtD,YAAY,GAAK,GAAO,MACvB,EAAY,UACX,GACA,GACA,GACA,GACA,GACA,GACA,CACD;GACD,cAAc,MACb,EAAY,YAAY,GAAO,GAAU,CAAW;GACrD,aAAa,MACZ,EAAY,WAAW,GAAM,GAAU,CAAW;GACnD,iBAAiB,EAAY,UAAU,GAAU,CAAW;GAC5D,qBAAqB,EAAY,cAAc,GAAU,CAAW;EACrE;EAEC;CACwB,CAAA;AAE5B"}
+{"version":3,"file":"_calendarProvider.js","names":[],"sources":["../../../../src/components/calendar/_calendarProvider.tsx"],"sourcesContent":["import {\n\tcreateContext,\n\ttype ReactNode,\n\tuseCallback,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n} from \"react\";\nimport { type CalendarMatrix, ViewService } from \"./_viewService\";\n\ntype CalendarContextProps = {\n\tvalueDate: Date[];\n\tviewDate: Date;\n\tcurrentDate: string;\n\tcurrentDay: string;\n\tcurrentMonth: string;\n\tcurrentYear: string;\n\tlistWeek: string[];\n\tlistMonths: { label: string; value: string }[];\n\tlistYears: { label: string; value: string }[];\n\tlistMatrix: CalendarMatrix;\n\tchangeDay: (day: number, month: number, year: number) => void;\n\tchangeMonth: (month: number) => void;\n\tchangeYear: (year: number) => void;\n\tnextMonth: () => void;\n\tpreviousMonth: () => void;\n};\n\ntype SingleCalendarProviderProps = {\n\tchildren: ReactNode;\n\tcalendarType: \"single\";\n\tlanguage?: string;\n\tonChangeView?: (date: Date) => void;\n\tdefaultValue?: Date;\n\tonChange?: (date: Date) => void;\n\tvalue?: Date;\n\tviewValue?: Date;\n\tdefaultViewValue?: Date;\n};\n\ntype RangeCalendarProviderProps = {\n\tchildren: ReactNode;\n\tcalendarType: \"range\";\n\tlanguage?: string;\n\tonChangeView?: (date: Date) => void;\n\tdefaultValue?: [Date, Date];\n\tonChange?: (date: [Date, Date]) => void;\n\tvalue?: [Date, Date];\n\tviewValue?: Date;\n\tdefaultViewValue?: Date;\n};\n\ntype CalendarProviderProps =\n\t| SingleCalendarProviderProps\n\t| RangeCalendarProviderProps;\n\nconst CalendarContext = createContext({} as CalendarContextProps);\n\nfunction useCalendar() {\n\treturn useContext(CalendarContext);\n}\n\n// Stateless — safe to share a single instance instead of instantiating on every render.\nconst viewService = new ViewService();\n\nfunction CalendarProvider(props: CalendarProviderProps) {\n\tconst {\n\t\tcalendarType,\n\t\tchildren,\n\t\tdefaultValue: rawDefaultValue,\n\t\tdefaultViewValue = new Date(),\n\t\tlanguage = \"pt-BR\",\n\t\tonChange,\n\t\tonChangeView,\n\t\tvalue,\n\t\tviewValue,\n\t} = props;\n\n\tconst defaultValue: [Date, Date] =\n\t\tcalendarType === \"single\"\n\t\t\t? [rawDefaultValue || new Date(), rawDefaultValue || new Date()]\n\t\t\t: rawDefaultValue || [new Date(), new Date()];\n\n\tconst [rawViewDate, rawSetViewDate] = useState(defaultViewValue);\n\tconst [rawValueDate, rawSetValueDate] = useState<[Date, Date]>(defaultValue);\n\n\tconst viewDate = viewValue || rawViewDate;\n\tconst valueDate: [Date, Date] = value\n\t\t? calendarType === \"single\"\n\t\t\t? [value, value]\n\t\t\t: value\n\t\t: rawValueDate;\n\n\tconst setValueDate = useCallback(\n\t\t(newValue: [Date, Date]) => {\n\t\t\tconst normalizedValue: [Date, Date] = [\n\t\t\t\tnew Date(newValue[0]),\n\t\t\t\tnew Date(newValue[1]),\n\t\t\t];\n\n\t\t\tif (onChange && calendarType === \"range\") {\n\t\t\t\tonChange(normalizedValue);\n\t\t\t}\n\n\t\t\tif (onChange && calendarType === \"single\") {\n\t\t\t\tonChange(normalizedValue[0]);\n\t\t\t}\n\n\t\t\trawSetValueDate(normalizedValue);\n\t\t},\n\t\t[calendarType, onChange],\n\t);\n\n\tconst setViewDate = useCallback(\n\t\t(date: Date) => {\n\t\t\tif (onChangeView) onChangeView(date);\n\t\t\trawSetViewDate(date);\n\t\t},\n\t\t[onChangeView],\n\t);\n\n\tconst changeDay = useCallback(\n\t\t(day: number, month: number, year: number) =>\n\t\t\tviewService.changeDay(\n\t\t\t\tday,\n\t\t\t\tmonth,\n\t\t\t\tyear,\n\t\t\t\tcalendarType,\n\t\t\t\tvalueDate,\n\t\t\t\tsetValueDate,\n\t\t\t\tsetViewDate,\n\t\t\t),\n\t\t[calendarType, valueDate, setValueDate, setViewDate],\n\t);\n\n\tconst changeMonth = useCallback(\n\t\t(month: number) => viewService.changeMonth(month, viewDate, setViewDate),\n\t\t[viewDate, setViewDate],\n\t);\n\n\tconst changeYear = useCallback(\n\t\t(year: number) => viewService.changeYear(year, viewDate, setViewDate),\n\t\t[viewDate, setViewDate],\n\t);\n\n\tconst nextMonth = useCallback(\n\t\t() => viewService.nextMonth(viewDate, setViewDate),\n\t\t[viewDate, setViewDate],\n\t);\n\n\tconst previousMonth = useCallback(\n\t\t() => viewService.previousMonth(viewDate, setViewDate),\n\t\t[viewDate, setViewDate],\n\t);\n\n\tconst contextValue = useMemo<CalendarContextProps>(\n\t\t() => ({\n\t\t\tvalueDate,\n\t\t\tviewDate,\n\t\t\tcurrentDate: viewDate.toLocaleDateString(language).slice(3),\n\t\t\tcurrentDay: viewService.currentDay(viewDate),\n\t\t\tcurrentMonth: viewService.currentMonth(viewDate),\n\t\t\tcurrentYear: viewService.currentYear(viewDate),\n\t\t\tlistWeek: viewService.listWeek(language),\n\t\t\tlistMonths: viewService.listMonths(viewDate, language),\n\t\t\tlistYears: viewService.listYears(100),\n\t\t\tlistMatrix: viewService.listMatrix(viewDate, valueDate),\n\t\t\tchangeDay,\n\t\t\tchangeMonth,\n\t\t\tchangeYear,\n\t\t\tnextMonth,\n\t\t\tpreviousMonth,\n\t\t}),\n\t\t[\n\t\t\tvalueDate,\n\t\t\tviewDate,\n\t\t\tlanguage,\n\t\t\tchangeDay,\n\t\t\tchangeMonth,\n\t\t\tchangeYear,\n\t\t\tnextMonth,\n\t\t\tpreviousMonth,\n\t\t],\n\t);\n\n\treturn (\n\t\t<CalendarContext.Provider value={contextValue}>\n\t\t\t{children}\n\t\t</CalendarContext.Provider>\n\t);\n}\n\nexport { CalendarProvider, useCalendar };\n"],"mappings":";;;;AAwDA,IAAM,IAAkB,EAAc,CAAC,CAAyB;AAEhE,SAAS,IAAc;CACtB,OAAO,EAAW,CAAe;AAClC;AAGA,IAAM,IAAc,IAAI,EAAY;AAEpC,SAAS,EAAiB,GAA8B;CACvD,IAAM,EACL,iBACA,aACA,cAAc,GACd,sCAAmB,IAAI,KAAK,GAC5B,cAAW,SACX,aACA,iBACA,UACA,iBACG,GAEE,IACL,MAAiB,WACd,CAAC,qBAAmB,IAAI,KAAK,GAAG,qBAAmB,IAAI,KAAK,CAAC,IAC7D,KAAmB,iBAAC,IAAI,KAAK,mBAAG,IAAI,KAAK,CAAC,GAExC,CAAC,GAAa,KAAkB,EAAS,CAAgB,GACzD,CAAC,GAAc,KAAmB,EAAuB,CAAY,GAErE,IAAW,KAAa,GACxB,IAA0B,IAC7B,MAAiB,WAChB,CAAC,GAAO,CAAK,IACb,IACD,GAEG,IAAe,GACnB,MAA2B;EAC3B,IAAM,IAAgC,CACrC,IAAI,KAAK,EAAS,EAAE,GACpB,IAAI,KAAK,EAAS,EAAE,CACrB;EAUA,AARI,KAAY,MAAiB,WAChC,EAAS,CAAe,GAGrB,KAAY,MAAiB,YAChC,EAAS,EAAgB,EAAE,GAG5B,EAAgB,CAAe;CAChC,GACA,CAAC,GAAc,CAAQ,CACxB,GAEM,IAAc,GAClB,MAAe;EAEf,AADI,KAAc,EAAa,CAAI,GACnC,EAAe,CAAI;CACpB,GACA,CAAC,CAAY,CACd,GAEM,IAAY,GAChB,GAAa,GAAe,MAC5B,EAAY,UACX,GACA,GACA,GACA,GACA,GACA,GACA,CACD,GACD;EAAC;EAAc;EAAW;EAAc;CAAW,CACpD,GAEM,IAAc,GAClB,MAAkB,EAAY,YAAY,GAAO,GAAU,CAAW,GACvE,CAAC,GAAU,CAAW,CACvB,GAEM,IAAa,GACjB,MAAiB,EAAY,WAAW,GAAM,GAAU,CAAW,GACpE,CAAC,GAAU,CAAW,CACvB,GAEM,IAAY,QACX,EAAY,UAAU,GAAU,CAAW,GACjD,CAAC,GAAU,CAAW,CACvB,GAEM,IAAgB,QACf,EAAY,cAAc,GAAU,CAAW,GACrD,CAAC,GAAU,CAAW,CACvB,GAEM,IAAe,SACb;EACN;EACA;EACA,aAAa,EAAS,mBAAmB,CAAQ,CAAC,CAAC,MAAM,CAAC;EAC1D,YAAY,EAAY,WAAW,CAAQ;EAC3C,cAAc,EAAY,aAAa,CAAQ;EAC/C,aAAa,EAAY,YAAY,CAAQ;EAC7C,UAAU,EAAY,SAAS,CAAQ;EACvC,YAAY,EAAY,WAAW,GAAU,CAAQ;EACrD,WAAW,EAAY,UAAU,GAAG;EACpC,YAAY,EAAY,WAAW,GAAU,CAAS;EACtD;EACA;EACA;EACA;EACA;CACD,IACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACD,CACD;CAEA,OACC,kBAAC,EAAgB,UAAjB;EAA0B,OAAO;EAC/B;CACwB,CAAA;AAE5B"}

package/dist/modules/components/datePicker/datePickerCalendarContainer/index.js

@@ -1,28 +1,21 @@
-import { useScrollLock as e } from "../../../hooks/useScrollLock.js";
+import { useFlipPosition as e } from "../../../hooks/useFlipPosition.js";
+import { useScrollLock as t } from "../../../hooks/useScrollLock.js";
 /* empty css       */
-import { useEffect as t, useRef as n, useState as r } from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { useRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/components/datePicker/datePickerCalendarContainer/index.tsx
-function a(a) {
-	let { children: o, id: s, isFocused: c } = a, l = n(null), [u, d] = r("bottom");
-	return e(c), t(() => {
-		c && (() => {
-			if (!l.current) return;
-			let e = l.current.parentElement;
-			if (!e) return;
-			let t = e.getBoundingClientRect();
-			window.innerHeight - t.bottom < 420 && t.top > 420 ? d("top") : d("bottom");
-		})();
-	}, [c]), c ? /* @__PURE__ */ i("div", {
-		ref: l,
-		id: s,
+function i(i) {
+	let { children: a, id: o, isFocused: s } = i, c = n(null), l = e(c, s, 420);
+	return t(s), s ? /* @__PURE__ */ r("div", {
+		ref: c,
+		id: o,
 		role: "dialog",
 		"aria-modal": "false",
-		className: `arkynDatePickerCalendarContainer ${u}`,
-		children: o
+		className: `arkynDatePickerCalendarContainer ${l}`,
+		children: a
 	}) : null;
 }
 //#endregion
-export { a as DatePickerCalendarContainer };
+export { i as DatePickerCalendarContainer };
 
 //# sourceMappingURL=index.js.map

package/dist/modules/components/datePicker/datePickerCalendarContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/datePicker/datePickerCalendarContainer/index.tsx"],"sourcesContent":["import { type ReactNode, useEffect, useRef, useState } from \"react\";\n\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\n\nimport \"./styles.css\";\n\ntype DatePickerCalendarContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tchildren: ReactNode;\n};\n\nfunction DatePickerCalendarContainer(props: DatePickerCalendarContainerProps) {\n\tconst { children, id, isFocused } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst [position, setPosition] = useState<\"bottom\" | \"top\">(\"bottom\");\n\n\tuseScrollLock(isFocused);\n\n\tuseEffect(() => {\n\t\tif (!isFocused) return;\n\n\t\tconst checkContainerPosition = () => {\n\t\t\tif (!containerRef.current) return;\n\n\t\t\tconst parentElement = containerRef.current.parentElement;\n\t\t\tif (!parentElement) return;\n\n\t\t\tconst parentRect = parentElement.getBoundingClientRect();\n\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\tconst estimatedContainerHeight = 420;\n\t\t\tconst spaceBelow = viewportHeight - parentRect.bottom;\n\n\t\t\tif (\n\t\t\t\tspaceBelow < estimatedContainerHeight &&\n\t\t\t\tparentRect.top > estimatedContainerHeight\n\t\t\t) {\n\t\t\t\tsetPosition(\"top\");\n\t\t\t} else {\n\t\t\t\tsetPosition(\"bottom\");\n\t\t\t}\n\t\t};\n\n\t\tcheckContainerPosition();\n\t}, [isFocused]);\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"dialog\"\n\t\t\taria-modal=\"false\"\n\t\t\tclassName={`arkynDatePickerCalendarContainer ${position}`}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { DatePickerCalendarContainer };\n"],"mappings":";;;;;AAYA,SAAS,EAA4B,GAAyC;CAC7E,IAAM,EAAE,aAAU,OAAI,iBAAc,GAE9B,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAU,KAAe,EAA2B,QAAQ;CAkCnE,OAhCA,EAAc,CAAS,GAEvB,QAAgB;EACV,YAEgC;GACpC,IAAI,CAAC,EAAa,SAAS;GAE3B,IAAM,IAAgB,EAAa,QAAQ;GAC3C,IAAI,CAAC,GAAe;GAEpB,IAAM,IAAa,EAAc,sBAAsB;GAMvD,AALuB,OAAO,cAGM,EAAW,SAGjC,OACb,EAAW,MAAM,MAEjB,EAAY,KAAK,IAEjB,EAAY,QAAQ;EAEtB,EAEA,CAAuB;CACxB,GAAG,CAAC,CAAS,CAAC,GAET,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,cAAW;EACX,WAAW,oCAAoC;EAE9C;CACG,CAAA,IAXiB;AAaxB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/datePicker/datePickerCalendarContainer/index.tsx"],"sourcesContent":["import { type ReactNode, useRef } from \"react\";\n\nimport { useFlipPosition } from \"../../../hooks/useFlipPosition\";\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\n\nimport \"./styles.css\";\n\ntype DatePickerCalendarContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tchildren: ReactNode;\n};\n\nfunction DatePickerCalendarContainer(props: DatePickerCalendarContainerProps) {\n\tconst { children, id, isFocused } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst position = useFlipPosition(containerRef, isFocused, 420);\n\n\tuseScrollLock(isFocused);\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"dialog\"\n\t\t\taria-modal=\"false\"\n\t\t\tclassName={`arkynDatePickerCalendarContainer ${position}`}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { DatePickerCalendarContainer };\n"],"mappings":";;;;;;AAaA,SAAS,EAA4B,GAAyC;CAC7E,IAAM,EAAE,aAAU,OAAI,iBAAc,GAE9B,IAAe,EAAuB,IAAI,GAC1C,IAAW,EAAgB,GAAc,GAAW,GAAG;CAM7D,OAJA,EAAc,CAAS,GAElB,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,cAAW;EACX,WAAW,oCAAoC;EAE9C;CACG,CAAA,IAXiB;AAaxB"}

package/dist/modules/components/googleAnalytics/snippets/generateGAElements.js

@@ -1,16 +1,17 @@
+import { toSafeScriptString as e } from "../../../utils/escapeForInlineScript.js";
 //#region src/components/googleAnalytics/snippets/generateGAElements.ts
-function e(e) {
-	let { measurementId: t } = e;
-	return t || console.warn("Google Analytics Measurement ID is required"), {
-		src: `https://www.googletagmanager.com/gtag/js?id=${t}`,
+function t(t) {
+	let { measurementId: n } = t;
+	return n || console.warn("Google Analytics Measurement ID is required"), {
+		src: `https://www.googletagmanager.com/gtag/js?id=${encodeURIComponent(n)}`,
 		script: `
     window.dataLayer = window.dataLayer || [];
     function gtag(){dataLayer.push(arguments);}
     gtag('js', new Date());
-    gtag('config', '${t}');`
+    gtag('config', ${e(n)});`
 	};
 }
 //#endregion
-export { e as generateGAElements };
+export { t as generateGAElements };
 
 //# sourceMappingURL=generateGAElements.js.map

package/dist/modules/components/googleAnalytics/snippets/generateGAElements.js.map

@@ -1 +1 @@
-{"version":3,"file":"generateGAElements.js","names":[],"sources":["../../../../../src/components/googleAnalytics/snippets/generateGAElements.ts"],"sourcesContent":["type GenerateGAElementsProps = {\n\tmeasurementId: string;\n};\n\nfunction generateGAElements(props: GenerateGAElementsProps) {\n\tconst { measurementId } = props;\n\n\tif (!measurementId)\n\t\tconsole.warn(\"Google Analytics Measurement ID is required\");\n\n\tconst src = `https://www.googletagmanager.com/gtag/js?id=${measurementId}`;\n\n\tconst script = `\n    window.dataLayer = window.dataLayer || [];\n    function gtag(){dataLayer.push(arguments);}\n    gtag('js', new Date());\n    gtag('config', '${measurementId}');`;\n\n\treturn {\n\t\tsrc,\n\t\tscript,\n\t};\n}\n\nexport { generateGAElements };\n"],"mappings":";AAIA,SAAS,EAAmB,GAAgC;CAC3D,IAAM,EAAE,qBAAkB;CAa1B,OAXK,KACJ,QAAQ,KAAK,6CAA6C,GAUpD;EACN,KAAA,+CAT0D;EAU1D,QAAA;;;;sBAJoB,EAAc;CAKnC;AACD"}
+{"version":3,"file":"generateGAElements.js","names":[],"sources":["../../../../../src/components/googleAnalytics/snippets/generateGAElements.ts"],"sourcesContent":["import { toSafeScriptString } from \"../../../utils/escapeForInlineScript\";\n\ntype GenerateGAElementsProps = {\n\tmeasurementId: string;\n};\n\nfunction generateGAElements(props: GenerateGAElementsProps) {\n\tconst { measurementId } = props;\n\n\tif (!measurementId)\n\t\tconsole.warn(\"Google Analytics Measurement ID is required\");\n\n\tconst src = `https://www.googletagmanager.com/gtag/js?id=${encodeURIComponent(measurementId)}`;\n\n\tconst script = `\n    window.dataLayer = window.dataLayer || [];\n    function gtag(){dataLayer.push(arguments);}\n    gtag('js', new Date());\n    gtag('config', ${toSafeScriptString(measurementId)});`;\n\n\treturn {\n\t\tsrc,\n\t\tscript,\n\t};\n}\n\nexport { generateGAElements };\n"],"mappings":";;AAMA,SAAS,EAAmB,GAAgC;CAC3D,IAAM,EAAE,qBAAkB;CAa1B,OAXK,KACJ,QAAQ,KAAK,6CAA6C,GAUpD;EACN,KAAA,+CAT0D,mBAAmB,CAAa;EAU1F,QAAA;;;;qBAJmB,EAAmB,CAAa,EAAE;CAKtD;AACD"}

package/dist/modules/components/googleTagManager/snippets/appendToDataLayer.js

@@ -1,11 +1,12 @@
+import { isValidJsIdentifier as e, toSafeScriptJson as t } from "../../../utils/escapeForInlineScript.js";
 //#region src/components/googleTagManager/snippets/appendToDataLayer.ts
-function e(e) {
-	let { dataLayer: t, dataLayerName: n } = e;
-	return `
-  window.${n} = window.${n} || [];
-  window.${n}.push(${JSON.stringify(t)})`;
+function n(n) {
+	let { dataLayer: r, dataLayerName: i } = n, a = e(i) ? i : "dataLayer";
+	return a !== i && console.warn(`Invalid dataLayerName "${i}", falling back to "dataLayer"`), `
+  window.${a} = window.${a} || [];
+  window.${a}.push(${t(r)})`;
 }
 //#endregion
-export { e as appendToDataLayer };
+export { n as appendToDataLayer };
 
 //# sourceMappingURL=appendToDataLayer.js.map

package/dist/modules/components/googleTagManager/snippets/appendToDataLayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"appendToDataLayer.js","names":[],"sources":["../../../../../src/components/googleTagManager/snippets/appendToDataLayer.ts"],"sourcesContent":["type AppendToDataLayer = {\n\tdataLayer: Record<string, string>;\n\tdataLayerName: string;\n};\n\nfunction appendToDataLayer(props: AppendToDataLayer) {\n\tconst { dataLayer, dataLayerName } = props;\n\n\treturn `\n  window.${dataLayerName} = window.${dataLayerName} || [];\n  window.${dataLayerName}.push(${JSON.stringify(dataLayer)})`;\n}\n\nexport { appendToDataLayer };\n"],"mappings":";AAKA,SAAS,EAAkB,GAA0B;CACpD,IAAM,EAAE,cAAW,qBAAkB;CAErC,OAAO;WACG,EAAc,YAAY,EAAc;WACxC,EAAc,QAAQ,KAAK,UAAU,CAAS,EAAE;AAC3D"}
+{"version":3,"file":"appendToDataLayer.js","names":[],"sources":["../../../../../src/components/googleTagManager/snippets/appendToDataLayer.ts"],"sourcesContent":["import {\n\tisValidJsIdentifier,\n\ttoSafeScriptJson,\n} from \"../../../utils/escapeForInlineScript\";\n\ntype AppendToDataLayer = {\n\tdataLayer: Record<string, string>;\n\tdataLayerName: string;\n};\n\nfunction appendToDataLayer(props: AppendToDataLayer) {\n\tconst { dataLayer, dataLayerName } = props;\n\n\tconst safeDataLayerName = isValidJsIdentifier(dataLayerName)\n\t\t? dataLayerName\n\t\t: \"dataLayer\";\n\n\tif (safeDataLayerName !== dataLayerName) {\n\t\tconsole.warn(\n\t\t\t`Invalid dataLayerName \"${dataLayerName}\", falling back to \"dataLayer\"`,\n\t\t);\n\t}\n\n\treturn `\n  window.${safeDataLayerName} = window.${safeDataLayerName} || [];\n  window.${safeDataLayerName}.push(${toSafeScriptJson(dataLayer)})`;\n}\n\nexport { appendToDataLayer };\n"],"mappings":";;AAUA,SAAS,EAAkB,GAA0B;CACpD,IAAM,EAAE,cAAW,qBAAkB,GAE/B,IAAoB,EAAoB,CAAa,IACxD,IACA;CAQH,OANI,MAAsB,KACzB,QAAQ,KACP,0BAA0B,EAAc,+BACzC,GAGM;WACG,EAAkB,YAAY,EAAkB;WAChD,EAAkB,QAAQ,EAAiB,CAAS,EAAE;AACjE"}

package/dist/modules/components/googleTagManager/snippets/generateGTMElements.js

@@ -1,25 +1,31 @@
-import { appendToDataLayer as e } from "./appendToDataLayer.js";
+import { isValidJsIdentifier as e, toSafeScriptString as t } from "../../../utils/escapeForInlineScript.js";
+import { appendToDataLayer as n } from "./appendToDataLayer.js";
 //#region src/components/googleTagManager/snippets/generateGTMElements.ts
-function t(t) {
-	let { id: n, events: r, dataLayer: i, dataLayerName: a, preview: o, auth: s } = t, c = `&gtm_auth=${s}`, l = `&gtm_preview=${o}`;
-	return n || console.warn("GTM Id is required"), {
-		iframe: `
-    <iframe src="https://www.googletagmanager.com/ns.html?id=${n}${c}${l}&gtm_cookies_win=x"
-      height="0" width="0" style="display:none;visibility:hidden" id="tag-manager"></iframe>`,
+function r(e) {
+	return encodeURIComponent(e).replace(/'/g, "%27");
+}
+function i(i) {
+	let { id: a, events: o, dataLayer: s, dataLayerName: c, preview: l, auth: u } = i, d = `&gtm_auth=${r(u)}`, f = `&gtm_preview=${r(l)}`, p = r(a);
+	a || console.warn("GTM Id is required");
+	let m = `
+    <iframe src="https://www.googletagmanager.com/ns.html?id=${p}${d}${f}&gtm_cookies_win=x"
+      height="0" width="0" style="display:none;visibility:hidden" id="tag-manager"></iframe>`, h = e(c) ? c : "dataLayer";
+	return {
+		iframe: m,
 		script: `
     (function(w,d,s,l,i){w[l]=w[l]||[];
-      w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js', ${JSON.stringify(r).slice(1, -1)}});
+      w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js', ${JSON.stringify(o).slice(1, -1).replace(/</g, "\\u003C")}});
       var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';
-      j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+'${c}${l}&gtm_cookies_win=x';
+      j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+'${d}${f}&gtm_cookies_win=x';
       f.parentNode.insertBefore(j,f);
-    })(window,document,'script','${a}','${n}');`,
-		dataLayerVar: e({
-			dataLayer: i,
-			dataLayerName: a
+    })(window,document,'script',${t(h)},${t(a)});`,
+		dataLayerVar: n({
+			dataLayer: s,
+			dataLayerName: c
 		})
 	};
 }
 //#endregion
-export { t as generateGTMElements };
+export { i as generateGTMElements };
 
 //# sourceMappingURL=generateGTMElements.js.map

package/dist/modules/components/googleTagManager/snippets/generateGTMElements.js.map

@@ -1 +1 @@
-{"version":3,"file":"generateGTMElements.js","names":[],"sources":["../../../../../src/components/googleTagManager/snippets/generateGTMElements.ts"],"sourcesContent":["import { appendToDataLayer } from \"./appendToDataLayer\";\n\ntype GenerateGTMElementsProps = {\n\tid: string;\n\tevents: Record<string, string>;\n\tdataLayer: Record<string, string>;\n\tdataLayerName: string;\n\tpreview: string;\n\tauth: string;\n};\n\nfunction generateGTMElements(props: GenerateGTMElementsProps) {\n\tconst { id, events, dataLayer, dataLayerName, preview, auth } = props;\n\n\tconst gtmAuth = `&gtm_auth=${auth}`;\n\tconst gtmPreview = `&gtm_preview=${preview}`;\n\n\tif (!id) console.warn(\"GTM Id is required\");\n\n\tconst iframe = `\n    <iframe src=\"https://www.googletagmanager.com/ns.html?id=${id}${gtmAuth}${gtmPreview}&gtm_cookies_win=x\"\n      height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\" id=\"tag-manager\"></iframe>`;\n\n\tconst script = `\n    (function(w,d,s,l,i){w[l]=w[l]||[];\n      w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js', ${JSON.stringify(\n\t\t\t\tevents,\n\t\t\t).slice(1, -1)}});\n      var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';\n      j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+'${gtmAuth}${gtmPreview}&gtm_cookies_win=x';\n      f.parentNode.insertBefore(j,f);\n    })(window,document,'script','${dataLayerName}','${id}');`;\n\n\tconst dataLayerVar = appendToDataLayer({ dataLayer, dataLayerName });\n\n\treturn {\n\t\tiframe,\n\t\tscript,\n\t\tdataLayerVar,\n\t};\n}\n\nexport { generateGTMElements };\n"],"mappings":";;AAWA,SAAS,EAAoB,GAAiC;CAC7D,IAAM,EAAE,OAAI,WAAQ,cAAW,kBAAe,YAAS,YAAS,GAE1D,IAAU,aAAa,KACvB,IAAa,gBAAgB;CAoBnC,OAlBK,KAAI,QAAQ,KAAK,oBAAoB,GAkBnC;EACN,QAAA;+DAhB6D,IAAK,IAAU,EAAW;;EAiBvF,QAAA;;qEAZmE,KAAK,UACtE,CACD,CAAC,CAAC,MAAM,GAAG,EAAE,EAAE;;+EAE6D,IAAU,EAAW;;mCAEjE,EAAc,KAAK,EAAG;EAOvD,cALoB,EAAkB;GAAE;GAAW;EAAc,CAKjE;CACD;AACD"}
+{"version":3,"file":"generateGTMElements.js","names":[],"sources":["../../../../../src/components/googleTagManager/snippets/generateGTMElements.ts"],"sourcesContent":["import {\n\tisValidJsIdentifier,\n\ttoSafeScriptString,\n} from \"../../../utils/escapeForInlineScript\";\nimport { appendToDataLayer } from \"./appendToDataLayer\";\n\ntype GenerateGTMElementsProps = {\n\tid: string;\n\tevents: Record<string, string>;\n\tdataLayer: Record<string, string>;\n\tdataLayerName: string;\n\tpreview: string;\n\tauth: string;\n};\n\n/**\n * URL-encodes a value for safe use as a query-string value that is also embedded\n * inside a single-quoted JS string literal. `encodeURIComponent` alone leaves `'`\n * unescaped, which would otherwise let the value break out of that string literal.\n */\nfunction toSafeUrlQueryValue(value: string): string {\n\treturn encodeURIComponent(value).replace(/'/g, \"%27\");\n}\n\nfunction generateGTMElements(props: GenerateGTMElementsProps) {\n\tconst { id, events, dataLayer, dataLayerName, preview, auth } = props;\n\n\tconst gtmAuth = `&gtm_auth=${toSafeUrlQueryValue(auth)}`;\n\tconst gtmPreview = `&gtm_preview=${toSafeUrlQueryValue(preview)}`;\n\tconst safeId = toSafeUrlQueryValue(id);\n\n\tif (!id) console.warn(\"GTM Id is required\");\n\n\tconst iframe = `\n    <iframe src=\"https://www.googletagmanager.com/ns.html?id=${safeId}${gtmAuth}${gtmPreview}&gtm_cookies_win=x\"\n      height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\" id=\"tag-manager\"></iframe>`;\n\n\tconst safeDataLayerName = isValidJsIdentifier(dataLayerName)\n\t\t? dataLayerName\n\t\t: \"dataLayer\";\n\n\tconst script = `\n    (function(w,d,s,l,i){w[l]=w[l]||[];\n      w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js', ${JSON.stringify(\n\t\t\t\tevents,\n\t\t\t)\n\t\t\t\t.slice(1, -1)\n\t\t\t\t.replace(/</g, \"\\\\u003C\")}});\n      var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';\n      j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+'${gtmAuth}${gtmPreview}&gtm_cookies_win=x';\n      f.parentNode.insertBefore(j,f);\n    })(window,document,'script',${toSafeScriptString(safeDataLayerName)},${toSafeScriptString(id)});`;\n\n\tconst dataLayerVar = appendToDataLayer({ dataLayer, dataLayerName });\n\n\treturn {\n\t\tiframe,\n\t\tscript,\n\t\tdataLayerVar,\n\t};\n}\n\nexport { generateGTMElements };\n"],"mappings":";;;AAoBA,SAAS,EAAoB,GAAuB;CACnD,OAAO,mBAAmB,CAAK,CAAC,CAAC,QAAQ,MAAM,KAAK;AACrD;AAEA,SAAS,EAAoB,GAAiC;CAC7D,IAAM,EAAE,OAAI,WAAQ,cAAW,kBAAe,YAAS,YAAS,GAE1D,IAAU,aAAa,EAAoB,CAAI,KAC/C,IAAa,gBAAgB,EAAoB,CAAO,KACxD,IAAS,EAAoB,CAAE;CAErC,AAAK,KAAI,QAAQ,KAAK,oBAAoB;CAE1C,IAAM,IAAS;+DAC+C,IAAS,IAAU,EAAW;+FAGtF,IAAoB,EAAoB,CAAa,IACxD,IACA;CAgBH,OAAO;EACN;EACA,QAAA;;qEAdmE,KAAK,UACtE,CACD,CAAC,CACC,MAAM,GAAG,EAAE,CAAC,CACZ,QAAQ,MAAM,SAAS,EAAE;;+EAEiD,IAAU,EAAW;;kCAElE,EAAmB,CAAiB,EAAE,GAAG,EAAmB,CAAE,EAAE;EAOhG,cALoB,EAAkB;GAAE;GAAW;EAAc,CAKjE;CACD;AACD"}

package/dist/modules/components/multiSelect/multiSelectOptionsContainer/index.js

@@ -1,41 +1,34 @@
-import { useScrollLock as e } from "../../../hooks/useScrollLock.js";
-import { Input as t } from "../../input/index.js";
+import { useFlipPosition as e } from "../../../hooks/useFlipPosition.js";
+import { useScrollLock as t } from "../../../hooks/useScrollLock.js";
+import { Input as n } from "../../input/index.js";
 /* empty css       */
-import { useEffect as n, useRef as r, useState as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Search as s } from "lucide-react";
+import { useRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Search as o } from "lucide-react";
 //#region src/components/multiSelect/multiSelectOptionsContainer/index.tsx
-function c(c) {
-	let { children: l, id: u, isFocused: d, isSearchable: f, search: p, onSearch: m } = c, h = r(null), [g, _] = i("bottom");
-	e(d), n(() => {
-		d && (() => {
-			if (!h.current) return;
-			let e = h.current.parentElement;
-			if (!e) return;
-			let t = e.getBoundingClientRect();
-			window.innerHeight - t.bottom < 300 && t.top > 300 ? _("top") : _("bottom");
-		})();
-	}, [d]);
-	function v(e) {
-		f && m(e.target.value);
+function s(s) {
+	let { children: c, id: l, isFocused: u, isSearchable: d, search: f, onSearch: p } = s, m = r(null), h = e(m, u, 300);
+	t(u);
+	function g(e) {
+		d && p(e.target.value);
 	}
-	return d ? /* @__PURE__ */ o("div", {
-		ref: h,
-		id: u,
+	return u ? /* @__PURE__ */ a("div", {
+		ref: m,
+		id: l,
 		role: "listbox",
 		"aria-multiselectable": "true",
-		className: `arkynMultiSelectOptionsContainer ${g}`,
-		children: [f && /* @__PURE__ */ a(t, {
+		className: `arkynMultiSelectOptionsContainer ${h}`,
+		children: [d && /* @__PURE__ */ i(n, {
 			type: "search",
 			name: "search-select",
 			variant: "underline",
-			leftIcon: s,
-			value: p,
-			onChange: v
-		}), l]
+			leftIcon: o,
+			value: f,
+			onChange: g
+		}), c]
 	}) : null;
 }
 //#endregion
-export { c as MultiSelectOptionsContainer };
+export { s as MultiSelectOptionsContainer };
 
 //# sourceMappingURL=index.js.map

package/dist/modules/components/multiSelect/multiSelectOptionsContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/multiSelect/multiSelectOptionsContainer/index.tsx"],"sourcesContent":["import { Search } from \"lucide-react\";\nimport {\n\ttype ChangeEvent,\n\ttype ReactNode,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { Input } from \"../../input\";\n\nimport \"./styles.css\";\n\ntype MultiSelectOptionsContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tisSearchable: boolean;\n\tchildren: ReactNode;\n\tsearch: string;\n\tonSearch: (value: string) => void;\n};\n\nfunction MultiSelectOptionsContainer(props: MultiSelectOptionsContainerProps) {\n\tconst { children, id, isFocused, isSearchable, search, onSearch } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst [position, setPosition] = useState<\"bottom\" | \"top\">(\"bottom\");\n\n\tuseScrollLock(isFocused);\n\n\tuseEffect(() => {\n\t\tif (!isFocused) return;\n\n\t\tconst checkContainerPosition = () => {\n\t\t\tif (!containerRef.current) return;\n\n\t\t\tconst parentElement = containerRef.current.parentElement;\n\t\t\tif (!parentElement) return;\n\n\t\t\tconst parentRect = parentElement.getBoundingClientRect();\n\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\tconst estimatedContainerHeight = 300;\n\t\t\tconst spaceBelow = viewportHeight - parentRect.bottom;\n\n\t\t\tif (\n\t\t\t\tspaceBelow < estimatedContainerHeight &&\n\t\t\t\tparentRect.top > estimatedContainerHeight\n\t\t\t) {\n\t\t\t\tsetPosition(\"top\");\n\t\t\t} else {\n\t\t\t\tsetPosition(\"bottom\");\n\t\t\t}\n\t\t};\n\n\t\tcheckContainerPosition();\n\t}, [isFocused]);\n\n\tfunction handleSearch(e: ChangeEvent<HTMLInputElement>) {\n\t\tif (!isSearchable) return;\n\t\tonSearch(e.target.value);\n\t}\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\taria-multiselectable=\"true\"\n\t\t\tclassName={`arkynMultiSelectOptionsContainer ${position}`}\n\t\t>\n\t\t\t{isSearchable && (\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tname=\"search-select\"\n\t\t\t\t\tvariant=\"underline\"\n\t\t\t\t\tleftIcon={Search}\n\t\t\t\t\tvalue={search}\n\t\t\t\t\tonChange={handleSearch}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { MultiSelectOptionsContainer };\n"],"mappings":";;;;;;;AAuBA,SAAS,EAA4B,GAAyC;CAC7E,IAAM,EAAE,aAAU,OAAI,cAAW,iBAAc,WAAQ,gBAAa,GAE9D,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAU,KAAe,EAA2B,QAAQ;CAInE,AAFA,EAAc,CAAS,GAEvB,QAAgB;EACV,YAEgC;GACpC,IAAI,CAAC,EAAa,SAAS;GAE3B,IAAM,IAAgB,EAAa,QAAQ;GAC3C,IAAI,CAAC,GAAe;GAEpB,IAAM,IAAa,EAAc,sBAAsB;GAMvD,AALuB,OAAO,cAGM,EAAW,SAGjC,OACb,EAAW,MAAM,MAEjB,EAAY,KAAK,IAEjB,EAAY,QAAQ;EAEtB,EAEA,CAAuB;CACxB,GAAG,CAAC,CAAS,CAAC;CAEd,SAAS,EAAa,GAAkC;EAClD,KACL,EAAS,EAAE,OAAO,KAAK;CACxB;CAIA,OAFK,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,wBAAqB;EACrB,WAAW,oCAAoC;YALhD,CAOE,KACA,kBAAC,GAAD;GACC,MAAK;GACL,MAAK;GACL,SAAQ;GACR,UAAU;GACV,OAAO;GACP,UAAU;EACV,CAAA,GAGD,CACG;MAtBiB;AAwBxB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/multiSelect/multiSelectOptionsContainer/index.tsx"],"sourcesContent":["import { Search } from \"lucide-react\";\nimport { type ChangeEvent, type ReactNode, useRef } from \"react\";\n\nimport { useFlipPosition } from \"../../../hooks/useFlipPosition\";\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { Input } from \"../../input\";\n\nimport \"./styles.css\";\n\ntype MultiSelectOptionsContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tisSearchable: boolean;\n\tchildren: ReactNode;\n\tsearch: string;\n\tonSearch: (value: string) => void;\n};\n\nfunction MultiSelectOptionsContainer(props: MultiSelectOptionsContainerProps) {\n\tconst { children, id, isFocused, isSearchable, search, onSearch } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst position = useFlipPosition(containerRef, isFocused, 300);\n\n\tuseScrollLock(isFocused);\n\n\tfunction handleSearch(e: ChangeEvent<HTMLInputElement>) {\n\t\tif (!isSearchable) return;\n\t\tonSearch(e.target.value);\n\t}\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\taria-multiselectable=\"true\"\n\t\t\tclassName={`arkynMultiSelectOptionsContainer ${position}`}\n\t\t>\n\t\t\t{isSearchable && (\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tname=\"search-select\"\n\t\t\t\t\tvariant=\"underline\"\n\t\t\t\t\tleftIcon={Search}\n\t\t\t\t\tvalue={search}\n\t\t\t\t\tonChange={handleSearch}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { MultiSelectOptionsContainer };\n"],"mappings":";;;;;;;;AAkBA,SAAS,EAA4B,GAAyC;CAC7E,IAAM,EAAE,aAAU,OAAI,cAAW,iBAAc,WAAQ,gBAAa,GAE9D,IAAe,EAAuB,IAAI,GAC1C,IAAW,EAAgB,GAAc,GAAW,GAAG;CAE7D,EAAc,CAAS;CAEvB,SAAS,EAAa,GAAkC;EAClD,KACL,EAAS,EAAE,OAAO,KAAK;CACxB;CAIA,OAFK,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,wBAAqB;EACrB,WAAW,oCAAoC;YALhD,CAOE,KACA,kBAAC,GAAD;GACC,MAAK;GACL,MAAK;GACL,SAAQ;GACR,UAAU;GACV,OAAO;GACP,UAAU;EACV,CAAA,GAGD,CACG;MAtBiB;AAwBxB"}

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

@@ -131,7 +131,7 @@ function A(A) {
 				/* @__PURE__ */ g("input", {
 					type: "hidden",
 					name: j,
-					value: he.slice(0, V)
+					value: he
 				}),
 				/* @__PURE__ */ g("input", {
 					type: "hidden",

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

@@ -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 { clearLinkMarkAtBoundary } from \"../../services/clearLinkMarkAtBoundary\";\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 { InsertLink } from \"./insertLink\";\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, video, and link insertion.\n * Pressing Space or Enter right after a link automatically stops new text from continuing to be part of that link.\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.videoConfig - Customizes the video insertion modal labels.\n * @param props.linkConfig - Customizes the link insertion 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: \"vertical\"\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 * // With custom link insertion modal labels\n * <RichText\n *   name=\"article\"\n *   label=\"Article Body\"\n *   linkConfig={{ modalTitle: \"Add a link\" }}\n * />\n * ```\n */\n\nfunction RichText(props: RichTextProps) {\n\tconst {\n\t\tname,\n\t\thiddenButtons,\n\t\timageConfig,\n\t\tvideoConfig,\n\t\tlinkConfig,\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\n\t\t\t\t\t\t{buttonIsNotHidden(\"link\") && <InsertLink {...linkConfig} />}\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\tif (event.key === \" \" || event.key === \"Enter\") {\n\t\t\t\t\t\t\t\tclearLinkMarkAtBoundary(editor);\n\t\t\t\t\t\t\t}\n\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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"}
+{"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 { clearLinkMarkAtBoundary } from \"../../services/clearLinkMarkAtBoundary\";\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 { InsertLink } from \"./insertLink\";\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, video, and link insertion.\n * Pressing Space or Enter right after a link automatically stops new text from continuing to be part of that link.\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.videoConfig - Customizes the video insertion modal labels.\n * @param props.linkConfig - Customizes the link insertion 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: \"vertical\"\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 * // With custom link insertion modal labels\n * <RichText\n *   name=\"article\"\n *   label=\"Article Body\"\n *   linkConfig={{ modalTitle: \"Add a link\" }}\n * />\n * ```\n */\n\nfunction RichText(props: RichTextProps) {\n\tconst {\n\t\tname,\n\t\thiddenButtons,\n\t\timageConfig,\n\t\tvideoConfig,\n\t\tlinkConfig,\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\n\t\t\t\t\t\t{buttonIsNotHidden(\"link\") && <InsertLink {...linkConfig} />}\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\tif (event.key === \" \" || event.key === \"Enter\") {\n\t\t\t\t\t\t\t\tclearLinkMarkAtBoundary(editor);\n\t\t\t\t\t\t\t}\n\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 type=\"hidden\" name={name} value={inputValue} />\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/select/selectOptionsContainer/index.js

@@ -1,40 +1,33 @@
-import { useScrollLock as e } from "../../../hooks/useScrollLock.js";
-import { Input as t } from "../../input/index.js";
+import { useFlipPosition as e } from "../../../hooks/useFlipPosition.js";
+import { useScrollLock as t } from "../../../hooks/useScrollLock.js";
+import { Input as n } from "../../input/index.js";
 /* empty css       */
-import { useEffect as n, useRef as r, useState as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Search as s } from "lucide-react";
+import { useRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Search as o } from "lucide-react";
 //#region src/components/select/selectOptionsContainer/index.tsx
-function c(c) {
-	let { children: l, id: u, isFocused: d, isSearchable: f, search: p, onSearch: m } = c, h = r(null), [g, _] = i("bottom");
-	e(d), n(() => {
-		d && (() => {
-			if (!h.current) return;
-			let e = h.current.parentElement;
-			if (!e) return;
-			let t = e.getBoundingClientRect();
-			window.innerHeight - t.bottom < 300 && t.top > 300 ? _("top") : _("bottom");
-		})();
-	}, [d]);
-	function v(e) {
-		f && m(e.target.value);
+function s(s) {
+	let { children: c, id: l, isFocused: u, isSearchable: d, search: f, onSearch: p } = s, m = r(null), h = e(m, u, 300);
+	t(u);
+	function g(e) {
+		d && p(e.target.value);
 	}
-	return d ? /* @__PURE__ */ o("div", {
-		ref: h,
-		id: u,
+	return u ? /* @__PURE__ */ a("div", {
+		ref: m,
+		id: l,
 		role: "listbox",
-		className: `arkynSelectOptionsContainer ${g}`,
-		children: [f && /* @__PURE__ */ a(t, {
+		className: `arkynSelectOptionsContainer ${h}`,
+		children: [d && /* @__PURE__ */ i(n, {
 			type: "search",
 			name: "search-select",
 			variant: "underline",
-			leftIcon: s,
-			value: p,
-			onChange: v
-		}), l]
+			leftIcon: o,
+			value: f,
+			onChange: g
+		}), c]
 	}) : null;
 }
 //#endregion
-export { c as SelectOptionsContainer };
+export { s as SelectOptionsContainer };
 
 //# sourceMappingURL=index.js.map

package/dist/modules/components/select/selectOptionsContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/select/selectOptionsContainer/index.tsx"],"sourcesContent":["import { Search } from \"lucide-react\";\nimport {\n\ttype ChangeEvent,\n\ttype ReactNode,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { Input } from \"../../input\";\n\nimport \"./styles.css\";\n\ntype SelectOptionsContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tisSearchable: boolean;\n\tchildren: ReactNode;\n\tsearch: string;\n\tonSearch: (value: string) => void;\n};\n\nfunction SelectOptionsContainer(props: SelectOptionsContainerProps) {\n\tconst { children, id, isFocused, isSearchable, search, onSearch } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst [position, setPosition] = useState<\"bottom\" | \"top\">(\"bottom\");\n\n\tuseScrollLock(isFocused);\n\n\tuseEffect(() => {\n\t\tif (!isFocused) return;\n\n\t\tconst checkContainerPosition = () => {\n\t\t\tif (!containerRef.current) return;\n\n\t\t\tconst parentElement = containerRef.current.parentElement;\n\t\t\tif (!parentElement) return;\n\n\t\t\tconst parentRect = parentElement.getBoundingClientRect();\n\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\tconst estimatedContainerHeight = 300;\n\t\t\tconst spaceBelow = viewportHeight - parentRect.bottom;\n\n\t\t\tif (\n\t\t\t\tspaceBelow < estimatedContainerHeight &&\n\t\t\t\tparentRect.top > estimatedContainerHeight\n\t\t\t) {\n\t\t\t\tsetPosition(\"top\");\n\t\t\t} else {\n\t\t\t\tsetPosition(\"bottom\");\n\t\t\t}\n\t\t};\n\n\t\tcheckContainerPosition();\n\t}, [isFocused]);\n\n\tfunction handleSearch(e: ChangeEvent<HTMLInputElement>) {\n\t\tif (!isSearchable) return;\n\t\tonSearch(e.target.value);\n\t}\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\tclassName={`arkynSelectOptionsContainer ${position}`}\n\t\t>\n\t\t\t{isSearchable && (\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tname=\"search-select\"\n\t\t\t\t\tvariant=\"underline\"\n\t\t\t\t\tleftIcon={Search}\n\t\t\t\t\tvalue={search}\n\t\t\t\t\tonChange={handleSearch}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { SelectOptionsContainer };\n"],"mappings":";;;;;;;AAuBA,SAAS,EAAuB,GAAoC;CACnE,IAAM,EAAE,aAAU,OAAI,cAAW,iBAAc,WAAQ,gBAAa,GAE9D,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAU,KAAe,EAA2B,QAAQ;CAInE,AAFA,EAAc,CAAS,GAEvB,QAAgB;EACV,YAEgC;GACpC,IAAI,CAAC,EAAa,SAAS;GAE3B,IAAM,IAAgB,EAAa,QAAQ;GAC3C,IAAI,CAAC,GAAe;GAEpB,IAAM,IAAa,EAAc,sBAAsB;GAMvD,AALuB,OAAO,cAGM,EAAW,SAGjC,OACb,EAAW,MAAM,MAEjB,EAAY,KAAK,IAEjB,EAAY,QAAQ;EAEtB,EAEA,CAAuB;CACxB,GAAG,CAAC,CAAS,CAAC;CAEd,SAAS,EAAa,GAAkC;EAClD,KACL,EAAS,EAAE,OAAO,KAAK;CACxB;CAIA,OAFK,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,WAAW,+BAA+B;YAJ3C,CAME,KACA,kBAAC,GAAD;GACC,MAAK;GACL,MAAK;GACL,SAAQ;GACR,UAAU;GACV,OAAO;GACP,UAAU;EACV,CAAA,GAGD,CACG;MArBiB;AAuBxB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/select/selectOptionsContainer/index.tsx"],"sourcesContent":["import { Search } from \"lucide-react\";\nimport { type ChangeEvent, type ReactNode, useRef } from \"react\";\n\nimport { useFlipPosition } from \"../../../hooks/useFlipPosition\";\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { Input } from \"../../input\";\n\nimport \"./styles.css\";\n\ntype SelectOptionsContainerProps = {\n\tid?: string;\n\tisFocused: boolean;\n\tisSearchable: boolean;\n\tchildren: ReactNode;\n\tsearch: string;\n\tonSearch: (value: string) => void;\n};\n\nfunction SelectOptionsContainer(props: SelectOptionsContainerProps) {\n\tconst { children, id, isFocused, isSearchable, search, onSearch } = props;\n\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst position = useFlipPosition(containerRef, isFocused, 300);\n\n\tuseScrollLock(isFocused);\n\n\tfunction handleSearch(e: ChangeEvent<HTMLInputElement>) {\n\t\tif (!isSearchable) return;\n\t\tonSearch(e.target.value);\n\t}\n\n\tif (!isFocused) return null;\n\n\treturn (\n\t\t<div\n\t\t\tref={containerRef}\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\tclassName={`arkynSelectOptionsContainer ${position}`}\n\t\t>\n\t\t\t{isSearchable && (\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tname=\"search-select\"\n\t\t\t\t\tvariant=\"underline\"\n\t\t\t\t\tleftIcon={Search}\n\t\t\t\t\tvalue={search}\n\t\t\t\t\tonChange={handleSearch}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport { SelectOptionsContainer };\n"],"mappings":";;;;;;;;AAkBA,SAAS,EAAuB,GAAoC;CACnE,IAAM,EAAE,aAAU,OAAI,cAAW,iBAAc,WAAQ,gBAAa,GAE9D,IAAe,EAAuB,IAAI,GAC1C,IAAW,EAAgB,GAAc,GAAW,GAAG;CAE7D,EAAc,CAAS;CAEvB,SAAS,EAAa,GAAkC;EAClD,KACL,EAAS,EAAE,OAAO,KAAK;CACxB;CAIA,OAFK,IAGJ,kBAAC,OAAD;EACC,KAAK;EACD;EACJ,MAAK;EACL,WAAW,+BAA+B;YAJ3C,CAME,KACA,kBAAC,GAAD;GACC,MAAK;GACL,MAAK;GACL,SAAQ;GACR,UAAU;GACV,OAAO;GACP,UAAU;EACV,CAAA,GAGD,CACG;MArBiB;AAuBxB"}

package/dist/modules/hooks/useFlipPosition.js

@@ -0,0 +1,26 @@
+import { useEffect as e, useState as t } from "react";
+//#region src/hooks/useFlipPosition.ts
+function n(n, r, i) {
+	let [a, o] = t("bottom");
+	return e(() => {
+		if (!r) return;
+		function e() {
+			if (!n.current) return;
+			let e = n.current.parentElement;
+			if (!e) return;
+			let t = e.getBoundingClientRect();
+			window.innerHeight - t.bottom < i && t.top > i ? o("top") : o("bottom");
+		}
+		return e(), window.addEventListener("resize", e), () => {
+			window.removeEventListener("resize", e);
+		};
+	}, [
+		n,
+		r,
+		i
+	]), a;
+}
+//#endregion
+export { n as useFlipPosition };
+
+//# sourceMappingURL=useFlipPosition.js.map

package/dist/modules/hooks/useFlipPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFlipPosition.js","names":[],"sources":["../../../src/hooks/useFlipPosition.ts"],"sourcesContent":["import { type RefObject, useEffect, useState } from \"react\";\n\ntype FlipPosition = \"bottom\" | \"top\";\n\n/**\n * useFlipPosition, computes whether a floating panel should render `\"bottom\"`\n * or `\"top\"` relative to its anchor, flipping to `\"top\"` when there isn't\n * enough viewport space below it.\n *\n * The anchor used for the calculation is `containerRef.current.parentElement`,\n * matching how `SelectOptionsContainer`, `MultiSelectOptionsContainer`, and\n * `DatePickerCalendarContainer` render their floating panel as a sibling\n * positioned relative to that parent.\n *\n * Recomputes when `isActive` becomes `true`, and again on every `resize`\n * event while `isActive` stays `true`, so the position stays correct if the\n * viewport is resized while the panel is open.\n *\n * Only positioning is handled here — no selection, focus, or keyboard logic.\n *\n * @param containerRef - Ref to the floating panel element (its `parentElement` is used as the anchor).\n * @param isActive - When `true`, the position is computed and kept up to date.\n * @param estimatedContainerHeight - Estimated height (px) of the floating panel, used to decide if it fits below the anchor.\n * @returns `\"bottom\"` or `\"top\"`.\n *\n * @example\n * ```tsx\n * function CustomFloatingPanel({ isOpen }) {\n *   const containerRef = useRef<HTMLDivElement>(null);\n *   const position = useFlipPosition(containerRef, isOpen, 300);\n *   return isOpen ? (\n *     <div ref={containerRef} className={`panel ${position}`} />\n *   ) : null;\n * }\n * ```\n */\n\nfunction useFlipPosition(\n\tcontainerRef: RefObject<HTMLElement | null>,\n\tisActive: boolean,\n\testimatedContainerHeight: number,\n): FlipPosition {\n\tconst [position, setPosition] = useState<FlipPosition>(\"bottom\");\n\n\tuseEffect(() => {\n\t\tif (!isActive) return;\n\n\t\tfunction checkContainerPosition() {\n\t\t\tif (!containerRef.current) return;\n\n\t\t\tconst parentElement = containerRef.current.parentElement;\n\t\t\tif (!parentElement) return;\n\n\t\t\tconst parentRect = parentElement.getBoundingClientRect();\n\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\tconst spaceBelow = viewportHeight - parentRect.bottom;\n\n\t\t\tif (\n\t\t\t\tspaceBelow < estimatedContainerHeight &&\n\t\t\t\tparentRect.top > estimatedContainerHeight\n\t\t\t) {\n\t\t\t\tsetPosition(\"top\");\n\t\t\t} else {\n\t\t\t\tsetPosition(\"bottom\");\n\t\t\t}\n\t\t}\n\n\t\tcheckContainerPosition();\n\n\t\twindow.addEventListener(\"resize\", checkContainerPosition);\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener(\"resize\", checkContainerPosition);\n\t\t};\n\t}, [containerRef, isActive, estimatedContainerHeight]);\n\n\treturn position;\n}\n\nexport type { FlipPosition };\nexport { useFlipPosition };\n"],"mappings":";;AAqCA,SAAS,EACR,GACA,GACA,GACe;CACf,IAAM,CAAC,GAAU,KAAe,EAAuB,QAAQ;CAmC/D,OAjCA,QAAgB;EACf,IAAI,CAAC,GAAU;EAEf,SAAS,IAAyB;GACjC,IAAI,CAAC,EAAa,SAAS;GAE3B,IAAM,IAAgB,EAAa,QAAQ;GAC3C,IAAI,CAAC,GAAe;GAEpB,IAAM,IAAa,EAAc,sBAAsB;GAKvD,AAJuB,OAAO,cAEM,EAAW,SAGjC,KACb,EAAW,MAAM,IAEjB,EAAY,KAAK,IAEjB,EAAY,QAAQ;EAEtB;EAMA,OAJA,EAAuB,GAEvB,OAAO,iBAAiB,UAAU,CAAsB,SAE3C;GACZ,OAAO,oBAAoB,UAAU,CAAsB;EAC5D;CACD,GAAG;EAAC;EAAc;EAAU;CAAwB,CAAC,GAE9C;AACR"}

package/dist/modules/utils/escapeForInlineScript.js

@@ -0,0 +1,14 @@
+//#region src/utils/escapeForInlineScript.ts
+function e(e) {
+	return JSON.stringify(e ?? "").replace(/</g, "\\u003C");
+}
+function t(e) {
+	return JSON.stringify(e).replace(/</g, "\\u003C");
+}
+function n(e) {
+	return /^[A-Za-z_$][A-Za-z0-9_$]*$/.test(e);
+}
+//#endregion
+export { n as isValidJsIdentifier, t as toSafeScriptJson, e as toSafeScriptString };
+
+//# sourceMappingURL=escapeForInlineScript.js.map