revotech-ui-kit 0.0.3-beta → 0.0.5-beta

Sign up to get free protection for your applications and to get access to all the features.
Files changed (216) hide show
  1. package/dist/index.ts +1 -1
  2. package/dist/sw.js +1 -1
  3. package/dist/sw.js.map +1 -1
  4. package/package.json +2 -1
  5. package/src/components/atoms/alert/alert.atom.ts +5 -1
  6. package/src/components/atoms/button/button.atom.ts +6 -0
  7. package/src/index.d.ts +1 -0
  8. package/src/index.ts +1 -1
  9. package/dist/183c6c38.js +0 -1
  10. package/dist/public/globals.css +0 -2215
  11. package/dist/public/tailwind-lib.css +0 -115
  12. package/dist/src/assets/icons/arrows.icon.js +0 -20
  13. package/dist/src/assets/icons/arrows.icon.js.map +0 -1
  14. package/dist/src/assets/icons/index.js +0 -4
  15. package/dist/src/assets/icons/index.js.map +0 -1
  16. package/dist/src/assets/icons/search.icon.js +0 -19
  17. package/dist/src/assets/icons/search.icon.js.map +0 -1
  18. package/dist/src/assets/icons/tick.icon.js +0 -20
  19. package/dist/src/assets/icons/tick.icon.js.map +0 -1
  20. package/dist/src/components/atoms/alert/alert-description.js +0 -18
  21. package/dist/src/components/atoms/alert/alert-description.js.map +0 -1
  22. package/dist/src/components/atoms/alert/alert-title.js +0 -20
  23. package/dist/src/components/atoms/alert/alert-title.js.map +0 -1
  24. package/dist/src/components/atoms/alert/alert.atom.js +0 -55
  25. package/dist/src/components/atoms/alert/alert.atom.js.map +0 -1
  26. package/dist/src/components/atoms/alert/alert.stories.js +0 -62
  27. package/dist/src/components/atoms/alert/alert.stories.js.map +0 -1
  28. package/dist/src/components/atoms/alert/alert.styles.js +0 -21
  29. package/dist/src/components/atoms/alert/alert.styles.js.map +0 -1
  30. package/dist/src/components/atoms/alert/alert.types.js +0 -2
  31. package/dist/src/components/atoms/alert/alert.types.js.map +0 -1
  32. package/dist/src/components/atoms/badge/badge.atom.js +0 -43
  33. package/dist/src/components/atoms/badge/badge.atom.js.map +0 -1
  34. package/dist/src/components/atoms/badge/badge.stories.js +0 -110
  35. package/dist/src/components/atoms/badge/badge.stories.js.map +0 -1
  36. package/dist/src/components/atoms/badge/badge.style.js +0 -17
  37. package/dist/src/components/atoms/badge/badge.style.js.map +0 -1
  38. package/dist/src/components/atoms/badge/badge.type.js +0 -2
  39. package/dist/src/components/atoms/badge/badge.type.js.map +0 -1
  40. package/dist/src/components/atoms/button/button.atom.js +0 -67
  41. package/dist/src/components/atoms/button/button.atom.js.map +0 -1
  42. package/dist/src/components/atoms/button/button.stories.js +0 -204
  43. package/dist/src/components/atoms/button/button.stories.js.map +0 -1
  44. package/dist/src/components/atoms/button/button.style.js +0 -24
  45. package/dist/src/components/atoms/button/button.style.js.map +0 -1
  46. package/dist/src/components/atoms/button/button.type.js +0 -2
  47. package/dist/src/components/atoms/button/button.type.js.map +0 -1
  48. package/dist/src/components/atoms/card/card-content.js +0 -17
  49. package/dist/src/components/atoms/card/card-content.js.map +0 -1
  50. package/dist/src/components/atoms/card/card-description.js +0 -17
  51. package/dist/src/components/atoms/card/card-description.js.map +0 -1
  52. package/dist/src/components/atoms/card/card-footer.js +0 -17
  53. package/dist/src/components/atoms/card/card-footer.js.map +0 -1
  54. package/dist/src/components/atoms/card/card-header.js +0 -17
  55. package/dist/src/components/atoms/card/card-header.js.map +0 -1
  56. package/dist/src/components/atoms/card/card-title.js +0 -17
  57. package/dist/src/components/atoms/card/card-title.js.map +0 -1
  58. package/dist/src/components/atoms/card/card.atom.js +0 -25
  59. package/dist/src/components/atoms/card/card.atom.js.map +0 -1
  60. package/dist/src/components/atoms/card/card.stories.js +0 -136
  61. package/dist/src/components/atoms/card/card.stories.js.map +0 -1
  62. package/dist/src/components/atoms/checkbox/checkbox.atom.js +0 -87
  63. package/dist/src/components/atoms/checkbox/checkbox.atom.js.map +0 -1
  64. package/dist/src/components/atoms/checkbox/checkbox.stories.js +0 -244
  65. package/dist/src/components/atoms/checkbox/checkbox.stories.js.map +0 -1
  66. package/dist/src/components/atoms/checkbox/checkbox.style.js +0 -3
  67. package/dist/src/components/atoms/checkbox/checkbox.style.js.map +0 -1
  68. package/dist/src/components/atoms/checkbox/checkbox.type.js +0 -2
  69. package/dist/src/components/atoms/checkbox/checkbox.type.js.map +0 -1
  70. package/dist/src/components/atoms/combo-box/combo-box-input.js +0 -47
  71. package/dist/src/components/atoms/combo-box/combo-box-input.js.map +0 -1
  72. package/dist/src/components/atoms/combo-box/combo-box-item.js +0 -85
  73. package/dist/src/components/atoms/combo-box/combo-box-item.js.map +0 -1
  74. package/dist/src/components/atoms/combo-box/combo-box-list.js +0 -67
  75. package/dist/src/components/atoms/combo-box/combo-box-list.js.map +0 -1
  76. package/dist/src/components/atoms/combo-box/combo-box.atom.js +0 -199
  77. package/dist/src/components/atoms/combo-box/combo-box.atom.js.map +0 -1
  78. package/dist/src/components/atoms/combo-box/combo-box.stories.js +0 -86
  79. package/dist/src/components/atoms/combo-box/combo-box.stories.js.map +0 -1
  80. package/dist/src/components/atoms/command-empty/command-empty.atom.js +0 -54
  81. package/dist/src/components/atoms/command-empty/command-empty.atom.js.map +0 -1
  82. package/dist/src/components/atoms/command-group/command-group.atom.js +0 -71
  83. package/dist/src/components/atoms/command-group/command-group.atom.js.map +0 -1
  84. package/dist/src/components/atoms/command-item/command-item.atom.js +0 -80
  85. package/dist/src/components/atoms/command-item/command-item.atom.js.map +0 -1
  86. package/dist/src/components/atoms/command-list/command-list.atom.js +0 -36
  87. package/dist/src/components/atoms/command-list/command-list.atom.js.map +0 -1
  88. package/dist/src/components/atoms/command-separator/command-separator.atom.js +0 -52
  89. package/dist/src/components/atoms/command-separator/command-separator.atom.js.map +0 -1
  90. package/dist/src/components/atoms/dialog/dialog-close.js +0 -47
  91. package/dist/src/components/atoms/dialog/dialog-close.js.map +0 -1
  92. package/dist/src/components/atoms/dialog/dialog-content.js +0 -72
  93. package/dist/src/components/atoms/dialog/dialog-content.js.map +0 -1
  94. package/dist/src/components/atoms/dialog/dialog-footer.js +0 -22
  95. package/dist/src/components/atoms/dialog/dialog-footer.js.map +0 -1
  96. package/dist/src/components/atoms/dialog/dialog-header.js +0 -40
  97. package/dist/src/components/atoms/dialog/dialog-header.js.map +0 -1
  98. package/dist/src/components/atoms/dialog/dialog-overly.js +0 -20
  99. package/dist/src/components/atoms/dialog/dialog-overly.js.map +0 -1
  100. package/dist/src/components/atoms/dialog/dialog-trigger.js +0 -54
  101. package/dist/src/components/atoms/dialog/dialog-trigger.js.map +0 -1
  102. package/dist/src/components/atoms/dialog/dialog.atom.js +0 -79
  103. package/dist/src/components/atoms/dialog/dialog.atom.js.map +0 -1
  104. package/dist/src/components/atoms/dialog/dialog.stories.js +0 -88
  105. package/dist/src/components/atoms/dialog/dialog.stories.js.map +0 -1
  106. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js +0 -117
  107. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js.map +0 -1
  108. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js +0 -81
  109. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js.map +0 -1
  110. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js +0 -71
  111. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js.map +0 -1
  112. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js +0 -80
  113. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js.map +0 -1
  114. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js +0 -118
  115. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js.map +0 -1
  116. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js +0 -52
  117. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js.map +0 -1
  118. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js +0 -20
  119. package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js.map +0 -1
  120. package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js +0 -79
  121. package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js.map +0 -1
  122. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js +0 -211
  123. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js.map +0 -1
  124. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js +0 -4
  125. package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js.map +0 -1
  126. package/dist/src/components/atoms/index.js +0 -14
  127. package/dist/src/components/atoms/index.js.map +0 -1
  128. package/dist/src/components/atoms/input/input.atom.js +0 -93
  129. package/dist/src/components/atoms/input/input.atom.js.map +0 -1
  130. package/dist/src/components/atoms/input/input.stories.js +0 -382
  131. package/dist/src/components/atoms/input/input.stories.js.map +0 -1
  132. package/dist/src/components/atoms/input/input.styles.js +0 -2
  133. package/dist/src/components/atoms/input/input.styles.js.map +0 -1
  134. package/dist/src/components/atoms/input/input.type.js +0 -2
  135. package/dist/src/components/atoms/input/input.type.js.map +0 -1
  136. package/dist/src/components/atoms/label/label.atom.js +0 -68
  137. package/dist/src/components/atoms/label/label.atom.js.map +0 -1
  138. package/dist/src/components/atoms/label/label.stories.js +0 -85
  139. package/dist/src/components/atoms/label/label.stories.js.map +0 -1
  140. package/dist/src/components/atoms/label/label.style.js +0 -3
  141. package/dist/src/components/atoms/label/label.style.js.map +0 -1
  142. package/dist/src/components/atoms/popover/popover-content.js +0 -64
  143. package/dist/src/components/atoms/popover/popover-content.js.map +0 -1
  144. package/dist/src/components/atoms/popover/popover-trigger.js +0 -51
  145. package/dist/src/components/atoms/popover/popover-trigger.js.map +0 -1
  146. package/dist/src/components/atoms/popover/popover.atom.js +0 -40
  147. package/dist/src/components/atoms/popover/popover.atom.js.map +0 -1
  148. package/dist/src/components/atoms/popover/popover.stories.js +0 -69
  149. package/dist/src/components/atoms/popover/popover.stories.js.map +0 -1
  150. package/dist/src/components/atoms/popover/popover.style.js +0 -21
  151. package/dist/src/components/atoms/popover/popover.style.js.map +0 -1
  152. package/dist/src/components/atoms/popover/popover.types.js +0 -4
  153. package/dist/src/components/atoms/popover/popover.types.js.map +0 -1
  154. package/dist/src/components/atoms/toggle/defs.js +0 -30
  155. package/dist/src/components/atoms/toggle/defs.js.map +0 -1
  156. package/dist/src/components/atoms/toggle/toggle.atom.js +0 -72
  157. package/dist/src/components/atoms/toggle/toggle.atom.js.map +0 -1
  158. package/dist/src/components/atoms/toggle/toggle.stories.js +0 -189
  159. package/dist/src/components/atoms/toggle/toggle.stories.js.map +0 -1
  160. package/dist/src/components/atoms/toggle/toggle.style.js +0 -19
  161. package/dist/src/components/atoms/toggle/toggle.style.js.map +0 -1
  162. package/dist/src/components/command/command.js +0 -410
  163. package/dist/src/components/command/command.js.map +0 -1
  164. package/dist/src/components/command/command.stories.js +0 -153
  165. package/dist/src/components/command/command.stories.js.map +0 -1
  166. package/dist/src/components/index.js +0 -3
  167. package/dist/src/components/index.js.map +0 -1
  168. package/dist/src/components/molecules/command/command.molecules.js +0 -27
  169. package/dist/src/components/molecules/command/command.molecules.js.map +0 -1
  170. package/dist/src/components/molecules/command-input/command-input.atom.js +0 -127
  171. package/dist/src/components/molecules/command-input/command-input.atom.js.map +0 -1
  172. package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js +0 -2
  173. package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js.map +0 -1
  174. package/dist/src/components/molecules/index.js +0 -2
  175. package/dist/src/components/molecules/index.js.map +0 -1
  176. package/dist/src/helpers/base-element.js +0 -64
  177. package/dist/src/helpers/base-element.js.map +0 -1
  178. package/dist/src/helpers/index.js +0 -4
  179. package/dist/src/helpers/index.js.map +0 -1
  180. package/dist/src/helpers/mouse-conroller.helper.js +0 -33
  181. package/dist/src/helpers/mouse-conroller.helper.js.map +0 -1
  182. package/dist/src/helpers/style.helpers.js +0 -6
  183. package/dist/src/helpers/style.helpers.js.map +0 -1
  184. package/dist/src/index.js +0 -2
  185. package/dist/src/index.js.map +0 -1
  186. package/dist/src/interfaces/actionable.interface.js +0 -2
  187. package/dist/src/interfaces/actionable.interface.js.map +0 -1
  188. package/dist/src/interfaces/atomic.interface.js +0 -2
  189. package/dist/src/interfaces/atomic.interface.js.map +0 -1
  190. package/dist/src/interfaces/changeable.interface.js +0 -2
  191. package/dist/src/interfaces/changeable.interface.js.map +0 -1
  192. package/dist/src/interfaces/child-support-atomic.interface.js +0 -2
  193. package/dist/src/interfaces/child-support-atomic.interface.js.map +0 -1
  194. package/dist/src/interfaces/index.js +0 -7
  195. package/dist/src/interfaces/index.js.map +0 -1
  196. package/dist/src/interfaces/intractable.interface.js +0 -2
  197. package/dist/src/interfaces/intractable.interface.js.map +0 -1
  198. package/dist/src/interfaces/variant.interface.js +0 -2
  199. package/dist/src/interfaces/variant.interface.js.map +0 -1
  200. package/dist/src/lib/index.js +0 -2
  201. package/dist/src/lib/index.js.map +0 -1
  202. package/dist/src/lib/next/next.lib.js +0 -2
  203. package/dist/src/lib/next/next.lib.js.map +0 -1
  204. package/dist/src/lib/react/react.lib.js +0 -16
  205. package/dist/src/lib/react/react.lib.js.map +0 -1
  206. package/dist/src/lib/tw-styles.js +0 -1956
  207. package/dist/src/lib/tw-styles.js.map +0 -1
  208. package/dist/src/styles/index.js +0 -2
  209. package/dist/src/styles/index.js.map +0 -1
  210. package/dist/src/styles/tw.styles.js +0 -2218
  211. package/dist/src/styles/tw.styles.js.map +0 -1
  212. package/dist/src/wc-ui-app.js +0 -88
  213. package/dist/src/wc-ui-app.js.map +0 -1
  214. package/dist/test/wc-ui-app.test.js +0 -18
  215. package/dist/test/wc-ui-app.test.js.map +0 -1
  216. package/dist/tsconfig.tsbuildinfo +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"command-separator.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-separator/command-separator.atom.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,gBAAgB,wBAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;IAgCrE,CAAC;IA1BC,IAAY,UAAU;;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,MAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,UAAU,0CAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC3E,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QACzD,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;;AA7Bc,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;AAHxD,gBAAgB;IAD5B,aAAa,CAAC,uBAAuB,CAAC;GAC1B,gBAAgB,CAmC5B","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-command-separator')\nexport class CommandSeparator 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('id')}s${CommandSeparator._counter++}`;\n } else {\n this._id = `rtgcmdrxlxs${CommandSeparator._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,47 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { TWStyles } from '../../../styles';
