hds-web 1.6.3 → 1.6.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-web",
-  "version": "1.6.3",
+  "version": "1.6.4",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.es.js",

package/src/HDS/components/Buttons/button.js

@@ -38,12 +38,22 @@ const Buttonclasses = {
     'default': {
       'base': 'db:w-fit tb:w-fit w-full justify-center border-2 border-blue-500 text-blue-500',
 
-      'hover': 'hover:text-neutral-0 hover:bg-blue-700 hover:border-2 hover:border-blue-700 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:delay-100 hover:duration-300',
+      'hover': 'hover:text-neutral-0 hover:bg-blue-700 hover:border-2 hover:border-blue-700 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
       
       'focus': 'focus:bg-blue-200 focus:text-blue-500 focus:border-2 border-blue-500 focus:shadow-[0px_0px_0px_4px_#DFE8FF] focus:outline-none focus:text-blue-500',
     },
     'disabled': 'bg-neutral-200 text-neutral-400',
   },
+  'secondaryWhite': {
+    'default': {
+      'base': 'db:w-fit tb:w-fit w-full justify-center border-2 border-neutral-0 text-neutral-0 ',
+
+      'hover': 'hover:text-neutral-0 hover:border-2 hover:border-neutral-0 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
+      
+      'focus': 'focus:text-neutrak-0 focus:border-2 border-neutral-0 focus:outline-none focus:text-neutral-0',
+    },
+    'disabled': 'bg-neutral-200 text-neutral-400',
+  },
   
   'ghost': {
     'default': {

package/src/HDS/components/Tabs/tab.js

@@ -7,8 +7,7 @@ export default function Tab(props) {
   const {
     tabs,
     onTabClick,
-    pillColor
-
+    pillColor,
   } = props;
   const [activeTab, setActiveTab] = useState(tabs.find(tab => tab.current) || tabs[0]);
   const pillRef = useRef(null);
@@ -16,6 +15,7 @@ export default function Tab(props) {
   if(pillColor){
      pillColorClass = HDSColor(pillColor);
   }
+ 
   
   const handleTabClick = (event, clickedTab) => {
     event.preventDefault();
@@ -36,10 +36,19 @@ export default function Tab(props) {
       pill.style.width = `${pillWidth}px`;
     }
   };
+  let tabTextClass = ''; 
 
   function tabClass(name) {
+    
+    // console.log(currentTab['tabTextColorClass']);
+    
+    if(activeTab['tabTextColorClass']){
+      tabTextClass = HDSColor(activeTab['tabTextColorClass']);
+    }
+    else tabTextClass = 'text-neutral-500'
+
     let classActive = ' text-neutral-0 transition-all rounded-full ' + pillColorClass;
-    let clasnInActive = ' text-neutral-500 flex-nowrap rounded-full';
+    let clasnInActive = ' flex-nowrap rounded-full ' + tabTextClass;
     if (activeTab.name === name) {
       return classActive;
     }
@@ -79,5 +88,5 @@ export default function Tab(props) {
 }
 
 Tab.defaultProps = {
-  pillColor: 'bg-blue-500'
+  pillColor: 'bg-blue-500',
 }

package/src/styles/tailwind.css

@@ -8107,6 +8107,11 @@ select {
   border-color: rgb(210 214 219 / var(--tw-border-opacity));
 }
 
+.hover\:border-neutral-0:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(255 255 255 / var(--tw-border-opacity));
+}
+
 .hover\:bg-blue-100:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(240 244 255 / var(--tw-bg-opacity));