@fiscozen/dropdown 0.1.22 → 0.1.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fiscozen/dropdown",
3
- "version": "0.1.22",
3
+ "version": "0.1.23",
4
4
  "description": "Design System Dropdown component",
5
5
  "main": "src/index.ts",
6
6
  "type": "module",
@@ -8,8 +8,8 @@
8
8
  "author": "Alen Ajam",
9
9
  "dependencies": {
10
10
  "@fiscozen/button": "^0.1.10",
11
- "@fiscozen/composables": "^0.1.36",
12
- "@fiscozen/actionlist": "^0.1.8"
11
+ "@fiscozen/actionlist": "^0.1.9",
12
+ "@fiscozen/composables": "^0.1.36"
13
13
  },
14
14
  "peerDependencies": {
15
15
  "tailwindcss": "^3.4.1",
@@ -5,10 +5,10 @@
5
5
  ref="container"
6
6
  overrideContentClass
7
7
  :teleport="teleport"
8
- contentClass="fixed pt-4 z-70"
8
+ :contentClass="['fixed pt-4 z-70', props.floatingClass || '']"
9
9
  >
10
10
  <template #opener>
11
- <slot name="opener" :isOpen="isOpen" :open="open">
11
+ <slot name="opener" :isOpen="isOpen" :open :close>
12
12
  <FzButton
13
13
  icon-position="after"
14
14
  :icon-name="buttonIconName"
@@ -21,7 +21,11 @@
21
21
  </FzButton>
22
22
  </slot>
23
23
  </template>
24
- <FzActionlist :items="actions" :label="actionsLabel" @fzaction:click="handleActionClick" />
24
+ <FzActionlist :items="actions" :label="actionsLabel" :listClass="props.listClass" @fzaction:click="handleActionClick">
25
+ <template v-for="(action, index) in actions" :key="index" #[`fzaction-item-${index}`]>
26
+ <slot :name="`fzaction-item-${index}`" :item="action" :open :close></slot>
27
+ </template>
28
+ </FzActionlist>
25
29
  </FzFloating>
26
30
  </template>
27
31
 
@@ -78,8 +82,12 @@ function handleActionClick(index: number, action: ActionlistItem) {
78
82
  function open() {
79
83
  isOpen.value = true
80
84
  }
85
+ function close() {
86
+ isOpen.value = false
87
+ }
81
88
 
82
89
  defineExpose({
83
- open
90
+ open,
91
+ close
84
92
  })
85
93
  </script>
package/src/types.ts CHANGED
@@ -36,6 +36,14 @@ type FzDropdownProps = {
36
36
  * teleport floating to body
37
37
  */
38
38
  teleport?: boolean
39
+ /**
40
+ * Class binded to the action list
41
+ */
42
+ listClass?: string
43
+ /**
44
+ * Class binded to the floating element
45
+ */
46
+ floatingClass?: string
39
47
  }
40
48
 
41
49
  type FzDropdownSlots = {
@@ -48,7 +56,7 @@ type FzDropdownSlots = {
48
56
  *
49
57
  * Use this to replace the button opener entirely
50
58
  */
51
- opener(props: { isOpen: boolean }): VNode | VNode[]
59
+ opener(props: { isOpen: boolean, open: () => void, close: () => void }): VNode | VNode[]
52
60
  }
53
61
 
54
62
  interface FzIconDropdownProps extends FzDropdownProps {