gbs-add-block 0.0.18 → 0.0.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gbs-add-block",
-  "version": "0.0.18",
+  "version": "0.0.19",
   "description": "React Component Library",
   "files": [
     "index.js",

package/source/components/datepicker/index.tsx

@@ -124,14 +124,18 @@ export const DatePicker = ({
       <button
         type="button"
         onClick={toggleDatepicker}
-        className="border p-2 rounded w-full flex gap-2 items-center justify-center dark:text-white"
+        className="border p-2 rounded w-full flex items-center gap-2 dark:text-white"
       >
         <Icon
+          dimensions={{ width: "30", height: "30" }}
           elements={calender}
           svgClass={"stroke-black fill-none dark:stroke-white"}
         />
         {showPlaceHolder ? (
-          <span className="text-gray-500">{showPlaceHolder}</span>
+          <div className="flex flex-col text-left">
+            <span className="text-gray-500 text-xs">{showPlaceHolder}</span>
+            <div className="text-sm">{new Date().toLocaleDateString()}</div>
+          </div>
         ) : (
           <span>{selectedDate.toLocaleDateString()}</span>
         )}
@@ -246,10 +250,8 @@ export const DatePicker = ({
                     key={index}
                     onClick={() => !isDisabled && selectDate(day)}
                     disabled={isDisabled}
-                    className={`text-center p-1 w-8 h-8 cursor-pointer rounded-full hover:bg-gray-200 transition duration-150 ease-in-out ${
-                      isSelected
-                        ? "bg-blue-500 text-white hover:bg-blue-600"
-                        : ""
+                    className={`text-center p-1 w-8 h-8 cursor-pointer rounded-md hover:bg-gray-200 transition duration-150 ease-in-out ${
+                      isSelected ? "bg-black text-white hover:bg-gray-800" : ""
                     } ${
                       isDisabled
                         ? "bg-gray-100 text-gray-400 cursor-not-allowed"
@@ -266,7 +268,7 @@ export const DatePicker = ({
             <button
               type="button"
               onClick={goToToday}
-              className="text-blue-500 hover:text-blue-600 transition duration-150 ease-in-out"
+              className="text-black hover:text-blue-600 transition duration-150 ease-in-out"
             >
               Today
             </button>

package/source/components/modal/index.tsx

@@ -5,14 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, { useState } from "react";
+import React from "react";
 import { twMerge } from "tailwind-merge";
 import type { ModalProps } from "./types";
 
 export const Modal = ({
   showModal = false,
   modalTitle = "Modal Title",
-  autoclose = false,
   modalClass = "fixed z-10 overflow-y-auto inset-0 flex items-center justify-center bg-gray-500 bg-opacity-75 transition-opacity",
   modalContentClass = "bg-white m-10 md:w-[80vh] rounded-xl",
   classModalContent = "",
@@ -20,23 +19,14 @@ export const Modal = ({
   classModalTitle = "",
   children,
 }: ModalProps) => {
-  const [show, setShow] = useState(showModal);
-
-  const autoCloseHandler = () => {
-    if (autoclose) {
-      setShow(false);
-    }
-  };
-
   return (
     <>
-      {show && (
+      {showModal && (
         <div
           className={modalClass}
           aria-labelledby="modal-title"
           role="dialog"
           aria-modal="true"
-          onClick={autoCloseHandler}
         >
           <div
             className={twMerge(modalContentClass, classModalContent)}