@govtechsg/sgds-web-component 3.1.0-rc.6 → 3.1.0

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 (210) hide show
  1. package/base/button.js +1 -1
  2. package/base/select-element.d.ts +80 -0
  3. package/base/select-element.js +201 -0
  4. package/base/select-element.js.map +1 -0
  5. package/components/Accordion/index.umd.js +7 -5
  6. package/components/Accordion/index.umd.js.map +1 -1
  7. package/components/Accordion/sgds-accordion-item.d.ts +0 -1
  8. package/components/Accordion/sgds-accordion-item.js +7 -5
  9. package/components/Accordion/sgds-accordion-item.js.map +1 -1
  10. package/components/Breadcrumb/index.umd.js +5 -2
  11. package/components/Breadcrumb/index.umd.js.map +1 -1
  12. package/components/Button/button.js +1 -1
  13. package/components/Button/index.umd.js +3 -6
  14. package/components/Button/index.umd.js.map +1 -1
  15. package/components/Button/sgds-button.js +1 -4
  16. package/components/Button/sgds-button.js.map +1 -1
  17. package/components/Checkbox/checkbox.js +1 -1
  18. package/components/Checkbox/index.umd.js +42 -34
  19. package/components/Checkbox/index.umd.js.map +1 -1
  20. package/components/Checkbox/sgds-checkbox-group.d.ts +6 -4
  21. package/components/Checkbox/sgds-checkbox-group.js +34 -17
  22. package/components/Checkbox/sgds-checkbox-group.js.map +1 -1
  23. package/components/Checkbox/sgds-checkbox.d.ts +2 -3
  24. package/components/Checkbox/sgds-checkbox.js +9 -21
  25. package/components/Checkbox/sgds-checkbox.js.map +1 -1
  26. package/components/ComboBox/combo-box.js +1 -1
  27. package/components/ComboBox/index.umd.js +492 -500
  28. package/components/ComboBox/index.umd.js.map +1 -1
  29. package/components/ComboBox/sgds-combo-box.d.ts +9 -82
  30. package/components/ComboBox/sgds-combo-box.js +13 -202
  31. package/components/ComboBox/sgds-combo-box.js.map +1 -1
  32. package/components/Datepicker/index.umd.js +4 -7
  33. package/components/Datepicker/index.umd.js.map +1 -1
  34. package/components/Dropdown/dropdown-menu.js +1 -1
  35. package/components/Dropdown/dropdown.js +1 -1
  36. package/components/Dropdown/index.umd.js +5 -2
  37. package/components/Dropdown/index.umd.js.map +1 -1
  38. package/components/Dropdown/sgds-dropdown-item.js +3 -0
  39. package/components/Dropdown/sgds-dropdown-item.js.map +1 -1
  40. package/components/FileUpload/index.umd.js +3 -6
  41. package/components/FileUpload/index.umd.js.map +1 -1
  42. package/components/IconButton/index.umd.js +1 -1
  43. package/components/Mainnav/index.umd.js +13 -10
  44. package/components/Mainnav/index.umd.js.map +1 -1
  45. package/components/Mainnav/mainnav-dropdown.js +1 -1
  46. package/components/Mainnav/mainnav-item.js +1 -1
  47. package/components/Mainnav/mainnav.js +1 -1
  48. package/components/Pagination/index.umd.js +3 -6
  49. package/components/Pagination/index.umd.js.map +1 -1
  50. package/components/QuantityToggle/index.umd.js +1 -1
  51. package/components/Select/index.d.ts +6 -0
  52. package/components/Select/index.js +4 -0
  53. package/components/Select/index.js.map +1 -0
  54. package/components/Select/index.umd.js +10317 -0
  55. package/components/Select/index.umd.js.map +1 -0
  56. package/components/Select/select-item.d.ts +17 -0
  57. package/components/Select/select-item.js +61 -0
  58. package/components/Select/select-item.js.map +1 -0
  59. package/components/Select/select-item2.js +6 -0
  60. package/components/Select/select-item2.js.map +1 -0
  61. package/components/Select/select.js +6 -0
  62. package/components/Select/select.js.map +1 -0
  63. package/components/Select/sgds-select.d.ts +27 -0
  64. package/components/Select/sgds-select.js +158 -0
  65. package/components/Select/sgds-select.js.map +1 -0
  66. package/components/Subnav/index.d.ts +8 -0
  67. package/components/Subnav/index.js +6 -0
  68. package/components/Subnav/index.js.map +1 -0
  69. package/components/Subnav/index.umd.js +6074 -0
  70. package/components/Subnav/index.umd.js.map +1 -0
  71. package/components/Subnav/sgds-subnav-item.d.ts +16 -0
  72. package/components/Subnav/sgds-subnav-item.js +68 -0
  73. package/components/Subnav/sgds-subnav-item.js.map +1 -0
  74. package/components/Subnav/sgds-subnav.d.ts +47 -0
  75. package/components/Subnav/sgds-subnav.js +253 -0
  76. package/components/Subnav/sgds-subnav.js.map +1 -0
  77. package/components/Subnav/subnav-item.js +6 -0
  78. package/components/Subnav/subnav-item.js.map +1 -0
  79. package/components/Subnav/subnav.js +6 -0
  80. package/components/Subnav/subnav.js.map +1 -0
  81. package/components/index.d.ts +2 -0
  82. package/components/index.js +2 -0
  83. package/components/index.js.map +1 -1
  84. package/components/index.umd.js +812 -355
  85. package/components/index.umd.js.map +1 -1
  86. package/css/grid.js +6 -0
  87. package/css/grid.js.map +1 -0
  88. package/index.d.ts +2 -0
  89. package/index.js +2 -0
  90. package/index.js.map +1 -1
  91. package/index.umd.js +897 -376
  92. package/index.umd.js.map +1 -1
  93. package/package.json +1 -1
  94. package/react/base/button.cjs.js +1 -1
  95. package/react/base/button.js +1 -1
  96. package/react/base/select-element.cjs.js +206 -0
  97. package/react/base/select-element.cjs.js.map +1 -0
  98. package/react/base/select-element.js +202 -0
  99. package/react/base/select-element.js.map +1 -0
  100. package/react/checkbox/index.cjs.js +2 -1
  101. package/react/checkbox/index.cjs.js.map +1 -1
  102. package/react/checkbox/index.js +2 -1
  103. package/react/checkbox/index.js.map +1 -1
  104. package/react/checkbox-group/index.cjs.js +3 -1
  105. package/react/checkbox-group/index.cjs.js.map +1 -1
  106. package/react/checkbox-group/index.js +3 -1
  107. package/react/checkbox-group/index.js.map +1 -1
  108. package/react/components/Accordion/sgds-accordion-item.cjs.js +7 -5
  109. package/react/components/Accordion/sgds-accordion-item.cjs.js.map +1 -1
  110. package/react/components/Accordion/sgds-accordion-item.js +7 -5
  111. package/react/components/Accordion/sgds-accordion-item.js.map +1 -1
  112. package/react/components/Button/button.cjs.js +1 -1
  113. package/react/components/Button/button.js +1 -1
  114. package/react/components/Button/sgds-button.cjs.js +1 -4
  115. package/react/components/Button/sgds-button.cjs.js.map +1 -1
  116. package/react/components/Button/sgds-button.js +1 -4
  117. package/react/components/Button/sgds-button.js.map +1 -1
  118. package/react/components/Checkbox/checkbox.cjs.js +1 -1
  119. package/react/components/Checkbox/checkbox.js +1 -1
  120. package/react/components/Checkbox/sgds-checkbox-group.cjs.js +33 -16
  121. package/react/components/Checkbox/sgds-checkbox-group.cjs.js.map +1 -1
  122. package/react/components/Checkbox/sgds-checkbox-group.js +34 -17
  123. package/react/components/Checkbox/sgds-checkbox-group.js.map +1 -1
  124. package/react/components/Checkbox/sgds-checkbox.cjs.js +9 -21
  125. package/react/components/Checkbox/sgds-checkbox.cjs.js.map +1 -1
  126. package/react/components/Checkbox/sgds-checkbox.js +9 -21
  127. package/react/components/Checkbox/sgds-checkbox.js.map +1 -1
  128. package/react/components/ComboBox/combo-box.cjs.js +1 -1
  129. package/react/components/ComboBox/combo-box.js +1 -1
  130. package/react/components/ComboBox/sgds-combo-box.cjs.js +12 -201
  131. package/react/components/ComboBox/sgds-combo-box.cjs.js.map +1 -1
  132. package/react/components/ComboBox/sgds-combo-box.js +13 -202
  133. package/react/components/ComboBox/sgds-combo-box.js.map +1 -1
  134. package/react/components/Dropdown/dropdown-menu.cjs.js +1 -1
  135. package/react/components/Dropdown/dropdown-menu.js +1 -1
  136. package/react/components/Dropdown/dropdown.cjs.js +1 -1
  137. package/react/components/Dropdown/dropdown.js +1 -1
  138. package/react/components/Dropdown/sgds-dropdown-item.cjs.js +3 -0
  139. package/react/components/Dropdown/sgds-dropdown-item.cjs.js.map +1 -1
  140. package/react/components/Dropdown/sgds-dropdown-item.js +3 -0
  141. package/react/components/Dropdown/sgds-dropdown-item.js.map +1 -1
  142. package/react/components/Mainnav/mainnav-dropdown.cjs.js +1 -1
  143. package/react/components/Mainnav/mainnav-dropdown.js +1 -1
  144. package/react/components/Mainnav/mainnav-item.cjs.js +1 -1
  145. package/react/components/Mainnav/mainnav-item.js +1 -1
  146. package/react/components/Mainnav/mainnav.cjs.js +1 -1
  147. package/react/components/Mainnav/mainnav.js +1 -1
  148. package/react/components/Select/select-item.cjs.js +67 -0
  149. package/react/components/Select/select-item.cjs.js.map +1 -0
  150. package/react/components/Select/select-item.cjs2.js +11 -0
  151. package/react/components/Select/select-item.cjs2.js.map +1 -0
  152. package/react/components/Select/select-item.js +62 -0
  153. package/react/components/Select/select-item.js.map +1 -0
  154. package/react/components/Select/select-item2.js +7 -0
  155. package/react/components/Select/select-item2.js.map +1 -0
  156. package/react/components/Select/select.cjs.js +11 -0
  157. package/react/components/Select/select.cjs.js.map +1 -0
  158. package/react/components/Select/select.js +7 -0
  159. package/react/components/Select/select.js.map +1 -0
  160. package/react/components/Select/sgds-select.cjs.js +164 -0
  161. package/react/components/Select/sgds-select.cjs.js.map +1 -0
  162. package/react/components/Select/sgds-select.js +159 -0
  163. package/react/components/Select/sgds-select.js.map +1 -0
  164. package/react/components/Subnav/sgds-subnav-item.cjs.js +74 -0
  165. package/react/components/Subnav/sgds-subnav-item.cjs.js.map +1 -0
  166. package/react/components/Subnav/sgds-subnav-item.js +69 -0
  167. package/react/components/Subnav/sgds-subnav-item.js.map +1 -0
  168. package/react/components/Subnav/sgds-subnav.cjs.js +259 -0
  169. package/react/components/Subnav/sgds-subnav.cjs.js.map +1 -0
  170. package/react/components/Subnav/sgds-subnav.js +254 -0
  171. package/react/components/Subnav/sgds-subnav.js.map +1 -0
  172. package/react/components/Subnav/subnav-item.cjs.js +11 -0
  173. package/react/components/Subnav/subnav-item.cjs.js.map +1 -0
  174. package/react/components/Subnav/subnav-item.js +7 -0
  175. package/react/components/Subnav/subnav-item.js.map +1 -0
  176. package/react/components/Subnav/subnav.cjs.js +11 -0
  177. package/react/components/Subnav/subnav.cjs.js.map +1 -0
  178. package/react/components/Subnav/subnav.js +7 -0
  179. package/react/components/Subnav/subnav.js.map +1 -0
  180. package/react/css/grid.cjs.js +11 -0
  181. package/react/css/grid.cjs.js.map +1 -0
  182. package/react/css/grid.js +7 -0
  183. package/react/css/grid.js.map +1 -0
  184. package/react/index.cjs.js +38 -32
  185. package/react/index.cjs.js.map +1 -1
  186. package/react/index.d.ts +3 -0
  187. package/react/index.js +3 -0
  188. package/react/index.js.map +1 -1
  189. package/react/select/index.cjs.js +46 -0
  190. package/react/select/index.cjs.js.map +1 -0
  191. package/react/select/index.d.ts +2 -0
  192. package/react/select/index.js +22 -0
  193. package/react/select/index.js.map +1 -0
  194. package/react/subnav/index.cjs.js +45 -0
  195. package/react/subnav/index.cjs.js.map +1 -0
  196. package/react/subnav/index.d.ts +2 -0
  197. package/react/subnav/index.js +21 -0
  198. package/react/subnav/index.js.map +1 -0
  199. package/react/subnav-item/index.cjs.js +40 -0
  200. package/react/subnav-item/index.cjs.js.map +1 -0
  201. package/react/subnav-item/index.d.ts +2 -0
  202. package/react/subnav-item/index.js +16 -0
  203. package/react/subnav-item/index.js.map +1 -0
  204. package/react/utils/breakpoints.cjs.js +4 -4
  205. package/react/utils/breakpoints.cjs.js.map +1 -1
  206. package/react/utils/breakpoints.js +4 -4
  207. package/react/utils/breakpoints.js.map +1 -1
  208. package/utils/breakpoints.d.ts +4 -4
  209. package/utils/breakpoints.js +4 -4
  210. package/utils/breakpoints.js.map +1 -1
