@homebound/beam 2.148.1 → 2.149.0

package/dist/components/Table/GridTable.d.ts

@@ -222,6 +222,7 @@ export declare type DiscriminateUnion<T, K extends keyof T, V extends T[K]> = T
 declare type GridRowKind<R extends Kinded, P extends R["kind"]> = DiscriminateUnion<R, "kind", P> & {
     id: string;
     children: GridDataRow<R>[];
+    selectable?: false;
 };
 /**
  * Defines how a single column will render each given row `kind` in `R`.
@@ -333,6 +334,8 @@ export declare type GridDataRow<R extends Kinded> = {
     data: unknown;
     /** Whether to have the row collapsed (children not visible) on initial load. This will be ignore in subsequent re-renders of the table */
     initCollapsed?: boolean;
+    /** Whether row can be selected */
+    selectable?: false;
 } & IfAny<R, {}, DiscriminateUnion<R, "kind", R["kind"]>>;
 declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
 /** Return the content for a given column def applied to a given row. */

package/dist/components/Table/GridTableApi.js

@@ -39,19 +39,14 @@ class GridTableApiImpl {
         this.virtuosoRef.current && this.virtuosoRef.current.scrollToIndex(index);
     }
     getSelectedRowIds(kind) {
-        if (kind === undefined) {
-            return this.rowState.selectedIds;
-        }
-        else {
-            return this.getSelectedRows(kind).map((row) => row.id);
-        }
+        return this.getSelectedRows(kind).map((row) => row.id);
     }
     // The any is not great, but getting the overload to handle the optional kind is annoying
     getSelectedRows(kind) {
         const ids = this.rowState.selectedIds;
         const selected = [];
         (0, visitor_1.visit)(this.rowState.rows, (row) => {
-            if (ids.includes(row.id) && (!kind || row.kind === kind)) {
+            if (row.selectable !== false && ids.includes(row.id) && (!kind || row.kind === kind)) {
                 selected.push(row);
             }
         });

package/dist/components/Table/SelectToggle.d.ts

@@ -1,4 +1,7 @@
-/** Provides a checkbox to show/drive this row's selected state. */
-export declare function SelectToggle({ id }: {
+interface SelectToggleProps {
     id: string;
-}): import("@emotion/react/jsx-runtime").JSX.Element;
+    disabled?: boolean;
+}
+/** Provides a checkbox to show/drive this row's selected state. */
+export declare function SelectToggle({ id, disabled }: SelectToggleProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Table/SelectToggle.js

@@ -7,12 +7,12 @@ const RowState_1 = require("./RowState");
 const index_1 = require("../../hooks/index");
 const index_2 = require("../../inputs/index");
 /** Provides a checkbox to show/drive this row's selected state. */
-function SelectToggle({ id }) {
+function SelectToggle({ id, disabled }) {
     const { rowState } = (0, react_1.useContext)(RowState_1.RowStateContext);
     const state = (0, index_1.useComputed)(() => rowState.getSelected(id), [rowState]);
     const selected = state === "checked" ? true : state === "unchecked" ? false : "indeterminate";
-    return ((0, jsx_runtime_1.jsx)(index_2.Checkbox, { label: "Select", checkboxOnly: true, selected: selected, onChange: (selected) => {
+    return ((0, jsx_runtime_1.jsx)(index_2.Checkbox, { checkboxOnly: true, disabled: disabled, label: "Select", onChange: (selected) => {
             rowState.selectRow(id, selected);
-        } }, void 0));
+        }, selected: selected }, void 0));
 }
 exports.SelectToggle = SelectToggle;

package/dist/components/Table/columns.js

@@ -47,7 +47,9 @@ function selectColumn(columnDef) {
         ...columnDef,
     };
     return (0, index_1.newMethodMissingProxy)(base, (key) => {
-        return (data, { row }) => ({ content: (0, jsx_runtime_1.jsx)(SelectToggle_1.SelectToggle, { id: row.id }, void 0) });
+        return (data, { row }) => ({
+            content: (0, jsx_runtime_1.jsx)(SelectToggle_1.SelectToggle, { id: row.id, disabled: row.selectable === false }, void 0),
+        });
     });
 }
 exports.selectColumn = selectColumn;

package/dist/inputs/CheckboxBase.js

@@ -25,9 +25,10 @@ function CheckboxBase(props) {
             .maxw((0, Css_1.px)(344))
             .if(isDisabled).cursorNotAllowed.$, "aria-label": label }, { children: [(0, jsx_runtime_1.jsx)(react_aria_1.VisuallyHidden, { children: (0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, (0, react_aria_1.mergeProps)(inputProps, focusProps), tid), void 0) }, void 0), (0, jsx_runtime_1.jsx)("span", Object.assign({}, hoverProps, { css: {
                     ...baseStyles,
-                    ...((isSelected || isIndeterminate) && filledBoxStyles),
-                    ...((isSelected || isIndeterminate) && isHovered && filledBoxHoverStyles),
+                    ...(((isSelected && !isDisabled) || isIndeterminate) && filledBoxStyles),
+                    ...(((isSelected && !isDisabled) || isIndeterminate) && isHovered && filledBoxHoverStyles),
                     ...(isDisabled && disabledBoxStyles),
+                    ...(isDisabled && isSelected && disabledSelectedBoxStyles),
                     ...(isFocusVisible && focusRingStyles),
                     ...(isHovered && hoverBorderStyles),
                     ...markStyles,
@@ -40,7 +41,8 @@ exports.CheckboxBase = CheckboxBase;
 const baseStyles = Css_1.Css.hPx(16).mw((0, Css_1.px)(16)).relative.ba.bGray300.br4.bgWhite.transition.$;
 const filledBoxStyles = Css_1.Css.bLightBlue700.bgLightBlue700.$;
 const filledBoxHoverStyles = Css_1.Css.bgLightBlue900.$;
-const disabledBoxStyles = Css_1.Css.bGray400.bGray100.$;
+const disabledBoxStyles = Css_1.Css.bgGray50.bGray100.$;
+const disabledSelectedBoxStyles = Css_1.Css.bgGray400.bGray400.$;
 const disabledColor = Css_1.Css.gray300.$;
 const focusRingStyles = Css_1.Css.bshFocus.$;
 const hoverBorderStyles = Css_1.Css.bLightBlue900.$;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/beam",
-  "version": "2.148.1",
+  "version": "2.149.0",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",