@sebgroup/green-react 1.0.0-beta.23 → 1.0.0-beta.24

package/index.esm.js

@@ -1061,11 +1061,13 @@ function Button({
   children,
   variant,
   onClick,
+  disabled,
   active = false,
   type = 'button'
 }) {
   const props = {
-    type
+    type,
+    disabled
   };
   const classNames = [];
   if (variant) classNames.push(variant);
@@ -2676,8 +2678,8 @@ const useDropdown = ({
   loop,
   multiSelect,
   searchable,
-  searchableProperties,
-  selectValue,
+  searchFilter,
+  compareWith,
   useValue,
   display,
   togglerRef,
@@ -2721,14 +2723,7 @@ const useDropdown = ({
           className: (_a = o.classes) === null || _a === void 0 ? void 0 : _a.join(' '),
           children: o[dropdown.display],
           selected: o.selected,
-          onClick: () => {
-            handler === null || handler === void 0 ? void 0 : handler.select(o).then(() => {
-              if (onChange) {
-                const result = options.find(item => item.key === o.key);
-                result && onChange(result);
-              }
-            });
-          }
+          onClick: () => handler === null || handler === void 0 ? void 0 : handler.select(o)
         });
       });
       setListItems(newListItems);
@@ -2740,14 +2735,7 @@ const useDropdown = ({
         inputProps: {
           defaultChecked: o.selected,
           type: 'checkbox',
-          onChange: () => {
-            handler === null || handler === void 0 ? void 0 : handler.select(o, false).then(() => {
-              if (onChange) {
-                const result = options.find(item => item.key === o.key);
-                result && onChange(result);
-              }
-            });
-          }
+          onClick: () => handler === null || handler === void 0 ? void 0 : handler.select(o, false)
         },
         spanProps: {
           children: o[dropdown.display]
@@ -2781,7 +2769,7 @@ const useDropdown = ({
       loop,
       multiSelect
     }); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [id, texts, options, loop, multiSelect, searchable, searchableProperties, selectValue, useValue, display]); // When validator changes
+  }, [id, texts, options, loop, multiSelect, searchable, searchFilter, compareWith, useValue, display]); // When validator changes
 
   useEffect(() => {
     if (!dropdown) return;
@@ -2797,12 +2785,12 @@ const useDropdown = ({
         loop,
         multiSelect,
         searchable,
-        searchableProperties,
-        selectValue,
+        searchFilter,
+        compareWith,
         useValue,
         display,
         validator
-      }, togglerRef.current, listboxRef.current, listboxRef.current, dd => setDropdown(dd)));
+      }, togglerRef.current, listboxRef.current, listboxRef.current, dd => setDropdown(dd), value => onChange === null || onChange === void 0 ? void 0 : onChange(value)));
     }
 
     return () => handler === null || handler === void 0 ? void 0 : handler.destroy(); // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -2822,7 +2810,8 @@ const Dropdown = ({
   loop,
   multiSelect,
   searchable,
-  selectValue,
+  searchFilter,
+  compareWith,
   useValue,
   display,
   texts,
@@ -2845,7 +2834,8 @@ const Dropdown = ({
     loop,
     multiSelect,
     searchable,
-    selectValue,
+    searchFilter,
+    compareWith,
     useValue,
     display,
     togglerRef,

package/index.umd.js

@@ -1067,11 +1067,13 @@
 	  children,
 	  variant,
 	  onClick,
+	  disabled,
 	  active = false,
 	  type = 'button'
 	}) {
 	  const props = {
-	    type
+	    type,
+	    disabled
 	  };
 	  const classNames = [];
 	  if (variant) classNames.push(variant);
@@ -2682,8 +2684,8 @@
 	  loop,
 	  multiSelect,
 	  searchable,
-	  searchableProperties,
-	  selectValue,
+	  searchFilter,
+	  compareWith,
 	  useValue,
 	  display,
 	  togglerRef,
@@ -2727,14 +2729,7 @@
 	          className: (_a = o.classes) === null || _a === void 0 ? void 0 : _a.join(' '),
 	          children: o[dropdown.display],
 	          selected: o.selected,
-	          onClick: () => {
-	            handler === null || handler === void 0 ? void 0 : handler.select(o).then(() => {
-	              if (onChange) {
-	                const result = options.find(item => item.key === o.key);
-	                result && onChange(result);
-	              }
-	            });
-	          }
+	          onClick: () => handler === null || handler === void 0 ? void 0 : handler.select(o)
 	        });
 	      });
 	      setListItems(newListItems);
@@ -2746,14 +2741,7 @@
 	        inputProps: {
 	          defaultChecked: o.selected,
 	          type: 'checkbox',
-	          onChange: () => {
-	            handler === null || handler === void 0 ? void 0 : handler.select(o, false).then(() => {
-	              if (onChange) {
-	                const result = options.find(item => item.key === o.key);
-	                result && onChange(result);
-	              }
-	            });
-	          }
+	          onClick: () => handler === null || handler === void 0 ? void 0 : handler.select(o, false)
 	        },
 	        spanProps: {
 	          children: o[dropdown.display]
@@ -2787,7 +2775,7 @@
 	      loop,
 	      multiSelect
 	    }); // eslint-disable-next-line react-hooks/exhaustive-deps
