@grafana/scenes 5.15.0--canary.845.11012035874.0 → 5.15.0
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +17 -0
- package/dist/esm/components/SceneTimePicker.js +2 -1
- package/dist/esm/components/SceneTimePicker.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridLayout.js +2 -35
- package/dist/esm/components/layout/grid/SceneGridLayout.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js +4 -65
- package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js.map +1 -1
- package/dist/esm/core/SceneTimeRange.js +2 -10
- package/dist/esm/core/SceneTimeRange.js.map +1 -1
- package/dist/index.d.ts +0 -5
- package/dist/index.js +5 -104
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
@@ -817,17 +817,9 @@ class SceneTimeRange extends SceneObjectBase {
|
|
817
817
|
);
|
818
818
|
}
|
819
819
|
}
|
820
|
-
if (this.state.weekStart) {
|
821
|
-
data.setWeekStart(this.state.weekStart);
|
822
|
-
}
|
823
820
|
if (data.rangeUtil.isRelativeTimeRange(this.state.value.raw)) {
|
824
821
|
this.refreshIfStale();
|
825
822
|
}
|
826
|
-
return () => {
|
827
|
-
if (this.state.weekStart) {
|
828
|
-
data.setWeekStart(runtime.config.bootData.user.weekStart);
|
829
|
-
}
|
830
|
-
};
|
831
823
|
}
|
832
824
|
refreshIfStale() {
|
833
825
|
var _a, _b, _c, _d;
|
@@ -9830,7 +9822,7 @@ var __objRest = (source, exclude) => {
|
|
9830
9822
|
return target;
|
9831
9823
|
};
|
9832
9824
|
function SceneGridLayoutRenderer({ model }) {
|
9833
|
-
const { children, isLazy, isDraggable, isResizable
|
9825
|
+
const { children, isLazy, isDraggable, isResizable } = model.useState();
|
9834
9826
|
const [outerDivRef, { width, height }] = reactUse.useMeasure();
|
9835
9827
|
const ref = React.useRef(null);
|
9836
9828
|
React.useEffect(() => {
|
@@ -9876,67 +9868,7 @@ function SceneGridLayoutRenderer({ model }) {
|
|
9876
9868
|
return /* @__PURE__ */ React__default["default"].createElement("div", {
|
9877
9869
|
ref: outerDivRef,
|
9878
9870
|
style: { flex: "1 1 auto", position: "relative", zIndex: 1, width: "100%" }
|
9879
|
-
},
|
9880
|
-
model
|
9881
|
-
}), renderGrid(width, height));
|
9882
|
-
}
|
9883
|
-
function PanelSearchControls({ model }) {
|
9884
|
-
const { searchString, panelsPerRow } = model.useState();
|
9885
|
-
const styles = ui.useStyles2(getPanelSearchStyles);
|
9886
|
-
const onSearchStringChange = React.useCallback(
|
9887
|
-
(e) => {
|
9888
|
-
model.setState({ searchString: e.currentTarget.value });
|
9889
|
-
},
|
9890
|
-
[model]
|
9891
|
-
);
|
9892
|
-
const onPanelsPerRowChange = React.useCallback(
|
9893
|
-
(e) => {
|
9894
|
-
model.setState({ panelsPerRow: Number.parseInt(e.currentTarget.value, 10) });
|
9895
|
-
},
|
9896
|
-
[model]
|
9897
|
-
);
|
9898
|
-
return /* @__PURE__ */ React__default["default"].createElement("div", {
|
9899
|
-
className: styles.wrapper
|
9900
|
-
}, /* @__PURE__ */ React__default["default"].createElement("div", {
|
9901
|
-
id: "panel-search",
|
9902
|
-
className: styles.input
|
9903
|
-
}, /* @__PURE__ */ React__default["default"].createElement(ControlsLabel, {
|
9904
|
-
isLoading: false,
|
9905
|
-
label: "Panel search",
|
9906
|
-
htmlFor: "panel-search-input"
|
9907
|
-
}), /* @__PURE__ */ React__default["default"].createElement(ui.Input, {
|
9908
|
-
id: "panel-search-input",
|
9909
|
-
label: "Search",
|
9910
|
-
placeholder: "Enter value",
|
9911
|
-
value: searchString,
|
9912
|
-
onChange: onSearchStringChange
|
9913
|
-
})), /* @__PURE__ */ React__default["default"].createElement("div", {
|
9914
|
-
id: "panels-per-row",
|
9915
|
-
className: styles.input
|
9916
|
-
}, /* @__PURE__ */ React__default["default"].createElement(ControlsLabel, {
|
9917
|
-
isLoading: false,
|
9918
|
-
label: "Panels per row",
|
9919
|
-
htmlFor: "panels-per-row-input"
|
9920
|
-
}), /* @__PURE__ */ React__default["default"].createElement(ui.Input, {
|
9921
|
-
id: "panels-per-row-input",
|
9922
|
-
type: "number",
|
9923
|
-
placeholder: "Enter value",
|
9924
|
-
label: "Panels per row",
|
9925
|
-
value: panelsPerRow,
|
9926
|
-
onChange: onPanelsPerRowChange
|
9927
|
-
})));
|
9928
|
-
}
|
9929
|
-
function getPanelSearchStyles(theme) {
|
9930
|
-
return {
|
9931
|
-
wrapper: css.css({
|
9932
|
-
display: "flex",
|
9933
|
-
gap: theme.spacing(1),
|
9934
|
-
marginBottom: theme.spacing(1)
|
9935
|
-
}),
|
9936
|
-
input: css.css({
|
9937
|
-
display: "flex"
|
9938
|
-
})
|
9939
|
-
};
|
9871
|
+
}, renderGrid(width, height));
|
9940
9872
|
}
|
9941
9873
|
const GridItemWrapper = React__default["default"].forwardRef((props, ref) => {
|
9942
9874
|
var _b;
|
@@ -10085,7 +10017,6 @@ const _SceneGridLayout = class extends SceneObjectBase {
|
|
10085
10017
|
this._skipOnLayoutChange = false;
|
10086
10018
|
this._oldLayout = [];
|
10087
10019
|
this._loadOldLayout = false;
|
10088
|
-
this.savedLayout = void 0;
|
10089
10020
|
this.onLayoutChange = (layout) => {
|
10090
10021
|
if (this._skipOnLayoutChange) {
|
10091
10022
|
this._skipOnLayoutChange = false;
|
@@ -10294,38 +10225,7 @@ const _SceneGridLayout = class extends SceneObjectBase {
|
|
10294
10225
|
}
|
10295
10226
|
buildGridLayout(width, height) {
|
10296
10227
|
let cells = [];
|
10297
|
-
const
|
10298
|
-
const panelsPerRow = this.state.panelsPerRow;
|
10299
|
-
let children = this.state.children;
|
10300
|
-
if (searchString && searchString !== "" || panelsPerRow && Number.isInteger(panelsPerRow)) {
|
10301
|
-
if (this.savedLayout === void 0) {
|
10302
|
-
this.savedLayout = this.state.children.map((v) => v.clone());
|
10303
|
-
}
|
10304
|
-
const panelFilterInterpolated = interpolate(this, searchString).toLowerCase();
|
10305
|
-
const filteredChildren = this.state.children.filter((v) => {
|
10306
|
-
var _a, _b, _c, _d;
|
10307
|
-
const panelTitleInterpolated = interpolate(v, (_b = (_a = v.state.body) == null ? void 0 : _a.state) == null ? void 0 : _b.title).toLowerCase();
|
10308
|
-
return typeof ((_d = (_c = v.state.body) == null ? void 0 : _c.state) == null ? void 0 : _d.title) === "string" && panelTitleInterpolated.includes(panelFilterInterpolated);
|
10309
|
-
});
|
10310
|
-
this._skipOnLayoutChange = true;
|
10311
|
-
const rowSize = typeof panelsPerRow === "number" && Number.isInteger(panelsPerRow) && panelsPerRow > 0 ? panelsPerRow : 2;
|
10312
|
-
const panelWidth = GRID_COLUMN_COUNT / rowSize;
|
10313
|
-
const panelHeight = 5;
|
10314
|
-
return filteredChildren.map((child, i) => __spreadProps$5(__spreadValues$8({}, this.toGridCell(child)), {
|
10315
|
-
x: i % rowSize * panelWidth,
|
10316
|
-
y: Math.floor(i / rowSize) * panelHeight,
|
10317
|
-
w: panelWidth,
|
10318
|
-
h: panelHeight,
|
10319
|
-
isResizable: false,
|
10320
|
-
isDraggable: false
|
10321
|
-
}));
|
10322
|
-
} else if ((!searchString || searchString === "") && !panelsPerRow) {
|
10323
|
-
if (this.savedLayout) {
|
10324
|
-
children = this.savedLayout;
|
10325
|
-
this.savedLayout = void 0;
|
10326
|
-
}
|
10327
|
-
}
|
10328
|
-
for (const child of children) {
|
10228
|
+
for (const child of this.state.children) {
|
10329
10229
|
cells.push(this.toGridCell(child));
|
10330
10230
|
if (child instanceof SceneGridRow && !child.state.isCollapsed) {
|
10331
10231
|
for (const rowChild of child.state.children) {
|
@@ -10720,7 +10620,8 @@ function SceneTimePickerRenderer({ model }) {
|
|
10720
10620
|
onMoveForward: model.onMoveForward,
|
10721
10621
|
onZoom: model.onZoom,
|
10722
10622
|
onChangeTimeZone: timeRange.onTimeZoneChange,
|
10723
|
-
onChangeFiscalYearStartMonth: model.onChangeFiscalYearStartMonth
|
10623
|
+
onChangeFiscalYearStartMonth: model.onChangeFiscalYearStartMonth,
|
10624
|
+
weekStart: timeRangeState.weekStart
|
10724
10625
|
});
|
10725
10626
|
}
|
10726
10627
|
function getZoomedTimeRange(timeRange, factor) {
|