@noxickon/onyx 5.0.2 → 6.0.0

package/dist/components/Popover/index.d.ts

@@ -0,0 +1,12 @@
+import { Popover as BasePopover } from '@base-ui/react/popover';
+import { OxPopoverClose, OxPopoverContent, OxPopoverDescription, OxPopoverRoot, OxPopoverTitle, OxPopoverTrigger } from './Popover';
+declare const OxPopover: typeof OxPopoverRoot & {
+    Trigger: typeof OxPopoverTrigger;
+    Content: typeof OxPopoverContent;
+    Title: typeof OxPopoverTitle;
+    Description: typeof OxPopoverDescription;
+    Close: typeof OxPopoverClose;
+    createHandle: typeof BasePopover.createHandle;
+};
+export { OxPopover };
+export type { OxPopoverCloseProps, OxPopoverContentProps, OxPopoverDescriptionProps, OxPopoverProps, OxPopoverTitleProps, OxPopoverTriggerProps, } from './Popover.types';

package/dist/components/Popover/index.js

@@ -0,0 +1,13 @@
+import { createPopoverHandle as e } from "../../node_modules/@base-ui/react/popover/store/PopoverHandle.js";
+import { OxPopoverClose as t, OxPopoverContent as n, OxPopoverDescription as r, OxPopoverRoot as i, OxPopoverTitle as a, OxPopoverTrigger as o } from "./Popover.js";
+//#region src/components/Popover/index.ts
+var s = Object.assign(i, {
+	Trigger: o,
+	Content: n,
+	Title: a,
+	Description: r,
+	Close: t,
+	createHandle: e
+});
+//#endregion
+export { s as OxPopover };

package/dist/components/Progress/Progress.css

@@ -0,0 +1 @@
+[data-ox-slot=progress-bar][data-indeterminate]:after{content:"";border-radius:inherit;background:linear-gradient(90deg, var(--tone), var(--tone-ink));inline-size:40%;animation:ox-progress-indeterminate 1.4s var(--ease-out-quint) infinite;position:absolute;inset-block:0;inset-inline-start:0}[data-ox-scheme=light] [data-ox-slot=progress-bar][data-indeterminate]:after{background:var(--tone)}[dir=rtl] [data-ox-slot=progress-bar][data-indeterminate]:after{animation-direction:reverse}@keyframes ox-progress-indeterminate{0%{transform:translate(-110%)}to{transform:translate(280%)}}@media (prefers-reduced-motion:reduce){[data-ox-slot=progress-bar][data-indeterminate]:after{opacity:.5;inline-size:100%;animation:none}}

package/dist/components/Progress/Progress.d.ts

@@ -0,0 +1,6 @@
+import { OxProgressBarProps, OxProgressLabelProps, OxProgressProps, OxProgressValueProps } from './Progress.types';
+declare function OxProgressRoot({ children, className, getStatus, max, min, tone, value, ...props }: OxProgressProps): import("react").JSX.Element;
+declare function OxProgressLabel({ className, ...props }: OxProgressLabelProps): import("react").JSX.Element;
+declare function OxProgressValue({ className, ...props }: OxProgressValueProps): import("react").JSX.Element;
+declare function OxProgressBar({ className, ...props }: OxProgressBarProps): import("react").JSX.Element;
+export { OxProgressBar, OxProgressLabel, OxProgressRoot, OxProgressValue };

package/dist/components/Progress/Progress.styles.d.ts

@@ -0,0 +1,49 @@
+export declare const progressVariants: import('tailwind-variants').TVReturnType<{
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            value?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            label?: import('tailwind-merge').ClassNameValue;
+            bar?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import('tailwind-merge').ClassNameValue | {
+            value?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            label?: import('tailwind-merge').ClassNameValue;
+            bar?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string[];
+    label: string[];
+    value: string[];
+    bar: string[];
+    indicator: string[];
+}, undefined, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            value?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            label?: import('tailwind-merge').ClassNameValue;
+            bar?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string[];
+    label: string[];
+    value: string[];
+    bar: string[];
+    indicator: string[];
+}, import('tailwind-variants').TVReturnType<unknown, {
+    root: string[];
+    label: string[];
+    value: string[];
+    bar: string[];
+    indicator: string[];
+}, undefined, unknown, unknown, undefined>>;

