@dubai-design-system/components-js 3.12.3 → 3.12.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (176) hide show
  1. package/dist/cjs/dda-attach-file.cjs.entry.js +5 -2
  2. package/dist/cjs/dda-attach-file.cjs.entry.js.map +1 -1
  3. package/dist/cjs/dda-header-menu_3.cjs.entry.js +6 -2
  4. package/dist/cjs/dda-header-menu_3.cjs.entry.js.map +1 -1
  5. package/dist/cjs/dda-header.cjs.entry.js +21 -9
  6. package/dist/cjs/dda-header.cjs.entry.js.map +1 -1
  7. package/dist/cjs/dda-horizontal-stepper.cjs.entry.js +1 -1
  8. package/dist/cjs/dda-segmented-tabs.cjs.entry.js +1 -1
  9. package/dist/cjs/dda-select.cjs.entry.js +2 -2
  10. package/dist/cjs/dda-select.cjs.entry.js.map +1 -1
  11. package/dist/cjs/dda-split-button.cjs.entry.js +56 -0
  12. package/dist/cjs/dda-split-button.cjs.entry.js.map +1 -0
  13. package/dist/cjs/dda-sticky-footer.cjs.entry.js +1 -1
  14. package/dist/cjs/dda-tabs.cjs.entry.js +1 -1
  15. package/dist/cjs/dda-textarea.cjs.entry.js +1 -1
  16. package/dist/cjs/dda-toggle.cjs.entry.js +2 -2
  17. package/dist/cjs/dda-tooltip.cjs.entry.js +1 -1
  18. package/dist/cjs/dda-vertical-stepper.cjs.entry.js +1 -1
  19. package/dist/cjs/dda.cjs.js +1 -1
  20. package/dist/cjs/loader.cjs.js +1 -1
  21. package/dist/collection/assets/img/Team-Section-Card-1.svg +9 -9
  22. package/dist/collection/assets/img/icn/icn-Config.svg +9 -9
  23. package/dist/collection/assets/img/icn/icn-card-facebook.svg +11 -11
  24. package/dist/collection/assets/img/icn/icn-card-linkdin.svg +4 -4
  25. package/dist/collection/assets/img/icn/icn-card-telegram.svg +11 -11
  26. package/dist/collection/assets/img/icn/icn-card-twitter-x.svg +10 -10
  27. package/dist/collection/collection-manifest.json +1 -0
  28. package/dist/collection/components/dda-attach-file/dda-attach-file.js +24 -2
  29. package/dist/collection/components/dda-attach-file/dda-attach-file.js.map +1 -1
  30. package/dist/collection/components/dda-attach-file/dda-attach-file.stories.js +3 -0
  31. package/dist/collection/components/dda-attach-file/dda-attach-file.stories.js.map +1 -1
  32. package/dist/collection/components/dda-header/dda-header-main.css +1 -0
  33. package/dist/collection/components/dda-header/dda-header.js +20 -8
  34. package/dist/collection/components/dda-header/dda-header.js.map +1 -1
  35. package/dist/collection/components/dda-header/dda-header.stories.js +3 -3
  36. package/dist/collection/components/dda-header/dda-header.stories.js.map +1 -1
  37. package/dist/collection/components/dda-header-menu/dda-header-menu.js +7 -3
  38. package/dist/collection/components/dda-header-menu/dda-header-menu.js.map +1 -1
  39. package/dist/collection/components/dda-header-menu/dda-header-menu.stories.js +1 -1
  40. package/dist/collection/components/dda-header-menu/dda-header-menu.stories.js.map +1 -1
  41. package/dist/collection/components/dda-select/dda-select.js +2 -2
  42. package/dist/collection/components/dda-select/dda-select.js.map +1 -1
  43. package/dist/collection/components/dda-select/dda-select.stories.js +4 -3
  44. package/dist/collection/components/dda-select/dda-select.stories.js.map +1 -1
  45. package/dist/collection/components/dda-slider/dda-slider.js +1 -1
  46. package/dist/collection/components/dda-split-button/dda-split-button.css +607 -0
  47. package/dist/collection/components/dda-split-button/dda-split-button.js +395 -0
  48. package/dist/collection/components/dda-split-button/dda-split-button.js.map +1 -0
  49. package/dist/collection/components/dda-split-button/dda-split-button.stories.js +125 -0
  50. package/dist/collection/components/dda-split-button/dda-split-button.stories.js.map +1 -0
  51. package/dist/collection/components/dda-sticky-footer/dda-sticky-footer.js +1 -1
  52. package/dist/collection/components/dda-tabs/dda-tabs.js +1 -1
  53. package/dist/collection/components/dda-textarea/dda-textarea.js +1 -1
  54. package/dist/collection/components/dda-toggle/dda-toggle.js +2 -2
  55. package/dist/collection/components/dda-tooltip/dda-tooltip.js +1 -1
  56. package/dist/collection/components/segmented-groups/dda-segmented-tabs/dda-segmented-tabs.js +1 -1
  57. package/dist/collection/components/stepper/dda-horizontal-stepper/dda-horizontal-stepper.js +1 -1
  58. package/dist/collection/components/stepper/dda-vertical-stepper/dda-vertical-stepper.js +1 -1
  59. package/dist/components/dda-attach-file.js +6 -2
  60. package/dist/components/dda-attach-file.js.map +1 -1
  61. package/dist/components/dda-header-menu.js +1 -1
  62. package/dist/components/dda-header.js +23 -11
  63. package/dist/components/dda-header.js.map +1 -1
  64. package/dist/components/dda-horizontal-stepper.js +1 -1
  65. package/dist/components/dda-segmented-tabs.js +1 -1
  66. package/dist/components/dda-select.js +2 -2
  67. package/dist/components/dda-select.js.map +1 -1
  68. package/dist/components/dda-split-button.d.ts +11 -0
  69. package/dist/components/dda-split-button.js +87 -0
  70. package/dist/components/dda-split-button.js.map +1 -0
  71. package/dist/components/dda-sticky-footer.js +2 -2
  72. package/dist/components/dda-tabs.js +1 -1
  73. package/dist/components/dda-textarea.js +1 -1
  74. package/dist/components/dda-toggle.js +2 -2
  75. package/dist/components/dda-tooltip.js +1 -1
  76. package/dist/components/dda-vertical-stepper.js +1 -1
  77. package/dist/components/{p-e5df7bea.js → p-426c4cde.js} +2 -2
  78. package/dist/components/{p-e5df7bea.js.map → p-426c4cde.js.map} +1 -1
  79. package/dist/components/{p-f0f752d2.js → p-857c1ac9.js} +7 -3
  80. package/dist/components/p-857c1ac9.js.map +1 -0
  81. package/dist/dda/dda.esm.js +1 -1
  82. package/dist/dda/dda.esm.js.map +1 -1
  83. package/dist/dda/{p-1cf47f82.entry.js → p-11b79158.entry.js} +2 -2
  84. package/dist/dda/p-1fa27da3.entry.js +2 -0
  85. package/dist/dda/p-1fa27da3.entry.js.map +1 -0
  86. package/dist/dda/{p-210d62fb.entry.js → p-24da4601.entry.js} +2 -2
  87. package/dist/dda/p-24da4601.entry.js.map +1 -0
  88. package/dist/dda/p-2525597b.entry.js +2 -0
  89. package/dist/dda/p-2525597b.entry.js.map +1 -0
  90. package/dist/dda/{p-6907700e.entry.js → p-27c798b5.entry.js} +2 -2
  91. package/dist/dda/{p-bdaee99c.entry.js → p-4a2eeccb.entry.js} +2 -2
  92. package/dist/dda/{p-448d72f4.entry.js → p-5c5aeda7.entry.js} +2 -2
  93. package/dist/dda/p-5c5aeda7.entry.js.map +1 -0
  94. package/dist/dda/{p-3e36c414.entry.js → p-78b3487b.entry.js} +2 -2
  95. package/dist/dda/p-9c090bc6.entry.js +2 -0
  96. package/dist/dda/p-9c090bc6.entry.js.map +1 -0
  97. package/{www/build/p-f60d6c1f.entry.js → dist/dda/p-af2345fb.entry.js} +2 -2
  98. package/dist/dda/{p-a42f8db6.entry.js → p-b0185c4d.entry.js} +2 -2
  99. package/dist/dda/{p-e5783b18.entry.js → p-ca2e33b9.entry.js} +2 -2
  100. package/dist/dda/{p-90c3c3b3.entry.js → p-ca50cf49.entry.js} +2 -2
  101. package/dist/esm/dda-attach-file.entry.js +5 -2
  102. package/dist/esm/dda-attach-file.entry.js.map +1 -1
  103. package/dist/esm/dda-header-menu_3.entry.js +6 -2
  104. package/dist/esm/dda-header-menu_3.entry.js.map +1 -1
  105. package/dist/esm/dda-header.entry.js +21 -9
  106. package/dist/esm/dda-header.entry.js.map +1 -1
  107. package/dist/esm/dda-horizontal-stepper.entry.js +1 -1
  108. package/dist/esm/dda-segmented-tabs.entry.js +1 -1
  109. package/dist/esm/dda-select.entry.js +2 -2
  110. package/dist/esm/dda-select.entry.js.map +1 -1
  111. package/dist/esm/dda-split-button.entry.js +52 -0
  112. package/dist/esm/dda-split-button.entry.js.map +1 -0
  113. package/dist/esm/dda-sticky-footer.entry.js +1 -1
  114. package/dist/esm/dda-tabs.entry.js +1 -1
  115. package/dist/esm/dda-textarea.entry.js +1 -1
  116. package/dist/esm/dda-toggle.entry.js +2 -2
  117. package/dist/esm/dda-tooltip.entry.js +1 -1
  118. package/dist/esm/dda-vertical-stepper.entry.js +1 -1
  119. package/dist/esm/dda.js +1 -1
  120. package/dist/esm/loader.js +1 -1
  121. package/dist/types/components/dda-attach-file/dda-attach-file.d.ts +1 -0
  122. package/dist/types/components/dda-attach-file/dda-attach-file.stories.d.ts +4 -0
  123. package/dist/types/components/dda-split-button/dda-split-button.d.ts +27 -0
  124. package/dist/types/components/dda-split-button/dda-split-button.stories.d.ts +77 -0
  125. package/dist/types/components.d.ts +79 -16
  126. package/package.json +2 -2
  127. package/readme.md +11 -0
  128. package/www/build/dda.esm.js +1 -1
  129. package/www/build/dda.esm.js.map +1 -1
  130. package/www/build/{p-1cf47f82.entry.js → p-11b79158.entry.js} +2 -2
  131. package/www/build/p-1fa27da3.entry.js +2 -0
  132. package/www/build/p-1fa27da3.entry.js.map +1 -0
  133. package/www/build/{p-210d62fb.entry.js → p-24da4601.entry.js} +2 -2
  134. package/www/build/p-24da4601.entry.js.map +1 -0
  135. package/www/build/p-2525597b.entry.js +2 -0
  136. package/www/build/p-2525597b.entry.js.map +1 -0
  137. package/www/build/{p-6907700e.entry.js → p-27c798b5.entry.js} +2 -2
  138. package/www/build/{p-bdaee99c.entry.js → p-4a2eeccb.entry.js} +2 -2
  139. package/www/build/{p-448d72f4.entry.js → p-5c5aeda7.entry.js} +2 -2
  140. package/www/build/p-5c5aeda7.entry.js.map +1 -0
  141. package/www/build/{p-3e36c414.entry.js → p-78b3487b.entry.js} +2 -2
  142. package/www/build/p-9c090bc6.entry.js +2 -0
  143. package/www/build/p-9c090bc6.entry.js.map +1 -0
  144. package/{dist/dda/p-f60d6c1f.entry.js → www/build/p-af2345fb.entry.js} +2 -2
  145. package/www/build/{p-a42f8db6.entry.js → p-b0185c4d.entry.js} +2 -2
  146. package/www/build/{p-e5783b18.entry.js → p-ca2e33b9.entry.js} +2 -2
  147. package/www/build/{p-90c3c3b3.entry.js → p-ca50cf49.entry.js} +2 -2
  148. package/dist/components/p-f0f752d2.js.map +0 -1
  149. package/dist/dda/p-210d62fb.entry.js.map +0 -1
  150. package/dist/dda/p-448d72f4.entry.js.map +0 -1
  151. package/dist/dda/p-a9da1c36.entry.js +0 -2
  152. package/dist/dda/p-a9da1c36.entry.js.map +0 -1
  153. package/dist/dda/p-ce9b7aeb.entry.js +0 -2
  154. package/dist/dda/p-ce9b7aeb.entry.js.map +0 -1
  155. package/www/build/p-210d62fb.entry.js.map +0 -1
  156. package/www/build/p-448d72f4.entry.js.map +0 -1
  157. package/www/build/p-a9da1c36.entry.js +0 -2
  158. package/www/build/p-a9da1c36.entry.js.map +0 -1
  159. package/www/build/p-ce9b7aeb.entry.js +0 -2
  160. package/www/build/p-ce9b7aeb.entry.js.map +0 -1
  161. /package/dist/dda/{p-1cf47f82.entry.js.map → p-11b79158.entry.js.map} +0 -0
  162. /package/dist/dda/{p-6907700e.entry.js.map → p-27c798b5.entry.js.map} +0 -0
  163. /package/dist/dda/{p-bdaee99c.entry.js.map → p-4a2eeccb.entry.js.map} +0 -0
  164. /package/dist/dda/{p-3e36c414.entry.js.map → p-78b3487b.entry.js.map} +0 -0
  165. /package/dist/dda/{p-f60d6c1f.entry.js.map → p-af2345fb.entry.js.map} +0 -0
  166. /package/dist/dda/{p-a42f8db6.entry.js.map → p-b0185c4d.entry.js.map} +0 -0
  167. /package/dist/dda/{p-e5783b18.entry.js.map → p-ca2e33b9.entry.js.map} +0 -0
  168. /package/dist/dda/{p-90c3c3b3.entry.js.map → p-ca50cf49.entry.js.map} +0 -0
  169. /package/www/build/{p-1cf47f82.entry.js.map → p-11b79158.entry.js.map} +0 -0
  170. /package/www/build/{p-6907700e.entry.js.map → p-27c798b5.entry.js.map} +0 -0
  171. /package/www/build/{p-bdaee99c.entry.js.map → p-4a2eeccb.entry.js.map} +0 -0
  172. /package/www/build/{p-3e36c414.entry.js.map → p-78b3487b.entry.js.map} +0 -0
  173. /package/www/build/{p-f60d6c1f.entry.js.map → p-af2345fb.entry.js.map} +0 -0
  174. /package/www/build/{p-a42f8db6.entry.js.map → p-b0185c4d.entry.js.map} +0 -0
  175. /package/www/build/{p-e5783b18.entry.js.map → p-ca2e33b9.entry.js.map} +0 -0
  176. /package/www/build/{p-90c3c3b3.entry.js.map → p-ca50cf49.entry.js.map} +0 -0
