@veracity/vui/dist/input/autoCompletePopover.js

Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.

import { cs } from "../utils/styles.js";
import styled from "../core/styled.js";
import { List } from "../list/list.js";
import Popover from "../popover/popover.js";
import { memo } from "react";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/input/autoCompletePopover.tsx
const InputContainer = styled.divBox`
  width: 100%;
`;
/** Wrapper for the autocomplete popover. */
const AutoCompletePopover = ({ autoCompleteOptions, autoCompleteMaxHeight, children, filterAutoCompleteOptions, onAutoCompleteSelect }) => {
	if (autoCompleteOptions === void 0) return children;
	return /* @__PURE__ */ jsxs(Popover, {
		placement: "bottom-start",
		matchWidth: true,
		children: [/* @__PURE__ */ jsx(Popover.Trigger, {
			as: InputContainer,
			className: cs("vui-input-popoverTrigger"),
			children
		}), !!autoCompleteOptions && /* @__PURE__ */ jsx(Popover.Content, { children: /* @__PURE__ */ jsx(List, {
			maxH: autoCompleteMaxHeight,
			w: "100%",
			className: cs("vui-input-popoverList"),
			children: autoCompleteOptions?.filter?.(filterAutoCompleteOptions).map((i) => /* @__PURE__ */ jsx(List.Item, {
				cursor: "pointer",
				hoverBg: "skyBlue.hover",
				onClick: () => onAutoCompleteSelect(i),
				children: i
			}, i))
		}) })]
	});
};
var autoCompletePopover_default = memo(AutoCompletePopover);

//#endregion
export { AutoCompletePopover, autoCompletePopover_default as default };
globalThis.__vuiVersion__ = "5.3.1"
//# sourceMappingURL=autoCompletePopover.js.map