@loadsmart/loadsmart-ui 7.1.0 → 7.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@loadsmart/loadsmart-ui",
-	"version": "7.1.0",
+	"version": "7.2.0",
 	"description": "Miranda UI, a React UI library",
 	"main": "dist",
 	"files": [

package/src/components/Select/Select.test.tsx

@@ -32,6 +32,22 @@ describe('Select', () => {
       screen.getByTestId('select-trigger-search-field')
     })
 
+    it('transfer additional input props to SelectTrigger', () => {
+      const props: Partial<SelectProps> = {
+        getInputProps: () => ({
+          minLength: 11,
+          maxLength: 33,
+        }),
+      }
+
+      setup({ ...props })
+
+      const searchInput = screen.getByTestId('select-trigger-search-field')
+
+      expect(searchInput).toHaveAttribute('minlength', '11')
+      expect(searchInput).toHaveAttribute('maxlength', '33')
+    })
+
     describe('when disabled', () => {
       it('does not expand with the available options when search input is clicked', () => {
         setup({ disabled: true })

package/src/components/Select/Select.types.ts

@@ -87,6 +87,7 @@ export interface SelectProps extends DropdownProps {
   onChange?: OnChange
   onCreate?: OnCreate
   onQueryChange?: OnQueryChange
+  getInputProps?: () => Partial<TextFieldProps>
   isValidNewOption?: ((query: string) => boolean) | boolean
   createOptionPosition?: CreateOptionPosition
   /**

package/src/components/Select/SelectTrigger.tsx

@@ -61,8 +61,8 @@ const SelectTrigger = forwardRef<HTMLInputElement, SelectTriggerProps>(function
   return (
     <GenericSelectTrigger className={className}>
       <SelectTriggerSearchField
-        data-testid="select-trigger-search-field"
         {...others}
+        data-testid="select-trigger-search-field"
         ref={(node) => {
           if (isFunction(ref)) {
             ref(node)

package/src/components/Select/useSelect.ts

@@ -220,6 +220,7 @@ function useSelect(props: SelectProps): useSelectReturn {
     onQueryChange,
     onChange,
     onCreate,
+    getInputProps,
     id,
     name,
     disabled = false,
@@ -348,6 +349,7 @@ function useSelect(props: SelectProps): useSelectReturn {
   const getTriggerProps = useCallback(
     function getTriggerProps() {
       return {
+        ...getInputProps?.(),
         id,
         ref(node: HTMLInputElement | null) {
           if (node != null) {