UNPKG

1.15 kBJavaScriptView Raw
1import React from "react";
2import { UI } from "../UI.js";
3/**
4 * Render a dropdown component to use in the navigation bar.
5 *
6 * @group Components
7 * @see https://daypicker.dev/guides/custom-components
8 */
9export function Dropdown(props) {
10 const { options, className, components, classNames, ...selectProps } = props;
11 const cssClassSelect = [classNames[UI.Dropdown], className].join(" ");
12 const selectedOption = options?.find(({ value }) => value === selectProps.value);
13 return (React.createElement("span", { "data-disabled": selectProps.disabled, className: classNames[UI.DropdownRoot] },
14 React.createElement(components.Select, { className: cssClassSelect, ...selectProps }, options?.map(({ value, label, disabled }) => (React.createElement(components.Option, { key: value, value: value, disabled: disabled }, label)))),
15 React.createElement("span", { className: classNames[UI.CaptionLabel], "aria-hidden": true },
16 selectedOption?.label,
17 React.createElement(components.Chevron, { orientation: "down", size: 18, className: classNames[UI.Chevron] }))));
18}
19//# sourceMappingURL=Dropdown.js.map
\No newline at end of file