@@ -4554,7 +4554,7 @@
4554
4554
  /** @internal */
4555
4555
  SgdsElement.dependencies = {};
4556
4556
 
4557
- var css_248z$2 = css`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md)}:host([variant=primary]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default);--btn-border-width:var(--sgds-border-width-1);--btn-border-color:var(--sgds-primary-border-color-default)}:host([variant=ghost]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-body);min-width:var(--sgds-dimension-96);padding:0 var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}.btn-ghost,.btn-outline,.btn-primary{color:var(--btn-color)}.btn-outline{border:var(--btn-border-width) solid var(--btn-border-color)}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background-color:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background-color:var(--btn-hover-bg);border-color:transparent;box-shadow:var(--sgds-box-shadow-focus);outline:0}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-50)}.btn-lg{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);min-width:var(--sgds-dimension-112);padding:0 var(--sgds-padding-xl)}.btn-sm{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);min-width:var(--sgds-dimension-80);padding:0 var(--sgds-padding-md)}.btn slot::slotted(*){color:var(--btn-color)}`;
4557
+ var css_248z$2 = css`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md)}:host([variant=primary]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default);--btn-border-width:var(--sgds-border-width-1);--btn-border-color:var(--sgds-primary-border-color-default)}:host([variant=ghost]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);min-width:var(--sgds-dimension-112);padding:0 var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);min-width:var(--sgds-dimension-80);padding:0 var(--sgds-padding-md)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-body);min-width:var(--sgds-dimension-96);padding:0 var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background-color:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background-color:var(--btn-hover-bg);border-color:transparent;box-shadow:var(--sgds-box-shadow-focus);outline:0}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-50)}.btn slot::slotted(*){color:var(--btn-color)}`;
4558
4558
 
