@react-fabric/data 1.0.0-beta.30 → 1.0.0-beta.31

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 (10) hide show
  1. package/dist/cjs/json/JsonViewer.js +30 -23
  2. package/dist/cjs/virtual/Gallery.js +2 -2
  3. package/dist/cjs/virtual/List.js +2 -2
  4. package/dist/esm/json/JsonViewer.js +31 -24
  5. package/dist/esm/virtual/Gallery.js +2 -2
  6. package/dist/esm/virtual/List.js +2 -2
  7. package/package.json +6 -6
  8. package/src/json/JsonViewer.tsx +31 -31
  9. package/src/virtual/Gallery.tsx +2 -2
  10. package/src/virtual/List.tsx +2 -2
package/dist/cjs/json/JsonViewer.js CHANGED
@@ -99,6 +99,11 @@ var JsonEntry = function JsonEntry(_ref3) {
99
99
  clamp: 3,
100
100
  children: ret
101
101
  });
102
+ } else {
103
+ ret = /*#__PURE__*/jsxRuntime.jsx("div", {
104
+ className: "break-words",
105
+ children: ret
106
+ });
102
107
  }
103
108
  return /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
104
109
  children: [ret, utilities.isObject(value) && value._score_ > 0 && /*#__PURE__*/jsxRuntime.jsx(core.Meter, {
@@ -120,28 +125,30 @@ var JsonEntry = function JsonEntry(_ref3) {
120
125
  }, [filters, path, pathWithoutOrdinal]);
121
126
  var labelDisplay = react.useMemo(function () {
122
127
  var _labeler;
123
- return /*#__PURE__*/jsxRuntime.jsx(core.ActionLabel, {
124
- className: "text-dimmed text-sm px-2 flex-1 truncate",
125
- actions: !canExpand && canFilter ? [/*#__PURE__*/jsxRuntime.jsx(core.Button, {
126
- color: "danger",
127
- size: "sm",
128
- variant: "link",
129
- icon: core.CoreIcons.funnelMinus,
130
- "aria-label": "Filter Negative",
131
- onClick: function onClick() {
132
- return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
133
- }
134
- }, "negative"), /*#__PURE__*/jsxRuntime.jsx(core.Button, {
135
- color: "primary",
136
- size: "sm",
137
- variant: "link",
138
- icon: core.CoreIcons.funnelPlus,
139
- "aria-label": "Filter",
140
- onClick: function onClick() {
141
- return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
142
- }
143
- }, "positive")] : [],
144
- children: (_labeler = labeler === null || labeler === void 0 ? void 0 : labeler(path)) !== null && _labeler !== void 0 ? _labeler : field
128
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
129
+ className: classNames("text-dimmed text-sm px-2 flex-1 group", inline ? "truncate" : "break-words"),
130
+ children: [!canExpand && canFilter && /*#__PURE__*/jsxRuntime.jsxs("div", {
131
+ className: "hidden pe-1 group-hover:inline-block",
132
+ children: [/*#__PURE__*/jsxRuntime.jsx(core.Button, {
133
+ color: "danger",
134
+ size: "xs",
135
+ variant: "link",
136
+ icon: core.CoreIcons.funnelMinus,
137
+ "aria-label": "Filter Negative",
138
+ onClick: function onClick() {
139
+ return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
140
+ }
141
+ }, "negative"), /*#__PURE__*/jsxRuntime.jsx(core.Button, {
142
+ color: "primary",
143
+ size: "xs",
144
+ variant: "link",
145
+ icon: core.CoreIcons.funnelPlus,
146
+ "aria-label": "Filter",
147
+ onClick: function onClick() {
148
+ return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
149
+ }
150
+ }, "positive")]
151
+ }), (_labeler = labeler === null || labeler === void 0 ? void 0 : labeler(path)) !== null && _labeler !== void 0 ? _labeler : field]
145
152
  });
146
153
  }, [field, labeler, pathWithoutOrdinal, actualValue, canExpand, canFilter]);
147
154
  return /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
@@ -223,7 +230,7 @@ var JsonViewer = function JsonViewer(_ref5) {
223
230
  return reduceObject(json);
224
231
  }, [json]);
225
232
  return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({}, rest), {}, {
226
- className: classNames(className, "p-4 bg-alternate"),
233
+ className: classNames(className, "bg-alternate"),
227
234
  children: !utilities.isEmpty(json) ? list.map(function (item) {
228
235
  return /*#__PURE__*/jsxRuntime.jsx(JsonEntry, _objectSpread(_objectSpread({}, item), {}, {
229
236
  copy: copy,
package/dist/cjs/virtual/Gallery.js CHANGED
@@ -152,14 +152,14 @@ var _VirtualGallery = function _VirtualGallery(_ref) {
152
152
  return {
153
153
  scrollToItem: function scrollToItem(index) {
154
154
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
155
- align: "start"
155
+ align: "auto"
156
156
  });
157
157
  },
158
158
  hilight: function hilight(index) {
159
159
  var _scrollerRef$current2;
160
160
  (_scrollerRef$current2 = scrollerRef.current) === null || _scrollerRef$current2 === void 0 || (_scrollerRef$current2 = _scrollerRef$current2.querySelector(".hilight")) === null || _scrollerRef$current2 === void 0 || _scrollerRef$current2.classList.remove("hilight", "ring-1");
161
161
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
162
- align: "start"
162
+ align: "auto"
163
163
  });
164
164
  setTimeout(function () {
165
165
  var _scrollerRef$current3;
package/dist/cjs/virtual/List.js CHANGED
@@ -141,14 +141,14 @@ var _VirtualList = function _VirtualList(_ref) {
141
141
  return {
142
142
  scrollToItem: function scrollToItem(index) {
143
143
  virtualizer.scrollToIndex(index, {
144
- align: "start"
144
+ align: "auto"
145
145
  });
146
146
  },
147
147
  hilight: function hilight(index) {
148
148
  var _scrollerRef$current2;
149
149
  (_scrollerRef$current2 = scrollerRef.current) === null || _scrollerRef$current2 === void 0 || (_scrollerRef$current2 = _scrollerRef$current2.querySelector(".hilight")) === null || _scrollerRef$current2 === void 0 || _scrollerRef$current2.classList.remove("hilight", "ring-1");
150
150
  virtualizer.scrollToIndex(Math.floor(index), {
151
- align: "start"
151
+ align: "auto"
152
152
  });
153
153
  setTimeout(function () {
154
154
  var _scrollerRef$current3;
package/dist/esm/json/JsonViewer.js CHANGED
@@ -4,7 +4,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
4
4
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
5
5
  import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
6
6
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
7
- import { EmptyContent, Text, Meter, ActionLabel, Button, CoreIcons, Icon, Copy } from '@react-fabric/core';
7
+ import { EmptyContent, Text, Meter, Button, CoreIcons, Icon, Copy } from '@react-fabric/core';
8
8
  import { isEmpty, isArray, isObject, isNil, Format, isBoolean, isTrue } from '@react-fabric/utilities';
9
9
  import classNames from 'classnames';
10
10
  import { useMemo, useState, Fragment } from 'react';
@@ -99,6 +99,11 @@ var JsonEntry = function JsonEntry(_ref3) {
99
99
  clamp: 3,
100
100
  children: ret
101
101
  });
102
+ } else {
103
+ ret = /*#__PURE__*/jsx("div", {
104
+ className: "break-words",
105
+ children: ret
106
+ });
102
107
  }
103
108
  return /*#__PURE__*/jsxs(Fragment, {
104
109
  children: [ret, isObject(value) && value._score_ > 0 && /*#__PURE__*/jsx(Meter, {
@@ -120,28 +125,30 @@ var JsonEntry = function JsonEntry(_ref3) {
120
125
  }, [filters, path, pathWithoutOrdinal]);
121
126
  var labelDisplay = useMemo(function () {
122
127
  var _labeler;
123
- return /*#__PURE__*/jsx(ActionLabel, {
124
- className: "text-dimmed text-sm px-2 flex-1 truncate",
125
- actions: !canExpand && canFilter ? [/*#__PURE__*/jsx(Button, {
126
- color: "danger",
127
- size: "sm",
128
- variant: "link",
129
- icon: CoreIcons.funnelMinus,
130
- "aria-label": "Filter Negative",
131
- onClick: function onClick() {
132
- return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
133
- }
134
- }, "negative"), /*#__PURE__*/jsx(Button, {
135
- color: "primary",
136
- size: "sm",
137
- variant: "link",
138
- icon: CoreIcons.funnelPlus,
139
- "aria-label": "Filter",
140
- onClick: function onClick() {
141
- return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
142
- }
143
- }, "positive")] : [],
144
- children: (_labeler = labeler === null || labeler === void 0 ? void 0 : labeler(path)) !== null && _labeler !== void 0 ? _labeler : field
128
+ return /*#__PURE__*/jsxs("div", {
129
+ className: classNames("text-dimmed text-sm px-2 flex-1 group", inline ? "truncate" : "break-words"),
130
+ children: [!canExpand && canFilter && /*#__PURE__*/jsxs("div", {
131
+ className: "hidden pe-1 group-hover:inline-block",
132
+ children: [/*#__PURE__*/jsx(Button, {
133
+ color: "danger",
134
+ size: "xs",
135
+ variant: "link",
136
+ icon: CoreIcons.funnelMinus,
137
+ "aria-label": "Filter Negative",
138
+ onClick: function onClick() {
139
+ return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
140
+ }
141
+ }, "negative"), /*#__PURE__*/jsx(Button, {
142
+ color: "primary",
143
+ size: "xs",
144
+ variant: "link",
145
+ icon: CoreIcons.funnelPlus,
146
+ "aria-label": "Filter",
147
+ onClick: function onClick() {
148
+ return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
149
+ }
150
+ }, "positive")]
151
+ }), (_labeler = labeler === null || labeler === void 0 ? void 0 : labeler(path)) !== null && _labeler !== void 0 ? _labeler : field]
145
152
  });
146
153
  }, [field, labeler, pathWithoutOrdinal, actualValue, canExpand, canFilter]);
147
154
  return /*#__PURE__*/jsxs(Fragment, {
@@ -223,7 +230,7 @@ var JsonViewer = function JsonViewer(_ref5) {
223
230
  return reduceObject(json);
224
231
  }, [json]);
225
232
  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, rest), {}, {
226
- className: classNames(className, "p-4 bg-alternate"),
233
+ className: classNames(className, "bg-alternate"),
227
234
  children: !isEmpty(json) ? list.map(function (item) {
228
235
  return /*#__PURE__*/jsx(JsonEntry, _objectSpread(_objectSpread({}, item), {}, {
229
236
  copy: copy,
package/dist/esm/virtual/Gallery.js CHANGED
@@ -152,14 +152,14 @@ var _VirtualGallery = function _VirtualGallery(_ref) {
152
152
  return {
153
153
  scrollToItem: function scrollToItem(index) {
154
154
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
155
- align: "start"
155
+ align: "auto"
156
156
  });
157
157
  },
158
158
  hilight: function hilight(index) {
159
159
  var _scrollerRef$current2;
160
160
  (_scrollerRef$current2 = scrollerRef.current) === null || _scrollerRef$current2 === void 0 || (_scrollerRef$current2 = _scrollerRef$current2.querySelector(".hilight")) === null || _scrollerRef$current2 === void 0 || _scrollerRef$current2.classList.remove("hilight", "ring-1");
161
161
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
162
- align: "start"
162
+ align: "auto"
163
163
  });
164
164
  setTimeout(function () {
165
165
  var _scrollerRef$current3;
package/dist/esm/virtual/List.js CHANGED
@@ -141,14 +141,14 @@ var _VirtualList = function _VirtualList(_ref) {
141
141
  return {
142
142
  scrollToItem: function scrollToItem(index) {
143
143
  virtualizer.scrollToIndex(index, {
144
- align: "start"
144
+ align: "auto"
145
145
  });
146
146
  },
147
147
  hilight: function hilight(index) {
148
148
  var _scrollerRef$current2;
149
149
  (_scrollerRef$current2 = scrollerRef.current) === null || _scrollerRef$current2 === void 0 || (_scrollerRef$current2 = _scrollerRef$current2.querySelector(".hilight")) === null || _scrollerRef$current2 === void 0 || _scrollerRef$current2.classList.remove("hilight", "ring-1");
150
150
  virtualizer.scrollToIndex(Math.floor(index), {
151
- align: "start"
151
+ align: "auto"
152
152
  });
153
153
  setTimeout(function () {
154
154
  var _scrollerRef$current3;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-fabric/data",
3
- "version": "1.0.0-beta.30",
3
+ "version": "1.0.0-beta.31",
4
4
  "description": "RUF: Data package",
5
5
  "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
6
6
  "license": "MIT",
@@ -33,10 +33,10 @@
33
33
  "watch": "npm-run-all -p watch:rollup watch:dts"
34
34
  },
35
35
  "dependencies": {
36
- "@react-fabric/core": "^1.0.0-beta.30",
37
- "@react-fabric/date": "^1.0.0-beta.30",
38
- "@react-fabric/form": "^1.0.0-beta.30",
39
- "@react-fabric/utilities": "^1.0.0-beta.30",
36
+ "@react-fabric/core": "^1.0.0-beta.31",
37
+ "@react-fabric/date": "^1.0.0-beta.31",
38
+ "@react-fabric/form": "^1.0.0-beta.31",
39
+ "@react-fabric/utilities": "^1.0.0-beta.31",
40
40
  "@tanstack/react-virtual": "^3.8.6",
41
41
  "classnames": "^2.5.1",
42
42
  "color": "^4.2.3",
@@ -52,5 +52,5 @@
52
52
  "node": ">=18.12.0",
53
53
  "npm": ">=8.19.0"
54
54
  },
55
- "gitHead": "5b10298b7627c2e56bcccf18100b6d85a02c9b06"
55
+ "gitHead": "de71c6875264d385666d0fa441785b9884951561"
56
56
  }
package/src/json/JsonViewer.tsx CHANGED
@@ -22,7 +22,6 @@
22
22
  */
23
23
 
24
24
  import {
25
- ActionLabel,
26
25
  Button,
27
26
  Copy,
28
27
  CoreIcons,
@@ -181,6 +180,8 @@ const JsonEntry = ({
181
180
  ret = actualValue ? t("json.true") : t("json.false");
182
181
  if (ret?.length > 128) {
183
182
  ret = <Text clamp={3}>{ret}</Text>;
183
+ } else {
184
+ ret = <div className="break-words">{ret}</div>;
184
185
  }
185
186
 
186
187
  return (
@@ -216,37 +217,36 @@ const JsonEntry = ({
216
217
 
217
218
  const labelDisplay = useMemo(
218
219
  () => (
219
- <ActionLabel
220
- className="text-dimmed text-sm px-2 flex-1 truncate"
221
- actions={
222
- !canExpand && canFilter
223
- ? [
224
- <Button
225
- key="negative"
226
- color="danger"
227
- size="sm"
228
- variant="link"
229
- icon={CoreIcons.funnelMinus}
230
- aria-label="Filter Negative"
231
- onClick={() =>
232
- onFilter?.(pathWithoutOrdinal, actualValue, true)
233
- }
234
- />,
235
- <Button
236
- key="positive"
237
- color="primary"
238
- size="sm"
239
- variant="link"
240
- icon={CoreIcons.funnelPlus}
241
- aria-label="Filter"
242
- onClick={() => onFilter?.(pathWithoutOrdinal, actualValue)}
243
- />,
244
- ]
245
- : []
246
- }
220
+ <div
221
+ className={classNames(
222
+ "text-dimmed text-sm px-2 flex-1 group",
223
+ inline ? "truncate" : "break-words",
224
+ )}
247
225
  >
226
+ {!canExpand && canFilter && (
227
+ <div className="hidden pe-1 group-hover:inline-block">
228
+ <Button
229
+ key="negative"
230
+ color="danger"
231
+ size="xs"
232
+ variant="link"
233
+ icon={CoreIcons.funnelMinus}
234
+ aria-label="Filter Negative"
235
+ onClick={() => onFilter?.(pathWithoutOrdinal, actualValue, true)}
236
+ />
237
+ <Button
238
+ key="positive"
239
+ color="primary"
240
+ size="xs"
241
+ variant="link"
242
+ icon={CoreIcons.funnelPlus}
243
+ aria-label="Filter"
244
+ onClick={() => onFilter?.(pathWithoutOrdinal, actualValue)}
245
+ />
246
+ </div>
247
+ )}
248
248
  {labeler?.(path) ?? field}
249
- </ActionLabel>
249
+ </div>
250
250
  ),
251
251
  [field, labeler, pathWithoutOrdinal, actualValue, canExpand, canFilter],
252
252
  );
@@ -356,7 +356,7 @@ export const JsonViewer = <T extends KeyValue = KeyValue>({
356
356
  const list = useMemo(() => reduceObject(json), [json]);
357
357
 
358
358
  return (
359
- <div {...rest} className={classNames(className, "p-4 bg-alternate")}>
359
+ <div {...rest} className={classNames(className, "bg-alternate")}>
360
360
  {!isEmpty(json) ? (
361
361
  list.map((item) => (
362
362
  <JsonEntry
package/src/virtual/Gallery.tsx CHANGED
@@ -248,7 +248,7 @@ const _VirtualGallery = <T extends KeyValue>({
248
248
  () => ({
249
249
  scrollToItem(index) {
250
250
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
251
- align: "start",
251
+ align: "auto",
252
252
  });
253
253
  },
254
254
  hilight(index) {
@@ -256,7 +256,7 @@ const _VirtualGallery = <T extends KeyValue>({
256
256
  ?.querySelector(".hilight")
257
257
  ?.classList.remove("hilight", "ring-1");
258
258
  virtualizer.scrollToIndex(Math.floor(index / columnCount), {
259
- align: "start",
259
+ align: "auto",
260
260
  });
261
261
  setTimeout(() => {
262
262
  scrollerRef.current
package/src/virtual/List.tsx CHANGED
@@ -235,14 +235,14 @@ const _VirtualList = <T extends KeyValue>({
235
235
  listRef,
236
236
  () => ({
237
237
  scrollToItem(index) {
238
- virtualizer.scrollToIndex(index, { align: "start" });
238
+ virtualizer.scrollToIndex(index, { align: "auto" });
239
239
  },
240
240
  hilight(index) {
241
241
  scrollerRef.current
242
242
  ?.querySelector(".hilight")
243
243
  ?.classList.remove("hilight", "ring-1");
244
244
  virtualizer.scrollToIndex(Math.floor(index), {
245
- align: "start",
245
+ align: "auto",
246
246
  });
247
247
  setTimeout(() => {
248
248
  scrollerRef.current