oolib 2.197.2 → 2.197.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.
Files changed (2) hide show
  1. package/dist/v2/components/dataviz/HeatMapGrid/index.js +90 -98
  2. package/package.json +1 -1
package/dist/v2/components/dataviz/HeatMapGrid/index.js CHANGED
@@ -115,112 +115,104 @@ var HeatMapGrid = function (_a) {
115
115
  var _j = (0, useFader_1.useFader)(scrollableRef), setFader = _j.setFader, showFader = _j.showFader, showHorizontalFader = _j.showHorizontalFader;
116
116
  // Replace: const { xAxisWidth, yAxisWidth, measurementRef } = useAxisDimensions(data, _configs.axisLabelWidth);
117
117
  var _k = (0, useAxisMeasure_1.useAxisMeasure)(_configs.axisLabelWidth), xWidth = _k.xWidth, yWidth = _k.yWidth, setHorizontalRef = _k.setHorizontalRef, setVerticalRef = _k.setVerticalRef;
118
- console.log({ xWidth: xWidth, yWidth: yWidth });
119
- return (react_1.default.createElement("div", { style: __assign({ position: 'relative' }, style) },
120
- react_1.default.createElement("div", { style: {
121
- display: "grid",
122
- gridTemplateColumns: "".concat(yWidth, "px 1fr"),
123
- gridTemplateRows: "".concat(xWidth, "px 1fr"),
124
- gap: _configs.gridGap + 'px',
125
- height: '100%',
118
+ return (react_1.default.createElement("div", { style: __assign({ display: "grid", gridTemplateColumns: "".concat(yWidth, "px 1fr"), gridTemplateRows: "".concat(xWidth, "px 1fr"), gap: _configs.gridGap + 'px', height: '100%', position: 'relative' }, style) },
119
+ react_1.default.createElement("div", { style: { gridRow: 1, gridColumn: 1 } }),
120
+ react_1.default.createElement(HiddenScrollContainer, { style: {
121
+ gridRow: 1,
122
+ gridColumn: 2,
123
+ overflowX: 'auto',
124
+ overflowY: 'hidden',
125
+ display: 'flex',
126
+ alignItems: 'flex-end',
127
+ }, onScroll: function (e) {
128
+ // Sync horizontal scroll with main content area
129
+ if (scrollableRef.current) {
130
+ scrollableRef.current.scrollLeft = e.target.scrollLeft;
131
+ }
126
132
  } },
127
- react_1.default.createElement("div", { style: { gridRow: 1, gridColumn: 1 } }),
128
- react_1.default.createElement(HiddenScrollContainer, { style: {
129
- gridRow: 1,
130
- gridColumn: 2,
131
- overflowX: 'auto',
132
- overflowY: 'hidden',
133
- display: 'flex',
134
- alignItems: 'flex-end',
135
- }, onScroll: function (e) {
136
- // Sync horizontal scroll with main content area
137
- if (scrollableRef.current) {
138
- scrollableRef.current.scrollLeft = e.target.scrollLeft;
139
- }
133
+ react_1.default.createElement("div", { style: {
134
+ display: "flex",
135
+ alignItems: "center",
136
+ gap: _configs.gridGap + "px",
137
+ minWidth: 'max-content',
138
+ } }, data[0].map(function (dd, index) { return (react_1.default.createElement("div", { key: dd.labels.tooltipLabel, style: {
139
+ width: _configs.cellSize + "px",
140
+ height: xWidth + "px",
141
+ display: "flex",
142
+ alignItems: "flex-end",
143
+ textWrap: "nowrap",
144
+ justifyContent: 'center',
145
+ position: "relative",
146
+ overflow: "visible",
147
+ flexShrink: 0,
140
148
  } },
141
149
  react_1.default.createElement("div", { style: {
142
- display: "flex",
143
- alignItems: "center",
144
- gap: _configs.gridGap + "px",
145
- minWidth: 'max-content',
146
- } }, data[0].map(function (dd, index) { return (react_1.default.createElement("div", { key: dd.labels.tooltipLabel, style: {
147
- width: _configs.cellSize + "px",
148
- height: xWidth + "px",
149
- display: "flex",
150
- alignItems: "flex-end",
151
- textWrap: "nowrap",
152
- justifyContent: 'center',
153
- position: "relative",
154
- overflow: "visible",
155
- flexShrink: 0,
150
+ width: xWidth + "px",
151
+ position: "absolute",
152
+ bottom: 0,
153
+ left: '50%',
154
+ transformOrigin: "left bottom",
155
+ transform: "rotate(-90deg) translateY(50%)",
156
+ display: 'flex'
156
157
  } },
157
- react_1.default.createElement("div", { style: {
158
- width: xWidth + "px",
159
- position: "absolute",
160
- bottom: 0,
161
- left: '50%',
162
- transformOrigin: "left bottom",
163
- transform: "rotate(-90deg) translateY(50%)",
164
- display: 'flex'
165
- } },
166
- react_1.default.createElement("div", { ref: function (el) { return setHorizontalRef(index, el); } },
167
- react_1.default.createElement(STYLED_UI_CAPTION_SEMIBOLD_DF, { style: {
168
- whiteSpace: "normal",
169
- } }, dd.labels.tooltipLabel))))); }))),
170
- react_1.default.createElement(HiddenScrollContainer, { style: {
171
- gridRow: 2,
172
- gridColumn: 1,
173
- overflowY: 'auto',
174
- overflowX: 'hidden',
175
- display: 'flex',
176
- flexDirection: 'column',
158
+ react_1.default.createElement("div", { ref: function (el) { return setHorizontalRef(index, el); } },
159
+ react_1.default.createElement(STYLED_UI_CAPTION_SEMIBOLD_DF, { style: {
160
+ whiteSpace: "normal",
161
+ } }, dd.labels.tooltipLabel))))); }))),
162
+ react_1.default.createElement(HiddenScrollContainer, { style: {
163
+ gridRow: 2,
164
+ gridColumn: 1,
165
+ overflowY: 'auto',
166
+ overflowX: 'hidden',
167
+ display: 'flex',
168
+ flexDirection: 'column',
169
+ gap: _configs.gridGap + "px",
170
+ }, onScroll: function (e) {
171
+ // Sync vertical scroll with main content area
172
+ if (scrollableRef.current) {
173
+ scrollableRef.current.scrollTop = e.target.scrollTop;
174
+ }
175
+ } }, data.map(function (d, idx) { return (react_1.default.createElement("div", { key: idx, style: {
176
+ height: _configs.cellSize + "px",
177
+ textAlign: "right",
178
+ display: "flex",
179
+ alignItems: "center",
180
+ justifyContent: "flex-end",
181
+ flexShrink: 0,
182
+ } },
183
+ react_1.default.createElement("div", { ref: function (el) { return setVerticalRef(idx, el); } },
184
+ react_1.default.createElement(STYLED_UI_CAPTION_SEMIBOLD_DF, { style: {
185
+ maxWidth: yWidth + "px",
186
+ } }, d[0].labels.name.length > 50 ? d[0].labels.name.substring(0, 50) + "..." : d[0].labels.name)))); })),
187
+ react_1.default.createElement("div", { ref: scrollableRef, style: {
188
+ gridRow: 2,
189
+ gridColumn: 2,
190
+ overflow: 'auto',
191
+ position: 'relative',
192
+ }, onScroll: function (e) {
193
+ // Sync scrolling with headers
194
+ var topHeader = e.target.parentElement.children[1]; // Top-right header
195
+ var leftHeader = e.target.parentElement.children[2]; // Bottom-left header
196
+ if (topHeader)
197
+ topHeader.scrollLeft = e.target.scrollLeft;
198
+ if (leftHeader)
199
+ leftHeader.scrollTop = e.target.scrollTop;
200
+ // Update fader visibility on scroll
201
+ setFader();
202
+ } },
203
+ react_1.default.createElement("div", { style: {
204
+ display: "flex",
205
+ flexDirection: "column",
177
206
  gap: _configs.gridGap + "px",
178
- }, onScroll: function (e) {
179
- // Sync vertical scroll with main content area
180
- if (scrollableRef.current) {
181
- scrollableRef.current.scrollTop = e.target.scrollTop;
182
- }
183
- } }, data.map(function (d, idx) { return (react_1.default.createElement("div", { key: idx, style: {
184
- height: _configs.cellSize + "px",
185
- textAlign: "right",
207
+ minWidth: 'max-content',
208
+ } }, data.map(function (d, rowIdx) { return (react_1.default.createElement("div", { key: rowIdx, style: {
186
209
  display: "flex",
187
210
  alignItems: "center",
188
- justifyContent: "flex-end",
211
+ gap: _configs.gridGap + "px",
189
212
  flexShrink: 0,
190
- } },
191
- react_1.default.createElement("div", { ref: function (el) { return setVerticalRef(idx, el); } },
192
- react_1.default.createElement(STYLED_UI_CAPTION_SEMIBOLD_DF, { style: {
193
- maxWidth: yWidth + "px",
194
- } }, d[0].labels.name.length > 50 ? d[0].labels.name.substring(0, 50) + "..." : d[0].labels.name)))); })),
195
- react_1.default.createElement("div", { ref: scrollableRef, style: {
196
- gridRow: 2,
197
- gridColumn: 2,
198
- overflow: 'auto',
199
- position: 'relative',
200
- }, onScroll: function (e) {
201
- // Sync scrolling with headers
202
- var topHeader = e.target.parentElement.children[1]; // Top-right header
203
- var leftHeader = e.target.parentElement.children[2]; // Bottom-left header
204
- if (topHeader)
205
- topHeader.scrollLeft = e.target.scrollLeft;
206
- if (leftHeader)
207
- leftHeader.scrollTop = e.target.scrollTop;
208
- // Update fader visibility on scroll
209
- setFader();
210
- } },
211
- react_1.default.createElement("div", { style: {
212
- display: "flex",
213
- flexDirection: "column",
214
- gap: _configs.gridGap + "px",
215
- minWidth: 'max-content',
216
- } }, data.map(function (d, rowIdx) { return (react_1.default.createElement("div", { key: rowIdx, style: {
217
- display: "flex",
218
- alignItems: "center",
219
- gap: _configs.gridGap + "px",
220
- flexShrink: 0,
221
- } }, d.map(function (dd, colIdx) {
222
- return react_1.default.createElement(HeatMapCell, { key: "".concat(rowIdx, "-").concat(colIdx), showPercent: false, dataMaxValue: dataMaxValue, value: dd });
223
- }))); })))),
213
+ } }, d.map(function (dd, colIdx) {
214
+ return react_1.default.createElement(HeatMapCell, { key: "".concat(rowIdx, "-").concat(colIdx), showPercent: false, dataMaxValue: dataMaxValue, value: dd });
215
+ }))); }))),
224
216
  showFader && react_1.default.createElement("div", { style: {
225
217
  background: "linear-gradient(to top, ".concat(__1.colors2.white, ", hsla(0, 0%, 100%, 0))"),
226
218
  position: 'absolute',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.197.2",
3
+ "version": "2.197.3",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",