@well-insight/ui 0.1.7 → 0.1.8

package/dist/components/Knob/styles.css

@@ -0,0 +1,45 @@
+/* —— Form: Knob —— */
+.wi-knob {
+    align-items: center;
+    display: inline-flex;
+    justify-content: center;
+    position: relative;
+    touch-action: none;
+    user-select: none;
+}
+
+.wi-knob--disabled {
+    opacity: var(--wi-opacity-disabled);
+    pointer-events: none;
+}
+
+.wi-knob__svg {
+    cursor: pointer;
+    display: block;
+}
+
+.wi-knob__track {
+    stroke: color-mix(in srgb, var(--wi-color-text-muted) 28%, var(--wi-color-surface));
+}
+
+.wi-knob__value {
+    stroke: var(--wi-color-primary);
+    stroke-linecap: round;
+    transition: stroke-dashoffset var(--wi-motion-fast) var(--wi-motion-ease);
+}
+
+.wi-knob__label {
+    color: var(--wi-color-text);
+    font-size: var(--wi-font-size-md);
+    font-weight: 600;
+    left: 50%;
+    pointer-events: none;
+    position: absolute;
+    top: 50%;
+    transform: translate(-50%, -50%);
+}
+
+.wi-knob:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}

package/dist/components/Label/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Label/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,aAAa,CAAA;AAChD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Label/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,aAAa,CAAA;AAChD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/Label/styles.css

@@ -0,0 +1,8 @@
+/* —— Form: Label —— */
+.wi-label {
+    color: var(--wi-color-text);
+    display: inline-block;
+    font-size: var(--wi-font-size-md);
+    font-weight: 600;
+    line-height: 1.4;
+}

package/dist/components/Layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,YAAY,EACV,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,aAAa,GACd,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,YAAY,EACV,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,aAAa,GACd,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA"}

package/dist/components/Layout/styles.css

