@react-fabric/form 1.0.0-beta.44 → 1.0.0-beta.45

package/dist/cjs/select/DualList.js

@@ -13,13 +13,14 @@ var core = require('@dnd-kit/core');
 var utilities = require('@react-fabric/utilities');
 var jsxRuntime = require('react/jsx-runtime');
 
-var _excluded = ["ref", "value", "options", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
+var _excluded = ["ref", "value", "options", "emptyDisplay", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
 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; }
 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; }
 var DualList = function DualList(_ref) {
   var ref = _ref.ref,
     value = _ref.value,
     options = _ref.options,
+    emptyDisplay = _ref.emptyDisplay,
     groupProperty = _ref.groupProperty,
     _ref$height = _ref.height,
     height = _ref$height === void 0 ? "18rem" : _ref$height,
@@ -163,6 +164,7 @@ var DualList = function DualList(_ref) {
           error: error,
           height: height,
           options: leftOptions,
+          emptyDisplay: emptyDisplay,
           groupProperty: groupProperty,
           labelProperty: labelProperty,
           valueProperty: valueProperty,
@@ -218,6 +220,7 @@ var DualList = function DualList(_ref) {
           allowClear: true,
           height: height,
           options: rightOptions,
+          emptyDisplay: emptyDisplay,
           groupProperty: groupProperty,
           labelProperty: labelProperty,
           valueProperty: valueProperty,

package/dist/cjs/select/List.js

@@ -13,7 +13,7 @@ var Options = require('./Options.js');
 var useSelect = require('./useSelect.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-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"];
+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"];
 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; }
 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; }
 var List = function List(_ref) {
@@ -41,6 +41,7 @@ var List = function List(_ref) {
     onChange = _ref.onChange,
     onSelect = _ref.onSelect,
     onEnterPressed = _ref.onEnterPressed,
+    emptyDisplay = _ref.emptyDisplay,
     invalid = _ref.invalid,
     error = _ref.error;
     _ref.allowClear;
@@ -250,6 +251,7 @@ var List = function List(_ref) {
         labelProperty: labelProperty,
         itemRef: setItemRef,
         itemProps: makeItemProps,
+        empty: emptyDisplay,
         children: function children(item, label) {
           var _renderer3;
           return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;

package/dist/cjs/select/Select.js

@@ -12,7 +12,7 @@ var Options = require('./Options.js');
 var useSelect = require('./useSelect.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-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"];
+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"];
 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; }
 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; }
 var Select = function Select(_ref) {
@@ -38,6 +38,7 @@ var Select = function Select(_ref) {
     multiple = _ref.multiple,
     searchable = _ref.searchable,
     allowCreate = _ref.allowCreate,
+    emptyDisplay = _ref.emptyDisplay,
     createOption = _ref.createOption,
     matcher = _ref.matcher,
     renderer = _ref.renderer,
@@ -276,6 +277,7 @@ var Select = function Select(_ref) {
           labelProperty: labelProperty,
           itemRef: setItemRef,
           itemProps: makeItemProps,
+          empty: emptyDisplay,
           children: function children(item, label) {
             var _renderer3;
             return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;

package/dist/esm/select/DualList.js

@@ -13,13 +13,14 @@ import { useDraggable, useDroppable, DndContext, DragOverlay } from '@dnd-kit/co
 import { mergeRefs } from '@react-fabric/utilities';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var _excluded = ["ref", "value", "options", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
+var _excluded = ["ref", "value", "options", "emptyDisplay", "groupProperty", "height", "labelProperty", "valueProperty", "renderer", "onChange", "name", "invalid", "readOnly", "disabled", "placeholder", "autoFocus", "error"];
 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; }
 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; }
 var DualList = function DualList(_ref) {
   var ref = _ref.ref,
     value = _ref.value,
     options = _ref.options,
+    emptyDisplay = _ref.emptyDisplay,
     groupProperty = _ref.groupProperty,
     _ref$height = _ref.height,
     height = _ref$height === void 0 ? "18rem" : _ref$height,
@@ -163,6 +164,7 @@ var DualList = function DualList(_ref) {
           error: error,
           height: height,
           options: leftOptions,
+          emptyDisplay: emptyDisplay,
           groupProperty: groupProperty,
           labelProperty: labelProperty,
           valueProperty: valueProperty,
@@ -218,6 +220,7 @@ var DualList = function DualList(_ref) {
           allowClear: true,
           height: height,
           options: rightOptions,
+          emptyDisplay: emptyDisplay,
           groupProperty: groupProperty,
           labelProperty: labelProperty,
           valueProperty: valueProperty,

package/dist/esm/select/List.js

@@ -13,7 +13,7 @@ import { Options } from './Options.js';
 import { useSelect } from './useSelect.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-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"];
+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"];
 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; }
 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; }
 var List = function List(_ref) {
@@ -41,6 +41,7 @@ var List = function List(_ref) {
     onChange = _ref.onChange,
     onSelect = _ref.onSelect,
     onEnterPressed = _ref.onEnterPressed,
+    emptyDisplay = _ref.emptyDisplay,
     invalid = _ref.invalid,
     error = _ref.error;
     _ref.allowClear;
@@ -250,6 +251,7 @@ var List = function List(_ref) {
         labelProperty: labelProperty,
         itemRef: setItemRef,
         itemProps: makeItemProps,
+        empty: emptyDisplay,
         children: function children(item, label) {
           var _renderer3;
           return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;

package/dist/esm/select/Select.js

@@ -12,7 +12,7 @@ import { Options } from './Options.js';
 import { useSelect } from './useSelect.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-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"];
+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"];
 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; }
 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; }
 var Select = function Select(_ref) {
@@ -38,6 +38,7 @@ var Select = function Select(_ref) {
     multiple = _ref.multiple,
     searchable = _ref.searchable,
     allowCreate = _ref.allowCreate,
+    emptyDisplay = _ref.emptyDisplay,
     createOption = _ref.createOption,
     matcher = _ref.matcher,
     renderer = _ref.renderer,
@@ -276,6 +277,7 @@ var Select = function Select(_ref) {
           labelProperty: labelProperty,
           itemRef: setItemRef,
           itemProps: makeItemProps,
+          empty: emptyDisplay,
           children: function children(item, label) {
             var _renderer3;
             return (_renderer3 = renderer === null || renderer === void 0 ? void 0 : renderer(item)) !== null && _renderer3 !== void 0 ? _renderer3 : label;

package/dist/types/select/DualList.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { type RefProp } from "@react-fabric/core/dist/types/types";
+import { type ReactElement } from "react";
 import { type FieldProps } from "../input/Field";
 export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<HTMLInputElement> {
     /**
@@ -26,6 +26,10 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
      * value property name
      */
     valueProperty?: keyof T;
+    /**
+     * empty list display
+     */
+    emptyDisplay?: ReactElement;
     /**
      * item renderer
      */
@@ -35,4 +39,4 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
      */
     onChange?: (value?: string[]) => void;
 }
-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;
+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;

package/dist/types/select/List.d.ts

@@ -1,4 +1,4 @@
 import { type SelectProps } from "../types";
-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"> & {
+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"> & {
     height?: string | number;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/types/select/Select.d.ts

@@ -1,2 +1,2 @@
 import { type SelectProps } from "../types";
-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;
+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;

package/dist/types/types/index.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
+import { type ReactElement } from "react";
 export interface InputProps<V = string> extends TestProps {
     /**
      * value
@@ -125,6 +125,10 @@ export interface BaseSelectProps<T extends AnyObject = string> {
      * allow create item
      */
     allowCreate?: boolean;
+    /**
+     * empty list display
+     */
+    emptyDisplay?: ReactElement;
     /**
      * create new item object
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-fabric/form",
-  "version": "1.0.0-beta.44",
+  "version": "1.0.0-beta.45",
   "description": "RUF: Form package",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
@@ -41,9 +41,9 @@
     "@dnd-kit/utilities": "^3.2.2",
     "@floating-ui/react": "^0.26.24",
     "@hookform/resolvers": "^3.9.0",
-    "@react-fabric/core": "^1.0.0-beta.44",
-    "@react-fabric/date": "^1.0.0-beta.44",
-    "@react-fabric/utilities": "^1.0.0-beta.44",
+    "@react-fabric/core": "^1.0.0-beta.45",
+    "@react-fabric/date": "^1.0.0-beta.45",
+    "@react-fabric/utilities": "^1.0.0-beta.45",
     "classnames": "^2.5.1",
     "color": "^4.2.3",
     "react-color": "^2.19.3",
@@ -63,5 +63,5 @@
     "node": ">=18.12.0",
     "npm": ">=8.19.0"
   },
-  "gitHead": "5c05c100917811fa40b30c98b94fd396b1f68ea9"
+  "gitHead": "37d7cbcd99da40553f4ac775c3332d5281565936"
 }

package/src/select/DualList.tsx

@@ -24,6 +24,7 @@
 import { Button, ButtonGroup, CoreIcons } from "@react-fabric/core";
 import { type RefProp } from "@react-fabric/core/dist/types/types";
 import {
+  type ReactElement,
   useCallback,
   useDeferredValue,
   useEffect,
@@ -68,6 +69,10 @@ export interface DualListProps<T>
    * value property name
    */
   valueProperty?: keyof T;
+  /**
+   * empty list display
+   */
+  emptyDisplay?: ReactElement;
   /**
    * item renderer
    */
@@ -82,6 +87,7 @@ export const DualList = <T extends AnyObject = string>({
   ref,
   value,
   options,
+  emptyDisplay,
   groupProperty,
   height = "18rem",
   labelProperty = "label" as AnyObject,
@@ -210,6 +216,7 @@ export const DualList = <T extends AnyObject = string>({
             error={error}
             height={height}
             options={leftOptions}
+            emptyDisplay={emptyDisplay}
             groupProperty={groupProperty}
             labelProperty={labelProperty}
             valueProperty={valueProperty}
@@ -268,6 +275,7 @@ export const DualList = <T extends AnyObject = string>({
             allowClear
             height={height}
             options={rightOptions}
+            emptyDisplay={emptyDisplay}
             groupProperty={groupProperty}
             labelProperty={labelProperty}
             valueProperty={valueProperty}

package/src/select/List.tsx

@@ -63,6 +63,7 @@ export const List = <T extends AnyObject = string>({
   onChange,
   onSelect,
   onEnterPressed,
+  emptyDisplay,
   invalid,
   error,
   allowClear,
@@ -308,6 +309,7 @@ export const List = <T extends AnyObject = string>({
           labelProperty={labelProperty}
           itemRef={setItemRef}
           itemProps={makeItemProps}
+          empty={emptyDisplay}
         >
           {(item, label) => renderer?.(item) ?? label}
         </Options>

package/src/select/Select.tsx

@@ -64,6 +64,7 @@ export const Select = <T extends AnyObject = string>({
   multiple,
   searchable,
   allowCreate,
+  emptyDisplay,
   createOption,
   matcher,
   renderer,
@@ -345,6 +346,7 @@ export const Select = <T extends AnyObject = string>({
               labelProperty={labelProperty}
               itemRef={setItemRef}
               itemProps={makeItemProps}
+              empty={emptyDisplay}
             >
               {(item, label) => renderer?.(item) ?? label}
             </Options>

package/src/types/index.ts

@@ -25,6 +25,7 @@ import {
   type RefProp,
   type TestProps,
 } from "@react-fabric/core/dist/types/types";
+import { type ReactElement } from "react";
 
 export interface InputProps<V = string> extends TestProps {
   /**
@@ -155,6 +156,10 @@ export interface BaseSelectProps<T extends AnyObject = string> {
    * allow create item
    */
   allowCreate?: boolean;
+  /**
+   * empty list display
+   */
+  emptyDisplay?: ReactElement;
   /**
    * create new item object
    */