package/dist/components/Progress/Progress.styles.js

@@ -0,0 +1,20 @@
+import { tv as e } from "../../internal/tv.js";
+//#region src/components/Progress/Progress.styles.ts
+var t = e({ slots: {
+	root: ["group/progress flex w-full flex-wrap items-baseline", "gap-x-2.5 gap-y-1.5"],
+	label: ["order-1 flex-1 min-w-0", "text-body font-medium text-fg"],
+	value: [
+		"order-2",
+		"text-2xs font-mono tabular-nums text-fg-muted",
+		"data-[indeterminate]:hidden"
+	],
+	bar: ["order-3 basis-full relative w-full h-2 overflow-hidden", "rounded-full border border-line bg-surface-raised"],
+	indicator: [
+		"h-full rounded-full bg-tone",
+		"group-data-[ox-tone=warning]/progress:bg-warning-bar",
+		"transition-[width,background-color] duration-300 ease-out-quint",
+		"data-[indeterminate]:hidden"
+	]
+} });
+//#endregion
+export { t as progressVariants };

package/dist/components/Progress/Progress.types.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+import { ProgressLabelProps as BaseProgressLabelProps, ProgressRootProps as BaseProgressRootProps, ProgressTrackProps as BaseProgressTrackProps, ProgressValueProps as BaseProgressValueProps } from '@base-ui/react/progress';
+import { OxTone } from '../../internal/types/tone';
+export type OxProgressTone = OxTone;
+export type OxProgressStatus = 'indeterminate' | 'progressing' | 'complete';
+export interface OxProgressStatusContext {
+    max: number;
+    min: number;
+    percent: number;
+    status: OxProgressStatus;
+    value: number | null;
+}
+export type OxProgressGetStatus = (context: OxProgressStatusContext) => OxProgressTone;
+export interface OxProgressProps extends Omit<BaseProgressRootProps, 'className'> {
+    children?: ReactNode;
+    className?: string;
+    getStatus?: OxProgressGetStatus;
+    tone?: OxProgressTone;
+}
+export interface OxProgressLabelProps extends Omit<BaseProgressLabelProps, 'className'> {
+    className?: string;
+}
+export interface OxProgressValueProps extends Omit<BaseProgressValueProps, 'className'> {
+    className?: string;
+}
+export interface OxProgressBarProps extends Omit<BaseProgressTrackProps, 'className' | 'children'> {
+    className?: string;
+}

package/dist/components/Progress/Progress2.js