@@ -0,0 +1,349 @@
+/* —— Panel: Layout —— */
+.wi-layout {
+    background: var(--wi-color-surface);
+    box-sizing: border-box;
+    color: var(--wi-color-text);
+    flex: auto;
+    min-height: 0;
+    min-width: 0;
+    overflow: hidden;
+    position: relative;
+    transition: background-color var(--wi-motion-normal) var(--wi-motion-ease),
+        color var(--wi-motion-normal) var(--wi-motion-ease);
+    width: 100%;
+    z-index: auto;
+}
+
+.wi-layout--embedded {
+    background: color-mix(in srgb, var(--wi-color-text-muted) 6%, var(--wi-color-surface));
+}
+
+.wi-layout--absolute-positioned {
+    inset: 0;
+    position: absolute;
+}
+
+.wi-layout__scroll {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    min-height: 0;
+    min-width: 0;
+    overflow: auto;
+    overflow-x: hidden;
+    position: relative;
+    width: 100%;
+}
+
+.wi-layout__scroll--has-sider {
+    /* direction set inline (matches naive hasSiderStyle) */
+    flex-wrap: nowrap;
+}
+
+.wi-layout__scrollbar {
+    box-sizing: border-box;
+    flex: 1 1 auto;
+    height: 100%;
+    min-height: 0;
+    min-width: 0;
+    width: 100%;
+}
+
+.wi-layout__scrollbar .wi-layout__scroll {
+    /* view hosts flex children; scrolling is on the wrap */
+    height: auto;
+    min-height: 100%;
+    overflow: visible;
+}
+
+/* Nested layout / content grow to fill remaining space */
+.wi-layout__scroll > .wi-layout,
+.wi-layout__scroll > .wi-layout-content {
+    flex: 1 1 auto;
+    min-height: 0;
+    min-width: 0;
+}
+
+.wi-layout-content {
+    flex: 1 1 auto;
+    min-height: 0;
+    min-width: 0;
+}
+
+.wi-layout-content > .wi-layout__scroll,
+.wi-layout-content > .wi-layout__scrollbar {
+    flex: 1 1 auto;
+}
+
+.wi-layout-header,
+.wi-layout-footer {
+    background: var(--wi-color-surface);
+    box-sizing: border-box;
+    color: var(--wi-color-text);
+    flex: 0 0 auto;
+    transition: background-color var(--wi-motion-fast) var(--wi-motion-ease),
+        color var(--wi-motion-fast) var(--wi-motion-ease),
+        border-color var(--wi-motion-fast) var(--wi-motion-ease);
+    width: 100%;
+}
+
+.wi-layout-header--bordered {
+    border-bottom: 1px solid var(--wi-color-border);
+}
+
+.wi-layout-footer--bordered {
+    border-top: 1px solid var(--wi-color-border);
+}
+
+.wi-layout-header--inverted,
+.wi-layout-footer--inverted,
+.wi-layout-sider--inverted {
+    background: var(--wi-color-contrast);
+    color: var(--wi-color-contrast-fg);
+}
+
+.wi-layout-header--inverted.wi-layout-header--bordered {
+    border-bottom-color: color-mix(in srgb, var(--wi-color-contrast-fg) 18%, transparent);
+}
+
+.wi-layout-footer--inverted.wi-layout-footer--bordered {
+    border-top-color: color-mix(in srgb, var(--wi-color-contrast-fg) 18%, transparent);
+}
+
+.wi-layout-header--absolute-positioned,
+.wi-layout-footer--absolute-positioned,
+.wi-layout-sider--absolute-positioned {
+    position: absolute;
+    z-index: 1;
+}
+
+.wi-layout-header--absolute-positioned {
+    inset-inline: 0;
+    top: 0;
+}
+
+.wi-layout-footer--absolute-positioned {
+    bottom: 0;
+    inset-inline: 0;
+}
+
+.wi-layout-sider {
+    background: var(--wi-color-surface);
+    box-sizing: border-box;
+    color: var(--wi-color-text);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: flex-end;
+    /* Do not clip the collapse trigger (it sits half outside the sider edge).
+       Collapsed transform overflow is clipped by `.wi-layout { overflow: hidden }`. */
+    overflow: visible;
+    position: relative;
+    transition: color var(--wi-motion-normal) var(--wi-motion-ease),
+        border-color var(--wi-motion-normal) var(--wi-motion-ease),
+        max-width var(--wi-motion-normal) var(--wi-motion-ease),
+        background-color var(--wi-motion-normal) var(--wi-motion-ease);
+    z-index: 1;
+}
+
+.wi-layout-sider--right-placement {
+    justify-content: flex-start;
+}
+
+.wi-layout-sider__scroll {
+    box-sizing: border-box;
+    flex-grow: 1;
+    flex-shrink: 0;
+    height: 100%;
+    max-width: 100%;
+    opacity: 0;
+    overflow: hidden;
+    transition: opacity var(--wi-motion-normal) var(--wi-motion-ease);
+    width: 100%;
+}
+
+.wi-layout-sider__scrollbar {
+    box-sizing: border-box;
+    flex-grow: 1;
+    flex-shrink: 0;
+    height: 100%;
+    max-width: 100%;
+    min-width: 0;
+    opacity: 0;
+    transition: opacity var(--wi-motion-normal) var(--wi-motion-ease);
+    width: 100%;
+}
+
+.wi-layout-sider__scrollbar .wi-layout-sider__scroll {
+    height: auto;
+    max-width: none;
+    min-height: 100%;
+    opacity: 1;
+    overflow: visible;
+}
+
+.wi-layout-sider--show-content > .wi-layout-sider__scroll {
+    opacity: 1;
+    overflow: auto;
+}
+
+.wi-layout-sider--show-content > .wi-layout-sider__scrollbar {
+    opacity: 1;
+}
+
+.wi-layout-sider--collapse-width > .wi-layout-sider__scroll,
+.wi-layout-sider--collapse-width > .wi-layout-sider__scrollbar {
+    flex-shrink: 1;
+    min-width: 0;
+}
+
+.wi-layout-sider__border {
+    background: var(--wi-color-border);
+    bottom: 0;
+    position: absolute;
+    top: 0;
+    transition: background-color var(--wi-motion-fast) var(--wi-motion-ease);
+    width: 1px;
+}
+
+.wi-layout-sider--left-placement > .wi-layout-sider__border,
+.wi-layout-sider--left > .wi-layout-sider__border {
+    right: 0;
+}
+
+.wi-layout-sider--right-placement > .wi-layout-sider__border,
+.wi-layout-sider--right > .wi-layout-sider__border {
+    left: 0;
+}
+
+.wi-layout-sider--inverted > .wi-layout-sider__border {
+    background: color-mix(in srgb, var(--wi-color-contrast-fg) 18%, transparent);
+}
+
+.wi-layout-sider__trigger {
+    background: transparent;
+    border: 0;
+    color: var(--wi-color-text-muted);
+    cursor: pointer;
+    font: inherit;
+    padding: 0;
+    position: absolute;
+    z-index: 2;
+}
+
+.wi-layout-sider__trigger:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}
+
+.wi-layout-sider__trigger--arrow-circle {
+    align-items: center;
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: 50%;
+    box-shadow: var(--wi-shadow-sm);
+    display: inline-flex;
+    font-size: 1rem;
+    height: 1.5rem;
+    justify-content: center;
+    right: 0;
+    top: 50%;
+    transform: translate(50%, -50%);
+    width: 1.5rem;
+}
+
+.wi-layout-sider--right-placement > .wi-layout-sider__trigger--arrow-circle {
+    left: 0;
+    right: auto;
+    transform: translate(-50%, -50%);
+}
+
+.wi-layout-sider__arrow {
+    display: inline-block;
+    line-height: 1;
+    transform: rotate(180deg);
+    transition: transform var(--wi-motion-normal) var(--wi-motion-ease);
+}
+
+.wi-layout-sider--collapsed > .wi-layout-sider__trigger--arrow-circle .wi-layout-sider__arrow {
+    transform: rotate(0deg);
+}
+
+.wi-layout-sider--right-placement > .wi-layout-sider__trigger--arrow-circle .wi-layout-sider__arrow {
+    transform: rotate(0deg);
+}
+
+.wi-layout-sider--right-placement.wi-layout-sider--collapsed
+    > .wi-layout-sider__trigger--arrow-circle
+    .wi-layout-sider__arrow {
+    transform: rotate(180deg);
+}
+
+.wi-layout-sider--inverted > .wi-layout-sider__trigger--arrow-circle {
+    background: var(--wi-color-contrast);
+    border-color: color-mix(in srgb, var(--wi-color-contrast-fg) 18%, transparent);
+    color: var(--wi-color-contrast-fg);
+}
+
+.wi-layout-sider__trigger--bar {
+    height: 4.5rem;
+    right: -1.75rem;
+    top: calc(50% - 2.25rem);
+    width: 2rem;
+}
+
+.wi-layout-sider--right-placement > .wi-layout-sider__trigger--bar {
+    left: -1.75rem;
+    right: auto;
+    transform: rotate(180deg);
+}
+
+.wi-layout-sider__bar {
+    display: block;
+    height: 100%;
+    position: relative;
+    width: 100%;
+}
+
+.wi-layout-sider__bar-top,
+.wi-layout-sider__bar-bottom {
+    background: var(--wi-color-text-muted);
+    border-radius: 2px;
+    height: 2.375rem;
+    left: 0.875rem;
+    position: absolute;
+    transition: background-color var(--wi-motion-fast) var(--wi-motion-ease),
+        transform var(--wi-motion-fast) var(--wi-motion-ease);
+    width: 4px;
+}
+
+.wi-layout-sider__bar-top {
+    top: 0;
+}
+
+.wi-layout-sider__bar-bottom {
+    top: 2.125rem;
+}
+
+.wi-layout-sider__trigger--bar:hover .wi-layout-sider__bar-top {
+    transform: rotate(12deg) scale(1.15) translateY(-2px);
+}
+
+.wi-layout-sider__trigger--bar:hover .wi-layout-sider__bar-bottom {
+    transform: rotate(-12deg) scale(1.15) translateY(2px);
+}
+
+.wi-layout-sider--collapsed > .wi-layout-sider__trigger--bar:hover .wi-layout-sider__bar-top {
+    transform: rotate(-12deg) scale(1.15) translateY(-2px);
+}
+
+.wi-layout-sider--collapsed > .wi-layout-sider__trigger--bar:hover .wi-layout-sider__bar-bottom {
+    transform: rotate(12deg) scale(1.15) translateY(2px);
+}
+
+.wi-layout-sider--absolute-positioned {
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    top: 0;
+}

