@jfrader/ui 0.5.0 → 0.5.1

package/dist/badge-B_sLygxU.js

@@ -1,108 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { vars as n } from "@jfrader/tokens/vars";
-import { jsx as r, jsxs as i } from "@emotion/react/jsx-runtime";
-//#region src/components/badge/badge.tsx
-var a = 99, o = e({
-	position: "relative",
-	display: "inline-flex",
-	flexShrink: 0,
-	verticalAlign: "middle"
-}), s = e({
-	position: "absolute",
-	display: "flex",
-	alignItems: "center",
-	justifyContent: "center",
-	boxSizing: "border-box",
-	boxShadow: `0 0 0 2px ${n.color.bg}`,
-	fontWeight: n.fontWeight.medium,
-	lineHeight: 1,
-	whiteSpace: "nowrap",
-	pointerEvents: "none"
-}), c = {
-	standard: e({
-		blockSize: n.space[5],
-		minInlineSize: n.space[5],
-		paddingInline: n.space[1],
-		fontSize: n.textSize.xs
-	}),
-	dot: e({
-		blockSize: n.space[2],
-		inlineSize: n.space[2],
-		borderRadius: n.radius.full
-	})
-}, l = {
-	rectangular: e({ borderRadius: n.radius.sm }),
-	circular: e({ borderRadius: n.radius.full })
-}, u = {
-	"top-start": e({
-		insetBlockStart: 0,
-		insetInlineStart: 0,
-		transform: "translate(-50%, -50%)",
-		"&:dir(rtl)": { transform: "translate(50%, -50%)" }
-	}),
-	"top-end": e({
-		insetBlockStart: 0,
-		insetInlineEnd: 0,
-		transform: "translate(50%, -50%)",
-		"&:dir(rtl)": { transform: "translate(-50%, -50%)" }
-	}),
-	"bottom-start": e({
-		insetBlockEnd: 0,
-		insetInlineStart: 0,
-		transform: "translate(-50%, 50%)",
-		"&:dir(rtl)": { transform: "translate(50%, 50%)" }
-	}),
-	"bottom-end": e({
-		insetBlockEnd: 0,
-		insetInlineEnd: 0,
-		transform: "translate(50%, 50%)",
-		"&:dir(rtl)": { transform: "translate(-50%, 50%)" }
-	})
-}, d = {
-	accent: e({
-		backgroundColor: n.color.accent,
-		color: n.color.accentContrast
-	}),
-	danger: e({
-		backgroundColor: n.color.danger,
-		color: n.color.dangerContrast
-	}),
-	neutral: e({
-		backgroundColor: n.color.textMuted,
-		color: n.color.bg
-	})
-};
-function f({ ref: e, children: n, badgeContent: f, max: p = a, showZero: m = !1, invisible: h = !1, variant: g = "standard", tone: _ = "accent", anchor: v, overlap: y = "rectangular", slotProps: b, className: x, sx: S, ...C }) {
-	let w = g === "dot", T = h || g !== "dot" && (f == null || f === !1 || f === 0 && !m), E = typeof f == "number" && f > p ? `${p}+` : f, D = `${v?.vertical ?? "top"}-${v?.horizontal ?? "end"}`, O = [x, b?.root?.className].filter(Boolean).join(" ") || void 0;
-	return /* @__PURE__ */ r(t, {
-		className: O,
-		styles: [o, b?.root?.css],
-		sx: S,
-		children: (t) => /* @__PURE__ */ i("span", {
-			...C,
-			ref: e,
-			"data-ui": "badge",
-			className: t,
-			children: [n, !T && /* @__PURE__ */ r("span", {
-				"data-ui": "badge-marker",
-				"data-variant": g,
-				"data-tone": _,
-				"aria-hidden": w ? "true" : void 0,
-				className: b?.badge?.className,
-				css: [
-					s,
-					c[g],
-					!w && l[y],
-					u[D],
-					d[_],
-					b?.badge?.css
-				],
-				children: w ? null : E
-			})]
-		})
-	});
-}
-f.displayName = "Badge";
-//#endregion
-export { f as t };

package/dist/card-D-aI2QHx.js

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