@@ -0,0 +1,98 @@
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import { createCompoundContext as t } from "../../internal/context/createCompoundContext/createCompoundContext.js";
+import { ProgressRoot as n } from "../../node_modules/@base-ui/react/progress/root/ProgressRoot.js";
+import { ProgressTrack as r } from "../../node_modules/@base-ui/react/progress/track/ProgressTrack.js";
+import { ProgressIndicator as i } from "../../node_modules/@base-ui/react/progress/indicator/ProgressIndicator.js";
+import { ProgressValue as a } from "../../node_modules/@base-ui/react/progress/value/ProgressValue.js";
+import { ProgressLabel as o } from "../../node_modules/@base-ui/react/progress/label/ProgressLabel.js";
+import './Progress.css';/* empty css         */
+import { progressVariants as s } from "./Progress.styles.js";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/components/Progress/Progress.tsx
+var l = e();
+function u(e, t, n) {
+	return e === null ? 0 : n <= 0 ? 100 : (e - t) / n * 100;
+}
+function d(e, t) {
+	return e ? "indeterminate" : t ? "complete" : "progressing";
+}
+var { Provider: f, useRequiredContext: p } = t("OxProgress"), m = s();
+function h(e) {
+	let t = (0, l.c)(29), r, i, a, o, s, p, h, g;
+	t[0] === e ? (r = t[1], i = t[2], a = t[3], o = t[4], s = t[5], p = t[6], h = t[7], g = t[8]) : ({children: r, className: i, getStatus: a, max: s, min: p, tone: h, value: g, ...o} = e, t[0] = e, t[1] = r, t[2] = i, t[3] = a, t[4] = o, t[5] = s, t[6] = p, t[7] = h, t[8] = g);
+	let _ = s === void 0 ? 100 : s, v = p === void 0 ? 0 : p, y = h === void 0 ? "primary" : h, b = _ - v, x = g === null, S = x ? null : Math.min(Math.max(g, v), _), C = S !== null && S >= _, w;
+	if (t[9] !== S || t[10] !== a || t[11] !== C || t[12] !== x || t[13] !== _ || t[14] !== v || t[15] !== b || t[16] !== y) {
+		let e = u(S, v, b), n = d(x, C);
+		w = a?.({
+			max: _,
+			min: v,
+			percent: e,
+			status: n,
+			value: S
+		}) ?? y, t[9] = S, t[10] = a, t[11] = C, t[12] = x, t[13] = _, t[14] = v, t[15] = b, t[16] = y, t[17] = w;
+	} else w = t[17];
+	let T = w, E;
+	t[18] === Symbol.for("react.memo_cache_sentinel") ? (E = { slots: m }, t[18] = E) : E = t[18];
+	let D;
+	t[19] === i ? D = t[20] : (D = m.root({ class: i }), t[19] = i, t[20] = D);
+	let O;
+	return t[21] !== r || t[22] !== S || t[23] !== _ || t[24] !== v || t[25] !== o || t[26] !== T || t[27] !== D ? (O = /* @__PURE__ */ c(f, {
+		value: E,
+		children: /* @__PURE__ */ c(n, {
+			...o,
+			className: D,
+			"data-ox-slot": "progress",
+			"data-ox-tone": T,
+			max: _,
+			min: v,
+			value: S,
+			children: r
+		})
+	}), t[21] = r, t[22] = S, t[23] = _, t[24] = v, t[25] = o, t[26] = T, t[27] = D, t[28] = O) : O = t[28], O;
+}
+function g(e) {
+	let t = (0, l.c)(9), n, r;
+	t[0] === e ? (n = t[1], r = t[2]) : ({className: n, ...r} = e, t[0] = e, t[1] = n, t[2] = r);
+	let { slots: i } = p(), a;
+	t[3] !== n || t[4] !== i ? (a = i.label({ class: n }), t[3] = n, t[4] = i, t[5] = a) : a = t[5];
+	let s;
+	return t[6] !== r || t[7] !== a ? (s = /* @__PURE__ */ c(o, {
+		...r,
+		className: a,
+		"data-ox-slot": "progress-label"
+	}), t[6] = r, t[7] = a, t[8] = s) : s = t[8], s;
+}
+function _(e) {
+	let t = (0, l.c)(9), n, r;
+	t[0] === e ? (n = t[1], r = t[2]) : ({className: n, ...r} = e, t[0] = e, t[1] = n, t[2] = r);
+	let { slots: i } = p(), o;
+	t[3] !== n || t[4] !== i ? (o = i.value({ class: n }), t[3] = n, t[4] = i, t[5] = o) : o = t[5];
+	let s;
+	return t[6] !== r || t[7] !== o ? (s = /* @__PURE__ */ c(a, {
+		...r,
+		className: o,
+		"data-ox-slot": "progress-value"
+	}), t[6] = r, t[7] = o, t[8] = s) : s = t[8], s;
+}
+function v(e) {
+	let t = (0, l.c)(14), n, a;
+	t[0] === e ? (n = t[1], a = t[2]) : ({className: n, ...a} = e, t[0] = e, t[1] = n, t[2] = a);
+	let { slots: o } = p(), s;
+	t[3] !== n || t[4] !== o ? (s = o.bar({ class: n }), t[3] = n, t[4] = o, t[5] = s) : s = t[5];
+	let u;
+	t[6] === o ? u = t[7] : (u = o.indicator(), t[6] = o, t[7] = u);
+	let d;
+	t[8] === u ? d = t[9] : (d = /* @__PURE__ */ c(i, {
+		className: u,
+		"data-ox-slot": "progress-indicator"
+	}), t[8] = u, t[9] = d);
+	let f;
+	return t[10] !== a || t[11] !== s || t[12] !== d ? (f = /* @__PURE__ */ c(r, {
+		...a,
+		className: s,
+		"data-ox-slot": "progress-bar",
+		children: d
+	}), t[10] = a, t[11] = s, t[12] = d, t[13] = f) : f = t[13], f;
+}
+//#endregion
+export { v as OxProgressBar, g as OxProgressLabel, h as OxProgressRoot, _ as OxProgressValue };

