From 9eb7a378d565713d58e9d678b9304a81333452a6 Mon Sep 17 00:00:00 2001
From: scottrepreneur <me@stwoh.com>
Date: Thu, 28 Dec 2023 10:28:33 -0600
Subject: [PATCH] tweaks

---
 package.json                                  |  2 +-
 .../forms/CreatableSelect/CreatableSelect.tsx |  1 +
 src/components/forms/CreatableSelect/index.ts |  2 +-
 .../forms/NumberInput/NumberInput.tsx         | 31 ++++++++++---------
 .../ControlledSelect/ControlledSelect.tsx     | 18 +++++++++--
 5 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/package.json b/package.json
index e863bbb..fe91360 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@raidguild/design-system",
-  "version": "0.5.5",
+  "version": "0.5.6",
   "license": "MIT",
   "author": "Raid Guild",
   "main": "./dist/src/index.js",
diff --git a/src/components/forms/CreatableSelect/CreatableSelect.tsx b/src/components/forms/CreatableSelect/CreatableSelect.tsx
index 5284c92..03a7efd 100644
--- a/src/components/forms/CreatableSelect/CreatableSelect.tsx
+++ b/src/components/forms/CreatableSelect/CreatableSelect.tsx
@@ -16,6 +16,7 @@ export type Option =
   | { value: null; label: string }
   | { label: string | number; value: string | number }
   | { value: number; label: string };
+
 export interface CreatableSelectProps {
   name: string;
   label?: string | React.ReactNode;
diff --git a/src/components/forms/CreatableSelect/index.ts b/src/components/forms/CreatableSelect/index.ts
index 5f7dbf0..7b0f845 100644
--- a/src/components/forms/CreatableSelect/index.ts
+++ b/src/components/forms/CreatableSelect/index.ts
@@ -1,2 +1,2 @@
 export { default as CreatableSelect } from './CreatableSelect';
-export type { CreatableSelectProps } from './CreatableSelect';
+export type { CreatableSelectProps, Option } from './CreatableSelect';
diff --git a/src/components/forms/NumberInput/NumberInput.tsx b/src/components/forms/NumberInput/NumberInput.tsx
index 2f51465..aded1e2 100644
--- a/src/components/forms/NumberInput/NumberInput.tsx
+++ b/src/components/forms/NumberInput/NumberInput.tsx
@@ -74,20 +74,23 @@ const NumberInput = ({
           m={0}
         >
           <Stack spacing={spacing}>
-            <HStack>
-              {label && <FormLabel m={0}>{label}</FormLabel>}
-              {tooltip && (
-                <Tooltip>
-                  <Icon
-                    as={FaInfoCircle}
-                    boxSize={3}
-                    color='red.500'
-                    bg='white'
-                    borderRadius='full'
-                  />
-                </Tooltip>
-              )}
-            </HStack>
+            {label && (
+              <HStack>
+                {label && <FormLabel m={0}>{label}</FormLabel>}
+                {tooltip && (
+                  <Tooltip>
+                    <Icon
+                      as={FaInfoCircle}
+                      boxSize={3}
+                      color='red.500'
+                      bg='white'
+                      borderRadius='full'
+                    />
+                  </Tooltip>
+                )}
+              </HStack>
+            )}
+
             <ChakraNumberInput
               variant={variant}
               step={step}
diff --git a/src/components/forms/controlled/ControlledSelect/ControlledSelect.tsx b/src/components/forms/controlled/ControlledSelect/ControlledSelect.tsx
index 35fb285..54f9d75 100644
--- a/src/components/forms/controlled/ControlledSelect/ControlledSelect.tsx
+++ b/src/components/forms/controlled/ControlledSelect/ControlledSelect.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { ChakraStylesConfig, Select as ReactSelect } from 'chakra-react-select';
-import { FormLabel, Box, Stack } from '../../../chakra';
+import { FormLabel, Box, Stack, ChakraSelectProps } from '../../../chakra';
 
 export type Option =
   | {
@@ -12,7 +12,7 @@ export type Option =
   | { value: null; label: string }
   | { label: string | number; value: string | number }
   | { value: number; label: string };
-export interface ControlledSelectProps {
+export interface CustomControlledSelectProps {
   label?: string | React.ReactNode;
   placeholder?: string;
   defaultValue?: Option | Option[];
@@ -51,6 +51,18 @@ export interface ControlledSelectProps {
     | 'primary';
 }
 
+type ControlledSelectProps = CustomControlledSelectProps &
+  Omit<
+    ChakraSelectProps,
+    | 'size'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onChange'
+    | 'value'
+    | 'defaultValue'
+    | 'onKeyDown'
+  >;
+
 const ControlledSelect: React.FC<ControlledSelectProps> = ({
   label,
   placeholder,
@@ -78,7 +90,7 @@ const ControlledSelect: React.FC<ControlledSelectProps> = ({
   };
 
   return (
-    <Stack spacing={2}>
+    <Stack spacing={2} w='100%'>
       {label && <FormLabel>{label}</FormLabel>}
       <Box>
         <ReactSelect