tweaks

raid-guild · Dec 28, 2023 · 9eb7a37 · 9eb7a37
1 parent abfaf36
commit 9eb7a37
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 19 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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