ivt
Version:
Ivt Components Library
602 lines (596 loc) • 24 kB
JavaScript
import { R as Root, P as Portal, O as Overlay, a as Content } from './index-CaYwp6E6.mjs';
import * as React from 'react';
import { P as Primitive } from './index-Dsw02Eup.mjs';
import { u as useId } from './index-gX0V59dZ.mjs';
import { b as composeRefs } from './index-D4jPaBZ2.mjs';
import { c as cn } from './utils-BDcRwQMd.mjs';
import { D as Dialog, b as DialogContent } from './dialog-DL1cSseU.mjs';
import { c as createLucideIcon } from './createLucideIcon-C11Tr46U.mjs';
const __iconNode = [
[
"circle",
{
cx: "11",
cy: "11",
r: "8",
key: "4ej97u"
}
],
[
"path",
{
d: "m21 21-4.3-4.3",
key: "1qie3q"
}
]
];
const Search = createLucideIcon("Search", __iconNode);
var U = 1, Y$1 = .9, H = .8, J = .17, p = .1, u = .999, $ = .9999;
var k$1 = .99, m = /[\\\/_+.#"@\[\(\{&]/, B$1 = /[\\\/_+.#"@\[\(\{&]/g, K$1 = /[\s-]/, X = /[\s-]/g;
function G(_, C, h, P, A, f, O) {
if (f === C.length) return A === _.length ? U : k$1;
var T = `${A},${f}`;
if (O[T] !== void 0) return O[T];
for(var L = P.charAt(f), c = h.indexOf(L, A), S = 0, E, N, R, M; c >= 0;)E = G(_, C, h, P, c + 1, f + 1, O), E > S && (c === A ? E *= U : m.test(_.charAt(c - 1)) ? (E *= H, R = _.slice(A, c - 1).match(B$1), R && A > 0 && (E *= Math.pow(u, R.length))) : K$1.test(_.charAt(c - 1)) ? (E *= Y$1, M = _.slice(A, c - 1).match(X), M && A > 0 && (E *= Math.pow(u, M.length))) : (E *= J, A > 0 && (E *= Math.pow(u, c - A))), _.charAt(c) !== C.charAt(f) && (E *= $)), (E < p && h.charAt(c - 1) === P.charAt(f + 1) || P.charAt(f + 1) === P.charAt(f) && h.charAt(c - 1) !== P.charAt(f)) && (N = G(_, C, h, P, c + 1, f + 2, O), N * p > E && (E = N * p)), E > S && (S = E), c = h.indexOf(L, c + 1);
return O[T] = S, S;
}
function D(_) {
return _.toLowerCase().replace(X, " ");
}
function W(_, C, h) {
return _ = h && h.length > 0 ? `${_ + " " + h.join(" ")}` : _, G(_, C, D(_), D(C), 0, 0, {});
}
var N = '[cmdk-group=""]', Y = '[cmdk-group-items=""]', be = '[cmdk-group-heading=""]', le = '[cmdk-item=""]', ce = `${le}:not([aria-disabled="true"])`, Z = "cmdk-item-select", T = "data-value", Re = (r, o, n)=>W(r, o, n), ue = React.createContext(void 0), K = ()=>React.useContext(ue), de = React.createContext(void 0), ee = ()=>React.useContext(de), fe = React.createContext(void 0), me = React.forwardRef((r, o)=>{
let n = L(()=>{
var e, a;
return {
search: "",
value: (a = (e = r.value) != null ? e : r.defaultValue) != null ? a : "",
selectedItemId: void 0,
filtered: {
count: 0,
items: new Map,
groups: new Set
}
};
}), u = L(()=>new Set), c = L(()=>new Map), d = L(()=>new Map), f = L(()=>new Set), p = pe(r), { label: b, children: m, value: R, onValueChange: x, filter: C, shouldFilter: S, loop: A, disablePointerSelection: ge = false, vimBindings: j = true, ...O } = r, $ = useId(), q = useId(), _ = useId(), I = React.useRef(null), v = ke();
k(()=>{
if (R !== void 0) {
let e = R.trim();
n.current.value = e, E.emit();
}
}, [
R
]), k(()=>{
v(6, ne);
}, []);
let E = React.useMemo(()=>({
subscribe: (e)=>(f.current.add(e), ()=>f.current.delete(e)),
snapshot: ()=>n.current,
setState: (e, a, s)=>{
var i, l, g, y;
if (!Object.is(n.current[e], a)) {
if (n.current[e] = a, e === "search") J(), z(), v(1, W);
else if (e === "value") {
if (document.activeElement.hasAttribute("cmdk-input") || document.activeElement.hasAttribute("cmdk-root")) {
let h = document.getElementById(_);
h ? h.focus() : (i = document.getElementById($)) == null || i.focus();
}
if (v(7, ()=>{
var h;
n.current.selectedItemId = (h = M()) == null ? void 0 : h.id, E.emit();
}), s || v(5, ne), ((l = p.current) == null ? void 0 : l.value) !== void 0) {
let h = a != null ? a : "";
(y = (g = p.current).onValueChange) == null || y.call(g, h);
return;
}
}
E.emit();
}
},
emit: ()=>{
f.current.forEach((e)=>e());
}
}), []), U = React.useMemo(()=>({
value: (e, a, s)=>{
var i;
a !== ((i = d.current.get(e)) == null ? void 0 : i.value) && (d.current.set(e, {
value: a,
keywords: s
}), n.current.filtered.items.set(e, te(a, s)), v(2, ()=>{
z(), E.emit();
}));
},
item: (e, a)=>(u.current.add(e), a && (c.current.has(a) ? c.current.get(a).add(e) : c.current.set(a, new Set([
e
]))), v(3, ()=>{
J(), z(), n.current.value || W(), E.emit();
}), ()=>{
d.current.delete(e), u.current.delete(e), n.current.filtered.items.delete(e);
let s = M();
v(4, ()=>{
J(), (s == null ? void 0 : s.getAttribute("id")) === e && W(), E.emit();
});
}),
group: (e)=>(c.current.has(e) || c.current.set(e, new Set), ()=>{
d.current.delete(e), c.current.delete(e);
}),
filter: ()=>p.current.shouldFilter,
label: b || r["aria-label"],
getDisablePointerSelection: ()=>p.current.disablePointerSelection,
listId: $,
inputId: _,
labelId: q,
listInnerRef: I
}), []);
function te(e, a) {
var i, l;
let s = (l = (i = p.current) == null ? void 0 : i.filter) != null ? l : Re;
return e ? s(e, n.current.search, a) : 0;
}
function z() {
if (!n.current.search || p.current.shouldFilter === false) return;
let e = n.current.filtered.items, a = [];
n.current.filtered.groups.forEach((i)=>{
let l = c.current.get(i), g = 0;
l.forEach((y)=>{
let h = e.get(y);
g = Math.max(h, g);
}), a.push([
i,
g
]);
});
let s = I.current;
V().sort((i, l)=>{
var h, F;
let g = i.getAttribute("id"), y = l.getAttribute("id");
return ((h = e.get(y)) != null ? h : 0) - ((F = e.get(g)) != null ? F : 0);
}).forEach((i)=>{
let l = i.closest(Y);
l ? l.appendChild(i.parentElement === l ? i : i.closest(`${Y} > *`)) : s.appendChild(i.parentElement === s ? i : i.closest(`${Y} > *`));
}), a.sort((i, l)=>l[1] - i[1]).forEach((i)=>{
var g;
let l = (g = I.current) == null ? void 0 : g.querySelector(`${N}[${T}="${encodeURIComponent(i[0])}"]`);
l == null || l.parentElement.appendChild(l);
});
}
function W() {
let e = V().find((s)=>s.getAttribute("aria-disabled") !== "true"), a = e == null ? void 0 : e.getAttribute(T);
E.setState("value", a || void 0);
}
function J() {
var a, s, i, l;
if (!n.current.search || p.current.shouldFilter === false) {
n.current.filtered.count = u.current.size;
return;
}
n.current.filtered.groups = new Set;
let e = 0;
for (let g of u.current){
let y = (s = (a = d.current.get(g)) == null ? void 0 : a.value) != null ? s : "", h = (l = (i = d.current.get(g)) == null ? void 0 : i.keywords) != null ? l : [], F = te(y, h);
n.current.filtered.items.set(g, F), F > 0 && e++;
}
for (let [g, y] of c.current)for (let h of y)if (n.current.filtered.items.get(h) > 0) {
n.current.filtered.groups.add(g);
break;
}
n.current.filtered.count = e;
}
function ne() {
var a, s, i;
let e = M();
e && (((a = e.parentElement) == null ? void 0 : a.firstChild) === e && ((i = (s = e.closest(N)) == null ? void 0 : s.querySelector(be)) == null || i.scrollIntoView({
block: "nearest"
})), e.scrollIntoView({
block: "nearest"
}));
}
function M() {
var e;
return (e = I.current) == null ? void 0 : e.querySelector(`${le}[aria-selected="true"]`);
}
function V() {
var e;
return Array.from(((e = I.current) == null ? void 0 : e.querySelectorAll(ce)) || []);
}
function X(e) {
let s = V()[e];
s && E.setState("value", s.getAttribute(T));
}
function Q(e) {
var g;
let a = M(), s = V(), i = s.findIndex((y)=>y === a), l = s[i + e];
(g = p.current) != null && g.loop && (l = i + e < 0 ? s[s.length - 1] : i + e === s.length ? s[0] : s[i + e]), l && E.setState("value", l.getAttribute(T));
}
function re(e) {
let a = M(), s = a == null ? void 0 : a.closest(N), i;
for(; s && !i;)s = e > 0 ? we(s, N) : De(s, N), i = s == null ? void 0 : s.querySelector(ce);
i ? E.setState("value", i.getAttribute(T)) : Q(e);
}
let oe = ()=>X(V().length - 1), ie = (e)=>{
e.preventDefault(), e.metaKey ? oe() : e.altKey ? re(1) : Q(1);
}, se = (e)=>{
e.preventDefault(), e.metaKey ? X(0) : e.altKey ? re(-1) : Q(-1);
};
return React.createElement(Primitive.div, {
ref: o,
tabIndex: -1,
...O,
"cmdk-root": "",
onKeyDown: (e)=>{
var s;
(s = O.onKeyDown) == null || s.call(O, e);
let a = e.nativeEvent.isComposing || e.keyCode === 229;
if (!(e.defaultPrevented || a)) switch(e.key){
case "n":
case "j":
{
j && e.ctrlKey && ie(e);
break;
}
case "ArrowDown":
{
ie(e);
break;
}
case "p":
case "k":
{
j && e.ctrlKey && se(e);
break;
}
case "ArrowUp":
{
se(e);
break;
}
case "Home":
{
e.preventDefault(), X(0);
break;
}
case "End":
{
e.preventDefault(), oe();
break;
}
case "Enter":
{
e.preventDefault();
let i = M();
if (i) {
let l = new Event(Z);
i.dispatchEvent(l);
}
}
}
}
}, React.createElement("label", {
"cmdk-label": "",
htmlFor: U.inputId,
id: U.labelId,
style: Te
}, b), B(r, (e)=>React.createElement(de.Provider, {
value: E
}, React.createElement(ue.Provider, {
value: U
}, e))));
}), he = React.forwardRef((r, o)=>{
var _, I;
let n = useId(), u = React.useRef(null), c = React.useContext(fe), d = K(), f = pe(r), p = (I = (_ = f.current) == null ? void 0 : _.forceMount) != null ? I : c == null ? void 0 : c.forceMount;
k(()=>{
if (!p) return d.item(n, c == null ? void 0 : c.id);
}, [
p
]);
let b = ve(n, u, [
r.value,
r.children,
u
], r.keywords), m = ee(), R = P((v)=>v.value && v.value === b.current), x = P((v)=>p || d.filter() === false ? true : v.search ? v.filtered.items.get(n) > 0 : true);
React.useEffect(()=>{
let v = u.current;
if (!(!v || r.disabled)) return v.addEventListener(Z, C), ()=>v.removeEventListener(Z, C);
}, [
x,
r.onSelect,
r.disabled
]);
function C() {
var v, E;
S(), (E = (v = f.current).onSelect) == null || E.call(v, b.current);
}
function S() {
m.setState("value", b.current, true);
}
if (!x) return null;
let { disabled: A, value: ge, onSelect: j, forceMount: O, keywords: $, ...q } = r;
return React.createElement(Primitive.div, {
ref: composeRefs(u, o),
...q,
id: n,
"cmdk-item": "",
role: "option",
"aria-disabled": !!A,
"aria-selected": !!R,
"data-disabled": !!A,
"data-selected": !!R,
onPointerMove: A || d.getDisablePointerSelection() ? void 0 : S,
onClick: A ? void 0 : C
}, r.children);
}), Ee = React.forwardRef((r, o)=>{
let { heading: n, children: u, forceMount: c, ...d } = r, f = useId(), p = React.useRef(null), b = React.useRef(null), m = useId(), R = K(), x = P((S)=>c || R.filter() === false ? true : S.search ? S.filtered.groups.has(f) : true);
k(()=>R.group(f), []), ve(f, p, [
r.value,
r.heading,
b
]);
let C = React.useMemo(()=>({
id: f,
forceMount: c
}), [
c
]);
return React.createElement(Primitive.div, {
ref: composeRefs(p, o),
...d,
"cmdk-group": "",
role: "presentation",
hidden: x ? void 0 : true
}, n && React.createElement("div", {
ref: b,
"cmdk-group-heading": "",
"aria-hidden": true,
id: m
}, n), B(r, (S)=>React.createElement("div", {
"cmdk-group-items": "",
role: "group",
"aria-labelledby": n ? m : void 0
}, React.createElement(fe.Provider, {
value: C
}, S))));
}), ye = React.forwardRef((r, o)=>{
let { alwaysRender: n, ...u } = r, c = React.useRef(null), d = P((f)=>!f.search);
return !n && !d ? null : React.createElement(Primitive.div, {
ref: composeRefs(c, o),
...u,
"cmdk-separator": "",
role: "separator"
});
}), Se = React.forwardRef((r, o)=>{
let { onValueChange: n, ...u } = r, c = r.value != null, d = ee(), f = P((m)=>m.search), p = P((m)=>m.selectedItemId), b = K();
return React.useEffect(()=>{
r.value != null && d.setState("search", r.value);
}, [
r.value
]), React.createElement(Primitive.input, {
ref: o,
...u,
"cmdk-input": "",
autoComplete: "off",
autoCorrect: "off",
spellCheck: false,
"aria-autocomplete": "list",
role: "combobox",
"aria-expanded": true,
"aria-controls": b.listId,
"aria-labelledby": b.labelId,
"aria-activedescendant": p,
id: b.inputId,
type: "text",
value: c ? r.value : f,
onChange: (m)=>{
c || d.setState("search", m.target.value), n == null || n(m.target.value);
}
});
}), Ce = React.forwardRef((r, o)=>{
let { children: n, label: u = "Suggestions", ...c } = r, d = React.useRef(null), f = React.useRef(null), p = P((m)=>m.selectedItemId), b = K();
return React.useEffect(()=>{
if (f.current && d.current) {
let m = f.current, R = d.current, x, C = new ResizeObserver(()=>{
x = requestAnimationFrame(()=>{
let S = m.offsetHeight;
R.style.setProperty("--cmdk-list-height", S.toFixed(1) + "px");
});
});
return C.observe(m), ()=>{
cancelAnimationFrame(x), C.unobserve(m);
};
}
}, []), React.createElement(Primitive.div, {
ref: composeRefs(d, o),
...c,
"cmdk-list": "",
role: "listbox",
tabIndex: -1,
"aria-activedescendant": p,
"aria-label": u,
id: b.listId
}, B(r, (m)=>React.createElement("div", {
ref: composeRefs(f, b.listInnerRef),
"cmdk-list-sizer": ""
}, m)));
}), xe = React.forwardRef((r, o)=>{
let { open: n, onOpenChange: u, overlayClassName: c, contentClassName: d, container: f, ...p } = r;
return React.createElement(Root, {
open: n,
onOpenChange: u
}, React.createElement(Portal, {
container: f
}, React.createElement(Overlay, {
"cmdk-overlay": "",
className: c
}), React.createElement(Content, {
"aria-label": r.label,
"cmdk-dialog": "",
className: d
}, React.createElement(me, {
ref: o,
...p
}))));
}), Ie = React.forwardRef((r, o)=>P((u)=>u.filtered.count === 0) ? React.createElement(Primitive.div, {
ref: o,
...r,
"cmdk-empty": "",
role: "presentation"
}) : null), Pe = React.forwardRef((r, o)=>{
let { progress: n, children: u, label: c = "Loading...", ...d } = r;
return React.createElement(Primitive.div, {
ref: o,
...d,
"cmdk-loading": "",
role: "progressbar",
"aria-valuenow": n,
"aria-valuemin": 0,
"aria-valuemax": 100,
"aria-label": c
}, B(r, (f)=>React.createElement("div", {
"aria-hidden": true
}, f)));
}), _e = Object.assign(me, {
List: Ce,
Item: he,
Input: Se,
Group: Ee,
Separator: ye,
Dialog: xe,
Empty: Ie,
Loading: Pe
});
function we(r, o) {
let n = r.nextElementSibling;
for(; n;){
if (n.matches(o)) return n;
n = n.nextElementSibling;
}
}
function De(r, o) {
let n = r.previousElementSibling;
for(; n;){
if (n.matches(o)) return n;
n = n.previousElementSibling;
}
}
function pe(r) {
let o = React.useRef(r);
return k(()=>{
o.current = r;
}), o;
}
var k = typeof window == "undefined" ? React.useEffect : React.useLayoutEffect;
function L(r) {
let o = React.useRef();
return o.current === void 0 && (o.current = r()), o;
}
function P(r) {
let o = ee(), n = ()=>r(o.snapshot());
return React.useSyncExternalStore(o.subscribe, n, n);
}
function ve(r, o, n, u = []) {
let c = React.useRef(), d = K();
return k(()=>{
var b;
let f = (()=>{
var m;
for (let R of n){
if (typeof R == "string") return R.trim();
if (typeof R == "object" && "current" in R) return R.current ? (m = R.current.textContent) == null ? void 0 : m.trim() : c.current;
}
})(), p = u.map((m)=>m.trim());
d.value(r, f, p), (b = o.current) == null || b.setAttribute(T, f), c.current = f;
}), c;
}
var ke = ()=>{
let [r, o] = React.useState(), n = L(()=>new Map);
return k(()=>{
n.current.forEach((u)=>u()), n.current = new Map;
}, [
r
]), (u, c)=>{
n.current.set(u, c), o({});
};
};
function Me(r) {
let o = r.type;
return typeof o == "function" ? o(r.props) : "render" in o ? o.render(r.props) : r;
}
function B({ asChild: r, children: o }, n) {
return r && React.isValidElement(o) ? React.cloneElement(Me(o), {
ref: o.ref
}, n(o.props.children)) : n(o);
}
var Te = {
position: "absolute",
width: "1px",
height: "1px",
padding: "0",
margin: "-1px",
overflow: "hidden",
clip: "rect(0, 0, 0, 0)",
whiteSpace: "nowrap",
borderWidth: "0"
};
const Command = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(_e, {
ref: ref,
className: cn("bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md", className),
...props
}));
Command.displayName = _e.displayName;
const CommandDialog = ({ children, ...props })=>{
return /*#__PURE__*/ React.createElement(Dialog, props, /*#__PURE__*/ React.createElement(DialogContent, {
className: "overflow-hidden p-0 shadow-lg"
}, /*#__PURE__*/ React.createElement(Command, {
className: "[&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5"
}, children)));
};
const CommandInput = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement("div", {
className: "flex items-center border-b px-3",
"cmdk-input-wrapper": ""
}, /*#__PURE__*/ React.createElement(Search, {
className: "mr-2 h-4 w-4 shrink-0 opacity-50"
}), /*#__PURE__*/ React.createElement(_e.Input, {
ref: ref,
className: cn("placeholder:text-muted-foreground flex h-9 w-full rounded-md bg-transparent py-3 text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50", className),
...props
})));
CommandInput.displayName = _e.Input.displayName;
const CommandList = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(_e.List, {
ref: ref,
className: cn("max-h-[300px] overflow-x-hidden overflow-y-auto", className),
...props
}));
CommandList.displayName = _e.List.displayName;
const CommandEmpty = /*#__PURE__*/ React.forwardRef((props, ref)=>/*#__PURE__*/ React.createElement(_e.Empty, {
ref: ref,
className: "py-6 px-4 text-center text-sm text-muted-foreground",
...props
}));
CommandEmpty.displayName = _e.Empty.displayName;
const CommandGroup = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(_e.Group, {
ref: ref,
className: cn("text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium", className),
...props
}));
CommandGroup.displayName = _e.Group.displayName;
const CommandSeparator = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(_e.Separator, {
ref: ref,
className: cn("bg-border -mx-1 h-px", className),
...props
}));
CommandSeparator.displayName = _e.Separator.displayName;
const CommandItem = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(_e.Item, {
ref: ref,
className: cn("data-[selected='true']:bg-accent data-[selected=true]:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", className),
...props
}));
CommandItem.displayName = _e.Item.displayName;
const CommandShortcut = ({ className, ...props })=>{
return /*#__PURE__*/ React.createElement("span", {
className: cn("text-muted-foreground ml-auto text-xs tracking-widest", className),
...props
});
};
CommandShortcut.displayName = "CommandShortcut";
export { Command as C, Search as S, CommandDialog as a, CommandInput as b, CommandList as c, CommandEmpty as d, CommandGroup as e, CommandItem as f, CommandShortcut as g, CommandSeparator as h };
//# sourceMappingURL=command-o67hOCgH.mjs.map