@puzzle-ui/ui 0.0.0-stage → 0.2.0

package/dist/components/forms/autocomplete/autocomplete.css

@@ -0,0 +1,384 @@
+.puzzle-autocomplete {
+  --puzzle-autocomplete-height: 2.5rem;
+  --puzzle-autocomplete-padding: var(--puzzle-space-3, .75rem);
+  --puzzle-autocomplete-font-size: var(--puzzle-font-size-sm, .875rem);
+  gap: var(--puzzle-space-1, .25rem);
+  min-width: 0;
+  color: var(--puzzle-color-text);
+  flex-direction: column;
+  display: inline-flex;
+  position: relative;
+}
+
+.puzzle-autocomplete[data-size-mobile="sm"] {
+  --puzzle-autocomplete-height: 2rem;
+  --puzzle-autocomplete-padding: var(--puzzle-space-2, .5rem);
+  --puzzle-autocomplete-font-size: var(--puzzle-font-size-xs, .75rem);
+}
+
+.puzzle-autocomplete[data-size-mobile="md"] {
+  --puzzle-autocomplete-height: 2.5rem;
+  --puzzle-autocomplete-padding: var(--puzzle-space-3, .75rem);
+  --puzzle-autocomplete-font-size: var(--puzzle-font-size-sm, .875rem);
+}
+
+.puzzle-autocomplete[data-size-mobile="lg"] {
+  --puzzle-autocomplete-height: 3rem;
+  --puzzle-autocomplete-padding: var(--puzzle-space-4, 1rem);
+  --puzzle-autocomplete-font-size: var(--puzzle-font-size-base, 1rem);
+}
+
+@media (width >= 768px) {
+  .puzzle-autocomplete[data-size-tablet="sm"] {
+    --puzzle-autocomplete-height: 2rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-2, .5rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-xs, .75rem);
+  }
+
+  .puzzle-autocomplete[data-size-tablet="md"] {
+    --puzzle-autocomplete-height: 2.5rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-3, .75rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-sm, .875rem);
+  }
+
+  .puzzle-autocomplete[data-size-tablet="lg"] {
+    --puzzle-autocomplete-height: 3rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-4, 1rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-base, 1rem);
+  }
+
+  .puzzle-autocomplete[data-full-width-tablet="true"] {
+    width: 100%;
+  }
+
+  .puzzle-autocomplete[data-full-width-tablet="false"] {
+    width: auto;
+  }
+}
+
+@media (width >= 1024px) {
+  .puzzle-autocomplete[data-size-desktop="sm"] {
+    --puzzle-autocomplete-height: 2rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-2, .5rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-xs, .75rem);
+  }
+
+  .puzzle-autocomplete[data-size-desktop="md"] {
+    --puzzle-autocomplete-height: 2.5rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-3, .75rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-sm, .875rem);
+  }
+
+  .puzzle-autocomplete[data-size-desktop="lg"] {
+    --puzzle-autocomplete-height: 3rem;
+    --puzzle-autocomplete-padding: var(--puzzle-space-4, 1rem);
+    --puzzle-autocomplete-font-size: var(--puzzle-font-size-base, 1rem);
+  }
+
+  .puzzle-autocomplete[data-full-width-desktop="true"] {
+    width: 100%;
+  }
+
+  .puzzle-autocomplete[data-full-width-desktop="false"] {
+    width: auto;
+  }
+}
+
+.puzzle-autocomplete[data-full-width-mobile="true"] {
+  width: 100%;
+}
+
+.puzzle-autocomplete__label {
+  color: var(--puzzle-color-text);
+  font-size: var(--puzzle-font-size-sm, .875rem);
+  font-weight: var(--puzzle-font-weight-medium, 500);
+  line-height: var(--puzzle-font-line-height-body2, 1.4);
+  display: block;
+}
+
+.puzzle-autocomplete__required {
+  color: var(--puzzle-color-danger);
+  margin-inline-start: .2em;
+}
+
+.puzzle-autocomplete__anchor {
+  width: 100%;
+  min-width: 0;
+  display: block;
+}
+
+.puzzle-autocomplete__control {
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  min-height: var(--puzzle-autocomplete-height);
+  align-items: center;
+  gap: var(--puzzle-space-2, .5rem);
+  padding: 0 var(--puzzle-autocomplete-padding);
+  border: var(--puzzle-border-width, 1px) solid var(--puzzle-color-border);
+  border-radius: var(--puzzle-radius-md, .5rem);
+  background: var(--puzzle-color-surface);
+  color: var(--puzzle-color-text);
+  transition: border-color var(--puzzle-duration-fast, .15s) var(--puzzle-easing-standard, ease),
+        box-shadow var(--puzzle-duration-fast, .15s) var(--puzzle-easing-standard, ease),
+        background-color var(--puzzle-duration-fast, .15s) var(--puzzle-easing-standard, ease);
+  flex-wrap: wrap;
+  display: flex;
+}
+
+.puzzle-autocomplete__control:focus-within {
+  border-color: var(--puzzle-color-ring);
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--puzzle-color-ring), transparent 82%);
+}
+
+.puzzle-autocomplete[data-invalid="true"] .puzzle-autocomplete__control {
+  border-color: var(--puzzle-color-danger);
+}
+
+.puzzle-autocomplete[data-invalid="true"] .puzzle-autocomplete__control:focus-within {
+  outline: 2px solid color-mix(in srgb, var(--puzzle-color-danger), transparent 65%);
+  outline-offset: 1px;
+}
+
+.puzzle-autocomplete[data-disabled="true"] .puzzle-autocomplete__control {
+  background: var(--puzzle-color-surface-sunken);
+  color: var(--puzzle-color-text-muted);
+  cursor: not-allowed;
+  opacity: .6;
+}
+
+.puzzle-autocomplete__input {
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 3rem;
+  min-height: calc(var(--puzzle-autocomplete-height) - 2px);
+  color: inherit;
+  font: inherit;
+  font-size: var(--puzzle-autocomplete-font-size);
+  line-height: var(--puzzle-font-line-height-normal, 1.5);
+  background: none;
+  border: 0;
+  outline: 0;
+  flex: 8rem;
+  padding: 0;
+  display: block;
+}
+
+.puzzle-autocomplete__input::placeholder {
+  color: var(--puzzle-color-text-subtle, var(--puzzle-color-text-muted));
+  opacity: 1;
+}
+
+.puzzle-autocomplete__input:disabled {
+  cursor: not-allowed;
+}
+
+.puzzle-autocomplete__tag {
+  align-items: center;
+  gap: var(--puzzle-space-1, .25rem);
+  max-width: 100%;
+  min-height: 1.75rem;
+  border-radius: var(--puzzle-radius-sm, .25rem);
+  background: var(--puzzle-color-surface-sunken);
+  color: var(--puzzle-color-text);
+  font-size: var(--puzzle-font-size-xs, .75rem);
+  font-weight: var(--puzzle-font-weight-medium, 500);
+  flex: none;
+  padding-inline-start: var(--puzzle-space-2, .5rem);
+  padding-inline-end: .2rem;
+  display: inline-flex;
+}
+
+.puzzle-autocomplete__tag-label {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+  display: block;
+  overflow: hidden;
+}
+
+.puzzle-autocomplete__tag-remove {
+  border-radius: var(--puzzle-radius-sm, .25rem);
+  width: 1.5rem;
+  height: 1.5rem;
+  color: var(--puzzle-color-text-muted);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  flex: none;
+  justify-content: center;
+  align-items: center;
+  padding: 0;
+  font-size: 1rem;
+  line-height: 1;
+  display: inline-flex;
+}
+
+.puzzle-autocomplete__tag-remove:hover {
+  background: var(--puzzle-color-border);
+  color: var(--puzzle-color-text);
+}
+
+.puzzle-autocomplete__tag-remove:focus-visible {
+  outline: 2px solid var(--puzzle-color-ring);
+  outline-offset: 1px;
+}
+
+.puzzle-autocomplete__clear {
+  border-radius: var(--puzzle-radius-sm, .375rem);
+  width: 2rem;
+  height: 2rem;
+  color: var(--puzzle-color-text-muted);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  flex: none;
+  justify-content: center;
+  align-items: center;
+  padding: 0;
+  font-size: 1.25rem;
+  line-height: 1;
+  display: inline-flex;
+}
+
+.puzzle-autocomplete__clear:hover {
+  background: var(--puzzle-color-surface-sunken);
+  color: var(--puzzle-color-text);
+}
+
+.puzzle-autocomplete__clear:focus-visible {
+  outline: 2px solid var(--puzzle-color-ring);
+  outline-offset: 2px;
+}
+
+.puzzle-popout__content.puzzle-autocomplete__popover {
+  padding: 0;
+  overflow: hidden;
+}
+
+.puzzle-autocomplete__listbox {
+  box-sizing: border-box;
+  min-width: 0;
+  padding: var(--puzzle-space-1, .25rem);
+  overscroll-behavior: contain;
+  scrollbar-width: thin;
+  outline: none;
+  overflow: hidden auto;
+}
+
+.puzzle-autocomplete__option {
+  box-sizing: border-box;
+  align-items: center;
+  gap: var(--puzzle-space-2, .5rem);
+  min-width: 0;
+  min-height: 2.25rem;
+  padding: var(--puzzle-space-2, .5rem) var(--puzzle-space-3, .75rem);
+  border-radius: var(--puzzle-radius-sm, .25rem);
+  color: var(--puzzle-color-text);
+  font-size: var(--puzzle-font-size-sm, .875rem);
+  line-height: var(--puzzle-font-line-height-body2, 1.4);
+  cursor: pointer;
+  user-select: none;
+  transition: background-color var(--puzzle-duration-fast, .15s) ease,
+        color var(--puzzle-duration-fast, .15s) ease;
+  background: none;
+  display: flex;
+}
+
+.puzzle-autocomplete__option[data-active="true"] {
+  background: var(--puzzle-color-surface-sunken);
+}
+
+.puzzle-autocomplete__option[data-disabled="true"] {
+  color: var(--puzzle-color-text-subtle);
+  opacity: .5;
+  cursor: not-allowed;
+}
+
+.puzzle-autocomplete__option:after {
+  box-sizing: border-box;
+  content: "";
+  opacity: 0;
+  border-block-end: 2px solid;
+  border-inline-start: 2px solid;
+  flex: 0 0 .55rem;
+  width: .55rem;
+  height: .3rem;
+  margin-inline-start: auto;
+  transform: rotate(-45deg);
+}
+
+.puzzle-autocomplete__option[aria-selected="true"]:after {
+  opacity: 1;
+}
+
+.puzzle-autocomplete__option-content {
+  gap: var(--puzzle-space-1, .25rem);
+  flex-direction: column;
+  flex: auto;
+  min-width: 0;
+  display: flex;
+}
+
+.puzzle-autocomplete__option-label {
+  color: inherit;
+  font-weight: var(--puzzle-font-weight-medium, 500);
+}
+
+.puzzle-autocomplete__option-description {
+  color: var(--puzzle-color-text-muted);
+  font-size: var(--puzzle-font-size-xs, .75rem);
+}
+
+.puzzle-autocomplete__group + .puzzle-autocomplete__group {
+  margin-block-start: var(--puzzle-space-2, .5rem);
+}
+
+.puzzle-autocomplete__group-label {
+  padding: var(--puzzle-space-2, .5rem) var(--puzzle-space-3, .75rem);
+  color: var(--puzzle-color-text-muted);
+  font-size: var(--puzzle-font-size-xs, .75rem);
+  font-weight: var(--puzzle-font-weight-semibold, 600);
+  line-height: var(--puzzle-font-line-height-caption, 1.4);
+  user-select: none;
+}
+
+.puzzle-autocomplete__empty {
+  padding: var(--puzzle-space-3, .75rem);
+  color: var(--puzzle-color-text-muted);
+  font-size: var(--puzzle-font-size-sm, .875rem);
+  text-align: center;
+}
+
+.puzzle-autocomplete__description {
+  color: var(--puzzle-color-text-muted);
+  font-size: var(--puzzle-font-size-xs, .75rem);
+  line-height: var(--puzzle-font-line-height-caption, 1.4);
+}
+
+.puzzle-autocomplete__error {
+  color: var(--puzzle-color-danger);
+  font-size: var(--puzzle-font-size-xs, .75rem);
+  line-height: var(--puzzle-font-line-height-caption, 1.4);
+}
+
+.puzzle-autocomplete__native {
+  clip: rect(0, 0, 0, 0);
+  clip-path: inset(50%);
+  white-space: nowrap;
+  border: 0;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  position: absolute;
+  overflow: hidden;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .puzzle-autocomplete__control, .puzzle-autocomplete__option {
+    transition: none;
+  }
+}

