@dynostack/react-grid 0.5.0 → 0.5.1

package/README.md

@@ -1,5 +1,10 @@
 <div align="center">
 
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://dynostack-react-grid.vercel.app/brand/dynostack-grid-wordmark-dark.svg">
+  <img src="https://dynostack-react-grid.vercel.app/brand/dynostack-grid-wordmark-light.svg" alt="Dynostack Grid" width="360">
+</picture>
+
 # @dynostack/react-grid
 
 **Enterprise-grade React data grid. Drop-in.**
@@ -21,6 +26,8 @@ Try every feature on real sample data, customize themes and density, share a con
 
 A single `<DataTable />` component that gives you ag-grid–level functionality with a fraction of the API surface and a shadcn/ui aesthetic. Every behavior is opt-in via props — drop it in and it works; configure it and it scales.
 
+Dynostack is a growing family of tools. Grid is the first product, with a shared brand system designed for future modules. [Download the Dynostack and Grid logos](https://dynostack-react-grid.vercel.app/brand.html).
+
 ## Showcase
 
 A graphite studio for your data. Switch between light and dark, configure every feature, and copy the React configuration in the [live playground](https://dynostack-react-grid.vercel.app/playground).

package/dist/index.cjs

@@ -1914,7 +1914,7 @@ function EditableCell({
       {
         className: cn(
           "flex h-7 items-center gap-1.5 rounded px-1.5 text-sm",
-          isEditable && "cursor-text outline-1 outline-transparent transition-colors hover:bg-muted/60 hover:outline-border",
+          isEditable && "cursor-text transition-colors hover:bg-muted/60",
           align === "right" && "justify-end",
           align === "center" && "justify-center"
         ),
@@ -1937,6 +1937,7 @@ function EditableCell({
       return /* @__PURE__ */ jsxRuntime.jsx(
         "select",
         {
+          "data-cell-editor": "",
           value: String(local ?? ""),
           onChange: (e) => {
             setLocal(e.target.value);
@@ -1958,7 +1959,15 @@ function EditableCell({
         value: String(local ?? ""),
         onValueChange: (v) => commit(v),
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { size: "sm", className: "h-7 w-full text-xs", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            SelectTrigger,
+            {
+              "data-cell-editor": "",
+              size: "sm",
+              className: "h-7 w-full text-xs focus-visible:ring-0",
+              children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {})
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: opts.map((o) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: o.value, children: o.label }, o.value)) })
         ]
       }
@@ -1968,6 +1977,8 @@ function EditableCell({
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-7 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
       Checkbox,
       {
+        "data-cell-editor": "",
+        className: "focus-visible:ring-0",
         checked: !!local,
         onCheckedChange: (c) => commit(!!c),
         autoFocus: true
@@ -1977,6 +1988,7 @@ function EditableCell({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Input,
     {
+      "data-cell-editor": "",
       ref: inputRef,
       type: editor === "number" || editor === "currency" ? "number" : editor === "date" ? "date" : "text",
       value: local == null ? "" : String(local),
@@ -1990,7 +2002,7 @@ function EditableCell({
       onBlur: () => commit(local),
       onKeyDown: handleKey,
       className: cn(
-        "h-7 px-1.5 text-sm",
+        "h-7 px-1.5 text-sm focus-visible:ring-0",
         align === "right" && "text-right",
         align === "center" && "text-center"
       )