@box-kite/react 2.2.6 → 2.2.7

package/components/dataGrid.mjs

@@ -178,9 +178,9 @@ function R(e) {
 		opacity: i ? .3 : .7,
 		hover: i ? void 0 : {
 			opacity: 1,
-			bgColor: "gray-100"
+			bgColor: "base-100"
 		},
-		theme: { dark: { hover: i ? void 0 : { bgColor: "gray-700" } } },
+		theme: { dark: { hover: i ? void 0 : { bgColor: "base-700" } } },
 		transitionDuration: 150,
 		children: a
 	});
@@ -1678,7 +1678,7 @@ function vt(e) {
 		width: "1rem",
 		height: "1rem",
 		css: { verticalAlign: "middle" },
-		color: t ? void 0 : "gray-400",
+		color: t ? void 0 : "base-400",
 		props: { fill: "none" },
 		children: /* @__PURE__ */ I(d, {
 			d: t ? "m3.5 8.5 3 3 6-7" : "m5 5 6 6m0-6-6 6",
@@ -1910,9 +1910,9 @@ function Dt(e) {
 		gap: 4,
 		py: 16,
 		px: 6,
-		bgColor: "gray-50",
+		bgColor: "base-50",
 		borderRadius: 4,
-		theme: { dark: { bgColor: "gray-900" } },
+		theme: { dark: { bgColor: "base-900" } },
 		children: /* @__PURE__ */ L(h, {
 			d: "column",
 			ai: "center",
@@ -1921,8 +1921,8 @@ function Dt(e) {
 				width: 16,
 				height: 16,
 				borderRadius: 999,
-				bgColor: "gray-200",
-				theme: { dark: { bgColor: "gray-700" } },
+				bgColor: "base-200",
+				theme: { dark: { bgColor: "base-700" } },
 				display: "flex",
 				ai: "center",
 				jc: "center",
@@ -1930,8 +1930,8 @@ function Dt(e) {
 					viewBox: "0 0 24 24",
 					width: "40",
 					fill: "currentColor",
-					color: "gray-400",
-					theme: { dark: { color: "gray-500" } },
+					color: "base-400",
+					theme: { dark: { color: "base-500" } },
 					children: /* @__PURE__ */ I(d, {
 						fillRule: "evenodd",
 						props: { clipRule: "evenodd" },
@@ -1945,14 +1945,14 @@ function Dt(e) {
 				children: [/* @__PURE__ */ I(i, {
 					fontSize: 18,
 					fontWeight: 600,
-					color: "gray-900",
-					theme: { dark: { color: "gray-50" } },
+					color: "base-900",
+					theme: { dark: { color: "base-50" } },
 					children: t.localeText.noColumnsTitle
 				}), /* @__PURE__ */ I(i, {
 					fontSize: 14,
-					color: "gray-500",
+					color: "base-500",
 					textAlign: "center",
-					theme: { dark: { color: "gray-400" } },
+					theme: { dark: { color: "base-400" } },
 					children: t.localeText.noColumnsDescription
 				})]
 			})]
@@ -2105,8 +2105,8 @@ function Mt(e) {
 		},
 		children: /* @__PURE__ */ I(i, {
 			fontSize: 10,
-			color: "gray-400",
-			hover: { color: "gray-600" },
+			color: "base-400",
+			hover: { color: "base-600" },
 			children: "✕"
 		})
 	});
@@ -2312,7 +2312,7 @@ function It({ column: e }) {
 			children: [
 				/* @__PURE__ */ I(S.Display, { children: (t) => t.length === 0 ? /* @__PURE__ */ I(i, {
 					tag: "span",
-					color: "gray-400",
+					color: "base-400",
 					children: e.filterConfig?.placeholder ?? a.filterSelectPlaceholder
 				}) : t.length === 1 ? s.find((e) => e.value === t[0])?.label ?? String(t[0]) : `${t.length} selected` }),
 				/* @__PURE__ */ I(S.Unselect, { children: a.filterSelectClear }),
@@ -2617,7 +2617,7 @@ function Gt(e) {
 					return /* @__PURE__ */ L(te, { children: [e.startsSection && /* @__PURE__ */ I(i, {
 						bb: 1,
 						my: 2,
-						borderColor: "gray-300",
+						borderColor: "base-300",
 						component: `${n.componentName}.header.cell.contextMenu.tooltip.item.separator`
 					}), /* @__PURE__ */ L(p, {
 						component: `${n.componentName}.header.cell.contextMenu.tooltip.item`,
@@ -3035,8 +3035,8 @@ function nn(e) {
 				props: { "aria-label": t.localeText.stopGrouping(String(e.header ?? e.key)) },
 				children: /* @__PURE__ */ I(i, {
 					fontSize: 10,
-					color: "gray-400",
-					hover: { color: "gray-600" },
+					color: "base-400",
+					hover: { color: "base-600" },
 					children: "✕"
 				})
 			})]
@@ -3281,8 +3281,8 @@ function un(e) {
 					position: "absolute",
 					insetStart: 3,
 					pointerEvents: "none",
-					color: "gray-400",
-					theme: { dark: { color: "gray-500" } },
+					color: "base-400",
+					theme: { dark: { color: "base-500" } },
 					children: /* @__PURE__ */ I(rn, {
 						fill: "currentColor",
 						width: "14px"
@@ -3301,11 +3301,11 @@ function un(e) {
 					insetEnd: 2,
 					cursor: "pointer",
 					p: 1,
-					color: "gray-400",
-					hover: { color: "gray-600" },
+					color: "base-400",
+					hover: { color: "base-600" },
 					theme: { dark: {
-						color: "gray-500",
-						hover: { color: "gray-300" }
+						color: "base-500",
+						hover: { color: "base-300" }
 					} },
 					props: { onClick: c },
 					children: /* @__PURE__ */ I(i, {
@@ -3342,8 +3342,8 @@ function dn(e) {
 					id: t.titleId,
 					fontWeight: 600,
 					fontSize: 16,
-					color: "gray-800",
-					theme: { dark: { color: "gray-100" } },
+					color: "base-800",
+					theme: { dark: { color: "base-100" } },
 					children: n
 				}), /* @__PURE__ */ I(nn, { grid: t })]
 			}), /* @__PURE__ */ L(h, {
@@ -3535,6 +3535,7 @@ var _n = 1e3, vn = class {
 			isPillBeforeResizer: this.hasHoverPill && this.showResizer && this.column.pin !== "END",
 			isPillAfterResizer: this.hasHoverPill && this.showResizer && this.column.pin === "END",
 			isRowNumber: this.column.isRowNumber,
+			isGroup: !this.column.isLeaf,
 			isFirstLeaf: this.column.isFirstLeaf,
 			isLastLeaf: this.column.isLastLeaf
 		};