package/dist/components/forms/autocomplete/autocomplete.types.d.cts

@@ -0,0 +1,86 @@
+import { PopoutAlignment, PopoutPosition } from "../../overlays/popout/index.cjs";
+import { CSSProperties, ComponentPropsWithRef, ReactNode } from "react";
+import { ResponsiveValue } from "@puzzle-ui/core";
+type AutocompleteSize = "sm" | "md" | "lg";
+type AutocompleteOption<T = string> = {
+  id?: string | number;
+  value: T;
+  label: string;
+  description?: ReactNode;
+  group?: string;
+  disabled?: boolean;
+};
+type AutocompleteInputChangeReason = "input" | "reset" | "clear" | "select";
+type AutocompleteOptionRenderState = {
+  selected: boolean;
+  active: boolean;
+  disabled: boolean;
+  multiple: boolean;
+};
+type AutocompleteValue<T, FreeSolo extends boolean = false> = T | (FreeSolo extends true ? string : never);
+type AutocompleteBaseProps<T, FreeSolo extends boolean = false> = Omit<ComponentPropsWithRef<"input">, "type" | "value" | "defaultValue" | "onChange" | "name" | "form" | "size" | "multiple" | "role" | "aria-autocomplete"> & {
+  options: readonly AutocompleteOption<T>[];
+  label?: ReactNode;
+  description?: ReactNode;
+  error?: ReactNode | boolean;
+  disabled?: boolean;
+  required?: boolean;
+  freeSolo?: FreeSolo;
+  multiple?: boolean;
+  name?: string;
+  form?: string;
+  serializeValue?: (value: AutocompleteValue<T, FreeSolo>) => string;
+  isOptionEqualToValue?: (option: AutocompleteOption<T>, value: AutocompleteValue<T, FreeSolo>) => boolean;
+  filterOptions?: (options: readonly AutocompleteOption<T>[], inputValue: string) => readonly AutocompleteOption<T>[];
+  renderOption?: (option: AutocompleteOption<T>, state: AutocompleteOptionRenderState) => ReactNode;
+  inputValue?: string;
+  defaultInputValue?: string;
+  onInputChange?: (value: string, reason: AutocompleteInputChangeReason) => void;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  openOnFocus?: boolean;
+  autoHighlight?: boolean;
+  clearOnBlur?: boolean;
+  clearOnEscape?: boolean;
+  clearable?: boolean;
+  clearLabel?: string;
+  removeOptionLabel?: string;
+  loading?: boolean;
+  loadingText?: ReactNode;
+  noOptionsText?: ReactNode;
+  requiredMessage?: string;
+  closeOnSelect?: boolean;
+  maxSelected?: number;
+  filterSelectedOptions?: boolean;
+  maxOptions?: number;
+  position?: PopoutPosition;
+  align?: PopoutAlignment;
+  offset?: number;
+  collisionPadding?: number;
+  matchTriggerWidth?: boolean;
+  menuMaxHeight?: CSSProperties["maxHeight"];
+  size?: ResponsiveValue<AutocompleteSize>;
+  fullWidth?: ResponsiveValue<boolean>;
+  className?: string;
+  inputClassName?: string;
+  popoverClassName?: string;
+  menuClassName?: string;
+  optionClassName?: string;
+};
+type AutocompleteSingleProps<T = string, FreeSolo extends boolean = false> = Omit<AutocompleteBaseProps<T, FreeSolo>, "freeSolo"> & {
+  multiple?: false;
+  freeSolo?: FreeSolo;
+  value?: NoInfer<AutocompleteValue<T, FreeSolo>>;
+  defaultValue?: NoInfer<AutocompleteValue<T, FreeSolo>>;
+  onChange?: (value: NoInfer<AutocompleteValue<T, FreeSolo>> | undefined) => void;
+};
+type AutocompleteMultipleProps<T = string, FreeSolo extends boolean = false> = Omit<AutocompleteBaseProps<T, FreeSolo>, "freeSolo"> & {
+  multiple: true;
+  freeSolo?: FreeSolo;
+  value?: readonly NoInfer<AutocompleteValue<T, FreeSolo>>[];
+  defaultValue?: readonly NoInfer<AutocompleteValue<T, FreeSolo>>[];
+  onChange?: (value: NoInfer<AutocompleteValue<T, FreeSolo>>[]) => void;
+};
+type AutocompleteProps<T = string, FreeSolo extends boolean = false> = AutocompleteSingleProps<T, FreeSolo> | AutocompleteMultipleProps<T, FreeSolo>;
+export type { AutocompleteBaseProps, AutocompleteInputChangeReason, AutocompleteMultipleProps, AutocompleteOption, AutocompleteOptionRenderState, AutocompleteProps, AutocompleteSingleProps, AutocompleteSize, AutocompleteValue };

