react-base-guide/lib/components/dropdown/index.js

react ui components

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const dropdown_menu_1 = __importDefault(require("../dropdown-menu"));
const label_1 = __importDefault(require("../label"));
const dropdown_menu_keys_handler_1 = __importDefault(require("../../utils/dropdown-menu-keys-handler"));
const DropdownRoot_1 = __importDefault(require("./DropdownRoot"));
const DropdownButton_1 = __importDefault(require("./DropdownButton"));
const Dropdown = (props) => {
    const [open, setOpen] = (0, react_1.useState)(false);
    const selected = props.rows ? props.rows.filter(r => r.selected) : [];
    const text = selected[0] ? selected[0].value : "";
    return ((0, jsx_runtime_1.jsxs)(DropdownRoot_1.default, Object.assign({ onBlur: () => setOpen(false), onKeyDown: (e) => (0, dropdown_menu_keys_handler_1.default)({ e, setOpen, rows: props.rows }), className: props.className, "$styled": props.styled }, { children: [(0, jsx_runtime_1.jsx)(label_1.default, Object.assign({ focus: open, label: props.label, styled: { display: "block", width: "100%" } }, { children: (0, jsx_runtime_1.jsx)(DropdownButton_1.default, Object.assign({ onClick: () => setOpen(!open), open: open, disabled: props.disabled }, { children: text })) })), !props.disabled && (0, jsx_runtime_1.jsx)(dropdown_menu_1.default, { rows: props.rows, open: open, menuWidth: props.menuWidth || "100%", menuHeight: props.menuHeight, right: props.right, up: props.up })] })));
};
exports.default = Dropdown;
//# sourceMappingURL=index.js.map