@designcrowd/fe-shared-lib 1.1.10-ast-btn-group → 1.1.10-ast-disabled-2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designcrowd/fe-shared-lib",
-  "version": "1.1.10-ast-btn-group",
+  "version": "1.1.10-ast-disabled-2",
   "scripts": {
     "start": "npm run storybook",
     "build": "npm run build:css --production",

package/public/css/tailwind-brandCrowd.css

@@ -1020,6 +1020,9 @@ video {
 .theme-brandCrowd .tw-animate-spin {
   animation: tw-spin 1s linear infinite;
 }
+.\!tw-cursor-not-allowed {
+  cursor: not-allowed !important;
+}
 .theme-brandCrowd .tw-cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -1161,9 +1164,6 @@ video {
 .theme-brandCrowd .tw-rounded-sm {
   border-radius: 0.125rem;
 }
-.theme-brandCrowd .tw-rounded-xl {
-  border-radius: 0.75rem;
-}
 .\!tw-rounded-l-none {
   border-top-left-radius: 0px !important;
   border-bottom-left-radius: 0px !important;

package/public/css/tailwind-brandPage.css

@@ -1020,6 +1020,9 @@ video {
 .theme-brandPage .tw-animate-spin {
   animation: tw-spin 1s linear infinite;
 }
+.\!tw-cursor-not-allowed {
+  cursor: not-allowed !important;
+}
 .theme-brandPage .tw-cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -1161,9 +1164,6 @@ video {
 .theme-brandPage .tw-rounded-sm {
   border-radius: 0.125rem;
 }
-.theme-brandPage .tw-rounded-xl {
-  border-radius: 0.75rem;
-}
 .\!tw-rounded-l-none {
   border-top-left-radius: 0px !important;
   border-bottom-left-radius: 0px !important;

package/public/css/tailwind-crazyDomains.css

@@ -1020,6 +1020,9 @@ video {
 .theme-crazyDomains .tw-animate-spin {
   animation: tw-spin 1s linear infinite;
 }
+.\!tw-cursor-not-allowed {
+  cursor: not-allowed !important;
+}
 .theme-crazyDomains .tw-cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -1161,9 +1164,6 @@ video {
 .theme-crazyDomains .tw-rounded-sm {
   border-radius: 0.125rem;
 }
-.theme-crazyDomains .tw-rounded-xl {
-  border-radius: 0.75rem;
-}
 .\!tw-rounded-l-none {
   border-top-left-radius: 0px !important;
   border-bottom-left-radius: 0px !important;

package/public/css/tailwind-designCom.css

@@ -1020,6 +1020,9 @@ video {
 .theme-designCom .tw-animate-spin {
   animation: tw-spin 1s linear infinite;
 }
+.\!tw-cursor-not-allowed {
+  cursor: not-allowed !important;
+}
 .theme-designCom .tw-cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -1161,9 +1164,6 @@ video {
 .theme-designCom .tw-rounded-sm {
   border-radius: 0.125rem;
 }
-.theme-designCom .tw-rounded-xl {
-  border-radius: 0.1rem;
-}
 .\!tw-rounded-l-none {
   border-top-left-radius: 0px !important;
   border-bottom-left-radius: 0px !important;

package/public/css/tailwind-designCrowd.css

@@ -1020,6 +1020,9 @@ video {
 .theme-designCrowd .tw-animate-spin {
   animation: tw-spin 1s linear infinite;
 }
+.\!tw-cursor-not-allowed {
+  cursor: not-allowed !important;
+}
 .theme-designCrowd .tw-cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -1161,9 +1164,6 @@ video {
 .theme-designCrowd .tw-rounded-sm {
   border-radius: 0.125rem;
 }
-.theme-designCrowd .tw-rounded-xl {
-  border-radius: 0.75rem;
-}
 .\!tw-rounded-l-none {
   border-top-left-radius: 0px !important;
   border-bottom-left-radius: 0px !important;

package/src/atoms/components/ButtonGroup/ButtonGroup.stories.js

@@ -21,6 +21,7 @@ export const Sample = () => {
         {
           label: 'Medium',
           value: 'medium',
+          disabled: true,
         },
         {
           label: 'Large',

package/src/atoms/components/ButtonGroup/ButtonGroup.vue

@@ -13,7 +13,7 @@
           '!tw-shadow-[0_0_0_2px] !tw-shadow-info-500': option.isSelected && !option.disabled,
           '!tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': !option.isSelected && !option.disabled,
           'hover:!tw-shadow-info-500': !option.isSelected && !option.disabled,
-          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-secondary-200': option.disabled,
+          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': option.disabled,
         }"
         :disabled="option.disabled"
         v-bind="option.dataAttribute ? { [option.dataAttribute]: '' } : {}"
@@ -41,7 +41,7 @@
           '!tw-shadow-[0_0_0_2px] !tw-shadow-info-500': option.isSelected && !option.disabled,
           '!tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': !option.isSelected && !option.disabled,
           'hover:!tw-shadow-info-500': !option.isSelected && !option.disabled,
-          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-secondary-200': option.disabled,
+          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': option.disabled,
           'tw-px-2': !option.iconViewBox,
           'tw-px-px':
             option.iconViewBox && !option.isSelected && !option.iconName.includes('display-style') && btnStyleVariant, // TODO - move style logic to computed prop
@@ -76,7 +76,7 @@
           '!tw-shadow-[0_0_0_2px] !tw-shadow-info-500': option.isSelected && !option.disabled,
           '!tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': !option.isSelected && !option.disabled,
           'hover:!tw-shadow-info-500': !option.isSelected && !option.disabled,
-          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-secondary-200': option.disabled,
+          'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': option.disabled,
         }"
         :disabled="option.disabled"
         class="tw-text-xs button-group-image-button tw-shadow-inner"
@@ -102,7 +102,7 @@
         '!tw-shadow-[0_0_0_2px] !tw-shadow-info-500': option.isSelected && !option.disabled,
         '!tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': !option.isSelected && !option.disabled,
         'hover:!tw-shadow-info-500': !option.isSelected && !option.disabled,
-        'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-secondary-200': option.disabled,
+        'tw-opacity-50 !tw-cursor-not-allowed !tw-shadow-[0_0_0_1px] !tw-shadow-secondary-200': option.disabled,
       }"
       :disabled="option.disabled"
       class="tw-text-xs button-group-button tw-shadow-inner"
@@ -197,24 +197,4 @@ export default {
 .button-group-button {
   @apply button-group-item tw-w-full tw-p-3;
 }
-
-.button-group-item:disabled {
-  @apply tw-cursor-not-allowed tw-opacity-50;
-}
-
-.button-group-item:disabled:hover {
-  @apply !tw-shadow-secondary-200;
-}
-
-/* Ensure disabled state overrides hover effects */
-.button-group-item:disabled {
-  cursor: not-allowed !important;
-  opacity: 0.5 !important;
-  pointer-events: auto !important; /* Keep pointer events for cursor display */
-}
-
-.button-group-item:disabled:hover {
-  box-shadow: 0 0 0 1px rgb(var(--color-secondary-200)) !important;
-  cursor: not-allowed !important;
-}
 </style>