package/dist/components/forms/autocomplete/autocomplete.types.d.ts

@@ -0,0 +1,86 @@
+import { PopoutAlignment, PopoutPosition } from "../../overlays/popout/index.js";
+import { ResponsiveValue } from "@puzzle-ui/core";
+import { CSSProperties, ComponentPropsWithRef, ReactNode } from "react";
+type AutocompleteSize = "sm" | "md" | "lg";
+type AutocompleteOption<T = string> = {
+  id?: string | number;
+  value: T;
+  label: string;
+  description?: ReactNode;
+  group?: string;
+  disabled?: boolean;
+};
+type AutocompleteInputChangeReason = "input" | "reset" | "clear" | "select";
+type AutocompleteOptionRenderState = {
+  selected: boolean;
+  active: boolean;
+  disabled: boolean;
+  multiple: boolean;
+};
+type AutocompleteValue<T, FreeSolo extends boolean = false> = T | (FreeSolo extends true ? string : never);
+type AutocompleteBaseProps<T, FreeSolo extends boolean = false> = Omit<ComponentPropsWithRef<"input">, "type" | "value" | "defaultValue" | "onChange" | "name" | "form" | "size" | "multiple" | "role" | "aria-autocomplete"> & {
+  options: readonly AutocompleteOption<T>[];
+  label?: ReactNode;
+  description?: ReactNode;
+  error?: ReactNode | boolean;
+  disabled?: boolean;
+  required?: boolean;
+  freeSolo?: FreeSolo;
+  multiple?: boolean;
+  name?: string;
+  form?: string;
+  serializeValue?: (value: AutocompleteValue<T, FreeSolo>) => string;
+  isOptionEqualToValue?: (option: AutocompleteOption<T>, value: AutocompleteValue<T, FreeSolo>) => boolean;
+  filterOptions?: (options: readonly AutocompleteOption<T>[], inputValue: string) => readonly AutocompleteOption<T>[];
+  renderOption?: (option: AutocompleteOption<T>, state: AutocompleteOptionRenderState) => ReactNode;
+  inputValue?: string;
+  defaultInputValue?: string;
+  onInputChange?: (value: string, reason: AutocompleteInputChangeReason) => void;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  openOnFocus?: boolean;
+  autoHighlight?: boolean;
+  clearOnBlur?: boolean;
+  clearOnEscape?: boolean;
+  clearable?: boolean;
+  clearLabel?: string;
+  removeOptionLabel?: string;
+  loading?: boolean;
+  loadingText?: ReactNode;
+  noOptionsText?: ReactNode;
+  requiredMessage?: string;
+  closeOnSelect?: boolean;
+  maxSelected?: number;
+  filterSelectedOptions?: boolean;
+  maxOptions?: number;
+  position?: PopoutPosition;
+  align?: PopoutAlignment;
+  offset?: number;
+  collisionPadding?: number;
+  matchTriggerWidth?: boolean;
+  menuMaxHeight?: CSSProperties["maxHeight"];
+  size?: ResponsiveValue<AutocompleteSize>;
+  fullWidth?: ResponsiveValue<boolean>;
+  className?: string;
+  inputClassName?: string;
+  popoverClassName?: string;
+  menuClassName?: string;
+  optionClassName?: string;
+};
+type AutocompleteSingleProps<T = string, FreeSolo extends boolean = false> = Omit<AutocompleteBaseProps<T, FreeSolo>, "freeSolo"> & {
+  multiple?: false;
+  freeSolo?: FreeSolo;
+  value?: NoInfer<AutocompleteValue<T, FreeSolo>>;
+  defaultValue?: NoInfer<AutocompleteValue<T, FreeSolo>>;
+  onChange?: (value: NoInfer<AutocompleteValue<T, FreeSolo>> | undefined) => void;
+};
+type AutocompleteMultipleProps<T = string, FreeSolo extends boolean = false> = Omit<AutocompleteBaseProps<T, FreeSolo>, "freeSolo"> & {
+  multiple: true;
+  freeSolo?: FreeSolo;
+  value?: readonly NoInfer<AutocompleteValue<T, FreeSolo>>[];
+  defaultValue?: readonly NoInfer<AutocompleteValue<T, FreeSolo>>[];
+  onChange?: (value: NoInfer<AutocompleteValue<T, FreeSolo>>[]) => void;
+};
+type AutocompleteProps<T = string, FreeSolo extends boolean = false> = AutocompleteSingleProps<T, FreeSolo> | AutocompleteMultipleProps<T, FreeSolo>;
+export type { AutocompleteBaseProps, AutocompleteInputChangeReason, AutocompleteMultipleProps, AutocompleteOption, AutocompleteOptionRenderState, AutocompleteProps, AutocompleteSingleProps, AutocompleteSize, AutocompleteValue };