package/dist/components/Progress/index.d.ts

@@ -0,0 +1,7 @@
+import { OxProgressBar, OxProgressLabel, OxProgressRoot, OxProgressValue } from './Progress';
+export declare const OxProgress: typeof OxProgressRoot & {
+    Bar: typeof OxProgressBar;
+    Label: typeof OxProgressLabel;
+    Value: typeof OxProgressValue;
+};
+export type { OxProgressBarProps, OxProgressGetStatus, OxProgressLabelProps, OxProgressProps, OxProgressStatus, OxProgressStatusContext, OxProgressTone, OxProgressValueProps, } from './Progress.types';

package/dist/components/Progress/index.js

@@ -0,0 +1,9 @@
+import { OxProgressBar as e, OxProgressLabel as t, OxProgressRoot as n, OxProgressValue as r } from "./Progress2.js";
+//#region src/components/Progress/index.ts
+var i = Object.assign(n, {
+	Bar: e,
+	Label: t,
+	Value: r
+});
+//#endregion
+export { i as OxProgress };

package/dist/components/Radio/Radio.d.ts

@@ -0,0 +1,4 @@
+import { OxRadioGroupProps, OxRadioProps } from './Radio.types';
+declare function OxRadio({ className, invalid, ...props }: OxRadioProps): import("react").JSX.Element;
+declare function OxRadioGroup({ className, orientation, ...props }: OxRadioGroupProps): import("react").JSX.Element;
+export { OxRadio, OxRadioGroup };

package/dist/components/Radio/Radio.js

