@react-fabric/form 1.0.0-beta.43 → 1.0.0-beta.45
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/cjs/input/Checkbox.js +1 -1
- package/dist/cjs/input/Radio.js +1 -1
- package/dist/cjs/input/Switch.js +1 -1
- package/dist/cjs/select/DualList.js +4 -1
- package/dist/cjs/select/List.js +3 -1
- package/dist/cjs/select/Select.js +3 -1
- package/dist/esm/input/Checkbox.js +1 -1
- package/dist/esm/input/Radio.js +1 -1
- package/dist/esm/input/Switch.js +1 -1
- package/dist/esm/select/DualList.js +4 -1
- package/dist/esm/select/List.js +3 -1
- package/dist/esm/select/Select.js +3 -1
- package/dist/types/select/DualList.d.ts +6 -2
- package/dist/types/select/List.d.ts +1 -1
- package/dist/types/select/Select.d.ts +1 -1
- package/dist/types/types/index.d.ts +5 -1
- package/package.json +5 -5
- package/src/input/Checkbox.tsx +1 -1
- package/src/input/Radio.tsx +1 -1
- package/src/input/Switch.tsx +1 -1
- package/src/select/DualList.tsx +8 -0
- package/src/select/List.tsx +2 -0
- package/src/select/Select.tsx +2 -0
- package/src/types/index.ts +5 -0
|
@@ -75,7 +75,7 @@ var Checkbox = function Checkbox(_ref) {
|
|
|
75
75
|
invalid: invalid,
|
|
76
76
|
error: error
|
|
77
77
|
}), label && /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
78
|
-
className: "flex-initial leading-
|
|
78
|
+
className: "flex-initial leading-tight truncate",
|
|
79
79
|
children: label
|
|
80
80
|
})]
|
|
81
81
|
});
|
package/dist/cjs/input/Radio.js
CHANGED
|
@@ -61,7 +61,7 @@ var Radio = function Radio(_ref) {
|
|
|
61
61
|
size: "1.25em",
|
|
62
62
|
icon: iconOff
|
|
63
63
|
}), label && /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
64
|
-
className: "flex-initial leading-
|
|
64
|
+
className: "flex-initial leading-tight truncate",
|
|
65
65
|
children: label
|
|
66
66
|
})]
|
|
67
67
|
});
|
package/dist/cjs/input/Switch.js
CHANGED
|
@@ -92,7 +92,7 @@ var Switch = function Switch(_ref) {
|
|
|
92
92
|
invalid: invalid,
|
|
93
93
|
error: error
|
|
94
94
|
}), label && /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
95
|
-
className: "flex-initial leading-
|
|
95
|
+
className: "flex-initial leading-tight truncate",
|
|
96
96
|
children: label
|
|
97
97
|
})]
|
|
98
98
|
});
|
|
@@ -13,13 +13,14 @@ var core = require('@dnd-kit/core');
|
|
|
13
13
|
var utilities = require('@react-fabric/utilities');
|
|
14
14
|
var jsxRuntime = require('react/jsx-runtime');
|
|
15
15
|
|
|
16
|
-
var _excluded = ["ref", "value", "options", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
|
|
16
|
+
var _excluded = ["ref", "value", "options", "emptyDisplay", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
|
|
17
17
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
18
18
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
19
19
|
var DualList = function DualList(_ref) {
|
|
20
20
|
var ref = _ref.ref,
|
|
21
21
|
value = _ref.value,
|
|
22
22
|
options = _ref.options,
|
|
23
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
23
24
|
groupProperty = _ref.groupProperty,
|
|
24
25
|
_ref$height = _ref.height,
|
|
25
26
|
height = _ref$height === void 0 ? "18rem" : _ref$height,
|
|
@@ -163,6 +164,7 @@ var DualList = function DualList(_ref) {
|
|
|
163
164
|
error: error,
|
|
164
165
|
height: height,
|
|
165
166
|
options: leftOptions,
|
|
167
|
+
emptyDisplay: emptyDisplay,
|
|
166
168
|
groupProperty: groupProperty,
|
|
167
169
|
labelProperty: labelProperty,
|
|
168
170
|
valueProperty: valueProperty,
|
|
@@ -218,6 +220,7 @@ var DualList = function DualList(_ref) {
|
|
|
218
220
|
allowClear: true,
|
|
219
221
|
height: height,
|
|
220
222
|
options: rightOptions,
|
|
223
|
+
emptyDisplay: emptyDisplay,
|
|
221
224
|
groupProperty: groupProperty,
|
|
222
225
|
labelProperty: labelProperty,
|
|
223
226
|
valueProperty: valueProperty,
|
package/dist/cjs/select/List.js
CHANGED
|
@@ -13,7 +13,7 @@ var Options = require('./Options.js');
|
|
|
13
13
|
var useSelect = require('./useSelect.js');
|
|
14
14
|
var jsxRuntime = require('react/jsx-runtime');
|
|
15
15
|
|
|
16
|
-
var _excluded = ["ref", "name", "value", "readOnly", "disabled", "required", "placeholder", "autoFocus", "options", "height", "groupProperty", "labelProperty", "valueProperty", "multiple", "allowCreate", "searchable", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed", "invalid", "error", "allowClear", "decorateStart", "decorateEnd", "data-inner", "data-hide-selected"];
|
|
16
|
+
var _excluded = ["ref", "name", "value", "readOnly", "disabled", "required", "placeholder", "autoFocus", "options", "height", "groupProperty", "labelProperty", "valueProperty", "multiple", "allowCreate", "searchable", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed", "emptyDisplay", "invalid", "error", "allowClear", "decorateStart", "decorateEnd", "data-inner", "data-hide-selected"];
|
|
17
17
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
18
18
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
19
19
|
var List = function List(_ref) {
|
|
@@ -41,6 +41,7 @@ var List = function List(_ref) {
|
|
|
41
41
|
onChange = _ref.onChange,
|
|
42
42
|
onSelect = _ref.onSelect,
|
|
43
43
|
onEnterPressed = _ref.onEnterPressed,
|
|
44
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
44
45
|
invalid = _ref.invalid,
|
|
45
46
|
error = _ref.error;
|
|
46
47
|
_ref.allowClear;
|
|
@@ -250,6 +251,7 @@ var List = function List(_ref) {
|
|
|
250
251
|
labelProperty: labelProperty,
|
|
251
252
|
itemRef: setItemRef,
|
|
252
253
|
itemProps: makeItemProps,
|
|
254
|
+
empty: emptyDisplay,
|
|
253
255
|
children: function children(item, label) {
|
|
254
256
|
var _renderer3;
|
|
255
257
|
return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;
|
|
@@ -12,7 +12,7 @@ var Options = require('./Options.js');
|
|
|
12
12
|
var useSelect = require('./useSelect.js');
|
|
13
13
|
var jsxRuntime = require('react/jsx-runtime');
|
|
14
14
|
|
|
15
|
-
var _excluded = ["ref", "name", "value", "invalid", "readOnly", "disabled", "required", "placeholder", "autoFocus", "error", "options", "defaultOpen", "hideHandle", "groupProperty", "labelProperty", "valueProperty", "multiple", "searchable", "allowCreate", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed"];
|
|
15
|
+
var _excluded = ["ref", "name", "value", "invalid", "readOnly", "disabled", "required", "placeholder", "autoFocus", "error", "options", "defaultOpen", "hideHandle", "groupProperty", "labelProperty", "valueProperty", "multiple", "searchable", "allowCreate", "emptyDisplay", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed"];
|
|
16
16
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
17
17
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
18
18
|
var Select = function Select(_ref) {
|
|
@@ -38,6 +38,7 @@ var Select = function Select(_ref) {
|
|
|
38
38
|
multiple = _ref.multiple,
|
|
39
39
|
searchable = _ref.searchable,
|
|
40
40
|
allowCreate = _ref.allowCreate,
|
|
41
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
41
42
|
createOption = _ref.createOption,
|
|
42
43
|
matcher = _ref.matcher,
|
|
43
44
|
renderer = _ref.renderer,
|
|
@@ -276,6 +277,7 @@ var Select = function Select(_ref) {
|
|
|
276
277
|
labelProperty: labelProperty,
|
|
277
278
|
itemRef: setItemRef,
|
|
278
279
|
itemProps: makeItemProps,
|
|
280
|
+
empty: emptyDisplay,
|
|
279
281
|
children: function children(item, label) {
|
|
280
282
|
var _renderer3;
|
|
281
283
|
return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;
|
package/dist/esm/input/Radio.js
CHANGED
package/dist/esm/input/Switch.js
CHANGED
|
@@ -13,13 +13,14 @@ import { useDraggable, useDroppable, DndContext, DragOverlay } from '@dnd-kit/co
|
|
|
13
13
|
import { mergeRefs } from '@react-fabric/utilities';
|
|
14
14
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
15
15
|
|
|
16
|
-
var _excluded = ["ref", "value", "options", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
|
|
16
|
+
var _excluded = ["ref", "value", "options", "emptyDisplay", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
|
|
17
17
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
18
18
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
19
19
|
var DualList = function DualList(_ref) {
|
|
20
20
|
var ref = _ref.ref,
|
|
21
21
|
value = _ref.value,
|
|
22
22
|
options = _ref.options,
|
|
23
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
23
24
|
groupProperty = _ref.groupProperty,
|
|
24
25
|
_ref$height = _ref.height,
|
|
25
26
|
height = _ref$height === void 0 ? "18rem" : _ref$height,
|
|
@@ -163,6 +164,7 @@ var DualList = function DualList(_ref) {
|
|
|
163
164
|
error: error,
|
|
164
165
|
height: height,
|
|
165
166
|
options: leftOptions,
|
|
167
|
+
emptyDisplay: emptyDisplay,
|
|
166
168
|
groupProperty: groupProperty,
|
|
167
169
|
labelProperty: labelProperty,
|
|
168
170
|
valueProperty: valueProperty,
|
|
@@ -218,6 +220,7 @@ var DualList = function DualList(_ref) {
|
|
|
218
220
|
allowClear: true,
|
|
219
221
|
height: height,
|
|
220
222
|
options: rightOptions,
|
|
223
|
+
emptyDisplay: emptyDisplay,
|
|
221
224
|
groupProperty: groupProperty,
|
|
222
225
|
labelProperty: labelProperty,
|
|
223
226
|
valueProperty: valueProperty,
|
package/dist/esm/select/List.js
CHANGED
|
@@ -13,7 +13,7 @@ import { Options } from './Options.js';
|
|
|
13
13
|
import { useSelect } from './useSelect.js';
|
|
14
14
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
15
15
|
|
|
16
|
-
var _excluded = ["ref", "name", "value", "readOnly", "disabled", "required", "placeholder", "autoFocus", "options", "height", "groupProperty", "labelProperty", "valueProperty", "multiple", "allowCreate", "searchable", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed", "invalid", "error", "allowClear", "decorateStart", "decorateEnd", "data-inner", "data-hide-selected"];
|
|
16
|
+
var _excluded = ["ref", "name", "value", "readOnly", "disabled", "required", "placeholder", "autoFocus", "options", "height", "groupProperty", "labelProperty", "valueProperty", "multiple", "allowCreate", "searchable", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed", "emptyDisplay", "invalid", "error", "allowClear", "decorateStart", "decorateEnd", "data-inner", "data-hide-selected"];
|
|
17
17
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
18
18
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
19
19
|
var List = function List(_ref) {
|
|
@@ -41,6 +41,7 @@ var List = function List(_ref) {
|
|
|
41
41
|
onChange = _ref.onChange,
|
|
42
42
|
onSelect = _ref.onSelect,
|
|
43
43
|
onEnterPressed = _ref.onEnterPressed,
|
|
44
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
44
45
|
invalid = _ref.invalid,
|
|
45
46
|
error = _ref.error;
|
|
46
47
|
_ref.allowClear;
|
|
@@ -250,6 +251,7 @@ var List = function List(_ref) {
|
|
|
250
251
|
labelProperty: labelProperty,
|
|
251
252
|
itemRef: setItemRef,
|
|
252
253
|
itemProps: makeItemProps,
|
|
254
|
+
empty: emptyDisplay,
|
|
253
255
|
children: function children(item, label) {
|
|
254
256
|
var _renderer3;
|
|
255
257
|
return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;
|
|
@@ -12,7 +12,7 @@ import { Options } from './Options.js';
|
|
|
12
12
|
import { useSelect } from './useSelect.js';
|
|
13
13
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
14
14
|
|
|
15
|
-
var _excluded = ["ref", "name", "value", "invalid", "readOnly", "disabled", "required", "placeholder", "autoFocus", "error", "options", "defaultOpen", "hideHandle", "groupProperty", "labelProperty", "valueProperty", "multiple", "searchable", "allowCreate", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed"];
|
|
15
|
+
var _excluded = ["ref", "name", "value", "invalid", "readOnly", "disabled", "required", "placeholder", "autoFocus", "error", "options", "defaultOpen", "hideHandle", "groupProperty", "labelProperty", "valueProperty", "multiple", "searchable", "allowCreate", "emptyDisplay", "createOption", "matcher", "renderer", "onQuery", "onChange", "onSelect", "onEnterPressed"];
|
|
16
16
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
17
17
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
18
18
|
var Select = function Select(_ref) {
|
|
@@ -38,6 +38,7 @@ var Select = function Select(_ref) {
|
|
|
38
38
|
multiple = _ref.multiple,
|
|
39
39
|
searchable = _ref.searchable,
|
|
40
40
|
allowCreate = _ref.allowCreate,
|
|
41
|
+
emptyDisplay = _ref.emptyDisplay,
|
|
41
42
|
createOption = _ref.createOption,
|
|
42
43
|
matcher = _ref.matcher,
|
|
43
44
|
renderer = _ref.renderer,
|
|
@@ -276,6 +277,7 @@ var Select = function Select(_ref) {
|
|
|
276
277
|
labelProperty: labelProperty,
|
|
277
278
|
itemRef: setItemRef,
|
|
278
279
|
itemProps: makeItemProps,
|
|
280
|
+
empty: emptyDisplay,
|
|
279
281
|
children: function children(item, label) {
|
|
280
282
|
var _renderer3;
|
|
281
283
|
return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { type RefProp } from "@react-fabric/core/dist/types/types";
|
|
2
|
+
import { type ReactElement } from "react";
|
|
3
3
|
import { type FieldProps } from "../input/Field";
|
|
4
4
|
export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<HTMLInputElement> {
|
|
5
5
|
/**
|
|
@@ -26,6 +26,10 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
|
|
|
26
26
|
* value property name
|
|
27
27
|
*/
|
|
28
28
|
valueProperty?: keyof T;
|
|
29
|
+
/**
|
|
30
|
+
* empty list display
|
|
31
|
+
*/
|
|
32
|
+
emptyDisplay?: ReactElement;
|
|
29
33
|
/**
|
|
30
34
|
* item renderer
|
|
31
35
|
*/
|
|
@@ -35,4 +39,4 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
|
|
|
35
39
|
*/
|
|
36
40
|
onChange?: (value?: string[]) => void;
|
|
37
41
|
}
|
|
38
|
-
export declare const DualList: <T extends unknown = string>({ ref, value, options, groupProperty, height, labelProperty, valueProperty, renderer, onChange, name, invalid, readOnly, disabled, placeholder, autoFocus, error, ...rest }: DualListProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
42
|
+
export declare const DualList: <T extends unknown = string>({ ref, value, options, emptyDisplay, groupProperty, height, labelProperty, valueProperty, renderer, onChange, name, invalid, readOnly, disabled, placeholder, autoFocus, error, ...rest }: DualListProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { type SelectProps } from "../types";
|
|
2
|
-
export declare const List: <T extends unknown = string>({ ref, name, value, readOnly, disabled, required, placeholder, autoFocus, options, height, groupProperty, labelProperty, valueProperty, multiple, allowCreate, searchable, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, invalid, error, allowClear, decorateStart, decorateEnd, "data-inner": isInner, "data-hide-selected": hideSelected, ...rest }: Omit<SelectProps<T>, "defaultOpen" | "hideHandle"> & {
|
|
2
|
+
export declare const List: <T extends unknown = string>({ ref, name, value, readOnly, disabled, required, placeholder, autoFocus, options, height, groupProperty, labelProperty, valueProperty, multiple, allowCreate, searchable, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, emptyDisplay, invalid, error, allowClear, decorateStart, decorateEnd, "data-inner": isInner, "data-hide-selected": hideSelected, ...rest }: Omit<SelectProps<T>, "defaultOpen" | "hideHandle"> & {
|
|
3
3
|
height?: string | number;
|
|
4
4
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { type SelectProps } from "../types";
|
|
2
|
-
export declare const Select: <T extends unknown = string>({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, options, defaultOpen, hideHandle, groupProperty, labelProperty, valueProperty, multiple, searchable, allowCreate, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, ...rest }: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const Select: <T extends unknown = string>({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, options, defaultOpen, hideHandle, groupProperty, labelProperty, valueProperty, multiple, searchable, allowCreate, emptyDisplay, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, ...rest }: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
|
|
2
|
+
import { type ReactElement } from "react";
|
|
3
3
|
export interface InputProps<V = string> extends TestProps {
|
|
4
4
|
/**
|
|
5
5
|
* value
|
|
@@ -125,6 +125,10 @@ export interface BaseSelectProps<T extends AnyObject = string> {
|
|
|
125
125
|
* allow create item
|
|
126
126
|
*/
|
|
127
127
|
allowCreate?: boolean;
|
|
128
|
+
/**
|
|
129
|
+
* empty list display
|
|
130
|
+
*/
|
|
131
|
+
emptyDisplay?: ReactElement;
|
|
128
132
|
/**
|
|
129
133
|
* create new item object
|
|
130
134
|
*/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-fabric/form",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.45",
|
|
4
4
|
"description": "RUF: Form package",
|
|
5
5
|
"author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -41,9 +41,9 @@
|
|
|
41
41
|
"@dnd-kit/utilities": "^3.2.2",
|
|
42
42
|
"@floating-ui/react": "^0.26.24",
|
|
43
43
|
"@hookform/resolvers": "^3.9.0",
|
|
44
|
-
"@react-fabric/core": "^1.0.0-beta.
|
|
45
|
-
"@react-fabric/date": "^1.0.0-beta.
|
|
46
|
-
"@react-fabric/utilities": "^1.0.0-beta.
|
|
44
|
+
"@react-fabric/core": "^1.0.0-beta.45",
|
|
45
|
+
"@react-fabric/date": "^1.0.0-beta.45",
|
|
46
|
+
"@react-fabric/utilities": "^1.0.0-beta.45",
|
|
47
47
|
"classnames": "^2.5.1",
|
|
48
48
|
"color": "^4.2.3",
|
|
49
49
|
"react-color": "^2.19.3",
|
|
@@ -63,5 +63,5 @@
|
|
|
63
63
|
"node": ">=18.12.0",
|
|
64
64
|
"npm": ">=8.19.0"
|
|
65
65
|
},
|
|
66
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "37d7cbcd99da40553f4ac775c3332d5281565936"
|
|
67
67
|
}
|
package/src/input/Checkbox.tsx
CHANGED
|
@@ -159,7 +159,7 @@ export const Checkbox = ({
|
|
|
159
159
|
/>
|
|
160
160
|
<ErrorIcon invalid={invalid} error={error} />
|
|
161
161
|
{label && (
|
|
162
|
-
<span className="flex-initial leading-
|
|
162
|
+
<span className="flex-initial leading-tight truncate">{label}</span>
|
|
163
163
|
)}
|
|
164
164
|
</label>
|
|
165
165
|
);
|
package/src/input/Radio.tsx
CHANGED
package/src/input/Switch.tsx
CHANGED
|
@@ -197,7 +197,7 @@ export const Switch = ({
|
|
|
197
197
|
</div>
|
|
198
198
|
<ErrorIcon invalid={invalid} error={error} />
|
|
199
199
|
{label && (
|
|
200
|
-
<span className="flex-initial leading-
|
|
200
|
+
<span className="flex-initial leading-tight truncate">{label}</span>
|
|
201
201
|
)}
|
|
202
202
|
</label>
|
|
203
203
|
);
|
package/src/select/DualList.tsx
CHANGED
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
import { Button, ButtonGroup, CoreIcons } from "@react-fabric/core";
|
|
25
25
|
import { type RefProp } from "@react-fabric/core/dist/types/types";
|
|
26
26
|
import {
|
|
27
|
+
type ReactElement,
|
|
27
28
|
useCallback,
|
|
28
29
|
useDeferredValue,
|
|
29
30
|
useEffect,
|
|
@@ -68,6 +69,10 @@ export interface DualListProps<T>
|
|
|
68
69
|
* value property name
|
|
69
70
|
*/
|
|
70
71
|
valueProperty?: keyof T;
|
|
72
|
+
/**
|
|
73
|
+
* empty list display
|
|
74
|
+
*/
|
|
75
|
+
emptyDisplay?: ReactElement;
|
|
71
76
|
/**
|
|
72
77
|
* item renderer
|
|
73
78
|
*/
|
|
@@ -82,6 +87,7 @@ export const DualList = <T extends AnyObject = string>({
|
|
|
82
87
|
ref,
|
|
83
88
|
value,
|
|
84
89
|
options,
|
|
90
|
+
emptyDisplay,
|
|
85
91
|
groupProperty,
|
|
86
92
|
height = "18rem",
|
|
87
93
|
labelProperty = "label" as AnyObject,
|
|
@@ -210,6 +216,7 @@ export const DualList = <T extends AnyObject = string>({
|
|
|
210
216
|
error={error}
|
|
211
217
|
height={height}
|
|
212
218
|
options={leftOptions}
|
|
219
|
+
emptyDisplay={emptyDisplay}
|
|
213
220
|
groupProperty={groupProperty}
|
|
214
221
|
labelProperty={labelProperty}
|
|
215
222
|
valueProperty={valueProperty}
|
|
@@ -268,6 +275,7 @@ export const DualList = <T extends AnyObject = string>({
|
|
|
268
275
|
allowClear
|
|
269
276
|
height={height}
|
|
270
277
|
options={rightOptions}
|
|
278
|
+
emptyDisplay={emptyDisplay}
|
|
271
279
|
groupProperty={groupProperty}
|
|
272
280
|
labelProperty={labelProperty}
|
|
273
281
|
valueProperty={valueProperty}
|
package/src/select/List.tsx
CHANGED
|
@@ -63,6 +63,7 @@ export const List = <T extends AnyObject = string>({
|
|
|
63
63
|
onChange,
|
|
64
64
|
onSelect,
|
|
65
65
|
onEnterPressed,
|
|
66
|
+
emptyDisplay,
|
|
66
67
|
invalid,
|
|
67
68
|
error,
|
|
68
69
|
allowClear,
|
|
@@ -308,6 +309,7 @@ export const List = <T extends AnyObject = string>({
|
|
|
308
309
|
labelProperty={labelProperty}
|
|
309
310
|
itemRef={setItemRef}
|
|
310
311
|
itemProps={makeItemProps}
|
|
312
|
+
empty={emptyDisplay}
|
|
311
313
|
>
|
|
312
314
|
{(item, label) => renderer?.(item) ?? label}
|
|
313
315
|
</Options>
|
package/src/select/Select.tsx
CHANGED
|
@@ -64,6 +64,7 @@ export const Select = <T extends AnyObject = string>({
|
|
|
64
64
|
multiple,
|
|
65
65
|
searchable,
|
|
66
66
|
allowCreate,
|
|
67
|
+
emptyDisplay,
|
|
67
68
|
createOption,
|
|
68
69
|
matcher,
|
|
69
70
|
renderer,
|
|
@@ -345,6 +346,7 @@ export const Select = <T extends AnyObject = string>({
|
|
|
345
346
|
labelProperty={labelProperty}
|
|
346
347
|
itemRef={setItemRef}
|
|
347
348
|
itemProps={makeItemProps}
|
|
349
|
+
empty={emptyDisplay}
|
|
348
350
|
>
|
|
349
351
|
{(item, label) => renderer?.(item) ?? label}
|
|
350
352
|
</Options>
|
package/src/types/index.ts
CHANGED
|
@@ -25,6 +25,7 @@ import {
|
|
|
25
25
|
type RefProp,
|
|
26
26
|
type TestProps,
|
|
27
27
|
} from "@react-fabric/core/dist/types/types";
|
|
28
|
+
import { type ReactElement } from "react";
|
|
28
29
|
|
|
29
30
|
export interface InputProps<V = string> extends TestProps {
|
|
30
31
|
/**
|
|
@@ -155,6 +156,10 @@ export interface BaseSelectProps<T extends AnyObject = string> {
|
|
|
155
156
|
* allow create item
|
|
156
157
|
*/
|
|
157
158
|
allowCreate?: boolean;
|
|
159
|
+
/**
|
|
160
|
+
* empty list display
|
|
161
|
+
*/
|
|
162
|
+
emptyDisplay?: ReactElement;
|
|
158
163
|
/**
|
|
159
164
|
* create new item object
|
|
160
165
|
*/
|