gotosocial/web/source/settings/components/combo-box.jsx
f0x52 aa5c4e065c
[frogend] Emoji categories (#1051)
* emoji category combobox

* emoji categorizing

* dropdown entry separation

* emoji filtering/sorting

* add some explaining comments

* remove unneeded default-value code

* remove wrongly created package.json

* configurable ComboBox label+placeHolder
2022-11-16 17:05:49 +01:00

49 lines
No EOL
1.3 KiB
JavaScript

/*
GoToSocial
Copyright (C) 2021-2022 GoToSocial Authors admin@gotosocial.org
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
"use strict";
const React = require("react");
const {
Combobox,
ComboboxItem,
ComboboxPopover,
} = require("ariakit/combobox");
module.exports = function ComboBox({state, items, label, placeHolder}) {
return (
<div className="form-field combobox-wrapper">
<label>
{label}
<Combobox
state={state}
placeholder={placeHolder}
className="combobox input"
/>
</label>
<ComboboxPopover state={state} className="popover">
{items.map(([key, value]) => (
<ComboboxItem className="combobox-item" key={key} value={key}>
{value}
</ComboboxItem>
))}
</ComboboxPopover>
</div>
);
};