package/dist/components/Listbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Listbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACpD,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Listbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACpD,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/Listbox/styles.css

@@ -0,0 +1,68 @@
+/* —— Form: Listbox —— */
+.wi-listbox {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    display: inline-flex;
+    flex-direction: column;
+    min-width: var(--wi-menu-min-width-lg);
+    overflow: hidden;
+}
+
+.wi-listbox--disabled {
+    opacity: var(--wi-opacity-disabled);
+    pointer-events: none;
+}
+
+.wi-listbox__filter {
+    background: var(--wi-color-surface);
+    border: 0;
+    border-bottom: 1px solid var(--wi-color-border);
+    color: var(--wi-color-text);
+    font: inherit;
+    padding: var(--wi-space-2) var(--wi-space-3);
+}
+
+.wi-listbox__list {
+    list-style: none;
+    margin: 0;
+    max-height: 14rem;
+    overflow: auto;
+    padding: var(--wi-space-1);
+}
+
+.wi-listbox__option {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    display: block;
+    font: inherit;
+    font-size: var(--wi-control-font-medium);
+    min-height: var(--wi-control-height-medium);
+    padding: 0 var(--wi-control-padding-x-medium);
+    text-align: start;
+    width: 100%;
+}
+
+.wi-listbox__option--selected {
+    background: color-mix(in srgb, var(--wi-color-primary) 16%, var(--wi-color-surface));
+    color: var(--wi-color-primary);
+    font-weight: 600;
+}
+
+.wi-listbox__option:hover:not(:disabled):not(.wi-listbox__option--selected) {
+    background: color-mix(in srgb, var(--wi-color-primary) 8%, var(--wi-color-surface));
+}
+
+.wi-listbox__option:disabled {
+    cursor: not-allowed;
+    opacity: var(--wi-opacity-disabled);
+}
+
+.wi-listbox__empty {
+    color: var(--wi-color-text-muted);
+    padding: var(--wi-space-3);
+    text-align: center;
+}

