@jfrader/ui 0.5.1 → 0.6.0

package/dist/card-Ca4KQKYQ.js

@@ -1,154 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./surface-DZ4d-2aL.js";
-import { createContext as r, useContext as i } from "react";
-import { vars as a } from "@jfrader/tokens/vars";
-import { jsx as o } from "@emotion/react/jsx-runtime";
-//#region src/components/card/card.tsx
-var s = r(void 0);
-function c(...e) {
-	return e.filter(Boolean).join(" ") || void 0;
-}
-var l = e({
-	...n,
-	minInlineSize: 0,
-	borderRadius: a.radius.lg,
-	paddingBlock: a.space[4],
-	paddingInline: a.space[5]
-}), u = {
-	flat: e({ boxShadow: "none" }),
-	raised: e({ boxShadow: a.shadow.raised })
-}, d = e({
-	display: "grid",
-	gap: a.space[1],
-	marginBlockEnd: a.space[4]
-}), f = e({
-	margin: 0,
-	fontSize: a.textSize.md,
-	fontWeight: a.fontWeight.semibold,
-	lineHeight: a.lineHeight.tight,
-	color: a.color.text
-}), p = e({
-	margin: 0,
-	fontSize: a.textSize.sm,
-	color: a.color.textMuted
-}), m = e({
-	fontSize: a.textSize.sm,
-	color: a.color.text
-}), h = e({
-	display: "flex",
-	flexWrap: "wrap",
-	alignItems: "center",
-	justifyContent: "space-between",
-	gap: a.space[2],
-	marginBlockStart: a.space[4],
-	paddingBlockStart: a.space[4],
-	borderBlockStart: `1px solid ${a.color.borderSubtle}`,
-	"& > :only-child": { marginInlineStart: "auto" }
-});
-function g({ ref: e, variant: n = "raised", slotProps: r, className: i, sx: a, ...d }) {
-	return /* @__PURE__ */ o(s.Provider, {
-		value: r,
-		children: /* @__PURE__ */ o(t, {
-			className: c(r?.root?.className, i),
-			styles: [
-				l,
-				u[n],
-				r?.root?.css
-			],
-			sx: a,
-			children: (t) => /* @__PURE__ */ o("div", {
-				...d,
-				ref: e,
-				"data-ui": "card",
-				"data-variant": n,
-				className: t
-			})
-		})
-	});
-}
-g.displayName = "Card";
-function _({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.header;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [d, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-header",
-			className: t
-		})
-	});
-}
-_.displayName = "Card.Header";
-function v({ ref: e, level: n = 3, className: r, sx: a, ...l }) {
-	let u = i(s)?.title, d = `h${n}`;
-	return /* @__PURE__ */ o(t, {
-		className: c(u?.className, r),
-		styles: [f, u?.css],
-		sx: a,
-		children: (t) => /* @__PURE__ */ o(d, {
-			...l,
-			ref: e,
-			"data-ui": "card-title",
-			className: t
-		})
-	});
-}
-v.displayName = "Card.Title";
-function y({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.description;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [p, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("p", {
-			...a,
-			ref: e,
-			"data-ui": "card-description",
-			className: t
-		})
-	});
-}
-y.displayName = "Card.Description";
-function b({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.content;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [m, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-content",
-			className: t
-		})
-	});
-}
-b.displayName = "Card.Content";
-function x({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.footer;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [h, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-footer",
-			className: t
-		})
-	});
-}
-x.displayName = "Card.Footer";
-var S = Object.assign(g, {
-	Header: _,
-	Title: v,
-	Description: y,
-	Content: b,
-	Footer: x
-});
-//#endregion
-export { S as t };

package/dist/command-palette-BmQu2w4H.js

