@scalar/api-client
Version:
the open source API testing client
166 lines (165 loc) • 7.15 kB
JavaScript
import { defineComponent as T, ref as z, computed as f, createBlock as u, openBlock as r, unref as s, withCtx as o, createElementVNode as a, createVNode as c, normalizeClass as B, toDisplayString as p, createCommentVNode as m, withModifiers as S, createTextVNode as x, createElementBlock as V, Fragment as N, renderList as M } from "vue";
import { Disclosure as E, DisclosureButton as I, DisclosurePanel as R } from "@headlessui/vue";
import { useModal as U, ScalarButton as v, ScalarIcon as P, ScalarSearchInput as F } from "@scalar/components";
import L from "./OAuthScopesAddModal.vue.js";
import A from "../../../../components/DataTable/DataTableCell.vue.js";
import Q from "../../../../components/DataTable/DataTableRow.vue.js";
import q from "../../../../components/DataTable/DataTableCheckbox.vue.js";
const G = { class: "flex h-fit w-full" }, H = { class: "flex-1" }, J = { class: "flex items-center gap-1.75" }, W = {
class: "grid max-h-40 auto-rows-auto overflow-x-hidden overflow-y-scroll",
style: { gridTemplateColumns: "1fr auto" }
}, X = { class: "font-code text-xs" }, Y = { key: 0 }, oe = /* @__PURE__ */ T({
__name: "OAuthScopesInput",
props: {
flowType: {},
flow: {},
selectedScopes: {}
},
emits: ["update:selectedScopes"],
setup(l, { emit: $ }) {
const i = $, d = z(""), w = f(
() => Object.entries(l.flow?.scopes ?? {}).map(([n, e]) => ({
id: n,
label: n,
description: e
}))
), D = f(() => {
if (!d.value)
return w.value;
const n = new RegExp(
d.value.split("").map((e) => e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join(".*"),
"i"
);
return w.value.filter(
({ label: e, description: t }) => n.test(`${e} ${t}`)
);
}), h = f(
() => l.selectedScopes.length === Object.keys(l.flow?.scopes ?? {}).length
);
function g(n, e) {
if (e)
return i("update:selectedScopes", {
scopes: Array.from(/* @__PURE__ */ new Set([...l.selectedScopes, n]))
});
i("update:selectedScopes", {
scopes: l.selectedScopes.filter((t) => t !== n)
});
}
const O = () => i("update:selectedScopes", { scopes: Object.keys(l.flow?.scopes ?? {}) }), j = () => i("update:selectedScopes", { scopes: [] }), y = U();
return (n, e) => (r(), u(s(A), { class: "h-auto !max-h-[initial] min-h-8 items-center" }, {
default: o(() => [
a("div", G, [
e[7] || (e[7] = a("div", { class: "text-c-1 h-full items-center" }, null, -1)),
c(s(E), {
as: "div",
class: "bl flex w-full flex-col"
}, {
default: o(() => [
c(s(I), {
class: B([
"group/scopes-accordion hover:text-c-1 flex h-auto min-h-8 cursor-pointer items-center gap-1.5 pr-2.25 pl-3 text-left",
(l.selectedScopes.length || 0) > 0 ? "text-c-1" : "text-c-3"
])
}, {
default: o(({ open: t }) => [
a("div", H, " Scopes Selected " + p(l.selectedScopes.length || 0) + " / " + p(Object.keys(l.flow?.scopes ?? {}).length || 0), 1),
a("div", J, [
c(s(v), {
class: "pr-0.75 pl-1 transition-none",
size: "sm",
variant: "ghost",
onClick: e[0] || (e[0] = S((k) => s(y).show(), ["stop"]))
}, {
default: o(() => [...e[3] || (e[3] = [
x(" Add Scope ", -1)
])]),
_: 1
}),
h.value ? (r(), u(s(v), {
key: 0,
class: "pr-0.75 pl-1 transition-none",
size: "sm",
variant: "ghost",
onClick: S(j, ["stop"])
}, {
default: o(() => [...e[4] || (e[4] = [
x(" Deselect All ", -1)
])]),
_: 1
})) : m("", !0),
h.value ? m("", !0) : (r(), u(s(v), {
key: 1,
class: "pr-0.75 pl-1 transition-none",
size: "sm",
variant: "ghost",
onClick: S(O, ["stop"])
}, {
default: o(() => [...e[5] || (e[5] = [
x(" Select All ", -1)
])]),
_: 1
})),
c(s(P), {
class: "text-c-3 group-hover/scopes-accordion:text-c-2",
icon: t ? "ChevronDown" : "ChevronRight",
size: "md"
}, null, 8, ["icon"])
])
]),
_: 1
}, 8, ["class"]),
c(s(R), { as: "template" }, {
default: o(() => [
a("div", null, [
c(s(F), {
modelValue: d.value,
"onUpdate:modelValue": e[1] || (e[1] = (t) => d.value = t),
class: "flex items-center text-xs"
}, null, 8, ["modelValue"]),
a("table", W, [
(r(!0), V(N, null, M(D.value, ({ id: t, label: k, description: b }) => (r(), u(s(Q), {
key: t,
class: "text-c-2",
onClick: (C) => g(t, !l.selectedScopes.includes(t))
}, {
default: o(() => [
c(s(A), { class: "no-scrollbar hover:text-c-1 box-border flex !max-h-[initial] w-full cursor-pointer items-center gap-1 overflow-x-scroll px-3 py-1.5 text-nowrap" }, {
default: o(() => [
a("span", X, p(k), 1),
e[6] || (e[6] = a("span", null, "–", -1)),
b ? (r(), V("span", Y, p(b), 1)) : m("", !0)
]),
_: 2
}, 1024),
c(s(q), {
modelValue: l.selectedScopes.includes(t),
"onUpdate:modelValue": (C) => g(t, C)
}, null, 8, ["modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1032, ["onClick"]))), 128))
])
])
]),
_: 1
})
]),
_: 1
})
]),
c(L, {
scopes: Object.keys(l.flow.scopes ?? {}),
state: s(y),
onSubmit: e[2] || (e[2] = (t) => i("update:selectedScopes", {
scopes: l.selectedScopes,
newScopePayload: { ...t, flowType: l.flowType }
}))
}, null, 8, ["scopes", "state"])
]),
_: 1
}));
}
});
export {
oe as default
};