@veracity/vui 2.25.6-beta.0 → 2.25.6-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veracity/vui",
-  "version": "2.25.6-beta.0",
+  "version": "2.25.6-beta.1",
   "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
   "module": "./dist/esm/index.js",
   "main": "./dist/cjs/index.js",

package/src/select/select.tsx

@@ -53,9 +53,8 @@ export function Select(props: SelectProps) {
 
   const selectProps = useSelect({ defaultValue, isMultiple, onChange, value, options, selectedText, children })
 
-  if (__DEV__ && isMultiple && !Array.isArray(selectProps.value)) {
+  if (__DEV__ && isMultiple && !Array.isArray(selectProps.value))
     console.error('<Select /> is used with isMultiple but its value is not an array: ', value)
-  }
 
   const generatedId = useId()
   const [query, setQuery] = useState<string>('')
@@ -87,8 +86,8 @@ export function Select(props: SelectProps) {
 
   return (
     <SelectProvider value={context}>
-      <Box className="vui-selectContainer" column {...rest}>
-        {label && (
+      <Box className="vui-selectContainer" column w="100%" {...rest}>
+        {!!label && (
           <SelectLabel
             disabled={disabled}
             id={id}
@@ -105,7 +104,7 @@ export function Select(props: SelectProps) {
                 <Box mr={2}>
                   <Input
                     iconLeft="falSearch"
-                    id={id} // should be select on the button instead?
+                    id={id}
                     m={1}
                     mt={0}
                     onChange={onQueryChange}

package/src/select/select.types.ts

@@ -3,6 +3,7 @@ import { ReactNode } from 'react'
 import { ButtonProps } from '../button'
 import { ListItemProps, ListProps } from '../list'
 import { PopoverContentProps, PopoverProps } from '../popover'
+import { SystemProps } from '../system'
 import { ThemingProps } from '../theme'
 import { UseSelectReturnType } from './useSelect'
 import { UseSelectProps } from './useSelect.types'
@@ -20,6 +21,7 @@ export type SelectContext = Pick<
 export type SelectGroupProps = ListProps
 
 export type SelectProps = ThemingProps<'Select'> &
+  SystemProps &
   PopoverProps &
   UseSelectProps & {
     /** Select cannot be opened and is styled accordingly. */