@parallelworks/ui 0.40.1 → 0.42.0

package/dist/components/SwitchToggle.d.ts

@@ -1,15 +0,0 @@
-interface IToggleProps {
-    onChange: (value: boolean) => void;
-    /** Lets a `<label htmlFor>` point at the toggle. */
-    id?: string | undefined;
-    'aria-describedby'?: string | undefined;
-    value?: boolean;
-    /** Display label for the on/off positions; defaults to Yes/No. */
-    yesLabel?: string;
-    noLabel?: string;
-    disabled?: boolean;
-    datatip?: string | undefined;
-    invalid?: boolean;
-}
-declare function SwitchToggle({ onChange, id, 'aria-describedby': describedBy, value, yesLabel, noLabel, disabled, datatip, invalid, }: IToggleProps): import("react").JSX.Element;
-export default SwitchToggle;

package/dist/components/SwitchToggle.js

@@ -1,57 +0,0 @@
-import { TOOLTIP_ID } from "./Tooltip.js";
-import { Switch } from "@headlessui/react";
-import cx from "classnames";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/SwitchToggle.tsx
-function SwitchToggle({ onChange, id, "aria-describedby": describedBy, value, yesLabel = "Yes", noLabel = "No", disabled = false, datatip = "", invalid = false }) {
-	const [enabled, setEnabled] = useState(value ?? false);
-	const [isFocused, setIsFocused] = useState(false);
-	const setIsEnabled = (e) => {
-		setEnabled(e);
-		onChange(e);
-	};
-	const checked = value ?? enabled;
-	return /* @__PURE__ */ jsx("div", {
-		...datatip ? {
-			"data-tooltip-content": datatip,
-			"data-tooltip-id": TOOLTIP_ID
-		} : {},
-		className: cx("w-[198px] h-[30px] overflow-hidden shadow-sm rounded-md cursor-pointer ring-(--theme-border) ring-1", invalid && "border-red-600 focus:border-red-600 focus:ring-red-500 ring-1 ring-red-500", !invalid && isFocused && "ring-1 ring-[rgba(82,168,236,.8)] drop-shadow-[0_1px_2px_rgba(82,168,236,0.8)]"),
-		children: /* @__PURE__ */ jsx(Switch, {
-			id,
-			"aria-describedby": describedBy,
-			checked,
-			disabled,
-			onChange: setIsEnabled,
-			className: "text-white text-sm shadow-sm rounded-md cursor-pointer",
-			onClick: (e) => e.stopPropagation(),
-			onFocus: () => setIsFocused(true),
-			onBlur: () => setIsFocused(false),
-			children: /* @__PURE__ */ jsxs("div", {
-				className: cx(checked ? "translate-x-0" : "-translate-x-[100px]", "relative transform flex flex-row  ease-in-out duration-500", disabled && "cursor-not-allowed opacity-50"),
-				children: [
-					/* @__PURE__ */ jsx("div", {
-						className: "inline text-center capitalize px-2 py-1 w-[99px] border-0",
-						style: {
-							background: `linear-gradient(
-              to bottom,
-              var(--theme-element, #04c) 0%,
-              var(--theme-element, #08c) 100%
-            )`,
-							color: "var(--theme-element-text, #ffffff)"
-						},
-						children: yesLabel
-					}),
-					/* @__PURE__ */ jsx("div", { className: "inline px-2 py-1 h-8 w-[99px] bg-linear-to-b from-white to-[#e6e6e6]" }),
-					/* @__PURE__ */ jsx("div", {
-						className: "inline text-center capitalize px-2 py-1 w-[99px] bg-linear-to-b from-[#e6e6e6] to-white bg-[#04c] text-black",
-						children: noLabel
-					})
-				]
-			})
-		})
-	});
-}
-//#endregion
-export { SwitchToggle as default };

package/dist/components/SwitchToggleSmall.d.ts

@@ -1,6 +0,0 @@
-import type React from 'react';
-interface SwitchToggleSmallProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value'> {
-    value?: boolean;
-}
-export default function SwitchToggleSmall({ value, disabled, className, ...buttonProps }: SwitchToggleSmallProps): React.JSX.Element;
-export {};