@@ -0,0 +1,49 @@
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import { getFieldControlAttributes as t } from "../../internal/utils/getFieldControlAttributes/getFieldControlAttributes.js";
+import { RadioRoot as n } from "../../node_modules/@base-ui/react/radio/root/RadioRoot.js";
+import { RadioIndicator as r } from "../../node_modules/@base-ui/react/radio/indicator/RadioIndicator.js";
+import { RadioGroup as i } from "../../node_modules/@base-ui/react/radio-group/RadioGroup.js";
+import { radioGroupVariants as a, radioVariants as o } from "./Radio.styles.js";
+import { jsx as s } from "react/jsx-runtime";
+//#region src/components/Radio/Radio.tsx
+var c = e();
+function l(e) {
+	let i = (0, c.c)(26), a, l, u;
+	i[0] === e ? (a = i[1], l = i[2], u = i[3]) : ({className: a, invalid: l, ...u} = e, i[0] = e, i[1] = a, i[2] = l, i[3] = u);
+	let d, f, p, m, h, g, _;
+	if (i[4] !== a || i[5] !== l || i[6] !== u) {
+		let e = o();
+		f = n, m = u, h = e.root({ class: a }), g = "radio", i[14] === l ? _ = i[15] : (_ = t({ invalid: l }), i[14] = l, i[15] = _), d = r, p = e.indicator(), i[4] = a, i[5] = l, i[6] = u, i[7] = d, i[8] = f, i[9] = p, i[10] = m, i[11] = h, i[12] = g, i[13] = _;
+	} else d = i[7], f = i[8], p = i[9], m = i[10], h = i[11], g = i[12], _ = i[13];
+	let v;
+	i[16] !== d || i[17] !== p ? (v = /* @__PURE__ */ s(d, {
+		className: p,
+		"data-ox-slot": "radio-indicator",
+		keepMounted: !0
+	}), i[16] = d, i[17] = p, i[18] = v) : v = i[18];
+	let y;
+	return i[19] !== f || i[20] !== m || i[21] !== h || i[22] !== g || i[23] !== _ || i[24] !== v ? (y = /* @__PURE__ */ s(f, {
+		...m,
+		className: h,
+		"data-ox-slot": g,
+		..._,
+		children: v
+	}), i[19] = f, i[20] = m, i[21] = h, i[22] = g, i[23] = _, i[24] = v, i[25] = y) : y = i[25], y;
+}
+function u(e) {
+	let t = (0, c.c)(10), n, r, o;
+	t[0] === e ? (n = t[1], r = t[2], o = t[3]) : ({className: n, orientation: r, ...o} = e, t[0] = e, t[1] = n, t[2] = r, t[3] = o);
+	let l;
+	t[4] !== n || t[5] !== r ? (l = a({
+		orientation: r,
+		class: n
+	}), t[4] = n, t[5] = r, t[6] = l) : l = t[6];
+	let u;
+	return t[7] !== o || t[8] !== l ? (u = /* @__PURE__ */ s(i, {
+		...o,
+		className: l,
+		"data-ox-slot": "radio-group"
+	}), t[7] = o, t[8] = l, t[9] = u) : u = t[9], u;
+}
+//#endregion
+export { l as OxRadio, u as OxRadioGroup };

package/dist/components/Radio/Radio.styles.d.ts

@@ -0,0 +1,49 @@
+import { VariantProps } from '../../internal/tv';
+export declare const radioVariants: import('tailwind-variants').TVReturnType<{
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            root?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import('tailwind-merge').ClassNameValue | {
+            root?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string[];
+    indicator: string[];
+}, undefined, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            root?: import('tailwind-merge').ClassNameValue;
+            indicator?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string[];
+    indicator: string[];
+}, import('tailwind-variants').TVReturnType<unknown, {
+    root: string[];
+    indicator: string[];
+}, undefined, unknown, unknown, undefined>>;
+export declare const radioGroupVariants: import('tailwind-variants').TVReturnType<{
+    orientation: {
+        vertical: string;
+        horizontal: string;
+    };
+}, undefined, string[], {
+    orientation: {
+        vertical: string;
+        horizontal: string;
+    };
+}, undefined, import('tailwind-variants').TVReturnType<{
+    orientation: {
+        vertical: string;
+        horizontal: string;
+    };
+}, undefined, string[], unknown, unknown, undefined>>;
+export type RadioGroupVariants = VariantProps<typeof radioGroupVariants>;

package/dist/components/Radio/Radio.styles.js

@@ -0,0 +1,27 @@
+import { tv as e } from "../../internal/tv.js";
+import { choiceBox as t, choiceControl as n } from "../../internal/styles/choiceControlStyles.js";
+//#region src/components/Radio/Radio.styles.ts
+var r = e({ slots: {
+	root: [
+		"group/radio",
+		...t,
+		...n,
+		"rounded-full",
+		"before:absolute before:inset-[calc(var(--ox-radio-hit-inset,_0.5rem)_*_-1)] before:content-['']",
+		"data-checked:border-primary"
+	],
+	indicator: [
+		"size-1.75 rounded-full bg-primary pointer-coarse:size-2.25",
+		"transition-[scale] duration-150 ease-out-quint motion-reduce:transition-none",
+		"data-unchecked:scale-0"
+	]
+} }), i = e({
+	base: ["flex", "ox-disabled:cursor-not-allowed"],
+	variants: { orientation: {
+		vertical: "flex-col gap-3",
+		horizontal: "flex-row flex-wrap gap-4.5"
+	} },
+	defaultVariants: { orientation: "vertical" }
+});
+//#endregion
+export { i as radioGroupVariants, r as radioVariants };

