@cognite/aura 0.3.2 → 0.3.4

package/dist/components/ui/core/calendar/calendar.js

@@ -0,0 +1,68 @@
+import { cn as e } from "../../../../lib/utils.js";
+import { CalendarHeader as t } from "./calendar-header.js";
+import { getCalendarDays as n, getWeekNumbers as r, getWeekdayNames as i, isDateInRange as a, isOutsideMonth as o, isSameDay as s, isToday as c } from "./calendar-utils.js";
+import l from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region libs/aura/src/components/ui/core/calendar/calendar.tsx
+function f({ isOutsideMonth: t, isSelected: n, isToday: r, isRangeStart: i, isRangeEnd: a, isInRange: o, isInHoverRange: s }) {
+	return e("w-9 h-9 flex items-center justify-center text-sm font-medium cursor-pointer select-none relative transition-colors", "focus-visible:ring-2 focus-visible:ring-border focus-visible:outline-none", i && a && "rounded-lg", i && !a && "rounded-l-lg", a && !i && "rounded-r-lg", n && "bg-primary-background text-foreground-on-primary hover:bg-primary-background", !n && t && "text-muted-foreground/50", !n && !t && (o || s) ? "text-foreground" : !n && !t && "text-secondary-foreground", !n && (o || s) && "bg-accent-background", !n && "hover:bg-accent-background hover:rounded-lg hover:text-foreground", r && !n && "border border-border rounded-lg");
+}
+var p = ({ displayedMonth: p, selectedRange: m, hoverDate: h, displayWeekNumber: g = !1, onDateClick: _, onMonthChange: v, onDateHover: y, className: b }) => {
+	let [x, S] = m, C = n(p), w = i(), T = g ? r(C) : [], E = () => {
+		v(p.subtract(1, "month"));
+	}, D = () => {
+		v(p.add(1, "month"));
+	}, O = (e) => {
+		let t = {
+			isOutsideMonth: o(e, p),
+			isToday: c(e),
+			isSelected: s(e, x) || s(e, S),
+			isRangeStart: s(e, x),
+			isRangeEnd: s(e, S),
+			isInRange: a(e, x, S),
+			isInHoverRange: !1
+		};
+		return h && x && !S && (t.isInHoverRange = a(e, x.isBefore(h) ? x : h, x.isBefore(h) ? h : x)), t;
+	};
+	return /* @__PURE__ */ d("div", {
+		"data-slot": "calendar",
+		className: e("flex flex-col gap-4", b),
+		children: [/* @__PURE__ */ u(t, {
+			displayedMonth: p,
+			onPrevMonth: E,
+			onNextMonth: D,
+			onMonthChange: v
+		}), /* @__PURE__ */ d("div", {
+			className: e("grid gap-0", g ? "grid-cols-calendar-weeks" : "grid-cols-calendar"),
+			children: [
+				g && /* @__PURE__ */ u("div", {
+					className: "text-xs font-semibold text-muted-foreground text-center py-2 px-1",
+					children: "#"
+				}),
+				w.map((e) => /* @__PURE__ */ u("div", {
+					className: "text-xs font-medium text-muted-foreground text-center py-2 px-1 tracking-tighter",
+					children: e
+				}, e)),
+				C.map((e, t) => {
+					let n = O(e), r = Math.floor(t / 7), i = g && t % 7 == 0, a = `day-${e.format("YYYY-MM-DD")}`;
+					return /* @__PURE__ */ d(l.Fragment, { children: [i && /* @__PURE__ */ u("div", {
+						className: "text-xs text-muted-foreground text-center flex items-center justify-center h-9",
+						children: T[r]
+					}), /* @__PURE__ */ u("div", {
+						className: f(n),
+						onClick: () => _(e),
+						onMouseEnter: () => y?.(e),
+						onMouseLeave: () => y?.(null),
+						role: "gridcell",
+						tabIndex: 0,
+						"aria-label": e.format("DD MMMM YYYY"),
+						"aria-selected": n.isSelected,
+						children: e.date()
+					})] }, a);
+				})
+			]
+		})]
+	});
+};
+//#endregion
+export { p as Calendar };

package/dist/components/ui/core/calendar/constants.d.ts

