@editora/ui-core 0.1.8 → 0.1.10

package/dist/dropdown.cjs.js

@@ -0,0 +1,511 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("./ElementBase-1b301e7f.js"),y=require("./menu-item-styles-83ad1e22.js"),l=['[role="menuitem"]','[role="menuitemcheckbox"]','[role="menuitemradio"]',".item","[data-menu-item]"].join(", "),k=`
+  :host {
+    --ui-dropdown-bg: var(
+      --ui-dropdown-menu-bg,
+      var(--base-dropdown-bg, color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent))
+    );
+    --ui-dropdown-color: var(--ui-dropdown-menu-color, var(--base-dropdown-color, var(--ui-color-text, #0f172a)));
+    --ui-dropdown-muted: var(--ui-dropdown-menu-muted, color-mix(in srgb, var(--ui-dropdown-color) 62%, transparent));
+    --ui-dropdown-border-color: var(
+      --ui-dropdown-menu-border-color,
+      color-mix(in srgb, var(--ui-color-border, rgba(15, 23, 42, 0.14)) 86%, transparent)
+    );
+    --ui-dropdown-border: var(--ui-dropdown-menu-border, var(--base-dropdown-border, 1px solid var(--ui-dropdown-border-color)));
+    --ui-dropdown-shadow: var(--ui-dropdown-menu-shadow, var(--base-dropdown-shadow, 0 10px 24px rgba(15, 23, 42, 0.14)));
+    --ui-dropdown-radius: var(--ui-dropdown-menu-radius, var(--base-dropdown-radius, var(--ui-radius, 4px)));
+    --ui-dropdown-padding: var(--ui-dropdown-menu-padding, var(--base-dropdown-content-padding, 0px));
+    --ui-dropdown-min-width: var(--ui-dropdown-menu-min-width, var(--base-dropdown-min-width, 224px));
+    --ui-dropdown-gap: 8px;
+    --ui-dropdown-ring: var(--ui-dropdown-menu-ring, var(--ui-color-primary, #2563eb));
+    --ui-dropdown-backdrop: none;
+    --ui-dropdown-item-radius: var(--base-dropdown-item-radius, 0px);
+    --ui-dropdown-item-gap: var(--base-dropdown-item-gap, 10px);
+    --ui-dropdown-item-min-height: var(--base-dropdown-item-height, 36px);
+    --ui-dropdown-item-pad-y: var(--base-dropdown-item-padding-y, 8px);
+    --ui-dropdown-item-pad-x: var(--base-dropdown-item-padding-x, 12px);
+    --ui-dropdown-item-font-size: var(--base-dropdown-item-font-size, var(--ui-default-font-size, 14px));
+    --ui-dropdown-item-font-weight: 500;
+    --ui-dropdown-item-line-height: var(--base-dropdown-item-line-height, var(--ui-default-line-height, 20px));
+    --ui-dropdown-separator-margin: var(--base-dropdown-separator-margin, 6px 10px);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-dropdown-ring) 10%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-dropdown-ring) 15%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-dropdown-ring) 13%, transparent);
+    --ui-dropdown-item-active-color: color-mix(in srgb, var(--ui-dropdown-color) 92%, #020617 8%);
+    --ui-dropdown-item-secondary-active-color: color-mix(in srgb, var(--ui-dropdown-item-active-color) 78%, transparent);
+    --ui-dropdown-duration: var(--ui-motion-short, 150ms);
+    --ui-dropdown-easing: var(--ui-motion-easing, cubic-bezier(0.2, 0.8, 0.2, 1));
+    --ui-dropdown-available-width: calc(100vw - 16px);
+    --ui-dropdown-available-height: 440px;
+    color-scheme: light dark;
+    display: inline-grid;
+    min-inline-size: 0;
+    position: relative;
+    isolation: isolate;
+    z-index: 0;
+    font-family: "Inter", "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  }
+
+  :host([open]) {
+    z-index: 40;
+  }
+
+  :host([disabled]) {
+    pointer-events: none;
+    opacity: 0.62;
+  }
+
+  .root {
+    min-inline-size: 0;
+    position: relative;
+    display: inline-grid;
+  }
+
+  .trigger {
+    display: inline-flex;
+    width: fit-content;
+    min-inline-size: 0;
+  }
+
+  .content-slot {
+    display: none !important;
+  }
+
+  .panel {
+    position: absolute;
+    inset-inline-start: 0;
+    inset-block-start: calc(100% + var(--ui-dropdown-gap));
+    z-index: 24;
+    pointer-events: auto;
+    inline-size: max-content;
+    min-inline-size: max(100%, var(--ui-dropdown-min-width));
+  }
+
+  .panel[hidden] {
+    display: none;
+  }
+
+  .panel[data-placement="top"] {
+    inset-block-start: auto;
+    inset-block-end: calc(100% + var(--ui-dropdown-gap));
+  }
+
+  .panel[data-placement="right"] {
+    inset-block-start: 0;
+    inset-inline-start: calc(100% + var(--ui-dropdown-gap));
+  }
+
+  .panel[data-placement="left"] {
+    inset-block-start: 0;
+    inset-inline-start: auto;
+    inset-inline-end: calc(100% + var(--ui-dropdown-gap));
+  }
+
+  .menu {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+    min-inline-size: 100%;
+    max-inline-size: min(var(--ui-dropdown-available-width), calc(100vw - 16px));
+    max-block-size: min(440px, var(--ui-dropdown-available-height));
+    padding: var(--ui-dropdown-padding);
+    border: var(--ui-dropdown-border);
+    border-radius: var(--ui-dropdown-radius);
+    box-sizing: border-box;
+    overflow: auto;
+    isolation: isolate;
+    background: var(--ui-dropdown-bg);
+    color: var(--ui-dropdown-color);
+    box-shadow: var(--ui-dropdown-shadow);
+    outline: none;
+    scrollbar-width: thin;
+    scrollbar-color: color-mix(in srgb, var(--ui-dropdown-border-color) 82%, transparent) transparent;
+    scrollbar-gutter: auto;
+  }
+
+  .menu::-webkit-scrollbar {
+    width: 8px;
+  }
+
+  .menu::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  .menu::-webkit-scrollbar-thumb {
+    background: color-mix(in srgb, var(--ui-dropdown-border-color) 82%, transparent);
+    border-radius: 999px;
+    border: 2px solid transparent;
+    background-clip: padding-box;
+  }
+
+  .menu:hover::-webkit-scrollbar-thumb {
+    background: color-mix(in srgb, var(--ui-dropdown-ring) 28%, var(--ui-dropdown-border-color));
+    background-clip: padding-box;
+  }
+
+  .menu[data-size='sm'],
+  .menu[data-density='compact'] {
+    --ui-dropdown-item-gap: 8px;
+    --ui-dropdown-item-min-height: 32px;
+    --ui-dropdown-item-pad-y: 6px;
+    --ui-dropdown-item-pad-x: 8px;
+    --ui-dropdown-item-font-size: 13px;
+    --ui-dropdown-item-line-height: 18px;
+    --ui-dropdown-separator-margin: 4px 8px;
+  }
+
+  .menu[data-size='lg'],
+  .menu[data-density='comfortable'] {
+    --ui-dropdown-item-gap: 12px;
+    --ui-dropdown-item-min-height: 40px;
+    --ui-dropdown-item-pad-y: 9px;
+    --ui-dropdown-item-pad-x: 12px;
+    --ui-dropdown-item-font-size: 15px;
+    --ui-dropdown-item-line-height: 22px;
+    --ui-dropdown-separator-margin: 8px 12px;
+  }
+
+  .menu[data-elevation='none'] {
+    --ui-dropdown-shadow: none;
+  }
+
+  .menu[data-elevation='low'] {
+    --ui-dropdown-shadow: 0 10px 24px rgba(2, 6, 23, 0.14);
+  }
+
+  .menu[data-elevation='high'] {
+    --ui-dropdown-shadow: 0 16px 36px rgba(2, 6, 23, 0.18);
+  }
+
+  .menu[data-variant='soft'] {
+    --ui-dropdown-bg: color-mix(in srgb, var(--base-dropdown-bg, var(--color-panel-solid, #ffffff)) 94%, var(--accent-surface, transparent));
+  }
+
+  .menu[data-variant='filled'] {
+    --ui-dropdown-bg: color-mix(in srgb, var(--ui-dropdown-ring) 8%, var(--base-dropdown-bg, var(--color-panel-solid, #ffffff)));
+    --ui-dropdown-border-color: color-mix(in srgb, var(--ui-dropdown-ring) 24%, var(--ui-dropdown-border-color));
+  }
+
+  .menu[data-variant='outline'] {
+    --ui-dropdown-shadow: none;
+    --ui-dropdown-border-color: color-mix(in srgb, var(--ui-dropdown-ring) 34%, var(--ui-dropdown-border-color));
+  }
+
+  .menu[data-variant='line'] {
+    --ui-dropdown-shadow: none;
+    --ui-dropdown-padding: 0px;
+    --ui-dropdown-item-radius: 0px;
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0;
+    background: color-mix(in srgb, var(--ui-dropdown-bg) 98%, transparent);
+  }
+
+  .menu[data-variant='flat'],
+  .menu[data-variant='minimal'],
+  .menu[data-variant='ghost'] {
+    --ui-dropdown-shadow: none;
+  }
+
+  .menu[data-variant='glass'] {
+    --ui-dropdown-bg: color-mix(in srgb, var(--base-dropdown-bg, var(--color-panel-solid, #ffffff)) 94%, white 6%);
+    --ui-dropdown-border-color: color-mix(in srgb, var(--ui-color-border, rgba(15, 23, 42, 0.14)) 70%, transparent);
+    --ui-dropdown-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
+  }
+
+  .menu[data-variant='solid'] {
+    --ui-dropdown-bg: var(--ui-dropdown-ring);
+    --ui-dropdown-color: var(--ui-color-foreground-on-primary, #ffffff);
+    --ui-dropdown-muted: color-mix(in srgb, var(--ui-color-foreground-on-primary, #ffffff) 72%, transparent);
+    --ui-dropdown-border-color: color-mix(in srgb, var(--ui-dropdown-ring) 76%, #0f172a 24%);
+    --ui-dropdown-item-active-color: color-mix(in srgb, #0f172a 82%, var(--ui-color-foreground-on-primary, #ffffff) 18%);
+    --ui-dropdown-item-secondary-active-color: color-mix(in srgb, #0f172a 62%, var(--ui-color-foreground-on-primary, #ffffff) 38%);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, #ffffff 12%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, #ffffff 18%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, #ffffff 16%, transparent);
+  }
+
+  .menu[data-variant='contrast'] {
+    --ui-dropdown-bg: #0f172a;
+    --ui-dropdown-color: #f8fafc;
+    --ui-dropdown-muted: #94a3b8;
+    --ui-dropdown-border-color: #334155;
+    --ui-dropdown-ring: #93c5fd;
+    --ui-dropdown-item-active-color: #f8fafc;
+    --ui-dropdown-item-secondary-active-color: color-mix(in srgb, #f8fafc 82%, transparent);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, #ffffff 12%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, #ffffff 18%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, #ffffff 16%, transparent);
+  }
+
+  .menu[data-tone='info'] {
+    --ui-dropdown-ring: var(--ui-color-primary, #2563eb);
+  }
+
+  .menu[data-tone='neutral'] {
+    --ui-dropdown-ring: color-mix(in srgb, var(--ui-color-muted, #64748b) 60%, var(--ui-dropdown-color));
+  }
+
+  .menu[data-tone='danger'] {
+    --ui-dropdown-ring: var(--ui-color-danger, #dc2626);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-danger, #dc2626) 12%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-danger, #dc2626) 18%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-danger, #dc2626) 16%, transparent);
+  }
+
+  .menu[data-tone='success'] {
+    --ui-dropdown-ring: var(--ui-color-success, #16a34a);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 12%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 18%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 16%, transparent);
+  }
+
+  .menu[data-tone='warning'] {
+    --ui-dropdown-ring: var(--ui-color-warning, #d97706);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 15%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 20%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 17%, transparent);
+  }
+
+  ${y.createSharedMenuItemCss({scopes:[".menu"],prefix:"--ui-dropdown",shortcutSelectors:[".shortcut",".meta"],activeStateSelectors:['.item[data-active="true"]','[role="menuitem"][data-active="true"]','[role="menuitemcheckbox"][data-active="true"]','[role="menuitemradio"][data-active="true"]','[data-menu-item][data-active="true"]']})}
+
+  .menu [role='menuitem'],
+  .menu [role='menuitemcheckbox'],
+  .menu [role='menuitemradio'],
+  .menu .item,
+  .menu [data-menu-item] {
+    justify-content: space-between;
+    border: 1px solid transparent;
+    border-radius: var(--ui-dropdown-item-radius);
+    background: transparent;
+    box-shadow: none;
+    --ui-box-radius: var(--ui-dropdown-item-radius);
+    --ui-box-border: none;
+    --ui-box-border-color: transparent;
+    --ui-box-shadow: none;
+    --ui-box-bg: transparent;
+    --ui-box-color: inherit;
+    --ui-box-backdrop: none;
+    transition:
+      background-color 120ms ease,
+      border-color 120ms ease,
+      color 120ms ease;
+  }
+
+  .menu [role='menuitemcheckbox'],
+  .menu [role='menuitemradio'] {
+    justify-content: flex-start;
+  }
+
+  .menu [role='menuitemcheckbox'][aria-checked='true'],
+  .menu [role='menuitemradio'][aria-checked='true'],
+  .menu .item[aria-checked='true'],
+  .menu [data-menu-item][aria-checked='true'] {
+    background: linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--ui-dropdown-ring) 18%, transparent) 0%,
+      color-mix(in srgb, var(--ui-dropdown-ring) 12%, transparent) 100%
+    );
+    border-color: color-mix(in srgb, var(--ui-dropdown-ring) 30%, transparent);
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-dropdown-ring) 12%, transparent);
+    color: var(--ui-dropdown-item-active-color);
+  }
+
+  .menu [role='menuitemcheckbox'][aria-checked='true'] .label .caption,
+  .menu [role='menuitemradio'][aria-checked='true'] .label .caption,
+  .menu .item[aria-checked='true'] .label .caption,
+  .menu [data-menu-item][aria-checked='true'] .label .caption,
+  .menu [role='menuitemcheckbox'][aria-checked='true'] .shortcut,
+  .menu [role='menuitemradio'][aria-checked='true'] .shortcut,
+  .menu .item[aria-checked='true'] .shortcut,
+  .menu [data-menu-item][aria-checked='true'] .shortcut,
+  .menu [role='menuitemcheckbox'][aria-checked='true'] .meta,
+  .menu [role='menuitemradio'][aria-checked='true'] .meta,
+  .menu .item[aria-checked='true'] .meta,
+  .menu [data-menu-item][aria-checked='true'] .meta,
+  .menu [role='menuitemcheckbox'][aria-checked='true'] .icon,
+  .menu [role='menuitemradio'][aria-checked='true'] .icon,
+  .menu .item[aria-checked='true'] .icon,
+  .menu [data-menu-item][aria-checked='true'] .icon,
+  .menu [role='menuitemcheckbox'][aria-checked='true'] .submenu-arrow,
+  .menu [role='menuitemradio'][aria-checked='true'] .submenu-arrow,
+  .menu .item[aria-checked='true'] .submenu-arrow,
+  .menu [data-menu-item][aria-checked='true'] .submenu-arrow {
+    color: var(--ui-dropdown-item-secondary-active-color);
+  }
+
+  .menu [role='menuitem']:hover,
+  .menu [role='menuitemcheckbox']:hover,
+  .menu [role='menuitemradio']:hover,
+  .menu .item:hover,
+  .menu [data-menu-item]:hover,
+  .menu [role='menuitem'][data-active='true'],
+  .menu [role='menuitemcheckbox'][data-active='true'],
+  .menu [role='menuitemradio'][data-active='true'],
+  .menu .item[data-active='true'],
+  .menu [data-menu-item][data-active='true'] {
+    background: var(--ui-dropdown-item-hover-bg);
+    border-color: color-mix(in srgb, var(--ui-dropdown-ring) 24%, transparent);
+  }
+
+  .menu [role='menuitem'][data-active='true'],
+  .menu [role='menuitemcheckbox'][data-active='true'],
+  .menu [role='menuitemradio'][data-active='true'],
+  .menu .item[data-active='true'],
+  .menu [data-menu-item][data-active='true'] {
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-dropdown-ring) 12%, transparent);
+  }
+
+  .menu [role='menuitem']:hover .label .caption,
+  .menu [role='menuitemcheckbox']:hover .label .caption,
+  .menu [role='menuitemradio']:hover .label .caption,
+  .menu .item:hover .label .caption,
+  .menu [data-menu-item]:hover .label .caption,
+  .menu [role='menuitem'][data-active='true'] .label .caption,
+  .menu [role='menuitemcheckbox'][data-active='true'] .label .caption,
+  .menu [role='menuitemradio'][data-active='true'] .label .caption,
+  .menu .item[data-active='true'] .label .caption,
+  .menu [data-menu-item][data-active='true'] .label .caption,
+  .menu [role='menuitem']:hover .shortcut,
+  .menu [role='menuitemcheckbox']:hover .shortcut,
+  .menu [role='menuitemradio']:hover .shortcut,
+  .menu .item:hover .shortcut,
+  .menu [data-menu-item]:hover .shortcut,
+  .menu [role='menuitem'][data-active='true'] .shortcut,
+  .menu [role='menuitemcheckbox'][data-active='true'] .shortcut,
+  .menu [role='menuitemradio'][data-active='true'] .shortcut,
+  .menu .item[data-active='true'] .shortcut,
+  .menu [data-menu-item][data-active='true'] .shortcut,
+  .menu [role='menuitem']:hover .meta,
+  .menu [role='menuitemcheckbox']:hover .meta,
+  .menu [role='menuitemradio']:hover .meta,
+  .menu .item:hover .meta,
+  .menu [data-menu-item]:hover .meta,
+  .menu [role='menuitem'][data-active='true'] .meta,
+  .menu [role='menuitemcheckbox'][data-active='true'] .meta,
+  .menu [role='menuitemradio'][data-active='true'] .meta,
+  .menu .item[data-active='true'] .meta,
+  .menu [data-menu-item][data-active='true'] .meta,
+  .menu [role='menuitem']:hover .icon,
+  .menu [role='menuitemcheckbox']:hover .icon,
+  .menu [role='menuitemradio']:hover .icon,
+  .menu .item:hover .icon,
+  .menu [data-menu-item]:hover .icon,
+  .menu [role='menuitem'][data-active='true'] .icon,
+  .menu [role='menuitemcheckbox'][data-active='true'] .icon,
+  .menu [role='menuitemradio'][data-active='true'] .icon,
+  .menu .item[data-active='true'] .icon,
+  .menu [data-menu-item][data-active='true'] .icon,
+  .menu [role='menuitem']:hover .submenu-arrow,
+  .menu [role='menuitemcheckbox']:hover .submenu-arrow,
+  .menu [role='menuitemradio']:hover .submenu-arrow,
+  .menu .item:hover .submenu-arrow,
+  .menu [data-menu-item]:hover .submenu-arrow,
+  .menu [role='menuitem'][data-active='true'] .submenu-arrow,
+  .menu [role='menuitemcheckbox'][data-active='true'] .submenu-arrow,
+  .menu [role='menuitemradio'][data-active='true'] .submenu-arrow,
+  .menu .item[data-active='true'] .submenu-arrow,
+  .menu [data-menu-item][data-active='true'] .submenu-arrow {
+    color: var(--ui-dropdown-item-secondary-active-color);
+  }
+
+  .menu [role='menuitem']:focus-visible,
+  .menu [role='menuitemcheckbox']:focus-visible,
+  .menu [role='menuitemradio']:focus-visible,
+  .menu .item:focus-visible,
+  .menu [data-menu-item]:focus-visible {
+    border-color: color-mix(in srgb, var(--ui-dropdown-ring) 30%, transparent);
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-dropdown-ring) 18%, transparent);
+  }
+
+  .menu [role='menuitemcheckbox']:active,
+  .menu [role='menuitemradio']:active,
+  .menu [role='menuitem']:active,
+  .menu .item:active,
+  .menu [data-menu-item]:active {
+    background: var(--ui-dropdown-item-active-bg);
+  }
+
+  .menu .description {
+    margin-top: 2px;
+    color: var(--ui-dropdown-muted);
+    font-size: calc(var(--ui-dropdown-item-font-size) - 1px);
+    line-height: 1.35;
+    white-space: normal;
+  }
+
+  .menu [aria-disabled='true'],
+  .menu [disabled] {
+    opacity: 0.46;
+    pointer-events: none;
+  }
+
+  .menu .empty-state {
+    padding: 10px 12px;
+    font: 500 12px/1.45 Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
+    letter-spacing: 0.01em;
+    color: var(--ui-dropdown-muted);
+  }
+
+  @media (prefers-contrast: more) {
+    .menu {
+      border-width: 2px;
+      box-shadow: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .menu {
+      forced-color-adjust: none;
+      border-color: CanvasText;
+      background: Canvas;
+      color: CanvasText;
+      box-shadow: none;
+    }
+
+    .menu [role='menuitem'],
+    .menu [role='menuitemcheckbox'],
+    .menu [role='menuitemradio'],
+    .menu .item,
+    .menu [data-menu-item],
+    .menu .empty-state {
+      border: 1px solid transparent;
+      background: Canvas;
+      color: CanvasText;
+    }
+
+    .menu [role='menuitem']:hover,
+    .menu [role='menuitem']:focus-visible,
+    .menu [role='menuitemcheckbox']:hover,
+    .menu [role='menuitemcheckbox']:focus-visible,
+    .menu [role='menuitemradio']:hover,
+    .menu [role='menuitemradio']:focus-visible,
+    .menu .item:hover,
+    .menu .item:focus-visible,
+    .menu [data-menu-item]:hover,
+    .menu [data-menu-item]:focus-visible {
+      background: Highlight;
+      color: HighlightText;
+    }
+  }
+`;function A(i){return i==="top"||i==="left"||i==="right"?i:"bottom"}function S(i){const e=(i||"").trim().toLowerCase();return e==="sm"||e==="1"||e==="compact"?"sm":e==="lg"||e==="3"||e==="comfortable"?"lg":"md"}function C(i){const e=(i||"").trim().toLowerCase();return!e||e==="default"?null:e==="none"?"0px":e==="sm"?"8px":e==="md"?"12px":e==="lg"||e==="large"?"16px":e==="full"||e==="pill"?"999px":e==="square"?"6px":e==="soft"||e==="rounded"?"14px":/^\d+(\.\d+)?$/.test(e)?`${e}px`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(e)?e:i}function h(i,e){return i.getAttribute(e)||""}function f(i,e){if(i==null)return e;const r=i.trim().toLowerCase();return r!=="false"&&r!=="0"&&r!=="off"}function p(){return typeof window<"u"&&typeof document<"u"}function b(i){return i.hasAttribute("disabled")||i.getAttribute("aria-disabled")==="true"||i.disabled===!0}function E(i){return(i.getAttribute("aria-label")||i.textContent||"").trim()}function g(i){if(i)try{i.focus({preventScroll:!0})}catch{i.focus()}}function I(i,e){const r=i.offsetTop,t=r+i.offsetHeight,o=e.scrollTop,a=o+e.clientHeight;if(r<o){e.scrollTop=r;return}t>a&&(e.scrollTop=Math.max(0,t-e.clientHeight))}function T(i){return w(i)}function w(i){if(i.nodeType===Node.TEXT_NODE)return document.createTextNode(i.textContent||"");if(!(i instanceof HTMLElement))return i.cloneNode(!1);const e=i.tagName==="UI-BOX",r=document.createElement(e?"div":i.tagName.toLowerCase());return Array.from(i.attributes).forEach(t=>{t.name!=="slot"&&r.setAttribute(t.name,t.value)}),Array.from(i.childNodes).forEach(t=>{r.appendChild(w(t))}),r}function M(i,e,r){for(let t=e+r;t>=0&&t<i.length;t+=r)if(!b(i[t]))return t;return-1}function O(i,e,r){if(!e)return null;const t=i.filter(a=>!b(a));if(!t.length)return null;const o=r?t.indexOf(r):-1;for(let a=1;a<=t.length;a+=1){const n=t[(o+a+t.length)%t.length];if(E(n).toLowerCase().startsWith(e))return n}return null}const P=new Set(["variant","density","shape","elevation","tone","size","radius"]),D=new Set(["aria-label","aria-labelledby","aria-describedby"]),F=["--ui-dropdown-bg","--ui-dropdown-color","--ui-dropdown-muted","--ui-dropdown-border-color","--ui-dropdown-border","--ui-dropdown-shadow","--ui-dropdown-radius","--ui-dropdown-padding","--ui-dropdown-min-width","--ui-dropdown-gap","--ui-dropdown-ring","--ui-dropdown-backdrop","--ui-dropdown-item-radius","--ui-dropdown-item-font-weight","--ui-dropdown-item-hover-bg","--ui-dropdown-item-active-bg","--ui-dropdown-item-checked-bg","--ui-dropdown-item-active-color","--ui-dropdown-duration","--ui-dropdown-easing"];class _ extends x.ElementBase{constructor(){super(),this._isOpen=!1,this._panelEl=null,this._portalEl=null,this._restoreFocusEl=null,this._typeaheadBuffer="",this._typeaheadTimer=null,this._placement="bottom",this._openListenersBound=!1,this._openFrame=0,this._checkboxState=new Map,this._radioState=new Map,this._menuId=`ui-dropdown-menu-${Math.random().toString(36).slice(2,10)}`,this._triggerId=`ui-dropdown-trigger-${Math.random().toString(36).slice(2,10)}`,this._onHostClick=this._onHostClick.bind(this),this._onHostKeyDown=this._onHostKeyDown.bind(this),this._onDocumentPointerDown=this._onDocumentPointerDown.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["open","disabled","placement","variant","size","density","radius","shape","elevation","tone","close-on-select","close-on-scroll","typeahead","aria-label","aria-labelledby","aria-describedby"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this.addEventListener("keydown",this._onHostKeyDown),this.root.addEventListener("slotchange",this._onSlotChange),this._syncOpenState(),this._syncTriggerA11y()}disconnectedCallback(){this.removeEventListener("click",this._onHostClick),this.removeEventListener("keydown",this._onHostKeyDown),this.root.removeEventListener("slotchange",this._onSlotChange),this._teardownOpenListeners(),this._openFrame&&cancelAnimationFrame(this._openFrame),super.disconnectedCallback()}attributeChangedCallback(e,r,t){if(r!==t){if(e==="open"){this._syncOpenState();return}if(!(e==="close-on-select"||e==="close-on-scroll"||e==="typeahead")){if(e==="disabled"){this.hasAttribute("disabled")&&this._isOpen&&this.close("disabled"),this._syncTriggerA11y();return}if(this._isOpen&&(e==="placement"||P.has(e))){this._syncMenuPresentation(),this._schedulePanelSync();return}this._isOpen&&D.has(e)&&this._syncMenuA11y()}}}open(){this.hasAttribute("disabled")||this.hasAttribute("open")||this.setAttribute("open","")}close(e="programmatic"){!this.hasAttribute("open")&&!this._isOpen||this._close(e)}closeDropdown(e="programmatic"){if(!(!this.hasAttribute("open")&&!this._isOpen)){if(e==="programmatic"){this.close(e);return}this._requestClose(e)}}toggle(){if(this._isOpen){this._requestClose("trigger");return}this.open()}get closeOnSelect(){return f(this.getAttribute("close-on-select"),!0)}set closeOnSelect(e){this.setAttribute("close-on-select",e?"true":"false")}get closeOnScroll(){return f(this.getAttribute("close-on-scroll"),!0)}set closeOnScroll(e){this.setAttribute("close-on-scroll",e?"true":"false")}get typeahead(){return f(this.getAttribute("typeahead"),!0)}set typeahead(e){this.setAttribute("typeahead",e?"true":"false")}_getTrigger(){return this.querySelector('[slot="trigger"]')}_getContentSource(){return this.querySelector('[slot="content"]')}_getMenu(){return this._portalEl}_isFocusable(e){if(!e||!e.isConnected||e.disabled||e.getAttribute("aria-hidden")==="true")return!1;if(!p())return!0;const r=window.getComputedStyle(e);return r.display!=="none"&&r.visibility!=="hidden"}_currentFocusedItem(){const e=this.root.activeElement||document.activeElement;return e instanceof HTMLElement?e.closest(l):null}_queryItems(e=!0){const r=this._getMenu();if(!r)return[];const t=Array.from(r.querySelectorAll(l));return e?t:t.filter(o=>!b(o))}_requestClose(e){if(!this._isOpen)return;const r=new CustomEvent("request-close",{detail:{reason:e},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(r);const t=new CustomEvent("ui-request-close",{detail:{reason:e},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(t),!(r.defaultPrevented||t.defaultPrevented)&&this.close(e)}_close(e,r={}){if(this._openFrame&&cancelAnimationFrame(this._openFrame),this._openFrame=0,this._isOpen=!1,this._teardownOpenListeners(),this.hasAttribute("open")&&this.removeAttribute("open"),this._syncControlState(),this._syncTriggerA11y(),this._clearActiveItem(),this._clearMenuContent(),this._resetTypeahead(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{open:!1,reason:e}})),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0,detail:{reason:e}})),r.restoreFocus!==!1){const t=this._getTrigger();t&&this._isFocusable(t)?g(t):this._restoreFocusEl&&this._isFocusable(this._restoreFocusEl)&&g(this._restoreFocusEl)}this._restoreFocusEl=null}_syncOpenState(){const e=this.hasAttribute("open")&&!this.hasAttribute("disabled");if(e===this._isOpen){this._syncControlState(),this._syncTriggerA11y(),e&&(this._syncMenuPresentation(),this._syncMenuA11y(),this._schedulePanelSync());return}if(e){this._isOpen=!0,this._restoreFocusEl=document.activeElement,this._renderMenuContent(),this._syncMenuPresentation(),this._syncMenuA11y(),this._syncControlState(),this._syncTriggerA11y(),this._attachOpenListeners(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{open:!0}})),this._schedulePanelSync("first");return}this._close("programmatic",{restoreFocus:!1})}_attachOpenListeners(){this._openListenersBound||(document.addEventListener("pointerdown",this._onDocumentPointerDown,!0),this._openListenersBound=!0)}_teardownOpenListeners(){this._openListenersBound&&(document.removeEventListener("pointerdown",this._onDocumentPointerDown,!0),this._openListenersBound=!1)}_syncTriggerA11y(){const e=this._getTrigger();if(e){if(e.id||(e.id=this._triggerId),e.setAttribute("aria-haspopup","menu"),e.setAttribute("aria-expanded",this._isOpen?"true":"false"),this._isOpen?e.setAttribute("aria-controls",this._menuId):e.removeAttribute("aria-controls"),this.hasAttribute("disabled")){e.setAttribute("aria-disabled","true"),e.setAttribute("tabindex","-1");return}e.getAttribute("aria-disabled")==="true"&&e.removeAttribute("aria-disabled"),e.getAttribute("tabindex")==="-1"&&e.removeAttribute("tabindex")}}_renderMenuContent(){const e=this._getMenu();if(!e)return;e.replaceChildren();const r=this._getContentSource();if(r&&e.appendChild(T(r)),!e.querySelector(l)){const t=document.createElement("div");t.className="empty-state",t.textContent="No items",e.appendChild(t)}this._syncMenuItemSemantics()}_syncMenuItemSemantics(){this._queryItems(!0).forEach((e,r)=>{e.getAttribute("role")||e.setAttribute("role","menuitem"),e.hasAttribute("tabindex")||e.setAttribute("tabindex","-1"),e.dataset.sourceIndex=String(r),e.hasAttribute("disabled")&&e.getAttribute("aria-disabled")!=="true"&&e.setAttribute("aria-disabled","true");const t=e.getAttribute("role");(t==="menuitemcheckbox"||t==="menuitemradio")&&!e.hasAttribute("aria-checked")&&e.setAttribute("aria-checked","false"),this._applyStoredItemState(e,r)})}_clearMenuContent(){const e=this._getMenu();e&&e.replaceChildren()}_applyStoredItemState(e,r){const t=e.getAttribute("role");if(t==="menuitemcheckbox"){if(!this._checkboxState.has(r))return;const n=this._checkboxState.get(r)===!0;e.setAttribute("aria-checked",n?"true":"false"),e.setAttribute("data-state",n?"checked":"unchecked");return}if(t!=="menuitemradio")return;const o=e.getAttribute("data-group")||e.getAttribute("name")||"__default__";if(!this._radioState.has(o))return;const a=this._radioState.get(o)===r;e.setAttribute("aria-checked",a?"true":"false"),e.setAttribute("data-state",a?"checked":"unchecked")}_syncMenuPresentation(){const e=this._getMenu();if(!e)return;const r=p()?window.getComputedStyle(this):null;r&&F.forEach(c=>{const m=r.getPropertyValue(c).trim();m?e.style.setProperty(c,m):e.style.removeProperty(c)});const t=h(this,"variant"),o=S(this.getAttribute("size")||this.getAttribute("density")),a=h(this,"density"),n=h(this,"shape"),u=h(this,"elevation"),s=h(this,"tone"),d=C(this.getAttribute("radius")||n||null);if(t&&t!=="default"?e.setAttribute("data-variant",t):e.removeAttribute("data-variant"),o!=="md"?e.setAttribute("data-size",o):e.removeAttribute("data-size"),a&&a!=="default"?e.setAttribute("data-density",a):e.removeAttribute("data-density"),n&&n!=="default"?e.setAttribute("data-shape",n):e.removeAttribute("data-shape"),u&&u!=="default"?e.setAttribute("data-elevation",u):e.removeAttribute("data-elevation"),s&&s!=="default"&&s!=="brand"?e.setAttribute("data-tone",s):e.removeAttribute("data-tone"),d){e.style.setProperty("--ui-dropdown-radius",d),e.style.setProperty("--ui-dropdown-item-radius",d==="999px"?"999px":`max(0px, calc(${d} - 2px))`);return}e.style.removeProperty("--ui-dropdown-radius"),e.style.removeProperty("--ui-dropdown-item-radius")}_syncMenuA11y(){const e=this._getMenu();if(!e)return;const r=this._getTrigger(),t=this.getAttribute("aria-label")||"",o=this.getAttribute("aria-labelledby")||"",a=this.getAttribute("aria-describedby")||"",n=o||(!t&&(r!=null&&r.id)?r.id:"");t?e.setAttribute("aria-label",t):e.removeAttribute("aria-label"),n?e.setAttribute("aria-labelledby",n):e.removeAttribute("aria-labelledby"),a?e.setAttribute("aria-describedby",a):e.removeAttribute("aria-describedby")}_syncControlState(){const e=this._panelEl,r=this._getMenu();!e||!r||(e.hidden=!this._isOpen,e.setAttribute("data-placement",this._placement))}_schedulePanelSync(e){this._openFrame&&cancelAnimationFrame(this._openFrame),this._openFrame=requestAnimationFrame(()=>{this._openFrame=0,this._syncPanelState(),e==="first"&&this._focusFirstItem(),e==="last"&&this._focusLastItem()})}_syncPanelState(){const e=this._panelEl;!e||!this._isOpen||(this._placement=this._resolvePlacement(),e.setAttribute("data-placement",this._placement),this.style.setProperty("--ui-dropdown-available-width",`${Math.max(0,Math.floor(this._availableWidth(this._placement)))}px`),this.style.setProperty("--ui-dropdown-available-height",`${Math.max(0,Math.floor(this._availableHeight(this._placement)))}px`))}_availableWidth(e){const r=this._getTrigger();if(!r||!p())return 380;const t=r.getBoundingClientRect(),o=window.innerWidth||document.documentElement.clientWidth||0;return e==="left"?t.left-12:e==="right"?o-t.right-12:o-t.left-12}_availableHeight(e){const r=this._getTrigger();if(!r||!p())return 440;const t=r.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight||0;return e==="top"?t.top-12:o-t.bottom-12}_resolvePlacement(){const e=A(this.getAttribute("placement")),r=this._getTrigger(),t=this._getMenu();if(!r||!t||!p())return e;const o=r.getBoundingClientRect(),a=window.innerWidth||document.documentElement.clientWidth||0,n=window.innerHeight||document.documentElement.clientHeight||0,u=Math.max(0,n-o.bottom-12),s=Math.max(0,o.top-12),d=Math.max(0,a-o.right-12),c=Math.max(0,o.left-12),m=Math.min(Math.max(t.scrollHeight,t.offsetHeight)+4,320),v=Math.min(Math.max(t.scrollWidth,t.offsetWidth)+4,360);return e==="top"?s>=m||s>u?"top":"bottom":e==="left"?c>=v||c>d?"left":"right":e==="right"?d>=v||d>=c?"right":"left":u>=m||u>=s?"bottom":"top"}_clearActiveItem(){this._queryItems(!0).forEach(e=>e.removeAttribute("data-active"))}_setActiveItem(e,r={}){if(this._clearActiveItem(),!!e&&(e.setAttribute("data-active","true"),r.focus&&g(e),r.scroll)){const t=this._getMenu();t&&I(e,t)}}_focusFirstItem(){const e=this._queryItems(!1);this._setActiveItem(e[0]||null,{focus:!0,scroll:!0})}_focusLastItem(){const e=this._queryItems(!1);this._setActiveItem(e[e.length-1]||null,{focus:!0,scroll:!0})}_moveFocus(e){const r=this._queryItems(!0);if(!r.length)return;const t=this._currentFocusedItem()||this._queryItems(!0).find(n=>n.getAttribute("data-active")==="true")||null,o=t?r.indexOf(t):e>0?-1:r.length,a=M(r,o,e);if(a>=0){this._setActiveItem(r[a],{focus:!0,scroll:!0});return}e>0?this._focusFirstItem():this._focusLastItem()}_resetTypeahead(){this._typeaheadBuffer="",this._typeaheadTimer!=null&&(window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=null)}_isTypeaheadKey(e){return e.ctrlKey||e.metaKey||e.altKey?!1:e.key.length===1&&/\S/.test(e.key)}_handleTypeahead(e){if(!this.typeahead||!this._isTypeaheadKey(e))return!1;const r=e.key.toLowerCase();this._typeaheadBuffer=`${this._typeaheadBuffer}${r}`.slice(0,24),this._typeaheadTimer!=null&&window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=window.setTimeout(()=>this._resetTypeahead(),460);const t=O(this._queryItems(!0),this._typeaheadBuffer,this._currentFocusedItem());return t?(this._setActiveItem(t,{focus:!0,scroll:!0}),e.preventDefault(),!0):!1}_querySourceItems(){const e=this._getContentSource();return e?Array.from(e.querySelectorAll(l)):[]}_applySelectionBehavior(e){const r=e.getAttribute("role"),t=Number(e.dataset.sourceIndex||"-1");if(r==="menuitemcheckbox"){const n=e.getAttribute("aria-checked")!=="true";e.setAttribute("aria-checked",n?"true":"false"),e.setAttribute("data-state",n?"checked":"unchecked"),t>=0&&this._checkboxState.set(t,n);return}if(r!=="menuitemradio")return;const a=e.getAttribute("data-group")||e.getAttribute("name")||""||"__default__";t>=0&&this._radioState.set(a,t),this._queryItems(!0).filter(n=>n.getAttribute("role")==="menuitemradio").forEach(n=>{const u=n.getAttribute("data-group")||n.getAttribute("name")||"";if(a&&(u||"__default__")!==a)return;const s=n===e;n.setAttribute("aria-checked",s?"true":"false"),n.setAttribute("data-state",s?"checked":"unchecked")})}_findMenuItemFromEvent(e){const r=typeof e.composedPath=="function"?e.composedPath():[];for(const o of r)if(o instanceof HTMLElement&&o.matches(l))return o;const t=e.target;return t instanceof HTMLElement?t.closest(l):null}_isEventInsideTrigger(e){const r=this._getTrigger();return r?(typeof e.composedPath=="function"?e.composedPath():[]).includes(r):!1}_emitSelect(e){var t;const r={value:e.getAttribute("data-value")||e.getAttribute("value")||void 0,label:e.getAttribute("aria-label")||((t=e.textContent)==null?void 0:t.trim())||void 0,checked:e.getAttribute("aria-checked")==="true",item:e};this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:r}))}_onHostClick(e){var t;if(this.hasAttribute("disabled"))return;const r=this._isOpen?this._findMenuItemFromEvent(e):null;if(r&&((t=this._getMenu())!=null&&t.contains(r))&&!b(r)){this._applySelectionBehavior(r),this._setActiveItem(r,{focus:!0,scroll:!0}),this._emitSelect(r),this.closeOnSelect&&this._requestClose("select");return}if(this._isEventInsideTrigger(e)){if(e.preventDefault(),this._isOpen){this._requestClose("trigger");return}this.open()}}_onHostKeyDown(e){var r;if(!this._isOpen){if(!this._isEventInsideTrigger(e)||!["ArrowDown","ArrowUp","Enter"," "].includes(e.key))return;e.preventDefault(),this.open(),this._schedulePanelSync(e.key==="ArrowUp"?"last":"first");return}if(!this._handleTypeahead(e)){if(e.key==="Escape"){e.preventDefault(),this._requestClose("escape");return}if(e.key==="ArrowDown"){e.preventDefault(),this._moveFocus(1);return}if(e.key==="ArrowUp"){e.preventDefault(),this._moveFocus(-1);return}if(e.key==="Home"){e.preventDefault(),this._focusFirstItem();return}if(e.key==="End"){e.preventDefault(),this._focusLastItem();return}if(e.key==="Tab"){this._requestClose("tab");return}if(e.key==="Enter"||e.key===" "){const t=this._currentFocusedItem();if(!t||!((r=this._getMenu())!=null&&r.contains(t))||b(t))return;e.preventDefault(),t.click()}}}_onDocumentPointerDown(e){!this._isOpen||(typeof e.composedPath=="function"?e.composedPath():[]).includes(this)||this._requestClose("outside")}_onSlotChange(){this._syncTriggerA11y(),this._isOpen&&(this._renderMenuContent(),this._syncMenuPresentation(),this._syncMenuA11y(),this._schedulePanelSync())}render(){this.setContent(`
+      <style>${k}</style>
+      <div class="root" part="root">
+        <div class="trigger" part="trigger">
+          <slot name="trigger"></slot>
+        </div>
+        <div class="panel" part="panel" hidden data-placement="bottom">
+          <div
+            id="${this._menuId}"
+            class="menu"
+            role="menu"
+            aria-orientation="vertical"
+            tabindex="-1"
+          ></div>
+        </div>
+      </div>
+      <div class="content-slot" aria-hidden="true">
+        <slot name="content"></slot>
+      </div>
+      <slot></slot>
+    `),this._panelEl=this.root.querySelector(".panel"),this._portalEl=this.root.querySelector(".menu"),this._syncMenuPresentation(),this._syncMenuA11y(),this._syncTriggerA11y(),this._syncControlState(),this._isOpen?(this._renderMenuContent(),this._schedulePanelSync()):this._clearMenuContent()}shouldRenderOnAttributeChange(){return!1}}typeof customElements<"u"&&!customElements.get("ui-dropdown")&&customElements.define("ui-dropdown",_);exports.UIDropdown=_;