react-core-ts 1.1.22 → 1.1.23

package/src/ReactRadioButton.tsx

@@ -0,0 +1,62 @@
+import React, { useRef } from "react";
+
+import { RadioProps } from "./commontypes";
+
+const Radio: React.FC<RadioProps> = ({
+  name,
+  id,
+  label,
+  checked,
+  value = undefined,
+  handleChange,
+  disabled = false,
+  customLabel,
+}) => {
+  const radioRef = useRef<HTMLInputElement>(null);
+  const onChange = (e: any) => {
+    handleChange?.(e);
+  };
+  const labelClick = () => {
+    if (radioRef.current) {
+      radioRef.current.click();
+    }
+  };
+  return (
+    <div
+      className={`labels label-text flex items-center justify-start ${
+        !customLabel && "gap-0"
+      }  ${disabled ? " opacity-70" : ""} `}
+    >
+      <div>
+        <label
+          className={`radio-button ${
+            disabled ? "cursor-not-allowed" : "cursor-pointer"
+          }`}
+        >
+          <input
+            type="radio"
+            checked={checked}
+            disabled={disabled}
+            ref={radioRef}
+            name={name}
+            data-testid="app-common-radio"
+            value={value}
+            id={id}
+            onChange={onChange}
+          />
+          <span className="radio"></span>
+        </label>{" "}
+      </div>
+      <div
+        className={`text-common font-normal cursor-pointer ${
+          checked ? "text-secondary" : ""
+        }`}
+        onClick={labelClick}
+      >
+        {label}
+      </div>
+    </div>
+  );
+};
+
+export default Radio;

package/src/commontypes.ts

@@ -174,3 +174,13 @@ export interface CheckboxProps {
   handleChange?: (e: any) => void;
   value?: string | number;
 }
+export interface RadioProps {
+  id: string;
+  name: string;
+  label?: string;
+  value?: string | number;
+  checked?: boolean;
+  disabled?: boolean;
+  customLabel?: boolean;
+  handleChange?: (e: any) => void;
+}

package/src/index.tsx

@@ -10,6 +10,8 @@ export type { AutoSuggestionInputProps } from "./commontypes";
 export { default as ExpandableAutoComplete } from "./ExpandableAutoComplete";
 export { default as ModernAutoComplete } from "./ReactAutoComplete";
 export { default as ModernCheckBox } from "./ReactCheckbox";
+export { default as ModernOtpInput } from "./ReactOTPInput";
+export { default as ModernRadio } from "./ReactRadioButton";
 export { default as ModernTextArea } from "./ReactTextArea";
 export { default as ModernTextField } from "./ReactTextField";
 export { deepEqual } from "./utilities/deepEqual";