package/dist/components/forms/autocomplete/autocomplete.utils.cjs

@@ -0,0 +1,47 @@
+// src/components/forms/autocomplete/autocomplete.utils.ts
+const normalizeAutocompleteText = (value) => value.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLocaleLowerCase();
+const filterAutocompleteOptions = (options, inputValue) => {
+	const query = normalizeAutocompleteText(inputValue.trim());
+	if (!query) return [...options];
+	return options.filter((option) => {
+		const label = normalizeAutocompleteText(option.label);
+		const description = typeof option.description === "string" ? normalizeAutocompleteText(option.description) : "";
+		return label.includes(query) || description.includes(query);
+	});
+};
+const groupAutocompleteOptions = (options) => {
+	const groups = /* @__PURE__ */ new Map();
+	options.forEach((option, index) => {
+		const label = option.group ?? null;
+		let group = groups.get(label);
+		if (!group) {
+			group = {
+				label,
+				options: []
+			};
+			groups.set(label, group);
+		}
+		group.options.push({
+			option,
+			index
+		});
+	});
+	return Array.from(groups.values());
+};
+const findEnabledAutocompleteIndex = (options, startIndex, direction, wrap = true) => {
+	const length = options.length;
+	if (length === 0) return -1;
+	for (let step = 1; step <= length; step++) {
+		let index = startIndex + step * direction;
+		if (wrap) index = (index + length) % length;
+		else if (index < 0 || index >= length) break;
+		if (!options[index]?.disabled) return index;
+	}
+	return -1;
+};
+exports.filterAutocompleteOptions = filterAutocompleteOptions;
+exports.findEnabledAutocompleteIndex = findEnabledAutocompleteIndex;
+exports.groupAutocompleteOptions = groupAutocompleteOptions;
+exports.normalizeAutocompleteText = normalizeAutocompleteText;
+
+//# sourceMappingURL=autocomplete.utils.cjs.map

