[master] 1.0.29 (#152)

* Fixed repetitive overridden styles caused by imports (#151)

* upgrade fave-ui version

.storybook/preview.js

@@ -1,4 +1,4 @@
-import './index.css'
+import '../src/index.css'
 
 export const parameters = {
   actions: { argTypesRegex: '^on[A-Z].*' },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fave-ui",
-  "version": "0.1.28",
+  "version": "0.1.29",
   "description": "React UI KiT by Fave",
   "author": "Fave",
   "license": "MIT",

rollup.config.js

@@ -53,9 +53,11 @@ const devConfig = {
       },
       extensions: ['.css'],
       minimize: true,
-      inject: {
-        insertAt: 'bottom'
-      }
+      extract: true
+      // need to keep this
+      // inject: {
+      //   insertAt: 'bottom'
+      // }
     }),
     typescript(),
     resolve(),
@@ -71,12 +73,12 @@ const devConfig = {
 
 const prodConfig = {
   ...devConfig,
-	plugins: [...devConfig.plugins, terser()]
-};
+  plugins: [...devConfig.plugins, terser()]
+}
 
 export default [
   // UMD Development
   devConfig,
-	// UMD Production
-	prodConfig  
+  // UMD Production
+  prodConfig
 ]

src/Affix/style.css

@@ -1,2 +0,0 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/affix/style/index.css';

src/Alert/style.css

@@ -1,5 +1,3 @@
-@import 'antd/lib/alert/style/index.css';
-
 .ant-alert {
   @apply border-none;
   @apply rounded-lg;

src/AutoComplete/style.css

@@ -1,6 +1,3 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/auto-complete/style/index.css';
-
 @import '../Select/style.css';
 
 .ant-select-auto-complete {

src/Avatar/style.css

@@ -1,5 +1,3 @@
-@import 'antd/lib/avatar/style/index.css';
-
 .ant-avatar {
   /* hardcoded to inline-block inside ant design's source code */
   @apply flex !important;

src/AvatarGroup/style.css

@@ -1 +0,0 @@
-@import 'antd/lib/avatar/style/index.css';

src/BackTop/style.css

@@ -1,16 +1,12 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/back-top/style/index.css';
+.ant-back-top {
+  button {
+    @apply bg-slate-700;
+    @apply outline-transparent !important;
+    @apply hover:bg-slate-700 hover:opacity-75;
 
-.ant-back-top{
-    button{
-
-        @apply bg-slate-700;
-        @apply outline-transparent !important;
-        @apply hover:bg-slate-700 hover:opacity-75;
-
-        svg{
-            @apply text-white;
-            @apply hover:text-white;
-        }
+    svg {
+      @apply text-white;
+      @apply hover:text-white;
     }
-}
+  }
+}

src/Badge/style.css

@@ -1,5 +1,3 @@
-@import 'antd/lib/badge/style/index.css';
-
 .ant-badge {
   sup {
     @apply top-[15%] right-[15%];

src/Breadcrumb/style.css

@@ -1,8 +1,5 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/breadcrumb/style/index.css';
-
-@import '../Menu/style.css';
-@import '../Dropdown/style.css';
+/* @import '../Menu/style.css';
+@import '../Dropdown/style.css'; */
 
 .ant-breadcrumb {
   li a {

src/Button/style.css

@@ -1,8 +1,4 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/button/style/index.css';
-
 .ant-btn {
-
   @apply rounded-lg font-inter h-auto;
   @apply inline-flex items-center justify-center border-none;
   @apply focus:border-transparent focus:outline-none;
@@ -73,8 +69,8 @@
       @apply text-primary;
     }
 
-    &.ant-btn-lg{
-      min-height:40px;
+    &.ant-btn-lg {
+      min-height: 40px;
     }
   }
 

src/Card/style.css

@@ -1,7 +1,4 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/card/style/index.css';
-@import '../Tabs/style.css';
-@import 'antd/lib/grid/style/index.css';
+/* @import '../Tabs/style.css'; */
 
 .ant-card {
   @apply rounded-lg;
@@ -24,7 +21,7 @@
     }
   }
   &-body {
-    @apply font-inter text-sm text-neutral-700 ;
+    @apply font-inter text-sm text-neutral-700;
     @apply py-0 px-4;
   }
   &-body > div > p:first-child {
@@ -78,7 +75,7 @@
       @apply px-2 min-h-0;
       .ant-card-head-wrapper > {
         .ant-card-head-title {
-          @apply font-inter font-semibold text-xs text-neutral-700 ;
+          @apply font-inter font-semibold text-xs text-neutral-700;
           @apply pt-2 pb-1 pr-1.5;
         }
         .ant-card-extra {
@@ -87,7 +84,7 @@
       }
     }
     .ant-card-body {
-      @apply font-inter text-xs text-neutral-700 ;
+      @apply font-inter text-xs text-neutral-700;
       @apply py-0 px-2;
     }
     .ant-card-body > div > p {
@@ -108,13 +105,12 @@
       @apply pb-2  pt-2 text-sm !important;
     }
 
-    .ant-tabs-tab + .ant-tabs-tab{
+    .ant-tabs-tab + .ant-tabs-tab {
       @apply ml-6;
     }
   }
 }
 
-
 .with-button {
   .ant-card-head {
     &-wrapper > {
@@ -135,15 +131,15 @@
   }
 }
 
-.with-meta-extra{
-  .ant-card-body{
+.with-meta-extra {
+  .ant-card-body {
     @apply flex;
 
-    svg{
+    svg {
       @apply cursor-pointer;
     }
   }
-  .ant-card-meta{
+  .ant-card-meta {
     @apply w-full;
   }
 }

src/Checkbox/style.css

@@ -1,5 +1,3 @@
-@import 'antd/lib/checkbox/style/index.css';
-
 .ant-checkbox {
   &:hover {
     .ant-checkbox-inner {

src/Collapse/style.css

@@ -1,6 +1,3 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/collapse/style/index.css';
-
 .ant-collapse {
   @apply font-inter;
   @apply border-none;

src/Comment/style.css

@@ -1,6 +1,3 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/comment/style/index.css';
-
 .ant-comment {
   @apply font-inter;
 

src/DatePicker/style.css

@@ -1,7 +1,5 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/date-picker/style/index.css';
 @import '../Empty/style.css';
-@import "../TimePicker/style.css";
+@import '../TimePicker/style.css';
 @import '../variables.css';
 
 .ant-picker {
@@ -123,34 +121,32 @@
   }
 
   /* Ratate the Caret Down Icon when Picker is Focused */
-  &.ui-open{
-      .ant-picker-suffix{
-          @apply transform rotate-180 transition ease-linear;
-      }
+  &.ui-open {
+    .ant-picker-suffix {
+      @apply transform rotate-180 transition ease-linear;
+    }
   }
 
-  .ant-picker-suffix{
-      @apply transition ease-linear;
+  .ant-picker-suffix {
+    @apply transition ease-linear;
   }
 }
 
-
 /* Quater Picker Disabled Styling */
-.ant-picker-quarter-panel{
+.ant-picker-quarter-panel {
   .ant-picker-cell-disabled::before {
     @apply bg-transparent;
   }
-  
-  .ant-picker-cell-disabled{
-    .ant-picker-cell-inner{
+
+  .ant-picker-cell-disabled {
+    .ant-picker-cell-inner {
       @apply bg-neutral-100 text-neutral-700;
     }
   }
 }
 
-.ant-picker.ant-picker-disabled{
+.ant-picker.ant-picker-disabled {
   @apply border-transparent;
-
 }
 
 .ant-form-item-has-error {

src/Descriptions/style.css

@@ -1,34 +1,29 @@
-@import "antd/lib/style/default.css";
-@import 'antd/lib/descriptions/style/index.css';
+.ant-descriptions {
+  &-header {
+    @apply mb-4;
+  }
 
-.ant-descriptions{
+  &-title {
+    @apply font-inter text-base font-bold text-neutral-700;
+  }
 
-    &-header{
-        @apply mb-4;
-    }
-
-    &-title{
-        @apply font-inter text-base font-bold text-neutral-700;
-    }
-
-    &-item{
-
-        @apply font-inter font-normal;
+  &-item {
+    @apply font-inter font-normal;
 
-        &-label{
-            @apply text-xs text-neutral-400;
-        }
-
-        &-content{
-            @apply text-sm text-neutral-700;
-        }
+    &-label {
+      @apply text-xs text-neutral-400;
     }
 
-    &-row > th{
-        @apply pb-1;
+    &-content {
+      @apply text-sm text-neutral-700;
     }
+  }
 
-    &-row > td{
-        @apply pb-6;
-    }
-}
+  &-row > th {
+    @apply pb-1;
+  }
+
+  &-row > td {
+    @apply pb-6;
+  }
+}

src/Divider/style.css

@@ -1,2 +0,0 @@
-@import 'antd/lib/style/default.css';
-@import 'antd/lib/divider/style/index.css';

src/Drawer/style.css

@@ -1,5 +1,3 @@
-@import 'antd/lib/drawer/style/index.css';
-
 .ant-drawer {
   &.ant-drawer-right,
   &.ant-drawer-left {