package/dist/components/SwitchToggleSmall.js

@@ -1,14 +0,0 @@
-import cx from "classnames";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/SwitchToggleSmall.tsx
-function SwitchToggleSmall({ value = false, disabled = false, className, ...buttonProps }) {
-	return /* @__PURE__ */ jsx("button", {
-		disabled,
-		...buttonProps,
-		role: "switch",
-		"aria-checked": value,
-		className: cx("relative w-11 h-6 rounded-full transition-colors duration-400 ease-in-out", "before:content-[\"\"] before:absolute before:w-4 before:h-4 before:top-1 before:left-1", "before:bg-white before:rounded-full before:transition-transform before:duration-400 before:ease-in-out", disabled ? "bg-(--theme-border) cursor-not-allowed" : "cursor-pointer", !disabled && value ? "bg-(--theme-element) before:translate-x-5" : "bg-(--theme-border)", className)
-	});
-}
-//#endregion
-export { SwitchToggleSmall as default };

package/dist/components/Toggle.d.ts

@@ -1,6 +0,0 @@
-export declare function Toggle({ checked, onChange, disabled, label, }: {
-    checked: boolean;
-    onChange: (checked: boolean) => void;
-    disabled?: boolean;
-    label?: string;
-}): import("react").JSX.Element;

package/dist/components/Toggle.js

@@ -1,20 +0,0 @@
-import cx from "classnames";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/Toggle.tsx
-function Toggle({ checked, onChange, disabled, label }) {
-	return /* @__PURE__ */ jsxs("label", {
-		role: "none",
-		onClick: (e) => e.stopPropagation(),
-		className: cx("relative inline-flex items-center", disabled ? "cursor-not-allowed opacity-60" : "cursor-pointer"),
-		children: [/* @__PURE__ */ jsx("input", {
-			type: "checkbox",
-			className: "peer sr-only",
-			checked,
-			onChange: (e) => onChange(e.target.checked),
-			disabled,
-			"aria-label": label
-		}), /* @__PURE__ */ jsx("div", { className: "h-6 w-11 rounded-full bg-(--theme-muted-panel-bg) transition-colors peer-checked:bg-(--theme-element) peer-focus-visible:ring-2 peer-focus-visible:ring-[color-mix(in_srgb,var(--theme-element)_25%,transparent)] after:absolute after:start-[2px] after:top-[2px] after:h-5 after:w-5 after:rounded-full after:bg-white after:shadow-sm after:transition-transform after:content-[\"\"] motion-reduce:after:transition-none peer-checked:after:translate-x-5" })]
-	});
-}
-//#endregion
-export { Toggle };

package/dist/components/dropdownUtils.d.ts

@@ -1,37 +0,0 @@
-import type React from 'react';
-export interface IOptions<T = unknown> {
-    label: string;
-    value: T;
-    secondaryValue?: unknown | undefined;
-    disabled?: boolean | undefined;
-    icon?: React.ReactNode | undefined;
-    description?: string | undefined;
-    /** Hidden behind the category's toggle row until the category is expanded. */
-    collapsible?: boolean | undefined;
-    /** Always listed regardless of the typed query (e.g. a trailing "Create new…" action). */
-    pinned?: boolean | undefined;
-}
-export interface ICategory<T = unknown> {
-    category?: string | undefined;
-    options: IOptions<T>[];
-}
-export declare function isCategory<T>(option: ICategory<T> | IOptions<T> | string): option is ICategory<T>;
-export declare function isOption<T>(option: ICategory<T> | IOptions<T> | string): option is IOptions<T>;
-export declare function flattenOptions<T>(options: (ICategory<T> | IOptions<T> | string)[]): (IOptions<T> | ICategory<T>)[];
-export declare function filterOption<T>(option: IOptions<T>, query: string): boolean;
-export declare function toggleSetMember<T>(set: ReadonlySet<T>, member: T): Set<T>;
-export type FlatDisplayOption = IOptions & {
-    category?: boolean;
-    /** Set on a category's toggle row to the category it expands/collapses. */
-    toggle?: string;
-};
-export declare function flattenDisplayOptions({ options, query, expandedCategories, collapsedLabel, selectedValue, allowCustomValue, customValueLabel, }: {
-    options: (ICategory | IOptions)[];
-    query: string;
-    expandedCategories?: ReadonlySet<string>;
-    collapsedLabel?: (count: number) => string;
-    selectedValue?: unknown;
-    allowCustomValue?: boolean;
-    customValueLabel?: string;
-}): FlatDisplayOption[];
-export declare function DropdownCaret(): React.JSX.Element;

