welcome-ui
Version:
Customizable design system with react, typescript, tailwindcss and ariakit.
1,052 lines (1,051 loc) • 23.5 kB
JavaScript
"use client";
import './Select.css';
import { jsx as p, jsxs as H } from "react/jsx-runtime";
import { D as _e } from "./downshift.esm-BtYj0L0Y.js";
import { g as Xe, c as we } from "./index-B6iGEm-i.js";
import { useRef as Ze, useMemo as Ce, forwardRef as Qe, useState as P, useEffect as pe, useCallback as qe, Fragment as Be } from "react";
import { CloseButton as Ge } from "./CloseButton.js";
import { useField as Je } from "./Field.js";
import { Icon as ge } from "./Icon.js";
import { c as en } from "./create-event-rXDe5aCQ.js";
import { Tag as nn } from "./Tag.js";
var D = { exports: {} }, Ae;
function tn() {
if (Ae) return D.exports;
Ae = 1;
var e = {
À: "A",
Á: "A",
Â: "A",
Ã: "A",
Ä: "A",
Å: "A",
Ấ: "A",
Ắ: "A",
Ẳ: "A",
Ẵ: "A",
Ặ: "A",
Æ: "AE",
Ầ: "A",
Ằ: "A",
Ȃ: "A",
Ả: "A",
Ạ: "A",
Ẩ: "A",
Ẫ: "A",
Ậ: "A",
Ç: "C",
Ḉ: "C",
È: "E",
É: "E",
Ê: "E",
Ë: "E",
Ế: "E",
Ḗ: "E",
Ề: "E",
Ḕ: "E",
Ḝ: "E",
Ȇ: "E",
Ẻ: "E",
Ẽ: "E",
Ẹ: "E",
Ể: "E",
Ễ: "E",
Ệ: "E",
Ì: "I",
Í: "I",
Î: "I",
Ï: "I",
Ḯ: "I",
Ȋ: "I",
Ỉ: "I",
Ị: "I",
Ð: "D",
Ñ: "N",
Ò: "O",
Ó: "O",
Ô: "O",
Õ: "O",
Ö: "O",
Ø: "O",
Ố: "O",
Ṍ: "O",
Ṓ: "O",
Ȏ: "O",
Ỏ: "O",
Ọ: "O",
Ổ: "O",
Ỗ: "O",
Ộ: "O",
Ờ: "O",
Ở: "O",
Ỡ: "O",
Ớ: "O",
Ợ: "O",
Ù: "U",
Ú: "U",
Û: "U",
Ü: "U",
Ủ: "U",
Ụ: "U",
Ử: "U",
Ữ: "U",
Ự: "U",
Ý: "Y",
à: "a",
á: "a",
â: "a",
ã: "a",
ä: "a",
å: "a",
ấ: "a",
ắ: "a",
ẳ: "a",
ẵ: "a",
ặ: "a",
æ: "ae",
ầ: "a",
ằ: "a",
ȃ: "a",
ả: "a",
ạ: "a",
ẩ: "a",
ẫ: "a",
ậ: "a",
ç: "c",
ḉ: "c",
è: "e",
é: "e",
ê: "e",
ë: "e",
ế: "e",
ḗ: "e",
ề: "e",
ḕ: "e",
ḝ: "e",
ȇ: "e",
ẻ: "e",
ẽ: "e",
ẹ: "e",
ể: "e",
ễ: "e",
ệ: "e",
ì: "i",
í: "i",
î: "i",
ï: "i",
ḯ: "i",
ȋ: "i",
ỉ: "i",
ị: "i",
ð: "d",
ñ: "n",
ò: "o",
ó: "o",
ô: "o",
õ: "o",
ö: "o",
ø: "o",
ố: "o",
ṍ: "o",
ṓ: "o",
ȏ: "o",
ỏ: "o",
ọ: "o",
ổ: "o",
ỗ: "o",
ộ: "o",
ờ: "o",
ở: "o",
ỡ: "o",
ớ: "o",
ợ: "o",
ù: "u",
ú: "u",
û: "u",
ü: "u",
ủ: "u",
ụ: "u",
ử: "u",
ữ: "u",
ự: "u",
ý: "y",
ÿ: "y",
Ā: "A",
ā: "a",
Ă: "A",
ă: "a",
Ą: "A",
ą: "a",
Ć: "C",
ć: "c",
Ĉ: "C",
ĉ: "c",
Ċ: "C",
ċ: "c",
Č: "C",
č: "c",
C̆: "C",
c̆: "c",
Ď: "D",
ď: "d",
Đ: "D",
đ: "d",
Ē: "E",
ē: "e",
Ĕ: "E",
ĕ: "e",
Ė: "E",
ė: "e",
Ę: "E",
ę: "e",
Ě: "E",
ě: "e",
Ĝ: "G",
Ǵ: "G",
ĝ: "g",
ǵ: "g",
Ğ: "G",
ğ: "g",
Ġ: "G",
ġ: "g",
Ģ: "G",
ģ: "g",
Ĥ: "H",
ĥ: "h",
Ħ: "H",
ħ: "h",
Ḫ: "H",
ḫ: "h",
Ĩ: "I",
ĩ: "i",
Ī: "I",
ī: "i",
Ĭ: "I",
ĭ: "i",
Į: "I",
į: "i",
İ: "I",
ı: "i",
IJ: "IJ",
ij: "ij",
Ĵ: "J",
ĵ: "j",
Ķ: "K",
ķ: "k",
Ḱ: "K",
ḱ: "k",
K̆: "K",
k̆: "k",
Ĺ: "L",
ĺ: "l",
Ļ: "L",
ļ: "l",
Ľ: "L",
ľ: "l",
Ŀ: "L",
ŀ: "l",
Ł: "l",
ł: "l",
Ḿ: "M",
ḿ: "m",
M̆: "M",
m̆: "m",
Ń: "N",
ń: "n",
Ņ: "N",
ņ: "n",
Ň: "N",
ň: "n",
ʼn: "n",
N̆: "N",
n̆: "n",
Ō: "O",
ō: "o",
Ŏ: "O",
ŏ: "o",
Ő: "O",
ő: "o",
Œ: "OE",
œ: "oe",
P̆: "P",
p̆: "p",
Ŕ: "R",
ŕ: "r",
Ŗ: "R",
ŗ: "r",
Ř: "R",
ř: "r",
R̆: "R",
r̆: "r",
Ȓ: "R",
ȓ: "r",
Ś: "S",
ś: "s",
Ŝ: "S",
ŝ: "s",
Ş: "S",
Ș: "S",
ș: "s",
ş: "s",
Š: "S",
š: "s",
Ţ: "T",
ţ: "t",
ț: "t",
Ț: "T",
Ť: "T",
ť: "t",
Ŧ: "T",
ŧ: "t",
T̆: "T",
t̆: "t",
Ũ: "U",
ũ: "u",
Ū: "U",
ū: "u",
Ŭ: "U",
ŭ: "u",
Ů: "U",
ů: "u",
Ű: "U",
ű: "u",
Ų: "U",
ų: "u",
Ȗ: "U",
ȗ: "u",
V̆: "V",
v̆: "v",
Ŵ: "W",
ŵ: "w",
Ẃ: "W",
ẃ: "w",
X̆: "X",
x̆: "x",
Ŷ: "Y",
ŷ: "y",
Ÿ: "Y",
Y̆: "Y",
y̆: "y",
Ź: "Z",
ź: "z",
Ż: "Z",
ż: "z",
Ž: "Z",
ž: "z",
ſ: "s",
ƒ: "f",
Ơ: "O",
ơ: "o",
Ư: "U",
ư: "u",
Ǎ: "A",
ǎ: "a",
Ǐ: "I",
ǐ: "i",
Ǒ: "O",
ǒ: "o",
Ǔ: "U",
ǔ: "u",
Ǖ: "U",
ǖ: "u",
Ǘ: "U",
ǘ: "u",
Ǚ: "U",
ǚ: "u",
Ǜ: "U",
ǜ: "u",
Ứ: "U",
ứ: "u",
Ṹ: "U",
ṹ: "u",
Ǻ: "A",
ǻ: "a",
Ǽ: "AE",
ǽ: "ae",
Ǿ: "O",
ǿ: "o",
Þ: "TH",
þ: "th",
Ṕ: "P",
ṕ: "p",
Ṥ: "S",
ṥ: "s",
X́: "X",
x́: "x",
Ѓ: "Г",
ѓ: "г",
Ќ: "К",
ќ: "к",
A̋: "A",
a̋: "a",
E̋: "E",
e̋: "e",
I̋: "I",
i̋: "i",
Ǹ: "N",
ǹ: "n",
Ồ: "O",
ồ: "o",
Ṑ: "O",
ṑ: "o",
Ừ: "U",
ừ: "u",
Ẁ: "W",
ẁ: "w",
Ỳ: "Y",
ỳ: "y",
Ȁ: "A",
ȁ: "a",
Ȅ: "E",
ȅ: "e",
Ȉ: "I",
ȉ: "i",
Ȍ: "O",
ȍ: "o",
Ȑ: "R",
ȑ: "r",
Ȕ: "U",
ȕ: "u",
B̌: "B",
b̌: "b",
Č̣: "C",
č̣: "c",
Ê̌: "E",
ê̌: "e",
F̌: "F",
f̌: "f",
Ǧ: "G",
ǧ: "g",
Ȟ: "H",
ȟ: "h",
J̌: "J",
ǰ: "j",
Ǩ: "K",
ǩ: "k",
M̌: "M",
m̌: "m",
P̌: "P",
p̌: "p",
Q̌: "Q",
q̌: "q",
Ř̩: "R",
ř̩: "r",
Ṧ: "S",
ṧ: "s",
V̌: "V",
v̌: "v",
W̌: "W",
w̌: "w",
X̌: "X",
x̌: "x",
Y̌: "Y",
y̌: "y",
A̧: "A",
a̧: "a",
B̧: "B",
b̧: "b",
Ḑ: "D",
ḑ: "d",
Ȩ: "E",
ȩ: "e",
Ɛ̧: "E",
ɛ̧: "e",
Ḩ: "H",
ḩ: "h",
I̧: "I",
i̧: "i",
Ɨ̧: "I",
ɨ̧: "i",
M̧: "M",
m̧: "m",
O̧: "O",
o̧: "o",
Q̧: "Q",
q̧: "q",
U̧: "U",
u̧: "u",
X̧: "X",
x̧: "x",
Z̧: "Z",
z̧: "z",
й: "и",
Й: "И",
ё: "е",
Ё: "Е"
}, n = Object.keys(e).join("|"), t = new RegExp(n, "g"), r = new RegExp(n, "");
function i(s) {
return e[s];
}
var l = function(s) {
return s.replace(t, i);
}, c = function(s) {
return !!s.match(r);
};
return D.exports = l, D.exports.has = c, D.exports.remove = l, D.exports;
}
var rn = tn();
const ln = /* @__PURE__ */ Xe(rn);
/**
* @name match-sorter
* @license MIT license.
* @copyright (c) 2020 Kent C. Dodds
* @author Kent C. Dodds <me@kentcdodds.com> (https://kentcdodds.com)
*/
const I = {
CASE_SENSITIVE_EQUAL: 7,
EQUAL: 6,
STARTS_WITH: 5,
WORD_STARTS_WITH: 4,
CONTAINS: 3,
ACRONYM: 2,
MATCHES: 1,
NO_MATCH: 0
}, sn = (e, n) => String(e.rankedValue).localeCompare(String(n.rankedValue));
function J(e, n, t = {}) {
const {
keys: r,
threshold: i = I.MATCHES,
baseSort: l = sn,
sorter: c = (u) => u.sort((f, h) => fn(f, h, l))
} = t, s = e.reduce(a, []);
return c(s).map(({
item: u
}) => u);
function a(u, f, h) {
const g = an(f, r, n, t), {
rank: C,
keyThreshold: R = i
} = g;
return C >= R && u.push({
...g,
item: f,
index: h
}), u;
}
}
J.rankings = I;
function an(e, n, t, r) {
if (!n) {
const l = e;
return {
// ends up being duplicate of 'item' in matches but consistent
rankedValue: l,
rank: Ie(l, t, r),
keyIndex: -1,
keyThreshold: r.threshold
};
}
return hn(e, n).reduce(({
rank: l,
rankedValue: c,
keyIndex: s,
keyThreshold: a
}, {
itemValue: u,
attributes: f
}, h) => {
let g = Ie(u, t, r), C = c;
const {
minRanking: R,
maxRanking: A,
threshold: O
} = f;
return g < R && g >= I.MATCHES ? g = R : g > A && (g = A), g > l && (l = g, s = h, a = O, C = u), {
rankedValue: C,
rank: l,
keyIndex: s,
keyThreshold: a
};
}, {
rankedValue: e,
rank: I.NO_MATCH,
keyIndex: -1,
keyThreshold: r.threshold
});
}
function* on(e, n) {
let t = -1;
for (; (t = e.indexOf(n, t + 1)) > -1; )
yield t;
return -1;
}
function Ie(e, n, t) {
if (e = ye(e, t), n = ye(n, t), n.length > e.length)
return I.NO_MATCH;
if (e === n)
return I.CASE_SENSITIVE_EQUAL;
e = e.toLowerCase(), n = n.toLowerCase();
const r = on(e, n), i = r.next(), l = i.value;
if (e.length === n.length && l === 0)
return I.EQUAL;
if (l === 0)
return I.STARTS_WITH;
let c = i;
for (; !c.done; ) {
if (c.value > 0 && e[c.value - 1] === " ")
return I.WORD_STARTS_WITH;
c = r.next();
}
return l > 0 ? I.CONTAINS : n.length === 1 ? I.NO_MATCH : cn(e).includes(n) ? I.ACRONYM : un(e, n);
}
function cn(e) {
let n = "", t = " ";
for (let r = 0; r < e.length; r++) {
const i = e.charAt(r);
(t === " " || t === "-") && !(i === " " || i === "-") && (n += i), t = i;
}
return n;
}
function un(e, n) {
let t = 0, r = 0;
function i(a, u, f) {
for (let h = f, g = u.length; h < g; h++)
if (u[h] === a)
return t += 1, h + 1;
return -1;
}
function l(a) {
const u = 1 / a, f = t / n.length;
return I.MATCHES + f * u;
}
const c = i(n[0], e, 0);
if (c < 0)
return I.NO_MATCH;
r = c;
for (let a = 1, u = n.length; a < u; a++) {
const f = n[a];
if (r = i(f, e, r), !(r > -1))
return I.NO_MATCH;
}
const s = r - c;
return l(s);
}
function fn(e, n, t) {
const {
rank: l,
keyIndex: c
} = e, {
rank: s,
keyIndex: a
} = n;
return l === s ? c === a ? t(e, n) : c < a ? -1 : 1 : l > s ? -1 : 1;
}
function ye(e, {
keepDiacritics: n
}) {
return e = `${e}`, n || (e = ln(e)), e;
}
function dn(e, n) {
typeof n == "object" && (n = n.key);
let t;
if (typeof n == "function")
t = n(e);
else if (e == null)
t = null;
else if (Object.hasOwnProperty.call(e, n))
t = e[n];
else {
if (n.includes("."))
return mn(n, e);
t = null;
}
return t == null ? [] : Array.isArray(t) ? t : [String(t)];
}
function mn(e, n) {
const t = e.split(".");
let r = [n];
for (let i = 0, l = t.length; i < l; i++) {
const c = t[i];
let s = [];
for (let a = 0, u = r.length; a < u; a++) {
const f = r[a];
if (f != null)
if (Object.hasOwnProperty.call(f, c)) {
const h = f[c];
h != null && s.push(h);
} else c === "*" && (s = s.concat(f));
}
r = s;
}
return Array.isArray(r[0]) ? [].concat(...r) : r;
}
function hn(e, n) {
const t = [];
for (let r = 0, i = n.length; r < i; r++) {
const l = n[r], c = _n(l), s = dn(e, l);
for (let a = 0, u = s.length; a < u; a++)
t.push({
itemValue: s[a],
attributes: c
});
}
return t;
}
const ve = {
maxRanking: 1 / 0,
minRanking: -1 / 0
};
function _n(e) {
return typeof e == "string" ? ve : {
...ve,
...e
};
}
function pn(...e) {
return (n) => {
e.forEach((t) => gn(t, n));
};
}
function gn(e, n) {
e && (typeof e == "function" && n !== void 0 ? e(n) : e.current = n ?? null);
}
function An(e, n) {
const t = Ze(null), r = Ce(() => pn(e, t, n), [e, t, n]);
return [t, r];
}
const In = "_indicators_lfyi9_2", yn = "_open_lfyi9_34", vn = "_disabled_lfyi9_40", On = "_root_lfyi9_51", En = "_clearable_lfyi9_86", xn = "_transparent_lfyi9_104", wn = "_wrapper_lfyi9_204", Cn = "_menu_lfyi9_211", Rn = "_item_lfyi9_239", Sn = "_highlighted_lfyi9_256", Tn = "_selected_lfyi9_259", bn = "_multiple_lfyi9_259", Nn = "_allowUnselectFromList_lfyi9_263", Un = "_tags_lfyi9_271", Re = {
indicators: In,
"size-xs": "_size-xs_lfyi9_11",
"dropdown-indicator": "_dropdown-indicator_lfyi9_14",
"styled-icon": "_styled-icon_lfyi9_28",
open: yn,
disabled: vn,
"input-wrapper": "_input-wrapper_lfyi9_44",
"icon-placement-right": "_icon-placement-right_lfyi9_47",
root: On,
"icon-placement-left": "_icon-placement-left_lfyi9_83",
"icon-placement-both": "_icon-placement-both_lfyi9_83",
clearable: En,
transparent: xn,
"variant-danger": "_variant-danger_lfyi9_140",
"variant-success": "_variant-success_lfyi9_143",
"variant-warning": "_variant-warning_lfyi9_146",
"size-lg": "_size-lg_lfyi9_149",
"size-md": "_size-md_lfyi9_157",
"size-sm": "_size-sm_lfyi9_165",
"icon-wrapper": "_icon-wrapper_lfyi9_173",
wrapper: wn,
menu: Cn,
item: Rn,
"no-results": "_no-results_lfyi9_253",
highlighted: Sn,
selected: Tn,
multiple: bn,
allowUnselectFromList: Nn,
tags: Un,
"styled-tag": "_styled-tag_lfyi9_274"
}, Oe = we(Re);
function kn(e, n) {
return /* @__PURE__ */ p("div", { className: Oe("tags"), role: "list", children: e.map((t) => (
// TODO migrate after WUI-187/tag
/* @__PURE__ */ p(
nn,
{
className: Oe("styled-tag"),
onRemove: () => n(t.value.toString()),
role: "listitem",
children: t.label
},
t.value
)
)) });
}
const ne = "", Vn = /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g, Se = (e) => {
if (typeof e == "number")
return String(e);
if (typeof e == "string") {
const n = e.match(Vn);
return n && n.map((t) => t.toLowerCase()).join("-");
}
}, Ee = (e) => e ? e.label : ne, Hn = (e) => e.reduce(
(n, t) => t.label && n.length > t.label.length ? n : t.label,
ne
), Dn = (e, n, t) => {
const r = n.find((i) => e.value === i.value);
return r && t ? n.filter((i) => e.value !== i.value) : r ? n : [...n, e];
}, G = (e, n) => !!n.find((t) => t.value === e), ee = (e, n = []) => n.find(
(r) => r.label === (e.label || e) || r.value === (e.value || e)
) || { label: e, value: Se(e) }, zn = (e, n, t = !1) => {
const r = t ? n.flatMap((i) => i.options) : n;
return !e && e !== 0 ? [] : Array.isArray(e) ? e.map((i) => ee(i, r)) : [ee(e, r)];
}, Fn = (e, n) => !!n.find((t) => t.value === e.value), jn = (e, n) => Fn(e, n) ? e.value : e.label, xe = (e, n) => e ? e.map((t) => jn(t, n)) : [], Mn = (e, n) => e ? e.filter(
(t) => !n.find((r) => r.value === t.value)
) : [], Wn = ({
inputValue: e,
isMultiple: n,
isSearchable: t,
options: r,
renderItem: i
}) => {
const l = ee(e, r);
return n ? e : l.label ? t ? l.label : i(l) : ne;
}, v = we(Re), Kn = _e.default || _e, Ln = Qe(
({
allowUnselectFromList: e,
autoComplete: n = "off",
autoFocus: t,
className: r,
dataTestId: i,
defaultHighlightedIndex: l,
disableCloseOnSelect: c,
disabled: s,
groupsEnabled: a,
highlightedIndex: u,
icon: f,
iconPlacement: h = "left",
id: g,
isClearable: C,
isCreatable: R,
isMultiple: A,
isSearchable: O,
name: te,
onBlur: Te,
onChange: Y,
onClick: $,
onCreate: X,
onFocus: be,
options: y = [],
placeholder: re = "Choose from…",
renderCreateItem: Ne = (j) => `Create "${j}"`,
renderGroupHeader: ie,
renderItem: z = Ee,
renderMultiple: Ue = kn,
renderNoResults: k,
size: F = "lg",
transparent: le,
value: se,
variant: ae,
...oe
}, ke) => {
const { getInputProps: j, variant: Ve } = Je(), ce = Ve || ae, M = Ce(
() => zn(se, y, a),
[se, y, a]
), Z = !A && M[0] || null, Q = Z ? Z.label : "", [S, q] = P(M), [x, V] = P(Q), [N, W] = P(y), [T, U] = P(!1);
O = R || O;
const [B, He] = An(ke);
pe(() => {
t && B.current && (B.current.focus(), O && U(!0));
}, [O, t, B]), pe(() => {
q(M), V(Q), W(y);
}, [Q, y, M]);
const De = (o) => {
if (O && o !== x) {
let d = [];
a ? d = J(y, o, {
// should match on group.label OR group.options.label
keys: [(_) => _.label, (_) => _.options.map((E) => E.label)]
}) : d = J(y, o, { keys: ["label"] }), V(o), W(d);
}
}, ze = () => {
O && !T && U(!0);
}, ue = (o) => {
let d = [];
a ? d = xe(
o,
y.flatMap((m) => m.options)
) : d = xe(o, y);
const _ = A ? d : d[0], E = en({ name: te, value: A ? o : o[0] });
if (Y == null || Y(_, E), R) {
const m = Mn(o, y);
m.length && (X == null || X(m[0].label, E));
}
}, Fe = (o) => {
let d, _;
!o || o != null && o.disabled ? (d = A ? S : [], _ = !0) : (d = A ? Dn(o, S, e) : [o], _ = A), _ && V(""), W(y), q(d), ue(d), c || U(!1);
}, je = (o) => {
const d = S.filter((_) => _.value !== o);
q(d), ue(d);
}, Me = (o) => {
$ == null || $(o), U(!T);
}, We = (o) => {
A && o.selectedItem ? V("") : O && o.selectedItem && V(o.selectedItem.label), W(y), U(!1);
}, Ke = Hn(y), fe = Wn({
inputValue: x,
isMultiple: A,
isSearchable: O,
options: y,
renderItem: z
}), Le = qe(
({
getItemProps: o,
highlightedIndex: d,
options: _
}) => _.reduce(
(E, m, K) => {
if (a && "options" in m)
E.itemsToRender.push(
/* @__PURE__ */ H(Be, { children: [
ie(m),
m.options ? m.options.map((w) => {
const b = E.itemIndex++, L = G(w.value, S);
return /* @__PURE__ */ p(
"li",
{
className: v(
"item",
d === b && "highlighted",
A && "multiple",
e && "allowUnselectFromList",
w.disabled && "disabled",
L && "selected"
),
...o({
index: b,
item: w
}),
children: z(w, L)
},
w.value
);
}) : null
] }, m.label)
);
else if ("value" in m) {
const w = G(m.value, S), b = d === K;
E.itemsToRender.push(
/* @__PURE__ */ p(
"li",
{
className: v(
"item",
b && "highlighted",
A && "multiple",
e && "allowUnselectFromList",
m.disabled && "disabled",
w && "selected"
),
...o({
index: K,
item: m
}),
children: z(m, w)
},
m.value
)
);
}
return E;
},
{ itemIndex: 0, itemsToRender: [] }
).itemsToRender,
[A, e, S, a, ie, z]
), de = v(
"root",
`size-${F}`,
ce && `variant-${ce}`,
C && "clearable",
le && "transparent",
f && `icon-placement-${h}`,
r,
s && "disabled"
);
return /* @__PURE__ */ p(
Kn,
{
defaultHighlightedIndex: l,
highlightedIndex: u,
id: g,
inputValue: O ? fe : "",
isOpen: T,
itemToString: Ee,
onInputValueChange: De,
onOuterClick: We,
onSelect: Fe,
selectedItem: Z,
children: ({
clearSelection: o,
getInputProps: d,
getItemProps: _,
getMenuProps: E,
getRootProps: m,
getToggleButtonProps: K,
highlightedIndex: w
}) => {
const b = !!(R && x && !G(x, S)), L = T && (N.length || b), me = C && x, Pe = /* @__PURE__ */ p("div", { className: v("dropdown-indicator", T && "open"), children: /* @__PURE__ */ p(
Ge,
{
animatePresence: !0,
onClick: o,
title: "Clear"
}
) }), Ye = /* @__PURE__ */ p(
"div",
{
className: v("dropdown-indicator", T && "open", s && "disabled"),
"data-testid": i ? `${i}-arrow-icon` : null,
disabled: s,
tabIndex: -1,
...K({
onClick: () => !s && U(!T)
}),
children: /* @__PURE__ */ p(ge, { className: v("styled-icon"), name: "angle-down", size: "lg" })
}
), $e = m(oe, { suppressRefError: !0 }), he = d({
autoComplete: n,
autoFocus: t,
"data-spacer": Ke || re,
"data-testid": i,
disabled: s,
id: g,
name: te,
onBlur: Te,
onClick: s ? void 0 : Me,
onFocus: be,
onKeyDown: ze,
placeholder: re,
ref: He,
size: F,
tabIndex: 0,
transparent: le,
variant: T ? "focused" : ae,
...oe
});
return /* @__PURE__ */ H("div", { ...$e, className: v("wrapper", s && "disabled", "field-input"), children: [
/* @__PURE__ */ H("div", { className: v("input-wrapper"), children: [
O ? /* @__PURE__ */ p(
"input",
{
className: de,
type: "text",
...j(he)
}
) : /* @__PURE__ */ p("div", { className: de, ...j(he), children: fe }),
f ? /* @__PURE__ */ p("div", { className: v("icon-wrapper", "icon-placement-left", `size-${F}`), children: /* @__PURE__ */ p(ge, { ...f.props, size: "md" }) }) : null,
/* @__PURE__ */ H("div", { className: v("indicators", `size-${F}`), children: [
me ? Pe : null,
Ye
] })
] }),
L ? /* @__PURE__ */ H("ul", { className: v("menu"), ...E(), children: [
Le({ getItemProps: _, highlightedIndex: w, options: N }),
N.length ? null : k == null ? void 0 : k(x),
b && x.length ? /* @__PURE__ */ p(
"li",
{
className: v("item", w === N.length && "highlighted"),
..._({
index: N.length,
item: {
label: x,
value: Se(x)
}
}),
children: Ne(x)
},
"add"
) : null
] }) : null,
!N.length && k ? /* @__PURE__ */ p("ul", { className: v("menu"), ...E(), children: /* @__PURE__ */ p("li", { className: v("item", "no-results"), children: k(x) }) }) : null,
A ? Ue(S, je) : null
] });
}
}
);
}
);
Ln.displayName = "Select";
export {
Ln as Select,
Re as selectClasses
};