@konstructio/ui
Version:
A set of reusable and customizable React components built for konstruct.io
602 lines (601 loc) • 25.6 kB
JavaScript
import { t as M } from "./utils-COaoD3PI.js";
import { Typography as I } from "./components/Typography/Typography.js";
import { usePhoneNumberContext as N } from "./components/PhoneNumberInput/contexts/phone-number.hook.js";
import { TruncateText as k } from "./components/PhoneNumberInput/components/TruncateText/TruncateText.js";
import * as w from "react";
import { useEffect as D, useMemo as L, useRef as W } from "react";
import { flushSync as V } from "react-dom";
import { jsx as m, jsxs as j } from "react/jsx-runtime";
function x(r, t, e) {
let s = e.initialDeps ?? [], n, l = !0;
function i() {
var o, h, u;
let c;
e.key && ((o = e.debug) != null && o.call(e)) && (c = Date.now());
const d = r();
if (!(d.length !== s.length || d.some((f, v) => s[v] !== f))) return n;
s = d;
let a;
if (e.key && ((h = e.debug) != null && h.call(e)) && (a = Date.now()), n = t(...d), e.key && ((u = e.debug) != null && u.call(e))) {
const f = Math.round((Date.now() - c) * 100) / 100, v = Math.round((Date.now() - a) * 100) / 100, g = v / 16, S = (p, E) => {
for (p = String(p); p.length < E; ) p = " " + p;
return p;
};
console.info(`%c⏱ ${S(v, 5)} /${S(f, 5)} ms`, `
font-size: .6rem;
font-weight: bold;
color: hsl(${Math.max(0, Math.min(120 - 120 * g, 120))}deg 100% 31%);`, e?.key);
}
return e?.onChange && !(l && e.skipInitialOnChange) && e.onChange(n), l = !1, n;
}
return i.updateDeps = (o) => {
s = o;
}, i;
}
function z(r, t) {
if (r === void 0) throw new Error(`Unexpected undefined${t ? `: ${t}` : ""}`);
return r;
}
var P = (r, t) => Math.abs(r - t) < 1.01, B = (r, t, e) => {
let s;
return function(...n) {
r.clearTimeout(s), s = r.setTimeout(() => t.apply(this, n), e);
};
}, C = (r) => {
const { offsetWidth: t, offsetHeight: e } = r;
return {
width: t,
height: e
};
}, H = (r) => r, $ = (r) => {
const t = Math.max(r.startIndex - r.overscan, 0), e = Math.min(r.endIndex + r.overscan, r.count - 1), s = [];
for (let n = t; n <= e; n++) s.push(n);
return s;
}, q = (r, t) => {
const e = r.scrollElement;
if (!e) return;
const s = r.targetWindow;
if (!s) return;
const n = (i) => {
const { width: o, height: h } = i;
t({
width: Math.round(o),
height: Math.round(h)
});
};
if (n(C(e)), !s.ResizeObserver) return () => {
};
const l = new s.ResizeObserver((i) => {
const o = () => {
const h = i[0];
if (h?.borderBoxSize) {
const u = h.borderBoxSize[0];
if (u) {
n({
width: u.inlineSize,
height: u.blockSize
});
return;
}
}
n(C(e));
};
r.options.useAnimationFrameWithResizeObserver ? requestAnimationFrame(o) : o();
});
return l.observe(e, { box: "border-box" }), () => {
l.unobserve(e);
};
}, A = { passive: !0 }, F = typeof window > "u" ? !0 : "onscrollend" in window, K = (r, t) => {
const e = r.scrollElement;
if (!e) return;
const s = r.targetWindow;
if (!s) return;
let n = 0;
const l = r.options.useScrollendEvent && F ? () => {
} : B(s, () => {
t(n, !1);
}, r.options.isScrollingResetDelay), i = (c) => () => {
const { horizontal: d, isRtl: a } = r.options;
n = d ? e.scrollLeft * (a && -1 || 1) : e.scrollTop, l(), t(n, c);
}, o = i(!0), h = i(!1);
e.addEventListener("scroll", o, A);
const u = r.options.useScrollendEvent && F;
return u && e.addEventListener("scrollend", h, A), () => {
e.removeEventListener("scroll", o), u && e.removeEventListener("scrollend", h);
};
}, U = (r, t, e) => {
if (t?.borderBoxSize) {
const s = t.borderBoxSize[0];
if (s) return Math.round(s[e.options.horizontal ? "inlineSize" : "blockSize"]);
}
return r[e.options.horizontal ? "offsetWidth" : "offsetHeight"];
}, G = (r, { adjustments: t = 0, behavior: e }, s) => {
var n, l;
const i = r + t;
(l = (n = s.scrollElement) == null ? void 0 : n.scrollTo) == null || l.call(n, {
[s.options.horizontal ? "left" : "top"]: i,
behavior: e
});
}, J = class {
constructor(r) {
this.unsubs = [], this.scrollElement = null, this.targetWindow = null, this.isScrolling = !1, this.scrollState = null, this.measurementsCache = [], this.itemSizeCache = /* @__PURE__ */ new Map(), this.laneAssignments = /* @__PURE__ */ new Map(), this.pendingMeasuredCacheIndexes = [], this.prevLanes = void 0, this.lanesChangedFlag = !1, this.lanesSettling = !1, this.scrollRect = null, this.scrollOffset = null, this.scrollDirection = null, this.scrollAdjustments = 0, this.elementsCache = /* @__PURE__ */ new Map(), this.now = () => {
var t, e, s;
return ((s = (e = (t = this.targetWindow) == null ? void 0 : t.performance) == null ? void 0 : e.now) == null ? void 0 : s.call(e)) ?? Date.now();
}, this.observer = /* @__PURE__ */ (() => {
let t = null;
const e = () => t || (!this.targetWindow || !this.targetWindow.ResizeObserver ? null : t = new this.targetWindow.ResizeObserver((s) => {
s.forEach((n) => {
const l = () => {
const i = n.target, o = this.indexFromElement(i);
if (!i.isConnected) {
this.observer.unobserve(i);
return;
}
this.shouldMeasureDuringScroll(o) && this.resizeItem(o, this.options.measureElement(i, n, this));
};
this.options.useAnimationFrameWithResizeObserver ? requestAnimationFrame(l) : l();
});
}));
return {
disconnect: () => {
var s;
(s = e()) == null || s.disconnect(), t = null;
},
observe: (s) => {
var n;
return (n = e()) == null ? void 0 : n.observe(s, { box: "border-box" });
},
unobserve: (s) => {
var n;
return (n = e()) == null ? void 0 : n.unobserve(s);
}
};
})(), this.range = null, this.setOptions = (t) => {
Object.entries(t).forEach(([e, s]) => {
typeof s > "u" && delete t[e];
}), this.options = {
debug: !1,
initialOffset: 0,
overscan: 1,
paddingStart: 0,
paddingEnd: 0,
scrollPaddingStart: 0,
scrollPaddingEnd: 0,
horizontal: !1,
getItemKey: H,
rangeExtractor: $,
onChange: () => {
},
measureElement: U,
initialRect: {
width: 0,
height: 0
},
scrollMargin: 0,
gap: 0,
indexAttribute: "data-index",
initialMeasurementsCache: [],
lanes: 1,
isScrollingResetDelay: 150,
enabled: !0,
isRtl: !1,
useScrollendEvent: !1,
useAnimationFrameWithResizeObserver: !1,
laneAssignmentMode: "estimate",
...t
};
}, this.notify = (t) => {
var e, s;
(s = (e = this.options).onChange) == null || s.call(e, this, t);
}, this.maybeNotify = x(() => (this.calculateRange(), [
this.isScrolling,
this.range ? this.range.startIndex : null,
this.range ? this.range.endIndex : null
]), (t) => {
this.notify(t);
}, {
key: process.env.NODE_ENV !== "production" && "maybeNotify",
debug: () => this.options.debug,
initialDeps: [
this.isScrolling,
this.range ? this.range.startIndex : null,
this.range ? this.range.endIndex : null
]
}), this.cleanup = () => {
this.unsubs.filter(Boolean).forEach((t) => t()), this.unsubs = [], this.observer.disconnect(), this.rafId != null && this.targetWindow && (this.targetWindow.cancelAnimationFrame(this.rafId), this.rafId = null), this.scrollState = null, this.scrollElement = null, this.targetWindow = null;
}, this._didMount = () => () => {
this.cleanup();
}, this._willUpdate = () => {
var t;
const e = this.options.enabled ? this.options.getScrollElement() : null;
if (this.scrollElement !== e) {
if (this.cleanup(), !e) {
this.maybeNotify();
return;
}
this.scrollElement = e, this.scrollElement && "ownerDocument" in this.scrollElement ? this.targetWindow = this.scrollElement.ownerDocument.defaultView : this.targetWindow = ((t = this.scrollElement) == null ? void 0 : t.window) ?? null, this.elementsCache.forEach((s) => {
this.observer.observe(s);
}), this.unsubs.push(this.options.observeElementRect(this, (s) => {
this.scrollRect = s, this.maybeNotify();
})), this.unsubs.push(this.options.observeElementOffset(this, (s, n) => {
this.scrollAdjustments = 0, this.scrollDirection = n ? this.getScrollOffset() < s ? "forward" : "backward" : null, this.scrollOffset = s, this.isScrolling = n, this.scrollState && this.scheduleScrollReconcile(), this.maybeNotify();
})), this._scrollToOffset(this.getScrollOffset(), {
adjustments: void 0,
behavior: void 0
});
}
}, this.rafId = null, this.getSize = () => this.options.enabled ? (this.scrollRect = this.scrollRect ?? this.options.initialRect, this.scrollRect[this.options.horizontal ? "width" : "height"]) : (this.scrollRect = null, 0), this.getScrollOffset = () => this.options.enabled ? (this.scrollOffset = this.scrollOffset ?? (typeof this.options.initialOffset == "function" ? this.options.initialOffset() : this.options.initialOffset), this.scrollOffset) : (this.scrollOffset = null, 0), this.getFurthestMeasurement = (t, e) => {
const s = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map();
for (let l = e - 1; l >= 0; l--) {
const i = t[l];
if (s.has(i.lane)) continue;
const o = n.get(i.lane);
if (o == null || i.end > o.end ? n.set(i.lane, i) : i.end < o.end && s.set(i.lane, !0), s.size === this.options.lanes) break;
}
return n.size === this.options.lanes ? Array.from(n.values()).sort((l, i) => l.end === i.end ? l.index - i.index : l.end - i.end)[0] : void 0;
}, this.getMeasurementOptions = x(() => [
this.options.count,
this.options.paddingStart,
this.options.scrollMargin,
this.options.getItemKey,
this.options.enabled,
this.options.lanes,
this.options.laneAssignmentMode
], (t, e, s, n, l, i, o) => (this.prevLanes !== void 0 && this.prevLanes !== i && (this.lanesChangedFlag = !0), this.prevLanes = i, this.pendingMeasuredCacheIndexes = [], {
count: t,
paddingStart: e,
scrollMargin: s,
getItemKey: n,
enabled: l,
lanes: i,
laneAssignmentMode: o
}), { key: !1 }), this.getMeasurements = x(() => [this.getMeasurementOptions(), this.itemSizeCache], ({ count: t, paddingStart: e, scrollMargin: s, getItemKey: n, enabled: l, lanes: i, laneAssignmentMode: o }, h) => {
if (!l)
return this.measurementsCache = [], this.itemSizeCache.clear(), this.laneAssignments.clear(), [];
if (this.laneAssignments.size > t)
for (const a of this.laneAssignments.keys()) a >= t && this.laneAssignments.delete(a);
this.lanesChangedFlag && (this.lanesChangedFlag = !1, this.lanesSettling = !0, this.measurementsCache = [], this.itemSizeCache.clear(), this.laneAssignments.clear(), this.pendingMeasuredCacheIndexes = []), this.measurementsCache.length === 0 && !this.lanesSettling && (this.measurementsCache = this.options.initialMeasurementsCache, this.measurementsCache.forEach((a) => {
this.itemSizeCache.set(a.key, a.size);
}));
const u = this.lanesSettling ? 0 : this.pendingMeasuredCacheIndexes.length > 0 ? Math.min(...this.pendingMeasuredCacheIndexes) : 0;
this.pendingMeasuredCacheIndexes = [], this.lanesSettling && this.measurementsCache.length === t && (this.lanesSettling = !1);
const c = this.measurementsCache.slice(0, u), d = new Array(i).fill(void 0);
for (let a = 0; a < u; a++) {
const f = c[a];
f && (d[f.lane] = a);
}
for (let a = u; a < t; a++) {
const f = n(a), v = this.laneAssignments.get(a);
let g, S;
const p = o === "estimate" || h.has(f);
if (v !== void 0 && this.options.lanes > 1) {
g = v;
const b = d[g], y = b !== void 0 ? c[b] : void 0;
S = y ? y.end + this.options.gap : e + s;
} else {
const b = this.options.lanes === 1 ? c[a - 1] : this.getFurthestMeasurement(c, a);
S = b ? b.end + this.options.gap : e + s, g = b ? b.lane : a % this.options.lanes, this.options.lanes > 1 && p && this.laneAssignments.set(a, g);
}
const E = h.get(f), O = typeof E == "number" ? E : this.options.estimateSize(a), T = S + O;
c[a] = {
index: a,
start: S,
size: O,
end: T,
key: f,
lane: g
}, d[g] = a;
}
return this.measurementsCache = c, c;
}, {
key: process.env.NODE_ENV !== "production" && "getMeasurements",
debug: () => this.options.debug
}), this.calculateRange = x(() => [
this.getMeasurements(),
this.getSize(),
this.getScrollOffset(),
this.options.lanes
], (t, e, s, n) => this.range = t.length > 0 && e > 0 ? Q({
measurements: t,
outerSize: e,
scrollOffset: s,
lanes: n
}) : null, {
key: process.env.NODE_ENV !== "production" && "calculateRange",
debug: () => this.options.debug
}), this.getVirtualIndexes = x(() => {
let t = null, e = null;
const s = this.calculateRange();
return s && (t = s.startIndex, e = s.endIndex), this.maybeNotify.updateDeps([
this.isScrolling,
t,
e
]), [
this.options.rangeExtractor,
this.options.overscan,
this.options.count,
t,
e
];
}, (t, e, s, n, l) => n === null || l === null ? [] : t({
startIndex: n,
endIndex: l,
overscan: e,
count: s
}), {
key: process.env.NODE_ENV !== "production" && "getVirtualIndexes",
debug: () => this.options.debug
}), this.indexFromElement = (t) => {
const e = this.options.indexAttribute, s = t.getAttribute(e);
return s ? parseInt(s, 10) : (console.warn(`Missing attribute name '${e}={index}' on measured element.`), -1);
}, this.shouldMeasureDuringScroll = (t) => {
var e;
if (!this.scrollState || this.scrollState.behavior !== "smooth") return !0;
const s = this.scrollState.index ?? ((e = this.getVirtualItemForOffset(this.scrollState.lastTargetOffset)) == null ? void 0 : e.index);
if (s !== void 0 && this.range) {
const n = Math.max(this.options.overscan, Math.ceil((this.range.endIndex - this.range.startIndex) / 2)), l = Math.max(0, s - n), i = Math.min(this.options.count - 1, s + n);
return t >= l && t <= i;
}
return !0;
}, this.measureElement = (t) => {
if (!t) {
this.elementsCache.forEach((l, i) => {
l.isConnected || (this.observer.unobserve(l), this.elementsCache.delete(i));
});
return;
}
const e = this.indexFromElement(t), s = this.options.getItemKey(e), n = this.elementsCache.get(s);
n !== t && (n && this.observer.unobserve(n), this.observer.observe(t), this.elementsCache.set(s, t)), (!this.isScrolling || this.scrollState) && this.shouldMeasureDuringScroll(e) && this.resizeItem(e, this.options.measureElement(t, void 0, this));
}, this.resizeItem = (t, e) => {
var s;
const n = this.measurementsCache[t];
if (!n) return;
const l = e - (this.itemSizeCache.get(n.key) ?? n.size);
l !== 0 && (((s = this.scrollState) == null ? void 0 : s.behavior) !== "smooth" && (this.shouldAdjustScrollPositionOnItemSizeChange !== void 0 ? this.shouldAdjustScrollPositionOnItemSizeChange(n, l, this) : n.start < this.getScrollOffset() + this.scrollAdjustments) && (process.env.NODE_ENV !== "production" && this.options.debug && console.info("correction", l), this._scrollToOffset(this.getScrollOffset(), {
adjustments: this.scrollAdjustments += l,
behavior: void 0
})), this.pendingMeasuredCacheIndexes.push(n.index), this.itemSizeCache = new Map(this.itemSizeCache.set(n.key, e)), this.notify(!1));
}, this.getVirtualItems = x(() => [this.getVirtualIndexes(), this.getMeasurements()], (t, e) => {
const s = [];
for (let n = 0, l = t.length; n < l; n++) {
const i = e[t[n]];
s.push(i);
}
return s;
}, {
key: process.env.NODE_ENV !== "production" && "getVirtualItems",
debug: () => this.options.debug
}), this.getVirtualItemForOffset = (t) => {
const e = this.getMeasurements();
if (e.length !== 0)
return z(e[_(0, e.length - 1, (s) => z(e[s]).start, t)]);
}, this.getMaxScrollOffset = () => {
if (!this.scrollElement) return 0;
if ("scrollHeight" in this.scrollElement) return this.options.horizontal ? this.scrollElement.scrollWidth - this.scrollElement.clientWidth : this.scrollElement.scrollHeight - this.scrollElement.clientHeight;
{
const t = this.scrollElement.document.documentElement;
return this.options.horizontal ? t.scrollWidth - this.scrollElement.innerWidth : t.scrollHeight - this.scrollElement.innerHeight;
}
}, this.getOffsetForAlignment = (t, e, s = 0) => {
if (!this.scrollElement) return 0;
const n = this.getSize(), l = this.getScrollOffset();
e === "auto" && (e = t >= l + n ? "end" : "start"), e === "center" ? t += (s - n) / 2 : e === "end" && (t -= n);
const i = this.getMaxScrollOffset();
return Math.max(Math.min(i, t), 0);
}, this.getOffsetForIndex = (t, e = "auto") => {
t = Math.max(0, Math.min(t, this.options.count - 1));
const s = this.getSize(), n = this.getScrollOffset(), l = this.measurementsCache[t];
if (!l) return;
if (e === "auto") if (l.end >= n + s - this.options.scrollPaddingEnd) e = "end";
else if (l.start <= n + this.options.scrollPaddingStart) e = "start";
else return [n, e];
if (e === "end" && t === this.options.count - 1) return [this.getMaxScrollOffset(), e];
const i = e === "end" ? l.end + this.options.scrollPaddingEnd : l.start - this.options.scrollPaddingStart;
return [this.getOffsetForAlignment(i, e, l.size), e];
}, this.scrollToOffset = (t, { align: e = "start", behavior: s = "auto" } = {}) => {
const n = this.getOffsetForAlignment(t, e), l = this.now();
this.scrollState = {
index: null,
align: e,
behavior: s,
startedAt: l,
lastTargetOffset: n,
stableFrames: 0
}, this._scrollToOffset(n, {
adjustments: void 0,
behavior: s
}), this.scheduleScrollReconcile();
}, this.scrollToIndex = (t, { align: e = "auto", behavior: s = "auto" } = {}) => {
t = Math.max(0, Math.min(t, this.options.count - 1));
const n = this.getOffsetForIndex(t, e);
if (!n) return;
const [l, i] = n, o = this.now();
this.scrollState = {
index: t,
align: i,
behavior: s,
startedAt: o,
lastTargetOffset: l,
stableFrames: 0
}, this._scrollToOffset(l, {
adjustments: void 0,
behavior: s
}), this.scheduleScrollReconcile();
}, this.scrollBy = (t, { behavior: e = "auto" } = {}) => {
const s = this.getScrollOffset() + t, n = this.now();
this.scrollState = {
index: null,
align: "start",
behavior: e,
startedAt: n,
lastTargetOffset: s,
stableFrames: 0
}, this._scrollToOffset(s, {
adjustments: void 0,
behavior: e
}), this.scheduleScrollReconcile();
}, this.getTotalSize = () => {
var t;
const e = this.getMeasurements();
let s;
if (e.length === 0) s = this.options.paddingStart;
else if (this.options.lanes === 1) s = ((t = e[e.length - 1]) == null ? void 0 : t.end) ?? 0;
else {
const n = Array(this.options.lanes).fill(null);
let l = e.length - 1;
for (; l >= 0 && n.some((i) => i === null); ) {
const i = e[l];
n[i.lane] === null && (n[i.lane] = i.end), l--;
}
s = Math.max(...n.filter((i) => i !== null));
}
return Math.max(s - this.options.scrollMargin + this.options.paddingEnd, 0);
}, this._scrollToOffset = (t, { adjustments: e, behavior: s }) => {
this.options.scrollToFn(t, {
behavior: s,
adjustments: e
}, this);
}, this.measure = () => {
this.itemSizeCache = /* @__PURE__ */ new Map(), this.laneAssignments = /* @__PURE__ */ new Map(), this.notify(!1);
}, this.setOptions(r);
}
scheduleScrollReconcile() {
if (!this.targetWindow) {
this.scrollState = null;
return;
}
this.rafId == null && (this.rafId = this.targetWindow.requestAnimationFrame(() => {
this.rafId = null, this.reconcileScroll();
}));
}
reconcileScroll() {
if (!this.scrollState || !this.scrollElement) return;
if (this.now() - this.scrollState.startedAt > 5e3) {
this.scrollState = null;
return;
}
const r = this.scrollState.index != null ? this.getOffsetForIndex(this.scrollState.index, this.scrollState.align) : void 0, t = r ? r[0] : this.scrollState.lastTargetOffset, e = 1, s = t !== this.scrollState.lastTargetOffset;
if (!s && P(t, this.getScrollOffset())) {
if (this.scrollState.stableFrames++, this.scrollState.stableFrames >= e) {
this.scrollState = null;
return;
}
} else
this.scrollState.stableFrames = 0, s && (this.scrollState.lastTargetOffset = t, this.scrollState.behavior = "auto", this._scrollToOffset(t, {
adjustments: void 0,
behavior: "auto"
}));
this.scheduleScrollReconcile();
}
}, _ = (r, t, e, s) => {
for (; r <= t; ) {
const n = (r + t) / 2 | 0, l = e(n);
if (l < s) r = n + 1;
else if (l > s) t = n - 1;
else return n;
}
return r > 0 ? r - 1 : 0;
};
function Q({ measurements: r, outerSize: t, scrollOffset: e, lanes: s }) {
const n = r.length - 1, l = (h) => r[h].start;
if (r.length <= s) return {
startIndex: 0,
endIndex: n
};
let i = _(0, n, l, e), o = i;
if (s === 1) for (; o < n && r[o].end < e + t; ) o++;
else if (s > 1) {
const h = Array(s).fill(0);
for (; o < n && h.some((c) => c < e + t); ) {
const c = r[o];
h[c.lane] = c.end, o++;
}
const u = Array(s).fill(e + t);
for (; i >= 0 && u.some((c) => c >= e); ) {
const c = r[i];
u[c.lane] = c.start, i--;
}
i = Math.max(0, i - i % s), o = Math.min(n, o + (s - 1 - o % s));
}
return {
startIndex: i,
endIndex: o
};
}
var R = typeof document < "u" ? w.useLayoutEffect : w.useEffect;
function X({ useFlushSync: r = !0, ...t }) {
const e = w.useReducer(() => ({}), {})[1], s = {
...t,
onChange: (l, i) => {
var o;
r && i ? V(e) : e(), (o = t.onChange) == null || o.call(t, l, i);
}
}, [n] = w.useState(() => new J(s));
return n.setOptions(s), R(() => n._didMount(), []), R(() => n._willUpdate()), n;
}
function Y(r) {
return X({
observeElementRect: q,
observeElementOffset: K,
scrollToFn: G,
...r
});
}
var re = ({ showFlagOnSearch: r, showNameOnSearch: t }) => {
const e = W(null), { termOfSearch: s, countries: n, handleSelectCountry: l } = N(), i = L(() => n.filter((h) => h.name.toLocaleLowerCase().includes(s.toLowerCase())), [s]), o = Y({
count: i.length,
overscan: 5,
getScrollElement: () => e.current,
estimateSize: () => 40
});
return D(() => {
i.length > 0 && o.scrollToIndex(0);
}, [s, o]), i.length === 0 ? /* @__PURE__ */ m("div", {
className: "overflow-y-auto max-h-60 snap-y snap-mandatory",
children: /* @__PURE__ */ m("ul", {
className: "relative",
children: /* @__PURE__ */ m("li", {
className: "w-full flex items-center h-10 select-none px-6",
children: /* @__PURE__ */ m(I, {
variant: "body2",
component: "span",
className: "flex gap-2 items-center text-left",
children: "No options"
})
})
})
}) : /* @__PURE__ */ m("div", {
ref: e,
className: "overflow-y-auto max-h-60 snap-y snap-mandatory scrollbar",
children: /* @__PURE__ */ m("ul", {
className: "relative",
style: { height: o.getTotalSize() },
children: o.getVirtualItems().map((h) => {
const u = i[h.index], { flag: c, name: d, prefix: a } = u;
return /* @__PURE__ */ m("li", {
className: M("absolute", "w-full", "snap-start", "snap-always", "scroll-m-0", "flex", "items-center", "h-10"),
style: {
top: h.start,
height: h.size
},
children: /* @__PURE__ */ m("button", {
className: M("w-full", "h-full", "cursor-pointer", "px-6", "hover:bg-gray-50", "transition-colors", "duration-150", "focus-visible:outline-0", "hover:outline-gray-100", "focus:bg-gray-50", "dark:hover:bg-metal-700"),
onClick: () => l(u),
children: /* @__PURE__ */ j(I, {
variant: "body2",
component: "span",
className: "flex gap-2 items-center text-left",
children: [r && /* @__PURE__ */ m(c, {}), t && /* @__PURE__ */ m(k, {
text: d,
prefix: a
})]
})
})
}, h.key);
})
})
});
};
export {
re as t
};