@hitachivantara/uikit-react-core/dist/Pagination/Select.js

UI Kit Core React components.

import { HvListItem } from "../ListContainer/ListItem/ListItem.js";
import { HvPanel } from "../Panel/Panel.js";
import { HvBaseDropdown } from "../BaseDropdown/BaseDropdown.js";
import { HvSelectionList } from "../SelectionList/SelectionList.js";
import { useClasses } from "./Select.styles.js";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { useState } from "react";
import { jsx } from "react/jsx-runtime";
//#region src/Pagination/Select.tsx
var Option = ({ ...props }) => /* @__PURE__ */ jsx(HvListItem, { ...props });
var HvSelect = (props) => {
	const { className, classes: classesProp, onChange, disabled, value, children, ...others } = useDefaultProps("HvPaginationSelect", props);
	const { classes } = useClasses(classesProp);
	const [open, setOpen] = useState(false);
	const handleSelect = (evt, val) => {
		onChange?.(evt, val);
		setOpen(false);
	};
	const handleToggle = (_evt, s) => {
		setOpen(s);
	};
	const setFocusToContent = (containerRef) => {
		(containerRef != null ? [...containerRef.getElementsByTagName("li")] : []).every((listItem) => {
			if (listItem.tabIndex >= 0) {
				listItem.focus();
				return false;
			}
			return true;
		});
	};
	return /* @__PURE__ */ jsx(HvBaseDropdown, {
		className,
		classes: {
			selection: classes.selection,
			header: classes.header,
			headerOpen: classes.headerOpen,
			root: classes.root
		},
		expanded: open,
		onToggle: handleToggle,
		onContainerCreation: setFocusToContent,
		placeholder: value,
		disabled,
		variableWidth: true,
		...others,
		children: /* @__PURE__ */ jsx(HvPanel, { children: /* @__PURE__ */ jsx(HvSelectionList, {
			value,
			onChange: handleSelect,
			children
		}) })
	});
};
//#endregion
export { Option, HvSelect as default };