package/dist/components/forms/autocomplete/autocomplete.utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.utils.cjs","names":[],"sources":["../../../../src/components/forms/autocomplete/autocomplete.utils.ts"],"sourcesContent":["import type { AutocompleteOption } from \"./autocomplete.types\";\n\ntype IndexedAutocompleteOption<T> = {\n  option: AutocompleteOption<T>;\n  index: number;\n};\n\ntype AutocompleteOptionGroup<T> = {\n  label: string | null;\n  options: IndexedAutocompleteOption<T>[];\n};\n\nconst normalizeAutocompleteText = (value: string): string =>\n  value\n    .normalize(\"NFD\")\n    .replace(/[\\u0300-\\u036f]/g, \"\")\n    .toLocaleLowerCase();\n\nconst filterAutocompleteOptions = <T>(\n  options: readonly AutocompleteOption<T>[],\n  inputValue: string,\n): AutocompleteOption<T>[] => {\n  const query = normalizeAutocompleteText(inputValue.trim());\n\n  if (!query) {\n    return [...options];\n  }\n\n  return options.filter((option) => {\n    const label = normalizeAutocompleteText(option.label);\n    const description =\n      typeof option.description === \"string\"\n        ? normalizeAutocompleteText(option.description)\n        : \"\";\n\n    return label.includes(query) || description.includes(query);\n  });\n};\n\nconst groupAutocompleteOptions = <T>(\n  options: readonly AutocompleteOption<T>[],\n): AutocompleteOptionGroup<T>[] => {\n  const groups = new Map<string | null, AutocompleteOptionGroup<T>>();\n\n  options.forEach((option, index) => {\n    const label = option.group ?? null;\n    let group = groups.get(label);\n\n    if (!group) {\n      group = {\n        label,\n        options: [],\n      };\n\n      groups.set(label, group);\n    }\n\n    group.options.push({ option, index });\n  });\n\n  return Array.from(groups.values());\n};\n\nconst findEnabledAutocompleteIndex = <T>(\n  options: readonly AutocompleteOption<T>[],\n  startIndex: number,\n  direction: -1 | 1,\n  wrap = true,\n): number => {\n  const length = options.length;\n\n  if (length === 0) {\n    return -1;\n  }\n\n  for (let step = 1; step <= length; step++) {\n    let index = startIndex + step * direction;\n\n    if (wrap) {\n      index = (index + length) % length;\n    } else if (index < 0 || index >= length) {\n      break;\n    }\n\n    if (!options[index]?.disabled) {\n      return index;\n    }\n  }\n\n  return -1;\n};\n\nexport {\n  filterAutocompleteOptions,\n  findEnabledAutocompleteIndex,\n  groupAutocompleteOptions,\n  normalizeAutocompleteText,\n  type AutocompleteOptionGroup,\n};\n"],"mappings":";AAYA,MAAM,6BAA6B,UACjC,MACG,UAAU,KAAK,CAAC,CAChB,QAAQ,oBAAoB,EAAE,CAAC,CAC/B,kBAAkB;AAEvB,MAAM,6BACJ,SACA,eAC4B;CAC5B,MAAM,QAAQ,0BAA0B,WAAW,KAAK,CAAC;CAEzD,IAAI,CAAC,OACH,OAAO,CAAC,GAAG,OAAO;CAGpB,OAAO,QAAQ,QAAQ,WAAW;EAChC,MAAM,QAAQ,0BAA0B,OAAO,KAAK;EACpD,MAAM,cACJ,OAAO,OAAO,gBAAgB,WAC1B,0BAA0B,OAAO,WAAW,IAC5C;EAEN,OAAO,MAAM,SAAS,KAAK,KAAK,YAAY,SAAS,KAAK;CAC5D,CAAC;AACH;AAEA,MAAM,4BACJ,YACiC;CACjC,MAAM,yBAAS,IAAI,IAA+C;CAElE,QAAQ,SAAS,QAAQ,UAAU;EACjC,MAAM,QAAQ,OAAO,SAAS;EAC9B,IAAI,QAAQ,OAAO,IAAI,KAAK;EAE5B,IAAI,CAAC,OAAO;GACV,QAAQ;IACN;IACA,SAAS,CAAC;GACZ;GAEA,OAAO,IAAI,OAAO,KAAK;EACzB;EAEA,MAAM,QAAQ,KAAK;GAAE;GAAQ;EAAM,CAAC;CACtC,CAAC;CAED,OAAO,MAAM,KAAK,OAAO,OAAO,CAAC;AACnC;AAEA,MAAM,gCACJ,SACA,YACA,WACA,OAAO,SACI;CACX,MAAM,SAAS,QAAQ;CAEvB,IAAI,WAAW,GACb,OAAO;CAGT,KAAK,IAAI,OAAO,GAAG,QAAQ,QAAQ,QAAQ;EACzC,IAAI,QAAQ,aAAa,OAAO;EAEhC,IAAI,MACF,SAAS,QAAQ,UAAU;OACtB,IAAI,QAAQ,KAAK,SAAS,QAC/B;EAGF,IAAI,CAAC,QAAQ,MAAM,EAAE,UACnB,OAAO;CAEX;CAEA,OAAO;AACT"}

