feat(dropdown): allow disabling menu options (#306) (#307)

close #306
globalbrain · Jun 19, 2023 · cbfa10d · cbfa10d
1 parent 00b2e45
commit cbfa10d
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/lib/components/SDropdownSectionMenu.vue b/lib/components/SDropdownSectionMenu.vue
@@ -9,7 +9,11 @@ defineProps<{
 <template>
   <ul class="SDropdownSectionMenu">
     <li v-for="option in options" :key="option.label" class="item">
-      <button class="button" @click="option.onClick">
+      <button
+        class="button"
+        @click="option.onClick"
+        :disabled="option.disabled"
+      >
         {{ option.label }}
       </button>
     </li>
@@ -33,8 +37,13 @@ defineProps<{
   font-weight: 400;
   transition: color 0.25s, background-color 0.25s;
 
-  &:hover {
+  &:hover:not(:disabled) {
     background-color: var(--c-mute);
   }
+
+  &:disabled {
+    color: var(--c-text-3);
+    cursor: not-allowed;
+  }
 }
 </style>
diff --git a/lib/composables/Dropdown.ts b/lib/composables/Dropdown.ts
@@ -21,6 +21,7 @@ export interface DropdownSectionMenu extends DropdownSectionBase {
 
 export interface DropdownSectionMenuOption {
   label: string
+  disabled?: boolean
   onClick(): void
 }
 

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@globalbrain/sefirot",
   "version": "2.37.1",
-  "packageManager": "pnpm@8.5.0",
+  "packageManager": "pnpm@8.6.2",
   "description": "Vue Components for Global Brain Design System.",
   "author": "Kia Ishii <ka.ishii@globalbrains.com>",
   "license": "MIT",