@@ -1,391 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { t as n } from "./focus-ring-BK5W5_NY.js";
-import { t as r } from "./use-controlled-state-DpeVQZNR.js";
-import { t as i } from "./visually-hidden-BJdvqqvn.js";
-import { t as a } from "./renderable-DzcIj1Lo.js";
-import { n as o, t as s } from "./surface-DZ4d-2aL.js";
-import { t as c } from "./trigger-style-B1KVC8O1.js";
-import { t as l } from "./overlay-layer-qEbpEtb8.js";
-import { i as u, r as d, t as f } from "./use-native-dialog-DWpIUVO1.js";
-import { n as p, t as m } from "./listbox-style-WX-RASp1.js";
-import { a as h, r as g, t as _ } from "./collection-registry-k6JcD3Jr.js";
-import { createContext as v, useCallback as y, useContext as b, useId as x, useMemo as S, useRef as C, useState as w } from "react";
-import { vars as T } from "@jfrader/tokens/vars";
-import { jsx as E, jsxs as D } from "@emotion/react/jsx-runtime";
-import { FloatingList as O, useFloatingRootContext as k, useInteractions as A, useListNavigation as j, useMergeRefs as M } from "@floating-ui/react";
-//#region src/components/command-palette/command-palette.styles.ts
-var N = e({
-	...s,
-	marginBlockStart: T.space[12]
-}), P = e({
-	...o,
-	display: "flex",
-	flexDirection: "column",
-	borderRadius: T.radius.lg,
-	boxShadow: T.shadow.floating,
-	inlineSize: "min(560px, calc(100vw - 32px))"
-}), F = e({
-	boxSizing: "border-box",
-	inlineSize: "100%",
-	blockSize: "48px",
-	margin: 0,
-	border: 0,
-	borderBlockEnd: `1px solid ${T.color.borderControl}`,
-	borderStartStartRadius: T.radius.lg,
-	borderStartEndRadius: T.radius.lg,
-	backgroundColor: "transparent",
-	paddingInline: T.space[4],
-	font: "inherit",
-	fontSize: T.textSize.md,
-	color: T.color.text,
-	"&::placeholder": { color: T.color.textSubtle },
-	"&:focus-visible": { ...n }
-}), I = e({
-	boxSizing: "border-box",
-	display: "flex",
-	flexDirection: "column",
-	maxBlockSize: "320px",
-	overflow: "auto",
-	padding: T.space[1],
-	"&[hidden]": { display: "none" }
-}), L = e({
-	display: "flex",
-	flexDirection: "column",
-	"&[hidden]": { display: "none" }
-}), ee = e({
-	paddingBlock: T.space[1],
-	paddingInline: T.space[2],
-	fontSize: T.textSize.xs,
-	fontWeight: T.fontWeight.medium,
-	color: T.color.textMuted
-}), te = e({
-	minInlineSize: 0,
-	overflowWrap: "anywhere",
-	"&[hidden]": { display: "none" }
-}), R = e({
-	paddingBlock: T.space[6],
-	paddingInline: T.space[4],
-	textAlign: "center",
-	fontSize: T.textSize.sm,
-	color: T.color.textMuted
-}), ne = "Command palette", re = "No results", z = new Intl.PluralRules("en"), ie = (e, t) => e.toLocaleLowerCase().includes(t.toLocaleLowerCase()), ae = (e) => `${e} ${z.select(e) === "one" ? "result" : "results"}`, B = v(null), V = v(null);
-function H(e) {
-	let t = b(B);
-	if (!t) throw Error(`CommandPalette.${e} must be rendered inside <CommandPalette>.`);
-	return t;
-}
-var U = (e) => {
-	e?.setAttribute("autofocus", "");
-};
-function W({ open: e, defaultOpen: t = !1, onOpenChange: n, label: i = ne, filter: a = ie, emptyMessage: o = re, formatResultCount: s = ae, children: c }) {
-	let l = x(), [d = !1, f] = r(e, t, n), { dialogElementRef: p, setDialogElement: m, setOpen: g, requestClose: _, repairToken: v } = u(d, f), [b, T] = w(""), [D, O] = w(!1), [M, N] = w(null), [P, F] = h(), [I, L] = w(null), [ee, te] = w(null), [R, z] = w(d), V = C([]);
-	d !== R && (z(d), d && (T(""), O(!1), N(null)));
-	let H = y(() => {
-		g(!(d && p.current?.open));
-	}, [
-		d,
-		g,
-		p
-	]), { matchedValues: U, matchedIndices: W, visibleGroupIds: G } = S(() => {
-		let e = /* @__PURE__ */ new Set(), t = [], n = /* @__PURE__ */ new Set();
-		return P.forEach((r, i) => {
-			r.index !== -1 && (b === "" || a(r.label, b) || r.keywords !== void 0 && a(r.keywords, b)) && (e.add(i), r.disabled || t.push(r.index), r.groupId !== null && n.add(r.groupId));
-		}), t.sort((e, t) => e - t), {
-			matchedValues: e,
-			matchedIndices: t,
-			visibleGroupIds: n
-		};
-	}, [
-		P,
-		b,
-		a
-	]), K = S(() => new Set(W), [W]), q = M !== null && K.has(M) ? M : W[0] ?? null, J = k({
-		open: d,
-		onOpenChange: (e) => g(e),
-		elements: {
-			reference: I,
-			floating: ee
-		}
-	}), Y = j(J, {
-		listRef: V,
-		activeIndex: q,
-		onNavigate: (e) => {
-			e !== null && N(e);
-		},
-		virtual: !0,
-		loop: !0,
-		focusItemOnOpen: !1,
-		disabledIndices: (e) => !K.has(e)
-	}), { getReferenceProps: X, getFloatingProps: Z, getItemProps: Q } = A([Y]), $ = U.size, oe = D ? s($) : "", se = S(() => ({
-		open: d,
-		setOpen: g,
-		toggleOpen: H,
-		requestClose: _,
-		repairToken: v,
-		setDialogElement: m,
-		label: i,
-		emptyMessage: o,
-		baseId: l,
-		listId: `${l}-list`,
-		query: b,
-		announcement: oe,
-		matchCount: $,
-		matchedValues: U,
-		visibleGroupIds: G,
-		activeIndex: q,
-		elementsRef: V,
-		setInputElement: L,
-		setListElement: te,
-		getReferenceProps: X,
-		getFloatingProps: Z,
-		getItemProps: Q,
-		changeQuery: (e) => {
-			T(e), O(!0), N(null);
-		},
-		moveToEdge: (e) => {
-			let t = e === "first" ? W[0] : W[W.length - 1];
-			t !== void 0 && N(t);
-		},
-		registration: F
-	}), [
-		d,
-		g,
-		H,
-		_,
-		v,
-		m,
-		i,
-		o,
-		l,
-		b,
-		oe,
-		$,
-		U,
-		W,
-		G,
-		q,
-		X,
-		Z,
-		Q,
-		F
-	]);
-	return /* @__PURE__ */ E(B.Provider, {
-		value: se,
-		children: c
-	});
-}
-function G(e) {
-	return /* @__PURE__ */ E(l, { children: /* @__PURE__ */ E(W, { ...e }) });
-}
-G.displayName = "CommandPalette";
-function K({ ref: e, onClick: n, className: r, sx: i, ...a }) {
-	let { open: o, toggleOpen: s } = H("Trigger"), l = (e) => {
-		n?.(e), e.defaultPrevented || s();
-	};
-	return /* @__PURE__ */ E(t, {
-		className: r,
-		styles: c,
-		sx: i,
-		children: (t) => /* @__PURE__ */ E("button", {
-			type: "button",
-			...a,
-			ref: e,
-			"data-ui": "command-palette-trigger",
-			"aria-haspopup": "dialog",
-			"aria-expanded": o,
-			onClick: l,
-			className: t
-		})
-	});
-}
-K.displayName = "CommandPalette.Trigger";
-function q({ ref: e, className: n, sx: r, ...a }) {
-	let { children: o, onCancel: s, onClick: c, onClose: l, ...u } = f(a), p = H("Content"), { label: m, announcement: h } = p, g = d(p, {
-		onCancel: s,
-		onClick: c,
-		onClose: l
-	}, e);
-	return /* @__PURE__ */ E(t, {
-		className: n,
-		styles: N,
-		sx: r,
-		children: (e) => /* @__PURE__ */ E("dialog", {
-			"aria-label": m,
-			...u,
-			...g,
-			"data-ui": "command-palette",
-			"aria-modal": "true",
-			className: e,
-			children: /* @__PURE__ */ D("div", {
-				css: P,
-				children: [o, /* @__PURE__ */ E("div", {
-					role: "status",
-					"aria-live": "polite",
-					"aria-atomic": "true",
-					css: i,
-					children: h
-				})]
-			})
-		})
-	});
-}
-q.displayName = "CommandPalette.Content";
-function J({ ref: e, onChange: n, onKeyDown: r, className: i, sx: a, ...o }) {
-	let { label: s, listId: c, query: l, matchCount: u, activeIndex: d, elementsRef: f, requestClose: p, setInputElement: m, getReferenceProps: h, changeQuery: g, moveToEdge: _ } = H("Input"), v = M([
-		m,
-		U,
-		e
-	]), y = (e) => {
-		n?.(e), g(e.currentTarget.value);
-	}, b = (e) => {
-		r?.(e), !(e.defaultPrevented || e.nativeEvent.isComposing) && (e.key === "Escape" ? (e.preventDefault(), p()) : (e.key === "Home" || e.key === "End") && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey ? (e.preventDefault(), _(e.key === "Home" ? "first" : "last")) : e.key === "Enter" && d !== null && (e.preventDefault(), f.current[d]?.click()));
-	};
-	return /* @__PURE__ */ E(t, {
-		className: i,
-		styles: F,
-		sx: a,
-		children: (e) => /* @__PURE__ */ E("input", {
-			"aria-label": s,
-			autoComplete: "off",
-			spellCheck: !1,
-			...h({
-				...o,
-				onChange: y,
-				onKeyDown: b
-			}),
-			ref: v,
-			type: "text",
-			value: l,
-			role: "combobox",
-			"aria-autocomplete": "list",
-			"aria-expanded": u > 0,
-			"aria-controls": c,
-			"data-ui": "command-palette-input",
-			className: e
-		})
-	});
-}
-J.displayName = "CommandPalette.Input";
-function Y({ ref: e, onMouseDown: n, children: r, className: i, sx: a, ...o }) {
-	let { label: s, listId: c, matchCount: l, elementsRef: u, setListElement: d, getFloatingProps: f } = H("List"), p = M([d, e]), m = (e) => {
-		n?.(e), e.preventDefault();
-	};
-	return /* @__PURE__ */ E(t, {
-		className: i,
-		styles: I,
-		sx: a,
-		children: (e) => /* @__PURE__ */ E("div", {
-			"aria-label": s,
-			...f({
-				...o,
-				onMouseDown: m
-			}),
-			ref: p,
-			id: c,
-			role: "listbox",
-			hidden: l === 0,
-			"data-ui": "command-palette-list",
-			className: e,
-			children: /* @__PURE__ */ E(O, {
-				elementsRef: u,
-				children: r
-			})
-		})
-	});
-}
-Y.displayName = "CommandPalette.List";
-function X({ ref: e, children: n, className: r, sx: i, ...o }) {
-	let { matchCount: s, emptyMessage: c } = H("Empty");
-	return s > 0 ? null : /* @__PURE__ */ E(t, {
-		className: r,
-		styles: R,
-		sx: i,
-		children: (t) => /* @__PURE__ */ E("div", {
-			...o,
-			ref: e,
-			"data-ui": "command-palette-empty",
-			className: t,
-			children: a(n) ? n : c
-		})
-	});
-}
-X.displayName = "CommandPalette.Empty";
-function Z({ ref: e, label: n, children: r, "aria-labelledby": i, className: a, sx: o, ...s }) {
-	let { visibleGroupIds: c } = H("Group"), l = x(), u = `${l}-heading`;
-	return /* @__PURE__ */ E(t, {
-		className: a,
-		styles: L,
-		sx: o,
-		children: (t) => /* @__PURE__ */ D("div", {
-			...s,
-			ref: e,
-			role: "group",
-			"aria-labelledby": [i, u].filter(Boolean).join(" "),
-			hidden: !c.has(l),
-			"data-ui": "command-palette-group",
-			className: t,
-			children: [/* @__PURE__ */ E("div", {
-				id: u,
-				css: ee,
-				children: n
-			}), /* @__PURE__ */ E(V.Provider, {
-				value: l,
-				children: r
-			})]
-		})
-	});
-}
-Z.displayName = "CommandPalette.Group";
-function Q({ ref: e, value: n, onSelect: r, keywords: i, "aria-disabled": a, onClick: o, children: s, className: c, sx: l, ...u }) {
-	let { baseId: d, activeIndex: f, matchedValues: h, getItemProps: v, setOpen: y, registration: x } = H("Item"), S = b(V), w = a === !0 || a === "true", T = C(null), { ref: D, index: O } = g(n, x, T, (e, t) => ({
-		index: e,
-		label: t,
-		disabled: w,
-		keywords: i,
-		groupId: S
-	})), k = M([
-		D,
-		T,
-		e
-	]), A = O !== -1 && f === O, j = (e) => {
-		o?.(e), !(e.defaultPrevented || w) && (r?.(), y(!1));
-	};
-	return /* @__PURE__ */ E(t, {
-		className: c,
-		styles: [
-			p,
-			m,
-			te
-		],
-		sx: l,
-		children: (e) => /* @__PURE__ */ E("div", {
-			...v({
-				id: _(d, n),
-				...u,
-				onClick: j
-			}),
-			ref: k,
-			role: "option",
-			"aria-disabled": a,
-			"aria-selected": A,
-			hidden: !h.has(n),
-			"data-active": A || void 0,
-			"data-ui": "command-palette-item",
-			className: e,
-			children: s
-		})
-	});
-}
-Q.displayName = "CommandPalette.Item";
-var $ = Object.assign(G, {
-	Trigger: K,
-	Content: q,
-	Input: J,
-	List: Y,
-	Empty: X,
-	Group: Z,
-	Item: Q
-});
-//#endregion
-export { $ as t };