package/dist/components/dropdownUtils.js

@@ -1,99 +0,0 @@
-import { FaCaretDown } from "../icons/fa/FaCaretDown.js";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/dropdownUtils.tsx
-function isCategory(option) {
-	return typeof option === "object" && option !== null && "options" in option;
-}
-function isOption(option) {
-	return typeof option === "object" && "label" in option && "value" in option && !("category" in option);
-}
-function normalizeOption(option) {
-	if (typeof option === "string") return {
-		label: option,
-		value: option
-	};
-	if (typeof option === "object" && option !== null && "options" in option) return {
-		category: option.category,
-		options: Array.isArray(option.options) ? option.options : []
-	};
-	return option;
-}
-function flattenOptions(options) {
-	const result = [];
-	for (const opt of options) {
-		const normalized = normalizeOption(opt);
-		if (isCategory(normalized)) {
-			const children = Array.isArray(normalized.options) ? normalized.options : [];
-			result.push(normalized);
-			result.push(...children);
-		} else result.push(normalized);
-	}
-	return result;
-}
-var normalizeForMatch = (text) => String(text).toLowerCase().replace(/-/g, "");
-function filterOption(option, query) {
-	if (query === "") return true;
-	const q = normalizeForMatch(query);
-	return normalizeForMatch(option.label ?? "").includes(q) || option.secondaryValue !== void 0 && normalizeForMatch(option.secondaryValue).includes(q);
-}
-function toggleSetMember(set, member) {
-	const next = new Set(set);
-	if (next.has(member)) next.delete(member);
-	else next.add(member);
-	return next;
-}
-function collapsedCategoryRows(category, filtered, collapsibleCount, expanded, collapsedLabel) {
-	const rows = [];
-	let togglePlaced = false;
-	for (const opt of filtered) {
-		if (!opt.collapsible) {
-			rows.push(opt);
-			continue;
-		}
-		if (!togglePlaced) {
-			togglePlaced = true;
-			rows.push({
-				label: collapsedLabel(collapsibleCount),
-				value: `__toggle__:${category}`,
-				disabled: true,
-				toggle: category
-			});
-		}
-		if (expanded) rows.push(opt);
-	}
-	return rows;
-}
-function flattenDisplayOptions({ options, query, expandedCategories, collapsedLabel, selectedValue, allowCustomValue, customValueLabel }) {
-	const flatOptions = options.flatMap((option) => {
-		if (!isCategory(option)) return option.pinned || filterOption(option, query) ? [option] : [];
-		const filtered = option.options.filter((opt) => filterOption(opt, query));
-		if (filtered.length === 0) return [];
-		const category = option.category || "";
-		const header = {
-			label: category,
-			value: category,
-			disabled: true,
-			category: true
-		};
-		const collapsibleCount = filtered.filter((o) => o.collapsible).length;
-		if (query || collapsibleCount === 0 || !collapsedLabel) return [header, ...filtered];
-		return [header, ...collapsedCategoryRows(category, filtered, collapsibleCount, expandedCategories?.has(category) ?? false, collapsedLabel)];
-	});
-	if (allowCustomValue) {
-		const customValue = query || selectedValue || "";
-		flatOptions.unshift({
-			label: `${customValueLabel} "${customValue}"`,
-			value: customValue
-		});
-	} else if (flatOptions.length === 0) return [{
-		label: "No options found",
-		value: "",
-		disabled: true
-	}];
-	return flatOptions;
-}
-function DropdownCaret() {
-	return /* @__PURE__ */ jsx(FaCaretDown, { className: "text-neutral-400 absolute top-1/2 -translate-y-1/2 right-0 mr-3 inset-y-0 flex items-center rounded-r-md focus:outline-hidden" });
-}
-//#endregion
-export { DropdownCaret, filterOption, flattenDisplayOptions, flattenOptions, isCategory, isOption, toggleSetMember };

