revotech-ui-kit 0.0.11 → 0.0.12

Sign up to get free protection for your applications and to get access to all the features.
Files changed (255) hide show
  1. package/dist/src/components/atoms/alert/alert.atom.d.ts +7 -0
  2. package/dist/src/components/atoms/card/card.atom.d.ts +10 -0
  3. package/dist/src/components/atoms/checkbox/checkbox.atom.d.ts +5 -0
  4. package/dist/src/components/atoms/combo-box/combo-box.atom.d.ts +5 -0
  5. package/dist/src/components/atoms/combo-box/combo-box.stories.d.ts +5 -6
  6. package/dist/src/components/atoms/command/command.stories.d.ts +11 -0
  7. package/dist/src/components/atoms/dialog/dialog-close.d.ts +5 -0
  8. package/dist/src/components/atoms/dialog/dialog.atom.d.ts +17 -1
  9. package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.d.ts +19 -3
  10. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.d.ts +1 -0
  11. package/dist/src/components/atoms/index.d.ts +11 -5
  12. package/dist/src/components/atoms/label/label.atom.d.ts +5 -0
  13. package/dist/src/components/atoms/popover/popover.atom.d.ts +11 -1
  14. package/dist/src/components/atoms/textarea/textarea.atom.d.ts +16 -0
  15. package/dist/src/components/atoms/textarea/textarea.stories.d.ts +7 -0
  16. package/dist/src/components/atoms/textarea/textarea.styles.d.ts +1 -0
  17. package/dist/src/components/atoms/textarea/textarea.type.d.ts +11 -0
  18. package/dist/src/components/atoms/toggle/toggle.stories.d.ts +5 -6
  19. package/dist/src/components/molecules/breadCrumb/Breadcrumb-link.d.ts +7 -0
  20. package/dist/src/components/molecules/breadCrumb/breadCrumb.stories.d.ts +16 -0
  21. package/dist/src/components/molecules/breadCrumb/breadcrumb-ellipsis.d.ts +6 -0
  22. package/dist/src/components/molecules/breadCrumb/breadcrumb-item.d.ts +6 -0
  23. package/dist/src/components/molecules/breadCrumb/breadcrumb-list.d.ts +6 -0
  24. package/dist/src/components/molecules/breadCrumb/breadcrumb-separator.d.ts +6 -0
  25. package/dist/src/components/molecules/breadCrumb/breadcrumb-text.d.ts +6 -0
  26. package/dist/src/components/molecules/breadCrumb/breadcrumb.molecules.d.ts +6 -0
  27. package/dist/src/components/molecules/breadCrumb/breadcrumb.styles.d.ts +6 -0
  28. package/dist/src/components/molecules/index.d.ts +7 -1
  29. package/dist/src/components/molecules/toggle-group/defs.d.ts +37 -0
  30. package/dist/src/components/molecules/toggle-group/toggle-group-item.d.ts +17 -0
  31. package/dist/src/components/molecules/toggle-group/toggle-group.molecules.d.ts +19 -0
  32. package/dist/src/components/molecules/toggle-group/toggle-group.stories.d.ts +5 -0
  33. package/dist/src/components/molecules/toggle-group/toggle-group.style.d.ts +4 -0
  34. package/dist/src/index.d.ts +2 -4
  35. package/dist/tsconfig.tsbuildinfo +1 -1
  36. package/package.json +1 -1
  37. package/dist/revotech-ui-kit.cjs +0 -2293
  38. package/dist/revotech-ui-kit.js +0 -5608
  39. package/dist/src/assets/icons/arrows.icon.js +0 -20
  40. package/dist/src/assets/icons/arrows.icon.js.map +0 -1
  41. package/dist/src/assets/icons/index.js +0 -4
  42. package/dist/src/assets/icons/index.js.map +0 -1
  43. package/dist/src/assets/icons/search.icon.js +0 -19
  44. package/dist/src/assets/icons/search.icon.js.map +0 -1
  45. package/dist/src/assets/icons/tick.icon.js +0 -20
  46. package/dist/src/assets/icons/tick.icon.js.map +0 -1
  47. package/dist/src/components/atoms/alert/alert-description.js +0 -18
  48. package/dist/src/components/atoms/alert/alert-description.js.map +0 -1
  49. package/dist/src/components/atoms/alert/alert-title.js +0 -20
  50. package/dist/src/components/atoms/alert/alert-title.js.map +0 -1
  51. package/dist/src/components/atoms/alert/alert.atom.js +0 -55
  52. package/dist/src/components/atoms/alert/alert.atom.js.map +0 -1
  53. package/dist/src/components/atoms/alert/alert.stories.js +0 -62
  54. package/dist/src/components/atoms/alert/alert.stories.js.map +0 -1
  55. package/dist/src/components/atoms/alert/alert.styles.js +0 -21
  56. package/dist/src/components/atoms/alert/alert.styles.js.map +0 -1
  57. package/dist/src/components/atoms/alert/alert.types.js +0 -2
  58. package/dist/src/components/atoms/alert/alert.types.js.map +0 -1
  59. package/dist/src/components/atoms/badge/badge.atom.js +0 -43
  60. package/dist/src/components/atoms/badge/badge.atom.js.map +0 -1
  61. package/dist/src/components/atoms/badge/badge.stories.js +0 -110
  62. package/dist/src/components/atoms/badge/badge.stories.js.map +0 -1
  63. package/dist/src/components/atoms/badge/badge.style.js +0 -17
  64. package/dist/src/components/atoms/badge/badge.style.js.map +0 -1
  65. package/dist/src/components/atoms/badge/badge.type.js +0 -2
  66. package/dist/src/components/atoms/badge/badge.type.js.map +0 -1
  67. package/dist/src/components/atoms/button/button.atom.js +0 -67
  68. package/dist/src/components/atoms/button/button.atom.js.map +0 -1
  69. package/dist/src/components/atoms/button/button.stories.js +0 -204
  70. package/dist/src/components/atoms/button/button.stories.js.map +0 -1
  71. package/dist/src/components/atoms/button/button.style.js +0 -24
  72. package/dist/src/components/atoms/button/button.style.js.map +0 -1
  73. package/dist/src/components/atoms/button/button.type.js +0 -2
  74. package/dist/src/components/atoms/button/button.type.js.map +0 -1
  75. package/dist/src/components/atoms/card/card-content.js +0 -17
  76. package/dist/src/components/atoms/card/card-content.js.map +0 -1
  77. package/dist/src/components/atoms/card/card-description.js +0 -17
  78. package/dist/src/components/atoms/card/card-description.js.map +0 -1
  79. package/dist/src/components/atoms/card/card-footer.js +0 -17
  80. package/dist/src/components/atoms/card/card-footer.js.map +0 -1
  81. package/dist/src/components/atoms/card/card-header.js +0 -17
  82. package/dist/src/components/atoms/card/card-header.js.map +0 -1
  83. package/dist/src/components/atoms/card/card-title.js +0 -17
  84. package/dist/src/components/atoms/card/card-title.js.map +0 -1
  85. package/dist/src/components/atoms/card/card.atom.js +0 -25
  86. package/dist/src/components/atoms/card/card.atom.js.map +0 -1
  87. package/dist/src/components/atoms/card/card.stories.js +0 -136
  88. package/dist/src/components/atoms/card/card.stories.js.map +0 -1
  89. package/dist/src/components/atoms/checkbox/checkbox.atom.js +0 -87
  90. package/dist/src/components/atoms/checkbox/checkbox.atom.js.map +0 -1
  91. package/dist/src/components/atoms/checkbox/checkbox.stories.js +0 -244
  92. package/dist/src/components/atoms/checkbox/checkbox.stories.js.map +0 -1
  93. package/dist/src/components/atoms/checkbox/checkbox.style.js +0 -3
  94. package/dist/src/components/atoms/checkbox/checkbox.style.js.map +0 -1
  95. package/dist/src/components/atoms/checkbox/checkbox.type.js +0 -2
  96. package/dist/src/components/atoms/checkbox/checkbox.type.js.map +0 -1
  97. package/dist/src/components/atoms/combo-box/combo-box-input.js +0 -47
  98. package/dist/src/components/atoms/combo-box/combo-box-input.js.map +0 -1
  99. package/dist/src/components/atoms/combo-box/combo-box-item.js +0 -85
  100. package/dist/src/components/atoms/combo-box/combo-box-item.js.map +0 -1
  101. package/dist/src/components/atoms/combo-box/combo-box-list.js +0 -67
  102. package/dist/src/components/atoms/combo-box/combo-box-list.js.map +0 -1
  103. package/dist/src/components/atoms/combo-box/combo-box.atom.js +0 -199
  104. package/dist/src/components/atoms/combo-box/combo-box.atom.js.map +0 -1
  105. package/dist/src/components/atoms/combo-box/combo-box.stories.js +0 -86
  106. package/dist/src/components/atoms/combo-box/combo-box.stories.js.map +0 -1
  107. package/dist/src/components/atoms/command-empty/command-empty.atom.js +0 -53
  108. package/dist/src/components/atoms/command-empty/command-empty.atom.js.map +0 -1
  109. package/dist/src/components/atoms/command-group/command-group.atom.js +0 -70
  110. package/dist/src/components/atoms/command-group/command-group.atom.js.map +0 -1
  111. package/dist/src/components/atoms/command-item/command-item.atom.js +0 -78
  112. package/dist/src/components/atoms/command-item/command-item.atom.js.map +0 -1
  113. package/dist/src/components/atoms/command-list/command-list.atom.js +0 -35
  114. package/dist/src/components/atoms/command-list/command-list.atom.js.map +0 -1
  115. package/dist/src/components/atoms/command-separator/command-separator.atom.js +0 -51
  116. package/dist/src/components/atoms/command-separator/command-separator.atom.js.map +0 -1
  117. package/dist/src/components/atoms/dialog/dialog-close.js +0 -46
  118. package/dist/src/components/atoms/dialog/dialog-close.js.map +0 -1
  119. package/dist/src/components/atoms/dialog/dialog-content.js +0 -72
  120. package/dist/src/components/atoms/dialog/dialog-content.js.map +0 -1
  121. package/dist/src/components/atoms/dialog/dialog-footer.js +0 -22
  122. package/dist/src/components/atoms/dialog/dialog-footer.js.map +0 -1
  123. package/dist/src/components/atoms/dialog/dialog-header.js +0 -40
  124. package/dist/src/components/atoms/dialog/dialog-header.js.map +0 -1
  125. package/dist/src/components/atoms/dialog/dialog-overly.js +0 -20
  126. package/dist/src/components/atoms/dialog/dialog-overly.js.map +0 -1
  127. package/dist/src/components/atoms/dialog/dialog-trigger.js +0 -53
  128. package/dist/src/components/atoms/dialog/dialog-trigger.js.map +0 -1
  129. package/dist/src/components/atoms/dialog/dialog.atom.js +0 -78
  130. package/dist/src/components/atoms/dialog/dialog.atom.js.map +0 -1
  131. package/dist/src/components/atoms/dialog/dialog.stories.js +0 -88
  132. package/dist/src/components/atoms/dialog/dialog.stories.js.map +0 -1
  133. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js +0 -115
  134. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js.map +0 -1
  135. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js +0 -80
  136. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js.map +0 -1
  137. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js +0 -70
  138. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js.map +0 -1
  139. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js +0 -78
  140. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js.map +0 -1
  141. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js +0 -116
  142. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js.map +0 -1
  143. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js +0 -51
  144. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js.map +0 -1
  145. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js +0 -20
  146. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js.map +0 -1
  147. package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js +0 -77
  148. package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js.map +0 -1
  149. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js +0 -211
  150. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js.map +0 -1
  151. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js +0 -4
  152. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js.map +0 -1
  153. package/dist/src/components/atoms/index.js +0 -14
  154. package/dist/src/components/atoms/index.js.map +0 -1
  155. package/dist/src/components/atoms/input/input.atom.js +0 -93
  156. package/dist/src/components/atoms/input/input.atom.js.map +0 -1
  157. package/dist/src/components/atoms/input/input.stories.js +0 -382
  158. package/dist/src/components/atoms/input/input.stories.js.map +0 -1
  159. package/dist/src/components/atoms/input/input.styles.js +0 -2
  160. package/dist/src/components/atoms/input/input.styles.js.map +0 -1
  161. package/dist/src/components/atoms/input/input.type.js +0 -2
  162. package/dist/src/components/atoms/input/input.type.js.map +0 -1
  163. package/dist/src/components/atoms/label/label.atom.js +0 -67
  164. package/dist/src/components/atoms/label/label.atom.js.map +0 -1
  165. package/dist/src/components/atoms/label/label.stories.js +0 -85
  166. package/dist/src/components/atoms/label/label.stories.js.map +0 -1
  167. package/dist/src/components/atoms/label/label.style.js +0 -3
  168. package/dist/src/components/atoms/label/label.style.js.map +0 -1
  169. package/dist/src/components/atoms/popover/popover-content.js +0 -62
  170. package/dist/src/components/atoms/popover/popover-content.js.map +0 -1
  171. package/dist/src/components/atoms/popover/popover-trigger.js +0 -50
  172. package/dist/src/components/atoms/popover/popover-trigger.js.map +0 -1
  173. package/dist/src/components/atoms/popover/popover.atom.js +0 -40
  174. package/dist/src/components/atoms/popover/popover.atom.js.map +0 -1
  175. package/dist/src/components/atoms/popover/popover.stories.js +0 -69
  176. package/dist/src/components/atoms/popover/popover.stories.js.map +0 -1
  177. package/dist/src/components/atoms/popover/popover.style.js +0 -21
  178. package/dist/src/components/atoms/popover/popover.style.js.map +0 -1
  179. package/dist/src/components/atoms/popover/popover.types.js +0 -4
  180. package/dist/src/components/atoms/popover/popover.types.js.map +0 -1
  181. package/dist/src/components/atoms/toggle/defs.js +0 -30
  182. package/dist/src/components/atoms/toggle/defs.js.map +0 -1
  183. package/dist/src/components/atoms/toggle/toggle.atom.js +0 -72
  184. package/dist/src/components/atoms/toggle/toggle.atom.js.map +0 -1
  185. package/dist/src/components/atoms/toggle/toggle.stories.js +0 -189
  186. package/dist/src/components/atoms/toggle/toggle.stories.js.map +0 -1
  187. package/dist/src/components/atoms/toggle/toggle.style.js +0 -19
  188. package/dist/src/components/atoms/toggle/toggle.style.js.map +0 -1
  189. package/dist/src/components/command/command.d.ts +0 -56
  190. package/dist/src/components/command/command.js +0 -402
  191. package/dist/src/components/command/command.js.map +0 -1
  192. package/dist/src/components/command/command.stories.d.ts +0 -5
  193. package/dist/src/components/command/command.stories.js +0 -153
  194. package/dist/src/components/command/command.stories.js.map +0 -1
  195. package/dist/src/components/index.js +0 -3
  196. package/dist/src/components/index.js.map +0 -1
  197. package/dist/src/components/molecules/command/command.molecules.js +0 -27
  198. package/dist/src/components/molecules/command/command.molecules.js.map +0 -1
  199. package/dist/src/components/molecules/command-input/command-input.atom.js +0 -125
  200. package/dist/src/components/molecules/command-input/command-input.atom.js.map +0 -1
  201. package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js +0 -2
  202. package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js.map +0 -1
  203. package/dist/src/components/molecules/index.js +0 -2
  204. package/dist/src/components/molecules/index.js.map +0 -1
  205. package/dist/src/helpers/base-element.js +0 -62
  206. package/dist/src/helpers/base-element.js.map +0 -1
  207. package/dist/src/helpers/index.js +0 -4
  208. package/dist/src/helpers/index.js.map +0 -1
  209. package/dist/src/helpers/mouse-conroller.helper.js +0 -33
  210. package/dist/src/helpers/mouse-conroller.helper.js.map +0 -1
  211. package/dist/src/helpers/style.helpers.js +0 -6
  212. package/dist/src/helpers/style.helpers.js.map +0 -1
  213. package/dist/src/index.js +0 -5
  214. package/dist/src/index.js.map +0 -1
  215. package/dist/src/interfaces/actionable.interface.js +0 -2
  216. package/dist/src/interfaces/actionable.interface.js.map +0 -1
  217. package/dist/src/interfaces/atomic.interface.js +0 -2
  218. package/dist/src/interfaces/atomic.interface.js.map +0 -1
  219. package/dist/src/interfaces/changeable.interface.js +0 -2
  220. package/dist/src/interfaces/changeable.interface.js.map +0 -1
  221. package/dist/src/interfaces/child-support-atomic.interface.js +0 -2
  222. package/dist/src/interfaces/child-support-atomic.interface.js.map +0 -1
  223. package/dist/src/interfaces/index.js +0 -7
  224. package/dist/src/interfaces/index.js.map +0 -1
  225. package/dist/src/interfaces/intractable.interface.js +0 -2
  226. package/dist/src/interfaces/intractable.interface.js.map +0 -1
  227. package/dist/src/interfaces/variant.interface.js +0 -2
  228. package/dist/src/interfaces/variant.interface.js.map +0 -1
  229. package/dist/src/lib/index.js +0 -2
  230. package/dist/src/lib/index.js.map +0 -1
  231. package/dist/src/lib/next/next.lib.js +0 -2
  232. package/dist/src/lib/next/next.lib.js.map +0 -1
  233. package/dist/src/lib/react/react.lib.js +0 -16
  234. package/dist/src/lib/react/react.lib.js.map +0 -1
  235. package/dist/src/lib/tw-styles.js +0 -1956
  236. package/dist/src/lib/tw-styles.js.map +0 -1
  237. package/dist/src/styles/index.js +0 -2
  238. package/dist/src/styles/index.js.map +0 -1
  239. package/dist/src/styles/tw.styles.js +0 -2218
  240. package/dist/src/styles/tw.styles.js.map +0 -1
  241. package/dist/src/wc-ui-app.js +0 -88
  242. package/dist/src/wc-ui-app.js.map +0 -1
  243. package/dist/test/wc-ui-app.test.d.ts +0 -0
  244. package/dist/test/wc-ui-app.test.js +0 -18
  245. package/dist/test/wc-ui-app.test.js.map +0 -1
  246. package/dist/vite.config.d.ts +0 -2
  247. package/dist/vite.config.js +0 -29
  248. package/dist/vite.config.js.map +0 -1
  249. /package/dist/src/components/atoms/{command-empty → command}/command-empty.atom.d.ts +0 -0
  250. /package/dist/src/components/atoms/{command-group → command}/command-group.atom.d.ts +0 -0
  251. /package/dist/src/components/{molecules/command-input → atoms/command}/command-input.atom.d.ts +0 -0
  252. /package/dist/src/components/atoms/{command-item → command}/command-item.atom.d.ts +0 -0
  253. /package/dist/src/components/atoms/{command-list → command}/command-list.atom.d.ts +0 -0
  254. /package/dist/src/components/atoms/{command-separator → command}/command-separator.atom.d.ts +0 -0
  255. /package/dist/src/components/{molecules/command/command.molecules.d.ts → atoms/command/command.atom.d.ts} +0 -0
