@bytebrand/fe-ui-core 4.2.208 → 4.2.209

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core",
-  "version": "4.2.208",
+  "version": "4.2.209",
   "description": "UI components for the auto.de project",
   "main": "index.ts",
   "module": "dist/common.js",

package/source/components/_common/Button/Button.tsx

@@ -15,6 +15,7 @@ export interface IButtonProps {
   color?: variantColor;
   children?: any;
   variant?: variantType;
+  getRef?: (ref: HTMLButtonElement) => void;
 
   disabled?: boolean;
   loading?: boolean;
@@ -25,7 +26,7 @@ export interface IButtonProps {
   onMouseLeave?: (event: React.MouseEvent<HTMLButtonElement>) => void;
 }
 
-const Button: React.FC<IButtonProps> = ({ className, color, onClick, onMouseEnter, onMouseLeave, variant, loading, disabled, children  }: IButtonProps) => {
+const Button: React.FC<IButtonProps> = ({ getRef, className, color, onClick, onMouseEnter, onMouseLeave, variant, loading, disabled, children  }: IButtonProps) => {
   const onHandlerClick = (event: React.MouseEvent<HTMLButtonElement>) => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
@@ -52,6 +53,7 @@ const Button: React.FC<IButtonProps> = ({ className, color, onClick, onMouseEnte
     onClick: onHandlerClick,
     onMouseEnter: onHandlerMouseEnter,
     onMouseLeave: onHandlerMouseLeave,
+    ref:getRef,
     disabled: disabled || loading
   };
 
@@ -69,7 +71,7 @@ Button.defaultProps = {
   buttonType: 'button',
 
   onClick: () => { },
-
+  getRef: () => { },
   onMouseEnter: () => { },
   onMouseLeave: () => { }
 };

package/source/components/_common/OfferRequestButtonWrapper/OfferRequestButtonWrapper.tsx

@@ -23,13 +23,17 @@ const OfferRequestBtnWrapper: React.FunctionComponent<IOfferRequestButtonWrapper
   const dealerId = _get(car, 'metaData.ownerId') || null;
   const carId = _get(car, '_id', '');
   const onAutoDeIdClick = () => {
-    btnEl.current.onClick();
+    btnEl.current?.click();
   };
 
   const controlsContainerClassName = classnames(
     styles.controlsContainer,
     controlsClassContainer
   );
+
+  const getRef = (ref: HTMLButtonElement): void => {
+    btnEl.current = ref;
+  };
   return (
     <>
       <div className={controlsContainerClassName}>
@@ -42,7 +46,7 @@ const OfferRequestBtnWrapper: React.FunctionComponent<IOfferRequestButtonWrapper
             isLoading: boolean,
             isSale: boolean,
             isAlternative: boolean
-            ) => {
+          ) => {
             const { metaData } = car;
             const isAlternativeType = !!metaData && !!metaData.type;
             const offerButtonClassName = classnames(
@@ -63,10 +67,10 @@ const OfferRequestBtnWrapper: React.FunctionComponent<IOfferRequestButtonWrapper
 
             return (
               <StyledButton
-                refs={btnEl}
                 className={offerButtonClassName}
                 onClick={onClick}
                 loading={isLoading}
+                getRef={getRef}
               >
                 {isOfferRequested
                   ? null