fix: minor fix and missing plugins (#50)

Co-authored-by: Sacha Stafyniak <sacha@digisquad.io>
shuriken-ui · Aug 7, 2023 · 982de65 · 982de65
1 parent 5ee642b
commit 982de65
Show file tree

Hide file tree

Showing 20 changed files with 739 additions and 71 deletions.
diff --git a/src/plugins/components/accordion.ts b/src/plugins/components/accordion.ts
@@ -19,6 +19,10 @@ const defaultAccordionConfig = {
   detailOpenAndDot: {
     bg: 'primary-500',
   },
+  headerInner: {
+    text: 'muted-800',
+    textDark: 'white',
+  },
   dot: {
     size: '3',
     rounded: 'full',
@@ -84,6 +88,10 @@ export default plugin.withOptions(
           },
           [`.${prefix}-accordion-header`]: {
             [`@apply flex items-center justify-between`]: {},
+
+            [`.${prefix}-accordion-header-inner`]: {
+              [`@apply text-muted-800 dark:text-white`]: {},
+            },
           },
           [`.${prefix}-accordion-dot`]: {
             [`@apply ms-2 h-${config.dot.size} w-${config.dot.size} rounded-${config.dot.rounded} transition-colors duration-${config.dot.duration}`]:

diff --git a/src/plugins/components/autocomplete.ts b/src/plugins/components/autocomplete.ts
@@ -285,6 +285,7 @@ export default plugin.withOptions(
       addComponents({
         [`.${prefix}-autocomplete`]: {
           [`@apply w-full relative`]: {},
+
           [`.${prefix}-autocomplete-label, .${prefix}-label-float`]: {
             [`@apply ${prefix}-label`]: {},
           },

diff --git a/src/plugins/components/avatar.ts b/src/plugins/components/avatar.ts
@@ -62,6 +62,7 @@ const defaultAvatarConfig = {
       size: '1.5',
     },
     text: 'xs',
+    straightPosition: '0',
     roundedOrInnerDotPosition: '0',
     curvedOrInner: {
       rounded: 'md',
@@ -79,6 +80,7 @@ const defaultAvatarConfig = {
       size: '2',
     },
     text: 'sm',
+    straightPosition: '0',
     roundedOrInnerDotPosition: '0',
     curvedOrInner: {
       rounded: 'lg',
@@ -96,6 +98,7 @@ const defaultAvatarConfig = {
       size: '2',
     },
     text: 'sm',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'md',
       dotPosition: '0',
@@ -116,6 +119,7 @@ const defaultAvatarConfig = {
       size: '3',
     },
     text: 'sm',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'lg',
       dotPosition: '0',
@@ -136,6 +140,7 @@ const defaultAvatarConfig = {
       size: '3',
     },
     text: 'sm',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'lg',
       dotPosition: '0',
@@ -156,6 +161,7 @@ const defaultAvatarConfig = {
       size: '4',
     },
     text: 'base',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'xl',
       dotPosition: '0',
@@ -176,6 +182,7 @@ const defaultAvatarConfig = {
       size: '4',
     },
     text: 'xl',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'xl',
       dotPosition: '0',
@@ -196,6 +203,7 @@ const defaultAvatarConfig = {
       size: '4',
     },
     text: '2xl',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'xl',
       dotPosition: '0',
@@ -216,6 +224,7 @@ const defaultAvatarConfig = {
       size: '4',
     },
     text: '3xl',
+    straightPosition: '0',
     roundedOrInner: {
       rounded: 'xl',
       dotPosition: '0',
@@ -261,7 +270,7 @@ export default plugin.withOptions(
             },
           },
           [`.${prefix}-avatar-img`]: {
-            [`@apply max-h-${config.avatarImg.maxSize} max-w-${config.avatarImg.maxSize} object-cover shadow-${config.avatarImg.shadow} dark:border-${config.avatarImg.borderDark}`]:
+            [`@apply h-${config.avatarImg.maxSize} max-h-${config.avatarImg.maxSize} w-${config.avatarImg.maxSize} max-w-${config.avatarImg.maxSize} object-cover shadow-${config.avatarImg.shadow} dark:border-${config.avatarImg.borderDark}`]:
               {},
           },
           [`.${prefix}-avatar-text`]: {
@@ -341,6 +350,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarXXS.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarXXS.straightPosition} top-${config.avatarXXS.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded`]: {},
 
@@ -378,6 +395,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarXS.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarXS.straightPosition} top-${config.avatarXS.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded`]: {},
 
@@ -415,6 +440,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarSM.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarSM.straightPosition} top-${config.avatarSM.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatarSM.roundedOrInner.rounded}`]: {},
 
@@ -452,6 +485,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarMD.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarMD.straightPosition} top-${config.avatarMD.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatarMD.roundedOrInner.rounded}`]: {},
 
@@ -489,6 +530,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarLG.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarLG.straightPosition} top-${config.avatarLG.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatarLG.roundedOrInner.rounded}`]: {},
 
@@ -526,6 +575,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatarXL.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatarXL.straightPosition} top-${config.avatarXL.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatarXL.roundedOrInner.rounded}`]: {},
 
@@ -564,6 +621,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatar2XL.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatar2XL.straightPosition} top-${config.avatar2XL.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatar2XL.roundedOrInner.rounded}`]: {},
 
@@ -602,6 +667,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatar3XL.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatar3XL.straightPosition} top-${config.avatar3XL.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatar3XL.roundedOrInner.rounded}`]: {},
 
@@ -640,6 +713,14 @@ export default plugin.withOptions(
             [`.${prefix}-avatar-text`]: {
               [`@apply text-${config.avatar4XL.text}`]: {},
             },
+            [`&.${prefix}-avatar-straight, .${prefix}-avatar-inner`]: {
+              [`@apply rounded-none`]: {},
+
+              [`.${prefix}-avatar-dot`]: {
+                [`@apply end-${config.avatar4XL.straightPosition} top-${config.avatar4XL.straightPosition}`]:
+                  {},
+              },
+            },
             [`&.${prefix}-avatar-rounded, .${prefix}-avatar-inner`]: {
               [`@apply rounded-${config.avatar4XL.roundedOrInner.rounded}`]: {},
 

diff --git a/src/plugins/components/button-icon.ts b/src/plugins/components/button-icon.ts
@@ -70,11 +70,11 @@ export default plugin.withOptions(
 
     return function ({ addComponents, theme }) {
       const config = theme(
-        'shurikenUi.buttonClose'
+        'shurikenUi.buttonIcon'
       ) satisfies typeof defaultButtonIconConfig
 
       addComponents({
-        [`.${prefix}-button-close`]: {
+        [`.${prefix}-button-icon`]: {
           [`@apply ${prefix}-focus relative inline-flex items-center justify-center space-x-1 font-sans text-${config.text} font-${config.font} leading-5 no-underline outline-none transition-all duration-${config.duration} disabled:opacity-60 disabled:cursor-not-allowed hover:shadow-none`]:
             {},
 
@@ -142,7 +142,7 @@ export default plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          buttonClose: defaultButtonIconConfig,
+          buttonIcon: defaultButtonIconConfig,
         },
       },
     }

diff --git a/src/plugins/components/button.ts b/src/plugins/components/button.ts
@@ -470,7 +470,6 @@ export default plugin.withOptions(
                 [`@apply bg-${config.badge.primary}`]: {},
               },
             },
-
             [`&.${prefix}-badge-info`]: {
               [`.${prefix}-button-badge-pulse`]: {
                 [`@apply bg-${config.badge.info}`]: {},
@@ -480,7 +479,6 @@ export default plugin.withOptions(
                 [`@apply bg-${config.badge.info}`]: {},
               },
             },
-
             [`&.${prefix}-badge-success`]: {
               [`.${prefix}-button-badge-pulse`]: {
                 [`@apply bg-${config.badge.success}`]: {},
@@ -490,7 +488,6 @@ export default plugin.withOptions(
                 [`@apply bg-${config.badge.success}`]: {},
               },
             },
-
             [`&.${prefix}-badge-warning`]: {
               [`.${prefix}-button-badge-pulse`]: {
                 [`@apply bg-${config.badge.warning}`]: {},
@@ -500,7 +497,6 @@ export default plugin.withOptions(
                 [`@apply bg-${config.badge.warning}`]: {},
               },
             },
-
             [`&.${prefix}-badge-danger`]: {
               [`.${prefix}-button-badge-pulse`]: {
                 [`@apply bg-${config.badge.danger}`]: {},