gtsocial-umbx

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README | LICENSE

combo-box.jsx (1477B)


      1 /*
      2 	GoToSocial
      3 	Copyright (C) GoToSocial Authors admin@gotosocial.org
      4 	SPDX-License-Identifier: AGPL-3.0-or-later
      5 
      6 	This program is free software: you can redistribute it and/or modify
      7 	it under the terms of the GNU Affero General Public License as published by
      8 	the Free Software Foundation, either version 3 of the License, or
      9 	(at your option) any later version.
     10 
     11 	This program is distributed in the hope that it will be useful,
     12 	but WITHOUT ANY WARRANTY; without even the implied warranty of
     13 	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
     14 	GNU Affero General Public License for more details.
     15 
     16 	You should have received a copy of the GNU Affero General Public License
     17 	along with this program.  If not, see <http://www.gnu.org/licenses/>.
     18 */
     19 
     20 "use strict";
     21 
     22 const React = require("react");
     23 
     24 const {
     25 	Combobox,
     26 	ComboboxItem,
     27 	ComboboxPopover,
     28 } = require("ariakit/combobox");
     29 
     30 module.exports = function ComboBox({ field, items, label, children, ...inputProps }) {
     31 	return (
     32 		<div className="form-field combobox-wrapper">
     33 			<label>
     34 				{label}
     35 				<div className="row">
     36 					<Combobox
     37 						state={field.state}
     38 						className="combobox input"
     39 						{...inputProps}
     40 					/>
     41 					{children}
     42 				</div>
     43 			</label>
     44 			<ComboboxPopover state={field.state} className="popover">
     45 				{items.map(([key, value]) => (
     46 					<ComboboxItem className="combobox-item" key={key} value={key}>
     47 						{value}
     48 					</ComboboxItem>
     49 				))}
     50 			</ComboboxPopover>
     51 		</div>
     52 	);
     53 };