@@ -0,0 +1 @@
+export declare const DAYS_IN_WEEK = 7;

package/dist/components/ui/core/card/card.js

@@ -1,187 +1,104 @@
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { forwardRef as d } from "react";
-import { IconDotsVertical as l } from "@tabler/icons-react";
-import { cn as s } from "../../../../lib/utils.js";
-import { Button as c } from "../button/button.js";
-import { DropdownMenu as i, DropdownMenuTrigger as m, DropdownMenuContent as f } from "../dropdown-menu/dropdown-menu.js";
-const p = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card",
-      className: s(
-        "bg-card-background text-foreground flex flex-col rounded-xl p-4 gap-4",
-        t
-      ),
-      ...r
-    }
-  )
-);
-p.displayName = "Card";
-const u = d(
-  ({ className: t, children: r, ...a }, o) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: o,
-      "data-slot": "card-header-start",
-      className: s(
-        "col-start-1 row-start-1 h-12 self-stretch pt-1.5",
-        t
-      ),
-      ...a,
-      children: /* @__PURE__ */ e("div", { className: "flex items-start h-full", children: r })
-    }
-  )
-);
+import { cn as e } from "../../../../lib/utils.js";
+import { Button as t } from "../button/button.js";
+import { DropdownMenu as n, DropdownMenuContent as r, DropdownMenuTrigger as i } from "../dropdown-menu/dropdown-menu.js";
+import { forwardRef as a } from "react";
+import { IconDotsVertical as o } from "@tabler/icons-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region libs/aura/src/components/ui/core/card/card.tsx
+var l = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card",
+	className: e("bg-card-background text-foreground flex flex-col rounded-xl p-4 gap-4", t),
+	...n
+}));
+l.displayName = "Card";
+var u = a(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ s("div", {
+	ref: i,
+	"data-slot": "card-header-start",
+	className: e("col-start-1 row-start-1 h-12 self-stretch pt-1.5", t),
+	...r,
+	children: /* @__PURE__ */ s("div", {
+		className: "flex items-start h-full",
+		children: n
+	})
+}));
 u.displayName = "CardHeaderStart";
-const C = d(({ className: t, as: r = "h3", ...a }, o) => /* @__PURE__ */ e(
-  r,
-  {
-    ref: o,
-    "data-slot": "card-title",
-    className: s(
-      "tracking-tightest text-foreground font-medium text-lg leading-6 line-clamp-2 overflow-hidden",
-      t
-    ),
-    ...a
-  }
-));
-C.displayName = "CardTitle";
-const g = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "p",
-    {
-      ref: a,
-      "data-slot": "card-description",
-      className: s(
-        "text-muted-foreground text-sm font-normal leading-5 tracking-tight line-clamp-2 overflow-hidden",
-        t
-      ),
-      ...r
-    }
-  )
-);
-g.displayName = "CardDescription";
-const x = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-header-end",
-      className: s(
-        "col-start-3 row-start-1 self-start justify-self-end flex justify-end items-start gap-1",
-        t
-      ),
-      ...r
-    }
-  )
-);
-x.displayName = "CardHeaderEnd";
-const N = d(
-  ({ className: t, children: r, ...a }, o) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: o,
-      "data-slot": "card-header",
-      className: s(
-        "group/card-header @container/card-header grid items-center gap-x-3 grid-cols-[auto_minmax(0,1fr)_auto]",
-        t
-      ),
-      ...a,
-      children: r
-    }
-  )
-);
-N.displayName = "CardHeader";
-const h = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-header-center",
-      className: s(
-        "col-start-1 row-start-1 min-w-0 flex flex-col justify-center",
-        "group-has-data-[slot=card-header-start]/card-header:col-start-2",
-        t
-      ),
-      ...r
-    }
-  )
-);
+var d = a(({ className: t, as: n = "h3", ...r }, i) => /* @__PURE__ */ s(n, {
+	ref: i,
+	"data-slot": "card-title",
+	className: e("tracking-tightest text-foreground font-medium text-lg leading-6 line-clamp-2 overflow-hidden", t),
+	...r
+}));
+d.displayName = "CardTitle";
+var f = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("p", {
+	ref: r,
+	"data-slot": "card-description",
+	className: e("text-muted-foreground text-sm font-normal leading-5 tracking-tight line-clamp-2 overflow-hidden", t),
+	...n
+}));
+f.displayName = "CardDescription";
+var p = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-header-end",
+	className: e("col-start-3 row-start-1 self-start justify-self-end flex justify-end items-start gap-1", t),
+	...n
+}));
+p.displayName = "CardHeaderEnd";
+var m = a(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ s("div", {
+	ref: i,
+	"data-slot": "card-header",
+	className: e("group/card-header @container/card-header grid items-center gap-x-3 grid-cols-[auto_minmax(0,1fr)_auto]", t),
+	...r,
+	children: n
+}));
+m.displayName = "CardHeader";
+var h = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-header-center",
+	className: e("col-start-1 row-start-1 min-w-0 flex flex-col justify-center", "group-has-data-[slot=card-header-start]/card-header:col-start-2", t),
+	...n
+}));
 h.displayName = "CardHeaderCenter";