package/dist/components/Radio/Radio.types.d.ts

@@ -0,0 +1,10 @@
+import { RadioRootProps as BaseRadioRootProps } from '@base-ui/react/radio';
+import { RadioGroupProps as BaseRadioGroupProps } from '@base-ui/react/radio-group';
+import { RadioGroupVariants } from './Radio.styles';
+export interface OxRadioProps extends Omit<BaseRadioRootProps, 'className'> {
+    className?: string;
+    invalid?: boolean;
+}
+export interface OxRadioGroupProps extends Omit<BaseRadioGroupProps, 'className'>, RadioGroupVariants {
+    className?: string;
+}

package/dist/components/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export { OxRadio, OxRadioGroup } from './Radio';
+export type { OxRadioGroupProps, OxRadioProps } from './Radio.types';

package/dist/components/ScrollArea/ScrollArea.css

@@ -0,0 +1 @@
+[data-ox-slot=scroll-area-viewport]{--ox-scroll-area-fade-size:2.25rem;scrollbar-width:none}[data-ox-slot=scroll-area-viewport]::-webkit-scrollbar{display:none}[data-ox-slot=scroll-area-viewport][data-fade=vertical]{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%)}[data-ox-slot=scroll-area-viewport][data-fade=horizontal]{-webkit-mask-image:linear-gradient(to right, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);mask-image:linear-gradient(to right, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%)}[dir=rtl] [data-ox-slot=scroll-area-viewport][data-fade=horizontal]{-webkit-mask-image:linear-gradient(to left, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);mask-image:linear-gradient(to left, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%)}[data-ox-slot=scroll-area-viewport][data-fade=both]{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%), linear-gradient(to right, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%), linear-gradient(to right, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}[dir=rtl] [data-ox-slot=scroll-area-viewport][data-fade=both]{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%), linear-gradient(to left, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-y-end,0px))), transparent 100%), linear-gradient(to left, transparent 0, black min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-start,0px)), black calc(100% - min(var(--ox-scroll-area-fade-size), var(--scroll-area-overflow-x-end,0px))), transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}

package/dist/components/ScrollArea/ScrollArea.d.ts

@@ -0,0 +1,3 @@
+import { OxScrollAreaProps } from './ScrollArea.types';
+declare function OxScrollArea({ children, className, contentClassName, cornerClassName, fade, keepMounted, orientation, scrollbarClassName, thumbClassName, viewportClassName, viewportRef, ...props }: OxScrollAreaProps): import("react").JSX.Element;
+export { OxScrollArea };

package/dist/components/ScrollArea/ScrollArea.styles.d.ts

@@ -0,0 +1,55 @@
+export declare const scrollAreaVariants: import('tailwind-variants').TVReturnType<{
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            scrollbar?: import('tailwind-merge').ClassNameValue;
+            viewport?: import('tailwind-merge').ClassNameValue;
+            corner?: import('tailwind-merge').ClassNameValue;
+            thumb?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            scrollbar?: import('tailwind-merge').ClassNameValue;
+            viewport?: import('tailwind-merge').ClassNameValue;
+            corner?: import('tailwind-merge').ClassNameValue;
+            thumb?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string;
+    viewport: string[];
+    content: string;
+    scrollbar: string[];
+    thumb: string[];
+    corner: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            root?: import('tailwind-merge').ClassNameValue;
+            scrollbar?: import('tailwind-merge').ClassNameValue;
+            viewport?: import('tailwind-merge').ClassNameValue;
+            corner?: import('tailwind-merge').ClassNameValue;
+            thumb?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    root: string;
+    viewport: string[];
+    content: string;
+    scrollbar: string[];
+    thumb: string[];
+    corner: string;
+}, import('tailwind-variants').TVReturnType<unknown, {
+    root: string;
+    viewport: string[];
+    content: string;
+    scrollbar: string[];
+    thumb: string[];
+    corner: string;
+}, undefined, unknown, unknown, undefined>>;

