@matta-trade/ui 0.0.0-stage → 0.2.2

package/dist/chart/interface.d.ts

@@ -0,0 +1,63 @@
+import { Spacing } from '@unovis/ts';
+type KeyOf<T extends Record<string, any>> = Extract<keyof T, string>;
+export interface BaseChartProps<T extends Record<string, any>> {
+    /**
+     * The source data, in which each entry is a dictionary.
+     */
+    data: T[];
+    /**
+     * Select the categories from your data. Used to populate the legend and tooltip.
+     */
+    categories: KeyOf<T>[];
+    /**
+     * Sets the key to map the data to the axis.
+     */
+    index: KeyOf<T>;
+    /**
+     * Change the default colors.
+     */
+    colors?: string[];
+    /**
+     * Margin of each the container
+     */
+    margin?: Spacing;
+    /**
+     * Change the opacity of the non-selected field
+     * @default 0.2
+     */
+    filterOpacity?: number;
+    /**
+     * Function to format X label
+     */
+    xFormatter?: (tick: number | Date, i: number, ticks: number[] | Date[]) => string;
+    /**
+     * Function to format Y label
+     */
+    yFormatter?: (tick: number | Date, i: number, ticks: number[] | Date[]) => string;
+    /**
+     * Controls the visibility of the X axis.
+     * @default true
+     */
+    showXAxis?: boolean;
+    /**
+     * Controls the visibility of the Y axis.
+     * @default true
+     */
+    showYAxis?: boolean;
+    /**
+     * Controls the visibility of tooltip.
+     * @default true
+     */
+    showTooltip?: boolean;
+    /**
+     * Controls the visibility of legend.
+     * @default true
+     */
+    showLegend?: boolean;
+    /**
+     * Controls the visibility of gridline.
+     * @default true
+     */
+    showGridLine?: boolean;
+}
+export {};

package/dist/checkbox/Checkbox.vue.d.ts

@@ -0,0 +1,22 @@
+import { HTMLAttributes } from 'vue';
+import { CheckboxRootProps } from 'reka-ui';
+type __VLS_Props = CheckboxRootProps & {
+    class?: HTMLAttributes["class"];
+};
+declare var __VLS_14: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: boolean | "indeterminate") => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/checkbox/index.d.ts

@@ -0,0 +1 @@
+export { default as Checkbox } from './Checkbox.vue';

package/dist/checkbox/index.js

