@homebound/beam 2.195.0 → 2.197.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Icon.d.ts +1 -0
- package/dist/components/Icon.js +1 -0
- package/dist/components/Table/GridTable.js +1 -1
- package/dist/components/Table/TableStyles.d.ts +1 -0
- package/dist/components/Table/TableStyles.js +3 -1
- package/dist/components/Table/components/Row.d.ts +1 -0
- package/dist/components/Table/components/Row.js +8 -5
- package/package.json +1 -1
|
@@ -89,6 +89,7 @@ export declare const Icons: {
|
|
|
89
89
|
buildingHouse: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
90
90
|
house: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
91
91
|
bell: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
92
|
+
customize: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
92
93
|
projects: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
93
94
|
tasks: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
94
95
|
finances: import("@emotion/react/jsx-runtime").JSX.Element;
|
package/dist/components/Icon.js
CHANGED
|
@@ -98,6 +98,7 @@ exports.Icons = {
|
|
|
98
98
|
buildingHouse: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M19.0002 2.00002H9.00019C7.89719 2.00002 7.00019 2.89702 7.00019 4.00002V9.58602L2.29319 14.293C2.00719 14.579 1.92119 15.009 2.07619 15.383C2.23119 15.757 2.59619 16 3.00019 16V17V21C3.00019 21.553 3.44819 22 4.00019 22H12.0002H20.0002C20.5532 22 21.0002 21.553 21.0002 21V4.00002C21.0002 2.89702 20.1032 2.00002 19.0002 2.00002ZM11.0002 20H5.00019V17V15V14.414L8.00019 11.414L11.0002 14.414V15V18V20ZM19.0002 20H13.0002V18V16C13.4042 16 13.7702 15.757 13.9242 15.383C14.0792 15.009 13.9932 14.579 13.7072 14.293L9.00019 9.58602V4.00002H19.0002V20Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M11 6.00002H13V8.00002H11V6.00002ZM15 6.00002H17V8.00002H15V6.00002ZM15 10.031H17V12H15V10.031ZM15 14H17V16H15V14ZM7 15H9V17H7V15Z" }, void 0)] }, void 0)),
|
|
99
99
|
house: ((0, jsx_runtime_1.jsx)("path", { d: "M5.00299 22H9.00299H15.003H19.003C20.106 22 21.003 21.103 21.003 20V11C21.003 10.735 20.898 10.48 20.71 10.293L12.71 2.29301C12.319 1.90201 11.687 1.90201 11.296 2.29301L3.29599 10.293C3.10799 10.48 3.00299 10.735 3.00299 11V20C3.00299 21.103 3.89999 22 5.00299 22ZM10.003 20V15H14.003V20H10.003ZM5.00299 11.414L12.003 4.41401L19.003 11.414L19.004 20H16.003V15C16.003 13.897 15.106 13 14.003 13H10.003C8.89999 13 8.00299 13.897 8.00299 15V20H5.00299V11.414Z" }, void 0)),
|
|
100
100
|
bell: ((0, jsx_runtime_1.jsx)("path", { d: "M19 13.586V10C19 6.783 16.815 4.073 13.855 3.258C13.562 2.52 12.846 2 12 2C11.154 2 10.438 2.52 10.145 3.258C7.185 4.074 5 6.783 5 10V13.586L3.293 15.293C3.105 15.48 3 15.734 3 16V18C3 18.553 3.447 19 4 19H20C20.553 19 21 18.553 21 18V16C21 15.734 20.895 15.48 20.707 15.293L19 13.586ZM19 17H5V16.414L6.707 14.707C6.895 14.52 7 14.266 7 14V10C7 7.243 9.243 5 12 5C14.757 5 17 7.243 17 10V14C17 14.266 17.105 14.52 17.293 14.707L19 16.414V17ZM12 22C13.311 22 14.407 21.166 14.818 20H9.182C9.593 21.166 10.689 22 12 22Z" }, void 0)),
|
|
101
|
+
customize: ((0, jsx_runtime_1.jsx)("path", { d: "M4 11H10C10.553 11 11 10.552 11 10V4C11 3.448 10.553 3 10 3H4C3.447 3 3 3.448 3 4V10C3 10.552 3.447 11 4 11ZM5 5H9V9H5V5ZM20 3H14C13.447 3 13 3.448 13 4V10C13 10.552 13.447 11 14 11H20C20.553 11 21 10.552 21 10V4C21 3.448 20.553 3 20 3ZM19 9H15V5H19V9ZM10 21C10.553 21 11 20.553 11 20V14C11 13.447 10.553 13 10 13H4C3.447 13 3 13.447 3 14V20C3 20.553 3.447 21 4 21H10ZM5 15H9V19H5V15ZM18 14H16V16H14V18H16V20H18V18H20V16H18V14Z" }, void 0)),
|
|
101
102
|
// Navigation
|
|
102
103
|
projects: ((0, jsx_runtime_1.jsx)("path", { d: "M4 6H6V8H4V6ZM4 11H6V13H4V11ZM4 16H6V18H4V16ZM20 8V6H18.8H9.2H8.023V8H9.2H18.8H20ZM8 11H20V13H8V11ZM8 16H20V18H8V16Z" }, void 0)),
|
|
103
104
|
tasks: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M5 22H19C20.103 22 21 21.103 21 20V5C21 3.897 20.103 3 19 3H17C17 2.447 16.553 2 16 2H8C7.447 2 7 2.447 7 3H5C3.897 3 3 3.897 3 5V20C3 21.103 3.897 22 5 22ZM5 5H7V7H17V5H19V20H5V5Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M11 13.586L9.20697 11.793L7.79297 13.207L11 16.414L16.207 11.207L14.793 9.79297L11 13.586Z" }, void 0)] }, void 0)),
|
|
@@ -137,6 +137,7 @@ function GridTable(props) {
|
|
|
137
137
|
getCount,
|
|
138
138
|
api,
|
|
139
139
|
cellHighlight: "cellHighlight" in maybeStyle && maybeStyle.cellHighlight === true,
|
|
140
|
+
omitRowHover: "rowHover" in maybeStyle && maybeStyle.rowHover === false,
|
|
140
141
|
...sortProps,
|
|
141
142
|
}), `${row.kind}-${row.id}`));
|
|
142
143
|
}
|
|
@@ -157,7 +158,6 @@ function GridTable(props) {
|
|
|
157
158
|
}
|
|
158
159
|
}
|
|
159
160
|
function visitRows(rows, level, visible) {
|
|
160
|
-
const length = rows.length;
|
|
161
161
|
rows.forEach((row, i) => {
|
|
162
162
|
if (row[0].kind === "header") {
|
|
163
163
|
headerRows.push([row[0], makeRowComponent(row[0], level)]);
|
|
@@ -61,6 +61,7 @@ export interface GridStyleDef {
|
|
|
61
61
|
cellHighlight?: boolean;
|
|
62
62
|
allWhite?: boolean;
|
|
63
63
|
bordered?: boolean;
|
|
64
|
+
rowHover?: boolean;
|
|
64
65
|
}
|
|
65
66
|
export declare const getTableStyles: (props?: GridStyleDef) => GridStyle;
|
|
66
67
|
/** Defines row-specific styling for each given row `kind` in `R` */
|
|
@@ -7,7 +7,7 @@ const utils_1 = require("../../utils");
|
|
|
7
7
|
function memoizedTableStyles() {
|
|
8
8
|
const cache = {};
|
|
9
9
|
return (props = {}) => {
|
|
10
|
-
const { inlineEditing = false, grouped = false, rowHeight = "flexible", cellHighlight = false, allWhite = false, bordered = false, } = props;
|
|
10
|
+
const { inlineEditing = false, grouped = false, rowHeight = "flexible", cellHighlight = false, allWhite = false, bordered = false, rowHover = true, } = props;
|
|
11
11
|
const key = (0, utils_1.safeKeys)(props)
|
|
12
12
|
.sort()
|
|
13
13
|
.map((k) => `${k}_${props[k]}`)
|
|
@@ -50,6 +50,7 @@ function memoizedTableStyles() {
|
|
|
50
50
|
}),
|
|
51
51
|
presentationSettings: { borderless: true, typeScale: "xs", wrap: rowHeight === "flexible" },
|
|
52
52
|
levels: grouped ? groupedLevels : defaultLevels,
|
|
53
|
+
rowHoverColor: Css_1.Palette.LightBlue100,
|
|
53
54
|
};
|
|
54
55
|
}
|
|
55
56
|
return cache[key];
|
|
@@ -114,6 +115,7 @@ function resolveStyles(style) {
|
|
|
114
115
|
"cellHighlight",
|
|
115
116
|
"allWhite",
|
|
116
117
|
"bordered",
|
|
118
|
+
"rowHover",
|
|
117
119
|
];
|
|
118
120
|
const keys = (0, utils_1.safeKeys)(style);
|
|
119
121
|
if (keys.length === 0 || keys.some((k) => defKeys.includes(k))) {
|
|
@@ -33,7 +33,7 @@ const shallowEqual_1 = require("../../../utils/shallowEqual");
|
|
|
33
33
|
// We extract Row to its own mini-component primarily so we can React.memo'ize it.
|
|
34
34
|
function RowImpl(props) {
|
|
35
35
|
var _a;
|
|
36
|
-
const { as, columns, row, style, rowStyles, stickyHeader, stickyOffset, sortOn, sortState, setSortKey, columnSizes, level, getCount, api, cellHighlight, ...others } = props;
|
|
36
|
+
const { as, columns, row, style, rowStyles, stickyHeader, stickyOffset, sortOn, sortState, setSortKey, columnSizes, level, getCount, api, cellHighlight, omitRowHover, ...others } = props;
|
|
37
37
|
const { rowState } = (0, react_1.useContext)(RowState_1.RowStateContext);
|
|
38
38
|
const rowId = `${row.kind}_${row.id}`;
|
|
39
39
|
const isActive = (0, hooks_1.useComputed)(() => rowState.activeRowId === rowId, [rowId, rowState]);
|
|
@@ -45,12 +45,15 @@ function RowImpl(props) {
|
|
|
45
45
|
const revealOnRowHoverClass = "revealOnRowHover";
|
|
46
46
|
const rowStyleCellCss = (0, utils_1.maybeApplyFunction)(row, rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.cellCss);
|
|
47
47
|
const rowCss = {
|
|
48
|
-
//
|
|
49
|
-
...(
|
|
50
|
-
...(((rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.rowLink) || (rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.onClick)) && {
|
|
48
|
+
// Optionally include the row hover styles, by default they should be turned on.
|
|
49
|
+
...(!omitRowHover && {
|
|
51
50
|
// Even though backgroundColor is set on the cellCss, the hover target is the row.
|
|
52
|
-
"&:hover > *": Css_1.Css.
|
|
51
|
+
"&:hover > *": Css_1.Css.bgColor((_a = style.rowHoverColor) !== null && _a !== void 0 ? _a : Css_1.Palette.LightBlue100).$,
|
|
53
52
|
}),
|
|
53
|
+
// For virtual tables use `display: flex` to keep all cells on the same row. For each cell in the row use `flexNone` to ensure they stay their defined widths
|
|
54
|
+
...(as === "table" ? {} : Css_1.Css.relative.df.fg1.fs1.addIn("&>*", Css_1.Css.flexNone.$).$),
|
|
55
|
+
// Apply `cursorPointer` to the row if it has a link or `onClick` value.
|
|
56
|
+
...(((rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.rowLink) || (rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.onClick)) && { "&:hover": Css_1.Css.cursorPointer.$ }),
|
|
54
57
|
...(0, utils_1.maybeApplyFunction)(row, rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.rowCss),
|
|
55
58
|
// Maybe add the sticky header styles
|
|
56
59
|
...((isHeader || isTotals) && stickyHeader ? Css_1.Css.sticky.topPx(stickyOffset).z2.$ : undefined),
|