package/dist/components/MegaMenu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MegaMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MegaMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/MegaMenu/styles.css

@@ -0,0 +1,75 @@
+/* —— Menu: MegaMenu —— */
+.wi-megamenu {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    display: flex;
+    gap: var(--wi-space-1);
+    padding: var(--wi-space-1);
+    position: relative;
+}
+
+.wi-megamenu__item {
+    position: relative;
+}
+
+.wi-megamenu__trigger {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: inherit;
+    cursor: pointer;
+    display: inline-flex;
+    font: inherit;
+    gap: var(--wi-space-1);
+    padding: var(--wi-space-2) var(--wi-space-3);
+}
+
+.wi-megamenu__item--open .wi-megamenu__trigger,
+.wi-megamenu__trigger:hover:not(:disabled) {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, transparent);
+}
+
+.wi-megamenu__panel {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    box-shadow: var(--wi-shadow-md);
+    display: flex;
+    gap: var(--wi-space-4);
+    left: 0;
+    margin-top: var(--wi-space-1);
+    padding: var(--wi-space-3);
+    position: absolute;
+    top: 100%;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-megamenu__panel--teleported {
+    margin-top: 0;
+    position: fixed;
+    top: auto;
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-megamenu__column {
+    display: flex;
+    flex-direction: column;
+    gap: var(--wi-space-1);
+    min-width: 8rem;
+}
+
+.wi-megamenu__link {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: inherit;
+    cursor: pointer;
+    font: inherit;
+    padding: var(--wi-space-2);
+    text-align: left;
+}
+
+.wi-megamenu__link:hover:not(:disabled) {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, transparent);
+}

package/dist/components/Menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,YAAY,CAAA;AAC9C,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,YAAY,CAAA;AAC9C,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/Menu/styles.css

@@ -0,0 +1,68 @@
+/* —— Menu: Menu —— */
+.wi-menu {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    min-width: var(--wi-menu-min-width);
+    padding: var(--wi-space-1);
+}
+
+.wi-menu--popup {
+    box-shadow: var(--wi-shadow-md);
+    position: absolute;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-menu--teleported {
+    position: fixed;
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-menu__item {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    padding: var(--wi-space-2) var(--wi-space-3);
+    text-align: start;
+    width: 100%;
+}
+
+.wi-menu__item:hover:not(:disabled) {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, var(--wi-color-surface));
+}
+
+.wi-menu__item:disabled {
+    cursor: not-allowed;
+    opacity: var(--wi-opacity-disabled);
+}
+
+.wi-menu__item:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}
+
+.wi-menu__separator {
+    background: var(--wi-color-border);
+    height: 1px;
+    margin: var(--wi-space-1) 0;
+}
+
+.wi-menu--collapsed {
+    width: auto;
+}
+
+.wi-menu__item {
+    align-items: center;
+    display: flex;
+    gap: var(--wi-space-2);
+}
+
+.wi-menu__caret {
+    margin-left: auto;
+}

package/dist/components/Menubar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menubar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACpD,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menubar/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACpD,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA"}