4559
4559
  class ButtonElement extends SgdsElement {
4560
4560
  constructor() {
@@ -5039,11 +5039,11 @@
5039
5039
  defaultAnimationRegistry.set(animationName, ensureAnimation(animation));
5040
5040
  }
5041
5041
 
5042
- const LG_BREAKPOINT = 992;
5042
+ const LG_BREAKPOINT = 1024;
5043
5043
  const MD_BREAKPOINT = 768;
5044
- const SM_BREAKPOINT = 576;
5045
- const XL_BREAKPOINT = 1200;
5046
- const XXL_BREAKPOINT = 1400;
5044
+ const SM_BREAKPOINT = 512;
5045
+ const XL_BREAKPOINT = 1280;
5046
+ const XXL_BREAKPOINT = 1440;
5047
5047
 
5048
5048
  /** Waits for a specific event to be emitted from an element. Ignores events that bubble up from child elements. */
5049
5049
  function waitForEvent(el, eventName) {
@@ -5226,7 +5226,7 @@
5226
5226
  */
5227
5227
  const html = withStatic(html$1);
5228
5228
 
5229
- var css_248z$8 = css`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md)}:host([variant=primary]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default);--btn-border-width:var(--sgds-border-width-1);--btn-border-color:var(--sgds-primary-border-color-default)}:host([variant=ghost]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-body);min-width:var(--sgds-dimension-96);padding:0 var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}.btn-ghost,.btn-outline,.btn-primary{color:var(--btn-color)}.btn-outline{border:var(--btn-border-width) solid var(--btn-border-color)}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background-color:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background-color:var(--btn-hover-bg);border-color:transparent;box-shadow:var(--sgds-box-shadow-focus);outline:0}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-50)}.btn-lg{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);min-width:var(--sgds-dimension-112);padding:0 var(--sgds-padding-xl)}.btn-sm{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);min-width:var(--sgds-dimension-80);padding:0 var(--sgds-padding-md)}.btn slot::slotted(*){color:var(--btn-color)}`;
5229
+ var css_248z$8 = css`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md)}:host([variant=primary]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default);--btn-border-width:var(--sgds-border-width-1);--btn-border-color:var(--sgds-primary-border-color-default)}:host([variant=ghost]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);min-width:var(--sgds-dimension-112);padding:0 var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);min-width:var(--sgds-dimension-80);padding:0 var(--sgds-padding-md)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-body);min-width:var(--sgds-dimension-96);padding:0 var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background-color:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background-color:var(--btn-hover-bg);border-color:transparent;box-shadow:var(--sgds-box-shadow-focus);outline:0}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-50)}.btn slot::slotted(*){color:var(--btn-color)}`;
5230
5230
 
5231
5231
  class ButtonElement extends SgdsElement {
5232
5232
  constructor() {
@@ -5479,7 +5479,7 @@
5479
5479
 
5480
5480
  const MainnavContext = createContext("mainnav-context");
5481
5481
 
5482
- var css_248z$5 = css`nav{background-color:var(--sgds-surface-default);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08)}.navbar{align-items:stretch;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);justify-content:space-between;margin:auto;max-width:var(--sgds-mainnav-max-width);min-height:80px;padding:0 var(--sgds-mainnav-padding-x);position:relative;width:100%}@media screen and (max-width:768px){.navbar{padding:0 var(--sgds-mainnav-mobile-padding-x)}}.navbar-brand{align-items:center;display:flex;text-decoration:none;white-space:nowrap}.navbar-brand:focus,.navbar-brand:focus-visible{box-shadow:var(--sgds-box-shadow-focus);outline:0}.navbar-nav{display:flex;flex-direction:column;height:100%;margin-bottom:0;margin-top:0;width:100%}nav>.navbar-body{background-color:var(--sgds-surface-default);border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-translucent);bottom:0;box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08);padding:var(--sgds-padding-md) 0;position:absolute;transition:transform .2s ease-in-out;width:100%;z-index:2000}nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}@media screen and (max-width:768px){nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.navbar-collapse{align-items:center;flex-basis:100%;flex-grow:1}.navbar-toggler{align-self:center}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-nav-scroll{overflow-y:auto}@media (min-width:576px){.navbar-expand-sm{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}}@media (min-width:992px){.navbar-expand-lg{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}}@media (min-width:1200px){.navbar-expand-xl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xl .navbar-nav .nav-link{padding-left:var(--mainnav-nav-link-padding-x);padding-right:var(--mainnav-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}}@media (min-width:1400px){.navbar-expand-xxl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}}.navbar-expand{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}slot[name=non-collapsible]{align-items:center;display:flex;gap:var(--sgds-spacer-4);margin-left:auto}.slot-end{align-items:stretch;display:flex;gap:var(--sgds-gap-xs);margin-left:auto}.slot-end::slotted(:not([name$=-mainnav-item]):not([name$=-mainnav-dropdown])){align-self:center}`;
5482
+ var css_248z$5 = css`:host{z-index:1200}nav{background-color:var(--sgds-surface-default);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08)}.navbar{align-items:stretch;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);justify-content:space-between;margin:auto;max-width:var(--sgds-mainnav-max-width);min-height:80px;padding:0 var(--sgds-mainnav-padding-x);position:relative;width:100%}@media screen and (max-width:768px){.navbar{padding:0 var(--sgds-mainnav-mobile-padding-x)}}.navbar-brand{align-items:center;display:flex;text-decoration:none;white-space:nowrap}.navbar-brand:focus,.navbar-brand:focus-visible{box-shadow:var(--sgds-box-shadow-focus);outline:0}.navbar-nav{display:flex;flex-direction:column;height:100%;margin-bottom:0;margin-top:0;width:100%}nav>.navbar-body{background-color:var(--sgds-surface-default);border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-translucent);bottom:0;box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08);padding:var(--sgds-padding-md) 0;position:absolute;transition:transform .2s ease-in-out;width:100%;z-index:2000}nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}@media screen and (max-width:768px){nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.navbar-collapse{align-items:center;flex-basis:100%;flex-grow:1}.navbar-toggler{align-self:center}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-nav-scroll{overflow-y:auto}@media (min-width:576px){.navbar-expand-sm{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}}@media (min-width:992px){.navbar-expand-lg{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}}@media (min-width:1200px){.navbar-expand-xl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xl .navbar-nav .nav-link{padding-left:var(--mainnav-nav-link-padding-x);padding-right:var(--mainnav-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}}@media (min-width:1400px){.navbar-expand-xxl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}}.navbar-expand{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}slot[name=non-collapsible]{align-items:center;display:flex;gap:var(--sgds-spacer-4);margin-left:auto}.slot-end{align-items:stretch;display:flex;gap:var(--sgds-gap-xs);margin-left:auto}.slot-end::slotted(:not([name$=-mainnav-item]):not([name$=-mainnav-dropdown])){align-self:center}`;
5483
5483
 
5484
5484
  const SIZES = {
5485
5485
  sm: SM_BREAKPOINT,
@@ -5764,11 +5764,11 @@
5764
5764
  options: { duration: 200, easing: "ease-in-out" }
5765
5765
  });
5766
5766
 
5767
- var css_248z$4 = css`:host{position:relative}.dropdown{display:flex;height:100%}`;
5767
+ var css_248z$4 = css`:host{position:relative}.dropdown{display:flex;height:inherit}`;
5768
5768
 
5769
- var css_248z$3 = css`.dropdown-menu{background-clip:padding-box;background-color:var(--sgds-surface-default);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 1px 0 hsla(0,0%,5%,.12),0 4px 8px 0 hsla(0,0%,5%,.12);color:var(--sgds-color-default);display:none;list-style:none;margin:0;min-width:var(--sgds-dimension-280);overflow-y:auto;padding:var(--sgds-padding-xs) 0;position:absolute;text-align:left;z-index:1000}.dropdown .dropdown-menu{max-height:var(--sgds-dimension-192)}.dropdown-menu.show{display:block}.nav-tabs .dropdown-menu{border-top-left-radius:0;border-top-right-radius:0;margin-top:calc(var(--sgds-nav-tabs-border-width)*-1)}@media (min-width:576px){.navbar-expand-sm .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:768px){.navbar-expand-md .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:992px){.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:1200px){.navbar-expand-xl .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:1400px){.navbar-expand-xxl .navbar-nav .dropdown-menu{position:absolute}}.navbar-expand .navbar-nav .dropdown-menu{position:absolute}.sgds.navbar .dropdown-menu.megamenu{left:0;right:0;width:100%}.sgds.combobox>.dropdown-menu{min-width:100%}`;
5769
+ var css_248z$3 = css`.dropdown-menu{background-clip:padding-box;background-color:var(--sgds-surface-default);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 1px 0 hsla(0,0%,5%,.12),0 4px 8px 0 hsla(0,0%,5%,.12);color:var(--sgds-color-default);display:none;list-style:none;margin:0;max-height:var(--sgds-dimension-480);min-width:var(--sgds-dimension-280);overflow-y:auto;padding:var(--sgds-padding-xs) 0;position:absolute;text-align:left;z-index:1000}.dropdown-menu.show{display:block}.nav-tabs .dropdown-menu{border-top-left-radius:0;border-top-right-radius:0;margin-top:calc(var(--sgds-nav-tabs-border-width)*-1)}@media (min-width:576px){.navbar-expand-sm .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:768px){.navbar-expand-md .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:992px){.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:1200px){.navbar-expand-xl .navbar-nav .dropdown-menu{position:absolute}}@media (min-width:1400px){.navbar-expand-xxl .navbar-nav .dropdown-menu{position:absolute}}.navbar-expand .navbar-nav .dropdown-menu{position:absolute}.sgds.navbar .dropdown-menu.megamenu{left:0;right:0;width:100%}.sgds.combobox>.dropdown-menu{min-width:100%}`;
5770
5770
 
5771
- var css_248z$2 = css`:host([expand=always]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media (min-width:576px){:host([expand=sm]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=sm]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:768px){:host([expand=md]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=md]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:992px){:host(:not([expand])) .nav-link,:host([expand=lg]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=lg]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:1200px){:host([expand=xl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=xl]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:1400px){:host([expand=xxl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=xxl]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}.nav-link{align-items:center;cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}@media screen and (max-width:768px){.nav-link{padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.nav-link.show,.nav-link:not(.disabled).active{border-color:var(--sgds-primary-border-color-default);color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):hover{color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):focus,.nav-link:not(.disabled):focus-visible{outline:0}.nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-primary-color-default)}.nav-link.disabled{cursor:not-allowed;opacity:var(--sgds-opacity-50)}.dropdown-items{background-color:var(--sgds-surface-default);height:100%;left:100%;padding:var(--sgds-padding-md) 0;position:absolute;top:0;width:100%}.dropdown-items a{align-items:center;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}.dropdown-items a:hover{color:var(--sgds-primary-color-default)}.dropdown-items a:focus,.dropdown-items a:focus-visible{outline:0}.dropdown-items a:focus-visible{box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-primary-color-default)}slot[name=toggler]::slotted(*){flex:1}`;
5771
+ var css_248z$2 = css`:host([expand=always]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media (min-width:512px){:host([expand=sm]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=sm]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:768px){:host([expand=md]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=md]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:1024px){:host(:not([expand])) .nav-link,:host([expand=lg]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=lg]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:1280px){:host([expand=xl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=xl]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}@media (min-width:1440px){:host([expand=xxl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host([expand=xxl]) .nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus)}}.nav-link{align-items:center;cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}@media screen and (max-width:767px){.nav-link{padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.nav-link.show,.nav-link:not(.disabled).active{border-color:var(--sgds-primary-border-color-default);color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):hover{color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):focus,.nav-link:not(.disabled):focus-visible{outline:0}.nav-link:not(.disabled):focus-visible{box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-primary-color-default)}.nav-link.disabled{cursor:not-allowed;opacity:var(--sgds-opacity-50)}.dropdown-items{background-color:var(--sgds-surface-default);height:100%;left:100%;padding:var(--sgds-padding-md) 0;position:absolute;top:0;width:100%}.dropdown-items a{align-items:center;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}.dropdown-items a:hover{color:var(--sgds-primary-color-default)}.dropdown-items a:focus,.dropdown-items a:focus-visible{outline:0}.dropdown-items a:focus-visible{box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-primary-color-default)}slot[name=toggler]::slotted(*){flex:1}sgds-dropdown{height:100%}`;
5772
5772
 
5773
5773
  /**
5774
5774
  * @license
@@ -9810,6 +9810,9 @@
9810
9810
  this.anchor[0].click();
9811
9811
  }
9812
9812
  });
9813
+ this.addEventListener("click", () => {
9814
+ this.anchor.length > 0 && this.anchor[0].click();
9815
+ });
9813
9816
  this.setAttribute("role", "menuitem");
9814
9817
  this.setAttribute("aria-disabled", `${this.disabled}`);
9815
9818
  }
@@ -10109,7 +10112,7 @@
10109
10112
  queryAssignedElements()
10110
10113
  ], SgdsMainnavDropdown.prototype, "defaultNodes", void 0);
10111
10114
 
10112
- var css_248z = css`:host([expand=always]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media screen and (min-width:576px){:host([expand=sm]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=sm]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=sm]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:768px){:host([expand=md]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=md]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=md]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:992px){:host([expand=lg]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=lg]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=lg]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:1200px){:host([expand=xl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=xl]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:1400px){:host([expand=xxl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xxl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=xxl]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (max-width:576px){:host(:not([disabled])[active][expand=sm]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:768px){:host(:not([disabled])[active][expand=md]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:992px){:host(:not([disabled])[active][expand=lg]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1200px){:host(:not([disabled])[active][expand=xl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1400px){:host(:not([disabled])[active][expand=xxl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}::slotted(*){--sgds-link-color-default:var(--sgds-color-default);align-items:center;box-sizing:border-box;color:var(--sgds-link-color-default,var(--sgds-color-default));cursor:pointer;display:flex;height:auto!important;padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none!important;text-decoration:none}@media screen and (max-width:768px){::slotted(*){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}:host(:not([disabled])[active]) ::slotted(*){--sgds-link-color-default:var(--sgds-primary-color-default);color:var(--sgds-link-color-default,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-color-default))}:host(:not([disabled])) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}::slotted(a:focus),::slotted(a:focus-visible){outline:0}::slotted(a:focus-visible){--sgds-link-color-emphasis:var(--sgds-primary-color-default);box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(*){cursor:not-allowed;opacity:var(--sgds-opacity-50)}`;
10115
+ var css_248z = css`:host([expand=always]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media screen and (min-width:512px){:host([expand=sm]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=sm]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=sm]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:768px){:host([expand=md]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=md]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=md]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:1024px){:host([expand=lg]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=lg]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=lg]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:1280px){:host([expand=xl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=xl]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (min-width:1440px){:host([expand=xxl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xxl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}:host([expand=xxl]) ::slotted(a:focus-visible){box-shadow:var(--sgds-box-shadow-focus)}}@media screen and (max-width:511px){:host(:not([disabled])[active][expand=sm]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:767px){:host(:not([disabled])[active][expand=md]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1023px){:host(:not([disabled])[active][expand=lg]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1279px){:host(:not([disabled])[active][expand=xl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1439px){:host(:not([disabled])[active][expand=xxl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}::slotted(*){--sgds-link-color-default:var(--sgds-color-default);align-items:center;box-sizing:border-box;color:var(--sgds-link-color-default,var(--sgds-color-default));cursor:pointer;display:flex;height:auto!important;padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none!important;text-decoration:none}@media screen and (max-width:767px){::slotted(*){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}:host(:not([disabled])[active]) ::slotted(*){--sgds-link-color-default:var(--sgds-primary-color-default);color:var(--sgds-link-color-default,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-color-default))}:host(:not([disabled])) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}::slotted(a:focus),::slotted(a:focus-visible){outline:0}::slotted(a:focus-visible){--sgds-link-color-emphasis:var(--sgds-primary-color-default);box-shadow:var(--sgds-box-shadow-focus) inset;color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(*){cursor:not-allowed;opacity:var(--sgds-opacity-50)}`;
10113
10116
 
10114
10117
  /**
10115
10118
  * @slot default - slot for SgdsMainnavItem element.