package/dist/components/forms/autocomplete/autocomplete.utils.js

@@ -0,0 +1,44 @@
+// src/components/forms/autocomplete/autocomplete.utils.ts
+const normalizeAutocompleteText = (value) => value.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLocaleLowerCase();
+const filterAutocompleteOptions = (options, inputValue) => {
+	const query = normalizeAutocompleteText(inputValue.trim());
+	if (!query) return [...options];
+	return options.filter((option) => {
+		const label = normalizeAutocompleteText(option.label);
+		const description = typeof option.description === "string" ? normalizeAutocompleteText(option.description) : "";
+		return label.includes(query) || description.includes(query);
+	});
+};
+const groupAutocompleteOptions = (options) => {
+	const groups = /* @__PURE__ */ new Map();
+	options.forEach((option, index) => {
+		const label = option.group ?? null;
+		let group = groups.get(label);
+		if (!group) {
+			group = {
+				label,
+				options: []
+			};
+			groups.set(label, group);
+		}
+		group.options.push({
+			option,
+			index
+		});
+	});
+	return Array.from(groups.values());
+};
+const findEnabledAutocompleteIndex = (options, startIndex, direction, wrap = true) => {
+	const length = options.length;
+	if (length === 0) return -1;
+	for (let step = 1; step <= length; step++) {
+		let index = startIndex + step * direction;
+		if (wrap) index = (index + length) % length;
+		else if (index < 0 || index >= length) break;
+		if (!options[index]?.disabled) return index;
+	}
+	return -1;
+};
+export { filterAutocompleteOptions, findEnabledAutocompleteIndex, groupAutocompleteOptions, normalizeAutocompleteText };
+
+//# sourceMappingURL=autocomplete.utils.js.map

