@homebound/beam 2.128.0 → 2.128.3
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.
|
@@ -77,9 +77,9 @@ function SuperDrawer() {
|
|
|
77
77
|
// Custom transitions settings for the translateX animation
|
|
78
78
|
transition: { ease: "linear", duration: 0.2, delay: 0.2 }, exit: { transition: { ease: "linear", duration: 0.2 }, x: 1040 },
|
|
79
79
|
// Preventing clicks from triggering parent onClick
|
|
80
|
-
onClick: (e) => e.stopPropagation() }, { children: [(0, jsx_runtime_1.jsxs)("header", Object.assign({ css: Css_1.Css.df.p3.bb.bGray200.df.aic.jcsb.$ }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.aic.$ }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ css: Css_1.Css.xl2Em.gray900.mr2.$ }, testId.title, { ref: drawerHeaderRef }, { children: !modalState.current && (title || null) }), void 0), !modalState.current && (titleLeftContent || null)] }), void 0), !modalState.current && (
|
|
80
|
+
onClick: (e) => e.stopPropagation() }, { children: [(0, jsx_runtime_1.jsxs)("header", Object.assign({ css: Css_1.Css.df.p3.bb.bGray200.df.aic.jcsb.gap2.$ }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.aic.$ }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ css: Css_1.Css.xl2Em.gray900.mr2.$ }, testId.title, { ref: drawerHeaderRef }, { children: !modalState.current && (title || null) }), void 0), !modalState.current && (titleLeftContent || null)] }), void 0), !modalState.current && (
|
|
81
81
|
// Forcing height to 32px to match title height
|
|
82
|
-
(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.childGap3.aic.hPx(32).$ }, { children: [titleRightContent || null, (0, jsx_runtime_1.jsx)(components_1.ButtonGroup, Object.assign({ buttons: [
|
|
82
|
+
(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.childGap3.aic.hPx(32).fs0.$ }, { children: [titleRightContent || null, (0, jsx_runtime_1.jsx)(components_1.ButtonGroup, Object.assign({ buttons: [
|
|
83
83
|
{
|
|
84
84
|
icon: "chevronLeft",
|
|
85
85
|
onClick: () => onPrevClick && onPrevClick(),
|
|
@@ -38,7 +38,13 @@ class RowState {
|
|
|
38
38
|
this.activeRowId = undefined;
|
|
39
39
|
// Make ourselves an observable so that mobx will do caching of .collapseIds so
|
|
40
40
|
// that it'll be a stable identity for GridTable to useMemo against.
|
|
41
|
-
(0, mobx_1.makeAutoObservable)(this,
|
|
41
|
+
(0, mobx_1.makeAutoObservable)(this,
|
|
42
|
+
// We only shallow observe rows so that:
|
|
43
|
+
// a) we don't deeply/needlessly proxy-ize a large Apollo fragment cache, but
|
|
44
|
+
// b) if rows changes, we re-run computeds like getSelectedRows that may need to see the
|
|
45
|
+
// updated _contents_ of a given row, even if our other selected/visible row states don't change.
|
|
46
|
+
// (as any b/c rows is private, so the mapped type doesn't see it)
|
|
47
|
+
{ rows: mobx_1.observable.shallow });
|
|
42
48
|
// Whenever our `visibleRows` change (i.e. via filtering) then we need to re-derive header and parent rows' selected state.
|
|
43
49
|
(0, mobx_1.reaction)(() => [...this.visibleRows.values()].sort(), () => {
|
|
44
50
|
const map = new Map();
|
|
@@ -4,9 +4,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.useComputed = void 0;
|
|
7
|
+
const fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
|
|
7
8
|
const mobx_1 = require("mobx");
|
|
8
9
|
const react_1 = require("react");
|
|
9
|
-
const fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
|
|
10
10
|
/** Evaluates a computed function `fn` to a regular value and triggers a re-render whenever it changes. */
|
|
11
11
|
function useComputed(fn, deps) {
|
|
12
12
|
// We always return the useRef value, and use this just to trigger re-renders
|
package/dist/inputs/Switch.js
CHANGED
|
@@ -29,7 +29,7 @@ function Switch(props) {
|
|
|
29
29
|
...(labelStyle === "filter" && Css_1.Css.jcsb.aic.w("auto").sm.$),
|
|
30
30
|
...(isDisabled && Css_1.Css.cursorNotAllowed.gray400.$),
|
|
31
31
|
}, "aria-label": label }, { children: [!hideLabel && labelStyle === "form" && (0, jsx_runtime_1.jsx)(Label_1.Label, { label: label }, void 0), !hideLabel && labelStyle === "filter" && (0, jsx_runtime_1.jsx)("span", { children: label }, void 0), (0, jsx_runtime_1.jsx)("div", Object.assign({ "aria-hidden": "true", css: {
|
|
32
|
-
...Css_1.Css.wPx(
|
|
32
|
+
...Css_1.Css.wPx(40).hPx(toggleHeight(compact)).bgGray200.br12.relative.transition.$,
|
|
33
33
|
...(isHovered && exports.switchHoverStyles),
|
|
34
34
|
...(isKeyboardFocus && exports.switchFocusStyles),
|
|
35
35
|
...(isDisabled && Css_1.Css.bgGray300.$),
|
|
@@ -49,8 +49,7 @@ exports.Switch = Switch;
|
|
|
49
49
|
/** Styles */
|
|
50
50
|
// Element sizes
|
|
51
51
|
const toggleHeight = (isCompact) => (isCompact ? 16 : 24);
|
|
52
|
-
const
|
|
53
|
-
const circleDiameter = (isCompact) => (isCompact ? 14 : 20);
|
|
52
|
+
const circleDiameter = (isCompact) => (isCompact ? 12 : 20);
|
|
54
53
|
// Switcher/Toggle element styles
|
|
55
54
|
exports.switchHoverStyles = Css_1.Css.bgGray400.$;
|
|
56
55
|
exports.switchFocusStyles = Css_1.Css.bshFocus.$;
|
|
@@ -60,7 +59,7 @@ const switchCircleDefaultStyles = (isCompact) => ({
|
|
|
60
59
|
...Css_1.Css.wPx(circleDiameter(isCompact))
|
|
61
60
|
.hPx(circleDiameter(isCompact))
|
|
62
61
|
.br100.bgWhite.bshBasic.absolute.leftPx(2)
|
|
63
|
-
.topPx(
|
|
62
|
+
.topPx(2).transition.df.aic.jcc.$,
|
|
64
63
|
svg: Css_1.Css.hPx(toggleHeight(isCompact) / 2).wPx(toggleHeight(isCompact) / 2).$,
|
|
65
64
|
});
|
|
66
65
|
/**
|