@insightphp/elements
Version:
Collection of UI components for Insight.
1,127 lines (1,126 loc) • 383 kB
JavaScript
import { defineComponent as J, openBlock as m, createElementBlock as P, normalizeClass as X, renderSlot as H, createBlock as oe, unref as p, createCommentVNode as M, computed as $, Fragment as te, createTextVNode as Le, toDisplayString as ie, withCtx as G, renderList as Te, cloneVNode as ss, h as He, inject as ke, provide as ot, ref as A, onMounted as Be, watchEffect as sn, nextTick as Ve, onUnmounted as Ht, watch as Ee, toRaw as st, createVNode as we, createElementVNode as C, normalizeStyle as $t, Transition as _t, mergeProps as Ne, useSlots as cn, normalizeProps as nt, withModifiers as lt, withDirectives as qr, vModelCheckbox as cs, reactive as Kr, toRef as vn, isRef as At, createSlots as Xe, guardReactiveProps as ct, Teleport as fs, withKeys as me, resolveDynamicComponent as wn, vShow as ds, onBeforeUpdate as ps, getCurrentScope as ms, onScopeDispose as vs, vModelRadio as ys, vModelText as hs } from "vue";
import { Portal as Lt, registerComponents as bs } from "@insightphp/inertia-view";
import { Link as gs } from "@inertiajs/inertia-vue3";
const ws = /* @__PURE__ */ J({
__name: "Button",
props: {
content: null,
type: null
},
setup(e) {
return (t, n) => (m(), P("button", {
class: X(["btn", [e.type ? [e.type] : []]])
}, [
H(t.$slots, "default", {}, () => [
e.content ? (m(), oe(p(Lt), {
key: 0,
component: e.content
}, null, 8, ["component"])) : M("", !0)
])
], 2));
}
}), _s = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: ws
}, Symbol.toStringTag, { value: "Module" })), Os = ["href"], Ps = /* @__PURE__ */ J({
__name: "Link",
props: {
title: null,
location: null,
method: null,
as: null,
external: { type: Boolean, default: !1 },
isActive: { type: Boolean, default: !1 },
content: null,
asButton: { type: Boolean },
buttonType: { default: "primary" },
data: null,
preserveScroll: { type: Boolean, default: !1 },
additionalData: null
},
setup(e) {
const t = e, n = $(() => {
let r = {};
return t.data && (r = { ...r, ...t.data }), t.additionalData && (r = { ...r, ...t.additionalData }), Object.keys(r).length > 0 ? r : void 0;
});
return (r, a) => e.external ? (m(), P("a", {
key: 0,
href: e.location,
class: X({ btn: e.asButton, [e.buttonType]: e.asButton })
}, [
H(r.$slots, "default", {}, () => [
e.content ? (m(), oe(p(Lt), {
key: 0,
component: e.content
}, null, 8, ["component"])) : (m(), P(te, { key: 1 }, [
Le(ie(e.title), 1)
], 64))
])
], 10, Os)) : (m(), oe(p(gs), {
key: 1,
href: e.location,
as: t.as || void 0,
method: e.method || void 0,
data: p(n),
"preserve-scroll": e.preserveScroll,
class: X({ btn: e.asButton, [e.buttonType]: e.asButton })
}, {
default: G(() => [
e.content ? (m(), oe(p(Lt), {
key: 0,
component: e.content
}, null, 8, ["component"])) : (m(), P(te, { key: 1 }, [
Le(ie(e.title), 1)
], 64))
]),
_: 1
}, 8, ["href", "as", "method", "data", "preserve-scroll", "class"]));
}
}), ks = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: Ps
}, Symbol.toStringTag, { value: "Module" })), Ss = /* @__PURE__ */ J({
__name: "Pressable",
props: {
content: null,
type: { default: "primary" }
},
setup(e) {
return (t, n) => (m(), P("div", {
class: X(["inline-flex text-gray-600 rounded-md transition-colors duration-300 p-2", [`hover:bg-${e.type}-50`, `hover:text-${e.type}-600`]])
}, [
e.content ? (m(), oe(p(Lt), {
key: 0,
component: e.content
}, null, 8, ["component"])) : H(t.$slots, "default", { key: 1 })
], 2));
}
}), $s = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: Ss
}, Symbol.toStringTag, { value: "Module" })), xs = /* @__PURE__ */ J({
__name: "Stack",
props: {
orientation: null,
items: null,
gap: null,
align: null
},
setup(e) {
const t = e, n = $(() => t.orientation === "horizontal"), r = $(() => t.orientation === "vertical");
return (a, o) => (m(), P("div", {
class: X(["inline-flex", [{
"flex-row": p(n),
"flex-col": p(r),
"items-center": e.align == "center",
"items-start": e.align == "top",
"items-end": e.align == "bottom"
}, e.gap]])
}, [
(m(!0), P(te, null, Te(e.items, (l) => (m(), oe(p(Lt), { component: l }, null, 8, ["component"]))), 256)),
H(a.$slots, "default")
], 2));
}
}), Ts = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: xs
}, Symbol.toStringTag, { value: "Module" })), Ds = {
key: 0,
class: "input-error"
}, Xr = /* @__PURE__ */ J({
__name: "InputError",
props: {
error: null
},
setup(e) {
return (t, n) => e.error ? (m(), P("p", Ds, ie(e.error), 1)) : M("", !0);
}
});
function ft(e, t, ...n) {
if (e in t) {
let a = t[e];
return typeof a == "function" ? a(...n) : a;
}
let r = new Error(`Tried to handle "${e}" but there is no handler defined. Only defined handlers are: ${Object.keys(t).map((a) => `"${a}"`).join(", ")}.`);
throw Error.captureStackTrace && Error.captureStackTrace(r, ft), r;
}
var un = ((e) => (e[e.None = 0] = "None", e[e.RenderStrategy = 1] = "RenderStrategy", e[e.Static = 2] = "Static", e))(un || {}), Rs = ((e) => (e[e.Unmount = 0] = "Unmount", e[e.Hidden = 1] = "Hidden", e))(Rs || {});
function Qe({ visible: e = !0, features: t = 0, ourProps: n, theirProps: r, ...a }) {
var o;
let l = Ms(r, n), i = Object.assign(a, { props: l });
if (e || t & 2 && l.static)
return ia(i);
if (t & 1) {
let u = (o = l.unmount) == null || o ? 0 : 1;
return ft(u, { [0]() {
return null;
}, [1]() {
return ia({ ...a, props: { ...l, hidden: !0, style: { display: "none" } } });
} });
}
return ia(i);
}
function ia({ props: e, attrs: t, slots: n, slot: r, name: a }) {
var o;
let { as: l, ...i } = Qr(e, ["unmount", "static"]), u = (o = n.default) == null ? void 0 : o.call(n, r), f = {};
if (r) {
let d = !1, s = [];
for (let [y, g] of Object.entries(r))
typeof g == "boolean" && (d = !0), g === !0 && s.push(y);
d && (f["data-headlessui-state"] = s.join(" "));
}
if (l === "template") {
if (u = Hi(u != null ? u : []), Object.keys(i).length > 0 || Object.keys(t).length > 0) {
let [d, ...s] = u != null ? u : [];
if (!Cs(d) || s.length > 0)
throw new Error(['Passing props on "template"!', "", `The current component <${a} /> is rendering a "template".`, "However we need to passthrough the following props:", Object.keys(i).concat(Object.keys(t)).sort((y, g) => y.localeCompare(g)).map((y) => ` - ${y}`).join(`
`), "", "You can apply a few solutions:", ['Add an `as="..."` prop, to ensure that we render an actual element instead of a "template".', "Render a single element as the child so that we can forward the props onto that element."].map((y) => ` - ${y}`).join(`
`)].join(`
`));
return ss(d, Object.assign({}, i, f));
}
return Array.isArray(u) && u.length === 1 ? u[0] : u;
}
return He(l, Object.assign({}, i, f), u);
}
function Hi(e) {
return e.flatMap((t) => t.type === te ? Hi(t.children) : [t]);
}
function Ms(...e) {
if (e.length === 0)
return {};
if (e.length === 1)
return e[0];
let t = {}, n = {};
for (let r of e)
for (let a in r)
a.startsWith("on") && typeof r[a] == "function" ? (n[a] != null || (n[a] = []), n[a].push(r[a])) : t[a] = r[a];
if (t.disabled || t["aria-disabled"])
return Object.assign(t, Object.fromEntries(Object.keys(n).map((r) => [r, void 0])));
for (let r in n)
Object.assign(t, { [r](a, ...o) {
let l = n[r];
for (let i of l) {
if (a instanceof Event && a.defaultPrevented)
return;
i(a, ...o);
}
} });
return t;
}
function Ui(e) {
let t = Object.assign({}, e);
for (let n in t)
t[n] === void 0 && delete t[n];
return t;
}
function Qr(e, t = []) {
let n = Object.assign({}, e);
for (let r of t)
r in n && delete n[r];
return n;
}
function Cs(e) {
return e == null ? !1 : typeof e.type == "string" || typeof e.type == "object" || typeof e.type == "function";
}
let Ns = 0;
function Is() {
return ++Ns;
}
function gt() {
return Is();
}
var de = ((e) => (e.Space = " ", e.Enter = "Enter", e.Escape = "Escape", e.Backspace = "Backspace", e.Delete = "Delete", e.ArrowLeft = "ArrowLeft", e.ArrowUp = "ArrowUp", e.ArrowRight = "ArrowRight", e.ArrowDown = "ArrowDown", e.Home = "Home", e.End = "End", e.PageUp = "PageUp", e.PageDown = "PageDown", e.Tab = "Tab", e))(de || {});
function As(e) {
throw new Error("Unexpected object: " + e);
}
var Pe = ((e) => (e[e.First = 0] = "First", e[e.Previous = 1] = "Previous", e[e.Next = 2] = "Next", e[e.Last = 3] = "Last", e[e.Specific = 4] = "Specific", e[e.Nothing = 5] = "Nothing", e))(Pe || {});
function Wi(e, t) {
let n = t.resolveItems();
if (n.length <= 0)
return null;
let r = t.resolveActiveIndex(), a = r != null ? r : -1, o = (() => {
switch (e.focus) {
case 0:
return n.findIndex((l) => !t.resolveDisabled(l));
case 1: {
let l = n.slice().reverse().findIndex((i, u, f) => a !== -1 && f.length - u - 1 >= a ? !1 : !t.resolveDisabled(i));
return l === -1 ? l : n.length - 1 - l;
}
case 2:
return n.findIndex((l, i) => i <= a ? !1 : !t.resolveDisabled(l));
case 3: {
let l = n.slice().reverse().findIndex((i) => !t.resolveDisabled(i));
return l === -1 ? l : n.length - 1 - l;
}
case 4:
return n.findIndex((l) => t.resolveId(l) === e.id);
case 5:
return null;
default:
As(e);
}
})();
return o === -1 ? r : o;
}
function fe(e) {
var t;
return e == null || e.value == null ? null : (t = e.value.$el) != null ? t : e.value;
}
let Fi = Symbol("Context");
var Yt = ((e) => (e[e.Open = 0] = "Open", e[e.Closed = 1] = "Closed", e))(Yt || {});
function zi() {
return ke(Fi, null);
}
function Gi(e) {
ot(Fi, e);
}
function yl(e, t) {
if (e)
return e;
let n = t != null ? t : "button";
if (typeof n == "string" && n.toLowerCase() === "button")
return "button";
}
function Ho(e, t) {
let n = A(yl(e.value.type, e.value.as));
return Be(() => {
n.value = yl(e.value.type, e.value.as);
}), sn(() => {
var r;
n.value || !fe(t) || fe(t) instanceof HTMLButtonElement && !((r = fe(t)) != null && r.hasAttribute("type")) && (n.value = "button");
}), n;
}
const qi = typeof window > "u" || typeof document > "u";
function Uo(e) {
if (qi)
return null;
if (e instanceof Node)
return e.ownerDocument;
if (e != null && e.hasOwnProperty("value")) {
let t = fe(e);
if (t)
return t.ownerDocument;
}
return document;
}
function Es({ container: e, accept: t, walk: n, enabled: r }) {
sn(() => {
let a = e.value;
if (!a || r !== void 0 && !r.value)
return;
let o = Uo(e);
if (!o)
return;
let l = Object.assign((u) => t(u), { acceptNode: t }), i = o.createTreeWalker(a, NodeFilter.SHOW_ELEMENT, l, !1);
for (; i.nextNode(); )
n(i.currentNode);
});
}
let ka = ["[contentEditable=true]", "[tabindex]", "a[href]", "area[href]", "button:not([disabled])", "iframe", "input:not([disabled])", "select:not([disabled])", "textarea:not([disabled])"].map((e) => `${e}:not([tabindex='-1'])`).join(",");
var Sa = ((e) => (e[e.First = 1] = "First", e[e.Previous = 2] = "Previous", e[e.Next = 4] = "Next", e[e.Last = 8] = "Last", e[e.WrapAround = 16] = "WrapAround", e[e.NoScroll = 32] = "NoScroll", e))(Sa || {}), Bs = ((e) => (e[e.Error = 0] = "Error", e[e.Overflow = 1] = "Overflow", e[e.Success = 2] = "Success", e[e.Underflow = 3] = "Underflow", e))(Bs || {}), Vs = ((e) => (e[e.Previous = -1] = "Previous", e[e.Next = 1] = "Next", e))(Vs || {});
function Ki(e = document.body) {
return e == null ? [] : Array.from(e.querySelectorAll(ka));
}
var Zr = ((e) => (e[e.Strict = 0] = "Strict", e[e.Loose = 1] = "Loose", e))(Zr || {});
function Jr(e, t = 0) {
var n;
return e === ((n = Uo(e)) == null ? void 0 : n.body) ? !1 : ft(t, { [0]() {
return e.matches(ka);
}, [1]() {
let r = e;
for (; r !== null; ) {
if (r.matches(ka))
return !0;
r = r.parentElement;
}
return !1;
} });
}
function Xi(e) {
let t = Uo(e);
Ve(() => {
t && !Jr(t.activeElement, 0) && Ls(e);
});
}
function Ls(e) {
e == null || e.focus({ preventScroll: !0 });
}
let Ys = ["textarea", "input"].join(",");
function js(e) {
var t, n;
return (n = (t = e == null ? void 0 : e.matches) == null ? void 0 : t.call(e, Ys)) != null ? n : !1;
}
function Wo(e, t = (n) => n) {
return e.slice().sort((n, r) => {
let a = t(n), o = t(r);
if (a === null || o === null)
return 0;
let l = a.compareDocumentPosition(o);
return l & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : l & Node.DOCUMENT_POSITION_PRECEDING ? 1 : 0;
});
}
function Hs(e, t) {
return Us(Ki(), t, !0, e);
}
function Us(e, t, n = !0, r = null) {
var a;
let o = (a = Array.isArray(e) ? e.length > 0 ? e[0].ownerDocument : document : e == null ? void 0 : e.ownerDocument) != null ? a : document, l = Array.isArray(e) ? n ? Wo(e) : e : Ki(e);
r = r != null ? r : o.activeElement;
let i = (() => {
if (t & 5)
return 1;
if (t & 10)
return -1;
throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
})(), u = (() => {
if (t & 1)
return 0;
if (t & 2)
return Math.max(0, l.indexOf(r)) - 1;
if (t & 4)
return Math.max(0, l.indexOf(r)) + 1;
if (t & 8)
return l.length - 1;
throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
})(), f = t & 32 ? { preventScroll: !0 } : {}, d = 0, s = l.length, y;
do {
if (d >= s || d + s <= 0)
return 0;
let g = u + d;
if (t & 16)
g = (g + s) % s;
else {
if (g < 0)
return 3;
if (g >= s)
return 1;
}
y = l[g], y == null || y.focus(f), d += i;
} while (y !== o.activeElement);
return t & 6 && js(y) && y.select(), y.hasAttribute("tabindex") || y.setAttribute("tabindex", "0"), 2;
}
function ua(e, t, n) {
qi || sn((r) => {
document.addEventListener(e, t, n), r(() => document.removeEventListener(e, t, n));
});
}
function Qi(e, t, n = $(() => !0)) {
function r(o, l) {
if (!n.value || o.defaultPrevented)
return;
let i = l(o);
if (i === null || !i.getRootNode().contains(i))
return;
let u = function f(d) {
return typeof d == "function" ? f(d()) : Array.isArray(d) || d instanceof Set ? d : [d];
}(e);
for (let f of u) {
if (f === null)
continue;
let d = f instanceof HTMLElement ? f : fe(f);
if (d != null && d.contains(i))
return;
}
return !Jr(i, Zr.Loose) && i.tabIndex !== -1 && o.preventDefault(), t(o, i);
}
let a = A(null);
ua("mousedown", (o) => {
var l, i;
n.value && (a.value = ((i = (l = o.composedPath) == null ? void 0 : l.call(o)) == null ? void 0 : i[0]) || o.target);
}, !0), ua("click", (o) => {
!a.value || (r(o, () => a.value), a.value = null);
}, !0), ua("blur", (o) => r(o, () => window.document.activeElement instanceof HTMLIFrameElement ? window.document.activeElement : null), !0);
}
var Fo = ((e) => (e[e.None = 1] = "None", e[e.Focusable = 2] = "Focusable", e[e.Hidden = 4] = "Hidden", e))(Fo || {});
let Zi = J({ name: "Hidden", props: { as: { type: [Object, String], default: "div" }, features: { type: Number, default: 1 } }, setup(e, { slots: t, attrs: n }) {
return () => {
let { features: r, ...a } = e, o = { "aria-hidden": (r & 2) === 2 ? !0 : void 0, style: { position: "fixed", top: 1, left: 1, width: 1, height: 0, padding: 0, margin: -1, overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", borderWidth: "0", ...(r & 4) === 4 && (r & 2) !== 2 && { display: "none" } } };
return Qe({ ourProps: o, theirProps: a, slot: {}, attrs: n, slots: t, name: "Hidden" });
};
} });
function Ji(e = {}, t = null, n = []) {
for (let [r, a] of Object.entries(e))
tu(n, eu(t, r), a);
return n;
}
function eu(e, t) {
return e ? e + "[" + t + "]" : t;
}
function tu(e, t, n) {
if (Array.isArray(n))
for (let [r, a] of n.entries())
tu(e, eu(t, r.toString()), a);
else
n instanceof Date ? e.push([t, n.toISOString()]) : typeof n == "boolean" ? e.push([t, n ? "1" : "0"]) : typeof n == "string" ? e.push([t, n]) : typeof n == "number" ? e.push([t, `${n}`]) : n == null ? e.push([t, ""]) : Ji(n, t, e);
}
function Ws(e) {
var t;
let n = (t = e == null ? void 0 : e.form) != null ? t : e.closest("form");
if (n) {
for (let r of n.elements)
if (r.tagName === "INPUT" && r.type === "submit" || r.tagName === "BUTTON" && r.type === "submit" || r.nodeName === "INPUT" && r.type === "image") {
r.click();
return;
}
}
}
function nu(e, t, n) {
let r = A(n == null ? void 0 : n.value), a = $(() => e.value !== void 0);
return [$(() => a.value ? e.value : r.value), function(o) {
return a.value || (r.value = o), t == null ? void 0 : t(o);
}];
}
let ru = Symbol("DescriptionContext");
function Fs() {
let e = ke(ru, null);
if (e === null)
throw new Error("Missing parent");
return e;
}
function zs({ slot: e = A({}), name: t = "Description", props: n = {} } = {}) {
let r = A([]);
function a(o) {
return r.value.push(o), () => {
let l = r.value.indexOf(o);
l !== -1 && r.value.splice(l, 1);
};
}
return ot(ru, { register: a, slot: e, name: t, props: n }), $(() => r.value.length > 0 ? r.value.join(" ") : void 0);
}
let hg = J({ name: "Description", props: { as: { type: [Object, String], default: "p" } }, setup(e, { attrs: t, slots: n }) {
let r = Fs(), a = `headlessui-description-${gt()}`;
return Be(() => Ht(r.register(a))), () => {
let { name: o = "Description", slot: l = A({}), props: i = {} } = r, u = e, f = { ...Object.entries(i).reduce((d, [s, y]) => Object.assign(d, { [s]: p(y) }), {}), id: a };
return Qe({ ourProps: f, theirProps: u, slot: l.value, attrs: t, slots: n, name: o });
};
} });
function Gs(e, t) {
return e === t;
}
var qs = ((e) => (e[e.Open = 0] = "Open", e[e.Closed = 1] = "Closed", e))(qs || {}), Ks = ((e) => (e[e.Single = 0] = "Single", e[e.Multi = 1] = "Multi", e))(Ks || {}), Xs = ((e) => (e[e.Pointer = 0] = "Pointer", e[e.Other = 1] = "Other", e))(Xs || {});
function Qs(e) {
requestAnimationFrame(() => requestAnimationFrame(e));
}
let au = Symbol("ListboxContext");
function fn(e) {
let t = ke(au, null);
if (t === null) {
let n = new Error(`<${e} /> is missing a parent <Listbox /> component.`);
throw Error.captureStackTrace && Error.captureStackTrace(n, fn), n;
}
return t;
}
let ou = J({ name: "Listbox", emits: { "update:modelValue": (e) => !0 }, props: { as: { type: [Object, String], default: "template" }, disabled: { type: [Boolean], default: !1 }, by: { type: [String, Function], default: () => Gs }, horizontal: { type: [Boolean], default: !1 }, modelValue: { type: [Object, String, Number, Boolean], default: void 0 }, defaultValue: { type: [Object, String, Number, Boolean], default: void 0 }, name: { type: String, optional: !0 }, multiple: { type: [Boolean], default: !1 } }, inheritAttrs: !1, setup(e, { slots: t, attrs: n, emit: r }) {
let a = A(1), o = A(null), l = A(null), i = A(null), u = A([]), f = A(""), d = A(null), s = A(1);
function y(c = (w) => w) {
let w = d.value !== null ? u.value[d.value] : null, V = Wo(c(u.value.slice()), (v) => fe(v.dataRef.domRef)), L = w ? V.indexOf(w) : null;
return L === -1 && (L = null), { options: V, activeOptionIndex: L };
}
let g = $(() => e.multiple ? 1 : 0), [S, x] = nu($(() => e.modelValue), (c) => r("update:modelValue", c), $(() => e.defaultValue)), D = { listboxState: a, value: S, mode: g, compare(c, w) {
if (typeof e.by == "string") {
let V = e.by;
return (c == null ? void 0 : c[V]) === (w == null ? void 0 : w[V]);
}
return e.by(c, w);
}, orientation: $(() => e.horizontal ? "horizontal" : "vertical"), labelRef: o, buttonRef: l, optionsRef: i, disabled: $(() => e.disabled), options: u, searchQuery: f, activeOptionIndex: d, activationTrigger: s, closeListbox() {
e.disabled || a.value !== 1 && (a.value = 1, d.value = null);
}, openListbox() {
e.disabled || a.value !== 0 && (a.value = 0);
}, goToOption(c, w, V) {
if (e.disabled || a.value === 1)
return;
let L = y(), v = Wi(c === Pe.Specific ? { focus: Pe.Specific, id: w } : { focus: c }, { resolveItems: () => L.options, resolveActiveIndex: () => L.activeOptionIndex, resolveId: (T) => T.id, resolveDisabled: (T) => T.dataRef.disabled });
f.value = "", d.value = v, s.value = V != null ? V : 1, u.value = L.options;
}, search(c) {
if (e.disabled || a.value === 1)
return;
let w = f.value !== "" ? 0 : 1;
f.value += c.toLowerCase();
let V = (d.value !== null ? u.value.slice(d.value + w).concat(u.value.slice(0, d.value + w)) : u.value).find((v) => v.dataRef.textValue.startsWith(f.value) && !v.dataRef.disabled), L = V ? u.value.indexOf(V) : -1;
L === -1 || L === d.value || (d.value = L, s.value = 1);
}, clearSearch() {
e.disabled || a.value !== 1 && f.value !== "" && (f.value = "");
}, registerOption(c, w) {
let V = y((L) => [...L, { id: c, dataRef: w }]);
u.value = V.options, d.value = V.activeOptionIndex;
}, unregisterOption(c) {
let w = y((V) => {
let L = V.findIndex((v) => v.id === c);
return L !== -1 && V.splice(L, 1), V;
});
u.value = w.options, d.value = w.activeOptionIndex, s.value = 1;
}, select(c) {
e.disabled || x(ft(g.value, { [0]: () => c, [1]: () => {
let w = st(D.value.value).slice(), V = st(c), L = w.findIndex((v) => D.compare(V, st(v)));
return L === -1 ? w.push(V) : w.splice(L, 1), w;
} }));
} };
return Qi([l, i], (c, w) => {
var V;
D.closeListbox(), Jr(w, Zr.Loose) || (c.preventDefault(), (V = fe(l)) == null || V.focus());
}, $(() => a.value === 0)), ot(au, D), Gi($(() => ft(a.value, { [0]: Yt.Open, [1]: Yt.Closed }))), () => {
let { name: c, modelValue: w, disabled: V, ...L } = e, v = { open: a.value === 0, disabled: V, value: S.value };
return He(te, [...c != null && S.value != null ? Ji({ [c]: S.value }).map(([T, j]) => He(Zi, Ui({ features: Fo.Hidden, key: T, as: "input", type: "hidden", hidden: !0, readOnly: !0, name: T, value: j }))) : [], Qe({ ourProps: {}, theirProps: { ...n, ...Qr(L, ["defaultValue", "onUpdate:modelValue", "horizontal", "multiple", "by"]) }, slot: v, slots: t, attrs: n, name: "Listbox" })]);
};
} });
J({ name: "ListboxLabel", props: { as: { type: [Object, String], default: "label" } }, setup(e, { attrs: t, slots: n }) {
let r = fn("ListboxLabel"), a = `headlessui-listbox-label-${gt()}`;
function o() {
var l;
(l = fe(r.buttonRef)) == null || l.focus({ preventScroll: !0 });
}
return () => {
let l = { open: r.listboxState.value === 0, disabled: r.disabled.value }, i = { id: a, ref: r.labelRef, onClick: o };
return Qe({ ourProps: i, theirProps: e, slot: l, attrs: t, slots: n, name: "ListboxLabel" });
};
} });
let lu = J({ name: "ListboxButton", props: { as: { type: [Object, String], default: "button" } }, setup(e, { attrs: t, slots: n, expose: r }) {
let a = fn("ListboxButton"), o = `headlessui-listbox-button-${gt()}`;
r({ el: a.buttonRef, $el: a.buttonRef });
function l(d) {
switch (d.key) {
case de.Space:
case de.Enter:
case de.ArrowDown:
d.preventDefault(), a.openListbox(), Ve(() => {
var s;
(s = fe(a.optionsRef)) == null || s.focus({ preventScroll: !0 }), a.value.value || a.goToOption(Pe.First);
});
break;
case de.ArrowUp:
d.preventDefault(), a.openListbox(), Ve(() => {
var s;
(s = fe(a.optionsRef)) == null || s.focus({ preventScroll: !0 }), a.value.value || a.goToOption(Pe.Last);
});
break;
}
}
function i(d) {
switch (d.key) {
case de.Space:
d.preventDefault();
break;
}
}
function u(d) {
a.disabled.value || (a.listboxState.value === 0 ? (a.closeListbox(), Ve(() => {
var s;
return (s = fe(a.buttonRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
})) : (d.preventDefault(), a.openListbox(), Qs(() => {
var s;
return (s = fe(a.optionsRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
})));
}
let f = Ho($(() => ({ as: e.as, type: t.type })), a.buttonRef);
return () => {
var d, s;
let y = { open: a.listboxState.value === 0, disabled: a.disabled.value, value: a.value.value }, g = { ref: a.buttonRef, id: o, type: f.value, "aria-haspopup": !0, "aria-controls": (d = fe(a.optionsRef)) == null ? void 0 : d.id, "aria-expanded": a.disabled.value ? void 0 : a.listboxState.value === 0, "aria-labelledby": a.labelRef.value ? [(s = fe(a.labelRef)) == null ? void 0 : s.id, o].join(" ") : void 0, disabled: a.disabled.value === !0 ? !0 : void 0, onKeydown: l, onKeyup: i, onClick: u };
return Qe({ ourProps: g, theirProps: e, slot: y, attrs: t, slots: n, name: "ListboxButton" });
};
} }), iu = J({ name: "ListboxOptions", props: { as: { type: [Object, String], default: "ul" }, static: { type: Boolean, default: !1 }, unmount: { type: Boolean, default: !0 } }, setup(e, { attrs: t, slots: n, expose: r }) {
let a = fn("ListboxOptions"), o = `headlessui-listbox-options-${gt()}`, l = A(null);
r({ el: a.optionsRef, $el: a.optionsRef });
function i(d) {
switch (l.value && clearTimeout(l.value), d.key) {
case de.Space:
if (a.searchQuery.value !== "")
return d.preventDefault(), d.stopPropagation(), a.search(d.key);
case de.Enter:
if (d.preventDefault(), d.stopPropagation(), a.activeOptionIndex.value !== null) {
let s = a.options.value[a.activeOptionIndex.value];
a.select(s.dataRef.value);
}
a.mode.value === 0 && (a.closeListbox(), Ve(() => {
var s;
return (s = fe(a.buttonRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
}));
break;
case ft(a.orientation.value, { vertical: de.ArrowDown, horizontal: de.ArrowRight }):
return d.preventDefault(), d.stopPropagation(), a.goToOption(Pe.Next);
case ft(a.orientation.value, { vertical: de.ArrowUp, horizontal: de.ArrowLeft }):
return d.preventDefault(), d.stopPropagation(), a.goToOption(Pe.Previous);
case de.Home:
case de.PageUp:
return d.preventDefault(), d.stopPropagation(), a.goToOption(Pe.First);
case de.End:
case de.PageDown:
return d.preventDefault(), d.stopPropagation(), a.goToOption(Pe.Last);
case de.Escape:
d.preventDefault(), d.stopPropagation(), a.closeListbox(), Ve(() => {
var s;
return (s = fe(a.buttonRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
});
break;
case de.Tab:
d.preventDefault(), d.stopPropagation();
break;
default:
d.key.length === 1 && (a.search(d.key), l.value = setTimeout(() => a.clearSearch(), 350));
break;
}
}
let u = zi(), f = $(() => u !== null ? u.value === Yt.Open : a.listboxState.value === 0);
return () => {
var d, s, y, g;
let S = { open: a.listboxState.value === 0 }, x = { "aria-activedescendant": a.activeOptionIndex.value === null || (d = a.options.value[a.activeOptionIndex.value]) == null ? void 0 : d.id, "aria-multiselectable": a.mode.value === 1 ? !0 : void 0, "aria-labelledby": (g = (s = fe(a.labelRef)) == null ? void 0 : s.id) != null ? g : (y = fe(a.buttonRef)) == null ? void 0 : y.id, "aria-orientation": a.orientation.value, id: o, onKeydown: i, role: "listbox", tabIndex: 0, ref: a.optionsRef };
return Qe({ ourProps: x, theirProps: e, slot: S, attrs: t, slots: n, features: un.RenderStrategy | un.Static, visible: f.value, name: "ListboxOptions" });
};
} }), _n = J({ name: "ListboxOption", props: { as: { type: [Object, String], default: "li" }, value: { type: [Object, String, Number, Boolean] }, disabled: { type: Boolean, default: !1 } }, setup(e, { slots: t, attrs: n, expose: r }) {
let a = fn("ListboxOption"), o = `headlessui-listbox-option-${gt()}`, l = A(null);
r({ el: l, $el: l });
let i = $(() => a.activeOptionIndex.value !== null ? a.options.value[a.activeOptionIndex.value].id === o : !1), u = $(() => ft(a.mode.value, { [0]: () => a.compare(st(a.value.value), st(e.value)), [1]: () => st(a.value.value).some((x) => a.compare(st(x), st(e.value))) })), f = $(() => ft(a.mode.value, { [1]: () => {
var x;
let D = st(a.value.value);
return ((x = a.options.value.find((c) => D.some((w) => a.compare(st(w), st(c.dataRef.value))))) == null ? void 0 : x.id) === o;
}, [0]: () => u.value })), d = $(() => ({ disabled: e.disabled, value: e.value, textValue: "", domRef: l }));
Be(() => {
var x, D;
let c = (D = (x = fe(l)) == null ? void 0 : x.textContent) == null ? void 0 : D.toLowerCase().trim();
c !== void 0 && (d.value.textValue = c);
}), Be(() => a.registerOption(o, d)), Ht(() => a.unregisterOption(o)), Be(() => {
Ee([a.listboxState, u], () => {
a.listboxState.value === 0 && (!u.value || ft(a.mode.value, { [1]: () => {
f.value && a.goToOption(Pe.Specific, o);
}, [0]: () => {
a.goToOption(Pe.Specific, o);
} }));
}, { immediate: !0 });
}), sn(() => {
a.listboxState.value === 0 && (!i.value || a.activationTrigger.value !== 0 && Ve(() => {
var x, D;
return (D = (x = fe(l)) == null ? void 0 : x.scrollIntoView) == null ? void 0 : D.call(x, { block: "nearest" });
}));
});
function s(x) {
if (e.disabled)
return x.preventDefault();
a.select(e.value), a.mode.value === 0 && (a.closeListbox(), Ve(() => {
var D;
return (D = fe(a.buttonRef)) == null ? void 0 : D.focus({ preventScroll: !0 });
}));
}
function y() {
if (e.disabled)
return a.goToOption(Pe.Nothing);
a.goToOption(Pe.Specific, o);
}
function g() {
e.disabled || i.value || a.goToOption(Pe.Specific, o, 0);
}
function S() {
e.disabled || !i.value || a.goToOption(Pe.Nothing);
}
return () => {
let { disabled: x } = e, D = { active: i.value, selected: u.value, disabled: x }, c = { id: o, ref: l, role: "option", tabIndex: x === !0 ? void 0 : -1, "aria-disabled": x === !0 ? !0 : void 0, "aria-selected": u.value, disabled: void 0, onClick: s, onFocus: y, onPointermove: g, onMousemove: g, onPointerleave: S, onMouseleave: S };
return Qe({ ourProps: c, theirProps: Qr(e, ["value", "disabled"]), slot: D, attrs: n, slots: t, name: "ListboxOption" });
};
} });
var Zs = ((e) => (e[e.Open = 0] = "Open", e[e.Closed = 1] = "Closed", e))(Zs || {}), Js = ((e) => (e[e.Pointer = 0] = "Pointer", e[e.Other = 1] = "Other", e))(Js || {});
function ec(e) {
requestAnimationFrame(() => requestAnimationFrame(e));
}
let uu = Symbol("MenuContext");
function ea(e) {
let t = ke(uu, null);
if (t === null) {
let n = new Error(`<${e} /> is missing a parent <Menu /> component.`);
throw Error.captureStackTrace && Error.captureStackTrace(n, ea), n;
}
return t;
}
let tc = J({ name: "Menu", props: { as: { type: [Object, String], default: "template" } }, setup(e, { slots: t, attrs: n }) {
let r = A(1), a = A(null), o = A(null), l = A([]), i = A(""), u = A(null), f = A(1);
function d(y = (g) => g) {
let g = u.value !== null ? l.value[u.value] : null, S = Wo(y(l.value.slice()), (D) => fe(D.dataRef.domRef)), x = g ? S.indexOf(g) : null;
return x === -1 && (x = null), { items: S, activeItemIndex: x };
}
let s = { menuState: r, buttonRef: a, itemsRef: o, items: l, searchQuery: i, activeItemIndex: u, activationTrigger: f, closeMenu: () => {
r.value = 1, u.value = null;
}, openMenu: () => r.value = 0, goToItem(y, g, S) {
let x = d(), D = Wi(y === Pe.Specific ? { focus: Pe.Specific, id: g } : { focus: y }, { resolveItems: () => x.items, resolveActiveIndex: () => x.activeItemIndex, resolveId: (c) => c.id, resolveDisabled: (c) => c.dataRef.disabled });
i.value = "", u.value = D, f.value = S != null ? S : 1, l.value = x.items;
}, search(y) {
let g = i.value !== "" ? 0 : 1;
i.value += y.toLowerCase();
let S = (u.value !== null ? l.value.slice(u.value + g).concat(l.value.slice(0, u.value + g)) : l.value).find((D) => D.dataRef.textValue.startsWith(i.value) && !D.dataRef.disabled), x = S ? l.value.indexOf(S) : -1;
x === -1 || x === u.value || (u.value = x, f.value = 1);
}, clearSearch() {
i.value = "";
}, registerItem(y, g) {
let S = d((x) => [...x, { id: y, dataRef: g }]);
l.value = S.items, u.value = S.activeItemIndex, f.value = 1;
}, unregisterItem(y) {
let g = d((S) => {
let x = S.findIndex((D) => D.id === y);
return x !== -1 && S.splice(x, 1), S;
});
l.value = g.items, u.value = g.activeItemIndex, f.value = 1;
} };
return Qi([a, o], (y, g) => {
var S;
s.closeMenu(), Jr(g, Zr.Loose) || (y.preventDefault(), (S = fe(a)) == null || S.focus());
}, $(() => r.value === 0)), ot(uu, s), Gi($(() => ft(r.value, { [0]: Yt.Open, [1]: Yt.Closed }))), () => {
let y = { open: r.value === 0, close: s.closeMenu };
return Qe({ ourProps: {}, theirProps: e, slot: y, slots: t, attrs: n, name: "Menu" });
};
} }), nc = J({ name: "MenuButton", props: { disabled: { type: Boolean, default: !1 }, as: { type: [Object, String], default: "button" } }, setup(e, { attrs: t, slots: n, expose: r }) {
let a = ea("MenuButton"), o = `headlessui-menu-button-${gt()}`;
r({ el: a.buttonRef, $el: a.buttonRef });
function l(d) {
switch (d.key) {
case de.Space:
case de.Enter:
case de.ArrowDown:
d.preventDefault(), d.stopPropagation(), a.openMenu(), Ve(() => {
var s;
(s = fe(a.itemsRef)) == null || s.focus({ preventScroll: !0 }), a.goToItem(Pe.First);
});
break;
case de.ArrowUp:
d.preventDefault(), d.stopPropagation(), a.openMenu(), Ve(() => {
var s;
(s = fe(a.itemsRef)) == null || s.focus({ preventScroll: !0 }), a.goToItem(Pe.Last);
});
break;
}
}
function i(d) {
switch (d.key) {
case de.Space:
d.preventDefault();
break;
}
}
function u(d) {
e.disabled || (a.menuState.value === 0 ? (a.closeMenu(), Ve(() => {
var s;
return (s = fe(a.buttonRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
})) : (d.preventDefault(), a.openMenu(), ec(() => {
var s;
return (s = fe(a.itemsRef)) == null ? void 0 : s.focus({ preventScroll: !0 });
})));
}
let f = Ho($(() => ({ as: e.as, type: t.type })), a.buttonRef);
return () => {
var d;
let s = { open: a.menuState.value === 0 }, y = { ref: a.buttonRef, id: o, type: f.value, "aria-haspopup": !0, "aria-controls": (d = fe(a.itemsRef)) == null ? void 0 : d.id, "aria-expanded": e.disabled ? void 0 : a.menuState.value === 0, onKeydown: l, onKeyup: i, onClick: u };
return Qe({ ourProps: y, theirProps: e, slot: s, attrs: t, slots: n, name: "MenuButton" });
};
} }), rc = J({ name: "MenuItems", props: { as: { type: [Object, String], default: "div" }, static: { type: Boolean, default: !1 }, unmount: { type: Boolean, default: !0 } }, setup(e, { attrs: t, slots: n, expose: r }) {
let a = ea("MenuItems"), o = `headlessui-menu-items-${gt()}`, l = A(null);
r({ el: a.itemsRef, $el: a.itemsRef }), Es({ container: $(() => fe(a.itemsRef)), enabled: $(() => a.menuState.value === 0), accept(s) {
return s.getAttribute("role") === "menuitem" ? NodeFilter.FILTER_REJECT : s.hasAttribute("role") ? NodeFilter.FILTER_SKIP : NodeFilter.FILTER_ACCEPT;
}, walk(s) {
s.setAttribute("role", "none");
} });
function i(s) {
var y;
switch (l.value && clearTimeout(l.value), s.key) {
case de.Space:
if (a.searchQuery.value !== "")
return s.preventDefault(), s.stopPropagation(), a.search(s.key);
case de.Enter:
if (s.preventDefault(), s.stopPropagation(), a.activeItemIndex.value !== null) {
let g = a.items.value[a.activeItemIndex.value];
(y = fe(g.dataRef.domRef)) == null || y.click();
}
a.closeMenu(), Xi(fe(a.buttonRef));
break;
case de.ArrowDown:
return s.preventDefault(), s.stopPropagation(), a.goToItem(Pe.Next);
case de.ArrowUp:
return s.preventDefault(), s.stopPropagation(), a.goToItem(Pe.Previous);
case de.Home:
case de.PageUp:
return s.preventDefault(), s.stopPropagation(), a.goToItem(Pe.First);
case de.End:
case de.PageDown:
return s.preventDefault(), s.stopPropagation(), a.goToItem(Pe.Last);
case de.Escape:
s.preventDefault(), s.stopPropagation(), a.closeMenu(), Ve(() => {
var g;
return (g = fe(a.buttonRef)) == null ? void 0 : g.focus({ preventScroll: !0 });
});
break;
case de.Tab:
s.preventDefault(), s.stopPropagation(), a.closeMenu(), Ve(() => Hs(fe(a.buttonRef), s.shiftKey ? Sa.Previous : Sa.Next));
break;
default:
s.key.length === 1 && (a.search(s.key), l.value = setTimeout(() => a.clearSearch(), 350));
break;
}
}
function u(s) {
switch (s.key) {
case de.Space:
s.preventDefault();
break;
}
}
let f = zi(), d = $(() => f !== null ? f.value === Yt.Open : a.menuState.value === 0);
return () => {
var s, y;
let g = { open: a.menuState.value === 0 }, S = { "aria-activedescendant": a.activeItemIndex.value === null || (s = a.items.value[a.activeItemIndex.value]) == null ? void 0 : s.id, "aria-labelledby": (y = fe(a.buttonRef)) == null ? void 0 : y.id, id: o, onKeydown: i, onKeyup: u, role: "menu", tabIndex: 0, ref: a.itemsRef };
return Qe({ ourProps: S, theirProps: e, slot: g, attrs: t, slots: n, features: un.RenderStrategy | un.Static, visible: d.value, name: "MenuItems" });
};
} }), ac = J({ name: "MenuItem", props: { as: { type: [Object, String], default: "template" }, disabled: { type: Boolean, default: !1 } }, setup(e, { slots: t, attrs: n, expose: r }) {
let a = ea("MenuItem"), o = `headlessui-menu-item-${gt()}`, l = A(null);
r({ el: l, $el: l });
let i = $(() => a.activeItemIndex.value !== null ? a.items.value[a.activeItemIndex.value].id === o : !1), u = $(() => ({ disabled: e.disabled, textValue: "", domRef: l }));
Be(() => {
var g, S;
let x = (S = (g = fe(l)) == null ? void 0 : g.textContent) == null ? void 0 : S.toLowerCase().trim();
x !== void 0 && (u.value.textValue = x);
}), Be(() => a.registerItem(o, u)), Ht(() => a.unregisterItem(o)), sn(() => {
a.menuState.value === 0 && (!i.value || a.activationTrigger.value !== 0 && Ve(() => {
var g, S;
return (S = (g = fe(l)) == null ? void 0 : g.scrollIntoView) == null ? void 0 : S.call(g, { block: "nearest" });
}));
});
function f(g) {
if (e.disabled)
return g.preventDefault();
a.closeMenu(), Xi(fe(a.buttonRef));
}
function d() {
if (e.disabled)
return a.goToItem(Pe.Nothing);
a.goToItem(Pe.Specific, o);
}
function s() {
e.disabled || i.value || a.goToItem(Pe.Specific, o, 0);
}
function y() {
e.disabled || !i.value || a.goToItem(Pe.Nothing);
}
return () => {
let { disabled: g } = e, S = { active: i.value, disabled: g, close: a.closeMenu };
return Qe({ ourProps: { id: o, ref: l, role: "menuitem", tabIndex: g === !0 ? void 0 : -1, "aria-disabled": g === !0 ? !0 : void 0, onClick: f, onFocus: d, onPointermove: s, onMousemove: s, onPointerleave: y, onMouseleave: y }, theirProps: e, slot: S, attrs: n, slots: t, name: "MenuItem" });
};
} }), su = Symbol("LabelContext");
function cu() {
let e = ke(su, null);
if (e === null) {
let t = new Error("You used a <Label /> component, but it is not inside a parent.");
throw Error.captureStackTrace && Error.captureStackTrace(t, cu), t;
}
return e;
}
function oc({ slot: e = {}, name: t = "Label", props: n = {} } = {}) {
let r = A([]);
function a(o) {
return r.value.push(o), () => {
let l = r.value.indexOf(o);
l !== -1 && r.value.splice(l, 1);
};
}
return ot(su, { register: a, slot: e, name: t, props: n }), $(() => r.value.length > 0 ? r.value.join(" ") : void 0);
}
let lc = J({ name: "Label", props: { as: { type: [Object, String], default: "label" }, passive: { type: [Boolean], default: !1 } }, setup(e, { slots: t, attrs: n }) {
let r = cu(), a = `headlessui-label-${gt()}`;
return Be(() => Ht(r.register(a))), () => {
let { name: o = "Label", slot: l = {}, props: i = {} } = r, { passive: u, ...f } = e, d = { ...Object.entries(i).reduce((s, [y, g]) => Object.assign(s, { [y]: p(g) }), {}), id: a };
return u && (delete d.onClick, delete f.onClick), Qe({ ourProps: d, theirProps: f, slot: l, attrs: n, slots: t, name: o });
};
} }), fu = Symbol("GroupContext"), ic = J({ name: "SwitchGroup", props: { as: { type: [Object, String], default: "template" } }, setup(e, { slots: t, attrs: n }) {
let r = A(null), a = oc({ name: "SwitchLabel", props: { onClick() {
!r.value || (r.value.click(), r.value.focus({ preventScroll: !0 }));
} } }), o = zs({ name: "SwitchDescription" });
return ot(fu, { switchRef: r, labelledby: a, describedby: o }), () => Qe({ theirProps: e, ourProps: {}, slot: {}, slots: t, attrs: n, name: "SwitchGroup" });
} }), uc = J({ name: "Switch", emits: { "update:modelValue": (e) => !0 }, props: { as: { type: [Object, String], default: "button" }, modelValue: { type: Boolean, default: void 0 }, defaultChecked: { type: Boolean, default: !1 }, name: { type: String, optional: !0 }, value: { type: String, optional: !0 } }, inheritAttrs: !1, setup(e, { emit: t, attrs: n, slots: r, expose: a }) {
let o = ke(fu, null), l = `headlessui-switch-${gt()}`, [i, u] = nu($(() => e.modelValue), (D) => t("update:modelValue", D), $(() => e.defaultChecked));
function f() {
u(!i.value);
}
let d = A(null), s = o === null ? d : o.switchRef, y = Ho($(() => ({ as: e.as, type: n.type })), s);
a({ el: s, $el: s });
function g(D) {
D.preventDefault(), f();
}
function S(D) {
D.key === de.Space ? (D.preventDefault(), f()) : D.key === de.Enter && Ws(D.currentTarget);
}
function x(D) {
D.preventDefault();
}
return () => {
let { name: D, value: c, ...w } = e, V = { checked: i.value }, L = { id: l, ref: s, role: "switch", type: y.value, tabIndex: 0, "aria-checked": i.value, "aria-labelledby": o == null ? void 0 : o.labelledby.value, "aria-describedby": o == null ? void 0 : o.describedby.value, onClick: g, onKeyup: S, onKeypress: x };
return He(te, [D != null && i.value != null ? He(Zi, Ui({ features: Fo.Hidden, as: "input", type: "checkbox", hidden: !0, readOnly: !0, checked: i.value, name: D, value: c })) : null, Qe({ ourProps: L, theirProps: { ...n, ...Qr(w, ["modelValue", "defaultChecked"]) }, slot: V, attrs: n, slots: r, name: "Switch" })]);
};
} }), sc = lc;
const cc = { class: "px-3 py-2 flex items-center" }, fc = { key: 1 }, dc = {
inheritAttrs: !1
}, pc = /* @__PURE__ */ J({
...dc,
__name: "Swatch",
props: {
options: null,
modelValue: null,
error: null,
noSelectionLabel: { default: "Choose color\u2026" }
},
emits: ["change", "update:modelValue"],
setup(e, { emit: t }) {
const n = e, r = $(() => !!n.error), a = A(n.modelValue);
return Ee(a, (o) => {
t("change", o), t("update:modelValue", o);
}), Ee(n, (o) => {
a.value != o.modelValue && (a.value = o.modelValue);
}), (o, l) => (m(), P(te, null, [
we(p(ou), {
modelValue: a.value,
"onUpdate:modelValue": l[0] || (l[0] = (i) => a.value = i)
}, {
default: G(({ open: i }) => [
C("div", {
class: X(["relative w-full select", { open: i }])
}, [
we(p(lu), {
class: X(["w-full relative text-left select-button", { open: i, "has-error": p(r) }])
}, {
default: G(() => [
C("div", cc, [
a.value ? (m(), P("div", {
key: 0,
class: "h-6 w-full inline-flex rounded-md",
style: $t({ backgroundColor: a.value })
}, null, 4)) : (m(), P("span", fc, ie(e.noSelectionLabel), 1))
])
]),
_: 2
}, 1032, ["class"]),
we(_t, {
"enter-from-class": "opacity-0",
"enter-to-class": "opacity-100",
"enter-active-class": "transition-opacity duration-150",
"leave-active-class": "transition-opacity duration-150",
"leave-from-class": "opacity-100",
"leave-to-class": "opacity-0"
}, {
default: G(() => [
we(p(iu), {
class: X(["w-full focus:outline-none shadow-lg bg-white z-10 absolute max-h-60 overflow-x-hidden overflow-y-auto w-full border rounded-b-lg -mt-0.5 select-option-list", [p(r) ? "border-danger-300" : "border-gray-300"]])
}, {
default: G(() => [
(m(!0), P(te, null, Te(e.options, (u) => (m(), oe(p(_n), {
as: "template",
key: u,
value: u
}, {
default: G(({ active: f, selected: d }) => [
C("li", {
class: X(["relative px-3 py-2 cursor-pointer flex items-center justify-center", { "bg-primary-100 text-primary-900": f }])
}, [
C("div", {
class: "w-full h-8 rounded-lg",
style: $t({ backgroundColor: u })
}, null, 4)
], 2)
]),
_: 2
}, 1032, ["value"]))), 128))
]),
_: 1
}, 8, ["class"])
]),
_: 1
})
], 2)
]),
_: 1
}, 8, ["modelValue"]),
we(Xr, { error: e.error }, null, 8, ["error"])
], 64));
}
}), mc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: pc
}, Symbol.toStringTag, { value: "Module" })), vc = J({
props: {
as: { type: String, default: "span" },
value: { type: String, required: !1 },
asHtml: { type: Boolean, required: !1, default: !1 },
color: { type: String, required: !1 },
size: { type: String, required: !1 }
},
setup(e, { slots: t }) {
return () => {
let { as: n, asHtml: r, value: a, color: o, size: l, ...i } = e;
const u = () => o == "primary" ? "text-gray-900" : o == "secondary" ? "text-gray-600" : {}, f = () => l === "small" ? "text-sm" : {}, d = Ne(i, {
class: [u(), f()]
});
return a ? r ? He(n, Ne({
innerHTML: a
}, d)) : He(n, d, a) : He(n, d, t);
};
}
}), yc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: vc
}, Symbol.toStringTag, { value: "Module" })), hc = ["value", "type", "placeholder", "name", "id"], bc = {
key: 0,
class: "input-error"
}, gc = /* @__PURE__ */ J({
__name: "TextInput",
props: {
id: null,
name: null,
modelValue: null,
error: null,
type: { default: "text" },
placeholder: null,
fullWidth: { type: Boolean }
},
emits: ["update:modelValue", "input"],
setup(e, { emit: t }) {
const n = e, r = $(() => !!n.error);
function a(o) {
var l, i;
t("input", (l = o.target) == null ? void 0 : l.value), t("update:modelValue", (i = o.target) == null ? void 0 : i.value);
}
return (o, l) => (m(), P(te, null, [
C("input", Ne({
value: e.modelValue,
onInput: a,
class: ["form-input", { "has-error": p(r), "max-w-md": !e.fullWidth }],
type: e.type,
placeholder: e.placeholder || void 0,
name: e.name,
id: e.id
}, o.$attrs), null, 16, hc),
e.error ? (m(), P("p", bc, ie(e.error), 1)) : M("", !0)
], 64));
}
}), wc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: gc
}, Symbol.toStringTag, { value: "Module" })), bg = {
install(e, t) {
bs(/* @__PURE__ */ Object.assign({ "./View/Components/Button.vue": _s, "./View/Components/Link.vue": ks, "./View/Components/Pressable.vue": $s, "./View/Components/Stack.vue": Ts, "./View/Components/Swatch.vue": mc, "./View/Components/Text.vue": yc, "./View/Components/TextInput.vue": wc }), "insight-elements");
}
}, _c = (e, t) => {
const n = e.__vccOpts || e;
for (const [r, a] of t)
n[r] = a;
return n;
}, Oc = {}, Pc = {
class: "w-4 h-4 text-gray-600 mt-0.5 mx-2",
xmlns: "http://www.w3.org/2000/svg",
fill: "none",
viewBox: "0 0 24 24",
"stroke-width": "1.5",
stroke: "currentColor"
}, kc = /* @__PURE__ */ C("path", {
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: "M8.25 4.5l7.5 7.5-7.5 7.5"
}, null, -1), Sc = [
kc
];
function $c(e, t) {
return m(), P("svg", Pc, Sc);
}
const xc = /* @__PURE__ */ _c(Oc, [["render", $c]]), gg = J({
props: {
skipFirst: { type: Boolean, default: !1 },