@@ -88,14 +88,18 @@ export class DdaHeaderMenu {
88
88
  href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, onClick: () => this.useNavigator == "true" ? this.navigatorClick.emit(item.url) : "" }, this.showQuickLinksIcon ? (h("span", { class: "dda-mega-menu-icon", "aria-hidden": "true" }, h("i", { class: "material-icons material-symbols-outlined" }, item.quickLinksIcon ? item.quickLinksIcon : "sentiment_satisfied"))) : "", h("span", { class: "text-wrap" }, h("span", { class: "dda-mega-menu-text" }, item.headerMenuLabel), item.description && (h("span", { class: "dda-mega-menu-desc" }, item.description))))))))))))))));
89
89
  }
90
90
  render() {
91
- return (h(Host, { key: '29e85895138a63049930f62c93c2a15aab22c0cf' }, h("nav", { key: 'd48d5f933456c1c3d030bfb14aa6033b38afd895', "aria-label": "Main navigation", class: "dda-header-menu" }, h("ul", { key: '9cd8056b970d196de3ca1dc58db8dbf34f009033', class: "dda-mega-menu" }, this.parsedMenuItems.map((item, index) => {
91
+ return (h(Host, { key: '7e41be72169fa2897048141d19c1e2bf103ed9c6' }, h("nav", { key: '4c2d25193433e9aea37e8ec8f1417198a56e1d39', "aria-label": "Main navigation", class: "dda-header-menu" }, h("ul", { key: 'c806f126eb949d8d64171a99f014777d9bf3478e', class: "dda-mega-menu" }, this.parsedMenuItems.map((item, index) => {
92
92
  const isOpen = this.openIndex === index;
93
93
  const hasSubmenu = item.children && item.children.length > 0;
94
94
  const submenuId = `submenu-${index}`;
95
95
  const type = item.type;
96
96
  return (h("li", { key: `top-${index}` }, h("a", {
97
97
  // href={item.url}
98
- href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, "aria-haspopup": hasSubmenu ? 'true' : undefined, "aria-expanded": hasSubmenu ? String(isOpen) : undefined, "aria-controls": hasSubmenu ? submenuId : undefined, class: isOpen ? 'active' : '', onClick: e => this.handleToggle(index, hasSubmenu, e, item)
98
+ href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, "aria-haspopup": hasSubmenu ? 'true' : undefined, "aria-expanded": hasSubmenu ? String(isOpen) : undefined, "aria-controls": hasSubmenu ? submenuId : undefined,
99
+ // class={isOpen ? 'active' : ''}
100
+ class: {
101
+ 'active': item.active === 'true' || isOpen, // from props OR open state
102
+ }, onClick: e => this.handleToggle(index, hasSubmenu, e, item)
99
103
  }, item.headerMenuLabel), hasSubmenu && type === 'dda_default_submenu' &&
100
104
  this.renderDefaultSubmenu(item.children, isOpen, submenuId, item.headerMenuLabel), hasSubmenu && type === 'dda_main_megamenu' &&
101
105
  this.renderMegaMenu(item.children, isOpen, submenuId, item.headerMenuLabel)));
@@ -157,7 +161,7 @@ export class DdaHeaderMenu {
157
161
  "type": "string",
158
162
  "mutable": false,
159
163
  "complexType": {
160
- "original": "string | Array<{\r\n headerMenuLabel: string;\r\n headerMenuId: string;\r\n description: string;\r\n url: string;\r\n quickLinksIcon: string;\r\n type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n children?: any;\r\n}>",
164
+ "original": "string | Array<{\r\n headerMenuLabel: string;\r\n headerMenuId: string;\r\n description: string;\r\n url: string;\r\n quickLinksIcon: string;\r\n type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n children?: any;\r\n }>",
161
165
  "resolved": "string | { headerMenuLabel: string; headerMenuId: string; description: string; url: string; quickLinksIcon: string; type?: \"dda_default_submenu\" | \"dda_main_megamenu\"; children?: any; }[]",
162
166
  "references": {
163
167
  "Array": {
@@ -1 +1 @@
1
- {"version":3,"file":"dda-header-menu.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAOtG,MAAM,OAAO,aAAa;IAL1B;QAUU,iBAAY,GAAqB,OAAO,CAAC;QAC3C,eAAU,GAQb,EAAE,CAAC;QAAW,cAAS,GAAkB,IAAI,CAAC;QACxC,iBAAY,GAAkB,IAAI,CAAC;QA2B5C,uBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YACzC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;YAC3C,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;gBAC9B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;gBACtB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YAC3B,CAAC;QACH,CAAC,CAAC;KAiMH;IAhOC,IAAI,eAAe;QACjB,IAAI,OAAO,IAAI,CAAC,UAAU,KAAK,QAAQ,EAAE,CAAC;YACxC,IAAI,CAAC;gBACH,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACrC,CAAC;YAAC,WAAM,CAAC;gBACP,OAAO,CAAC,IAAI,CAAC,4BAA4B,CAAC,CAAC;gBAC3C,OAAO,EAAE,CAAC;YACZ,CAAC;QACH,CAAC;QACD,OAAO,IAAI,CAAC,UAAU,CAAC;IACzB,CAAC;IAED,YAAY,CAAC,KAAa,EAAE,UAAmB,EAAE,KAAY,EAAE,IAAS;QACtE,IAAI,UAAU,EAAE,CAAC;YACf,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;YACzD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAC3B,CAAC;aAAI,CAAC;YACJ,IAAG,IAAI,CAAC,YAAY,IAAI,MAAM,EAAC,CAAC;gBAE9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;YACpC,CAAC;QACH,CAAC;IACH,CAAC;IAUD,iBAAiB;QACf,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;IACjE,CAAC;IAGD,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAC3B,CAAC;IACH,CAAC;IAED,oBAAoB,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe;QAC/D,OAAO,CACL,WACE,KAAK,EAAE;gBACL,qBAAqB,EAAE,IAAI;gBAC3B,YAAY,EAAE,MAAM;aACrB,EACD,EAAE,EAAE,SAAS,gBACD,GAAG,eAAe,UAAU;YAExC,cACG,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE;gBAC/B,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;gBAChE,MAAM,YAAY,GAAG,cAAc,SAAS,IAAI,QAAQ,EAAE,CAAC;gBAC3D,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,KAAK,QAAQ,CAAC;gBAEjD,OAAO,CACL;oBAGE,SACE,IAAI,EAAE,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EACnE,EAAE,EAAE,IAAI,CAAC,YAAY,mBACN,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBAClC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,mBAC7C,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EACvD,KAAK,EAAE;4BACL,aAAa,EAAE,aAAa;4BAC5B,QAAQ,EAAE,SAAS;yBACpB,EACD,OAAO,EAAE,CAAC,CAAC,EAAE;4BACX,IAAI,aAAa,EAAE,CAAC;gCAClB,CAAC,CAAC,cAAc,EAAE,CAAC;gCACnB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;4BACvE,CAAC;iCAAI,CAAC;gCACJ,IAAG,IAAI,CAAC,YAAY,IAAI,MAAM,EAAC,CAAC;oCAE9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;gCACpC,CAAC;4BACH,CAAC;wBACH,CAAC,IAEA,IAAI,CAAC,eAAe,CACnB;oBAEH,aAAa,IAAI,CAChB,WACE,KAAK,EAAE;4BACL,wBAAwB,EAAE,IAAI;4BAC9B,YAAY,EAAE,SAAS;yBACxB,EACD,EAAE,EAAE,YAAY,gBACJ,GAAG,IAAI,CAAC,eAAe,cAAc;wBAEjD,WAAK,KAAK,EAAC,gCAAgC;4BACzC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,eAAe,CAAQ;4BACzF,cACG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,YAAY,EAAE,EAAE,CAAC,CAC5C;gCACE;oCACE,qBAAqB;oCACrB,IAAI,EAAE,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,EACtE,EAAE,EAAE,GAAG,YAAY,IAAI,YAAY,EAAE,EACrC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,IAEtF,OAAO,CAAC,eAAe,CACtB,CACD,CACN,CAAC,CACC,CACD,CACF,CACP,CACE,CACN,CAAC;YACJ,CAAC,CAAC,CACC,CACD,CACP,CAAC;IACJ,CAAC;IAED,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe;QACzD,OAAO,CACL,WACE,KAAK,EAAE;gBACL,mBAAmB,EAAE,IAAI;gBACzB,YAAY,EAAE,MAAM;aACrB,EACD,EAAE,EAAE,SAAS,gBACD,GAAG,eAAe,YAAY;YAE1C,WAAK,KAAK,EAAC,mBAAmB;gBAC5B,WAAK,KAAK,EAAC,sBAAsB;oBAC/B,WAAK,KAAK,EAAC,SAAS,IACjB,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,CAAC,CAC/B,WAAK,KAAK,EAAC,cAAc,EAAC,GAAG,EAAE,OAAO,QAAQ,EAAE;wBAC7C,GAAG,CAAC,KAAK,IAAI,wBAAgB,GAAG,GAAG,CAAC,KAAK,UAAU,EAAE,KAAK,EAAC,oBAAoB,IAAE,GAAG,CAAC,KAAK,CAAM;wBACjG,cACG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,CAClC,UAAI,GAAG,EAAE,QAAQ,SAAS,EAAE;4BAE1B,SACE,KAAK,EAAC,oBAAoB;gCAC1B,kBAAkB;gCAClB,IAAI,EAAE,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EACnE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,IAAI,MAAM,CAAA,CAAC,CAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA,EAAE;gCAElF,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,CACzB,YAAM,KAAK,EAAC,oBAAoB,iBAAa,MAAM;oCACjD,SAAG,KAAK,EAAC,0CAA0C,IAChD,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,qBAAqB,CAChE,CACC,CACR,CAAC,CAAC,CAAC,EAAE;gCACN,YAAM,KAAK,EAAC,WAAW;oCACrB,YAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,eAAe,CAAQ;oCAC7D,IAAI,CAAC,WAAW,IAAI,CACnB,YAAM,KAAK,EAAC,oBAAoB,IAC7B,IAAI,CAAC,WAAW,CACZ,CACR,CACI,CACL,CACD,CACN,CAAC,CACC,CACD,CACP,CAAC,CACE,CACF,CACF,CACF,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,0EAAgB,iBAAiB,EAAC,KAAK,EAAC,iBAAiB;gBACvD,2DAAI,KAAK,EAAC,eAAe,IACtB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;oBACxC,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,KAAK,KAAK,CAAC;oBACxC,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;oBAC7D,MAAM,SAAS,GAAG,WAAW,KAAK,EAAE,CAAC;oBACrC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;oBAEvB,OAAO,CACL,UAAI,GAAG,EAAE,OAAO,KAAK,EAAE;wBAErB;4BACE,kBAAkB;4BAClB,IAAI,EAAE,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,mBACpD,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBAC/B,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,mBACvC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAEjD,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAC7B,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC,EAAE,IAAI,CAAC,IAE1D,IAAI,CAAC,eAAe,CACnB;wBAEH,UAAU,IAAI,IAAI,KAAK,qBAAqB;4BAC3C,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;wBAElF,UAAU,IAAI,IAAI,KAAK,mBAAmB;4BACzC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAC1E,CACN,CAAC;gBACJ,CAAC,CAAC,CACC,CACD,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State, Element, Listen, EventEmitter, Event } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-header-menu',\r\n styleUrls: ['dda-header-menu.css'],\r\n shadow: false,\r\n})\r\nexport class DdaHeaderMenu {\r\n @Element() el: HTMLElement;\r\n \r\n @Event() navigatorClick?: EventEmitter<string>;\r\n @Prop() showQuickLinksIcon: boolean;\r\n @Prop() useNavigator: 'true' | 'false' = 'false';\r\n@Prop() quickLinks: string | Array<{\r\n headerMenuLabel: string;\r\n headerMenuId: string;\r\n description: string;\r\n url: string;\r\n quickLinksIcon: string;\r\n type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n children?: any;\r\n}> = []; @State() openIndex: number | null = null;\r\n @State() openSubIndex: number | null = null;\r\n\r\n get parsedMenuItems() {\r\n if (typeof this.quickLinks === 'string') {\r\n try {\r\n return JSON.parse(this.quickLinks);\r\n } catch {\r\n console.warn('Invalid JSON in quickLinks');\r\n return [];\r\n }\r\n }\r\n return this.quickLinks;\r\n }\r\n\r\n handleToggle(index: number, hasSubmenu: boolean, event: Event, item: any) {\r\n if (hasSubmenu) {\r\n event.preventDefault();\r\n this.openIndex = this.openIndex === index ? null : index;\r\n this.openSubIndex = null;\r\n }else{\r\n if(this.useNavigator == \"true\"){\r\n\r\n this.navigatorClick.emit(item.url)\r\n }\r\n }\r\n }\r\n\r\n handleClickOutside = (event: MouseEvent) => {\r\n const target = event.target as HTMLElement;\r\n if (!this.el.contains(target)) {\r\n this.openIndex = null;\r\n this.openSubIndex = null;\r\n }\r\n };\r\n\r\n connectedCallback() {\r\n document.addEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n @Listen('keydown', { target: 'window' })\r\n handleKeydown(event: KeyboardEvent) {\r\n if (event.key === 'Escape') {\r\n this.openIndex = null;\r\n this.openSubIndex = null;\r\n }\r\n }\r\n\r\n renderDefaultSubmenu(children, isOpen, submenuId, headerMenuLabel) {\r\n return (\r\n <div\r\n class={{\r\n 'dda-default-submenu': true,\r\n 'is-visible': isOpen,\r\n }}\r\n id={submenuId}\r\n aria-label={`${headerMenuLabel} Submenu`}\r\n >\r\n <ul>\r\n {children.map((item, subIndex) => {\r\n const hasSubSubmenu = item.children && item.children.length > 0;\r\n const subSubmenuId = `subsubmenu-${submenuId}-${subIndex}`;\r\n const isSubOpen = this.openSubIndex === subIndex;\r\n\r\n return (\r\n <li>\r\n \r\n\r\n <a\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n id={item.headerMenuId}\r\n aria-haspopup={hasSubSubmenu ? 'true' : undefined}\r\n aria-expanded={hasSubSubmenu ? String(isSubOpen) : undefined}\r\n aria-controls={hasSubSubmenu ? subSubmenuId : undefined}\r\n class={{\r\n 'has-submenu': hasSubSubmenu,\r\n 'active': isSubOpen,\r\n }}\r\n onClick={e => {\r\n if (hasSubSubmenu) {\r\n e.preventDefault();\r\n this.openSubIndex = this.openSubIndex === subIndex ? null : subIndex;\r\n }else{\r\n if(this.useNavigator == \"true\"){\r\n\r\n this.navigatorClick.emit(item.url)\r\n }\r\n }\r\n }}\r\n >\r\n {item.headerMenuLabel}\r\n </a>\r\n\r\n {hasSubSubmenu && (\r\n <div\r\n class={{\r\n 'dda-default-subsubmenu': true,\r\n 'is-visible': isSubOpen,\r\n }}\r\n id={subSubmenuId}\r\n aria-label={`${item.headerMenuLabel} Sub Submenu`}\r\n >\r\n <div class=\"dda-default-subsubmenu-content\">\r\n <span class=\"dda-submenu-title\">{item.defaultSubMenuTitle || item.headerMenuLabel}</span>\r\n <ul>\r\n {item.children.map((subItem, subItemIndex) => (\r\n <li>\r\n <a\r\n // href={subItem.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : subItem.url}\r\n id={`${subSubmenuId}-${subItemIndex}`}\r\n onClick={() => this.useNavigator == \"true\" ? this.navigatorClick.emit(subItem.url) : \"\"}\r\n >\r\n {subItem.headerMenuLabel}\r\n </a>\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n </div>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n </div>\r\n );\r\n }\r\n\r\n renderMegaMenu(children, isOpen, submenuId, headerMenuLabel) {\r\n return (\r\n <div\r\n class={{\r\n 'dda-main-megamenu': true,\r\n 'is-visible': isOpen,\r\n }}\r\n id={submenuId}\r\n aria-label={`${headerMenuLabel} Mega Menu`}\r\n >\r\n <div class=\"dda-megamenu-wrap\">\r\n <div class=\"dda-megamenu-content\">\r\n <div class=\"dda-row\">\r\n {children.map((col, colIndex) => (\r\n <div class=\"dda-col-md-3\" key={`col-${colIndex}`}>\r\n {col.title && <h6 aria-label={`${col.title} section`} class=\"megamemu-sub-title\">{col.title}</h6>}\r\n <ul>\r\n {col.items.map((item, itemIndex) => (\r\n <li key={`item-${itemIndex}`}>\r\n \r\n <a\r\n class=\"dda-mega-menu-link\"\r\n // href={item.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n onClick={() => this.useNavigator == \"true\"? this.navigatorClick.emit(item.url) :\"\"}\r\n >\r\n {this.showQuickLinksIcon ? (\r\n <span class=\"dda-mega-menu-icon\" aria-hidden=\"true\">\r\n <i class=\"material-icons material-symbols-outlined\">\r\n {item.quickLinksIcon ? item.quickLinksIcon : \"sentiment_satisfied\"}\r\n </i>\r\n </span>\r\n ) : \"\"}\r\n <span class=\"text-wrap\">\r\n <span class=\"dda-mega-menu-text\">{item.headerMenuLabel}</span>\r\n {item.description && (\r\n <span class=\"dda-mega-menu-desc\">\r\n {item.description}\r\n </span>\r\n )}\r\n </span>\r\n </a>\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <nav aria-label=\"Main navigation\" class=\"dda-header-menu\">\r\n <ul class=\"dda-mega-menu\">\r\n {this.parsedMenuItems.map((item, index) => {\r\n const isOpen = this.openIndex === index;\r\n const hasSubmenu = item.children && item.children.length > 0;\r\n const submenuId = `submenu-${index}`;\r\n const type = item.type;\r\n\r\n return (\r\n <li key={`top-${index}`}>\r\n \r\n <a\r\n // href={item.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n aria-haspopup={hasSubmenu ? 'true' : undefined}\r\n aria-expanded={hasSubmenu ? String(isOpen) : undefined}\r\n aria-controls={hasSubmenu ? submenuId : undefined}\r\n \r\n class={isOpen ? 'active' : ''}\r\n onClick={e => this.handleToggle(index, hasSubmenu, e, item)}\r\n >\r\n {item.headerMenuLabel}\r\n </a>\r\n\r\n {hasSubmenu && type === 'dda_default_submenu' &&\r\n this.renderDefaultSubmenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n\r\n {hasSubmenu && type === 'dda_main_megamenu' &&\r\n this.renderMegaMenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n </nav>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"dda-header-menu.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Listen, EventEmitter, Event } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-header-menu',\r\n styleUrls: ['dda-header-menu.css'],\r\n shadow: false,\r\n})\r\nexport class DdaHeaderMenu {\r\n @Element() el: HTMLElement;\r\n \r\n @Event() navigatorClick?: EventEmitter<string>;\r\n\r\n @Prop() showQuickLinksIcon: boolean;\r\n\r\n @Prop() useNavigator: 'true' | 'false' = 'false';\r\n \r\n @Prop() quickLinks: string | Array<{\r\n headerMenuLabel: string;\r\n headerMenuId: string;\r\n description: string;\r\n url: string;\r\n quickLinksIcon: string;\r\n type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n children?: any;\r\n }> = []; @State() openIndex: number | null = null;\r\n @State() openSubIndex: number | null = null;\r\n\r\n get parsedMenuItems() {\r\n if (typeof this.quickLinks === 'string') {\r\n try {\r\n return JSON.parse(this.quickLinks);\r\n } catch {\r\n console.warn('Invalid JSON in quickLinks');\r\n return [];\r\n }\r\n }\r\n return this.quickLinks;\r\n }\r\n\r\n handleToggle(index: number, hasSubmenu: boolean, event: Event, item: any) {\r\n if (hasSubmenu) {\r\n event.preventDefault();\r\n this.openIndex = this.openIndex === index ? null : index;\r\n this.openSubIndex = null;\r\n }else{\r\n if(this.useNavigator == \"true\"){\r\n\r\n this.navigatorClick.emit(item.url)\r\n }\r\n }\r\n }\r\n\r\n handleClickOutside = (event: MouseEvent) => {\r\n const target = event.target as HTMLElement;\r\n if (!this.el.contains(target)) {\r\n this.openIndex = null;\r\n this.openSubIndex = null;\r\n }\r\n };\r\n\r\n connectedCallback() {\r\n document.addEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n @Listen('keydown', { target: 'window' })\r\n handleKeydown(event: KeyboardEvent) {\r\n if (event.key === 'Escape') {\r\n this.openIndex = null;\r\n this.openSubIndex = null;\r\n }\r\n }\r\n\r\n renderDefaultSubmenu(children, isOpen, submenuId, headerMenuLabel) {\r\n return (\r\n <div\r\n class={{\r\n 'dda-default-submenu': true,\r\n 'is-visible': isOpen,\r\n }}\r\n id={submenuId}\r\n aria-label={`${headerMenuLabel} Submenu`}\r\n >\r\n <ul>\r\n {children.map((item, subIndex) => {\r\n const hasSubSubmenu = item.children && item.children.length > 0;\r\n const subSubmenuId = `subsubmenu-${submenuId}-${subIndex}`;\r\n const isSubOpen = this.openSubIndex === subIndex;\r\n\r\n return (\r\n <li>\r\n \r\n\r\n <a\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n id={item.headerMenuId}\r\n aria-haspopup={hasSubSubmenu ? 'true' : undefined}\r\n aria-expanded={hasSubSubmenu ? String(isSubOpen) : undefined}\r\n aria-controls={hasSubSubmenu ? subSubmenuId : undefined}\r\n class={{\r\n 'has-submenu': hasSubSubmenu,\r\n 'active': isSubOpen,\r\n }}\r\n onClick={e => {\r\n if (hasSubSubmenu) {\r\n e.preventDefault();\r\n this.openSubIndex = this.openSubIndex === subIndex ? null : subIndex;\r\n }else{\r\n if(this.useNavigator == \"true\"){\r\n\r\n this.navigatorClick.emit(item.url)\r\n }\r\n }\r\n }}\r\n >\r\n {item.headerMenuLabel}\r\n </a>\r\n\r\n {hasSubSubmenu && (\r\n <div\r\n class={{\r\n 'dda-default-subsubmenu': true,\r\n 'is-visible': isSubOpen,\r\n }}\r\n id={subSubmenuId}\r\n aria-label={`${item.headerMenuLabel} Sub Submenu`}\r\n >\r\n <div class=\"dda-default-subsubmenu-content\">\r\n <span class=\"dda-submenu-title\">{item.defaultSubMenuTitle || item.headerMenuLabel}</span>\r\n <ul>\r\n {item.children.map((subItem, subItemIndex) => (\r\n <li>\r\n <a\r\n // href={subItem.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : subItem.url}\r\n id={`${subSubmenuId}-${subItemIndex}`}\r\n onClick={() => this.useNavigator == \"true\" ? this.navigatorClick.emit(subItem.url) : \"\"}\r\n >\r\n {subItem.headerMenuLabel}\r\n </a>\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n </div>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n </div>\r\n );\r\n }\r\n\r\n renderMegaMenu(children, isOpen, submenuId, headerMenuLabel) {\r\n return (\r\n <div\r\n class={{\r\n 'dda-main-megamenu': true,\r\n 'is-visible': isOpen,\r\n }}\r\n id={submenuId}\r\n aria-label={`${headerMenuLabel} Mega Menu`}\r\n >\r\n <div class=\"dda-megamenu-wrap\">\r\n <div class=\"dda-megamenu-content\">\r\n <div class=\"dda-row\">\r\n {children.map((col, colIndex) => (\r\n <div class=\"dda-col-md-3\" key={`col-${colIndex}`}>\r\n {col.title && <h6 aria-label={`${col.title} section`} class=\"megamemu-sub-title\">{col.title}</h6>}\r\n <ul>\r\n {col.items.map((item, itemIndex) => (\r\n <li key={`item-${itemIndex}`}>\r\n \r\n <a\r\n class=\"dda-mega-menu-link\"\r\n // href={item.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n onClick={() => this.useNavigator == \"true\"? this.navigatorClick.emit(item.url) :\"\"}\r\n >\r\n {this.showQuickLinksIcon ? (\r\n <span class=\"dda-mega-menu-icon\" aria-hidden=\"true\">\r\n <i class=\"material-icons material-symbols-outlined\">\r\n {item.quickLinksIcon ? item.quickLinksIcon : \"sentiment_satisfied\"}\r\n </i>\r\n </span>\r\n ) : \"\"}\r\n <span class=\"text-wrap\">\r\n <span class=\"dda-mega-menu-text\">{item.headerMenuLabel}</span>\r\n {item.description && (\r\n <span class=\"dda-mega-menu-desc\">\r\n {item.description}\r\n </span>\r\n )}\r\n </span>\r\n </a>\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <nav aria-label=\"Main navigation\" class=\"dda-header-menu\">\r\n <ul class=\"dda-mega-menu\">\r\n {this.parsedMenuItems.map((item, index) => {\r\n const isOpen = this.openIndex === index;\r\n const hasSubmenu = item.children && item.children.length > 0;\r\n const submenuId = `submenu-${index}`;\r\n const type = item.type;\r\n\r\n return (\r\n <li key={`top-${index}`}>\r\n \r\n <a\r\n // href={item.url}\r\n href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n aria-haspopup={hasSubmenu ? 'true' : undefined}\r\n aria-expanded={hasSubmenu ? String(isOpen) : undefined}\r\n aria-controls={hasSubmenu ? submenuId : undefined}\r\n \r\n // class={isOpen ? 'active' : ''}\r\n class={{\r\n 'active': item.active === 'true' || isOpen, // from props OR open state\r\n }}\r\n\r\n onClick={e => this.handleToggle(index, hasSubmenu, e, item)}\r\n >\r\n {item.headerMenuLabel}\r\n </a>\r\n\r\n {hasSubmenu && type === 'dda_default_submenu' &&\r\n this.renderDefaultSubmenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n\r\n {hasSubmenu && type === 'dda_main_megamenu' &&\r\n this.renderMegaMenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n </nav>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
@@ -49,7 +49,7 @@ const Template = args => `
49
49
  export const Default = Template.bind({});
50
50
  Default.args = {
51
51
  quickLinks: [
52
- { headerMenuLabel: 'Home', url: '#' },
52
+ { headerMenuLabel: 'Home', active: 'true', url: '#' },
53
53
  // default dropdown menu
54
54
  {
55
55
  headerMenuLabel: 'About Us',
@@ -1 +1 @@
1
- {"version":3,"file":"dda-header-menu.stories.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,6CAA6C;IACpD,SAAS,EAAE,iBAAiB;IAC5B,QAAQ,EAAE;QACR,UAAU,EAAE;YACV,OAAO,EAAE,QAAQ;YACjB,WAAW,EAAE,8DAA8D;SAC5E;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;SA0BV;aACF;SACF;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC;;mBAEN,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;;CAEjD,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,UAAU,EAAE;QACV,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE;QAErC,wBAAwB;QACxB;YACE,eAAe,EAAE,UAAU;YAC3B,GAAG,EAAE,oBAAoB;YACzB,IAAI,EAAE,qBAAqB;YAC3B,QAAQ,EAAE;gBACR;oBACE,eAAe,EAAE,WAAW;oBAC5B,GAAG,EAAE,GAAG;oBACR,YAAY,EAAE,WAAW;oBACzB,mBAAmB,EAAE,iBAAiB;oBACtC,QAAQ,EAAE;wBACR,EAAE,eAAe,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,EAAE;wBAC7C,EAAE,eAAe,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,EAAE;qBAC9C;iBACF;gBACD;oBACE,eAAe,EAAE,WAAW;oBAC5B,GAAG,EAAE,GAAG;oBACR,YAAY,EAAE,WAAW;oBACzB,mBAAmB,EAAE,iBAAiB;oBACtC,QAAQ,EAAE;wBACR,EAAE,eAAe,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,EAAE;wBAC7C,EAAE,eAAe,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,EAAE;qBAC9C;iBACF;gBACD;oBACE,eAAe,EAAE,WAAW;oBAC5B,GAAG,EAAE,GAAG;oBACR,YAAY,EAAE,WAAW;iBAC1B;aACF;SACF;QAED,YAAY;QACZ;YACE,eAAe,EAAE,UAAU;YAC3B,GAAG,EAAE,oBAAoB;YACzB,IAAI,EAAE,mBAAmB;YACzB,QAAQ,EAAE;gBACR;oBACE,KAAK,EAAE,eAAe;oBACtB,KAAK,EAAE;wBACL;4BACE,eAAe,EAAE,WAAW;4BAC5B,GAAG,EAAE,GAAG;4BACR,WAAW,EAAE,qBAAqB;yBACnC;wBACD,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE;wBAC1C,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE;qBAC3C;iBACF;gBACD;oBACE,KAAK,EAAE,eAAe;oBACtB,KAAK,EAAE;wBACL,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE;wBAC1C,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE;wBAC1C,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE;qBAC3C;iBACF;gBACD;oBACE,KAAK,EAAE,eAAe;oBACtB,KAAK,EAAE,CAAC,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;iBACpD;gBACD;oBACE,KAAK,EAAE,eAAe;oBACtB,KAAK,EAAE,CAAC,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;iBACpD;aACF;SACF;QAED,EAAE,eAAe,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE;KACzC;CACF,CAAC","sourcesContent":["export default {\r\n title: 'Components/DDA Header Menu/ DDA Header Menu',\r\n component: 'dda-header-menu',\r\n argTypes: {\r\n quickLinks: {\r\n control: 'object',\r\n description: 'Array of quick links with optional submenu type and children',\r\n },\r\n },\r\n parameters: {\r\n docs: {\r\n description: {\r\n component: `\r\nEach menu item can define its own submenu type:\r\n\r\n- \\`type: 'dda_default_submenu'\\` — basic list\r\n- \\`type: 'dda_main_megamenu'\\` — 4-column mega menu\r\n\r\n\\`\\`\\`ts\r\n{\r\n headerMenuLabel: 'About Us',\r\n url: '#',\r\n type: 'dda_default_submenu',\r\n children: [ { headerMenuLabel: 'Submenu 1', url: '#' }, ... ]\r\n}\r\n\\`\\`\\`\r\n\r\n\\`\\`\\`ts\r\n{\r\n headerMenuLabel: 'Services',\r\n url: '#',\r\n type: 'dda_main_megamenu',\r\n children: [\r\n { title: 'Column 1', items: [{ headerMenuLabel: 'Submenu 1', url: '#' }] },\r\n ...\r\n ]\r\n}\r\n\\`\\`\\`\r\n `,\r\n },\r\n },\r\n },\r\n};\r\n\r\nconst Template = args => `\r\n <dda-header-menu\r\n quick-links='${JSON.stringify(args.quickLinks)}'\r\n ></dda-header-menu>\r\n`;\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n quickLinks: [\r\n { headerMenuLabel: 'Home', url: '#' },\r\n\r\n // default dropdown menu\r\n {\r\n headerMenuLabel: 'About Us',\r\n url: 'javascript:void(0)',\r\n type: 'dda_default_submenu',\r\n children: [\r\n {\r\n headerMenuLabel: 'Submenu 1',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n defaultSubMenuTitle: 'Submenu 1 Title',\r\n children: [\r\n { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n ],\r\n },\r\n {\r\n headerMenuLabel: 'Submenu 2',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n defaultSubMenuTitle: 'Submenu 2 Title',\r\n children: [\r\n { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n ],\r\n },\r\n {\r\n headerMenuLabel: 'Submenu 3',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n },\r\n ],\r\n },\r\n\r\n // mega menu\r\n {\r\n headerMenuLabel: 'Services',\r\n url: 'javascript:void(0)',\r\n type: 'dda_main_megamenu',\r\n children: [\r\n {\r\n title: 'QUICK LINKS 1',\r\n items: [\r\n {\r\n headerMenuLabel: 'Service 1',\r\n url: '#',\r\n description: 'Service Description',\r\n },\r\n { headerMenuLabel: 'Service 2', url: '#' },\r\n { headerMenuLabel: 'Service 3', url: '#' },\r\n ],\r\n },\r\n {\r\n title: 'QUICK LINKS 2',\r\n items: [\r\n { headerMenuLabel: 'Service 1', url: '#' },\r\n { headerMenuLabel: 'Service 2', url: '#' },\r\n { headerMenuLabel: 'Service 3', url: '#' },\r\n ],\r\n },\r\n {\r\n title: 'QUICK LINKS 3',\r\n items: [{ headerMenuLabel: 'Service 3', url: '#' }],\r\n },\r\n {\r\n title: 'QUICK LINKS 4',\r\n items: [{ headerMenuLabel: 'Service 4', url: '#' }],\r\n },\r\n ],\r\n },\r\n\r\n { headerMenuLabel: 'Contact', url: '#' },\r\n ],\r\n};\r\n"]}
1
+ {"version":3,"file":"dda-header-menu.stories.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n title: 'Components/DDA Header Menu/ DDA Header Menu',\r\n component: 'dda-header-menu',\r\n argTypes: {\r\n quickLinks: {\r\n control: 'object',\r\n description: 'Array of quick links with optional submenu type and children',\r\n },\r\n },\r\n parameters: {\r\n docs: {\r\n description: {\r\n component: `\r\nEach menu item can define its own submenu type:\r\n\r\n- \\`type: 'dda_default_submenu'\\` — basic list\r\n- \\`type: 'dda_main_megamenu'\\` — 4-column mega menu\r\n\r\n\\`\\`\\`ts\r\n{\r\n headerMenuLabel: 'About Us',\r\n url: '#',\r\n type: 'dda_default_submenu',\r\n children: [ { headerMenuLabel: 'Submenu 1', url: '#' }, ... ]\r\n}\r\n\\`\\`\\`\r\n\r\n\\`\\`\\`ts\r\n{\r\n headerMenuLabel: 'Services',\r\n url: '#',\r\n type: 'dda_main_megamenu',\r\n children: [\r\n { title: 'Column 1', items: [{ headerMenuLabel: 'Submenu 1', url: '#' }] },\r\n ...\r\n ]\r\n}\r\n\\`\\`\\`\r\n `,\r\n },\r\n },\r\n },\r\n};\r\n\r\nconst Template = args => `\r\n <dda-header-menu\r\n quick-links='${JSON.stringify(args.quickLinks)}'\r\n ></dda-header-menu>\r\n`;\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n quickLinks: [\r\n { headerMenuLabel: 'Home', active: 'true', url: '#' },\r\n\r\n // default dropdown menu\r\n {\r\n headerMenuLabel: 'About Us',\r\n url: 'javascript:void(0)',\r\n type: 'dda_default_submenu',\r\n children: [\r\n {\r\n headerMenuLabel: 'Submenu 1',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n defaultSubMenuTitle: 'Submenu 1 Title',\r\n children: [\r\n { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n ],\r\n },\r\n {\r\n headerMenuLabel: 'Submenu 2',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n defaultSubMenuTitle: 'Submenu 2 Title',\r\n children: [\r\n { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n ],\r\n },\r\n {\r\n headerMenuLabel: 'Submenu 3',\r\n url: '#',\r\n headerMenuId: 'customeID',\r\n },\r\n ],\r\n },\r\n\r\n // mega menu\r\n {\r\n headerMenuLabel: 'Services',\r\n url: 'javascript:void(0)',\r\n type: 'dda_main_megamenu',\r\n children: [\r\n {\r\n title: 'QUICK LINKS 1',\r\n items: [\r\n {\r\n headerMenuLabel: 'Service 1',\r\n url: '#',\r\n description: 'Service Description',\r\n },\r\n { headerMenuLabel: 'Service 2', url: '#' },\r\n { headerMenuLabel: 'Service 3', url: '#' },\r\n ],\r\n },\r\n {\r\n title: 'QUICK LINKS 2',\r\n items: [\r\n { headerMenuLabel: 'Service 1', url: '#' },\r\n { headerMenuLabel: 'Service 2', url: '#' },\r\n { headerMenuLabel: 'Service 3', url: '#' },\r\n ],\r\n },\r\n {\r\n title: 'QUICK LINKS 3',\r\n items: [{ headerMenuLabel: 'Service 3', url: '#' }],\r\n },\r\n {\r\n title: 'QUICK LINKS 4',\r\n items: [{ headerMenuLabel: 'Service 4', url: '#' }],\r\n },\r\n ],\r\n },\r\n\r\n { headerMenuLabel: 'Contact', url: '#' },\r\n ],\r\n};\r\n"]}
@@ -119,12 +119,12 @@ export class Ddaselect {
119
119
  render() {
120
120
  const labelId = `${this.button_id}-label`;
121
121
  const valueId = `${this.button_id}-value`;
122
- return (h(Host, { key: 'c89e68e10cc4658318fd818305436c027a24ead5' }, h("div", { key: 'b436e93c4cbfdd5b76aa4c15e38b76872d04185c', class: `
122
+ return (h(Host, { key: 'ecf43cd602ef0f98974d1c76cfd50ac7357b6a08' }, h("div", { key: '4c15c3048ad62d235b7259cbf3f39921909ce5e5', class: `
123
123
  dda-input-container ${this.custom_class}
124
124
  ${this.component_mode}
125
125
  ${this.disabled ? 'dda-input-disabled' : ''}
126
126
  dda-input-size-${this.size} dda-validation-${this.validation_type}
127
- ` }, this.label && (h("span", { key: 'f0c20e8afd927b1c8f6940cc1c260b24a445086b', id: labelId, class: "dda-input-label" }, this.label)), h("div", { key: '8bb32b3eb1669b2b44c1d3c2080821046f31caf5', class: "dda-dropdown-container" }, h("button", { key: 'c30b9f0219d65a079565f5a18a7498eb7b83bb15', name: this.toggle_button_name, id: this.button_id, type: "button", class: "dda-input-field dda-select-header", "aria-labelledby": `${labelId} ${this.button_id}`, disabled: this.disabled, onClick: () => this.toggleSelect(), onBlur: this.handleBlur }, h("span", { key: '79489230cb303c49294e73b378041b18dae01abc', id: valueId, class: "dda-select-button-label" }, this.selectedText || this.placeholder), h("i", { key: '19e5d561ecce26640b3338a17b23191e3cb5fb08', class: "material-icons", "aria-hidden": "true" }, this.is_open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), this.is_open && (h("div", { key: '35f08c99f312bb9a9062074b72564c79885dac43', class: "dda-input-dropdown-list dda-select-list" }, this.parsedOptions.length > 0 ? (this.parsedOptions.map((option, index) => (h("button", { name: `option${this.numberToWord(index + 1)}`, type: "button", class: `dda-input-dropdown-item ${this.selectedId === option.id ? 'selected' : ''}`, role: "option", "aria-selected": this.selectedId === option.id ? 'true' : 'false', onClick: () => this.selectOption(option) }, option.text)))) : (h("div", { class: "dda-input-dropdown-item" }, "No options available"))))), this.validation_type === 'error' && this.error_message ? (h("span", { class: "dda-error-message", id: this.validation_id, role: "alert" }, this.error_message)) : (this.helper_text && (h("span", { class: "dda-helper-text", id: this.validation_id }, this.helper_text))))));
127
+ ` }, this.label && (h("span", { key: 'e58cda1941ef732a951dc06f7c01f7d904a1c8c3', id: labelId, class: "dda-input-label" }, this.label)), h("div", { key: '6885ef524717d3b8f9850b3995f56ae5194e748a', class: "dda-dropdown-container" }, h("button", { key: 'a4e6e30acdf55e12aa4742f9dc824c9e1eec0b57', name: this.toggle_button_name, id: this.button_id, type: "button", class: "dda-input-field dda-select-header", "aria-labelledby": `${labelId} ${this.button_id}`, disabled: this.disabled, onClick: () => this.toggleSelect(), onBlur: this.handleBlur }, h("span", { key: '8f67e50593affdb2b558200091c2aecd53e9c387', id: valueId, class: "dda-select-button-label" }, this.selectedText || this.placeholder), h("i", { key: '423ca7dcd2b51118ffa5e5cddaa86d05ae981e5d', class: "material-icons", "aria-hidden": "true" }, this.is_open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), this.is_open && (h("div", { key: 'ffcefb669f4400f26ffff871092cf22ac977a2d4', class: "dda-input-dropdown-list dda-select-list" }, this.parsedOptions.length > 0 ? (this.parsedOptions.map((option, index) => (h("button", { name: `option${this.numberToWord(index + 1)}`, type: "button", class: `dda-input-dropdown-item ${this.selectedId === option.id ? 'selected' : ''}`, role: "option", "aria-selected": this.selectedId === option.id ? 'true' : 'false', onClick: () => this.selectOption(option) }, option.text)))) : (h("div", { class: "dda-input-dropdown-item" }, "No options available"))))), this.validation_type === 'error' && this.error_message ? (h("span", { class: "dda-error-message", id: this.validation_id, role: "alert" }, this.error_message)) : (this.helper_text && (h("span", { class: "dda-helper-text", id: this.validation_id }, this.helper_text))))));
128
128
  }
129
129
  static get is() { return "dda-select"; }
130
130
  static get properties() {
@@ -1 +1 @@
1
- {"version":3,"file":"dda-select.js","sourceRoot":"","sources":["../../../src/components/dda-select/dda-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h, Host, Element, Event, EventEmitter, Watch, Method } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-select',\r\n styleUrls: [],\r\n shadow: false,\r\n})\r\nexport class Ddaselect {\r\n @Element() el: HTMLElement;\r\n\r\n @Prop() label: string;\r\n @Prop() options: string;\r\n @Prop() selected: string; // can be id or text\r\n @Prop() disabled: boolean = false;\r\n @Prop() error?: string;\r\n @Prop() error_message: string;\r\n @Prop() helper_text: string;\r\n @Prop() validation_type?: string;\r\n @Prop() validation_id: string = 'text';\r\n @Prop() size?: string;\r\n @Prop() custom_class?: string = '';\r\n @Prop() component_mode?: string;\r\n @Prop() button_id: string;\r\n @Prop() toggle_button_name: string;\r\n @Prop() option_select_button_name: string;\r\n @Prop() placeholder: string = '';\r\n @Prop() main_aria_label: string = '';\r\n @Prop() input_name: string = '';\r\n\r\n @State() is_open: boolean = false;\r\n @State() selectedId: number;\r\n @State() selectedText: string;\r\n\r\n @Event() selectChanged: EventEmitter<{ id: number; text: string }>;\r\n @Event() onChanged: EventEmitter<any>;\r\n\r\n @Event() selectBlurred: EventEmitter<{ name: string; value: string }>;\r\n @Event() onBlurred: EventEmitter<any>;\r\n\r\n private get parsedOptions(): { id: number; text: string }[] {\r\n try {\r\n return JSON.parse(this.options);\r\n } catch {\r\n return [];\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === this.selected || opt.text === this.selected);\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n }\r\n if (this.selected) {\r\n this.watchSelected(this.selected);\r\n }\r\n }\r\n\r\n toggleSelect() {\r\n if (!this.disabled) {\r\n this.is_open = !this.is_open;\r\n }\r\n }\r\n\r\n selectOption(option: { id: any; text: string }) {\r\n if (!this.disabled) {\r\n this.selectedId = option.id;\r\n this.selectedText = option.text;\r\n this.is_open = false;\r\n this.selectChanged.emit(option);\r\n this.onChanged.emit(option.id);\r\n\r\n this.el.dispatchEvent(\r\n new InputEvent('input', {\r\n bubbles: true,\r\n composed: true,\r\n data: option.id,\r\n inputType: 'select',\r\n }),\r\n );\r\n }\r\n }\r\n\r\n handleClickOutside = (event: MouseEvent) => {\r\n if (this.is_open && !this.el.contains(event.target as Node)) {\r\n this.is_open = false;\r\n }\r\n };\r\n\r\n handleBlur = () => {\r\n this.selectBlurred.emit({\r\n name: this.input_name || this.button_id,\r\n value: this.selectedText || '',\r\n });\r\n this.onBlurred.emit(this.selectedId);\r\n\r\n this.el.dispatchEvent(\r\n new FocusEvent('blur', {\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n };\r\n\r\n connectedCallback() {\r\n document.addEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n @Method()\r\n async setSelected(value: string | number) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === value.toString() || opt.text === value);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n this.selected = selectedOption.id.toString();\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n this.selected = '';\r\n }\r\n }\r\n\r\n async setValue(value: string | number) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === value.toString() || opt.text === value);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n this.selected = selectedOption.id.toString();\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n this.selected = '';\r\n }\r\n }\r\n\r\n @Method()\r\n async getSelectedText() {\r\n return this.selectedText;\r\n }\r\n\r\n async getValue() {\r\n return this.selectedText || '';\r\n }\r\n\r\n @Watch('selected')\r\n watchSelected(newVal: string) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === newVal || opt.text === newVal);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n }\r\n }\r\n\r\n private numberToWord(num: number): string {\r\n const words = ['One', 'Two', 'Three', 'Four', 'Five'];\r\n return words[num - 1] || num.toString();\r\n }\r\n\r\n render() {\r\n const labelId = `${this.button_id}-label`;\r\n const valueId = `${this.button_id}-value`;\r\n\r\n return (\r\n <Host>\r\n <div\r\n class={`\r\n dda-input-container ${this.custom_class} \r\n ${this.component_mode} \r\n ${this.disabled ? 'dda-input-disabled' : ''} \r\n dda-input-size-${this.size} dda-validation-${this.validation_type}\r\n `}\r\n >\r\n {this.label && (\r\n <span id={labelId} class=\"dda-input-label\">\r\n {this.label}\r\n </span>\r\n )}\r\n <div class=\"dda-dropdown-container\">\r\n <button\r\n name={this.toggle_button_name}\r\n id={this.button_id}\r\n type=\"button\"\r\n class=\"dda-input-field dda-select-header\"\r\n aria-labelledby={`${labelId} ${this.button_id}`}\r\n disabled={this.disabled}\r\n onClick={() => this.toggleSelect()}\r\n onBlur={this.handleBlur}\r\n >\r\n <span id={valueId} class=\"dda-select-button-label\">\r\n {this.selectedText || this.placeholder}\r\n </span>\r\n <i class=\"material-icons\" aria-hidden=\"true\">\r\n {this.is_open ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}\r\n </i>\r\n </button>\r\n\r\n {this.is_open && (\r\n <div class=\"dda-input-dropdown-list dda-select-list\">\r\n {this.parsedOptions.length > 0 ? (\r\n this.parsedOptions.map((option, index) => (\r\n <button\r\n name={`option${this.numberToWord(index + 1)}`}\r\n type=\"button\"\r\n class={`dda-input-dropdown-item ${this.selectedId === option.id ? 'selected' : ''}`}\r\n role=\"option\"\r\n aria-selected={this.selectedId === option.id ? 'true' : 'false'}\r\n onClick={() => this.selectOption(option)}\r\n >\r\n {option.text}\r\n </button>\r\n ))\r\n ) : (\r\n <div class=\"dda-input-dropdown-item\">No options available</div>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n\r\n {this.validation_type === 'error' && this.error_message ? (\r\n <span class=\"dda-error-message\" id={this.validation_id} role=\"alert\">\r\n {this.error_message}\r\n </span>\r\n ) : (\r\n this.helper_text && (\r\n <span class=\"dda-helper-text\" id={this.validation_id}>\r\n {this.helper_text}\r\n </span>\r\n )\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"dda-select.js","sourceRoot":"","sources":["../../../src/components/dda-select/dda-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h, Host, Element, Event, EventEmitter, Watch, Method } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-select',\r\n // styleUrls: ['../../global/input.css', '../../global/global.css'],\r\n shadow: false,\r\n})\r\nexport class Ddaselect {\r\n @Element() el: HTMLElement;\r\n\r\n @Prop() label: string;\r\n @Prop() options: string;\r\n @Prop() selected: string; // can be id or text\r\n @Prop() disabled: boolean = false;\r\n @Prop() error?: string;\r\n @Prop() error_message: string;\r\n @Prop() helper_text: string;\r\n @Prop() validation_type?: string;\r\n @Prop() validation_id: string = 'text';\r\n @Prop() size?: string;\r\n @Prop() custom_class?: string = '';\r\n @Prop() component_mode?: string;\r\n @Prop() button_id: string;\r\n @Prop() toggle_button_name: string;\r\n @Prop() option_select_button_name: string;\r\n @Prop() placeholder: string = '';\r\n @Prop() main_aria_label: string = '';\r\n @Prop() input_name: string = '';\r\n\r\n @State() is_open: boolean = false;\r\n @State() selectedId: number;\r\n @State() selectedText: string;\r\n\r\n @Event() selectChanged: EventEmitter<{ id: number; text: string }>;\r\n @Event() onChanged: EventEmitter<any>;\r\n\r\n @Event() selectBlurred: EventEmitter<{ name: string; value: string }>;\r\n @Event() onBlurred: EventEmitter<any>;\r\n\r\n private get parsedOptions(): { id: number; text: string }[] {\r\n try {\r\n return JSON.parse(this.options);\r\n } catch {\r\n return [];\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === this.selected || opt.text === this.selected);\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n }\r\n if (this.selected) {\r\n this.watchSelected(this.selected);\r\n }\r\n }\r\n\r\n toggleSelect() {\r\n if (!this.disabled) {\r\n this.is_open = !this.is_open;\r\n }\r\n }\r\n\r\n selectOption(option: { id: any; text: string }) {\r\n if (!this.disabled) {\r\n this.selectedId = option.id;\r\n this.selectedText = option.text;\r\n this.is_open = false;\r\n this.selectChanged.emit(option);\r\n this.onChanged.emit(option.id);\r\n\r\n this.el.dispatchEvent(\r\n new InputEvent('input', {\r\n bubbles: true,\r\n composed: true,\r\n data: option.id,\r\n inputType: 'select',\r\n }),\r\n );\r\n }\r\n }\r\n\r\n handleClickOutside = (event: MouseEvent) => {\r\n if (this.is_open && !this.el.contains(event.target as Node)) {\r\n this.is_open = false;\r\n }\r\n };\r\n\r\n handleBlur = () => {\r\n this.selectBlurred.emit({\r\n name: this.input_name || this.button_id,\r\n value: this.selectedText || '',\r\n });\r\n this.onBlurred.emit(this.selectedId);\r\n\r\n this.el.dispatchEvent(\r\n new FocusEvent('blur', {\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n };\r\n\r\n connectedCallback() {\r\n document.addEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n }\r\n\r\n @Method()\r\n async setSelected(value: string | number) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === value.toString() || opt.text === value);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n this.selected = selectedOption.id.toString();\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n this.selected = '';\r\n }\r\n }\r\n\r\n async setValue(value: string | number) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === value.toString() || opt.text === value);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n this.selected = selectedOption.id.toString();\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n this.selected = '';\r\n }\r\n }\r\n\r\n @Method()\r\n async getSelectedText() {\r\n return this.selectedText;\r\n }\r\n\r\n async getValue() {\r\n return this.selectedText || '';\r\n }\r\n\r\n @Watch('selected')\r\n watchSelected(newVal: string) {\r\n const selectedOption = this.parsedOptions.find(opt => opt.id.toString() === newVal || opt.text === newVal);\r\n\r\n if (selectedOption) {\r\n this.selectedId = selectedOption.id;\r\n this.selectedText = selectedOption.text;\r\n } else {\r\n this.selectedId = undefined;\r\n this.selectedText = '';\r\n }\r\n }\r\n\r\n private numberToWord(num: number): string {\r\n const words = ['One', 'Two', 'Three', 'Four', 'Five'];\r\n return words[num - 1] || num.toString();\r\n }\r\n\r\n render() {\r\n const labelId = `${this.button_id}-label`;\r\n const valueId = `${this.button_id}-value`;\r\n\r\n return (\r\n <Host>\r\n <div\r\n class={`\r\n dda-input-container ${this.custom_class} \r\n ${this.component_mode} \r\n ${this.disabled ? 'dda-input-disabled' : ''} \r\n dda-input-size-${this.size} dda-validation-${this.validation_type}\r\n `}\r\n >\r\n {this.label && (\r\n <span id={labelId} class=\"dda-input-label\">\r\n {this.label}\r\n </span>\r\n )}\r\n <div class=\"dda-dropdown-container\">\r\n <button\r\n name={this.toggle_button_name}\r\n id={this.button_id}\r\n type=\"button\"\r\n class=\"dda-input-field dda-select-header\"\r\n aria-labelledby={`${labelId} ${this.button_id}`}\r\n disabled={this.disabled}\r\n onClick={() => this.toggleSelect()}\r\n onBlur={this.handleBlur}\r\n >\r\n <span id={valueId} class=\"dda-select-button-label\">\r\n {this.selectedText || this.placeholder}\r\n </span>\r\n <i class=\"material-icons\" aria-hidden=\"true\">\r\n {this.is_open ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}\r\n </i>\r\n </button>\r\n\r\n {this.is_open && (\r\n <div class=\"dda-input-dropdown-list dda-select-list\">\r\n {this.parsedOptions.length > 0 ? (\r\n this.parsedOptions.map((option, index) => (\r\n <button\r\n name={`option${this.numberToWord(index + 1)}`}\r\n type=\"button\"\r\n class={`dda-input-dropdown-item ${this.selectedId === option.id ? 'selected' : ''}`}\r\n role=\"option\"\r\n aria-selected={this.selectedId === option.id ? 'true' : 'false'}\r\n onClick={() => this.selectOption(option)}\r\n >\r\n {option.text}\r\n </button>\r\n ))\r\n ) : (\r\n <div class=\"dda-input-dropdown-item\">No options available</div>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n\r\n {this.validation_type === 'error' && this.error_message ? (\r\n <span class=\"dda-error-message\" id={this.validation_id} role=\"alert\">\r\n {this.error_message}\r\n </span>\r\n ) : (\r\n this.helper_text && (\r\n <span class=\"dda-helper-text\" id={this.validation_id}>\r\n {this.helper_text}\r\n </span>\r\n )\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
@@ -121,9 +121,10 @@ Default.args = {
121
121
  export const Small = Template.bind({});
122
122
  Small.args = Object.assign(Object.assign({}, Default.args), { size: 'small' });
123
123
  export const WithError = Template.bind({});
124
- WithError.args = Object.assign(Object.assign({}, Default.args), { error: 'error',
125
- // validation_type: 'error',
126
- error_message: 'This is an error message' });
124
+ WithError.args = Object.assign(Object.assign({}, Default.args), {
125
+ // error: 'error',
126
+ validation_type: 'error', error_message: 'This is an error message'
127
+ });
127
128
  export const Disabled = Template.bind({});
128
129
  Disabled.args = Object.assign(Object.assign({}, Default.args), { disabled: true });
129
130
  //# sourceMappingURL=dda-select.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"dda-select.stories.js","sourceRoot":"","sources":["../../../src/components/dda-select/dda-select.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n title: 'Components/Select',\r\n tags: ['autodocs'],\r\n argTypes: {\r\n size: {\r\n control: { type: 'select' },\r\n options: ['default', 'small'],\r\n description: 'Size of the select',\r\n },\r\n label: { control: 'text', description: 'Label for the select' },\r\n options: {\r\n control: 'object',\r\n description: 'Array of options (id and text)',\r\n },\r\n selected: {\r\n control: 'text',\r\n description: 'Selected option (id or text)',\r\n },\r\n placeholder: {\r\n control: 'text',\r\n description: 'Placeholder text when no option is selected',\r\n },\r\n main_aria_label: {\r\n control: 'text',\r\n description: 'Aria Label text for the accessibility',\r\n },\r\n disabled: { control: 'boolean', description: 'Disable the select' },\r\n error: {\r\n control: { type: 'select' },\r\n options: ['normal', 'error'],\r\n description: 'Error state of the select',\r\n },\r\n error_message: { control: 'text', description: 'Error message to display' },\r\n helper_text: { control: 'text', description: 'Helper or footer text' },\r\n validation_id: { control: 'text', description: 'Validation ID' },\r\n custom_class: { control: 'text', description: 'Custom class for the select' },\r\n component_mode: {\r\n control: 'check',\r\n options: ['light-mode'],\r\n description: 'Mode of the select component',\r\n },\r\n button_id: { control: 'text', description: 'Button ID' },\r\n toggle_button_name: { control: 'text', description: 'Toggle button name' },\r\n option_select_button_name: { control: 'text', description: 'Option select button name' },\r\n validation_type: {\r\n control: { type: 'select' },\r\n options: ['normal','error'],\r\n description: 'Validation type of the input field',\r\n },\r\n },\r\n parameters: {\r\n docs: {\r\n description: {\r\n component: `\r\n\\`\\`\\`html\r\n<dda-select\r\n label=\"Select an option\"\r\n placeholder=\"Please select...\"\r\n main_aria_label=\"Please choose an option\"\r\n selected=\"2\"\r\n disabled=\"false\"\r\n helper_text=\"Helper or footer text\"\r\n error_message=\"\"\r\n validation_type=\"normal\"\r\n size=\"default\"\r\n custom_class=\"\"\r\n component_mode=\"\"\r\n button_id=\"button\"\r\n options='[{\"id\":1,\"text\":\"Option 1\"},{\"id\":2,\"text\":\"Option 2\"}]'\r\n toggle_button_name=\"toggle_button\"\r\n option_select_button_name=\"option_button\"\r\n></dda-select>\r\n\\`\\`\\`\r\n `,\r\n },\r\n },\r\n },\r\n};\r\n\r\nconst Template = (args) => {\r\n const optionsAttribute = args.options ? `options='${JSON.stringify(args.options)}'` : '';\r\n const otherAttributes = Object.entries(args)\r\n .filter(([key]) => key !== 'options')\r\n .map(([key, value]) => `${key}=\"${value}\"`)\r\n .join(' ');\r\n\r\n return `\r\n <dda-select ${optionsAttribute} ${otherAttributes}></dda-select>\r\n <script>\r\n document.querySelector('dda-select').addEventListener('selectChanged', e => {\r\n console.log('Selected:', e.detail);\r\n });\r\n </script>\r\n `;\r\n};\r\n\r\nconst defaultOptions = [\r\n { id: '1', text: 'Option 1' },\r\n { id: '2', text: 'Option 2' },\r\n { id: '3', text: 'Option 3' },\r\n { id: '4', text: 'Option 4' },\r\n { id: '5', text: 'Option 5' },\r\n];\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n label: 'Select an option',\r\n placeholder: 'Please select...',\r\n main_aria_label: 'Please choose an option',\r\n options: defaultOptions,\r\n selected: '0',\r\n disabled: false,\r\n helper_text: 'Helper or footer text',\r\n error_message: 'This is a error message',\r\n validation_type: 'normal',\r\n validation_id: 'validationId',\r\n size: 'default',\r\n custom_class: '',\r\n component_mode: '',\r\n button_id: 'button',\r\n toggle_button_name: 'toggle_button',\r\n option_select_button_name: 'option_button',\r\n selectChanged:\"\",\r\n};\r\n\r\nexport const Small = Template.bind({});\r\nSmall.args = {\r\n ...Default.args,\r\n size: 'small',\r\n};\r\n\r\nexport const WithError = Template.bind({});\r\nWithError.args = {\r\n ...Default.args,\r\n error: 'error',\r\n // validation_type: 'error',\r\n error_message: 'This is an error message',\r\n};\r\n\r\nexport const Disabled = Template.bind({});\r\nDisabled.args = {\r\n ...Default.args,\r\n disabled: true,\r\n};\r\n"]}
1
+ {"version":3,"file":"dda-select.stories.js","sourceRoot":"","sources":["../../../src/components/dda-select/dda-select.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n title: 'Components/Select',\r\n tags: ['autodocs'],\r\n argTypes: {\r\n size: {\r\n control: { type: 'select' },\r\n options: ['default', 'small'],\r\n description: 'Size of the select',\r\n },\r\n label: { control: 'text', description: 'Label for the select' },\r\n options: {\r\n control: 'object',\r\n description: 'Array of options (id and text)',\r\n },\r\n selected: {\r\n control: 'text',\r\n description: 'Selected option (id or text)',\r\n },\r\n placeholder: {\r\n control: 'text',\r\n description: 'Placeholder text when no option is selected',\r\n },\r\n main_aria_label: {\r\n control: 'text',\r\n description: 'Aria Label text for the accessibility',\r\n },\r\n disabled: { control: 'boolean', description: 'Disable the select' },\r\n error: {\r\n control: { type: 'select' },\r\n options: ['normal', 'error'],\r\n description: 'Error state of the select',\r\n },\r\n error_message: { control: 'text', description: 'Error message to display' },\r\n helper_text: { control: 'text', description: 'Helper or footer text' },\r\n validation_id: { control: 'text', description: 'Validation ID' },\r\n custom_class: { control: 'text', description: 'Custom class for the select' },\r\n component_mode: {\r\n control: 'check',\r\n options: ['light-mode'],\r\n description: 'Mode of the select component',\r\n },\r\n button_id: { control: 'text', description: 'Button ID' },\r\n toggle_button_name: { control: 'text', description: 'Toggle button name' },\r\n option_select_button_name: { control: 'text', description: 'Option select button name' },\r\n validation_type: {\r\n control: { type: 'select' },\r\n options: ['normal','error'],\r\n description: 'Validation type of the input field',\r\n },\r\n },\r\n parameters: {\r\n docs: {\r\n description: {\r\n component: `\r\n\\`\\`\\`html\r\n<dda-select\r\n label=\"Select an option\"\r\n placeholder=\"Please select...\"\r\n main_aria_label=\"Please choose an option\"\r\n selected=\"2\"\r\n disabled=\"false\"\r\n helper_text=\"Helper or footer text\"\r\n error_message=\"\"\r\n validation_type=\"normal\"\r\n size=\"default\"\r\n custom_class=\"\"\r\n component_mode=\"\"\r\n button_id=\"button\"\r\n options='[{\"id\":1,\"text\":\"Option 1\"},{\"id\":2,\"text\":\"Option 2\"}]'\r\n toggle_button_name=\"toggle_button\"\r\n option_select_button_name=\"option_button\"\r\n></dda-select>\r\n\\`\\`\\`\r\n `,\r\n },\r\n },\r\n },\r\n};\r\n\r\nconst Template = (args) => {\r\n const optionsAttribute = args.options ? `options='${JSON.stringify(args.options)}'` : '';\r\n const otherAttributes = Object.entries(args)\r\n .filter(([key]) => key !== 'options')\r\n .map(([key, value]) => `${key}=\"${value}\"`)\r\n .join(' ');\r\n\r\n return `\r\n <dda-select ${optionsAttribute} ${otherAttributes}></dda-select>\r\n <script>\r\n document.querySelector('dda-select').addEventListener('selectChanged', e => {\r\n console.log('Selected:', e.detail);\r\n });\r\n </script>\r\n `;\r\n};\r\n\r\nconst defaultOptions = [\r\n { id: '1', text: 'Option 1' },\r\n { id: '2', text: 'Option 2' },\r\n { id: '3', text: 'Option 3' },\r\n { id: '4', text: 'Option 4' },\r\n { id: '5', text: 'Option 5' },\r\n];\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n label: 'Select an option',\r\n placeholder: 'Please select...',\r\n main_aria_label: 'Please choose an option',\r\n options: defaultOptions,\r\n selected: '0',\r\n disabled: false,\r\n helper_text: 'Helper or footer text',\r\n error_message: 'This is a error message',\r\n validation_type: 'normal',\r\n validation_id: 'validationId',\r\n size: 'default',\r\n custom_class: '',\r\n component_mode: '',\r\n button_id: 'button',\r\n toggle_button_name: 'toggle_button',\r\n option_select_button_name: 'option_button',\r\n selectChanged:\"\",\r\n};\r\n\r\nexport const Small = Template.bind({});\r\nSmall.args = {\r\n ...Default.args,\r\n size: 'small',\r\n};\r\n\r\nexport const WithError = Template.bind({});\r\nWithError.args = {\r\n ...Default.args,\r\n // error: 'error',\r\n validation_type: 'error',\r\n error_message: 'This is an error message',\r\n};\r\n\r\nexport const Disabled = Template.bind({});\r\nDisabled.args = {\r\n ...Default.args,\r\n disabled: true,\r\n};\r\n"]}
@@ -258,7 +258,7 @@ export class DDASlider {
258
258
  "references": {
259
259
  "SlideData": {
260
260
  "location": "local",
261
- "path": "C:/DPHost/DDA-Components-Lib/DDASrc-2/packages/stencil/src/components/dda-slider/dda-slider.tsx",
261
+ "path": "C:/MyWorks/DATACELL/DDA-2024/DDA Design System Components/packages/stencil/src/components/dda-slider/dda-slider.tsx",
262
262
  "id": "src/components/dda-slider/dda-slider.tsx::SlideData"
263
263
  }
264
264
  }