package/dist/form/SpecialTypes/DropdownWrapper.d.ts

@@ -1,25 +0,0 @@
-import FormikCustomDropdown from './FormikCustomDropdown.js';
-export default function DropdownWrapper({ options, onChange, fieldObj, setFormDirty, invalid, loading, disabled, allowCustomValue, currentValue, setFieldValue, setFieldTouched, }: {
-    options: React.ComponentProps<typeof FormikCustomDropdown>['options'];
-    onChange?: ((val: string) => void) | undefined;
-    fieldObj: {
-        name?: string | undefined;
-        label?: string | undefined;
-        disabled?: boolean | string | undefined;
-        placeholder?: string | undefined;
-        default?: unknown;
-        secondaryField?: string | string[] | undefined;
-        value?: string | undefined;
-        autoselect?: boolean | string | Record<string, unknown> | undefined;
-        allowCustomValue?: boolean | undefined;
-        customValueLabel?: string | undefined;
-    };
-    setFormDirty: React.ComponentProps<typeof FormikCustomDropdown>['setFormDirty'];
-    invalid?: boolean;
-    loading?: boolean;
-    disabled?: boolean | undefined;
-    allowCustomValue?: boolean;
-    currentValue: unknown;
-    setFieldValue: React.ComponentProps<typeof FormikCustomDropdown>['setFieldValue'];
-    setFieldTouched: React.ComponentProps<typeof FormikCustomDropdown>['setFieldTouched'];
-}): import("react").JSX.Element;

package/dist/form/SpecialTypes/DropdownWrapper.js

@@ -1,28 +0,0 @@
-import FormikCustomDropdown_default from "./FormikCustomDropdown.js";
-import { getPlaceholder } from "../utils/getPlaceholder.js";
-import { jsx } from "react/jsx-runtime";
-//#region src/form/SpecialTypes/DropdownWrapper.tsx
-function DropdownWrapper({ options, onChange, fieldObj, setFormDirty, invalid = false, loading = false, disabled, allowCustomValue, currentValue, setFieldValue, setFieldTouched }) {
-	return /* @__PURE__ */ jsx(FormikCustomDropdown_default, {
-		invalid,
-		className: "w-full",
-		onChange,
-		loading,
-		setFormDirty,
-		options,
-		disabled: disabled ?? Boolean(fieldObj.disabled),
-		placeholder: getPlaceholder(fieldObj.placeholder, typeof fieldObj.default === "string" ? fieldObj.default : void 0),
-		name: fieldObj.name ?? "",
-		ariaLabel: fieldObj.label,
-		secondaryField: fieldObj.secondaryField,
-		value: fieldObj.value,
-		autoselect: fieldObj.autoselect === void 0 ? void 0 : Boolean(fieldObj.autoselect),
-		allowCustomValue: allowCustomValue ?? fieldObj.allowCustomValue,
-		customValueLabel: fieldObj.customValueLabel,
-		currentValue,
-		setFieldValue,
-		setFieldTouched
-	});
-}
-//#endregion
-export { DropdownWrapper as default };

package/dist/form/SpecialTypes/FormikCustomDropdown.d.ts