3
- import { css, html, LitElement } from 'lit';
4
- import { customElement } from 'lit/decorators.js';
5
- import { Dialog } from './dialog.atom';
6
- const STATE_OPEN = 'open';
7
- const STATE_CLOSED = 'closed';
8
- let DialogClose = class DialogClose extends LitElement {
9
- get _dialog() {
10
- let parent = this.parentElement;
11
- while (parent) {
12
- if (parent instanceof Dialog) {
13
- return parent;
14
- }
15
- parent = parent.parentElement;
16
- }
17
- return parent;
18
- }
19
- firstUpdated(_changedProperties) {
20
- var _a;
21
- super.firstUpdated(_changedProperties);
22
- const slot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
23
- const children = slot === null || slot === void 0 ? void 0 : slot.assignedElements();
24
- if (children && children.length > 0) {
25
- const button = children[0];
26
- button.addEventListener('click', () => {
27
- const dialog = this._dialog;
28
- if (dialog) {
29
- dialog.dataset.state = STATE_CLOSED;
30
- }
31
- });
32
- }
33
- }
34
- render() {
35
- return html `
36
- <div>
37
- <slot></slot>
38
- </div>
39
- `;
40
- }
41
- };
42
- DialogClose.styles = [css ``, TWStyles];
43
- DialogClose = __decorate([
44
- customElement('rtg-dialog-close')
45
- ], DialogClose);
46
- export { DialogClose };
47
- //# sourceMappingURL=dialog-close.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-close.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-close.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAoB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAGzC,IAAY,OAAO;QACjB,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAEhC,OAAO,MAAM,EAAE,CAAC;YACd,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;gBAC7B,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAES,YAAY,CACpB,kBAAqE;;QAErE,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;QACvC,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,EAAE,CAAC;QAC1C,IAAI,QAAQ,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpC,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAE3B,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACpC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;gBAC5B,IAAI,MAAM,EAAE,CAAC;oBACX,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC;gBACtC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AAtCM,kBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,WAAW;IADvB,aAAa,CAAC,kBAAkB,CAAC;GACrB,WAAW,CAwCvB","sourcesContent":["import { TWStyles } from '../../../styles';\nimport { css, html, LitElement, PropertyValueMap } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { Dialog } from './dialog.atom';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog-close')\nexport class DialogClose extends LitElement {\n static styles = [css``, TWStyles];\n\n private get _dialog(): Dialog | null {\n let parent = this.parentElement;\n\n while (parent) {\n if (parent instanceof Dialog) {\n return parent;\n }\n parent = parent.parentElement;\n }\n return parent;\n }\n\n protected firstUpdated(\n _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>\n ): void {\n super.firstUpdated(_changedProperties);\n const slot = this.shadowRoot?.querySelector('slot');\n const children = slot?.assignedElements();\n if (children && children.length > 0) {\n const button = children[0];\n\n button.addEventListener('click', () => {\n const dialog = this._dialog;\n if (dialog) {\n dialog.dataset.state = STATE_CLOSED;\n }\n });\n }\n }\n\n render() {\n return html`\n <div>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,72 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { TWStyles } from '../../../styles';
3
- import { cn } from '../../../helpers';
4
- import { css, html, LitElement, nothing } from 'lit';
5
- import { customElement, property } from 'lit/decorators.js';
6
- import { Dialog } from './dialog.atom';
7
- const STATE_OPEN = 'open';
8
- const STATE_CLOSED = 'closed';
9
- let DialogContent = class DialogContent extends LitElement {
10
- constructor() {
11
- super(...arguments);
12
- this.state = STATE_CLOSED;
13
- this.handleCloseButtonClick = () => {
14
- const dialog = this._dialog;
15
- if (dialog) {
16
- dialog.dataset.state = STATE_CLOSED;
17
- }
18
- };
19
- }
20
- get _dialog() {
21
- let parent = this.parentElement;
22
- while (parent) {
23
- if (parent instanceof Dialog) {
24
- return parent;
25
- }
26
- parent = parent.parentElement;
27
- }
28
- return parent;
29
- }
30
- render() {
31
- return html `${this.state === STATE_OPEN
32
- ? html `
33
- <div
34
- class="${cn('fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', this.className)}"
35
- rtgdlg-content
36
- >
37
- <slot></slot>
38
- <button
39
- type="button"
40
- @click="${this.handleCloseButtonClick}"
41
- class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
42
- >
43
- <svg
44
- xmlns="http://www.w3.org/2000/svg"
45
- width="24"
46
- height="24"
47
- viewBox="0 0 24 24"
48
- fill="none"
49
- stroke="currentColor"
50
- stroke-width="2"
51
- stroke-linecap="round"
52
- stroke-linejoin="round"
53
- class="h-4 w-4"
54
- >
55
- <path d="M18 6 6 18"></path>
56
- <path d="m6 6 12 12"></path></svg
57
- ><span class="sr-only">Close</span>
58
- </button>
59
- </div>
60
- `
61
- : nothing}`;
62
- }
63
- };
64
- DialogContent.styles = [css ``, TWStyles];
65
- __decorate([
66
- property({ attribute: 'data-state', type: String })
67
- ], DialogContent.prototype, "state", void 0);
68
- DialogContent = __decorate([
69
- customElement('rtg-dialog-content')
70
- ], DialogContent);
71
- export { DialogContent };
72
- //# sourceMappingURL=dialog-content.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAGgD,UAAK,GAAG,YAAY,CAAC;QAclE,2BAAsB,GAAG,GAAG,EAAE;YACpC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;YAC5B,IAAI,MAAM,EAAE,CAAC;gBACX,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC;YACtC,CAAC;QACH,CAAC,CAAC;IAsCJ,CAAC;IAvDC,IAAY,OAAO;QACjB,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAEhC,OAAO,MAAM,EAAE,CAAC;YACd,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;gBAC7B,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IASD,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,KAAK,KAAK,UAAU;YACrC,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CACT,6fAA6f,EAC7f,IAAI,CAAC,SAAS,CACf;;;;;;wBAMW,IAAI,CAAC,sBAAsB;;;;;;;;;;;;;;;;;;;;SAoB1C;YACH,CAAC,CAAC,OAAO,EAAE,CAAC;IAChB,CAAC;;AA1DM,oBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEmB;IAApD,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAsB;AAH/D,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA4DzB","sourcesContent":["import { TWStyles } from '../../../styles';\nimport { cn } from '../../../helpers';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { Dialog } from './dialog.atom';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog-content')\nexport class DialogContent extends LitElement {\n static styles = [css``, TWStyles];\n\n @property({ attribute: 'data-state', type: String }) state = STATE_CLOSED;\n\n private get _dialog(): Dialog | null {\n let parent = this.parentElement;\n\n while (parent) {\n if (parent instanceof Dialog) {\n return parent;\n }\n parent = parent.parentElement;\n }\n return parent;\n }\n\n private handleCloseButtonClick = () => {\n const dialog = this._dialog;\n if (dialog) {\n dialog.dataset.state = STATE_CLOSED;\n }\n };\n\n render() {\n return html`${this.state === STATE_OPEN\n ? html`\n <div\n class=\"${cn(\n 'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',\n this.className\n )}\"\n rtgdlg-content\n >\n <slot></slot>\n <button\n type=\"button\"\n @click=\"${this.handleCloseButtonClick}\"\n class=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path d=\"M18 6 6 18\"></path>\n <path d=\"m6 6 12 12\"></path></svg\n ><span class=\"sr-only\">Close</span>\n </button>\n </div>\n `\n : nothing}`;\n }\n}\n"]}
@@ -1,22 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { cn } from '../../../helpers';
3
- import { TWStyles } from '../../../styles';
4
- import { css, html, LitElement } from 'lit';
5
- import { customElement } from 'lit/decorators.js';
6
- let DialogFooter = class DialogFooter extends LitElement {
7
- render() {
8
- return html `
9
- <div
10
- class="${cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', this.className)}"
11
- >
12
- <slot></slot>
13
- </div>
14
- `;
15
- }
16
- };
17
- DialogFooter.styles = [css ``, TWStyles];
18
- DialogFooter = __decorate([
19
- customElement('rtg-dialog-footer')
20
- ], DialogFooter);
21
- export { DialogFooter };
22
- //# sourceMappingURL=dialog-footer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-footer.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-footer.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAG3C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAG1C,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,+DAA+D,EAC/D,IAAI,CAAC,SAAS,CACf;;;;KAIJ,CAAC;IACJ,CAAC;;AAbM,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CAexB","sourcesContent":["import { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { css, html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\n@customElement('rtg-dialog-footer')\nexport class DialogFooter extends LitElement {\n static styles = [css``, TWStyles];\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',\n this.className\n )}\"\n >\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,40 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { cn } from '../../../helpers';
3
- import { TWStyles } from '../../../styles';
4
- import { css, html, LitElement } from 'lit';
5
- import { customElement, property } from 'lit/decorators.js';
6
- let DialogHeader = class DialogHeader extends LitElement {
7
- constructor() {
8
- super(...arguments);
9
- this._title = '';
10
- this.description = '';
11
- }
12
- render() {
13
- return html `
14
- <div
15
- class="${cn('flex flex-col space-y-1.5 text-center sm:text-left', this.className)}"
16
- >
17
- <h2
18
- class="${cn('text-lg font-semibold leading-none tracking-tight', this.className)}"
19
- >
20
- ${this._title}
21
- </h2>
22
- <p class="${cn('text-sm text-muted-foreground', this.className)}">
23
- ${this.description}
24
- </p>
25
- </div>
26
- `;
27
- }
28
- };
29
- DialogHeader.styles = [css ``, TWStyles];
30
- __decorate([
31
- property({ attribute: 'title', type: String })
32
- ], DialogHeader.prototype, "_title", void 0);
33
- __decorate([
34
- property({ type: String })
35
- ], DialogHeader.prototype, "description", void 0);
36
- DialogHeader = __decorate([
37
- customElement('rtg-dialog-header')
38
- ], DialogHeader);
39
- export { DialogHeader };
40
- //# sourceMappingURL=dialog-header.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-header.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-header.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGrD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAG2C,WAAM,GAAG,EAAE,CAAC;QAEhC,gBAAW,GAAG,EAAE,CAAC;IAwB/C,CAAC;IAtBC,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,oDAAoD,EACpD,IAAI,CAAC,SAAS,CACf;;;mBAGU,EAAE,CACT,mDAAmD,EACnD,IAAI,CAAC,SAAS,CACf;;YAEC,IAAI,CAAC,MAAM;;oBAEH,EAAE,CAAC,+BAA+B,EAAE,IAAI,CAAC,SAAS,CAAC;YAC3D,IAAI,CAAC,WAAW;;;KAGvB,CAAC;IACJ,CAAC;;AA3BM,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEc;IAA/C,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAa;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAkB;AALlC,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CA6BxB","sourcesContent":["import { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { css, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('rtg-dialog-header')\nexport class DialogHeader extends LitElement {\n static styles = [css``, TWStyles];\n\n @property({ attribute: 'title', type: String }) _title = '';\n\n @property({ type: String }) description = '';\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'flex flex-col space-y-1.5 text-center sm:text-left',\n this.className\n )}\"\n >\n <h2\n class=\"${cn(\n 'text-lg font-semibold leading-none tracking-tight',\n this.className\n )}\"\n >\n ${this._title}\n </h2>\n <p class=\"${cn('text-sm text-muted-foreground', this.className)}\">\n ${this.description}\n </p>\n </div>\n `;\n }\n}\n"]}
@@ -1,20 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { cn } from '../../../helpers';
3
- import { TWStyles } from '../../../styles';
4
- import { css, html, LitElement } from 'lit';
5
- import { customElement } from 'lit/decorators.js';
6
- let DialogOverlay = class DialogOverlay extends LitElement {
7
- render() {
8
- return html `
9
- <div
10
- class="${cn('fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', this.className)}"
11
- ></div>
12
- `;
13
- }
14
- };
15
- DialogOverlay.styles = [css ``, TWStyles];
16
- DialogOverlay = __decorate([
17
- customElement('rtg-dialog-overlay')
18
- ], DialogOverlay);
19
- export { DialogOverlay };
20
- //# sourceMappingURL=dialog-overly.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-overly.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-overly.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAY,MAAM,mBAAmB,CAAC;AAGrD,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAG3C,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,yJAAyJ,EACzJ,IAAI,CAAC,SAAS,CACf;;KAEJ,CAAC;IACJ,CAAC;;AAXM,oBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CAazB","sourcesContent":["import { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { css, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('rtg-dialog-overlay')\nexport class DialogOverlay extends LitElement {\n static styles = [css``, TWStyles];\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n this.className\n )}\"\n ></div>\n `;\n }\n}\n"]}
@@ -1,54 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { TWStyles } from '../../../styles';
3
- import { css, html, LitElement } from 'lit';
4
- import { customElement } from 'lit/decorators.js';
5
- import { Dialog } from './dialog.atom';
6
- const STATE_OPEN = 'open';
7
- const STATE_CLOSED = 'closed';
8
- let DialogTrigger = class DialogTrigger extends LitElement {
9
- constructor() {
10
- super(...arguments);
11
- this.handleClick = () => {
12
- const dialog = this._dialog;
13
- if (dialog) {
14
- dialog.dataset.state = STATE_OPEN;
15
- }
16
- };
17
- }
18
- get _dialog() {
19
- let parent = this.parentElement;
20
- while (parent) {
21
- if (parent instanceof Dialog) {
22
- return parent;
23
- }
24
- parent = parent.parentElement;
25
- }
26
- return parent;
27
- }
28
- firstUpdated(_changedProperties) {
29
- var _a, _b;
30
- super.firstUpdated(_changedProperties);
31
- const slots = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
32
- const assignedElements = slots === null || slots === void 0 ? void 0 : slots.assignedElements({ flatten: true });
33
- if (assignedElements && assignedElements.length > 0) {
34
- //@ts-ignore
35
- assignedElements[0].click = this.handleClick;
36
- }
37
- (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.addEventListener('click', e => {
38
- e.stopPropagation();
39
- });
40
- }
41
- render() {
42
- return html `
43
- <div>
44
- <slot></slot>
45
- </div>
46
- `;
47
- }
48
- };
49
- DialogTrigger.styles = [css ``, TWStyles];
50
- DialogTrigger = __decorate([
51
- customElement('rtg-dialog-trigger')
52
- ], DialogTrigger);
53
- export { DialogTrigger };
54
- //# sourceMappingURL=dialog-trigger.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-trigger.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-trigger.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAoB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAeL,gBAAW,GAAG,GAAG,EAAE;YACjB,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;YAC5B,IAAI,MAAM,EAAE,CAAC;gBACX,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,UAAU,CAAC;YACpC,CAAC;QACH,CAAC,CAAC;IAwBJ,CAAC;IAzCC,IAAY,OAAO;QACjB,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAEhC,OAAO,MAAM,EAAE,CAAC;YACd,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;gBAC7B,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAQS,YAAY,CACpB,kBAAqE;;QAErE,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,MAAM,CAAoB,CAAC;QACxE,MAAM,gBAAgB,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACpE,IAAI,gBAAgB,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpD,YAAY;YACZ,gBAAgB,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC;QAC/C,CAAC;QAED,MAAA,IAAI,CAAC,UAAU,0CAAE,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE;YAC7C,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AA1CM,oBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA4CzB","sourcesContent":["import { TWStyles } from '../../../styles';\nimport { css, html, LitElement, PropertyValueMap } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { Dialog } from './dialog.atom';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog-trigger')\nexport class DialogTrigger extends LitElement {\n static styles = [css``, TWStyles];\n\n private get _dialog(): Dialog | null {\n let parent = this.parentElement;\n\n while (parent) {\n if (parent instanceof Dialog) {\n return parent;\n }\n parent = parent.parentElement;\n }\n return parent;\n }\n\n handleClick = () => {\n const dialog = this._dialog;\n if (dialog) {\n dialog.dataset.state = STATE_OPEN;\n }\n };\n protected firstUpdated(\n _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>\n ): void {\n super.firstUpdated(_changedProperties);\n const slots = this.shadowRoot?.querySelector('slot') as HTMLSlotElement;\n const assignedElements = slots?.assignedElements({ flatten: true });\n if (assignedElements && assignedElements.length > 0) {\n //@ts-ignore\n assignedElements[0].click = this.handleClick;\n }\n\n this.shadowRoot?.addEventListener('click', e => {\n e.stopPropagation();\n });\n }\n\n render() {\n return html`\n <div>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,79 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { LitElement, html, css, nothing } from 'lit';
3
- import { customElement, property } from 'lit/decorators.js';
4
- import { TWStyles } from '../../../styles';
5
- import { DialogContent } from './dialog-content';
6
- const STATE_OPEN = 'open';
7
- const STATE_CLOSED = 'closed';
8
- let Dialog = class Dialog extends LitElement {
9
- constructor() {
10
- super(...arguments);
11
- this.state = STATE_CLOSED;
12
- }
13
- get _content() {
14
- var _a;
15
- const slot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
16
- const children = slot === null || slot === void 0 ? void 0 : slot.assignedElements();
17
- if (children) {
18
- for (let index = 0; index < children.length; index++) {
19
- if (children[index] instanceof DialogContent) {
20
- return children[index];
21
- }
22
- }
23
- }
24
- return null;
25
- }
26
- updated(_changedProperties) {
27
- super.updated(_changedProperties);
28
- const content = this._content;
29
- if (content) {
30
- content.dataset.state = this.state;
31
- }
32
- }
33
- render() {
34
- return html `
35
- <div rtgdlg-root>
36
- ${this.state === STATE_OPEN
37
- ? html ` <rtg-dialog-overlay></rtg-dialog-overlay>`
38
- : nothing}
39
- <slot></slot>
40
- </div>
41
- `;
42
- }
43
- };
44
- Dialog.styles = [css ``, TWStyles];
45
- __decorate([
46
- property({ attribute: 'data-state', type: String })
47
- ], Dialog.prototype, "state", void 0);
48
- Dialog = __decorate([
49
- customElement('rtg-dialog')
50
- ], Dialog);
51
- export { Dialog };
52
- // @customElement('rtg-dialog-title')
53
- // export class DialogTitle extends LitElement {
54
- // static styles = [css``, TWStyles];
55
- // render() {
56
- // return html`
57
- // <h2
58
- // class="${cn(
59
- // 'text-lg font-semibold leading-none tracking-tight',
60
- // this.className
61
- // )}"
62
- // >
63
- // <slot></slot>
64
- // </h2>
65
- // `;
66
- // }
67
- // }
68
- // @customElement('rtg-dialog-description')
69
- // export class DialogDescription extends LitElement {
70
- // static styles = [css``, TWStyles];
71
- // render() {
72
- // return html`
73
- // <p class="${cn('text-sm text-muted-foreground', this.className)}">
74
- // <slot></slot>
75
- // </p>
76
- // `;
77
- // }
78
- // }
79
- //# sourceMappingURL=dialog.atom.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog.atom.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAkB,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,UAAU;IAA/B;;QAGgD,UAAK,GAAG,YAAY,CAAC;IAkC5E,CAAC;IAhCC,IAAY,QAAQ;;QAClB,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,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,aAAa,EAAE,CAAC;oBAC7C,OAAO,QAAQ,CAAC,KAAK,CAAkB,CAAC;gBAC1C,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,KAAK,CAAC;QACrC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,KAAK,UAAU;YACzB,CAAC,CAAC,IAAI,CAAA,4CAA4C;YAClD,CAAC,CAAC,OAAO;;;KAGd,CAAC;IACJ,CAAC;;AAnCM,aAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEmB;IAApD,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAsB;AAH/D,MAAM;IADlB,aAAa,CAAC,YAAY,CAAC;GACf,MAAM,CAqClB;;AAED,qCAAqC;AACrC,gDAAgD;AAChD,uCAAuC;AAEvC,eAAe;AACf,mBAAmB;AACnB,YAAY;AACZ,uBAAuB;AACvB,iEAAiE;AACjE,2BAA2B;AAC3B,cAAc;AACd,UAAU;AACV,wBAAwB;AACxB,cAAc;AACd,SAAS;AACT,MAAM;AACN,IAAI;AAEJ,2CAA2C;AAC3C,sDAAsD;AACtD,uCAAuC;AAEvC,eAAe;AACf,mBAAmB;AACnB,2EAA2E;AAC3E,wBAAwB;AACxB,aAAa;AACb,SAAS;AACT,MAAM;AACN,IAAI","sourcesContent":["import { LitElement, html, css, nothing, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { TWStyles } from '../../../styles';\nimport { DialogContent } from './dialog-content';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog')\nexport class Dialog extends LitElement {\n static styles = [css``, TWStyles];\n\n @property({ attribute: 'data-state', type: String }) state = STATE_CLOSED;\n\n private get _content(): DialogContent | 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 DialogContent) {\n return children[index] as DialogContent;\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.state;\n }\n }\n\n render() {\n return html`\n <div rtgdlg-root>\n ${this.state === STATE_OPEN\n ? html` <rtg-dialog-overlay></rtg-dialog-overlay>`\n : nothing}\n <slot></slot>\n </div>\n `;\n }\n}\n\n// @customElement('rtg-dialog-title')\n// export class DialogTitle extends LitElement {\n// static styles = [css``, TWStyles];\n\n// render() {\n// return html`\n// <h2\n// class=\"${cn(\n// 'text-lg font-semibold leading-none tracking-tight',\n// this.className\n// )}\"\n// >\n// <slot></slot>\n// </h2>\n// `;\n// }\n// }\n\n// @customElement('rtg-dialog-description')\n// export class DialogDescription extends LitElement {\n// static styles = [css``, TWStyles];\n\n// render() {\n// return html`\n// <p class=\"${cn('text-sm text-muted-foreground', this.className)}\">\n// <slot></slot>\n// </p>\n// `;\n// }\n// }\n"]}
@@ -1,88 +0,0 @@
1
- import { html } from 'lit';
2
- import '../input/input.atom';
3
- import './dialog.atom';
4
- import './dialog-close';
5
- import './dialog-content';
6
- import './dialog-footer';
7
- import './dialog-header';
8
- import './dialog-overly';
9
- import './dialog-trigger';
10
- import '../input/input.atom';
11
- import '../button/button.atom';
12
- const meta = {
13
- component: 'components/dialog',
14
- };
15
- export default meta;
16
- export const ConfirmationDialog = {
17
- render: () => html `<div class="flex flex-nowrap">
18
- <div class="flex flex-wrap space-x-4 gap-5 mx-3">
19
- <rtg-dialog>
20
- <rtg-dialog-trigger>
21
- <rtg-button>Open Dialog</rtg-button>
22
- </rtg-dialog-trigger>
23
- <rtg-dialog-content>
24
- <rtg-dialog-header title="Are you absolutely sure?" description="This action cannot be undone. This will permanently delete your
25
- content.">
26
- <rtg-dialog-title>Are you absolutely sure?</rtg-dialog-title>
27
- <rtg-dialog-description>
28
- This action cannot be undone. This will permanently delete your
29
- content.</rtg-dialog-description
30
- >
31
- </rtg-dialog-header>
32
- <rtg-dialog-footer>
33
- <div class="flex w-full justify-between space-x-1">
34
- <rtg-dialog-close><rtg-button variant="secondary">Close</rtg-button></rtg-dialog-close>
35
- <div class="justify-end">
36
- <rtg-button variant="destructive">Delete</rtg-button>
37
- <rtg-button>Cancel</rtg-button>
38
- </div>
39
- </div>
40
- </rtg-dialog-content>
41
- </rtg-dialog>
42
- </div>
43
- </div>`,
44
- };
45
- export const ModalForm = {
46
- render: () => html `
47
- <rtg-dialog>
48
- <rtg-dialog-trigger>
49
- <rtg-button variant="outline">Edit Profile</rtg-button>
50
- </rtg-dialog-trigger>
51
- <rtg-dialog-content class="sm:max-w-[425px]">
52
- <rtg-dialog-header title="Edit Profile" description="Make changes to your profile here. Click save when you're done.">
53
- <!-- <rtg-dialog-title>Edit Profile</rtg-dialog-title>
54
- <rtg-dialog-description>
55
- Make changes to your profile here. Click save when you're done.</rtg-dialog-description
56
- > -->
57
- </rtg-dialog-header>
58
- <div class="grid gap-4 py-4">
59
- <div class="grid grid-cols-4 items-center gap-4">
60
- <rtg-label for="name" class="text-right">
61
- Name
62
- </rtg-label>
63
- <rtg-input
64
- id="name"
65
- defaultValue="Pedro Duarte"
66
- style="width:280px"
67
- >
68
- </rtg-input>
69
- </div>
70
- <div class="grid grid-cols-4 items-center gap-4">
71
- <rtg-label for="username" class="text-right">
72
- Username
73
- </rtg-label>
74
- <rtg-input
75
- id="username"
76
- defaultValue="@peduarte"
77
- style="width:280px"
78
- >
79
- </rtg-input>
80
- </div>
81
- </div>
82
- <rtg-dialog-footer>
83
- <rtg-button>Save changes</rtg-button>
84
- </rtg-dialog-content>
85
- </rtg-dialog>
86
- `,
87
- };
88
- //# sourceMappingURL=dialog.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog.stories.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,eAAe,CAAC;AACvB,OAAO,gBAAgB,CAAC;AACxB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,iBAAiB,CAAC;AACzB,OAAO,iBAAiB,CAAC;AACzB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,uBAAuB,CAAC;AAC/B,MAAM,IAAI,GAAS;IACjB,SAAS,EAAE,mBAAmB;CAC/B,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,MAAM,kBAAkB,GAAU;IACvC,MAAM,EAAE,GAAG,EAAE,CACX,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;SA0BC;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAwCf;CACJ,CAAC","sourcesContent":["import { html } from 'lit';\nimport { Meta, StoryObj } from '@storybook/web-components';\nimport '../input/input.atom';\nimport './dialog.atom';\nimport './dialog-close';\nimport './dialog-content';\nimport './dialog-footer';\nimport './dialog-header';\nimport './dialog-overly';\nimport './dialog-trigger';\nimport '../input/input.atom';\nimport '../button/button.atom';\nconst meta: Meta = {\n component: 'components/dialog',\n};\n\nexport default meta;\ntype Story = StoryObj;\n\nexport const ConfirmationDialog: Story = {\n render: () =>\n html`<div class=\"flex flex-nowrap\">\n <div class=\"flex flex-wrap space-x-4 gap-5 mx-3\">\n <rtg-dialog>\n <rtg-dialog-trigger>\n <rtg-button>Open Dialog</rtg-button>\n </rtg-dialog-trigger>\n <rtg-dialog-content>\n <rtg-dialog-header title=\"Are you absolutely sure?\" description=\"This action cannot be undone. This will permanently delete your\n content.\">\n <rtg-dialog-title>Are you absolutely sure?</rtg-dialog-title>\n <rtg-dialog-description>\n This action cannot be undone. This will permanently delete your\n content.</rtg-dialog-description\n >\n </rtg-dialog-header>\n <rtg-dialog-footer>\n <div class=\"flex w-full justify-between space-x-1\">\n <rtg-dialog-close><rtg-button variant=\"secondary\">Close</rtg-button></rtg-dialog-close>\n <div class=\"justify-end\">\n <rtg-button variant=\"destructive\">Delete</rtg-button>\n <rtg-button>Cancel</rtg-button>\n </div>\n </div>\n </rtg-dialog-content>\n </rtg-dialog>\n </div>\n </div>`,\n};\n\nexport const ModalForm: Story = {\n render: () => html`\n <rtg-dialog>\n <rtg-dialog-trigger>\n <rtg-button variant=\"outline\">Edit Profile</rtg-button>\n </rtg-dialog-trigger>\n <rtg-dialog-content class=\"sm:max-w-[425px]\">\n <rtg-dialog-header title=\"Edit Profile\" description=\"Make changes to your profile here. Click save when you're done.\">\n <!-- <rtg-dialog-title>Edit Profile</rtg-dialog-title>\n <rtg-dialog-description>\n Make changes to your profile here. Click save when you're done.</rtg-dialog-description\n > -->\n </rtg-dialog-header>\n <div class=\"grid gap-4 py-4\">\n <div class=\"grid grid-cols-4 items-center gap-4\">\n <rtg-label for=\"name\" class=\"text-right\">\n Name\n </rtg-label>\n <rtg-input\n id=\"name\"\n defaultValue=\"Pedro Duarte\"\n style=\"width:280px\"\n >\n </rtg-input>\n </div>\n <div class=\"grid grid-cols-4 items-center gap-4\">\n <rtg-label for=\"username\" class=\"text-right\">\n Username\n </rtg-label>\n <rtg-input\n id=\"username\"\n defaultValue=\"@peduarte\"\n style=\"width:280px\"\n >\n </rtg-input>\n </div>\n </div>\n <rtg-dialog-footer>\n <rtg-button>Save changes</rtg-button>\n </rtg-dialog-content>\n </rtg-dialog>\n `,\n};\n"]}
@@ -1,117 +0,0 @@
1
- var DropdownMenuCheckboxItem_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 DropdownMenuCheckboxItem = DropdownMenuCheckboxItem_1 = class DropdownMenuCheckboxItem extends LitElement {
8
- constructor() {
9
- super(...arguments);
10
- this._id = '';
11
- this._hidden = '';
12
- this.selected = false;
13
- this.checked = false;
14
- this.disabled = false;
15
- }
16
- get identifier() {
17
- var _a, _b;
18
- if (this._id !== '') {
19
- return this._id;
20
- }
21
- const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-group]');
22
- if (parent) {
23
- this._id = `${parent.getAttribute('id')}li${DropdownMenuCheckboxItem_1._counter++}`;
24
- }
25
- else {
26
- this._id = `rtgcmdrxgxli${DropdownMenuCheckboxItem_1._counter++}`;
27
- }
28
- return this._id;
29
- }
30
- get value() {
31
- var _a;
32
- return ((_a = this.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
33
- }
34
- handleMouseEvent(e) {
35
- if (e.type === 'mouseover' || e.type === 'focus') {
36
- this.selected = true;
37
- }
38
- if (e.type === 'mouseleave') {
39
- this.selected = false;
40
- }
41
- }
42
- toggleChecked() {
43
- this.checked = !this.checked;
44
- }
45
- render() {
46
- return html `
47
- <div
48
- 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)}"
49
- @click=${this.toggleChecked}
50
- @mouseover="${this.handleMouseEvent}"
51
- @mouseleave="${this.handleMouseEvent}"
52
- @focus="${this.handleMouseEvent}"
53
- rtgcmd-item
54
- role="option"
55
- aria-selected="${this.selected}"
56
- data-selected="${this.selected}"
57
- data-value="${this.value}"
58
- id="${this.identifier}"
59
- aria-hidden="${this.hidden}"
60
- >
61
- <span
62
- class="icon-space absolute left-2 flex items-center justify-center"
63
- >
64
- ${this.checked
65
- ? html `
66
- <svg
67
- xmlns="http://www.w3.org/2000/svg"
68
- viewBox="0 0 24 24"
69
- width="16px"
70
- height="16px"
71
- >
72
- <path
73
- d="M 19.28125 5.28125 L 9 15.5625 L 4.71875 11.28125 L 3.28125 12.71875 L 8.28125 17.71875 L 9 18.40625 L 9.71875 17.71875 L 20.71875 6.71875 Z"
74
- />
75
- </svg>
76
- `
77
- : nothing}
78
- </span>
79
- <slot></slot>
80
- </div>
81
- `;
82
- }
83
- };
84
- DropdownMenuCheckboxItem._counter = 0;
85
- DropdownMenuCheckboxItem.styles = [
86
- css `
87
- .icon-space {
88
- width: 16px; /* Fixed width to reserve space for the check icon */
89
- height: 16px;
90
- display: inline-block;
91
- }
92
- `,
93
- TWStyles,
94
- ];
95
- __decorate([
96
- property({ type: String })
97
- ], DropdownMenuCheckboxItem.prototype, "_id", void 0);
98
- __decorate([
99
- property({ attribute: 'aria-hidden', type: String })
100
- ], DropdownMenuCheckboxItem.prototype, "_hidden", void 0);
101
- __decorate([
102
- property({ attribute: 'data-value', type: String })
103
- ], DropdownMenuCheckboxItem.prototype, "value", null);
104
- __decorate([
105
- property({ type: Boolean })
106
- ], DropdownMenuCheckboxItem.prototype, "selected", void 0);
107
- __decorate([
108
- property({ type: Boolean })
109
- ], DropdownMenuCheckboxItem.prototype, "checked", void 0);
110
- __decorate([
111
- property({ type: Boolean })
112
- ], DropdownMenuCheckboxItem.prototype, "disabled", void 0);
113
- DropdownMenuCheckboxItem = DropdownMenuCheckboxItem_1 = __decorate([
114
- customElement('rtg-dropdown-menu-checkbox-item')
115
- ], DropdownMenuCheckboxItem);
116
- export { DropdownMenuCheckboxItem };
117
- //# sourceMappingURL=dropdown-menu-checkbox-Item.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-menu-checkbox-Item.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.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,wBAAwB,gCAA9B,MAAM,wBAAyB,SAAQ,UAAU;IAAjD;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;QAoCtC,aAAQ,GAAG,KAAK,CAAC;QAWjB,YAAO,GAAG,KAAK,CAAC;QAChB,aAAQ,GAAG,KAAK,CAAC;IAgDhD,CAAC;IAjFC,IAAY,UAAU;;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,MAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,UAAU,0CAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC;QACrE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAC/B,IAAI,CACL,KAAK,0BAAwB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC9C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,eAAe,0BAAwB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAClE,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAGD,IAAW,KAAK;;QACd,OAAO,CAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,IAAI,EAAE,KAAI,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;IAKD,aAAa;QACX,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,gKAAgK,EAChK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,EACrD,IAAI,CAAC,SAAS,CACf;iBACQ,IAAI,CAAC,aAAa;sBACb,IAAI,CAAC,gBAAgB;uBACpB,IAAI,CAAC,gBAAgB;kBAC1B,IAAI,CAAC,gBAAgB;;;yBAGd,IAAI,CAAC,QAAQ;yBACb,IAAI,CAAC,QAAQ;sBAChB,IAAI,CAAC,KAAK;cAClB,IAAI,CAAC,UAAU;uBACN,IAAI,CAAC,MAAM;;;;;YAKtB,IAAI,CAAC,OAAO;YACZ,CAAC,CAAC,IAAI,CAAA;;;;;;;;;;;eAWH;YACH,CAAC,CAAC,OAAO;;;;KAIhB,CAAC;IACJ,CAAC;;AA7Fc,iCAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,+BAAM,GAAG;IACd,GAAG,CAAA;;;;;;KAMF;IACD,QAAQ;CACT,AATY,CASX;AAf0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAAc;AAgCnE;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAGnD;AAE4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DAAkB;AAWjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yDAAiB;AAChB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DAAkB;AAnDnC,wBAAwB;IADpC,aAAa,CAAC,iCAAiC,CAAC;GACpC,wBAAwB,CAmGpC","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-checkbox-item')\nexport class DropdownMenuCheckboxItem 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${DropdownMenuCheckboxItem._counter++}`;\n } else {\n this._id = `rtgcmdrxgxli${DropdownMenuCheckboxItem._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;\n @property({ type: Boolean }) disabled = false;\n\n toggleChecked() {\n this.checked = !this.checked;\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 viewBox=\"0 0 24 24\"\n width=\"16px\"\n height=\"16px\"\n >\n <path\n d=\"M 19.28125 5.28125 L 9 15.5625 L 4.71875 11.28125 L 3.28125 12.71875 L 8.28125 17.71875 L 9 18.40625 L 9.71875 17.71875 L 20.71875 6.71875 Z\"\n />\n </svg>\n `\n : nothing}\n </span>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}