@node-core/ui-components 1.0.1-53352b306fcbcdb527095209221fd17b7fc955b9 → 1.0.1-5909a0bd471c5bfddac4f1bf7eee50aea0274970

package/Containers/NavBar/index.module.css

@@ -1,205 +1,2 @@
 /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
-.container {
-  border-color: var(--color-neutral-200, #e9edf0);
-  background-color: var(--color-white, #fff);
-  @media (width >= 64rem) {
-    display: flex;
-  }
-  @media (width >= 64rem) {
-    height: calc(var(--spacing, 0.25rem)*16);
-  }
-  @media (width >= 64rem) {
-    flex-direction: row;
-  }
-  @media (width >= 64rem) {
-    align-items: center;
-  }
-  @media (width >= 64rem) {
-    gap: calc(var(--spacing, 0.25rem)*8);
-  }
-  @media (width >= 64rem) {
-    border-bottom-style: var(--tw-border-style);
-    border-bottom-width: 1px;
-  }
-  @media (width >= 64rem) {
-    padding-inline: calc(var(--spacing, 0.25rem)*8);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    border-color: var(--color-neutral-900, #2c3437);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    background-color: var(--color-neutral-950, #0d121c);
-  }
-}
-.nodeIconAndMobileItemsToggler {
-  display: flex;
-  height: calc(var(--spacing, 0.25rem)*16);
-  flex-shrink: 0;
-  align-items: center;
-  border-bottom-style: var(--tw-border-style);
-  border-bottom-width: 1px;
-  border-color: var(--color-neutral-200, #e9edf0);
-  padding-inline: calc(var(--spacing, 0.25rem)*4);
-  @media (width >= 64rem) {
-    display: flex;
-  }
-  @media (width >= 64rem) {
-    height: 100%;
-  }
-  @media (width >= 64rem) {
-    align-items: center;
-  }
-  @media (width >= 64rem) {
-    border-style: var(--tw-border-style);
-    border-width: 0px;
-  }
-  @media (width >= 64rem) {
-    padding-inline: calc(var(--spacing, 0.25rem)*0);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    border-color: var(--color-neutral-900, #2c3437);
-  }
-}
-.sidebarItemToggler {
-  position: absolute;
-  right: calc(var(--spacing, 0.25rem)*4);
-  z-index: -10;
-  --tw-translate-y: -200%;
-  translate: var(--tw-translate-x) var(--tw-translate-y);
-  appearance: none;
-  opacity: 0%;
-}
-.nodeIconWrapper {
-  height: 30px;
-  flex: 1;
-}
-.navInteractionIcon,
-.sidebarItemToggler {
-  width: calc(var(--spacing, 0.25rem)*6);
-  height: calc(var(--spacing, 0.25rem)*6);
-}
-.sidebarItemTogglerLabel {
-  display: block;
-  cursor: pointer;
-  @media (width >= 64rem) {
-    display: none;
-  }
-}
-.main {
-  flex: 1;
-  flex-direction: column;
-  justify-content: space-between;
-  gap: calc(var(--spacing, 0.25rem)*4);
-  @media (width >= 64rem) {
-    display: flex;
-  }
-  @media (width >= 64rem) {
-    flex-direction: row;
-  }
-  @media (width >= 64rem) {
-    align-items: center;
-  }
-}
-.navItems {
-  display: flex;
-  flex-direction: column;
-  gap: calc(var(--spacing, 0.25rem)*0);
-  border-bottom-style: var(--tw-border-style);
-  border-bottom-width: 1px;
-  border-color: var(--color-neutral-200, #e9edf0);
-  padding: calc(var(--spacing, 0.25rem)*4);
-  @media (width >= 64rem) {
-    flex: 1;
-  }
-  @media (width >= 64rem) {
-    flex-direction: row;
-  }
-  @media (width >= 64rem) {
-    gap: calc(var(--spacing, 0.25rem)*1);
-  }
-  @media (width >= 64rem) {
-    border-style: var(--tw-border-style);
-    border-width: 0px;
-  }
-  @media (width >= 64rem) {
-    padding: calc(var(--spacing, 0.25rem)*0);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    border-color: var(--color-neutral-900, #2c3437);
-  }
-}
-.actionsWrapper {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: space-between;
-  gap: calc(var(--spacing, 0.25rem)*2);
-  border-bottom-style: var(--tw-border-style);
-  border-bottom-width: 1px;
-  border-color: var(--color-neutral-200, #e9edf0);
-  padding: calc(var(--spacing, 0.25rem)*4);
-  @media (width >= 40rem) {
-    flex-wrap: nowrap;
-  }
-  @media (width >= 64rem) {
-    flex-basis: calc(var(--spacing, 0.25rem)*96);
-  }
-  @media (width >= 64rem) {
-    border-style: var(--tw-border-style);
-    border-width: 0px;
-  }
-  @media (width >= 64rem) {
-    padding: calc(var(--spacing, 0.25rem)*0);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    border-color: var(--color-neutral-900, #2c3437);
-  }
-}
-span.searchButtonSkeleton {
-  margin-block: 1px;
-  margin-right: calc(var(--spacing, 0.25rem)*2);
-  flex-grow: 1;
-  border-radius: var(--radius-xl, 0.75rem);
-  &:empty {
-    height: calc(var(--spacing, 0.25rem)*10);
-  }
-}
-.ghIconWrapper {
-  width: calc(var(--spacing, 0.25rem)*9);
-  height: calc(var(--spacing, 0.25rem)*9);
-  border-radius: var(--radius-md, 0.375rem);
-  padding: calc(var(--spacing, 0.25rem)*2);
-  svg {
-    fill: var(--color-neutral-700, #6e7b83);
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      fill: var(--color-neutral-300, #d9e1e4);
-    }
-  }
-  &:hover {
-    background-color: var(--color-neutral-100, #f6f7f9);
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      background-color: var(--color-neutral-900, #2c3437);
-    }
-  }
-}
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-@property --tw-translate-x {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-translate-y {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-translate-z {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
+.container{border-color:var(--color-neutral-200,#e9edf0);background-color:var(--color-white,#fff)}@media (min-width:64rem){.container{height:calc(var(--spacing,.25rem)*16);align-items:center;gap:calc(var(--spacing,.25rem)*8);border-bottom-style:var(--tw-border-style);padding-inline:calc(var(--spacing,.25rem)*8);border-bottom-width:1px;flex-direction:row;display:flex}}.container:where([data-theme=dark],[data-theme=dark] *){border-color:var(--color-neutral-900,#2c3437);background-color:var(--color-neutral-950,#0d121c)}.nodeIconAndMobileItemsToggler{height:calc(var(--spacing,.25rem)*16);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-neutral-200,#e9edf0);padding-inline:calc(var(--spacing,.25rem)*4);flex-shrink:0;align-items:center;display:flex}@media (min-width:64rem){.nodeIconAndMobileItemsToggler{border-style:var(--tw-border-style);height:100%;padding-inline:calc(var(--spacing,.25rem)*0);border-width:0;align-items:center;display:flex}}.nodeIconAndMobileItemsToggler:where([data-theme=dark],[data-theme=dark] *){border-color:var(--color-neutral-900,#2c3437)}.sidebarItemToggler{right:calc(var(--spacing,.25rem)*4);z-index:-10;--tw-translate-y:-200%;translate:var(--tw-translate-x)var(--tw-translate-y);appearance:none;opacity:0;position:absolute}.nodeIconWrapper{flex:1;height:30px}.navInteractionIcon,.sidebarItemToggler{width:calc(var(--spacing,.25rem)*6);height:calc(var(--spacing,.25rem)*6)}.sidebarItemTogglerLabel{cursor:pointer;display:block}@media (min-width:64rem){.sidebarItemTogglerLabel{display:none}}.main{justify-content:space-between;gap:calc(var(--spacing,.25rem)*4);flex-direction:column;flex:1}@media (min-width:64rem){.main{flex-direction:row;align-items:center;display:flex}}.navItems{gap:calc(var(--spacing,.25rem)*0);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-neutral-200,#e9edf0);padding:calc(var(--spacing,.25rem)*4);flex-direction:column;display:flex}@media (min-width:64rem){.navItems{gap:calc(var(--spacing,.25rem)*1);border-style:var(--tw-border-style);padding:calc(var(--spacing,.25rem)*0);border-width:0;flex-direction:row;flex:1}}.navItems:where([data-theme=dark],[data-theme=dark] *){border-color:var(--color-neutral-900,#2c3437)}.actionsWrapper{justify-content:space-between;align-items:center;gap:calc(var(--spacing,.25rem)*2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-neutral-200,#e9edf0);padding:calc(var(--spacing,.25rem)*4);flex-flow:wrap;display:flex}@media (min-width:40rem){.actionsWrapper{flex-wrap:nowrap}}@media (min-width:64rem){.actionsWrapper{flex-basis:calc(var(--spacing,.25rem)*96);border-style:var(--tw-border-style);padding:calc(var(--spacing,.25rem)*0);border-width:0}}.actionsWrapper:where([data-theme=dark],[data-theme=dark] *){border-color:var(--color-neutral-900,#2c3437)}span.searchButtonSkeleton{margin-block:1px;margin-right:calc(var(--spacing,.25rem)*2);border-radius:var(--radius-xl,.75rem);flex-grow:1}span.searchButtonSkeleton:empty{height:calc(var(--spacing,.25rem)*10)}span.themeToggleSkeleton{width:calc(var(--spacing,.25rem)*9);height:calc(var(--spacing,.25rem)*9);border-radius:var(--radius-md,.375rem);padding-block:calc(var(--spacing,.25rem)*4)}.ghIconWrapper{width:calc(var(--spacing,.25rem)*9);height:calc(var(--spacing,.25rem)*9);border-radius:var(--radius-md,.375rem);padding:calc(var(--spacing,.25rem)*2)}.ghIconWrapper svg{fill:var(--color-neutral-700,#6e7b83)}.ghIconWrapper svg:where([data-theme=dark],[data-theme=dark] *){fill:var(--color-neutral-300,#d9e1e4)}.ghIconWrapper:hover{background-color:var(--color-neutral-100,#f6f7f9)}.ghIconWrapper:hover:where([data-theme=dark],[data-theme=dark] *){background-color:var(--color-neutral-900,#2c3437)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}

package/Containers/Sidebar/SidebarGroup/index.module.css

@@ -1,192 +1,2 @@
 /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
-.group {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  gap: calc(var(--spacing, 0.25rem)*2);
-  &:not(.progression) {
-    .groupName {
-      padding-inline: calc(var(--spacing, 0.25rem)*2);
-      padding-block: calc(var(--spacing, 0.25rem)*1);
-      font-size: var(--text-xs, 0.75rem);
-      line-height: var(--tw-leading, var(--text-xs--line-height, 1.33333));
-      --tw-font-weight: var(--font-weight-semibold, 600);
-      font-weight: var(--font-weight-semibold, 600);
-      color: var(--color-neutral-800, #556066);
-      &:where([data-theme=dark], [data-theme=dark] *) {
-        color: var(--color-neutral-600, #929fa5);
-      }
-    }
-  }
-  &.progression {
-    display: flex;
-    flex-direction: column;
-    gap: calc(var(--spacing, 0.25rem)*4);
-    font-size: var(--text-sm, 0.875rem);
-    line-height: var(--tw-leading, var(--text-sm--line-height, 1.42857));
-    --tw-font-weight: var(--font-weight-medium, 500);
-    font-weight: var(--font-weight-medium, 500);
-    color: var(--color-neutral-800, #556066);
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      color: var(--color-neutral-200, #e9edf0);
-    }
-    .itemList {
-      position: relative;
-      left: calc(var(--spacing, 0.25rem)*-1);
-      display: flex;
-      flex-direction: column;
-      &::after {
-        content: var(--tw-content);
-        position: absolute;
-      }
-      &::after {
-        content: var(--tw-content);
-        top: calc(var(--spacing, 0.25rem)*0);
-      }
-      &::after {
-        content: var(--tw-content);
-        left: 0.45rem;
-      }
-      &::after {
-        content: var(--tw-content);
-        z-index: 10;
-      }
-      &::after {
-        content: var(--tw-content);
-        height: 100%;
-      }
-      &::after {
-        content: var(--tw-content);
-        width: 1px;
-      }
-      &::after {
-        content: var(--tw-content);
-        background-color: var(--color-neutral-200, #e9edf0);
-      }
-      &::after {
-        content: var(--tw-content);
-        --tw-content: '';
-        content: var(--tw-content);
-      }
-      &:where([data-theme=dark], [data-theme=dark] *) {
-        &::after {
-          content: var(--tw-content);
-          background-color: var(--color-neutral-800, #556066);
-        }
-      }
-      a {
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            position: absolute;
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            bottom: calc(50% + 0.25rem);
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            left: calc(var(--spacing, 0.25rem)*0);
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            height: calc(var(--spacing, 0.25rem)*20);
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            width: calc(var(--spacing, 0.25rem)*4);
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            background-color: var(--color-white, #fff);
-          }
-        }
-        &:first-child {
-          &::before {
-            content: var(--tw-content);
-            --tw-content: '';
-            content: var(--tw-content);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            position: absolute;
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            top: calc(50% + 0.25rem);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            left: calc(var(--spacing, 0.25rem)*0);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            height: calc(var(--spacing, 0.25rem)*20);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            width: calc(var(--spacing, 0.25rem)*4);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            background-color: var(--color-white, #fff);
-          }
-        }
-        &:last-child {
-          &::after {
-            content: var(--tw-content);
-            --tw-content: '';
-            content: var(--tw-content);
-          }
-        }
-        &:first-child {
-          &:where([data-theme=dark], [data-theme=dark] *) {
-            &::before {
-              content: var(--tw-content);
-              background-color: var(--color-neutral-950, #0d121c);
-            }
-          }
-        }
-        &:last-child {
-          &:where([data-theme=dark], [data-theme=dark] *) {
-            &::after {
-              content: var(--tw-content);
-              background-color: var(--color-neutral-950, #0d121c);
-            }
-          }
-        }
-      }
-    }
-  }
-}
-@property --tw-font-weight {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-content {
-  syntax: "*";
-  initial-value: "";
-  inherits: false;
-}
+.group{gap:calc(var(--spacing,.25rem)*2);flex-direction:column;width:100%;display:flex}.group:not(.progression) .groupName{padding-inline:calc(var(--spacing,.25rem)*2);padding-block:calc(var(--spacing,.25rem)*1);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,1.33333));--tw-font-weight:var(--font-weight-semibold,600);font-weight:var(--font-weight-semibold,600);color:var(--color-neutral-800,#556066)}.group:not(.progression) .groupName:where([data-theme=dark],[data-theme=dark] *){color:var(--color-neutral-600,#929fa5)}.group.progression{gap:calc(var(--spacing,.25rem)*4);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,1.42857));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);color:var(--color-neutral-800,#556066);flex-direction:column;display:flex}.group.progression:where([data-theme=dark],[data-theme=dark] *){color:var(--color-neutral-200,#e9edf0)}.group.progression .itemList{left:calc(var(--spacing,.25rem)*-1);flex-direction:column;display:flex;position:relative}.group.progression .itemList:after{content:var(--tw-content);content:var(--tw-content);top:calc(var(--spacing,.25rem)*0);content:var(--tw-content);content:var(--tw-content);z-index:10;content:var(--tw-content);content:var(--tw-content);content:var(--tw-content);background-color:var(--color-neutral-200,#e9edf0);content:var(--tw-content);--tw-content:"";content:var(--tw-content);width:1px;height:100%;position:absolute;left:.45rem}.group.progression .itemList:where([data-theme=dark],[data-theme=dark] *):after{content:var(--tw-content);background-color:var(--color-neutral-800,#556066)}.group.progression .itemList a:first-child:before{content:var(--tw-content);content:var(--tw-content);content:var(--tw-content);bottom:calc(50% + 0.25rem);left:calc(var(--spacing,.25rem)*0);content:var(--tw-content);height:calc(var(--spacing,.25rem)*20);content:var(--tw-content);width:calc(var(--spacing,.25rem)*4);content:var(--tw-content);background-color:var(--color-white,#fff);content:var(--tw-content);--tw-content:"";content:var(--tw-content);position:absolute}.group.progression .itemList a:last-child:after{content:var(--tw-content);content:var(--tw-content);content:var(--tw-content);top:calc(50% + 0.25rem);left:calc(var(--spacing,.25rem)*0);content:var(--tw-content);height:calc(var(--spacing,.25rem)*20);content:var(--tw-content);width:calc(var(--spacing,.25rem)*4);content:var(--tw-content);background-color:var(--color-white,#fff);content:var(--tw-content);--tw-content:"";content:var(--tw-content);position:absolute}.group.progression .itemList a:first-child:where([data-theme=dark],[data-theme=dark] *):before,.group.progression .itemList a:last-child:where([data-theme=dark],[data-theme=dark] *):after{content:var(--tw-content);background-color:var(--color-neutral-950,#0d121c)}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}

package/Containers/Sidebar/SidebarItem/index.js

@@ -7,5 +7,5 @@ import ProgressionIcon from '../ProgressionIcon';
 const SidebarItem = ({ label, link, showProgressionIcons = false, ...props }) => (_jsxs(BaseActiveLink, { className: classNames({
         [styles.item]: true,
         [styles.progression]: showProgressionIcons,
-    }), href: link, activeClassName: styles.active, ...props, children: [showProgressionIcons && (_jsx(ProgressionIcon, { className: styles.progressionIcon })), _jsx("span", { className: styles.label, children: label }), /^https?:/.test(link) && _jsx(ArrowUpRightIcon, { className: styles.icon })] }));
+    }), href: link, activeClassName: styles.active, ...props, children: [showProgressionIcons && (_jsx(ProgressionIcon, { className: styles.progressionIcon })), _jsxs("div", { className: styles.label, children: [_jsx("span", { children: label }), /^https?:/.test(link) && _jsx(ArrowUpRightIcon, { className: styles.icon })] })] }));
 export default SidebarItem;

package/Containers/Sidebar/SidebarItem/index.module.css

@@ -1,67 +1,2 @@
 /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
-.item {
-  position: relative;
-  z-index: 20;
-  display: flex;
-  width: 100%;
-  align-items: center;
-  overflow: hidden;
-  font-size: var(--text-sm, 0.875rem);
-  line-height: var(--tw-leading, var(--text-sm--line-height, 1.42857));
-  --tw-font-weight: var(--font-weight-regular, 400);
-  font-weight: var(--font-weight-regular, 400);
-  color: var(--color-neutral-800, #556066);
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    color: var(--color-neutral-200, #e9edf0);
-  }
-  .label {
-    padding: calc(var(--spacing, 0.25rem)*2);
-    font-size: var(--text-sm, 0.875rem);
-    line-height: var(--tw-leading, var(--text-sm--line-height, 1.42857));
-    --tw-font-weight: var(--font-weight-regular, 400);
-    font-weight: var(--font-weight-regular, 400);
-  }
-  .progressionIcon {
-    flex-shrink: 0;
-    fill: var(--color-neutral-200, #e9edf0);
-    stroke: var(--color-white, #fff);
-    stroke-width: 4;
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      fill: var(--color-neutral-800, #556066);
-    }
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      stroke: var(--color-neutral-950, #0d121c);
-    }
-  }
-  .icon {
-    width: calc(var(--spacing, 0.25rem)*3);
-    height: calc(var(--spacing, 0.25rem)*3);
-    color: var(--color-neutral-500, #b1bcc2);
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      color: var(--color-neutral-200, #e9edf0);
-    }
-  }
-  &.progression {
-    .label {
-      padding: calc(var(--spacing, 0.25rem)*1);
-    }
-  }
-  &.active {
-    color: var(--color-neutral-900, #2c3437);
-    &:where([data-theme=dark], [data-theme=dark] *) {
-      color: var(--color-white, #fff);
-    }
-    .progressionIcon {
-      fill: var(--color-green-500, #5fa04e);
-    }
-    &:not(.progression) .label {
-      border-radius: var(--radius-sm, 0.25rem);
-      background-color: var(--color-green-600, #417e38);
-      color: var(--color-white, #fff);
-    }
-  }
-}
-@property --tw-font-weight {
-  syntax: "*";
-  inherits: false;
-}
+.item{z-index:20;border-radius:var(--radius-md,.375rem);width:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,1.42857));--tw-font-weight:var(--font-weight-regular,400);font-weight:var(--font-weight-regular,400);color:var(--color-neutral-800,#556066);align-items:center;margin-bottom:1px;display:flex;position:relative;overflow:hidden}.item:where([data-theme=dark],[data-theme=dark] *){color:var(--color-neutral-200,#e9edf0)}.item:hover:not(.progression) .label{border-radius:var(--radius-sm,.25rem);background-color:var(--color-neutral-100,#f6f7f9);color:var(--color-neutral-900,#2c3437)}.item:hover:not(.progression) .label:where([data-theme=dark],[data-theme=dark] *){background-color:var(--color-neutral-900,#2c3437);color:var(--color-neutral-100,#f6f7f9)}.item:hover .icon{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y);color:var(--color-green-600,#417e38)}.item:hover .icon:where([data-theme=dark],[data-theme=dark] *){color:var(--color-green-400,#84ba64)}.item:hover .progressionIcon{fill:var(--color-green-200,#c5e5b4)}.item:hover .progressionIcon:where([data-theme=dark],[data-theme=dark] *){fill:var(--color-green-300,#99cc7d)}.item .label{align-items:center;gap:calc(var(--spacing,.25rem)*1.5);padding:calc(var(--spacing,.25rem)*2);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,1.42857));--tw-font-weight:var(--font-weight-regular,400);font-weight:var(--font-weight-regular,400);display:flex}.item .progressionIcon{fill:var(--color-neutral-200,#e9edf0);stroke:var(--color-white,#fff);stroke-width:4px;flex-shrink:0}.item .progressionIcon:where([data-theme=dark],[data-theme=dark] *){fill:var(--color-neutral-800,#556066);stroke:var(--color-neutral-950,#0d121c)}.item .icon{width:calc(var(--spacing,.25rem)*3);height:calc(var(--spacing,.25rem)*3);color:var(--color-neutral-500,#b1bcc2)}.item .icon:where([data-theme=dark],[data-theme=dark] *){color:var(--color-neutral-200,#e9edf0)}.item.progression .label{padding:calc(var(--spacing,.25rem)*1)}.item.progression:not(.active):hover .label{border-radius:var(--radius-sm,.25rem);background-color:var(--color-neutral-100,#f6f7f9)}.item.progression:not(.active):hover .label:where([data-theme=dark],[data-theme=dark] *){background-color:var(--color-neutral-900,#2c3437)}.item.active{color:var(--color-neutral-900,#2c3437)}.item.active:where([data-theme=dark],[data-theme=dark] *){color:var(--color-white,#fff)}.item.active .progressionIcon{fill:var(--color-green-500,#5fa04e)}.item.active:not(.progression) .label{border-radius:var(--radius-sm,.25rem);background-color:var(--color-green-600,#417e38);color:var(--color-white,#fff)}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}

package/Containers/Sidebar/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Select from '#ui/Common/Select';
+import WithNoScriptSelect from '#ui/Common/Select/NoScriptSelect';
 import SidebarGroup from '#ui/Containers/Sidebar/SidebarGroup';
 import styles from './index.module.css';
 const SideBar = ({ groups, pathname, title, onSelect, as, showProgressionIcons = false, children, placeholder, }) => {
@@ -10,6 +10,6 @@ const SideBar = ({ groups, pathname, title, onSelect, as, showProgressionIcons =
     const currentItem = selectItems
         .flatMap(item => item.items)
         .find(item => pathname === item.value);
-    return (_jsxs("aside", { className: styles.wrapper, children: [children, selectItems.length > 0 && (_jsx(Select, { label: title, values: selectItems, defaultValue: currentItem?.value, placeholder: placeholder, onChange: onSelect, className: styles.mobileSelect })), groups.map(({ groupName, items }) => (_jsx(SidebarGroup, { groupName: groupName, items: items, pathname: pathname, as: as, showProgressionIcons: showProgressionIcons, className: styles.navigation }, groupName.toString())))] }));
+    return (_jsxs("aside", { className: styles.wrapper, children: [children, selectItems.length > 0 && (_jsx(WithNoScriptSelect, { label: title, values: selectItems, defaultValue: currentItem?.value, placeholder: placeholder, onChange: onSelect, className: styles.mobileSelect, as: as })), groups.map(({ groupName, items }) => (_jsx(SidebarGroup, { groupName: groupName, items: items, pathname: pathname, as: as, showProgressionIcons: showProgressionIcons, className: styles.navigation }, groupName.toString())))] }));
 };
 export default SideBar;

package/Containers/Sidebar/index.module.css

@@ -1,48 +1,2 @@
 /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
-.wrapper {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  gap: calc(var(--spacing, 0.25rem)*8);
-  overflow: auto;
-  border-right-style: var(--tw-border-style);
-  border-right-width: 0px;
-  border-color: var(--color-neutral-200, #e9edf0);
-  background-color: var(--color-white, #fff);
-  padding-inline: calc(var(--spacing, 0.25rem)*4);
-  padding-block: calc(var(--spacing, 0.25rem)*6);
-  @media (width >= 40rem) {
-    border-right-style: var(--tw-border-style);
-    border-right-width: 1px;
-  }
-  @media (width >= 48rem) {
-    max-width: var(--container-xs, 20rem);
-  }
-  @media (width >= 64rem) {
-    padding-inline: calc(var(--spacing, 0.25rem)*6);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    border-color: var(--color-neutral-900, #2c3437);
-  }
-  &:where([data-theme=dark], [data-theme=dark] *) {
-    background-color: var(--color-neutral-950, #0d121c);
-  }
-  .navigation {
-    display: none;
-    @media (width >= 40rem) {
-      display: flex;
-    }
-  }
-  .mobileSelect {
-    display: flex;
-    width: 100%;
-    @media (width >= 40rem) {
-      display: none;
-    }
-  }
-}
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
+.wrapper{gap:calc(var(--spacing,.25rem)*8);border-right-style:var(--tw-border-style);border-right-width:0;border-color:var(--color-neutral-200,#e9edf0);background-color:var(--color-white,#fff);width:100%;padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*6);flex-direction:column;display:flex}@media (min-width:40rem){.wrapper{border-right-style:var(--tw-border-style);border-right-width:1px;overflow:auto}}@media (min-width:48rem){.wrapper{max-width:var(--container-xs,20rem)}}@media (min-width:64rem){.wrapper{padding-inline:calc(var(--spacing,.25rem)*6)}}.wrapper:where([data-theme=dark],[data-theme=dark] *){border-color:var(--color-neutral-900,#2c3437);background-color:var(--color-neutral-950,#0d121c)}.wrapper .navigation{display:none}@media (min-width:40rem){.wrapper .navigation{display:flex}}.wrapper .mobileSelect{width:100%;display:flex}@media (min-width:40rem){.wrapper .mobileSelect{display:none}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}

package/MDX/CodeTabs.js

@@ -1,16 +1,29 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { useMemo } from 'react';
 import CodeTabs from '#ui/Common/CodeTabs';
+const NAME_OVERRIDES = {
+    mjs: 'ESM',
+};
 const MDXCodeTabs = ({ languages: rawLanguages, displayNames: rawDisplayNames, children: codes, defaultTab = '0', ...props }) => {
-    const languages = rawLanguages.split('|');
-    const displayNames = rawDisplayNames?.split('|') ?? [];
-    const tabs = languages.map((language, index) => {
-        const displayName = displayNames[index];
-        return {
-            key: `${language}-${index}`,
-            label: displayName?.length ? displayName : language.toUpperCase(),
-        };
-    });
+    const { tabs, languages } = useMemo(() => {
+        const occurrences = {};
+        const languages = rawLanguages.split('|');
+        const displayNames = rawDisplayNames?.split('|') ?? [];
+        const tabs = languages.map((language, index) => {
+            const base = displayNames[index]?.trim() ||
+                NAME_OVERRIDES[language] ||
+                language.toUpperCase();
+            const count = occurrences[base] ?? 0;
+            occurrences[base] = count + 1;
+            const label = count > 0 ? `${base} (${count + 1})` : base;
+            return {
+                key: `${language}-${index}`,
+                label: label,
+            };
+        });
+        return { tabs, languages };
+    }, [rawLanguages, rawDisplayNames]);
     return (_jsx(CodeTabs, { tabs: tabs, defaultValue: tabs[Number(defaultTab)].key, ...props, children: languages.map((_, index) => (_jsx(TabsPrimitive.Content, { value: tabs[index].key, children: codes[index] }, tabs[index].key))) }));
 };
 export default MDXCodeTabs;

package/Providers/NotificationProvider/index.module.css

@@ -1,7 +1,2 @@
 /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
-.viewport {
-  position: fixed;
-  right: calc(var(--spacing, 0.25rem)*0);
-  bottom: calc(var(--spacing, 0.25rem)*0);
-  list-style-type: none;
-}
+.viewport{right:calc(var(--spacing,.25rem)*0);bottom:calc(var(--spacing,.25rem)*0);list-style-type:none;position:fixed}

package/package.json

@@ -12,8 +12,11 @@
     "@radix-ui/react-tabs": "~1.1.12",
     "@radix-ui/react-toast": "~1.2.14",
     "@radix-ui/react-tooltip": "~1.2.7",
+    "@tailwindcss/postcss": "~4.1.11",
     "@vcarl/remark-headings": "~0.1.0",
-    "classnames": "~2.5.1"
+    "classnames": "~2.5.1",
+    "postcss-calc": "^10.1.1",
+    "tailwindcss": "~4.0.17"
   },
   "imports": {
     "#ui/*": [
@@ -23,15 +26,17 @@
   "engines": {
     "node": ">=20"
   },
-  "version": "1.0.1-53352b306fcbcdb527095209221fd17b7fc955b9",
+  "version": "1.0.1-5909a0bd471c5bfddac4f1bf7eee50aea0274970",
   "scripts": {
     "compile:ts": "tsc",
     "compile:css": "postcss --dir dist --base src \"src/**/*.module.css\" src/styles/index.css",
     "compile": "node --run compile:ts && node --run compile:css",
-    "lint": "turbo run lint:js lint:css",
+    "lint": "node --run lint:js && node --run lint:css",
     "lint:css": "stylelint \"**/*.css\" --allow-empty-input --cache --cache-strategy=content --cache-location=.stylelintcache",
-    "lint:fix": "node --run lint -- -- --fix",
+    "lint:css:fix": "node --run lint:css -- --fix",
+    "lint:fix": "node --run lint:js:fix && node --run lint:css:fix",
     "lint:js": "eslint \"**/*.{js,mjs,ts,tsx}\"",
+    "lint:js:fix": "node --run lint:js -- --fix",
     "lint:types": "tsc --noEmit",
     "storybook": "cross-env NODE_NO_WARNINGS=1 storybook dev -p 6006 --quiet",
     "storybook:build": "cross-env NODE_NO_WARNINGS=1 storybook build --quiet --webpack-stats-json",