groovinads-ui 1.2.20 → 1.2.22

package/README.md

@@ -77,6 +77,7 @@ import { Button } from 'groovinads-ui';
 | ```className``` | String | n/a | n/a | Additional CSS class names that can be applied to the button. Defaults to an empty string. |
 | ```style``` | String | ```default``` ```success``` ```danger``` ```warning``` ```link```| ```default``` | Specifies the style variant of the button, which can change its color and visual appearance. It's optional. |
 | ```processing``` | Boolean | ```true``` ```false```  | ```false``` | If true, displays a spinner animation and appends '...' to the button label to indicate processing status.  It's optional. |
+| ```children``` | ```Node``` |	n/a |	n/a |	The content rendered inside the button component. It can include text, icons, or other components. |
 
 ## Inputs
 
@@ -133,6 +134,10 @@ import { Input } from 'groovinads-ui';
 | ```setShowError``` | Function | n/a | n/a | Function to set the visibility of the error message. |
 | ```type``` | String | n/a | n/a | Text or characters to display at the end of the input, e.g., 'USD' for currency. |
 | ```value``` | String or Number| n/a | n/a | The value of the input. |
+| ```autoFocus	``` | Boolean | ```true``` ```false``` | ```false``` | If true, automatically focuses the input when the component mounts. |
+| ```customRef	``` | React.RefObject, Function, null | n/a | ```null``` | Custom ref object or callback ref to access the input element. |
+| ```suffix	``` | string | n/a | n/a / Optional suffix text to display inside the input field. |
+			
 
 ### Radio
 ```jsx
@@ -234,6 +239,7 @@ import { PillComponent } from 'groovinads-ui';
 | ```color``` | String | ```blue``` ```danger``` ```dark``` ```green```   ```light``` ```midtone``` ```neutral``` ```red```  ```yellow``` | ```neutral``` | Specifies the background color of the pill. This helps to differentiate pills by context or severity. |
 | ```closeButton``` | Boolean | ```true``` ```false``` | ```false``` | 	If true, a close button is displayed on the pill, allowing it to be dismissed.|
 | ```onClick``` | Function | n/a | n/a | Function to handle the click event on the close button. This property is only relevant if ```closeButton``` is ```true```. |
+| ```children``` | Node | n/a | n/a | Content to be displayed inside the pill component. |
 
 ### StatusIcon
 ```jsx
@@ -246,6 +252,82 @@ import { StatusIcon } from 'groovinads-ui';
 | ```animated``` | Boolean | ```true``` ```false``` | ```false``` | If true, the icon will include animation effects on active status. Defaults to false, indicating no animation. |
 | ```className``` | String | n/a | n/a | Additional CSS class names that can be applied to the status icon. Defaults to an empty string. |
 | ```status``` | Number | ```0``` ```1``` ```3``` | ```0``` | Specifies the visual state of the icon: ```0``` for inactive, ```1``` for active, and ```3``` for active with a warning. |
+### DropdownComponent
+```jsx
+import { DropdownComponent } from 'groovinads-ui';
+
+<DropdownComponent autoClose={false} className="custom-class" drop="down">
+  {/* Child components go here */}
+</DropdownComponent>
+```
+| Property | Type | Options | Default | Description |
+|--------------|--------------|--------------|--------------|--------------|
+| ```autoClose``` | ```Boolean``` ```String``` |```true``` ```false``` ```outside``` ```inside``` | false | Determines the auto-close behavior of the dropdown. |
+| ```children``` | Node | n/a | n/a | Child components to be rendered inside the dropdown. |
+| ```className``` | String | n/a | string | Additional CSS class names. |
+| ```drop``` | String | ```up``` ```down``` | n/a | Specifies the direction in which the dropdown should open. |
+| ```fullWidth``` | Boolean| n/a | n/a | 	Function to handle toggle state changes. |
+| ```overflow``` | Boolean | ```true``` ```false``` | false | Whether to enable overflow strategy for the dropdown.|
+| ```aling``` | String | ```start``` ```end``` | ```star``` | Alignment of the dropdown menu. |
+| ```show``` | Boolean |  ```true``` ```false``` | n/a | Controls the visibility of the dropdown. |
+### DropdownFilter
+```jsx
+import { DropdownFilter } from 'groovinads-ui';
+
+<DropdownFilter 
+  title="Filter"
+  valuesSelected={['Value1', 'Value2']}
+  setValuesSelected={(newValues) => console.log(newValues)}
+  values={['Value1', 'Value2', 'Value3']}
+  menuType="simple"
+  locked={false}
+  onRemoveFilter={() => console.log('Filter removed')}
+  show={true}
+  onToggle={(isOpen) => console.log(isOpen)}
+  overflow={false}
+  className="custom-class"
+/>
+```
+| Property | Type | Options | Default | Description |
+|--------------|--------------|--------------|--------------|--------------|
+| ```title``` | String | n/a | n/a | Title of the dropdown filter. |
+| ```valuesSelected```| Array | n/a | [] | Available values for selection. |
+| ```setValuesSelected``` | Function | n/a | n/a | AFunction to set the selected values. |
+| ```values``` | Array | n/a | [] | Available values for selection. |
+| ```menuType``` | String | ```simple``` ```selecion``` | simple | Type of dropdown menu. |
+| ```locked``` | Boolean| ```true``` ```false```| false | If true, the filter cannot be removed. |
+| ```onRemoveFilter``` | Function | n/a | n/a | Function to handle filter removal. |
+| ```show``` | Boolean | ```true``` ```false``` | n/a | Controls the visibility of the dropdown. |
+| ```onToggle``` | Funtion | n/a | n/a | Function to handle toggle state changes. |
+| ``` overflow``` | Boolean | ```true``` ```false``` | false | Whether to enable overflow strategy for the dropdown. | 
+| ```className``` | String | n/a | '' | Additional CSS class names. |
+### DropdownMultiSelect
+```jsx
+import { DropdownMultiSelect } from 'groovinads-ui';
+
+<DropdownMultiSelect 
+  autoClose={false}
+  className="custom-class"
+  drop="down"
+  inputLabel="Select items"
+  object={false}
+  nameKey="name"
+  idKey="id"
+  searchLabel="Search"
+  onToggle={(isOpen) => console.log(isOpen)}
+  overflow={false}
+  valuesSelected={[]}
+  setValuesSelected={(newValues) => console.log(newValues)}
+  values={['Item1', 'Item2', 'Item3']}
+  show={true}
+  idInPill={false}
+  showStatus=""
+  focus={false}
+/>
+```
+| Property | Type | Options | Default | Description |
+|--------------|--------------|--------------|--------------|--------------|
+| ```autoClose``` |	```Boolean``` ```String``` |	 ```true``` ```false```` ```outside``` ```inside``` | false	| Determines the auto-close behavior of the dropdown. |