@@ -1,51 +0,0 @@
-import Dropdown from '../../components/Dropdown.js';
-import type { TSetFormDirty } from '../Form.js';
-declare function toComparableOptions(options: React.ComponentProps<typeof Dropdown>['options'] | undefined): (string | {
-    category: string | undefined;
-    options: ({
-        label: string;
-        value: unknown;
-        disabled: boolean | undefined;
-    } | {
-        label: string;
-        value: unknown;
-        disabled: boolean | undefined;
-        description: string;
-    })[];
-} | {
-    label: string;
-    value: unknown;
-    disabled: boolean | undefined;
-} | {
-    category?: never;
-    options?: never;
-    label: string;
-    value: unknown;
-    disabled: boolean | undefined;
-    description: string;
-})[] | undefined;
-type FormikCustomDropdownProps = {
-    name: string;
-    ariaLabel?: string | undefined;
-    options: React.ComponentProps<typeof Dropdown>['options'];
-    setFormDirty: TSetFormDirty;
-    onChange?: ((val: string) => void) | undefined;
-    className?: string;
-    secondaryField?: string | string[] | undefined;
-    disabled?: boolean;
-    loading?: boolean;
-    invalid?: boolean;
-    autoselect?: boolean | undefined;
-    value?: string | undefined;
-    allowCustomValue?: boolean | undefined;
-    customValueLabel?: string | undefined;
-    placeholder?: string;
-    currentValue: unknown;
-    setFieldValue: (field: string, value: unknown, shouldValidate?: boolean) => void;
-    setFieldTouched: (field: string, isTouched?: boolean, shouldValidate?: boolean) => void;
-};
-declare const _default: import("react").MemoExoticComponent<({ name, ariaLabel, options, setFormDirty, onChange, className, secondaryField, disabled, loading, invalid, autoselect, value, allowCustomValue, customValueLabel, placeholder, currentValue, setFieldValue, setFieldTouched, }: FormikCustomDropdownProps) => import("react").JSX.Element>;
-export default _default;
-export declare const Testables: {
-    toComparableOptions: typeof toComparableOptions;
-};

package/dist/form/SpecialTypes/FormikCustomDropdown.js