-	  }, [id, texts, options, loop, multiSelect, searchable, searchableProperties, selectValue, useValue, display]); // When validator changes
+	  }, [id, texts, options, loop, multiSelect, searchable, searchFilter, compareWith, useValue, display]); // When validator changes
 
 	  React.useEffect(() => {
 	    if (!dropdown) return;
@@ -2803,12 +2791,12 @@
 	        loop,
 	        multiSelect,
 	        searchable,
-	        searchableProperties,
-	        selectValue,
+	        searchFilter,
+	        compareWith,
 	        useValue,
 	        display,
 	        validator
-	      }, togglerRef.current, listboxRef.current, listboxRef.current, dd => setDropdown(dd)));
+	      }, togglerRef.current, listboxRef.current, listboxRef.current, dd => setDropdown(dd), value => onChange === null || onChange === void 0 ? void 0 : onChange(value)));
 	    }
 
 	    return () => handler === null || handler === void 0 ? void 0 : handler.destroy(); // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -2828,7 +2816,8 @@
 	  loop,
 	  multiSelect,
 	  searchable,
-	  selectValue,
+	  searchFilter,
+	  compareWith,
 	  useValue,
 	  display,
 	  texts,
@@ -2851,7 +2840,8 @@
 	    loop,
 	    multiSelect,
 	    searchable,
-	    selectValue,
+	    searchFilter,
+	    compareWith,
 	    useValue,
 	    display,
 	    togglerRef,

package/lib/dropdown/dropdown.d.ts

@@ -1,17 +1,6 @@
-import { DropdownOption, DropdownTexts } from '@sebgroup/extract';
-import { IValidator } from "@sebgroup/extract";
-export interface DropdownProps {
-    id?: string;
-    texts?: DropdownTexts;
-    options: DropdownOption[];
-    useValue?: string;
-    display?: string;
-    selectValue?: string;
-    loop?: boolean;
-    multiSelect?: boolean;
-    searchable?: boolean;
-    onChange?: (o: DropdownOption) => void;
-    validator?: IValidator;
+import { DropdownArgs, OnChange } from '@sebgroup/extract';
+export interface DropdownProps extends DropdownArgs {
+    onChange?: OnChange;
 }
-export declare const Dropdown: ({ id, options, loop, multiSelect, searchable, selectValue, useValue, display, texts, onChange, validator }: DropdownProps) => JSX.Element;
+export declare const Dropdown: ({ id, options, loop, multiSelect, searchable, searchFilter, compareWith, useValue, display, texts, onChange, validator, }: DropdownProps) => JSX.Element;
 export default Dropdown;

package/lib/dropdown/hooks.d.ts

@@ -1,20 +1,10 @@
-import { DropdownHandler, DropdownOption, DropdownTexts } from '@sebgroup/extract';
+import { DropdownHandler, OnChange, DropdownArgs } from '@sebgroup/extract';
 import { HTMLAttributes, InputHTMLAttributes, RefObject } from 'react';
-import { IValidator } from "@sebgroup/extract";
-interface HookArgs {
-    id?: string;
-    texts?: DropdownTexts;
-    options: DropdownOption[];
-    multiSelect?: boolean;
-    searchable?: boolean;
-    searchableProperties?: string[];
-    loop?: boolean;
-    selectValue?: string;
-    useValue?: string;
-    display?: string;
+import { IValidator } from '@sebgroup/extract';
+interface HookArgs extends DropdownArgs {
     togglerRef: RefObject<HTMLElement>;
     listboxRef: RefObject<HTMLElement>;
-    onChange?: (o: DropdownOption) => void;
+    onChange?: OnChange;
     validator?: IValidator;
 }
 declare type Props = HTMLAttributes<HTMLElement>;
@@ -35,5 +25,5 @@ interface HookResult {
     listItems: Props[];
     multiSelectProps: MultiSelectProps;
 }
-export declare const useDropdown: ({ id, texts, options, loop, multiSelect, searchable, searchableProperties, selectValue, useValue, display, togglerRef, listboxRef, onChange, validator }: HookArgs) => HookResult;
+export declare const useDropdown: ({ id, texts, options, loop, multiSelect, searchable, searchFilter, compareWith, useValue, display, togglerRef, listboxRef, onChange, validator, }: HookArgs) => HookResult;
 export {};

package/lib/form/button/button.d.ts

@@ -6,6 +6,7 @@ export interface ButtonProps {
     variant?: ButtonVariant;
     active?: boolean;
     onClick?: MouseEventHandler<HTMLButtonElement>;
+    disabled?: boolean;
 }
-export declare function Button({ children, variant, onClick, active, type, }: ButtonProps): JSX.Element;
+export declare function Button({ children, variant, onClick, disabled, active, type, }: ButtonProps): JSX.Element;
 export default Button;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@sebgroup/green-react",
-  "version": "1.0.0-beta.23",
+  "version": "1.0.0-beta.24",
   "peerDependencies": {
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
   "dependencies": {
-    "@sebgroup/chlorophyll": "^1.0.0-beta.24",
-    "@sebgroup/extract": "^1.0.0-beta.23"
+    "@sebgroup/chlorophyll": "^1.0.0-beta.25",
+    "@sebgroup/extract": "^1.0.0-beta.24"
   },
   "description": "React components built on top of @sebgroup/chlorophyll.",
   "repository": {