@primer/react-brand 0.72.0-rc.44ea78b6 → 0.72.0-rc.4db5fc89

package/esm/NavList/NavList.module.js

@@ -1,30 +1,30 @@
-import './NavList.module-CZFnt8br.css';var e = {
+import './NavList.module-zvpwnkzz.css';var e = {
 	NavList: "Primer_Brand__NavList-module__NavList___tuR_C",
 	NavList__list: "Primer_Brand__NavList-module__NavList__list___gwquf",
 	NavList__subNav: "Primer_Brand__NavList-module__NavList__subNav___Q4xI7",
 	NavList__groupList: "Primer_Brand__NavList-module__NavList__groupList___Mtk4a",
 	"NavList__list--flat": "Primer_Brand__NavList-module__NavList__list--flat___xvRQl",
+	"NavList__item--leaf": "Primer_Brand__NavList-module__NavList__item--leaf___YFNSZ",
 	NavList__item: "Primer_Brand__NavList-module__NavList__item___HTVCC",
 	NavList__group: "Primer_Brand__NavList-module__NavList__group___Jnwkd",
 	NavList__groupTitle: "Primer_Brand__NavList-module__NavList__groupTitle___r47_e",
 	NavList__itemContent: "Primer_Brand__NavList-module__NavList__itemContent___bYaVR",
+	"NavList__item--level-2": "Primer_Brand__NavList-module__NavList__item--level-2___kXyLx",
+	"NavList__item--level-3": "Primer_Brand__NavList-module__NavList__item--level-3___Z5uiQ",
+	"NavList__item--level-4": "Primer_Brand__NavList-module__NavList__item--level-4___k3h0P",
+	"NavList__item--level-5": "Primer_Brand__NavList-module__NavList__item--level-5___4mJ4N",
+	"NavList__item--level-1": "Primer_Brand__NavList-module__NavList__item--level-1___gWx1n",
 	NavList__link: "Primer_Brand__NavList-module__NavList__link___k0zio",
 	NavList__accordionButton: "Primer_Brand__NavList-module__NavList__accordionButton___F5tOc",
-	"NavList__item--level-1": "Primer_Brand__NavList-module__NavList__item--level-1___gWx1n",
 	NavList__labelArea: "Primer_Brand__NavList-module__NavList__labelArea___c4ORu",
 	"NavList__item--has-current-descendant": "Primer_Brand__NavList-module__NavList__item--has-current-descendant___JG7dQ",
-	"NavList__item--leaf": "Primer_Brand__NavList-module__NavList__item--leaf___YFNSZ",
 	"NavList__link--disabled": "Primer_Brand__NavList-module__NavList__link--disabled___Eg304",
 	NavList__label: "Primer_Brand__NavList-module__NavList__label___ogBmt",
 	NavList__leadingVisual: "Primer_Brand__NavList-module__NavList__leadingVisual___KqRaq",
 	NavList__trailingVisual: "Primer_Brand__NavList-module__NavList__trailingVisual___BrZXI",
 	NavList__toggleIcon: "Primer_Brand__NavList-module__NavList__toggleIcon___nlJbF",
 	"NavList__subNav--expanded": "Primer_Brand__NavList-module__NavList__subNav--expanded___ap3X8",
-	"NavList__item--expanded": "Primer_Brand__NavList-module__NavList__item--expanded___pH_PL",
-	"NavList__item--level-2": "Primer_Brand__NavList-module__NavList__item--level-2___kXyLx",
-	"NavList__item--level-3": "Primer_Brand__NavList-module__NavList__item--level-3___Z5uiQ",
-	"NavList__item--level-4": "Primer_Brand__NavList-module__NavList__item--level-4___k3h0P",
-	"NavList__item--level-5": "Primer_Brand__NavList-module__NavList__item--level-5___4mJ4N"
+	"NavList__item--expanded": "Primer_Brand__NavList-module__NavList__item--expanded___pH_PL"
 };
 //#endregion
 export { e as default };

package/esm/NavList/NavList.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavList.module.js","names":[],"sources":["../../src/NavList/NavList.module.css"],"sourcesContent":[".NavList {\n  box-sizing: border-box;\n  font-family: var(--brand-fontStack-sansSerif);\n  color: var(--brand-color-text-default);\n  padding-inline-start: var(--base-size-16);\n  width: 100%;\n}\n\n.NavList__list,\n.NavList__subNav,\n.NavList__groupList {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.NavList__list {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n}\n\n.NavList__list--flat,\n.NavList__groupList {\n  --brand-NavList-alignedLabel-paddingInlineStart: var(--base-size-2);\n}\n\n.NavList__groupList {\n  --brand-NavList-item-paddingInlineStart-level-2: var(--base-size-2);\n}\n\n.NavList__item,\n.NavList__group {\n  position: relative;\n}\n\n.NavList__list:not(.NavList__list--flat) > :is(.NavList__item, .NavList__group) + :is(.NavList__item, .NavList__group) {\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--brand-color-border-muted) 0 var(--base-size-2),\n    transparent var(--base-size-2) var(--base-size-4)\n  );\n  background-repeat: no-repeat;\n  background-size: 100% var(--brand-borderWidth-thin);\n  background-position: top left;\n}\n\n.NavList__groupTitle {\n  margin: 0;\n  padding: var(--base-size-24) var(--base-size-16) var(--base-size-16);\n  color: var(--brand-color-text-default);\n  font-size: var(--brand-text-size-200);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.NavList__groupList {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  padding-block-end: var(--base-size-16);\n}\n\n.NavList__itemContent {\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  min-width: 0;\n}\n\n.NavList__link {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  flex: 1 1 auto;\n  min-width: 0;\n  border-radius: var(--brand-borderRadius-medium);\n  padding: 0;\n  color: var(--brand-color-text-muted);\n  font-size: var(--brand-text-size-100);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-100);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n  text-decoration: none !important; /* dotcom override */\n  transition: background-color var(--brand-animation-duration-fast) var(--brand-animation-easing-default),\n    color var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.NavList__accordionButton {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  border: 0;\n  background: transparent;\n  color: var(--brand-color-text-muted);\n  cursor: pointer;\n  font-family: inherit;\n  text-align: start;\n}\n\n.NavList__link:hover {\n  color: var(--brand-color-text-default);\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__accordionButton:hover {\n  color: var(--brand-color-text-default);\n  background-color: transparent;\n}\n\n.NavList__item:not(.NavList__item--level-1) > .NavList__itemContent .NavList__accordionButton .NavList__labelArea {\n  order: 2;\n  min-height: var(--base-size-32);\n  padding-inline-start: var(--base-size-6);\n}\n\n.NavList__item:not(.NavList__item--level-1)\n  > .NavList__itemContent\n  .NavList__accordionButton:not(:disabled):hover\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__item--has-current-descendant > .NavList__itemContent .NavList__accordionButton:not(:disabled) {\n  color: var(--brand-color-text-default);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n:is(.NavList__link, .NavList__accordionButton):focus-visible {\n  outline: var(--brand-borderWidth-thick) solid var(--brand-color-focus);\n  outline-offset: var(--base-size-2);\n}\n\n.NavList__subNav :is(.NavList__link, .NavList__accordionButton):focus-visible {\n  outline-offset: calc(-1 * var(--base-size-2));\n}\n\n.NavList__link[aria-current]:not([aria-current='false']) {\n  color: var(--brand-color-text-default);\n  background-color: var(--brand-color-canvas-subtle);\n  padding-inline-start: var(--base-size-6);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) .NavList__link[aria-current]:not([aria-current='false'])::before {\n  content: '';\n  position: absolute;\n  inset-block: var(--base-size-8);\n  inset-inline-start: 0;\n  width: var(--base-size-4);\n  border-radius: var(--base-size-2);\n  background-color: var(--brand-NavList-activeIndicator-color);\n}\n\n.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)::before {\n  content: '';\n  position: absolute;\n  inset-block-start: 50%;\n  block-size: var(--base-size-16);\n  width: var(--base-size-4);\n  border-radius: var(--base-size-2);\n  background-color: var(--brand-NavList-activeIndicator-color);\n  transform: translateY(-50%);\n  z-index: 1;\n}\n\n.NavList__item--level-1.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']::before {\n  inset-inline-start: calc(-1 * var(--base-size-8));\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']::before {\n  inset-inline-start: var(--base-size-4);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false'] {\n  padding-inline-start: var(--base-size-12);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']\n  .NavList__labelArea {\n  padding-inline-start: var(--base-size-2);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__link[aria-current]:not([aria-current='false']) {\n  padding-inline-start: 0;\n}\n\n.NavList__link--disabled {\n  color: var(--brand-color-text-disabled);\n  pointer-events: none;\n}\n\n.NavList__accordionButton:disabled {\n  color: var(--brand-color-text-disabled);\n  cursor: not-allowed;\n}\n\n.NavList__label {\n  min-width: 0;\n  word-break: break-word;\n}\n\n.NavList__labelArea {\n  display: flex;\n  align-items: center;\n  flex: 1 1 auto;\n  gap: var(--base-size-8);\n  min-width: 0;\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__leadingVisual,\n.NavList__trailingVisual {\n  display: inline-flex;\n  flex: none;\n  color: inherit;\n}\n\n.NavList__trailingVisual {\n  margin-inline-start: auto;\n  margin-inline-end: var(--base-size-6);\n}\n\n.NavList__toggleIcon {\n  flex: none;\n  transform-origin: 50% 50%;\n  transition: transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide);\n}\n\n.NavList__accordionButton[aria-expanded='true'] .NavList__toggleIcon {\n  transform: rotate(-180deg);\n}\n\n.NavList__subNav {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  margin: 0;\n  max-height: 0;\n  opacity: 0;\n  overflow: hidden;\n  padding: 0;\n  transform: translateY(calc(-1 * var(--base-size-8)));\n  visibility: hidden;\n  transition: max-height var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    visibility 0s linear var(--brand-animation-duration-fast);\n}\n\n.NavList__subNav--expanded {\n  max-height: var(--brand-NavList-subNav-height, none);\n  opacity: 1;\n  transform: translateY(0);\n  visibility: visible;\n  transition: max-height var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide), visibility 0s linear 0s;\n}\n\n.NavList__subNav[aria-hidden='true'] .NavList__subNav {\n  visibility: hidden;\n}\n\n.NavList__item--level-1 > .NavList__itemContent {\n  padding: var(--base-size-24) var(--base-size-16) var(--base-size-16);\n}\n\n.NavList__item--level-1.NavList__item--expanded {\n  padding-block-end: var(--base-size-16);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__link {\n  order: 1;\n  font-size: var(--brand-text-size-200);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-200);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton {\n  color: var(--brand-color-text-default);\n  min-height: var(--base-size-32);\n  margin-block: calc(-1 * var(--base-size-8));\n  padding-inline-start: 0;\n  padding-inline-end: var(--base-size-6);\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton > * {\n  position: relative;\n  z-index: 1;\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton:not(:disabled):is(:hover, :active)::after,\n.NavList__item--level-1.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)::after {\n  content: '';\n  position: absolute;\n  z-index: 0;\n  inset-block: 0;\n  inset-inline-start: 0;\n  inset-inline-end: 0;\n  border-radius: var(--brand-borderRadius-small);\n  background-color: var(--brand-color-canvas-subtle);\n  pointer-events: none;\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__toggleIcon {\n  order: 2;\n  margin-inline-start: auto;\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4) > .NavList__itemContent {\n  padding-block: calc(var(--base-size-8) + var(--base-size-2));\n  padding-inline-end: var(--base-size-16);\n}\n\n.NavList__item--level-2 > .NavList__itemContent {\n  padding-inline-start: var(--brand-NavList-item-paddingInlineStart-level-2, var(--base-size-24));\n}\n\n.NavList__item--level-3 > .NavList__itemContent {\n  padding-inline-start: var(--base-size-40);\n}\n\n.NavList__item--level-4 > .NavList__itemContent {\n  padding-inline-start: calc(var(--base-size-48) + var(--base-size-8));\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent {\n  min-height: var(--base-size-32);\n  padding-block: 0;\n  padding-inline: var(--base-size-16);\n}\n\n.NavList__item--leaf.NavList__item--level-2 > .NavList__itemContent {\n  padding-inline-start: var(--brand-NavList-alignedLabel-paddingInlineStart, var(--base-size-24));\n}\n\n.NavList__item--leaf.NavList__item--level-3 > .NavList__itemContent {\n  padding-inline-start: var(--base-size-40);\n}\n\n.NavList__item--leaf.NavList__item--level-4 > .NavList__itemContent {\n  padding-inline-start: calc(var(--base-size-48) + var(--base-size-8));\n}\n\n.NavList__item--leaf.NavList__item--level-5 > .NavList__itemContent {\n  padding-inline-start: calc(var(--base-size-64) + var(--base-size-8));\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__toggleIcon {\n  order: 1;\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__accordionButton {\n  min-height: var(--base-size-32);\n  margin-block: calc(-1 * var(--base-size-8));\n  padding-inline-start: var(--base-size-8);\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__toggleIcon {\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: calc(-1 * var(--base-size-8));\n  transform: translateY(-50%);\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='true']\n  .NavList__toggleIcon {\n  transform: translateY(-50%) rotate(-180deg);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']\n  .NavList__toggleIcon {\n  inset-inline-start: calc(-1 * var(--base-size-16));\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4, .NavList__item--level-5)\n  > .NavList__itemContent\n  .NavList__link {\n  order: 2;\n  font-size: var(--brand-text-size-100);\n  line-height: var(--brand-text-lineHeight-100);\n}\n\n.NavList__list--flat > .NavList__item--leaf > .NavList__itemContent .NavList__link {\n  font-size: var(--brand-text-size-200);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link {\n  min-height: var(--base-size-32);\n  padding-inline-start: var(--base-size-8);\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__labelArea {\n  min-height: calc(var(--base-size-32) - var(--brand-borderWidth-thin));\n  margin-block-end: var(--brand-borderWidth-thin);\n  padding-inline-start: var(--base-size-6);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) .NavList__link[aria-current]:not([aria-current='false']) {\n  background-color: transparent;\n  padding-inline-start: var(--base-size-8);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link:hover .NavList__labelArea,\n.NavList__item--leaf:not(.NavList__item--level-1)\n  .NavList__link[aria-current]:not([aria-current='false'])\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link:hover {\n  background-color: transparent;\n  padding-inline-start: var(--base-size-8);\n}\n\n[data-color-mode='dark'] .NavList {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .NavList,\n  .NavList::before,\n  .NavList::after,\n  .NavList * {\n    animation: none !important;\n    transition: none !important;\n    scroll-behavior: auto !important;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"NavList.module.js","names":[],"sources":["../../src/NavList/NavList.module.css"],"sourcesContent":[".NavList {\n  --brand-NavList-label-indent-level-2: 0px;\n  --brand-NavList-label-indent-level-3: var(--base-size-16);\n  --brand-NavList-label-indent-level-4: var(--base-size-32);\n  --brand-NavList-label-indent-level-5: var(--base-size-48);\n  --brand-NavList-item-paddingInlineStart-base: var(--base-size-24);\n  --brand-NavList-control-paddingInlineStart: var(--base-size-8);\n  --brand-NavList-label-paddingInlineStart: var(--base-size-6);\n\n  box-sizing: border-box;\n  font-family: var(--brand-fontStack-sansSerif);\n  color: var(--brand-color-text-default);\n  padding-inline-start: var(--base-size-16);\n  width: 100%;\n}\n\n.NavList__list,\n.NavList__subNav,\n.NavList__groupList {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.NavList__list {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n}\n\n.NavList__list--flat,\n.NavList__groupList {\n  --brand-NavList-item-paddingInlineStart-base: var(--base-size-2);\n}\n\n.NavList__groupList .NavList__subNav .NavList__item--leaf {\n  --brand-NavList-item-paddingInlineStart-base: 0px;\n  --brand-NavList-label-paddingInlineStart: var(--base-size-8);\n}\n\n.NavList__item,\n.NavList__group {\n  position: relative;\n}\n\n.NavList__list:not(.NavList__list--flat) > :is(.NavList__item, .NavList__group) + :is(.NavList__item, .NavList__group) {\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--brand-color-border-muted) 0 var(--base-size-2),\n    transparent var(--base-size-2) var(--base-size-4)\n  );\n  background-repeat: no-repeat;\n  background-size: 100% var(--brand-borderWidth-thin);\n  background-position: top left;\n}\n\n.NavList__groupTitle {\n  margin: 0;\n  padding: var(--base-size-24) var(--base-size-16) var(--base-size-16);\n  color: var(--brand-color-text-default);\n  font-size: var(--brand-text-size-200);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.NavList__groupList {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  padding-block-end: var(--base-size-16);\n}\n\n.NavList__itemContent {\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  min-width: 0;\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4) > .NavList__itemContent {\n  padding-block: calc(var(--base-size-8) + var(--base-size-2));\n  padding-inline-end: var(--base-size-16);\n}\n\n.NavList__item--level-2 {\n  --brand-NavList-item-label-indent: var(--brand-NavList-label-indent-level-2);\n}\n\n.NavList__item--level-3 {\n  --brand-NavList-item-label-indent: var(--brand-NavList-label-indent-level-3);\n}\n\n.NavList__item--level-4 {\n  --brand-NavList-item-label-indent: var(--brand-NavList-label-indent-level-4);\n}\n\n.NavList__item--level-5 {\n  --brand-NavList-item-label-indent: var(--brand-NavList-label-indent-level-5);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent {\n  min-height: var(--base-size-32);\n  padding-block: 0;\n  padding-inline-end: var(--base-size-16);\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4, .NavList__item--level-5)\n  > .NavList__itemContent {\n  padding-inline-start: calc(\n    var(--brand-NavList-item-paddingInlineStart-base) + var(--brand-NavList-item-label-indent)\n  );\n}\n\n.NavList__item:not(.NavList__item--level-1) > .NavList__itemContent :is(.NavList__link, .NavList__accordionButton) {\n  padding-inline-start: var(--brand-NavList-control-paddingInlineStart);\n}\n\n.NavList__item:not(.NavList__item--level-1) > .NavList__itemContent .NavList__labelArea {\n  padding-inline-start: var(--brand-NavList-label-paddingInlineStart);\n}\n\n.NavList__link {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  flex: 1 1 auto;\n  min-width: 0;\n  border-radius: var(--brand-borderRadius-medium);\n  padding: 0;\n  color: var(--brand-color-text-muted);\n  font-size: var(--brand-text-size-100);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-100);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n  text-decoration: none !important; /* dotcom override */\n  transition: background-color var(--brand-animation-duration-fast) var(--brand-animation-easing-default),\n    color var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.NavList__accordionButton {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  border: 0;\n  background: transparent;\n  color: var(--brand-color-text-muted);\n  cursor: pointer;\n  font-family: inherit;\n  text-align: start;\n}\n\n.NavList__link:hover {\n  color: var(--brand-color-text-default);\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__accordionButton:hover {\n  color: var(--brand-color-text-default);\n  background-color: transparent;\n}\n\n.NavList__item:not(.NavList__item--level-1) > .NavList__itemContent .NavList__accordionButton .NavList__labelArea {\n  order: 2;\n  min-height: var(--base-size-32);\n}\n\n.NavList__item:not(.NavList__item--level-1)\n  > .NavList__itemContent\n  .NavList__accordionButton:not(:disabled):hover\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__item--has-current-descendant > .NavList__itemContent .NavList__accordionButton:not(:disabled) {\n  color: var(--brand-color-text-default);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n:is(.NavList__link, .NavList__accordionButton):focus-visible {\n  outline: var(--brand-borderWidth-thick) solid var(--brand-color-focus);\n  outline-offset: var(--base-size-2);\n}\n\n.NavList__subNav :is(.NavList__link, .NavList__accordionButton):focus-visible {\n  outline-offset: calc(-1 * var(--base-size-2));\n}\n\n.NavList__link[aria-current]:not([aria-current='false']) {\n  color: var(--brand-color-text-default);\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) .NavList__link[aria-current]:not([aria-current='false'])::before {\n  content: '';\n  position: absolute;\n  inset-block: var(--base-size-8);\n  inset-inline-start: 0;\n  width: var(--base-size-4);\n  border-radius: var(--base-size-2);\n  background-color: var(--brand-NavList-activeIndicator-color);\n}\n\n.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)::before {\n  content: '';\n  position: absolute;\n  inset-block-start: 50%;\n  block-size: var(--base-size-16);\n  width: var(--base-size-4);\n  border-radius: var(--base-size-2);\n  background-color: var(--brand-NavList-activeIndicator-color);\n  transform: translateY(-50%);\n  z-index: 1;\n}\n\n.NavList__item--level-1.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']::before {\n  inset-inline-start: calc(-1 * var(--base-size-8));\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']::before {\n  inset-inline-start: var(--base-size-4);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false'] {\n  padding-inline-start: var(--base-size-12);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']\n  .NavList__labelArea {\n  padding-inline-start: var(--base-size-2);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__link[aria-current]:not([aria-current='false']) {\n  padding-inline-start: 0;\n}\n\n.NavList__link--disabled {\n  color: var(--brand-color-text-disabled);\n  pointer-events: none;\n}\n\n.NavList__accordionButton:disabled {\n  color: var(--brand-color-text-disabled);\n  cursor: not-allowed;\n}\n\n.NavList__label {\n  min-width: 0;\n  word-break: break-word;\n}\n\n.NavList__labelArea {\n  display: flex;\n  align-items: center;\n  flex: 1 1 auto;\n  gap: var(--base-size-8);\n  min-width: 0;\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__leadingVisual,\n.NavList__trailingVisual {\n  display: inline-flex;\n  flex: none;\n  color: inherit;\n}\n\n.NavList__trailingVisual {\n  margin-inline-start: auto;\n  margin-inline-end: var(--base-size-6);\n}\n\n.NavList__toggleIcon {\n  flex: none;\n  transform-origin: 50% 50%;\n  transition: transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide);\n}\n\n.NavList__accordionButton[aria-expanded='true'] .NavList__toggleIcon {\n  transform: rotate(-180deg);\n}\n\n.NavList__subNav {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  margin: 0;\n  max-height: 0;\n  opacity: 0;\n  overflow: hidden;\n  padding: 0;\n  transform: translateY(calc(-1 * var(--base-size-8)));\n  visibility: hidden;\n  transition: max-height var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    visibility 0s linear var(--brand-animation-duration-fast);\n}\n\n.NavList__subNav--expanded {\n  max-height: var(--brand-NavList-subNav-height, none);\n  opacity: 1;\n  transform: translateY(0);\n  visibility: visible;\n  transition: max-height var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-glide),\n    transform var(--brand-animation-duration-fast) var(--brand-animation-easing-glide), visibility 0s linear 0s;\n}\n\n.NavList__subNav[aria-hidden='true'] .NavList__subNav {\n  visibility: hidden;\n}\n\n.NavList__item--level-1 > .NavList__itemContent {\n  padding: var(--base-size-24) var(--base-size-16) var(--base-size-16);\n}\n\n.NavList__item--level-1.NavList__item--expanded {\n  padding-block-end: var(--base-size-16);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__link {\n  order: 1;\n  font-size: var(--brand-text-size-200);\n  font-weight: var(--brand-text-weight-500);\n  line-height: var(--brand-text-lineHeight-200);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton {\n  color: var(--brand-color-text-default);\n  min-height: var(--base-size-32);\n  margin-block: calc(-1 * var(--base-size-8));\n  padding-inline-start: 0;\n  padding-inline-end: var(--base-size-6);\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton > * {\n  position: relative;\n  z-index: 1;\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__accordionButton:not(:disabled):is(:hover, :active)::after,\n.NavList__item--level-1.NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']:not(:disabled)::after {\n  content: '';\n  position: absolute;\n  z-index: 0;\n  inset-block: 0;\n  inset-inline-start: 0;\n  inset-inline-end: 0;\n  border-radius: var(--brand-borderRadius-small);\n  background-color: var(--brand-color-canvas-subtle);\n  pointer-events: none;\n}\n\n.NavList__item--level-1 > .NavList__itemContent .NavList__toggleIcon {\n  order: 2;\n  margin-inline-start: auto;\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__toggleIcon {\n  order: 1;\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__accordionButton {\n  min-height: var(--base-size-32);\n  margin-block: calc(-1 * var(--base-size-8));\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__toggleIcon {\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: calc(-1 * var(--brand-NavList-control-paddingInlineStart));\n  transform: translateY(-50%);\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='true']\n  .NavList__toggleIcon {\n  transform: translateY(-50%) rotate(-180deg);\n}\n\n.NavList__item:not(.NavList__item--level-1).NavList__item--has-current-descendant\n  > .NavList__itemContent\n  .NavList__accordionButton[aria-expanded='false']\n  .NavList__toggleIcon {\n  inset-inline-start: calc(-1 * var(--base-size-16));\n}\n\n.NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4, .NavList__item--level-5)\n  > .NavList__itemContent\n  .NavList__link {\n  order: 2;\n  font-size: var(--brand-text-size-100);\n  line-height: var(--brand-text-lineHeight-100);\n}\n\n.NavList__list--flat > .NavList__item--leaf > .NavList__itemContent .NavList__link {\n  font-size: var(--brand-text-size-200);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link {\n  min-height: var(--base-size-32);\n  border-radius: var(--brand-borderRadius-small);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__labelArea {\n  min-height: calc(var(--base-size-32) - var(--brand-borderWidth-thin));\n  margin-block-end: var(--brand-borderWidth-thin);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) .NavList__link[aria-current]:not([aria-current='false']) {\n  background-color: transparent;\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link:hover .NavList__labelArea,\n.NavList__item--leaf:not(.NavList__item--level-1)\n  .NavList__link[aria-current]:not([aria-current='false'])\n  .NavList__labelArea {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.NavList__item--leaf:not(.NavList__item--level-1) > .NavList__itemContent .NavList__link:hover {\n  background-color: transparent;\n}\n\n[data-color-mode='dark'] .NavList {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .NavList,\n  .NavList::before,\n  .NavList::after,\n  .NavList * {\n    animation: none !important;\n    transition: none !important;\n    scroll-behavior: auto !important;\n  }\n}\n"],"mappings":""}

package/esm/PricingOptions/PricingOptions.js

@@ -1,8 +1,8 @@
 import e from "../node_modules/clsx/dist/clsx.js";
 import { Text as t } from "../Text/Text.js";
 import { Heading as n } from "../Heading/Heading.js";
-import { CheckIcon as r, TriangleDownIcon as i, XIcon as a } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
-import { Button as o } from "../Button/Button.js";
+import { Button as r } from "../Button/Button.js";
+import { CheckIcon as i, TriangleDownIcon as a, XIcon as o } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
 import { useWindowSize as s } from "../hooks/useWindowSize.js";
 import { Accordion as c } from "../Accordion/Accordion.js";
 import { UnorderedList as l } from "../list/UnorderedList/UnorderedList.js";
@@ -188,7 +188,7 @@ var v = {
 			children: c
 		})
 	]
-})), k = p(({ children: t, className: n, "data-testid": r, hasDivider: a = !0, expanded: o, accordionAs: u = "h4", ...p }, m) => {
+})), k = p(({ children: t, className: n, "data-testid": r, hasDivider: i = !0, expanded: o, accordionAs: u = "h4", ...p }, m) => {
 	let { allFeatureListsExpanded: h, updateFeatureListExpanded: y, featureListUserInteracted: b, setFeatureListUserInteracted: C } = x(), { isMedium: w, isXLarge: T, isSmall: E } = s();
 	f.useEffect(() => {
 		(o === void 0 || typeof o == "object") && C(!1);
@@ -227,7 +227,7 @@ var v = {
 	}, n));
 	return /* @__PURE__ */ g("div", {
 		ref: m,
-		className: e(d["PricingOptions__feature-list"], a && d["PricingOptions__feature-list--has-divider"], n),
+		className: e(d["PricingOptions__feature-list"], i && d["PricingOptions__feature-list--has-divider"], n),
 		"data-testid": r || v.featureList,
 		children: /* @__PURE__ */ _(c, {
 			className: d["PricingOptions__feature-list-accordion"],
@@ -239,7 +239,7 @@ var v = {
 			children: [/* @__PURE__ */ _(c.Heading, {
 				as: u,
 				className: d["PricingOptions__feature-list-accordion-heading"],
-				children: [O, /* @__PURE__ */ g(i, { className: d["PricingOptions__feature-list-accordion-chevron"] })]
+				children: [O, /* @__PURE__ */ g(a, { className: d["PricingOptions__feature-list-accordion-chevron"] })]
 			}), /* @__PURE__ */ g(c.Content, {
 				className: d["PricingOptions__feature-list-accordion-content"],
 				children: k
@@ -260,18 +260,18 @@ var v = {
 	size: "subhead-medium",
 	...a,
 	children: t
-})), M = p(({ children: t, className: n, infoTooltip: i, leadingVisual: o, leadingVisualFill: s, variant: c = "included", "data-testid": f, ...p }, m) => {
-	let h = o ?? (c === "included" ? r : a), y = c === "included" ? "Includes" : "Does not include", b = s ?? (c === "included" ? "var(--brand-color-accent-primary)" : "var(--brand-color-text-muted)");
+})), M = p(({ children: t, className: n, infoTooltip: r, leadingVisual: a, leadingVisualFill: s, variant: c = "included", "data-testid": f, ...p }, m) => {
+	let h = a ?? (c === "included" ? i : o), y = c === "included" ? "Includes" : "Does not include", b = s ?? (c === "included" ? "var(--brand-color-accent-primary)" : "var(--brand-color-text-muted)");
 	return /* @__PURE__ */ _(l.Item, {
-		className: e(d["PricingOptions__feature-list-item"], { [d["PricingOptions__feature-list-item--excluded"]]: c === "excluded" }, i && d["PricingOptions__feature-list-item--has-info"], n),
+		className: e(d["PricingOptions__feature-list-item"], { [d["PricingOptions__feature-list-item--excluded"]]: c === "excluded" }, r && d["PricingOptions__feature-list-item--has-info"], n),
 		"data-testid": f || v.featureListItem,
 		leadingVisual: h,
 		leadingVisualAriaLabel: y,
 		leadingVisualFill: b,
 		ref: m,
 		...p,
-		children: [t, i && /* @__PURE__ */ g(u, {
-			text: i,
+		children: [t, r && /* @__PURE__ */ g(u, {
+			text: r,
 			direction: "n",
 			children: /* @__PURE__ */ g("button", {
 				type: "button",
@@ -305,24 +305,24 @@ var v = {
 		className: d["PricingOptions__actions-message-content"],
 		children: t
 	})]
-})), P = p(({ as: t, children: n, className: r, "data-testid": i, ...a }, s) => /* @__PURE__ */ g(o, {
+})), P = p(({ as: t, children: n, className: i, "data-testid": a, ...o }, s) => /* @__PURE__ */ g(r, {
 	ref: s,
 	as: t,
-	"data-testid": i || v.primaryAction,
-	className: e(d["PricingOptions__primary-action"], r),
+	"data-testid": a || v.primaryAction,
+	className: e(d["PricingOptions__primary-action"], i),
 	size: "medium",
 	variant: "primary",
 	block: !0,
-	...a,
+	...o,
 	children: n
-})), F = p(({ as: t, children: n, className: r, "data-testid": i, ...a }, s) => /* @__PURE__ */ g(o, {
+})), F = p(({ as: t, children: n, className: i, "data-testid": a, ...o }, s) => /* @__PURE__ */ g(r, {
 	ref: s,
 	as: t,
-	className: e(d["PricingOptions__primary-action"], r),
-	"data-testid": i || v.secondaryAction,
+	className: e(d["PricingOptions__primary-action"], i),
+	"data-testid": a || v.secondaryAction,
 	variant: "secondary",
 	block: !0,
-	...a,
+	...o,
 	children: n
 })), I = p(({ children: t, className: n, "data-testid": r, ...i }, a) => /* @__PURE__ */ g("div", {
 	ref: a,

package/esm/SubNav/SubNav.js

@@ -2,12 +2,12 @@ import e from "../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../hooks/useId.js";
 import { useProvidedRefOrCreate as n } from "../hooks/useRef.js";
 import { Text as r } from "../Text/Text.js";
-import { TriangleDownIcon as i, TriangleUpIcon as a } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
-import { Button as o } from "../Button/Button.js";
-import { ThemeProvider as s } from "../ThemeProvider/ThemeProvider.js";
-import { useWindowSize as c } from "../hooks/useWindowSize.js";
-import { useOnClickOutside as l } from "../hooks/useOnClickOutside.js";
-import { useKeyboardEscape as u } from "../hooks/useKeyboardEscape.js";
+import { Button as i } from "../Button/Button.js";
+import { ThemeProvider as a } from "../ThemeProvider/ThemeProvider.js";
+import { useOnClickOutside as o } from "../hooks/useOnClickOutside.js";
+import { useKeyboardEscape as s } from "../hooks/useKeyboardEscape.js";
+import { TriangleDownIcon as c, TriangleUpIcon as l } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
+import { useWindowSize as u } from "../hooks/useWindowSize.js";
 import { useFocusTrap as d } from "../hooks/useFocusTrap.js";
 import { useContainsFocus as f } from "./useContainsFocus.js";
 import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/sub-nav/colors-with-modes-5gfdihUt.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/sub-nav/base-DIkvLW-s.css';/* empty css                                                                                        */
@@ -63,18 +63,18 @@ function N({ children: t }) {
 		})]
 	});
 }
-var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _, hasShadow: y }, x) => {
-	let O = n(x), A = m.useRef(null), j = m.useRef(null), M = m.useRef(null), P = w(null), [L, V] = T(!1), H = t(), [ee, te] = T(!1), { isLarge: U } = c();
+var P = y(_(({ id: i, children: a, className: f, "data-testid": g, fullWidth: _, hasShadow: y }, x) => {
+	let O = n(x), A = m.useRef(null), j = m.useRef(null), M = m.useRef(null), P = w(null), [L, V] = T(!1), H = t(), [ee, te] = T(!1), { isLarge: U } = u();
 	d({
 		containerRef: A,
 		disabled: !L
 	});
-	let W = h.toArray(s), G = b(() => {
+	let W = h.toArray(a), G = b(() => {
 		U || V(!1);
 	}, [U]), K = b(() => {
 		U || V((e) => !e);
 	}, [U]);
-	l(A, G), u(G), S(() => {
+	o(A, G), s(G), S(() => {
 		let e = j.current, t = () => {
 			if (e) {
 				let t = e.getBoundingClientRect().top;
@@ -127,7 +127,7 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 					as: "span",
 					size: "100",
 					children: $
-				}), E(L ? a : i, {
+				}), E(L ? l : c, {
 					className: p["SubNav__overlay-toggle-icon"],
 					size: 13
 				})]
@@ -146,7 +146,7 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 		className: e(p.SubNav__container, Y && p["SubNav--has-sub-heading"], Y && Q && p["SubNav--subHeadingActive"], ee && p["SubNav__container--with-anchor-nav"]),
 		children: /* @__PURE__ */ E(N, { children: /* @__PURE__ */ E("nav", {
 			ref: j,
-			id: o,
+			id: i,
 			className: e(p.SubNav, L && p["SubNav--open"], y && p["SubNav--has-shadow"], _ && p["SubNav--full-width"], f),
 			"data-testid": g || k.root,
 			children: /* @__PURE__ */ D("div", {
@@ -195,16 +195,16 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 	"data-testid": k.heading || i,
 	...a,
 	children: n
-}), L = _(({ children: a, href: o, "aria-current": s, "data-testid": l, className: d, _subMenuVariant: m, variant: h, ...g }, _) => {
-	let v = t(), { isLarge: y } = c(), [x, C] = T(!1), O = n(_), A = w(null);
+}), L = _(({ children: i, href: a, "aria-current": o, "data-testid": l, className: d, _subMenuVariant: m, variant: h, ...g }, _) => {
+	let v = t(), { isLarge: y } = u(), [x, C] = T(!1), O = n(_), A = w(null);
 	f(O, (e) => {
 		e || C(!1);
 	});
-	let j = b(() => C(!0), []), M = b(() => C(!1), []), N = b(() => C((e) => !e), []), P = !!s && s !== "false";
-	u(M), S(() => {
+	let j = b(() => C(!0), []), M = b(() => C(!1), []), N = b(() => C((e) => !e), []), P = !!o && o !== "false";
+	s(M), S(() => {
 		A.current && A.current.toggleAttribute("inert", y && !x);
 	}, [y, x]);
-	let [F, I] = a;
+	let [F, I] = i;
 	return /* @__PURE__ */ D("div", {
 		className: e(p["SubNav__link--has-sub-menu"], x && p["SubNav__link--expanded"], P && p["SubNav__link--has-active-sub-menu"]),
 		"data-testid": l || k.subMenu,
@@ -215,9 +215,9 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 		onBlur: () => null,
 		children: [
 			/* @__PURE__ */ E("a", {
-				href: o,
-				className: e(p.SubNav__link, s && p["SubNav__link--active"], d),
-				"aria-current": s,
+				href: a,
+				className: e(p.SubNav__link, o && p["SubNav__link--active"], d),
+				"aria-current": o,
 				...g,
 				children: /* @__PURE__ */ E(r, {
 					as: "span",
@@ -233,7 +233,7 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 				"aria-expanded": x ? "true" : "false",
 				"aria-controls": v,
 				"aria-label": `${F?.toString().trim()} submenu`,
-				children: /* @__PURE__ */ E(i, {
+				children: /* @__PURE__ */ E(c, {
 					className: p["SubNav__sub-menu-icon"],
 					size: 16
 				})
@@ -288,16 +288,16 @@ var P = y(_(({ id: o, children: s, className: f, "data-testid": g, fullWidth: _,
 	}) });
 });
 function z({ children: t, className: n, variant: r = "dropdown", ...i }) {
-	let a = m.useContext(j), o = w(null), { isLarge: l } = c();
+	let o = m.useContext(j), s = w(null), { isLarge: c } = u();
 	return S(() => {
 		let e = (e) => {
-			o.current && !o.current.contains(e.target) || e.target instanceof HTMLAnchorElement || e.stopPropagation();
+			s.current && !s.current.contains(e.target) || e.target instanceof HTMLAnchorElement || e.stopPropagation();
 		};
 		return r === "anchor" && document.addEventListener("click", e, !0), () => {
 			document.removeEventListener("click", e, !0);
 		};
-	}, [r]), r === "anchor" && a?.portalRef.current ? O(/* @__PURE__ */ E("nav", {
-		ref: o,
+	}, [r]), r === "anchor" && o?.portalRef.current ? O(/* @__PURE__ */ E("nav", {
+		ref: s,
 		className: e(p["SubNav__sub-menu"], p["SubNav__sub-menu--anchor"], n),
 		role: "navigation",
 		"aria-label": "Sub navigation",
@@ -308,8 +308,8 @@ function z({ children: t, className: n, variant: r = "dropdown", ...i }) {
 				e.props.onClick?.(t);
 			} }) : null)
 		})
-	}), a.portalRef.current) : /* @__PURE__ */ E(l ? s : m.Fragment, {
-		...l ? { colorMode: "light" } : {},
+	}), o.portalRef.current) : /* @__PURE__ */ E(c ? a : m.Fragment, {
+		...c ? { colorMode: "light" } : {},
 		children: /* @__PURE__ */ E("ul", {
 			className: e(p["SubNav__sub-menu"], p[`SubNav__sub-menu--${r}`], n),
 			...i,
@@ -317,15 +317,15 @@ function z({ children: t, className: n, variant: r = "dropdown", ...i }) {
 		})
 	});
 }
-function B({ children: e, href: t, variant: n = "primary", size: r = "small", ...i }) {
-	return /* @__PURE__ */ E(o, {
+function B({ children: e, href: t, variant: n = "primary", size: r = "small", ...a }) {
+	return /* @__PURE__ */ E(i, {
 		className: p.SubNav__action,
 		as: "a",
 		href: t,
 		variant: n,
 		"data-testid": k.action,
 		size: r,
-		...i,
+		...a,
 		children: e
 	});
 }

package/esm/SubdomainNavBar/NavigationVisbilityObserver.js

@@ -1,26 +1,26 @@
 import e from "../node_modules/clsx/dist/clsx.js";
 import { useProvidedRefOrCreate as t } from "../hooks/useRef.js";
-import { ChevronDownIcon as n } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
-import { useWindowSize as r } from "../hooks/useWindowSize.js";
-import { useVisibilityObserver as i } from "./useVisibilityObserver.js";
-import { useOnClickOutside as a } from "../hooks/useOnClickOutside.js";
-import o from "./SubdomainNavBar.module.js";
-import { useKeyboardEscape as s } from "../hooks/useKeyboardEscape.js";
+import { useOnClickOutside as n } from "../hooks/useOnClickOutside.js";
+import { useKeyboardEscape as r } from "../hooks/useKeyboardEscape.js";
+import { ChevronDownIcon as i } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
+import { useWindowSize as a } from "../hooks/useWindowSize.js";
+import { useVisibilityObserver as o } from "./useVisibilityObserver.js";
+import s from "./SubdomainNavBar.module.js";
 import c, { forwardRef as l, useCallback as u, useRef as d, useState as f } from "react";
 import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/SubdomainNavBar/NavigationVisbilityObserver.tsx
-var h = l(({ children: n, className: a, ...s }, l) => {
-	let u = t(l), [d] = i(u, n), { isMedium: f } = r(), h = Object.values(d).includes(!1);
+var h = l(({ children: n, className: r, ...i }, l) => {
+	let u = t(l), [d] = o(u, n), { isMedium: f } = a(), h = Object.values(d).includes(!1);
 	return /* @__PURE__ */ m("ul", {
-		className: e(o["SubdomainNavBar-primary-nav-list"], a),
+		className: e(s["SubdomainNavBar-primary-nav-list"], r),
 		ref: u,
-		...s,
+		...i,
 		children: [c.Children.map(n, (t) => {
 			if (c.isValidElement(t)) {
 				let n = t.props["data-navitemid"];
 				if (!n) return t;
 				let r = d[n];
-				return c.cloneElement(t, { className: e(t.props.className, f && r && o["SubdomainNavBar-primary-nav-list-item--visible"], f && r === !1 && o["SubdomainNavBar-primary-nav-list-item--invisible"]) });
+				return c.cloneElement(t, { className: e(t.props.className, f && r && s["SubdomainNavBar-primary-nav-list-item--visible"], f && r === !1 && s["SubdomainNavBar-primary-nav-list-item--invisible"]) });
 			}
 			return t;
 		}), h && /* @__PURE__ */ p(g, {
@@ -29,36 +29,36 @@ var h = l(({ children: n, className: a, ...s }, l) => {
 		})]
 	});
 });
-function g({ children: t, className: r, visibilityMap: i }) {
+function g({ children: t, className: a, visibilityMap: o }) {
 	let [l, h] = f(null), g = d(null);
-	a(g, () => y());
+	n(g, () => y());
 	let _ = !!l, v = (e) => {
 		l ? y() : h(e.currentTarget);
 	}, y = u(() => {
 		h(null);
 	}, []);
-	return s(y), /* @__PURE__ */ m("li", {
-		className: e(o["SubdomainNavBar-primary-nav-list-item--overflow"], r),
+	return r(y), /* @__PURE__ */ m("li", {
+		className: e(s["SubdomainNavBar-primary-nav-list-item--overflow"], a),
 		ref: g,
 		children: [/* @__PURE__ */ m("button", {
 			"aria-expanded": _ ? "true" : "false",
 			"aria-controls": "more-navigation",
 			"aria-haspopup": "true",
 			onClick: v,
-			className: e(o["SubdomainNavBar-link"], o["SubdomainNavBar-more-link"]),
-			children: ["More", /* @__PURE__ */ p(n, {})]
+			className: e(s["SubdomainNavBar-link"], s["SubdomainNavBar-more-link"]),
+			children: ["More", /* @__PURE__ */ p(i, {})]
 		}), /* @__PURE__ */ p("div", {
 			id: "more-navigation",
 			style: { display: _ ? "block" : "none" },
-			className: e(o["SubdomainNavBar-overflow-menu"]),
+			className: e(s["SubdomainNavBar-overflow-menu"]),
 			children: /* @__PURE__ */ p("ul", {
-				className: e(o["SubdomainNavBar-overflow-menu-list"]),
+				className: e(s["SubdomainNavBar-overflow-menu-list"]),
 				children: c.Children.map(t, (t) => {
 					if (c.isValidElement(t)) {
 						let n = t.props["data-navitemid"];
-						return !n || i[n] ? null : /* @__PURE__ */ p(c.Fragment, { children: c.cloneElement(t, {
+						return !n || o[n] ? null : /* @__PURE__ */ p(c.Fragment, { children: c.cloneElement(t, {
 							onClick: y,
-							className: e(o["SubdomainNavBar-overflow-menu-item"], t.props.className)
+							className: e(s["SubdomainNavBar-overflow-menu-item"], t.props.className)
 						}) });
 					}
 					return null;