@@ -1,119 +0,0 @@
-import { isCategory } from "../../components/dropdownUtils.js";
-import Dropdown from "../../components/Dropdown.js";
-import { applySecondaryField, findSecondaryOption } from "../utils/secondaryField.js";
-import { useFieldControlProps, useFieldRequired } from "../fieldContext.js";
-import cx from "classnames";
-import { memo, useEffect, useEffectEvent, useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import deepEqual from "fast-deep-equal";
-//#region src/form/SpecialTypes/FormikCustomDropdown.tsx
-function toComparableOptions(options) {
-	return options?.map((option) => {
-		if (typeof option === "string") return option;
-		if (isCategory(option)) return {
-			category: option.category,
-			options: option.options.map((o) => {
-				const base = {
-					label: o.label,
-					value: o.value,
-					disabled: o.disabled
-				};
-				return o.description !== void 0 ? {
-					...base,
-					description: o.description
-				} : base;
-			})
-		};
-		const base = {
-			label: option.label,
-			value: option.value,
-			disabled: option.disabled
-		};
-		return option.description !== void 0 ? {
-			...base,
-			description: option.description
-		} : base;
-	});
-}
-function arePropsEqual(prev, next) {
-	for (const key of Object.keys(next)) if (key === "options") {
-		if (!deepEqual(toComparableOptions(prev.options), toComparableOptions(next.options))) return false;
-	} else if (prev[key] !== next[key]) return false;
-	return true;
-}
-var FormikCustomDropdown_default = memo(function FormikCustomDropdown({ name, ariaLabel, options, setFormDirty, onChange, className, secondaryField, disabled = false, loading = false, invalid = false, autoselect, value, allowCustomValue = false, customValueLabel, placeholder, currentValue, setFieldValue, setFieldTouched }) {
-	const required = useFieldRequired();
-	const controlProps = useFieldControlProps();
-	const handleChange = (val) => {
-		if (secondaryField && typeof options[0] !== "string") {
-			const option = findSecondaryOption(options, val);
-			if (option) applySecondaryField(secondaryField, option.secondaryValue, setFieldValue);
-		}
-		onChange?.(val);
-		setFieldValue(name, val);
-		setFieldTouched(name, true);
-		setFormDirty(true);
-	};
-	const prevOptions = useRef(null);
-	const syncAutoselect = useEffectEvent((options, autoselect) => {
-		if (deepEqual(prevOptions.current, toComparableOptions(options))) return;
-		if (prevOptions.current === null && currentValue !== void 0 && currentValue !== null) {
-			prevOptions.current = toComparableOptions(options);
-			return;
-		}
-		prevOptions.current = toComparableOptions(options);
-		if (autoselect === false || !options?.length) return;
-		if (autoselect === void 0) {
-			const [first] = options;
-			if (first && isCategory(first)) {
-				let optionCount = 0;
-				for (const category of options) {
-					if (isCategory(category)) optionCount += category.options.length;
-					if (optionCount > 1) return;
-				}
-			} else if (options.length !== 1) return;
-		}
-		if (!options?.find((option) => {
-			if (typeof option === "string") return option === currentValue;
-			else if (isCategory(option)) return option.options.some((subOption) => {
-				return subOption.value === currentValue;
-			});
-			return option.value === currentValue;
-		}) || autoselect) {
-			let val;
-			for (const option of options) if (typeof option === "string") {
-				val = option;
-				break;
-			} else if (isCategory(option)) {
-				const enabled = option.options.find((o) => !o.disabled);
-				if (enabled) {
-					val = enabled.value;
-					break;
-				}
-			} else if (!option.disabled) {
-				val = option.value;
-				break;
-			}
-			if (val !== void 0) handleChange(val);
-		}
-	});
-	useEffect(() => {
-		syncAutoselect(options, autoselect);
-	}, [options, autoselect]);
-	return /* @__PURE__ */ jsx(Dropdown, {
-		...controlProps,
-		textBoxClassName: cx(className, invalid && "invalid"),
-		ariaLabel,
-		required,
-		onChange: (val) => handleChange(val),
-		value: options?.length === 0 && !allowCustomValue ? value : currentValue,
-		options,
-		placeholder,
-		disabled,
-		loading,
-		allowCustomValue,
-		customValueLabel
-	});
-}, arePropsEqual);
-//#endregion
-export { FormikCustomDropdown_default as default };

package/dist/form/SpecialTypes/FormikCustomInput.d.ts

@@ -1,19 +0,0 @@
-type InputValue = string | number | undefined;
-export default function FormikCustomInput({ name, type, step, placeholder, onChange, disabled, min, max, sanitize, invalid, lowercase, minLength, maxLength, defaultValue, value, }: {
-    name: string;
-    type: 'string' | 'number' | 'password';
-    placeholder?: string;
-    onChange?: (val: InputValue) => void;
-    disabled?: boolean;
-    step?: number | undefined;
-    min?: number | undefined;
-    max?: number | undefined;
-    sanitize?: string | undefined;
-    invalid?: boolean;
-    lowercase?: boolean | undefined;
-    minLength?: number | undefined;
-    maxLength?: number | undefined;
-    defaultValue?: InputValue;
-    value?: InputValue;
-}): import("react").JSX.Element;
-export {};

package/dist/form/SpecialTypes/FormikCustomInput.js

@@ -1,121 +0,0 @@
-import { LuEye } from "../../icons/lu/LuEye.js";
-import { LuEyeOff } from "../../icons/lu/LuEyeOff.js";
-import { useFieldControlProps, useFieldRequired } from "../fieldContext.js";
-import cx from "classnames";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useField, useFormikContext } from "formik";
-//#region src/form/SpecialTypes/FormikCustomInput.tsx
-var DEBOUNCE_MS = 500;
-function FormikCustomInput({ name, type, step, placeholder, onChange, disabled, min, max, sanitize, invalid = false, lowercase = false, minLength, maxLength, defaultValue = "", value }) {
-	const [field] = useField(name);
-	const required = useFieldRequired();
-	const controlProps = useFieldControlProps();
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const [showPassword, setShowPassword] = useState(false);
-	const isPassword = type === "password";
-	const [localValue, setLocalValue] = useState(value ?? field.value);
-	const isFocused = useRef(false);
-	const debounceRef = useRef(null);
-	const pendingRef = useRef(null);
-	useEffect(() => {
-		if (!isFocused.current) setLocalValue(value ?? field.value);
-	}, [field.value, value]);
-	const sanitizeRegexp = useMemo(() => {
-		if (sanitize === void 0) return;
-		try {
-			return new RegExp(sanitize, "g");
-		} catch {
-			console.error("Invalid regex for sanitization:", sanitize);
-			return;
-		}
-	}, [sanitize]);
-	const sanitizeName = useCallback((val) => {
-		const cased = lowercase ? val.toLowerCase() : val;
-		return sanitizeRegexp ? cased.replace(sanitizeRegexp, "") : cased;
-	}, [sanitizeRegexp, lowercase]);
-	const flushToFormik = useCallback((val) => {
-		pendingRef.current = null;
-		onChange?.(val);
-		setFieldTouched(name, true);
-		setFieldValue(name, val);
-	}, [
-		name,
-		onChange,
-		setFieldTouched,
-		setFieldValue
-	]);
-	useEffect(() => () => {
-		clearTimeout(debounceRef.current ?? void 0);
-		if (pendingRef.current) flushToFormik(pendingRef.current.value);
-	}, [flushToFormik]);
-	const handleChange = (e) => {
-		const text = sanitizeName(e.target.value);
-		let val = text;
-		if (type === "number") {
-			const parsed = parseFloat(text);
-			val = Number.isNaN(parsed) ? void 0 : parsed;
-		}
-		if (type === "password" && val === "") val = defaultValue;
-		setLocalValue(val);
-		clearTimeout(debounceRef.current ?? void 0);
-		pendingRef.current = { value: val };
-		debounceRef.current = setTimeout(() => flushToFormik(val), DEBOUNCE_MS);
-	};
-	const handleFocus = () => {
-		isFocused.current = true;
-	};
-	const handleBlur = () => {
-		isFocused.current = false;
-		clearTimeout(debounceRef.current ?? void 0);
-		const current = localValue;
-		if (current === void 0 || current === null) return;
-		const text = current.toString();
-		let val = text;
-		if (type === "number") {
-			const parsed = parseFloat(text);
-			if (Number.isNaN(parsed)) val = void 0;
-			else if (min !== void 0 && parsed < min) val = min;
-			else if (max !== void 0 && parsed > max) val = max;
-			else val = parsed;
-		}
-		setLocalValue(val);
-		flushToFormik(val);
-	};
-	const displayValue = isPassword && localValue === defaultValue ? "" : localValue ?? "";
-	const resolvedType = isPassword ? showPassword ? "text" : "password" : type === "string" ? "text" : type;
-	const input = /* @__PURE__ */ jsx("input", {
-		...controlProps,
-		"data-1p-ignore": true,
-		className: cx("w-full", disabled && "disabled", invalid && "invalid", isPassword && "pr-8"),
-		name,
-		value: displayValue,
-		type: resolvedType,
-		"aria-required": required || void 0,
-		disabled,
-		placeholder,
-		minLength,
-		maxLength,
-		onChange: handleChange,
-		onFocus: handleFocus,
-		onBlur: handleBlur,
-		min,
-		max,
-		step
-	});
-	if (!isPassword) return input;
-	return /* @__PURE__ */ jsxs("div", {
-		className: "relative w-full",
-		children: [input, /* @__PURE__ */ jsx("button", {
-			type: "button",
-			className: "absolute right-2 top-1/2 -translate-y-1/2 theme-muted-text",
-			onClick: () => setShowPassword((prev) => !prev),
-			disabled,
-			tabIndex: -1,
-			"aria-label": showPassword ? "Hide value" : "Show value",
-			children: showPassword ? /* @__PURE__ */ jsx(LuEyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(LuEye, { className: "h-4 w-4" })
-		})]
-	});
-}
-//#endregion
-export { FormikCustomInput as default };

package/dist/form/SpecialTypes/FormikMultiSelectDropdown.d.ts

@@ -1,13 +0,0 @@
-import type { ICategory, IOptions } from '../../components/dropdownUtils.js';
-import type { TSetFormDirty } from '../Form.js';
-export default function FormikMultiSelectDropdown<T>({ name, options, setFormDirty, onChange, disabled, loading, invalid, placeholder, compareBy, }: {
-    name: string;
-    options: (ICategory<T> | IOptions<T>)[];
-    setFormDirty: TSetFormDirty;
-    onChange?: ((val: T[]) => void) | undefined;
-    disabled?: boolean;
-    loading?: boolean;
-    invalid?: boolean;
-    placeholder?: string;
-    compareBy?: (a: T, b: T) => boolean;
-}): import("react").JSX.Element;