@jfrader/ui 0.5.0 → 0.5.1

package/dist/{button-C92uYFJW.js → button-NLY0h6EJ.js}

@@ -33,17 +33,17 @@ var f = "&:hover:not(:disabled):not([aria-disabled=\"true\"])", p = e({
 	[r]: { transitionDuration: "0s" }
 }), m = {
 	sm: e({
-		blockSize: "32px",
+		blockSize: s.space[8],
 		paddingInline: s.space[3],
 		fontSize: s.textSize.sm
 	}),
 	md: e({
-		blockSize: "40px",
+		blockSize: s.space[10],
 		paddingInline: s.space[4],
 		fontSize: s.textSize.sm
 	}),
 	lg: e({
-		blockSize: "48px",
+		blockSize: s.space[12],
 		paddingInline: s.space[5],
 		fontSize: s.textSize.md
 	})
@@ -62,7 +62,7 @@ var f = "&:hover:not(:disabled):not([aria-disabled=\"true\"])", p = e({
 		neutral: e({
 			backgroundColor: s.color.surfaceRaised,
 			color: s.color.text,
-			borderColor: s.color.border,
+			borderColor: s.color.borderControl,
 			[f]: { backgroundColor: s.color.surfaceHover }
 		})
 	},
@@ -86,19 +86,19 @@ var f = "&:hover:not(:disabled):not([aria-disabled=\"true\"])", p = e({
 	outline: {
 		accent: e({
 			backgroundColor: "transparent",
-			borderColor: s.color.accentBorder,
+			borderColor: s.color.borderControl,
 			color: s.color.accentText,
 			[f]: { backgroundColor: s.color.accentSoft }
 		}),
 		danger: e({
 			backgroundColor: "transparent",
-			borderColor: s.color.dangerBorder,
+			borderColor: s.color.borderControl,
 			color: s.color.dangerText,
 			[f]: { backgroundColor: s.color.dangerSoft }
 		}),
 		neutral: e({
 			backgroundColor: "transparent",
-			borderColor: s.color.borderStrong,
+			borderColor: s.color.borderControl,
 			color: s.color.text,
 			[f]: { backgroundColor: s.color.surfaceHover }
 		})

package/dist/button.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Button } from "./button-C92uYFJW.js";
+export { t as Button } from "./button-NLY0h6EJ.js";

package/dist/{calendar-B3Svu0X2.js → calendar-BzJdv_SZ.js}

@@ -85,7 +85,8 @@ var b = e({
 	"&:hover:not(:disabled):not([data-selected]):not([data-in-range])": { backgroundColor: g.color.surfaceHover },
 	"&[data-today]": {
 		borderColor: g.color.borderControl,
-		fontWeight: g.fontWeight.semibold
+		fontWeight: g.fontWeight.semibold,
+		textDecoration: "underline"
 	},
 	"&[data-selected]": {
 		backgroundColor: g.color.accent,
@@ -114,6 +115,7 @@ var b = e({
 		cursor: "not-allowed",
 		textDecoration: "line-through"
 	},
+	"&[data-today]:disabled": { textDecoration: "underline line-through" },
 	"&:focus-visible": { ...n },
 	[r]: {
 		"&[data-in-range], &[data-preview]": { borderColor: "CanvasText" },

package/dist/calendar.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Calendar } from "./calendar-B3Svu0X2.js";
+export { t as Calendar } from "./calendar-BzJdv_SZ.js";

package/dist/card-Ca4KQKYQ.js

@@ -0,0 +1,154 @@
+'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/card.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Card } from "./card-D-aI2QHx.js";
+export { t as Card } from "./card-Ca4KQKYQ.js";