@@ -1,80 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { LitElement, html, css } from 'lit';
3
- import { customElement, property, state } from 'lit/decorators.js';
4
- import { TWStyles } from '../../../styles';
5
- import { DropdownMenu } from './dropdown-menu.atom';
6
- import { STATE_CLOSED } from '../popover/popover.types';
7
- let DropdownMenuContent = class DropdownMenuContent extends LitElement {
8
- constructor() {
9
- super(...arguments);
10
- this.state = STATE_CLOSED;
11
- this.isOpen = false;
12
- }
13
- get _dropdownMenu() {
14
- let parent = this.parentElement;
15
- // Traverse up the DOM tree to find the parent `Popover`
16
- while (parent && !(parent instanceof DropdownMenu)) {
17
- parent = parent.parentElement;
18
- }
19
- return parent;
20
- }
21
- connectedCallback() {
22
- super.connectedCallback();
23
- if (this.isOpen) {
24
- document.addEventListener('mousedown', this.handleClickOutside);
25
- }
26
- }
27
- disconnectedCallback() {
28
- document.removeEventListener('mousedown', this.handleClickOutside);
29
- super.disconnectedCallback();
30
- }
31
- updated(changedProps) {
32
- super.updated(changedProps);
33
- // Check if the state is 'open'
34
- if (this.state === 'open') {
35
- this.isOpen = true;
36
- }
37
- else {
38
- this.isOpen = false;
39
- }
40
- if (changedProps.has('isOpen')) {
41
- if (this.isOpen) {
42
- document.addEventListener('mousedown', this.handleClickOutside);
43
- }
44
- else {
45
- document.removeEventListener('mousedown', this.handleClickOutside);
46
- }
47
- }
48
- }
49
- handleClickOutside(event) {
50
- const dropdownMenu = this.shadowRoot?.querySelector('rtg-dropdown-menu-content');
51
- const dropdownButton = this.shadowRoot?.querySelector('button'); // Ensure this targets your open button
52
- if (dropdownMenu &&
53
- !dropdownMenu.contains(event.target) &&
54
- !dropdownButton?.contains(event.target)) {
55
- this.isOpen = false; // Only close if the click is outside both the menu and button
56
- }
57
- }
58
- render() {
59
- return html `
60
- <div
61
- class="max-h-[300px] overflow-y-auto overflow-x-hidden"
62
- style="display: ${this.isOpen ? 'block' : 'none'}"
63
- >
64
- <slot></slot>
65
- </div>
66
- `;
67
- }
68
- };
69
- DropdownMenuContent.styles = [css ``, TWStyles];
70
- __decorate([
71
- property({ attribute: 'data-state', type: String })
72
- ], DropdownMenuContent.prototype, "state", void 0);
73
- __decorate([
74
- state()
75
- ], DropdownMenuContent.prototype, "isOpen", void 0);
76
- DropdownMenuContent = __decorate([
77
- customElement('rtg-dropdown-menu-content')
78
- ], DropdownMenuContent);
79
- export { DropdownMenuContent };
80
- //# sourceMappingURL=dropdown-menu-content.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAA2B,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEpD,OAAO,EAAE,YAAY,EAAc,MAAM,0BAA0B,CAAC;AAG7D,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,UAAU;IAA5C;;QAEgD,UAAK,GAAG,YAAY,CAAC;QACjE,WAAM,GAAG,KAAK,CAAC;IAkE1B,CAAC;IAhEC,IAAI,aAAa;QACf,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAChC,wDAAwD;QACxD,OAAO,MAAM,IAAI,CAAC,CAAC,MAAM,YAAY,YAAY,CAAC,EAAE,CAAC;YACnD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAClE,CAAC;IACH,CAAC;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QACnE,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAED,OAAO,CAAC,YAA4B;QAClC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAC5B,+BAA+B;QAC/B,IAAI,IAAI,CAAC,KAAK,KAAK,MAAM,EAAE,CAAC;YAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC;QAED,IAAI,YAAY,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC/B,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;gBAChB,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;YAClE,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACrE,CAAC;QACH,CAAC;IACH,CAAC;IAED,kBAAkB,CAAC,KAAiB;QAClC,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CACjD,2BAA2B,CAC5B,CAAC;QACF,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,uCAAuC;QAExG,IACE,YAAY;YACZ,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;YAC5C,CAAC,cAAc,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAC/C,CAAC;YACD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,8DAA8D;QACrF,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;0BAGW,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;;;KAInD,CAAC;IACJ,CAAC;;AAnEM,0BAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AACmB;IAApD,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAsB;AACjE;IAAR,KAAK,EAAE;mDAAgB;AAHb,mBAAmB;IAD/B,aAAa,CAAC,2BAA2B,CAAC;GAC9B,mBAAmB,CAqE/B","sourcesContent":["import { LitElement, html, css, PropertyValues, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { DropdownMenu } from './dropdown-menu.atom';\nimport { dropdownMenuContentStyle } from './dropdownMenu.style';\nimport { STATE_CLOSED, STATE_OPEN } from '../popover/popover.types';\n\n@customElement('rtg-dropdown-menu-content')\nexport class DropdownMenuContent extends LitElement {\n static styles = [css``, TWStyles];\n @property({ attribute: 'data-state', type: String }) state = STATE_CLOSED;\n @state() isOpen = false;\n\n get _dropdownMenu(): DropdownMenu | null {\n let parent = this.parentElement;\n // Traverse up the DOM tree to find the parent `Popover`\n while (parent && !(parent instanceof DropdownMenu)) {\n parent = parent.parentElement;\n }\n return parent;\n }\n\n connectedCallback() {\n super.connectedCallback();\n if (this.isOpen) {\n document.addEventListener('mousedown', this.handleClickOutside);\n }\n }\n\n disconnectedCallback() {\n document.removeEventListener('mousedown', this.handleClickOutside);\n super.disconnectedCallback();\n }\n\n updated(changedProps: PropertyValues) {\n super.updated(changedProps);\n // Check if the state is 'open'\n if (this.state === 'open') {\n this.isOpen = true;\n } else {\n this.isOpen = false;\n }\n\n if (changedProps.has('isOpen')) {\n if (this.isOpen) {\n document.addEventListener('mousedown', this.handleClickOutside);\n } else {\n document.removeEventListener('mousedown', this.handleClickOutside);\n }\n }\n }\n\n handleClickOutside(event: MouseEvent) {\n const dropdownMenu = this.shadowRoot?.querySelector(\n 'rtg-dropdown-menu-content'\n );\n const dropdownButton = this.shadowRoot?.querySelector('button'); // Ensure this targets your open button\n\n if (\n dropdownMenu &&\n !dropdownMenu.contains(event.target as Node) &&\n !dropdownButton?.contains(event.target as Node)\n ) {\n this.isOpen = false; // Only close if the click is outside both the menu and button\n }\n }\n\n render() {\n return html`\n <div\n class=\"max-h-[300px] overflow-y-auto overflow-x-hidden\"\n style=\"display: ${this.isOpen ? 'block' : 'none'}\"\n >\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,70 +0,0 @@
1
- var DropdownMenuGroup_1;
2
- import { __decorate } from "tslib";
3
- import { LitElement, html, css, nothing } from 'lit';
4
- import { property, customElement } from 'lit/decorators.js';
5
- import { TWStyles } from '../../../styles';
6
- let DropdownMenuGroup = DropdownMenuGroup_1 = class DropdownMenuGroup extends LitElement {
7
- constructor() {
8
- super(...arguments);
9
- this.heading = '';
10
- this._id = '';
11
- this._hidden = '';
12
- }
13
- get identifier() {
14
- if (this._id !== '') {
15
- return this._id;
16
- }
17
- const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');
18
- if (parent) {
19
- this._id = `${parent.getAttribute('id')}g${DropdownMenuGroup_1._counter++}`;
20
- }
21
- else {
22
- this._id = `rtgcmdrxlxg${DropdownMenuGroup_1._counter++}`;
23
- }
24
- return this._id;
25
- }
26
- render() {
27
- const className = 'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';
28
- return html `${this._hidden === 'true'
29
- ? nothing
30
- : html `
31
- <div
32
- class="${className}"
33
- rtgcmd-group
34
- role="presentation"
35
- id="${this.identifier}"
36
- >
37
- <div
38
- rtgcmd-group-heading
39
- aria-hidden="true"
40
- id="${this.identifier}h"
41
- >
42
- ${this.heading}
43
- </div>
44
- <div
45
- rtgcmd-group-items
46
- role="group"
47
- aria-labelledby="${this.identifier}h"
48
- >
49
- <slot></slot>
50
- </div>
51
- </div>
52
- `}`;
53
- }
54
- };
55
- DropdownMenuGroup._counter = 0;
56
- DropdownMenuGroup.styles = [css ``, TWStyles];
57
- __decorate([
58
- property({ type: String })
59
- ], DropdownMenuGroup.prototype, "heading", void 0);
60
- __decorate([
61
- property({ attribute: 'id', type: String })
62
- ], DropdownMenuGroup.prototype, "_id", void 0);
63
- __decorate([
64
- property({ attribute: 'aria-hidden', type: String })
65
- ], DropdownMenuGroup.prototype, "_hidden", void 0);
66
- DropdownMenuGroup = DropdownMenuGroup_1 = __decorate([
67
- customElement('rtg-dropdown-menu-group')
68
- ], DropdownMenuGroup);
69
- export { DropdownMenuGroup };
70
- //# sourceMappingURL=dropdown-menu-group.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-group.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-group.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,iBAAiB,yBAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAA1C;;QACuB,YAAO,GAAG,EAAE,CAAC;QAEI,QAAG,GAAG,EAAE,CAAC;QAEA,YAAO,GAAG,EAAE,CAAC;IAiDrE,CAAC;IA3CC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,mBAAiB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC5E,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,mBAAiB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC1D,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GACb,kOAAkO,CAAC;QACrO,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM;YACnC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,SAAS;;;kBAGZ,IAAI,CAAC,UAAU;;;;;oBAKb,IAAI,CAAC,UAAU;;gBAEnB,IAAI,CAAC,OAAO;;;;;iCAKK,IAAI,CAAC,UAAU;;;;;SAKvC,EAAE,CAAC;IACV,CAAC;;AA9Cc,0BAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,wBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AARN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAc;AAEI;IAA5C,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAU;AAEA;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAc;AALxD,iBAAiB;IAD7B,aAAa,CAAC,yBAAyB,CAAC;GAC5B,iBAAiB,CAsD7B","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-dropdown-menu-group')\nexport class DropdownMenuGroup extends LitElement {\n @property({ type: String }) heading = '';\n\n @property({ attribute: 'id', type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}g${DropdownMenuGroup._counter++}`;\n } else {\n this._id = `rtgcmdrxlxg${DropdownMenuGroup._counter++}`;\n }\n return this._id;\n }\n\n render() {\n const className =\n 'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';\n return html`${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${className}\"\n rtgcmd-group\n role=\"presentation\"\n id=\"${this.identifier}\"\n >\n <div\n rtgcmd-group-heading\n aria-hidden=\"true\"\n id=\"${this.identifier}h\"\n >\n ${this.heading}\n </div>\n <div\n rtgcmd-group-items\n role=\"group\"\n aria-labelledby=\"${this.identifier}h\"\n >\n <slot></slot>\n </div>\n </div>\n `}`;\n }\n}\n"]}
@@ -1,78 +0,0 @@
1
- var DropdownMenuItem_1;
2
- import { __decorate } from "tslib";
3
- import { LitElement, html, css, nothing } from 'lit';
4
- import { property, customElement, } from 'lit/decorators.js';
5
- import { cn } from '../../../helpers';
6
- import { TWStyles } from '../../../styles';
7
- let DropdownMenuItem = DropdownMenuItem_1 = class DropdownMenuItem extends LitElement {
8
- constructor() {
9
- super(...arguments);
10
- this._id = '';
11
- this._hidden = '';
12
- this.selected = false;
13
- }
14
- get identifier() {
15
- if (this._id !== '') {
16
- return this._id;
17
- }
18
- const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');
19
- if (parent) {
20
- this._id = `${parent.getAttribute('id')}li${DropdownMenuItem_1._counter++}`;
21
- }
22
- else {
23
- this._id = `rtgcmdrxgxli${DropdownMenuItem_1._counter++}`;
24
- }
25
- return this._id;
26
- }
27
- get value() {
28
- return this.textContent?.trim() || '';
29
- }
30
- handleMouseEvent(e) {
31
- if (e.type === 'mouseover' || e.type === 'focus') {
32
- this.selected = true;
33
- }
34
- if (e.type === 'mouseleave') {
35
- this.selected = false;
36
- }
37
- }
38
- render() {
39
- return html ` ${this._hidden === 'true'
40
- ? nothing
41
- : html `
42
- <div
43
- class="${cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', this.className)}"
44
- @mouseover="${this.handleMouseEvent}"
45
- @mouseleave="${this.handleMouseEvent}"
46
- @focus="${this.handleMouseEvent}"
47
- rtgcmd-item
48
- role="option"
49
- aria-selected="${this.selected}"
50
- data-selected="${this.selected}"
51
- data-value="${this.value}"
52
- id="${this.identifier}"
53
- aria-hidden="${this.hidden}"
54
- >
55
- <slot></slot>
56
- </div>
57
- `}`;
58
- }
59
- };
60
- DropdownMenuItem._counter = 0;
61
- DropdownMenuItem.styles = [css ``, TWStyles];
62
- __decorate([
63
- property({ type: String })
64
- ], DropdownMenuItem.prototype, "_id", void 0);
65
- __decorate([
66
- property({ attribute: 'aria-hidden', type: String })
67
- ], DropdownMenuItem.prototype, "_hidden", void 0);
68
- __decorate([
69
- property({ attribute: 'data-value', type: String })
70
- ], DropdownMenuItem.prototype, "value", null);
71
- __decorate([
72
- property({ type: Boolean })
73
- ], DropdownMenuItem.prototype, "selected", void 0);
74
- DropdownMenuItem = DropdownMenuItem_1 = __decorate([
75
- customElement('rtg-dropdown-menu-item')
76
- ], DropdownMenuItem);
77
- export { DropdownMenuItem };
78
- //# sourceMappingURL=dropdown-menu-item.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-item.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-item.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EACL,QAAQ,EACR,aAAa,GAEd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,gBAAgB,wBAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;QAyBtC,aAAQ,GAAG,KAAK,CAAC;IAmChD,CAAC;IAtDC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC;QACrE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC5E,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,eAAe,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC1D,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAGD,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;IACxC,CAAC;IAIO,gBAAgB,CAAC,CAAQ;QAC/B,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACjD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACvB,CAAC;QACD,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;YAC5B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACxB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,IAAI,IAAI,CAAC,OAAO,KAAK,MAAM;YACpC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CACT,+NAA+N,EAC/N,IAAI,CAAC,SAAS,CACf;0BACa,IAAI,CAAC,gBAAgB;2BACpB,IAAI,CAAC,gBAAgB;sBAC1B,IAAI,CAAC,gBAAgB;;;6BAGd,IAAI,CAAC,QAAQ;6BACb,IAAI,CAAC,QAAQ;0BAChB,IAAI,CAAC,KAAK;kBAClB,IAAI,CAAC,UAAU;2BACN,IAAI,CAAC,MAAM;;;;SAI7B,EAAE,CAAC;IACV,CAAC;;AAzDc,yBAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,uBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AANN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAc;AAqBnE;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAGnD;AAE4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAAkB;AA5BnC,gBAAgB;IAD5B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,gBAAgB,CA+D5B","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport {\n property,\n customElement,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-dropdown-menu-item')\nexport class DropdownMenuItem extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}li${DropdownMenuItem._counter++}`;\n } else {\n this._id = `rtgcmdrxgxli${DropdownMenuItem._counter++}`;\n }\n return this._id;\n }\n\n @property({ attribute: 'data-value', type: String })\n public get value() {\n return this.textContent?.trim() || '';\n }\n\n @property({ type: Boolean }) selected = false;\n\n private handleMouseEvent(e: Event) {\n if (e.type === 'mouseover' || e.type === 'focus') {\n this.selected = true;\n }\n if (e.type === 'mouseleave') {\n this.selected = false;\n }\n }\n\n render() {\n return html` ${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${cn(\n 'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n this.className\n )}\"\n @mouseover=\"${this.handleMouseEvent}\"\n @mouseleave=\"${this.handleMouseEvent}\"\n @focus=\"${this.handleMouseEvent}\"\n rtgcmd-item\n role=\"option\"\n aria-selected=\"${this.selected}\"\n data-selected=\"${this.selected}\"\n data-value=\"${this.value}\"\n id=\"${this.identifier}\"\n aria-hidden=\"${this.hidden}\"\n >\n <slot></slot>\n </div>\n `}`;\n }\n}\n"]}
@@ -1,116 +0,0 @@
1
- var DropdownMenuRadioItem_1;
2
- import { __decorate } from "tslib";
3
- import { LitElement, html, css, nothing } from 'lit';
4
- import { property, customElement } from 'lit/decorators.js';
5
- import { cn } from '../../../helpers';
6
- import { TWStyles } from '../../../styles';
7
- let DropdownMenuRadioItem = DropdownMenuRadioItem_1 = class DropdownMenuRadioItem extends LitElement {
8
- constructor() {
9
- super(...arguments);
10
- this._id = '';
11
- this._hidden = '';
12
- this.selected = false;
13
- this.checked = false; // Added `checked` state
14
- this.disabled = false;
15
- }
16
- get identifier() {
17
- if (this._id !== '') {
18
- return this._id;
19
- }
20
- const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');
21
- if (parent) {
22
- this._id = `${parent.getAttribute('id')}li${DropdownMenuRadioItem_1._counter++}`;
23
- }
24
- else {
25
- this._id = `rtgcmdrxgxli${DropdownMenuRadioItem_1._counter++}`;
26
- }
27
- return this._id;
28
- }
29
- get value() {
30
- return this.textContent?.trim() || '';
31
- }
32
- handleMouseEvent(e) {
33
- if (e.type === 'mouseover' || e.type === 'focus') {
34
- this.selected = true;
35
- }
36
- if (e.type === 'mouseleave') {
37
- this.selected = false;
38
- }
39
- }
40
- toggleChecked() {
41
- this.checked = !this.checked; // Toggle the checked state
42
- }
43
- render() {
44
- return html `
45
- <div
46
- class="${cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground', this.disabled ? 'pointer-events-none opacity-50' : '', this.className)}"
47
- @click=${this.toggleChecked}
48
- @mouseover="${this.handleMouseEvent}"
49
- @mouseleave="${this.handleMouseEvent}"
50
- @focus="${this.handleMouseEvent}"
51
- rtgcmd-item
52
- role="option"
53
- aria-selected="${this.selected}"
54
- data-selected="${this.selected}"
55
- data-value="${this.value}"
56
- id="${this.identifier}"
57
- aria-hidden="${this.hidden}"
58
- >
59
- <span
60
- class="icon-space absolute left-2 flex items-center justify-center"
61
- >
62
- ${this.checked
63
- ? html `
64
- <svg
65
- xmlns="http://www.w3.org/2000/svg"
66
- width="24"
67
- height="24"
68
- viewBox="0 0 15 15"
69
- >
70
- <path
71
- fill="currentColor"
72
- d="M9.875 7.5a2.375 2.375 0 1 1-4.75 0a2.375 2.375 0 0 1 4.75 0"
73
- />
74
- </svg>
75
- `
76
- : nothing}
77
- </span>
78
- <slot></slot>
79
- </div>
80
- `;
81
- }
82
- };
83
- DropdownMenuRadioItem._counter = 0;
84
- DropdownMenuRadioItem.styles = [
85
- css `
86
- .icon-space {
87
- width: 16px; /* Fixed width to reserve space for the check icon */
88
- height: 16px;
89
- display: inline-block;
90
- }
91
- `,
92
- TWStyles,
93
- ];
94
- __decorate([
95
- property({ type: String })
96
- ], DropdownMenuRadioItem.prototype, "_id", void 0);
97
- __decorate([
98
- property({ attribute: 'aria-hidden', type: String })
99
- ], DropdownMenuRadioItem.prototype, "_hidden", void 0);
100
- __decorate([
101
- property({ attribute: 'data-value', type: String })
102
- ], DropdownMenuRadioItem.prototype, "value", null);
103
- __decorate([
104
- property({ type: Boolean })
105
- ], DropdownMenuRadioItem.prototype, "selected", void 0);
106
- __decorate([
107
- property({ type: Boolean })
108
- ], DropdownMenuRadioItem.prototype, "checked", void 0);
109
- __decorate([
110
- property({ type: Boolean })
111
- ], DropdownMenuRadioItem.prototype, "disabled", void 0);
112
- DropdownMenuRadioItem = DropdownMenuRadioItem_1 = __decorate([
113
- customElement('rtg-dropdown-menu-radio-item')
114
- ], DropdownMenuRadioItem);
115
- export { DropdownMenuRadioItem };
116
- //# sourceMappingURL=dropdown-menu-radio-item.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-radio-item.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-radio-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-dropdown-menu-radio-item')\nexport class DropdownMenuRadioItem extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [\n css`\n .icon-space {\n width: 16px; /* Fixed width to reserve space for the check icon */\n height: 16px;\n display: inline-block;\n }\n `,\n TWStyles,\n ];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');\n if (parent) {\n this._id = `${parent.getAttribute(\n 'id'\n )}li${DropdownMenuRadioItem._counter++}`;\n } else {\n this._id = `rtgcmdrxgxli${DropdownMenuRadioItem._counter++}`;\n }\n return this._id;\n }\n\n @property({ attribute: 'data-value', type: String })\n public get value() {\n return this.textContent?.trim() || '';\n }\n\n @property({ type: Boolean }) selected = false;\n\n private handleMouseEvent(e: Event) {\n if (e.type === 'mouseover' || e.type === 'focus') {\n this.selected = true;\n }\n if (e.type === 'mouseleave') {\n this.selected = false;\n }\n }\n\n @property({ type: Boolean }) checked = false; // Added `checked` state\n @property({ type: Boolean }) disabled = false;\n\n toggleChecked() {\n this.checked = !this.checked; // Toggle the checked state\n }\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground',\n this.disabled ? 'pointer-events-none opacity-50' : '',\n this.className\n )}\"\n @click=${this.toggleChecked}\n @mouseover=\"${this.handleMouseEvent}\"\n @mouseleave=\"${this.handleMouseEvent}\"\n @focus=\"${this.handleMouseEvent}\"\n rtgcmd-item\n role=\"option\"\n aria-selected=\"${this.selected}\"\n data-selected=\"${this.selected}\"\n data-value=\"${this.value}\"\n id=\"${this.identifier}\"\n aria-hidden=\"${this.hidden}\"\n >\n <span\n class=\"icon-space absolute left-2 flex items-center justify-center\"\n >\n ${this.checked\n ? html`\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 15 15\"\n >\n <path\n fill=\"currentColor\"\n d=\"M9.875 7.5a2.375 2.375 0 1 1-4.75 0a2.375 2.375 0 0 1 4.75 0\"\n />\n </svg>\n `\n : nothing}\n </span>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,51 +0,0 @@
1
- var DropdownMenuSeparator_1;
2
- import { __decorate } from "tslib";
3
- import { LitElement, html, css, nothing } from 'lit';
4
- import { property, customElement } from 'lit/decorators.js';
5
- import { cn } from '../../../helpers';
6
- import { TWStyles } from '../../../styles';
7
- let DropdownMenuSeparator = DropdownMenuSeparator_1 = class DropdownMenuSeparator extends LitElement {
8
- constructor() {
9
- super(...arguments);
10
- this._id = '';
11
- this._hidden = '';
12
- }
13
- get identifier() {
14
- if (this._id !== '') {
15
- return this._id;
16
- }
17
- const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');
18
- if (parent) {
19
- this._id = `${parent.getAttribute('id')}s${DropdownMenuSeparator_1._counter++}`;
20
- }
21
- else {
22
- this._id = `rtgcmdrxlxs${DropdownMenuSeparator_1._counter++}`;
23
- }
24
- return this._id;
25
- }
26
- render() {
27
- return html `${this._hidden === 'true'
28
- ? nothing
29
- : html `
30
- <div
31
- class="${cn('-mx-1 h-px bg-border', this.className)}"
32
- rtgcmd-separator
33
- role="separator"
34
- id="${this.identifier}"
35
- ></div>
36
- `}`;
37
- }
38
- };
39
- DropdownMenuSeparator._counter = 0;
40
- DropdownMenuSeparator.styles = [css ``, TWStyles];
41
- __decorate([
42
- property({ type: String })
43
- ], DropdownMenuSeparator.prototype, "_id", void 0);
44
- __decorate([
45
- property({ attribute: 'aria-hidden', type: String })
46
- ], DropdownMenuSeparator.prototype, "_hidden", void 0);
47
- DropdownMenuSeparator = DropdownMenuSeparator_1 = __decorate([
48
- customElement('rtg-dropdown-menu-separator')
49
- ], DropdownMenuSeparator);
50
- export { DropdownMenuSeparator };
51
- //# sourceMappingURL=dropdown-menu-seperator.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-seperator.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-seperator.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,qBAAqB,6BAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAA9C;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;IAkCrE,CAAC;IA5BC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAC/B,IAAI,CACL,IAAI,uBAAqB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC1C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,uBAAqB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC9D,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM;YACnC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CAAC,sBAAsB,EAAE,IAAI,CAAC,SAAS,CAAC;;;kBAG7C,IAAI,CAAC,UAAU;;SAExB,EAAE,CAAC;IACV,CAAC;;AA/Bc,8BAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,4BAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AANN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAAc;AAHxD,qBAAqB;IADjC,aAAa,CAAC,6BAA6B,CAAC;GAChC,qBAAqB,CAqCjC","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-dropdown-menu-separator')\nexport class DropdownMenuSeparator extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n if (parent) {\n this._id = `${parent.getAttribute(\n 'id'\n )}s${DropdownMenuSeparator._counter++}`;\n } else {\n this._id = `rtgcmdrxlxs${DropdownMenuSeparator._counter++}`;\n }\n return this._id;\n }\n\n render() {\n return html`${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${cn('-mx-1 h-px bg-border', this.className)}\"\n rtgcmd-separator\n role=\"separator\"\n id=\"${this.identifier}\"\n ></div>\n `}`;\n }\n}\n"]}
@@ -1,20 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { LitElement, html, css } from 'lit';
3
- import { customElement } from 'lit/decorators.js';
4
- import { cn } from '../../../helpers';
5
- import { TWStyles } from '../../../styles';
6
- let DropdownMenuShortcut = class DropdownMenuShortcut extends LitElement {
7
- render() {
8
- return html `
9
- <span class="${cn('ml-auto text-xs font-semibold', this.className)}">
10
- <slot></slot>
11
- </span>
12
- `;
13
- }
14
- };
15
- DropdownMenuShortcut.styles = [css ``, TWStyles];
16
- DropdownMenuShortcut = __decorate([
17
- customElement('rtg-dropdown-menu-shortcut')
18
- ], DropdownMenuShortcut);
19
- export { DropdownMenuShortcut };
20
- //# sourceMappingURL=dropdown-menu-shortcut.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-shortcut.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-shortcut.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAW,MAAM,KAAK,CAAC;AACrD,OAAO,EAAY,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAGlD,MAAM;QACJ,OAAO,IAAI,CAAA;qBACM,EAAE,CAAC,+BAA+B,EAAE,IAAI,CAAC,SAAS,CAAC;;;KAGnE,CAAC;IACJ,CAAC;;AARM,2BAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,oBAAoB;IADhC,aAAa,CAAC,4BAA4B,CAAC;GAC/B,oBAAoB,CAUhC","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-dropdown-menu-shortcut')\nexport class DropdownMenuShortcut extends LitElement {\n static styles = [css``, TWStyles];\n\n render() {\n return html`\n <span class=\"${cn('ml-auto text-xs font-semibold', this.className)}\">\n <slot></slot>\n </span>\n `;\n }\n}\n"]}
@@ -1,77 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { LitElement, html, css } from 'lit';
3
- import { customElement, state, } from 'lit/decorators.js';
4
- import { TWStyles } from '../../../styles';
5
- import './dropdown-menu-content';
6
- import { DropdownMenuContent } from './dropdown-menu-content';
7
- import './dropdown-menu-item';
8
- let DropdownMenu = class DropdownMenu extends LitElement {
9
- constructor() {
10
- super(...arguments);
11
- this.isOpen = false;
12
- this.handleClickOutside = (e) => {
13
- const target = e.target;
14
- // Check if the clicked element is outside the dropdown
15
- if (!this.shadowRoot?.contains(target)) {
16
- this.isOpen = false; // Close the dropdown
17
- }
18
- };
19
- }
20
- connectedCallback() {
21
- super.connectedCallback();
22
- document.addEventListener('click', this.handleClickOutside);
23
- }
24
- disconnectedCallback() {
25
- document.removeEventListener('click', this.handleClickOutside);
26
- super.disconnectedCallback();
27
- }
28
- toggleDropdown(e) {
29
- e.stopPropagation(); // Prevent closing immediately on button click
30
- this.isOpen = !this.isOpen;
31
- }
32
- get _content() {
33
- const slot = this.shadowRoot?.querySelector('slot');
34
- const children = slot?.assignedElements();
35
- if (children) {
36
- for (let index = 0; index < children.length; index++) {
37
- if (children[index] instanceof DropdownMenuContent) {
38
- return children[index];
39
- }
40
- }
41
- }
42
- return null;
43
- }
44
- updated(_changedProperties) {
45
- super.updated(_changedProperties);
46
- const content = this._content;
47
- if (content) {
48
- content.dataset.state = this.isOpen ? 'open' : 'close';
49
- }
50
- }
51
- render() {
52
- return html `
53
- <div >
54
- <div>
55
- <button data-ignore-outside-click class="inline-flex items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-8 px-4 py-2" @click="${this.toggleDropdown}">
56
- open
57
- <buttom>
58
- </div>
59
- <div
60
- class="flex h-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground border shadow-md"
61
- style="display: ${this.isOpen ? 'block' : 'none'};width:260px"
62
- >
63
- <slot></slot>
64
- </div>
65
- </div>
66
- `;
67
- }
68
- };
69
- DropdownMenu.styles = [css ``, TWStyles];
70
- __decorate([
71
- state()
72
- ], DropdownMenu.prototype, "isOpen", void 0);
73
- DropdownMenu = __decorate([
74
- customElement('rtg-dropdown-menu')
75
- ], DropdownMenu);
76
- export { DropdownMenu };
77
- //# sourceMappingURL=dropdown-menu.atom.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu.atom.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAA2B,MAAM,KAAK,CAAC;AACrE,OAAO,EAEL,aAAa,EACb,KAAK,GAEN,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,sBAAsB,CAAC;AAGvB,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAGI,WAAM,GAAG,KAAK,CAAC;QAiBxB,uBAAkB,GAAG,CAAC,CAAa,EAAE,EAAE;YACrC,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;YACvC,uDAAuD;YACvD,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;gBACvC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,qBAAqB;YAC5C,CAAC;QACH,CAAC,CAAC;IA2CJ,CAAC;IAhEC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC9D,CAAC;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC/D,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAED,cAAc,CAAC,CAAa;QAC1B,CAAC,CAAC,eAAe,EAAE,CAAC,CAAC,8CAA8C;QACnE,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC7B,CAAC;IAUD,IAAY,QAAQ;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,EAAE,gBAAgB,EAAE,CAAC;QAC1C,IAAI,QAAQ,EAAE,CAAC;YACb,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;gBACrD,IAAI,QAAQ,CAAC,KAAK,CAAC,YAAY,mBAAmB,EAAE,CAAC;oBACnD,OAAO,QAAQ,CAAC,KAAK,CAAwB,CAAC;gBAChD,CAAC;YACH,CAAC;QACH,CAAC;QAED,OAAO,IAAI,CAAC;IACd,CAAC;IAES,OAAO,CAAC,kBAAkC;QAClD,KAAK,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAClC,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC9B,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QACzD,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;2WAIN,IAAI,CAAC,cACP;;;;;;6BAMsB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;;;;KAKtD,CAAC;IACJ,CAAC;;AAnEM,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEzB;IAAR,KAAK,EAAE;4CAAgB;AAHb,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CAqExB","sourcesContent":["import { LitElement, html, css, nothing, PropertyValues } from 'lit';\nimport {\n property,\n customElement,\n state,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport './dropdown-menu-content';\nimport { DropdownMenuContent } from './dropdown-menu-content';\nimport './dropdown-menu-item';\n\n@customElement('rtg-dropdown-menu')\nexport class DropdownMenu extends LitElement {\n static styles = [css``, TWStyles];\n\n @state() isOpen = false;\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this.handleClickOutside);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleClickOutside);\n super.disconnectedCallback();\n }\n\n toggleDropdown(e: MouseEvent) {\n e.stopPropagation(); // Prevent closing immediately on button click\n this.isOpen = !this.isOpen;\n }\n\n handleClickOutside = (e: MouseEvent) => {\n const target = e.target as HTMLElement;\n // Check if the clicked element is outside the dropdown\n if (!this.shadowRoot?.contains(target)) {\n this.isOpen = false; // Close the dropdown\n }\n };\n\n private get _content(): DropdownMenuContent | null {\n const slot = this.shadowRoot?.querySelector('slot');\n const children = slot?.assignedElements();\n if (children) {\n for (let index = 0; index < children.length; index++) {\n if (children[index] instanceof DropdownMenuContent) {\n return children[index] as DropdownMenuContent;\n }\n }\n }\n\n return null;\n }\n\n protected updated(_changedProperties: PropertyValues): void {\n super.updated(_changedProperties);\n const content = this._content;\n if (content) {\n content.dataset.state = this.isOpen ? 'open' : 'close';\n }\n }\n\n render() {\n return html`\n <div >\n <div>\n <button data-ignore-outside-click class=\"inline-flex items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-8 px-4 py-2\" @click=\"${\n this.toggleDropdown\n }\">\n open\n <buttom>\n </div>\n <div\n class=\"flex h-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground border shadow-md\"\n style=\"display: ${this.isOpen ? 'block' : 'none'};width:260px\"\n >\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n"]}