package/dist/components/ScrollArea/ScrollArea.styles.js

@@ -0,0 +1,18 @@
+import { tv as e } from "../../internal/tv.js";
+//#region src/components/ScrollArea/ScrollArea.styles.ts
+var t = e({ slots: {
+	root: "group/scroll-area relative overflow-hidden rounded-[inherit]",
+	viewport: ["size-full overscroll-contain rounded-[inherit]", "focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-primary-ink"],
+	content: "",
+	scrollbar: [
+		"flex touch-none select-none p-0.5",
+		"opacity-0 transition-opacity duration-200 ease-out-quint",
+		"data-[scrolling]:opacity-100 group-hover/scroll-area:opacity-100 data-[hovering]:opacity-100",
+		"data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2.5",
+		"data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-col"
+	],
+	thumb: ["relative flex-1 rounded-full bg-scrollbar-thumb transition-colors hover:bg-scrollbar-thumb-hover", "data-[orientation=vertical]:min-h-6 data-[orientation=horizontal]:min-w-6"],
+	corner: "bg-transparent"
+} });
+//#endregion
+export { t as scrollAreaVariants };

package/dist/components/ScrollArea/ScrollArea.types.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode, Ref } from 'react';
+import { ScrollAreaRootProps as BaseScrollAreaRootProps } from '@base-ui/react/scroll-area';
+export type OxScrollAreaOrientation = 'vertical' | 'horizontal' | 'both';
+export interface OxScrollAreaProps extends Omit<BaseScrollAreaRootProps, 'className' | 'children'> {
+    children?: ReactNode;
+    className?: string;
+    contentClassName?: string;
+    cornerClassName?: string;
+    fade?: boolean;
+    keepMounted?: boolean;
+    orientation?: OxScrollAreaOrientation;
+    scrollbarClassName?: string;
+    thumbClassName?: string;
+    viewportClassName?: string;
+    viewportRef?: Ref<HTMLDivElement>;
+}

package/dist/components/ScrollArea/ScrollArea2.js

