Fix; bug fixes in Box, Dropdown, TextArea. Mostly missing props and s…

…upport.
GovConnex · Jun 25, 2024 · 0f9e747 · 0f9e747
1 parent 1743d37
commit 0f9e747
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 2 deletions.
diff --git a/src/components/Box/Box.tsx b/src/components/Box/Box.tsx
@@ -97,6 +97,7 @@ export function separateProps(props: ExtendedBoxProps): {
           "className",
           "target",
           "rel",
+          "for",
         ].includes(key)
       ) {
         acc.filteredProps[key] = (props as any)[key];

diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
@@ -78,6 +78,7 @@ const Dropdown = ({
   loadingIndicator,
   selectedIndicator,
   cs,
+  ...rest
 }: DropdownProps) => {
   const popRef = useRef<any>(null);
   const [showPopover, setShowPopover] = useState(false);
@@ -120,7 +121,7 @@ const Dropdown = ({
           data-cy={dataCy}
           error={error}
           onChange={onInputChange}
-          onClick={() => {
+          onFocus={() => {
             setShowPopover(true);
           }}
           endAdornment={
@@ -172,6 +173,7 @@ const Dropdown = ({
               : options?.find((item: any) => item?.id === defaultValue)?.text || ""
           }
           readOnly={typeof inputValue !== "string"}
+          {...rest}
         />
         {showPopover ? (
           <Popover

diff --git a/src/components/TextArea/TextArea.styles.ts b/src/components/TextArea/TextArea.styles.ts
@@ -9,6 +9,7 @@ const StyledAdornment = styled.span<{
   squashHeight?: boolean;
   adornmentColor?: string;
   overridePositionTop?: string;
+  allowPointerEvents?: boolean;
 }>(
   ({
     theme,
@@ -18,6 +19,7 @@ const StyledAdornment = styled.span<{
     squashHeight,
     adornmentColor,
     overridePositionTop,
+    allowPointerEvents,
   }) => ({
     [position]: noPadding ? theme.spacing.xs : theme.spacing.sm,
     paddingTop: overridePositionTop
@@ -26,7 +28,7 @@ const StyledAdornment = styled.span<{
       ? "0px"
       : theme.spacing.xs,
     position: "absolute",
-    pointerEvents: squashHeight ? "auto" : "none",
+    pointerEvents: allowPointerEvents || squashHeight ? "auto" : "none",
     opacity: adornmentColor ? 1 : disabled ? 0.3 : 1,
     color: adornmentColor ? getValueFromPath(theme, adornmentColor) : "inherit",
   })

diff --git a/src/components/TextArea/TextArea.tsx b/src/components/TextArea/TextArea.tsx
@@ -59,6 +59,11 @@ export interface TextAreaProps
    * overrides the padding
    */
   overridePadding?: keyof Spacing;
+
+  /**
+   * allows pointer events on adornment
+   */
+  allowAdornmentPointerEvents?: boolean;
 }
 
 /**
@@ -79,6 +84,7 @@ const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>((props, re
     noPadding,
     adornmentColor,
     overridePadding,
+    allowAdornmentPointerEvents,
     ...rest
   } = props;
 
@@ -124,6 +130,7 @@ const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>((props, re
             overridePositionTop={overridePositionTop}
             disabled={props.disabled || false}
             position="left"
+            allowPointerEvents={allowAdornmentPointerEvents}
           >
             {props.startAdornment}
           </StyledAdornment>
@@ -152,6 +159,7 @@ const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>((props, re
             overridePositionTop={overridePositionTop}
             disabled={props.disabled || false}
             position="right"
+            allowPointerEvents={allowAdornmentPointerEvents}
           >
             {props.endAdornment}
           </StyledAdornment>