summaryrefslogtreecommitdiff
path: root/web/source/settings/components/combo-box.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'web/source/settings/components/combo-box.jsx')
-rw-r--r--web/source/settings/components/combo-box.jsx49
1 files changed, 49 insertions, 0 deletions
diff --git a/web/source/settings/components/combo-box.jsx b/web/source/settings/components/combo-box.jsx
new file mode 100644
index 000000000..1e6293890
--- /dev/null
+++ b/web/source/settings/components/combo-box.jsx
@@ -0,0 +1,49 @@
+/*
+ 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>
+ );
+}; \ No newline at end of file