@servicetitan/design-system 12.8.1 → 12.10.0

package/dist/components/ProgressTracker/index.css

@@ -14,6 +14,9 @@
 .ProgressTrackerDivider {
   position: relative;
   width: 100%;
+  flex-shrink: 0;
+  flex-grow: 1;
+  flex-basis: 0;
 }
 .ProgressTrackerDivider::after {
   content: "";
@@ -23,16 +26,24 @@
   top: 50%;
   margin-top: -1px;
   height: 2px;
-  background-color: var(--colorsBorderGrey, #dfe0e1);
+  background-color: var(--colorsStatusDefault, #8c9ca5);
+}
+
+.ProgressTracker--disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.ProgressTrackerDivider--completed::after {
+  background-color: var(--colorsStatusInfo, #2270ee);
 }
 
 .ProgressTrackerStep {
-  color: var(--colorsTextSubdued, #606162);
   display: flex;
-  align-items: center;
+  flex-shrink: 1;
+  flex-grow: 0;
   position: relative;
-  margin: 0 24px;
-  padding: 0 8px;
+  margin: 0 16px;
   text-decoration: none;
 }
 .ProgressTrackerStep:first-child {
@@ -49,12 +60,20 @@
   box-shadow: 0 0 0 3px var(--colorsFocusRingPrimary, #a9d1ff);
 }
 
+.ProgressTrackerStep--small {
+  margin: 0 8px;
+}
+
+.ProgressTrackerStep--hideLabels {
+  margin: 0 8px;
+}
+
 /* Children */
 .ProgressTrackerStep__icon {
-  width: 1.8em;
-  height: 1.8em;
+  font-weight: 700;
+  width: 24px;
+  height: 24px;
   border-radius: 50%;
-  background: var(--colorsSurfaceGreyStronger, #bcbcbd);
   color: var(---colorsTextInverted, #ffffff);
   display: flex;
   flex-shrink: 0;
@@ -62,42 +81,90 @@
   align-items: center;
 }
 
-.ProgressTrackerStep__label {
+.ProgressTrackerStep__simple {
+  width: 17px;
+  height: 17px;
+  border-radius: 50%;
+  color: var(---colorsTextInverted, #ffffff);
+  display: flex;
   flex-shrink: 0;
-  white-space: nowrap;
+  justify-content: center;
+  align-items: center;
+}
+.ProgressTrackerStep--incomplete .ProgressTrackerStep__simple {
+  box-shadow: 0 0 0 2px inset var(--colorsStatusDefault, #8c9ca5);
+}
+.ProgressTrackerStep--active .ProgressTrackerStep__simple {
+  box-shadow: 0 0 0 2px inset var(--colorsTextPrimary, #1360d9);
+}
+.ProgressTrackerStep--complete .ProgressTrackerStep__simple, .ProgressTrackerStep--editing .ProgressTrackerStep__simple {
+  background-color: var(--colorsTextPrimary, #1360d9);
+}
+
+.ProgressTrackerStep__label {
   margin-left: 8px;
 }
 
-/* States */
-.ProgressTrackerStep--clickable:hover {
+.ProgressTrackerStep--medium .ProgressTrackerStep__label {
+  margin-top: 3px;
+}
+
+.ProgressTrackerStep--clickable {
   cursor: pointer;
-  opacity: 0.8;
+}
+.ProgressTrackerStep--clickable .ProgressTrackerStep__label {
+  color: var(--colorsTextPrimary, #1360d9);
+}
+.ProgressTrackerStep--clickable .ProgressTrackerStep__label:hover, .ProgressTrackerStep--clickable .ProgressTrackerStep__label:focus {
+  text-decoration: underline;
+  outline: none;
 }
 
-.ProgressTrackerStep--complete {
-  color: var(--colorsTextDefault, #141414);
+.ProgressTrackerStep--incomplete {
+  color: var(--colorsTextSubdued, #606162);
 }
+.ProgressTrackerStep--incomplete .ProgressTrackerStep__icon {
+  box-shadow: 0 0 0 2px inset var(--colorsStatusDefault, #8c9ca5);
+  color: var(--colorsTextSubdued, #606162);
+}
+
 .ProgressTrackerStep--complete .ProgressTrackerStep__icon {
-  background-color: var(--colorsStatusSuccess, #18a761);
+  color: var(--colorsTextPrimary, #1360d9);
 }
 .ProgressTrackerStep--complete .a-Icon {
-  font-size: 20px;
+  font-size: 28px;
 }
 
 .ProgressTrackerStep--editing,
 .ProgressTrackerStep--active {
   color: var(--colorsTextDefault, #141414);
 }
+.ProgressTrackerStep--editing .ProgressTrackerStep__label,
+.ProgressTrackerStep--active .ProgressTrackerStep__label {
+  font-weight: 700;
+}
 .ProgressTrackerStep--editing .ProgressTrackerStep__icon,
 .ProgressTrackerStep--active .ProgressTrackerStep__icon {
-  background-color: var(--colorsStatusInfo, #2270ee);
+  box-shadow: 0 0 0 2px inset var(--colorsTextPrimary, #1360d9);
+  color: var(--colorsTextPrimary, #1360d9);
 }
 
 .ProgressTrackerStep--disabled {
-  pointer-events: none !important;
+  pointer-events: none;
 }
 .ProgressTrackerStep--disabled, .ProgressTrackerStep--disabled:hover {
   opacity: 0.6;
 }
+.ProgressTracker--disabled .ProgressTrackerStep--disabled {
+  opacity: 1;
+}
+
+.ProgressTrackerStep__Tooltip {
+  display: none;
+}
+
+.ProgressTrackerStep__Tooltip--visible {
+  display: block;
+}
 
 /*# sourceMappingURL=index.css.map */

package/dist/components/ProgressTracker/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/ProgressTracker/ProgressTracker.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/ProgressTracker/ProgressTrackerStep.scss"],"names":[],"mappings":"AAAA;ACKA;ACJC;EACA;AAEA;EACA;EDGA;EACA;EACA;EACA,WE8Ha;EF7Hb,aEgGqB;;;AF7FtB;EACC;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBAxBe;;;AGMjB;EACC,OARc;EASd;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC;EACA;;AAGD;EACC;EACA;EACA,YD4Fa;;;ACxFf;AACA;EACC;EACA;EACA;EACA,YAnCc;EAoCd,OArCa;EAsCb;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA,aD2EW;;;ACxEZ;AACA;EACC;EACA,SDwDiB;;;ACrDlB;EACC,OA1Da;;AA4Db;EACC,kBA1Da;;AA6Dd;EAAU,WDwEG;;;ACrEd;AAAA;EAEC,OArEa;;AAsEb;AAAA;EAA6B,kBAlEf;;;AAqEf;EACC;;AAEA;EAEC,SDiCiB","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/ProgressTracker/ProgressTracker.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/ProgressTracker/ProgressTrackerStep.scss"],"names":[],"mappings":"AAAA;ACMA;ACLC;EACA;AAEA;EACA;EDIA;EACA;EACA;EACA,WE6Ha;EF5Hb,aE+FqB;;;AF5FtB;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBA5Be;;;AAgCjB;EACC;EACA,SE6EkB;;;AFzElB;EAAW,kBArCM;;;AGKlB;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC;EACA;;AAGD;EACC;EACA;EACA,YD6Fa;;;ACzFf;EACC;;;AAGD;EACC;;;AAGD;AACA;EACC,aDkEkB;ECjElB;EACA;EACA;EACA,OA5Ca;EA6Cb;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA,OAvDa;EAwDb;EACA;EACA;EACA;;AAEA;EACC;;AAGD;EACC;;AAGD;EAEC,kBApEc;;;AAwEhB;EACC,aD8CW;;;AC1CX;EACC;;;AAIF;EACC;;AAEA;EACC,OAvFY;;AAyFZ;EAEC;EACA;;;AAKH;EACC,OAtGc;;AAwGd;EACC;EACA,OA1Ga;;;AA+Gd;EAA6B,OA3GhB;;AA4Gb;EAAU;;;AAGX;AAAA;EAEC,OApHa;;AAsHb;AAAA;EACC,aDZiB;;ACelB;AAAA;EACC;EACA,OAzHY;;;AA6Hd;EACC;;AAEA;EAEC,SDtBiB;;ACyBlB;EAA+B;;;AAGhC;EACC;;;AAGD;EACC","file":"index.css"}

package/dist/components/Scroll/Scroll.css

@@ -43,6 +43,12 @@
 .Scroll--of-y-hidden > .Scroll__Scrollbar {
   overflow-y: hidden;
 }
+.Scroll__Scrollbar:focus {
+  outline-color: var(--colorsFocusRingPrimary, #a9d1ff);
+}
+.Scroll__Scrollbar:focus-visible {
+  outline-color: var(--colorsFocusRingPrimary, #a9d1ff);
+}
 
 /* Scrollable without visible scrollbar */
 .Scroll--of-x-hidden.Scroll--hidden-scrollbar > .Scroll__Scrollbar {

package/dist/components/Scroll/Scroll.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Scroll/Scroll.scss","../../../src/utilities/_component-reset.scss"],"names":[],"mappings":"AAAA;ACMA;AACA;EACC;EACA;;;AAGD;AACA;AAAA;EAC4C;;;AAE5C;AACA;AAAA;EAC2C;;;AAE3C;ACnBC;EACA;AAEA;EACA;EDkBA;AAEA;;AACA;EAAyB;;AACzB;EAAyB;;AAEzB;EAA2B;;AAC3B;EAA2B;;AAE3B;EAA2B;;AAC3B;EAA2B;;;AAG5B;AACA;EAAqE;;;AACrE;EAAqE;;;AAErE;AAAA;EAEC;;AAEA;AAAA;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAQA;EAAmB;;AAQnB;EAAmB;;AAIrB;EAIC;EACA;;AAIA;EAIC;EACA;EACA,QAvGkB;;AA0GnB;EAIC;EACA,OA/GkB;EAgHlB;;AAGD;EAIC;EACA;EACA,QAzHkB;;AA4HnB;EAIC;EACA,OAjIkB;EAkIlB;;;AAKH;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EAAc;;;AACd;EAAgB;;;AAChB;EAAiB;;;AACjB;EAAe","file":"Scroll.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Scroll/Scroll.scss","../../../src/utilities/_component-reset.scss"],"names":[],"mappings":"AAAA;ACOA;AACA;EACC;EACA;;;AAGD;AACA;AAAA;EAC4C;;;AAE5C;AACA;AAAA;EAC2C;;;AAE3C;ACpBC;EACA;AAEA;EACA;EDmBA;AAEA;;AACA;EAAyB;;AACzB;EAAyB;;AAEzB;EAA2B;;AAC3B;EAA2B;;AAE3B;EAA2B;;AAC3B;EAA2B;;AAG3B;EAAU,eAhCU;;AAmCpB;EAAkB,eAnCE;;;AAsCrB;AACA;EAAqE;;;AACrE;EAAqE;;;AAErE;AAAA;EAEC;;AAEA;AAAA;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAQA;EAAmB;;AAQnB;EAAmB;;AAIrB;EAIC;EACA;;AAIA;EAIC;EACA;EACA,QA9GkB;;AAiHnB;EAIC;EACA,OAtHkB;EAuHlB;;AAGD;EAIC;EACA;EACA,QAhIkB;;AAmInB;EAIC;EACA,OAxIkB;EAyIlB;;;AAKH;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EAAc;;;AACd;EAAgB;;;AAChB;EAAiB;;;AACjB;EAAe","file":"Scroll.css"}

package/dist/components/Scroll/Scroll.js

@@ -16,6 +16,12 @@ export const Scroll = (_a) => {
     var { el: ScrollElement = 'div', children, className, height: maxHeight, width: maxWidth, horizontal = 'auto', vertical = 'auto', scrollIndicator = false, scrollbar } = _a, props = __rest(_a, ["el", "children", "className", "height", "width", "horizontal", "vertical", "scrollIndicator", "scrollbar"]);
     const scrollbarRef = React.useRef(null);
     const { top, right, bottom, left } = useScrollPosition(scrollbarRef);
+    const isScrollable = top ||
+        right ||
+        bottom ||
+        left ||
+        horizontal === 'scroll' ||
+        vertical === 'scroll';
     const ScrollClasses = classnames('Scroll', className, {
         [`Scroll--of-x-${horizontal}`]: horizontal,
         [`Scroll--of-y-${vertical}`]: vertical,
@@ -38,6 +44,6 @@ export const Scroll = (_a) => {
     };
     return (React.createElement(ScrollElement, { className: ScrollClasses, style: styles, "data-anvil-component": "Scroll" },
         scrollIndicator && shadows,
-        React.createElement("div", Object.assign({ className: "Scroll__Scrollbar", ref: scrollbarRef }, props), children)));
+        React.createElement("div", Object.assign({ className: "Scroll__Scrollbar", tabIndex: props.tabIndex || isScrollable ? 0 : null, ref: scrollbarRef }, props), children)));
 };
 //# sourceMappingURL=Scroll.js.map

package/dist/components/Scroll/Scroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"Scroll.js","sourceRoot":"","sources":["../../../src/components/Scroll/Scroll.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAmClE,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,EAWvC,EAAE,EAAE;QAXmC,EACvC,EAAE,EAAE,aAAa,GAAG,KAAK,EACzB,QAAQ,EACR,SAAS,EACT,MAAM,EAAE,SAAS,EACjB,KAAK,EAAE,QAAQ,EACf,UAAU,GAAG,MAAM,EACnB,QAAQ,GAAG,MAAM,EACjB,eAAe,GAAG,KAAK,EACvB,SAAS,OAET,EADG,KAAK,cAV+B,4GAWvC,CADQ;IAER,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAErE,MAAM,aAAa,GAAG,UAAU,CAAC,QAAQ,EAAE,SAAS,EAAE;QACrD,CAAC,gBAAgB,UAAU,EAAE,CAAC,EAAE,UAAU;QAC1C,CAAC,gBAAgB,QAAQ,EAAE,CAAC,EAAE,QAAQ;QACtC,wBAAwB,EAAE,GAAG;QAC7B,0BAA0B,EAAE,KAAK;QACjC,2BAA2B,EAAE,MAAM;QACnC,yBAAyB,EAAE,IAAI;QAC/B,0BAA0B,EAAE,SAAS,KAAK,QAAQ;QAClD,qBAAqB,EAAE,CAAC,SAAS;QACjC,oBAAoB,EAAE,CAAC,QAAQ;KAC/B,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,CACf,6BAAK,SAAS,EAAC,iBAAiB;QAC/B,6BAAK,SAAS,EAAC,aAAa,GAAG;QAC/B,6BAAK,SAAS,EAAC,eAAe,GAAG;QACjC,6BAAK,SAAS,EAAC,gBAAgB,GAAG;QAClC,6BAAK,SAAS,EAAC,cAAc,GAAG,CAC3B,CACN,CAAC;IAEF,MAAM,MAAM,GAAwB;QACnC,QAAQ;QACR,SAAS;KACT,CAAC;IAEF,OAAO,CACN,oBAAC,aAAa,IACb,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,MAAM,0BACQ,QAAQ;QAE5B,eAAe,IAAI,OAAO;QAC3B,2CAAK,SAAS,EAAC,mBAAmB,EAAC,GAAG,EAAE,YAAY,IAAM,KAAK,GAC7D,QAAQ,CACJ,CACS,CAChB,CAAC;AACH,CAAC,CAAC"}
+{"version":3,"file":"Scroll.js","sourceRoot":"","sources":["../../../src/components/Scroll/Scroll.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAmClE,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,EAWvC,EAAE,EAAE;QAXmC,EACvC,EAAE,EAAE,aAAa,GAAG,KAAK,EACzB,QAAQ,EACR,SAAS,EACT,MAAM,EAAE,SAAS,EACjB,KAAK,EAAE,QAAQ,EACf,UAAU,GAAG,MAAM,EACnB,QAAQ,GAAG,MAAM,EACjB,eAAe,GAAG,KAAK,EACvB,SAAS,OAET,EADG,KAAK,cAV+B,4GAWvC,CADQ;IAER,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;IACrE,MAAM,YAAY,GACjB,GAAG;QACH,KAAK;QACL,MAAM;QACN,IAAI;QACJ,UAAU,KAAK,QAAQ;QACvB,QAAQ,KAAK,QAAQ,CAAC;IAEvB,MAAM,aAAa,GAAG,UAAU,CAAC,QAAQ,EAAE,SAAS,EAAE;QACrD,CAAC,gBAAgB,UAAU,EAAE,CAAC,EAAE,UAAU;QAC1C,CAAC,gBAAgB,QAAQ,EAAE,CAAC,EAAE,QAAQ;QACtC,wBAAwB,EAAE,GAAG;QAC7B,0BAA0B,EAAE,KAAK;QACjC,2BAA2B,EAAE,MAAM;QACnC,yBAAyB,EAAE,IAAI;QAC/B,0BAA0B,EAAE,SAAS,KAAK,QAAQ;QAClD,qBAAqB,EAAE,CAAC,SAAS;QACjC,oBAAoB,EAAE,CAAC,QAAQ;KAC/B,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,CACf,6BAAK,SAAS,EAAC,iBAAiB;QAC/B,6BAAK,SAAS,EAAC,aAAa,GAAG;QAC/B,6BAAK,SAAS,EAAC,eAAe,GAAG;QACjC,6BAAK,SAAS,EAAC,gBAAgB,GAAG;QAClC,6BAAK,SAAS,EAAC,cAAc,GAAG,CAC3B,CACN,CAAC;IAEF,MAAM,MAAM,GAAwB;QACnC,QAAQ;QACR,SAAS;KACT,CAAC;IAEF,OAAO,CACN,oBAAC,aAAa,IACb,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,MAAM,0BACQ,QAAQ;QAE5B,eAAe,IAAI,OAAO;QAC3B,2CACC,SAAS,EAAC,mBAAmB,EAC7B,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EACnD,GAAG,EAAE,YAAY,IACb,KAAK,GAER,QAAQ,CACJ,CACS,CAChB,CAAC;AACH,CAAC,CAAC"}

package/dist/components/Scroll/index.css

@@ -43,6 +43,12 @@
 .Scroll--of-y-hidden > .Scroll__Scrollbar {
   overflow-y: hidden;
 }
+.Scroll__Scrollbar:focus {
+  outline-color: var(--colorsFocusRingPrimary, #a9d1ff);
+}
+.Scroll__Scrollbar:focus-visible {
+  outline-color: var(--colorsFocusRingPrimary, #a9d1ff);
+}
 
 /* Scrollable without visible scrollbar */
 .Scroll--of-x-hidden.Scroll--hidden-scrollbar > .Scroll__Scrollbar {

package/dist/components/Scroll/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Scroll/Scroll.scss","../../../src/utilities/_component-reset.scss"],"names":[],"mappings":"AAAA;ACMA;AACA;EACC;EACA;;;AAGD;AACA;AAAA;EAC4C;;;AAE5C;AACA;AAAA;EAC2C;;;AAE3C;ACnBC;EACA;AAEA;EACA;EDkBA;AAEA;;AACA;EAAyB;;AACzB;EAAyB;;AAEzB;EAA2B;;AAC3B;EAA2B;;AAE3B;EAA2B;;AAC3B;EAA2B;;;AAG5B;AACA;EAAqE;;;AACrE;EAAqE;;;AAErE;AAAA;EAEC;;AAEA;AAAA;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAQA;EAAmB;;AAQnB;EAAmB;;AAIrB;EAIC;EACA;;AAIA;EAIC;EACA;EACA,QAvGkB;;AA0GnB;EAIC;EACA,OA/GkB;EAgHlB;;AAGD;EAIC;EACA;EACA,QAzHkB;;AA4HnB;EAIC;EACA,OAjIkB;EAkIlB;;;AAKH;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EAAc;;;AACd;EAAgB;;;AAChB;EAAiB;;;AACjB;EAAe","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Scroll/Scroll.scss","../../../src/utilities/_component-reset.scss"],"names":[],"mappings":"AAAA;ACOA;AACA;EACC;EACA;;;AAGD;AACA;AAAA;EAC4C;;;AAE5C;AACA;AAAA;EAC2C;;;AAE3C;ACpBC;EACA;AAEA;EACA;EDmBA;AAEA;;AACA;EAAyB;;AACzB;EAAyB;;AAEzB;EAA2B;;AAC3B;EAA2B;;AAE3B;EAA2B;;AAC3B;EAA2B;;AAG3B;EAAU,eAhCU;;AAmCpB;EAAkB,eAnCE;;;AAsCrB;AACA;EAAqE;;;AACrE;EAAqE;;;AAErE;AAAA;EAEC;;AAEA;AAAA;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAQA;EAAmB;;AAQnB;EAAmB;;AAIrB;EAIC;EACA;;AAIA;EAIC;EACA;EACA,QA9GkB;;AAiHnB;EAIC;EACA,OAtHkB;EAuHlB;;AAGD;EAIC;EACA;EACA,QAhIkB;;AAmInB;EAIC;EACA,OAxIkB;EAyIlB;;;AAKH;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EAAc;;;AACd;EAAgB;;;AAChB;EAAiB;;;AACjB;EAAe","file":"index.css"}

package/dist/components/SideNav/SideNav.css

@@ -8,20 +8,23 @@
   color: var(--colorsTextDefault, #141414);
   padding: 16px;
 }
-.SideNav .Tag {
-  margin-left: 8px;
-  transform: translateY(-1px);
-}
 .SideNav a {
   text-decoration: none;
 }
+.SideNav .SideNav {
+  padding: 0;
+}
 
 .SideNav__title {
-  border-bottom: 1px solid var(--colorsBorderGrey, #dfe0e1);
-  margin: 0 16px;
-  padding: 8px 0 24px;
+  margin: 0 8px;
+  margin-bottom: 16px;
+  padding: 8px 0;
   color: var(--colorsTextOnGrey, #444445);
 }
+.SideNav__title .Tag {
+  margin-left: 8px;
+  transform: translateY(-1px);
+}
 
 .SideNav__list {
   list-style: none;
@@ -29,7 +32,6 @@
   margin-left: 0;
   margin-top: 0;
   padding-left: 0;
-  padding-top: 16px;
 }
 
 /*# sourceMappingURL=SideNav.css.map */

package/dist/components/SideNav/SideNav.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNav.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA;AAEA;EACA;EDOA;EACA,OARc;EASd,SEiHW;;AF/GX;EACC,aE6GU;EF5GV;;AAGD;EAAI;;;AAGL;EACC;EACA;EACA;EACA,OArBoB;;;AAwBrB;EG9BC;EACA;EACA;EACA;EACA;EH6BA,aE6FW","file":"SideNav.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNav.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA;AAEA;EACA;EDOA;EACA,OARc;EASd,SEiHW;;AF/GX;EAAI;;AAGJ;EAAW;;;AAGZ;EACC;EACA,eEuGW;EFtGX;EACA,OAnBoB;;AAqBpB;EACC,aEiGU;EFhGV;;;AAIF;EGjCC;EACA;EACA;EACA;EACA","file":"SideNav.css"}

package/dist/components/SideNav/SideNav.js

@@ -11,15 +11,23 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import classnames from 'classnames';
-import { SideNavItem } from './SideNavItem';
+import { FocusScope } from '@react-aria/focus';
+import { SideNavItem, SideNavItemContext } from './SideNavItem';
 import { SideNavGroup } from './SideNavGroup';
 import { Headline } from '../Headline';
+import { CollapsibleList } from '../../internal/CollapsibleList';
 export const SideNav = (_a) => {
-    var { children, className, title } = _a, rest = __rest(_a, ["children", "className", "title"]);
+    var { children, className, title, 'data-anvil-component': dataAnvilComponent } = _a, rest = __rest(_a, ["children", "className", "title", 'data-anvil-component']);
+    const sideNavItemContext = React.useContext(SideNavItemContext);
     const SideNavClasses = classnames('SideNav', className);
-    return (React.createElement("div", Object.assign({ className: SideNavClasses, "data-anvil-component": "SideNav" }, rest),
-        title !== undefined && (React.createElement(Headline, { el: "div", className: "SideNav__title", size: "small" }, title)),
-        React.createElement("ul", { className: "SideNav__list" }, children)));
+    // Nested SideNav
+    if (sideNavItemContext)
+        return (React.createElement(CollapsibleList, Object.assign({ className: SideNavClasses, el: "div" }, rest),
+            React.createElement("menu", { className: "SideNav__list" }, children)));
+    return (React.createElement(FocusScope, null,
+        React.createElement("div", Object.assign({ className: SideNavClasses, "data-anvil-component": "SideNav" }, rest),
+            title !== undefined && (React.createElement(Headline, { el: "div", className: "SideNav__title", size: "small" }, title)),
+            React.createElement("menu", { className: "SideNav__list" }, children))));
 };
 SideNav.Item = SideNavItem;
 SideNav.Group = SideNavGroup;

package/dist/components/SideNav/SideNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNav.js","sourceRoot":"","sources":["../../../src/components/SideNav/SideNav.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAwBvC,MAAM,CAAC,MAAM,OAAO,GAAY,CAAC,EAAuC,EAAE,EAAE;QAA3C,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,OAAW,EAAN,IAAI,cAArC,kCAAuC,CAAF;IACrE,MAAM,cAAc,GAAG,UAAU,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAExD,OAAO,CACN,2CACC,SAAS,EAAE,cAAc,0BACJ,SAAS,IAC1B,IAAI;QAEP,KAAK,KAAK,SAAS,IAAI,CACvB,oBAAC,QAAQ,IAAC,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,OAAO,IACxD,KAAK,CACI,CACX;QACD,4BAAI,SAAS,EAAC,eAAe,IAAE,QAAQ,CAAM,CACxC,CACN,CAAC;AACH,CAAC,CAAC;AAEF,OAAO,CAAC,IAAI,GAAG,WAAW,CAAC;AAC3B,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC"}
+{"version":3,"file":"SideNav.js","sourceRoot":"","sources":["../../../src/components/SideNav/SideNav.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAwBjE,MAAM,CAAC,MAAM,OAAO,GAAY,CAAC,EAMhC,EAAE,EAAE;QAN4B,EAChC,QAAQ,EACR,SAAS,EACT,KAAK,EACL,sBAAsB,EAAE,kBAAkB,OAE1C,EADG,IAAI,cALyB,0DAMhC,CADO;IAEP,MAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAC;IAChE,MAAM,cAAc,GAAG,UAAU,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAExD,iBAAiB;IACjB,IAAI,kBAAkB;QACrB,OAAO,CACN,oBAAC,eAAe,kBAAC,SAAS,EAAE,cAAc,EAAE,EAAE,EAAC,KAAK,IAAK,IAAI;YAC5D,8BAAM,SAAS,EAAC,eAAe,IAAE,QAAQ,CAAQ,CAChC,CAClB,CAAC;IAEH,OAAO,CACN,oBAAC,UAAU;QACV,2CACC,SAAS,EAAE,cAAc,0BACJ,SAAS,IAC1B,IAAI;YAEP,KAAK,KAAK,SAAS,IAAI,CACvB,oBAAC,QAAQ,IAAC,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,OAAO,IACxD,KAAK,CACI,CACX;YACD,8BAAM,SAAS,EAAC,eAAe,IAAE,QAAQ,CAAQ,CAC5C,CACM,CACb,CAAC;AACH,CAAC,CAAC;AAEF,OAAO,CAAC,IAAI,GAAG,WAAW,CAAC;AAC3B,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC"}

package/dist/components/SideNav/SideNavGroup.css

@@ -1,13 +1,17 @@
 /* Hide element visually, keeping it focusable (with keyboard) and available for screen-readers */
 .SideNavGroup {
-  margin-top: 32px;
+  margin-top: 24px;
 }
 .SideNav__list .SideNavGroup:first-child {
   margin-top: 16px;
 }
+.SideNav__list .SideNavGroup:last-child {
+  margin-bottom: 16px;
+}
 
 .SideNavGroup__title {
-  margin: 0 16px 8px;
+  margin: 8px;
+  margin-top: 0;
 }
 
 .SideNavGroup__list {

package/dist/components/SideNav/SideNavGroup.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNavGroup.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss"],"names":[],"mappings":"AAAA;ACGA;EACC,YC6HW;;AD3HX;EAA+B,YCyHpB;;;ADtHZ;EACC;;;AAGD;EEZC;EACA;EACA;EACA;EACA","file":"SideNavGroup.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNavGroup.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss"],"names":[],"mappings":"AAAA;ACGA;EACC,YC4HW;;AD1HX;EAA+B,YCyHpB;;ADxHX;EAA8B,eCwHnB;;;ADrHZ;EACC,QCmHW;EDlHX;;;AAGD;EEdC;EACA;EACA;EACA;EACA","file":"SideNavGroup.css"}

package/dist/components/SideNav/SideNavGroup.js

@@ -17,6 +17,6 @@ export const SideNavGroup = (_a) => {
     const SideNavItemClasses = classnames('SideNavGroup', className);
     return (React.createElement("li", Object.assign({ className: SideNavItemClasses, "data-anvil-component": "SideNavGroup" }, props),
         title !== undefined && (React.createElement(Eyebrow, { className: "SideNavGroup__title", size: "medium" }, title)),
-        React.createElement("ul", { className: "SideNavGroup__list" }, children)));
+        React.createElement("menu", { className: "SideNavGroup__list" }, children)));
 };
 //# sourceMappingURL=SideNavGroup.js.map

package/dist/components/SideNav/SideNavGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNavGroup.js","sourceRoot":"","sources":["../../../src/components/SideNav/SideNavGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAkBrC,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAKnD,EAAE,EAAE;QAL+C,EACnD,QAAQ,EACR,SAAS,EACT,KAAK,OAEL,EADG,KAAK,cAJ2C,kCAKnD,CADQ;IAER,MAAM,kBAAkB,GAAG,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;IAEjE,OAAO,CACN,0CACC,SAAS,EAAE,kBAAkB,0BACR,cAAc,IAC/B,KAAK;QAER,KAAK,KAAK,SAAS,IAAI,CACvB,oBAAC,OAAO,IAAC,SAAS,EAAC,qBAAqB,EAAC,IAAI,EAAC,QAAQ,IACpD,KAAK,CACG,CACV;QACD,4BAAI,SAAS,EAAC,oBAAoB,IAAE,QAAQ,CAAM,CAC9C,CACL,CAAC;AACH,CAAC,CAAC"}
+{"version":3,"file":"SideNavGroup.js","sourceRoot":"","sources":["../../../src/components/SideNav/SideNavGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAkBrC,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAKnD,EAAE,EAAE;QAL+C,EACnD,QAAQ,EACR,SAAS,EACT,KAAK,OAEL,EADG,KAAK,cAJ2C,kCAKnD,CADQ;IAER,MAAM,kBAAkB,GAAG,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;IAEjE,OAAO,CACN,0CACC,SAAS,EAAE,kBAAkB,0BACR,cAAc,IAC/B,KAAK;QAER,KAAK,KAAK,SAAS,IAAI,CACvB,oBAAC,OAAO,IAAC,SAAS,EAAC,qBAAqB,EAAC,IAAI,EAAC,QAAQ,IACpD,KAAK,CACG,CACV;QACD,8BAAM,SAAS,EAAC,oBAAoB,IAAE,QAAQ,CAAQ,CAClD,CACL,CAAC;AACH,CAAC,CAAC"}

package/dist/components/SideNav/SideNavItem.css

@@ -8,20 +8,23 @@
   color: var(--colorsTextDefault, #141414);
   padding: 16px;
 }
-.SideNav .Tag {
-  margin-left: 8px;
-  transform: translateY(-1px);
-}
 .SideNav a {
   text-decoration: none;
 }
+.SideNav .SideNav {
+  padding: 0;
+}
 
 .SideNav__title {
-  border-bottom: 1px solid var(--colorsBorderGrey, #dfe0e1);
-  margin: 0 16px;
-  padding: 8px 0 24px;
+  margin: 0 8px;
+  margin-bottom: 16px;
+  padding: 8px 0;
   color: var(--colorsTextOnGrey, #444445);
 }
+.SideNav__title .Tag {
+  margin-left: 8px;
+  transform: translateY(-1px);
+}
 
 .SideNav__list {
   list-style: none;
@@ -29,34 +32,106 @@
   margin-left: 0;
   margin-top: 0;
   padding-left: 0;
-  padding-top: 16px;
 }
 
 .SideNavItem {
   margin: 0;
   padding: 0;
 }
-
-.SideNavItem__button {
+.SideNavItem > .SideNavItem__button {
   border-radius: 3px;
   color: var(--colorsTextDefault, #141414);
   font-weight: 400;
   cursor: pointer;
-  display: block;
-  padding: 6px 16px;
+  display: flex;
+  min-height: 22px;
+  padding: 6px 8px;
   position: relative;
   transition: color cubic-bezier(0.4, 0, 0.2, 1) 100ms 0ms;
   text-decoration: none;
+  /* States */
 }
-.SideNavItem__button:focus {
+.SideNavItem > .SideNavItem__button:hover {
+  background: var(--colorsHoverDefault, rgba(4, 4, 4, 0.08));
+}
+.SideNavItem > .SideNavItem__button:active:not(:focus-within) {
+  background-color: var(--colorsActiveDefault, rgba(4, 4, 4, 0.2));
+}
+.SideNavItem > .SideNavItem__button.SideNavItem__button--focus-visible:focus {
   outline: none;
+  box-shadow: inset 0 0 0 2px var(--colorsFocusRingPrimary, #a9d1ff);
 }
-.SideNavItem__button:hover, .SideNavItem__button.SideNavItem__button--focus-visible:focus {
-  background: var(--colorsHoverPrimary, rgba(34, 112, 238, 0.08));
-  color: var(--colorsTextPrimary, #2270ee);
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__prefix,
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__content,
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__suffix {
+  color: currentColor;
+  display: inline-flex;
+  align-items: center;
+}
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__prefix {
+  margin-right: 8px;
+}
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__suffix {
+  margin-left: 8px;
+}
+.SideNavItem > .SideNavItem__button > .SideNavItem__button__content {
+  flex-grow: 1;
+  margin-top: 0.5px;
+}
+.SideNavItem.SideNavItem--disabled > .SideNavItem__button {
+  background-color: transparent !important;
+  opacity: 0.4;
+  pointer-events: none;
 }
-.SideNavItem--active .SideNavItem__button {
+.SideNavItem.SideNavItem--active > .SideNavItem__button:not(.SideNavItem__button--expanded) {
+  background-color: var(--colorsHoverPrimary, rgba(34, 112, 238, 0.08));
   color: var(--colorsTextPrimary, #2270ee);
 }
+.SideNavItem.SideNavItem--active > .SideNavItem__button:not(.SideNavItem__button--expanded) > .SideNavItem__button__content {
+  font-weight: bold;
+}
+.SideNavItem.SideNavItem--active > .SideNavItem__button:not(.SideNavItem__button--expanded) .a-Icon svg {
+  color: var(--colorsTextPrimary, #2270ee) !important;
+  fill: var(--colorsTextPrimary, #2270ee) !important;
+}
+.SideNavItem .SideNavItem__button--expanded > .SideNavItem__button__content {
+  font-weight: bold;
+}
+.SideNavItem .SideNav .SideNavItem > .SideNavItem__button > .SideNavItem__button__content {
+  margin-left: 28px;
+}
+.SideNavItem .SideNav .SideNavItem > .SideNavItem__button .SideNavItem__button__prefix {
+  display: none;
+}
+
+.SideNavItem__button__suffix__collapsible-icon {
+  transition: transform cubic-bezier(0.4, 0, 0.2, 1) 300ms 0ms;
+  transform: rotate(0) translateY(1px);
+}
+.SideNavItem__button--expanded .SideNavItem__button__suffix__collapsible-icon {
+  transform: rotate(180deg) translateY(0);
+}
+
+.SideNavItem__button .SideNavItem__button__prefix .a-Icon,
+.SideNavItem__button .SideNavItem__button__suffix .a-Icon {
+  margin-top: -0.5px;
+}
+.SideNavItem__button .StatusLight {
+  margin: -4px -5px;
+}
+.SideNavItem__button .Button {
+  margin: -4px;
+  vertical-align: middle;
+}
+.SideNavItem__button .ActionMenu__TriggerWrapper {
+  margin-top: -3px;
+}
+.SideNavItem__button .Tooltip {
+  margin-top: -2px;
+}
+.SideNavItem__button .Tag {
+  margin-left: 8px;
+  transform: translateY(0);
+}
 
 /*# sourceMappingURL=SideNavItem.css.map */

package/dist/components/SideNav/SideNavItem.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNav.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss","../../../src/components/SideNav/SideNavItem.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA;AAEA;EACA;EDOA;EACA,OARc;EASd,SEiHW;;AF/GX;EACC,aE6GU;EF5GV;;AAGD;EAAI;;;AAGL;EACC;EACA;EACA;EACA,OArBoB;;;AAwBrB;EG9BC;EACA;EACA;EACA;EACA;EH6BA,aE6FW;;;AExHZ;EACC;EACA;;;AAGD;EACC,eFQiB;EEPjB,OJTc;EIUd,aF6FqB;EE5FrB;EACA;EACA;EACA;EACA;EACA;;AAEA;EAAU;;AAEV;EAEC,YAvBiB;EAwBjB,OAvBW;;AA0BZ;EAAyB,OA1Bb","file":"SideNavItem.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/SideNav/SideNav.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/utilities/_list-unset.scss","../../../src/components/SideNav/SideNavItem.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA;AAEA;EACA;EDOA;EACA,OARc;EASd,SEiHW;;AF/GX;EAAI;;AAGJ;EAAW;;;AAGZ;EACC;EACA,eEuGW;EFtGX;EACA,OAnBoB;;AAqBpB;EACC,aEiGU;EFhGV;;;AAIF;EGjCC;EACA;EACA;EACA;EACA;;;ACYD;EACC;EACA;;AAEA;EACC,eFDgB;EEEhB,OJlBa;EImBb,aFoFoB;EEnFpB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;;AACA;EAAU,YA5BO;;AA6BjB;EAA8B,kBA5BZ;;AA8BlB;EACC;EACA,YA3Ba;;AA8Bd;AAAA;AAAA;EAGC;EACA;EACA;;AAGD;EAAiC,cF4EvB;;AE3EV;EAAiC,aF2EvB;;AEzEV;EACC;EACA;;AAKD;EACC;EACA,SFqDmB;EEpDnB;;AAKD;EACC,kBA7DmB;EA8DnB,OAlEW;;AAoEX;EAAkC;;AAElC;EACC;EACA;;AAKH;EAAiE;;AAGjE;EACC;;AAKA;EAA+B;;;AAKjC;EACC;EACA;;AAEA;EAAmC;;;AAOlC;AAAA;EAAU;;AAGX;EAAe;;AAEf;EACC;EACA;;AAGD;EAA8B;;AAC9B;EAAW;;AAEX;EACC,aFMU;EELV","file":"SideNavItem.css"}

package/dist/components/SideNav/SideNavItem.d.ts

@@ -1,19 +1,32 @@
 import React, { FC } from 'react';
-/**
- * SideNavItem properties
- */
+import { IconProps, IconPropsStrict } from '../Icon';
+import { CollapsibleListItemProps } from '../../internal';
 export interface SideNavItemPropsStrict {
     /** Controls if this is the currently active item in SideNav */
     active?: boolean;
     /** Adds one or more classnames for an element */
     className?: string;
+    /**
+     * If collapsible provided, item to be rendered as collapsible menu (accordion).
+     * In this case a SideNav must be provided as children.
+     */
+    collapsible?: CollapsibleListItemProps['collapsible'];
+    /** Indicates whether the SideNav.Item is disabled or not. */
+    disabled?: boolean;
     /** Add a href attribute so right click context menus work (open in new tab, etc) */
     href?: string;
-    /** Action for when <SideNav.Item> is clicked */
+    /** Name of icon to render on right side of SideNav.Item */
+    icon?: IconPropsStrict['name'] | IconProps;
+    /** Action for when SideNav.Item is clicked */
     onClick?: (e: React.SyntheticEvent<HTMLElement>) => void;
+    /** To be rendered on the right side of SideNav.Item */
+    prefix?: React.ReactElement;
+    /** To be rendered on the left side of SideNav.Item */
+    suffix?: React.ReactElement;
 }
 export interface SideNavItemProps extends SideNavItemPropsStrict {
     /** Unstrict Props */
     [propName: string]: any;
 }
 export declare const SideNavItem: FC<SideNavItemProps>;
+export declare const SideNavItemContext: React.Context<any>;