@@ -0,0 +1,65 @@
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import { ScrollAreaRoot as t } from "../../node_modules/@base-ui/react/scroll-area/root/ScrollAreaRoot.js";
+import { ScrollAreaViewport as n } from "../../node_modules/@base-ui/react/scroll-area/viewport/ScrollAreaViewport.js";
+import { ScrollAreaScrollbar as r } from "../../node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbar.js";
+import { ScrollAreaContent as i } from "../../node_modules/@base-ui/react/scroll-area/content/ScrollAreaContent.js";
+import { ScrollAreaThumb as a } from "../../node_modules/@base-ui/react/scroll-area/thumb/ScrollAreaThumb.js";
+import { ScrollAreaCorner as o } from "../../node_modules/@base-ui/react/scroll-area/corner/ScrollAreaCorner.js";
+import './ScrollArea.css';/* empty css           */
+import { scrollAreaVariants as s } from "./ScrollArea.styles.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/ScrollArea/ScrollArea.tsx
+var u = e();
+function d(e) {
+	let d = (0, u.c)(28), f, p, m, h, g, _, v, y, b, x, S, C;
+	d[0] === e ? (f = d[1], p = d[2], m = d[3], h = d[4], g = d[5], _ = d[6], v = d[7], y = d[8], b = d[9], x = d[10], S = d[11], C = d[12]) : ({children: f, className: p, contentClassName: m, cornerClassName: h, fade: v, keepMounted: y, orientation: b, scrollbarClassName: _, thumbClassName: x, viewportClassName: S, viewportRef: C, ...g} = e, d[0] = e, d[1] = f, d[2] = p, d[3] = m, d[4] = h, d[5] = g, d[6] = _, d[7] = v, d[8] = y, d[9] = b, d[10] = x, d[11] = S, d[12] = C);
+	let w = v === void 0 ? !1 : v, T = y === void 0 ? !1 : y, E = b === void 0 ? "vertical" : b, D = E === "vertical" || E === "both", O = E === "horizontal" || E === "both", k = w ? E : void 0, A;
+	if (d[13] !== f || d[14] !== p || d[15] !== m || d[16] !== h || d[17] !== k || d[18] !== O || d[19] !== D || d[20] !== T || d[21] !== E || d[22] !== g || d[23] !== _ || d[24] !== x || d[25] !== S || d[26] !== C) {
+		let e = s();
+		A = /* @__PURE__ */ l(t, {
+			...g,
+			className: e.root({ class: p }),
+			"data-ox-slot": "scroll-area",
+			children: [
+				/* @__PURE__ */ c(n, {
+					className: e.viewport({ class: S }),
+					"data-fade": k,
+					"data-ox-slot": "scroll-area-viewport",
+					ref: C,
+					children: /* @__PURE__ */ c(i, {
+						className: e.content({ class: m }),
+						"data-ox-slot": "scroll-area-content",
+						children: f
+					})
+				}),
+				D && /* @__PURE__ */ c(r, {
+					className: e.scrollbar({ class: _ }),
+					"data-ox-slot": "scroll-area-scrollbar",
+					keepMounted: T,
+					orientation: "vertical",
+					children: /* @__PURE__ */ c(a, {
+						className: e.thumb({ class: x }),
+						"data-ox-slot": "scroll-area-thumb"
+					})
+				}),
+				O && /* @__PURE__ */ c(r, {
+					className: e.scrollbar({ class: _ }),
+					"data-ox-slot": "scroll-area-scrollbar",
+					keepMounted: T,
+					orientation: "horizontal",
+					children: /* @__PURE__ */ c(a, {
+						className: e.thumb({ class: x }),
+						"data-ox-slot": "scroll-area-thumb"
+					})
+				}),
+				E === "both" && /* @__PURE__ */ c(o, {
+					className: e.corner({ class: h }),
+					"data-ox-slot": "scroll-area-corner"
+				})
+			]
+		}), d[13] = f, d[14] = p, d[15] = m, d[16] = h, d[17] = k, d[18] = O, d[19] = D, d[20] = T, d[21] = E, d[22] = g, d[23] = _, d[24] = x, d[25] = S, d[26] = C, d[27] = A;
+	} else A = d[27];
+	return A;
+}
+//#endregion
+export { d as OxScrollArea };

package/dist/components/ScrollArea/index.d.ts

@@ -0,0 +1,2 @@
+export { OxScrollArea } from './ScrollArea';
+export type { OxScrollAreaOrientation, OxScrollAreaProps } from './ScrollArea.types';

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,10 @@
+import { OxSelectContentProps, OxSelectGroupLabelProps, OxSelectGroupProps, OxSelectItemProps, OxSelectProps, OxSelectSeparatorProps, OxSelectTriggerProps, OxSelectValueProps } from './Select.types';
+declare function OxSelectRoot<Value = string, Multiple extends boolean | undefined = false>({ children, ...props }: OxSelectProps<Value, Multiple>): import("react").JSX.Element;
+declare function OxSelectTrigger({ children, className, icon, showIcon, ...props }: OxSelectTriggerProps): import("react").JSX.Element;
+declare function OxSelectValue({ className, ...props }: OxSelectValueProps): import("react").JSX.Element;
+declare function OxSelectContent({ children, className, render, ...props }: OxSelectContentProps): import("react").JSX.Element;
+declare function OxSelectItem({ children, className, label, ...props }: OxSelectItemProps): import("react").JSX.Element;
+declare function OxSelectGroup({ className, ...props }: OxSelectGroupProps): import("react").JSX.Element;
+declare function OxSelectGroupLabel({ className, ...props }: OxSelectGroupLabelProps): import("react").JSX.Element;
+declare function OxSelectSeparator({ className, ...props }: OxSelectSeparatorProps): import("react").JSX.Element;
+export { OxSelectContent, OxSelectGroup, OxSelectGroupLabel, OxSelectItem, OxSelectRoot, OxSelectSeparator, OxSelectTrigger, OxSelectValue, };