@@ -0,0 +1,43 @@
+import { t as e } from "../chunks/utils-CX-Pz5p6.js";
+import { createBlock as t, createVNode as n, defineComponent as r, mergeProps as i, openBlock as a, renderSlot as o, unref as s, withCtx as c } from "vue";
+import { CheckboxIndicator as l, CheckboxRoot as u, useForwardPropsEmits as d } from "reka-ui";
+import { reactiveOmit as f } from "@vueuse/core";
+import { Check as p } from "lucide-vue-next";
+//#endregion
+//#region src/checkbox/Checkbox.vue
+var m = /* @__PURE__ */ r({
+	__name: "Checkbox",
+	props: {
+		defaultValue: {},
+		modelValue: {},
+		disabled: { type: Boolean },
+		value: {},
+		id: {},
+		trueValue: {},
+		falseValue: {},
+		asChild: { type: Boolean },
+		as: {},
+		name: {},
+		required: { type: Boolean },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: ["update:modelValue"],
+	setup(r, { emit: m }) {
+		let h = r, g = m, _ = f(h, "class"), v = d(_, g);
+		return (r, d) => (a(), t(s(u), i(s(v), { class: s(e)("peer h-4 w-4 grid shrink-0 place-content-center rounded-sm border border-primary transition-colors focus-visible:ring-2 focus-visible:ring-brand-500/20 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-transparent data-[state=checked]:bg-brand-solid data-[state=checked]:text-white", h.class) }), {
+			default: c(() => [n(s(l), { class: "grid place-content-center text-current" }, {
+				default: c(() => [o(r.$slots, "default", {}, () => [n(s(p), { class: "h-4 w-4" })])]),
+				_: 3
+			})]),
+			_: 3
+		}, 16, ["class"]));
+	}
+});
+//#endregion
+export { m as Checkbox };

package/dist/chunks/avatar-colors-CCGh54Ve.js

@@ -0,0 +1,37 @@
+//#region src/avatar-colors.ts
+var e = [
+	{
+		bg: "bg-utility-slate-50",
+		text: "text-utility-slate-700"
+	},
+	{
+		bg: "bg-utility-sky-50",
+		text: "text-utility-sky-700"
+	},
+	{
+		bg: "bg-utility-blue-50",
+		text: "text-utility-blue-700"
+	},
+	{
+		bg: "bg-utility-indigo-50",
+		text: "text-utility-indigo-700"
+	},
+	{
+		bg: "bg-utility-purple-50",
+		text: "text-utility-purple-700"
+	},
+	{
+		bg: "bg-utility-pink-50",
+		text: "text-utility-pink-700"
+	},
+	{
+		bg: "bg-utility-orange-50",
+		text: "text-utility-orange-700"
+	}
+], t = (t) => {
+	let n = 0;
+	for (let r = 0; r < t.length; r++) n = (n + t.charCodeAt(r)) % e.length;
+	return e[n];
+};
+//#endregion
+export { t as n, e as t };

package/dist/chunks/button-DcaKfSRM.js

@@ -0,0 +1,100 @@
+import { t as e } from "./utils-CX-Pz5p6.js";
+import { cva as t } from "class-variance-authority";
+import { computed as n, createBlock as r, defineComponent as i, normalizeClass as a, openBlock as o, renderSlot as s, resolveDynamicComponent as c, withCtx as l } from "vue";
+//#endregion
+//#region src/button/Button.vue
+var u = /* @__PURE__ */ i({
+	__name: "Button",
+	props: {
+		variant: {},
+		size: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		as: { default: "button" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		type: { default: "button" }
+	},
+	emits: ["click"],
+	setup(i, { emit: u }) {
+		let d = t("font-semibold inline-flex cursor-pointer items-center justify-center rounded-lg text-sm whitespace-nowrap transition-colors select-none focus-visible:ring-2 focus-visible:ring-brand-500/20 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", {
+			variants: {
+				variant: {
+					primary: "bg-brand-solid text-white shadow-xs hover:bg-brand-solid_hover",
+					secondary: "border border-border-primary bg-primary text-secondary shadow-xs hover:bg-secondary hover:text-primary",
+					tertiary: "text-tertiary hover:bg-secondary hover:text-primary",
+					destructive: "bg-error-solid text-white shadow-xs hover:bg-error-solid_hover",
+					outline: "border border-border-primary text-secondary hover:bg-secondary hover:text-primary",
+					ghost: "text-secondary hover:bg-secondary hover:text-primary",
+					link: "p-0 h-auto text-brand-secondary underline-offset-4 hover:underline"
+				},
+				size: {
+					sm: "h-8 px-3 gap-1.5 text-xs",
+					md: "h-9 px-3.5 gap-2 text-sm",
+					lg: "h-10 px-4 gap-2 text-sm",
+					xl: "h-11 px-4.5 text-base gap-2.5",
+					"icon-sm": "size-8 p-0",
+					"icon-md": "size-9 p-0",
+					"icon-lg": "size-10 p-0"
+				}
+			},
+			defaultVariants: {
+				variant: "primary",
+				size: "md"
+			}
+		}), f = i, p = u, m = n(() => e(d({
+			variant: f.variant,
+			size: f.size
+		}), f.class));
+		return (e, t) => (o(), r(c(f.as), {
+			type: f.as === "button" ? f.type : void 0,
+			disabled: f.disabled,
+			class: a(m.value),
+			onClick: t[0] ||= (e) => p("click", e)
+		}, {
+			default: l(() => [s(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"type",
+			"disabled",
+			"class"
+		]));
+	}
+}), d = t("gap-2 font-semibold [&_svg]:size-4 inline-flex cursor-pointer items-center justify-center rounded-lg text-sm whitespace-nowrap transition-all select-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+	variants: {
+		variant: {
+			default: "border border-transparent bg-brand-600 text-white shadow-xs hover:bg-brand-700 active:scale-[0.98]",
+			primary: "border border-transparent bg-brand-600 text-white shadow-xs hover:bg-brand-700 active:scale-[0.98]",
+			secondary: "border border-border-secondary bg-primary text-secondary shadow-xs hover:bg-secondary active:scale-[0.98]",
+			outline: "border border-border-secondary bg-transparent text-secondary shadow-xs hover:bg-secondary hover:text-primary active:scale-[0.98]",
+			tertiary: "bg-transparent text-secondary hover:bg-secondary/60 hover:text-primary",
+			ghost: "bg-transparent text-secondary hover:bg-secondary/60 hover:text-primary",
+			destructive: "bg-red-600 hover:bg-red-700 border border-transparent text-white shadow-xs active:scale-[0.98]",
+			destructiveSecondary: "bg-red-50 text-red-700 border-red-200 hover:bg-red-100 dark:bg-red-950 dark:text-red-300 dark:border-red-900 border shadow-xs active:scale-[0.98]",
+			link: "p-0 h-auto text-brand-600 underline-offset-4 hover:text-brand-700 hover:underline"
+		},
+		size: {
+			default: "h-9 px-4 py-2",
+			sm: "h-8 px-3 rounded-md text-xs",
+			md: "h-9 px-4 rounded-lg text-sm",
+			lg: "h-10 px-5 rounded-lg text-sm",
+			xl: "h-11 px-6 text-base rounded-lg",
+			icon: "size-9",
+			"icon-sm": "size-8",
+			"icon-lg": "size-10"
+		}
+	},
+	defaultVariants: {
+		variant: "primary",
+		size: "default"
+	}
+});
+//#endregion
+export { u as n, d as t };

package/dist/chunks/card-B9Fm3-hL.js

@@ -0,0 +1,85 @@
+import { t as e } from "./utils-CX-Pz5p6.js";
+import { createElementBlock as t, defineComponent as n, normalizeClass as r, openBlock as i, renderSlot as a, unref as o } from "vue";
+//#endregion
+//#region src/card/Card.vue
+var s = /* @__PURE__ */ n({
+	__name: "Card",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("div", { class: r(o(e)("bg-card text-card-foreground rounded-lg border shadow-sm", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+}), c = /* @__PURE__ */ n({
+	__name: "CardContent",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("div", { class: r(o(e)("p-6 pt-0", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+}), l = /* @__PURE__ */ n({
+	__name: "CardDescription",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("p", { class: r(o(e)("text-muted-foreground text-sm", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+}), u = /* @__PURE__ */ n({
+	__name: "CardFooter",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("div", { class: r(o(e)("p-6 pt-0 flex items-center", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+}), d = /* @__PURE__ */ n({
+	__name: "CardHeader",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("div", { class: r(o(e)("gap-y-1.5 p-6 flex flex-col", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+}), f = /* @__PURE__ */ n({
+	__name: "CardTitle",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(n) {
+		let s = n;
+		return (n, c) => (i(), t("h3", { class: r(o(e)("text-2xl font-semibold tracking-tight leading-none", s.class)) }, [a(n.$slots, "default")], 2));
+	}
+});
+//#endregion
+export { c as a, l as i, d as n, s as o, u as r, f as t };

package/dist/chunks/dialog-Df5vNbNz.js

@@ -0,0 +1,196 @@
+import { t as e } from "./utils-CX-Pz5p6.js";
+import { createBlock as t, createElementBlock as n, createElementVNode as r, createVNode as i, defineComponent as a, guardReactiveProps as o, mergeProps as s, normalizeClass as c, normalizeProps as l, openBlock as u, renderSlot as d, unref as f, withCtx as p } from "vue";
+import { DialogClose as m, DialogContent as h, DialogDescription as g, DialogOverlay as _, DialogPortal as v, DialogRoot as y, DialogTitle as b, DialogTrigger as x, useForwardProps as S, useForwardPropsEmits as C } from "reka-ui";
+import { reactiveOmit as w } from "@vueuse/core";
+import { X as T } from "lucide-vue-next";
+//#endregion
+//#region src/dialog/Dialog.vue
+var E = /* @__PURE__ */ a({
+	__name: "Dialog",
+	props: {
+		open: { type: Boolean },
+		defaultOpen: { type: Boolean },
+		modal: { type: Boolean },
+		unmountOnHide: { type: Boolean }
+	},
+	emits: ["update:open"],
+	setup(e, { emit: n }) {
+		let r = C(e, n);
+		return (e, n) => (u(), t(f(y), l(o(f(r))), {
+			default: p(() => [d(e.$slots, "default")]),
+			_: 3
+		}, 16));
+	}
+}), D = /* @__PURE__ */ a({
+	__name: "DialogClose",
+	props: {
+		asChild: { type: Boolean },
+		as: {}
+	},
+	setup(e) {
+		let n = e;
+		return (e, r) => (u(), t(f(m), l(o(n)), {
+			default: p(() => [d(e.$slots, "default")]),
+			_: 3
+		}, 16));
+	}
+}), O = /* @__PURE__ */ a({
+	__name: "DialogContent",
+	props: {
+		forceMount: { type: Boolean },
+		disableOutsidePointerEvents: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: [
+		"escapeKeyDown",
+		"pointerDownOutside",
+		"focusOutside",
+		"interactOutside",
+		"openAutoFocus",
+		"closeAutoFocus"
+	],
+	setup(n, { emit: a }) {
+		let o = n, c = a, l = w(o, "class"), g = C(l, c);
+		return (n, a) => (u(), t(f(v), null, {
+			default: p(() => [i(f(_), { class: "inset-0 backdrop-blur-xs fixed z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0" }), i(f(h), s(f(g), { class: f(e)("max-w-lg gap-4 p-6 fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 rounded-xl border border-border-secondary bg-primary text-primary shadow-2xl duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] data-[state=open]:zoom-in-95", o.class) }), {
+				default: p(() => [d(n.$slots, "default"), i(f(m), { class: "right-4 top-4 bg-gray-100 dark:bg-gray-800 p-1.5 hover:bg-gray-200 dark:hover:bg-gray-700 absolute rounded-lg text-tertiary transition-colors hover:text-primary focus:ring-2 focus:ring-brand-500/20 focus:outline-none" }, {
+					default: p(() => [i(f(T), { class: "w-4 h-4" }), a[0] ||= r("span", { class: "sr-only" }, "Close", -1)]),
+					_: 1
+				})]),
+				_: 3
+			}, 16, ["class"])]),
+			_: 3
+		}));
+	}
+}), k = /* @__PURE__ */ a({
+	__name: "DialogDescription",
+	props: {
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(n) {
+		let r = n, i = w(r, "class"), a = S(i);
+		return (n, i) => (u(), t(f(g), s(f(a), { class: f(e)("text-muted-foreground text-sm", r.class) }), {
+			default: p(() => [d(n.$slots, "default")]),
+			_: 3
+		}, 16, ["class"]));
+	}
+}), A = /* @__PURE__ */ a({
+	__name: "DialogFooter",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(t) {
+		let r = t;
+		return (t, i) => (u(), n("div", { class: c(f(e)("sm:flex-row sm:justify-end sm:gap-x-2 flex flex-col-reverse", r.class)) }, [d(t.$slots, "default")], 2));
+	}
+}), j = /* @__PURE__ */ a({
+	__name: "DialogHeader",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(t) {
+		let r = t;
+		return (t, i) => (u(), n("div", { class: c(f(e)("gap-y-1.5 sm:text-left flex flex-col text-center", r.class)) }, [d(t.$slots, "default")], 2));
+	}
+}), M = /* @__PURE__ */ a({
+	__name: "DialogScrollContent",
+	props: {
+		forceMount: { type: Boolean },
+		disableOutsidePointerEvents: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: [
+		"escapeKeyDown",
+		"pointerDownOutside",
+		"focusOutside",
+		"interactOutside",
+		"openAutoFocus",
+		"closeAutoFocus"
+	],
+	setup(n, { emit: a }) {
+		let o = n, c = a, l = w(o, "class"), g = C(l, c);
+		return (n, a) => (u(), t(f(v), null, {
+			default: p(() => [i(f(_), { class: "inset-0 fixed z-50 grid place-items-center overflow-y-auto bg-black/80 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0" }, {
+				default: p(() => [i(f(h), s({ class: f(e)("max-w-lg my-8 gap-4 border-border bg-background p-6 sm:rounded-lg md:w-full relative z-50 grid w-full border shadow-lg duration-200", o.class) }, f(g), { onPointerDownOutside: a[0] ||= (e) => {
+					let t = e.detail.originalEvent, n = t.target;
+					(t.offsetX > n.clientWidth || t.offsetY > n.clientHeight) && e.preventDefault();
+				} }), {
+					default: p(() => [d(n.$slots, "default"), i(f(m), { class: "top-3 right-3 p-0.5 absolute rounded-md transition-colors hover:bg-secondary" }, {
+						default: p(() => [i(f(T), { class: "w-4 h-4" }), a[1] ||= r("span", { class: "sr-only" }, "Close", -1)]),
+						_: 1
+					})]),
+					_: 3
+				}, 16, ["class"])]),
+				_: 3
+			})]),
+			_: 3
+		}));
+	}
+}), N = /* @__PURE__ */ a({
+	__name: "DialogTitle",
+	props: {
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(n) {
+		let r = n, i = w(r, "class"), a = S(i);
+		return (n, i) => (u(), t(f(b), s(f(a), { class: f(e)("font-semibold tracking-tight text-lg leading-none", r.class) }), {
+			default: p(() => [d(n.$slots, "default")]),
+			_: 3
+		}, 16, ["class"]));
+	}
+}), P = /* @__PURE__ */ a({
+	__name: "DialogTrigger",
+	props: {
+		asChild: { type: Boolean },
+		as: {}
+	},
+	setup(e) {
+		let n = e;
+		return (e, r) => (u(), t(f(x), l(o(n)), {
+			default: p(() => [d(e.$slots, "default")]),
+			_: 3
+		}, 16));
+	}
+});
+//#endregion
+export { A as a, D as c, j as i, E as l, N as n, k as o, M as r, O as s, P as t };

package/dist/chunks/input-BgkMak31.js

@@ -0,0 +1,44 @@
+import { t as e } from "./utils-CX-Pz5p6.js";
+import { createElementBlock as t, defineComponent as n, isRef as r, normalizeClass as i, openBlock as a, unref as o, vModelDynamic as s, withDirectives as c } from "vue";
+import { useVModel as l } from "@vueuse/core";
+//#region src/input/Input.vue?vue&type=script&setup=true&lang.ts
+var u = [
+	"type",
+	"placeholder",
+	"disabled"
+], d = /* @__PURE__ */ n({
+	__name: "Input",
+	props: {
+		defaultValue: {},
+		modelValue: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		type: { default: "text" },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(n, { emit: d }) {
+		let f = n, p = l(f, "modelValue", d, {
+			passive: !0,
+			defaultValue: f.defaultValue
+		});
+		return (n, l) => c((a(), t("input", {
+			"onUpdate:modelValue": l[0] ||= (e) => r(p) ? p.value = e : null,
+			type: f.type,
+			placeholder: f.placeholder,
+			disabled: f.disabled,
+			class: i(o(e)("h-10 px-3 py-2 ring-offset-primary file:font-medium flex w-full rounded-lg border border-border-primary bg-primary text-sm text-primary shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm placeholder:text-placeholder focus-visible:border-border-brand focus-visible:ring-2 focus-visible:ring-brand-500/20 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", f.class))
+		}, null, 10, u)), [[s, o(p)]]);
+	}
+});
+//#endregion
+export { d as t };

package/dist/chunks/scroll-area-COtrGbKj.js

@@ -0,0 +1,68 @@
+import { t as e } from "./utils-CX-Pz5p6.js";
+import { createBlock as t, createVNode as n, defineComponent as r, mergeProps as i, normalizeClass as a, openBlock as o, renderSlot as s, unref as c, withCtx as l } from "vue";
+import { ScrollAreaCorner as u, ScrollAreaRoot as d, ScrollAreaScrollbar as f, ScrollAreaThumb as p, ScrollAreaViewport as m } from "reka-ui";
+import { reactiveOmit as h } from "@vueuse/core";
+//#endregion
+//#region src/scroll-area/ScrollBar.vue
+var g = /* @__PURE__ */ r({
+	__name: "ScrollBar",
+	props: {
+		orientation: { default: "vertical" },
+		forceMount: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(r) {
+		let a = r, s = h(a, "class");
+		return (u, d) => (o(), t(c(f), i(c(s), { class: c(e)("flex touch-none transition-colors select-none", r.orientation === "vertical" && "w-2.5 h-full border-l border-l-transparent p-px", r.orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-px", a.class) }), {
+			default: l(() => [n(c(p), { class: "bg-border relative flex-1 rounded-full" })]),
+			_: 1
+		}, 16, ["class"]));
+	}
+}), _ = /* @__PURE__ */ r({
+	__name: "ScrollArea",
+	props: {
+		type: {},
+		dir: {},
+		scrollHideDelay: {},
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		viewportClass: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(r) {
+		let f = r, p = h(f, "class", "viewportClass");
+		return (r, h) => (o(), t(c(d), i(c(p), { class: c(e)("relative overflow-hidden", f.class) }), {
+			default: l(() => [
+				n(c(m), { class: a(c(e)("h-full max-h-[inherit] w-full rounded-[inherit]", f.viewportClass)) }, {
+					default: l(() => [s(r.$slots, "default")]),
+					_: 3
+				}, 8, ["class"]),
+				n(g),
+				n(c(u))
+			]),
+			_: 3
+		}, 16, ["class"]));
+	}
+});
+//#endregion
+export { g as n, _ as t };