package/dist/components/forms/autocomplete/autocomplete.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.utils.js","names":[],"sources":["../../../../src/components/forms/autocomplete/autocomplete.utils.ts"],"sourcesContent":["import type { AutocompleteOption } from \"./autocomplete.types\";\n\ntype IndexedAutocompleteOption<T> = {\n  option: AutocompleteOption<T>;\n  index: number;\n};\n\ntype AutocompleteOptionGroup<T> = {\n  label: string | null;\n  options: IndexedAutocompleteOption<T>[];\n};\n\nconst normalizeAutocompleteText = (value: string): string =>\n  value\n    .normalize(\"NFD\")\n    .replace(/[\\u0300-\\u036f]/g, \"\")\n    .toLocaleLowerCase();\n\nconst filterAutocompleteOptions = <T>(\n  options: readonly AutocompleteOption<T>[],\n  inputValue: string,\n): AutocompleteOption<T>[] => {\n  const query = normalizeAutocompleteText(inputValue.trim());\n\n  if (!query) {\n    return [...options];\n  }\n\n  return options.filter((option) => {\n    const label = normalizeAutocompleteText(option.label);\n    const description =\n      typeof option.description === \"string\"\n        ? normalizeAutocompleteText(option.description)\n        : \"\";\n\n    return label.includes(query) || description.includes(query);\n  });\n};\n\nconst groupAutocompleteOptions = <T>(\n  options: readonly AutocompleteOption<T>[],\n): AutocompleteOptionGroup<T>[] => {\n  const groups = new Map<string | null, AutocompleteOptionGroup<T>>();\n\n  options.forEach((option, index) => {\n    const label = option.group ?? null;\n    let group = groups.get(label);\n\n    if (!group) {\n      group = {\n        label,\n        options: [],\n      };\n\n      groups.set(label, group);\n    }\n\n    group.options.push({ option, index });\n  });\n\n  return Array.from(groups.values());\n};\n\nconst findEnabledAutocompleteIndex = <T>(\n  options: readonly AutocompleteOption<T>[],\n  startIndex: number,\n  direction: -1 | 1,\n  wrap = true,\n): number => {\n  const length = options.length;\n\n  if (length === 0) {\n    return -1;\n  }\n\n  for (let step = 1; step <= length; step++) {\n    let index = startIndex + step * direction;\n\n    if (wrap) {\n      index = (index + length) % length;\n    } else if (index < 0 || index >= length) {\n      break;\n    }\n\n    if (!options[index]?.disabled) {\n      return index;\n    }\n  }\n\n  return -1;\n};\n\nexport {\n  filterAutocompleteOptions,\n  findEnabledAutocompleteIndex,\n  groupAutocompleteOptions,\n  normalizeAutocompleteText,\n  type AutocompleteOptionGroup,\n};\n"],"mappings":";AAYA,MAAM,6BAA6B,UACjC,MACG,UAAU,KAAK,CAAC,CAChB,QAAQ,oBAAoB,EAAE,CAAC,CAC/B,kBAAkB;AAEvB,MAAM,6BACJ,SACA,eAC4B;CAC5B,MAAM,QAAQ,0BAA0B,WAAW,KAAK,CAAC;CAEzD,IAAI,CAAC,OACH,OAAO,CAAC,GAAG,OAAO;CAGpB,OAAO,QAAQ,QAAQ,WAAW;EAChC,MAAM,QAAQ,0BAA0B,OAAO,KAAK;EACpD,MAAM,cACJ,OAAO,OAAO,gBAAgB,WAC1B,0BAA0B,OAAO,WAAW,IAC5C;EAEN,OAAO,MAAM,SAAS,KAAK,KAAK,YAAY,SAAS,KAAK;CAC5D,CAAC;AACH;AAEA,MAAM,4BACJ,YACiC;CACjC,MAAM,yBAAS,IAAI,IAA+C;CAElE,QAAQ,SAAS,QAAQ,UAAU;EACjC,MAAM,QAAQ,OAAO,SAAS;EAC9B,IAAI,QAAQ,OAAO,IAAI,KAAK;EAE5B,IAAI,CAAC,OAAO;GACV,QAAQ;IACN;IACA,SAAS,CAAC;GACZ;GAEA,OAAO,IAAI,OAAO,KAAK;EACzB;EAEA,MAAM,QAAQ,KAAK;GAAE;GAAQ;EAAM,CAAC;CACtC,CAAC;CAED,OAAO,MAAM,KAAK,OAAO,OAAO,CAAC;AACnC;AAEA,MAAM,gCACJ,SACA,YACA,WACA,OAAO,SACI;CACX,MAAM,SAAS,QAAQ;CAEvB,IAAI,WAAW,GACb,OAAO;CAGT,KAAK,IAAI,OAAO,GAAG,QAAQ,QAAQ,QAAQ;EACzC,IAAI,QAAQ,aAAa,OAAO;EAEhC,IAAI,MACF,SAAS,QAAQ,UAAU;OACtB,IAAI,QAAQ,KAAK,SAAS,QAC/B;EAGF,IAAI,CAAC,QAAQ,MAAM,EAAE,UACnB,OAAO;CAEX;CAEA,OAAO;AACT"}