-const y = d(({ children: t, align: r = "end", ...a }, o) => /* @__PURE__ */ n(i, { ...a, children: [
-  /* @__PURE__ */ e(
-    m,
-    {
-      render: /* @__PURE__ */ e(c, { variant: "ghost", size: "icon-sm", ref: o, children: /* @__PURE__ */ e(l, {}) })
-    }
-  ),
-  /* @__PURE__ */ e(f, { align: r, children: t })
-] }));
-y.displayName = "CardActions";
-const v = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-content",
-      className: s(
-        "text-secondary-foreground flex flex-col items-start gap-4 self-stretch",
-        t
-      ),
-      ...r
-    }
-  )
-);
-v.displayName = "CardContent";
-const w = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-footer",
-      className: s("flex items-center gap-4 self-stretch", t),
-      ...r
-    }
-  )
-);
-w.displayName = "CardFooter";
-const H = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-footer-start",
-      className: s("flex-1 flex items-start justify-start gap-2", t),
-      ...r
-    }
-  )
-);
-H.displayName = "CardFooterStart";
-const j = d(
-  ({ className: t, ...r }, a) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: a,
-      "data-slot": "card-footer-end",
-      className: s("flex items-center justify-end", t),
-      ...r
-    }
-  )
-);
-j.displayName = "CardFooterEnd";
-export {
-  p as Card,
-  y as CardActions,
-  v as CardContent,
-  g as CardDescription,
-  w as CardFooter,
-  j as CardFooterEnd,
-  H as CardFooterStart,
-  N as CardHeader,
-  h as CardHeaderCenter,
-  x as CardHeaderEnd,
-  u as CardHeaderStart,
-  C as CardTitle
-};
+var g = a(({ children: e, align: a = "end", ...l }, u) => /* @__PURE__ */ c(n, {
+	...l,
+	children: [/* @__PURE__ */ s(i, { render: /* @__PURE__ */ s(t, {
+		variant: "ghost",
+		size: "icon-sm",
+		ref: u,
+		children: /* @__PURE__ */ s(o, {})
+	}) }), /* @__PURE__ */ s(r, {
+		align: a,
+		children: e
+	})]
+}));
+g.displayName = "CardActions";
+var _ = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-content",
+	className: e("text-secondary-foreground flex flex-col items-start gap-4 self-stretch", t),
+	...n
+}));
+_.displayName = "CardContent";
+var v = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-footer",
+	className: e("flex items-center gap-4 self-stretch", t),
+	...n
+}));
+v.displayName = "CardFooter";
+var y = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-footer-start",
+	className: e("flex-1 flex items-start justify-start gap-2", t),
+	...n
+}));
+y.displayName = "CardFooterStart";
+var b = a(({ className: t, ...n }, r) => /* @__PURE__ */ s("div", {
+	ref: r,
+	"data-slot": "card-footer-end",
+	className: e("flex items-center justify-end", t),
+	...n
+}));
+b.displayName = "CardFooterEnd";
+//#endregion
+export { l as Card, g as CardActions, _ as CardContent, f as CardDescription, v as CardFooter, b as CardFooterEnd, y as CardFooterStart, m as CardHeader, h as CardHeaderCenter, p as CardHeaderEnd, u as CardHeaderStart, d as CardTitle };