@sankhyatronics/sankhya-cms 0.0.0-stage → 0.0.9

package/dist/chunk-RHAOQ6K4.js

@@ -0,0 +1,138 @@
+// src/shared/styles.ts
+import { css } from "lit";
+var truncateStyles = css`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`;
+var buttonResetStyles = css`
+  border: 0;
+  background: transparent;
+  font: inherit;
+  cursor: pointer;
+`;
+var ctaButtonStyles = css`
+  border: 0;
+  border-radius: var(--st-button-radius);
+  background: var(--st-button-primary-bg);
+  color: var(--st-button-primary-color);
+  font-weight: var(--st-button-font-weight);
+  cursor: pointer;
+`;
+var ctaButtonDisabledStyles = css`
+  background: var(--st-color-subtle);
+  cursor: not-allowed;
+`;
+var ctaButtonFillStyles = css`
+  background: var(--st-button-primary-bg);
+  color: var(--st-button-primary-color);
+`;
+var dropdownPanelStyles = css`
+  position: absolute;
+  top: 38px;
+  right: 0;
+  background: var(--st-color-surface);
+  border: 1px solid var(--st-color-border);
+  border-radius: var(--st-radius-sm);
+  box-shadow: 0 4px 16px var(--st-shadow-color-sm);
+  z-index: 30;
+  overflow: hidden;
+`;
+var emptyStateStyles = css`
+  text-align: center;
+  color: var(--st-color-text-muted);
+  font-size: var(--st-text-base);
+`;
+var tableShellStyles = css`
+  background: var(--st-color-surface);
+  border: 1px solid var(--st-color-border);
+  border-radius: var(--st-radius-md);
+  overflow: hidden;
+`;
+var resultRowStyles = css`
+  display: flex;
+  align-items: center;
+  gap: var(--st-space-12);
+  padding: var(--st-space-12) var(--st-space-14);
+  border: 1px solid var(--st-color-border);
+  border-radius: var(--st-radius-sm);
+`;
+var resultNameStyles = css`
+  flex: 1;
+  min-width: 120px;
+  font-size: var(--st-text-base);
+  font-weight: var(--st-font-weight-medium);
+  ${truncateStyles}
+`;
+var resultLinkStyles = css`
+  font-size: var(--st-text-sm);
+  font-weight: var(--st-font-weight-semibold);
+  color: var(--st-color-accent-text);
+`;
+var eyebrowLabelStyles = css`
+  font-weight: var(--st-font-weight-bold);
+  color: var(--st-color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: var(--st-tracking-wide);
+`;
+var rowDividerStyles = css`
+  border-top: 1px solid var(--st-color-divider);
+`;
+var cardShellStyles = css`
+  background: var(--st-color-surface);
+  border: 1px solid var(--st-color-border);
+  border-radius: var(--st-radius-md);
+`;
+var itemNameStyles = css`
+  font-size: var(--st-text-base);
+  font-weight: var(--st-font-weight-semibold);
+  color: var(--st-color-text-strong);
+`;
+var itemCaptionStyles = css`
+  font-size: var(--st-text-xs);
+  color: var(--st-color-text-muted);
+`;
+var controlBaseStyles = css`
+  :is(button, a, input, select, textarea, [tabindex]):focus-visible {
+    outline: var(--st-focus-ring);
+    outline-offset: var(--st-focus-ring-offset);
+  }
+
+  input[type='checkbox'],
+  input[type='radio'] {
+    accent-color: var(--st-checkbox-color);
+  }
+`;
+var fontFamilyStyles = css`
+  font-family: var(--st-font-family);
+`;
+var rootFontFamilyStyles = css`
+  font-family: var(--st-font-family);
+`;
+var BREAKPOINT_TABLET = 900;
+var BREAKPOINT_MOBILE = 500;
+
+export {
+  truncateStyles,
+  buttonResetStyles,
+  ctaButtonStyles,
+  ctaButtonDisabledStyles,
+  ctaButtonFillStyles,
+  dropdownPanelStyles,
+  emptyStateStyles,
+  tableShellStyles,
+  resultRowStyles,
+  resultNameStyles,
+  resultLinkStyles,
+  eyebrowLabelStyles,
+  rowDividerStyles,
+  cardShellStyles,
+  itemNameStyles,
+  itemCaptionStyles,
+  controlBaseStyles,
+  fontFamilyStyles,
+  rootFontFamilyStyles,
+  BREAKPOINT_TABLET,
+  BREAKPOINT_MOBILE
+};
+//# sourceMappingURL=chunk-RHAOQ6K4.js.map

package/dist/chunk-RHAOQ6K4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/shared/styles.ts"],"sourcesContent":["import { css } from 'lit';\r\n\r\n/**\r\n * Reusable `css` fragments shared across component `static styles` blocks.\r\n *\r\n * Lit's `css` tag allows interpolating another `CSSResult` anywhere inside a\r\n * template, including mid-rule — `${fragment}` below expands to raw CSS\r\n * text, so these compose into a component's own selectors without forcing a\r\n * shared class name or touching `render()`. Each component keeps its own\r\n * selectors; only the duplicated property lists move here. Layout details\r\n * that genuinely vary per component (padding, gap, font-size, ...) stay\r\n * local, declared after a fragment so the cascade lets them override it.\r\n *\r\n * Add a fragment here only once a pattern is byte-identical (or near enough\r\n * that the deltas are better expressed as local overrides) across 3+\r\n * components — see `packages/suite-components/README.md#shared-style-fragments`.\r\n */\r\n\r\n/** Truncates overflowing text to a single line with an ellipsis. */\r\nexport const truncateStyles = css`\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n`;\r\n\r\n/**\r\n * Base for an unstyled, click-through interactive element (icon buttons,\r\n * menu triggers, link-like buttons) before component-specific padding,\r\n * font-size, and color are layered on.\r\n */\r\nexport const buttonResetStyles = css`\r\n  border: 0;\r\n  background: transparent;\r\n  font: inherit;\r\n  cursor: pointer;\r\n`;\r\n\r\n/**\r\n * The dark-filled primary-action button look (wizard Next/Generate/Run/Save,\r\n * active toggle buttons, ...). Pair with `ctaButtonDisabledStyles` on the\r\n * same selector's `:disabled` state.\r\n */\r\nexport const ctaButtonStyles = css`\r\n  border: 0;\r\n  border-radius: var(--st-button-radius);\r\n  background: var(--st-button-primary-bg);\r\n  color: var(--st-button-primary-color);\r\n  font-weight: var(--st-button-font-weight);\r\n  cursor: pointer;\r\n`;\r\n\r\nexport const ctaButtonDisabledStyles = css`\r\n  background: var(--st-color-subtle);\r\n  cursor: not-allowed;\r\n`;\r\n\r\n/**\r\n * Just the fill (background + color) from `ctaButtonStyles`, for selectors\r\n * that only need to swap an already-bordered/sized button into the CTA look\r\n * on an active/pressed/selected state (`[aria-pressed='true']`, `.active`,\r\n * ...) rather than defining the button from scratch.\r\n */\r\nexport const ctaButtonFillStyles = css`\r\n  background: var(--st-button-primary-bg);\r\n  color: var(--st-button-primary-color);\r\n`;\r\n\r\n/** Floating menu/dropdown panel chrome (user menu, language menu, ...). */\r\nexport const dropdownPanelStyles = css`\r\n  position: absolute;\r\n  top: 38px;\r\n  right: 0;\r\n  background: var(--st-color-surface);\r\n  border: 1px solid var(--st-color-border);\r\n  border-radius: var(--st-radius-sm);\r\n  box-shadow: 0 4px 16px var(--st-shadow-color-sm);\r\n  z-index: 30;\r\n  overflow: hidden;\r\n`;\r\n\r\n/** \"No results\" / \"Nothing here.\" empty-state text. Padding stays local. */\r\nexport const emptyStateStyles = css`\r\n  text-align: center;\r\n  color: var(--st-color-text-muted);\r\n  font-size: var(--st-text-base);\r\n`;\r\n\r\n/** Bordered, rounded shell wrapping a data table (browse/list views). */\r\nexport const tableShellStyles = css`\r\n  background: var(--st-color-surface);\r\n  border: 1px solid var(--st-color-border);\r\n  border-radius: var(--st-radius-md);\r\n  overflow: hidden;\r\n`;\r\n\r\n/** A single bordered result row with a name (truncated) + trailing link. */\r\nexport const resultRowStyles = css`\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--st-space-12);\r\n  padding: var(--st-space-12) var(--st-space-14);\r\n  border: 1px solid var(--st-color-border);\r\n  border-radius: var(--st-radius-sm);\r\n`;\r\n\r\nexport const resultNameStyles = css`\r\n  flex: 1;\r\n  min-width: 120px;\r\n  font-size: var(--st-text-base);\r\n  font-weight: var(--st-font-weight-medium);\r\n  ${truncateStyles}\r\n`;\r\n\r\nexport const resultLinkStyles = css`\r\n  font-size: var(--st-text-sm);\r\n  font-weight: var(--st-font-weight-semibold);\r\n  color: var(--st-color-accent-text);\r\n`;\r\n\r\n/**\r\n * Uppercase, letter-spaced section/field \"eyebrow\" label (card headings,\r\n * table headers, field labels, ...). Font-size stays local since it varies\r\n * (11–12px) by context.\r\n */\r\nexport const eyebrowLabelStyles = css`\r\n  font-weight: var(--st-font-weight-bold);\r\n  color: var(--st-color-text-muted);\r\n  text-transform: uppercase;\r\n  letter-spacing: var(--st-tracking-wide);\r\n`;\r\n\r\n/** Top border separating stacked rows in a list/table (folder rows, data rows, table rows, ...). */\r\nexport const rowDividerStyles = css`\r\n  border-top: 1px solid var(--st-color-divider);\r\n`;\r\n\r\n/**\r\n * Bordered, rounded surface shell for a card/tile/panel (as opposed to\r\n * `tableShellStyles`, which additionally clips overflow for tabular content).\r\n * Padding, gap, and cursor stay local since they vary by component.\r\n */\r\nexport const cardShellStyles = css`\r\n  background: var(--st-color-surface);\r\n  border: 1px solid var(--st-color-border);\r\n  border-radius: var(--st-radius-md);\r\n`;\r\n\r\n/** A card/tile/row's bold primary name line (folder tiles/rows, template cards, ...). */\r\nexport const itemNameStyles = css`\r\n  font-size: var(--st-text-base);\r\n  font-weight: var(--st-font-weight-semibold);\r\n  color: var(--st-color-text-strong);\r\n`;\r\n\r\n/** A card/tile/row's muted secondary caption line, paired with `itemNameStyles`. */\r\nexport const itemCaptionStyles = css`\r\n  font-size: var(--st-text-xs);\r\n  color: var(--st-color-text-muted);\r\n`;\r\n\r\n/**\r\n * Whole rules (not a property list) every component's stylesheet starts\r\n * with: routes keyboard focus rings and native checkbox/radio tint through\r\n * `--st-focus-ring` / `--st-checkbox-color`, whose defaults (`auto`) keep\r\n * the browser's own look until a host app themes them.\r\n */\r\nexport const controlBaseStyles = css`\r\n  :is(button, a, input, select, textarea, [tabindex]):focus-visible {\r\n    outline: var(--st-focus-ring);\r\n    outline-offset: var(--st-focus-ring-offset);\r\n  }\r\n\r\n  input[type='checkbox'],\r\n  input[type='radio'] {\r\n    accent-color: var(--st-checkbox-color);\r\n  }\r\n`;\r\n\r\n/** Default font stack, used by nearly every component. */\r\nexport const fontFamilyStyles = css`\r\n  font-family: var(--st-font-family);\r\n`;\r\n\r\n/**\r\n * Font stack for page-root/chrome components (`st-template-hub`, the admin\r\n * and configuration pages, `st-app-header`, ...). Identical to\r\n * `fontFamilyStyles` now that `--st-font-family` always resolves via\r\n * `theme.css` (no per-usage fallback) — kept as a separate export so those\r\n * call sites stay semantically distinct if the two ever need to diverge\r\n * again.\r\n */\r\nexport const rootFontFamilyStyles = css`\r\n  font-family: var(--st-font-family);\r\n`;\r\n\r\n/** Canonical responsive breakpoints (px). Interpolate as `${BREAKPOINT_TABLET}px`. */\r\nexport const BREAKPOINT_TABLET = 900;\r\nexport const BREAKPOINT_MOBILE = 500;\r\n"],"mappings":";AAAA,SAAS,WAAW;AAmBb,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAWvB,IAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAY1B,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASxB,IAAM,0BAA0B;AAAA;AAAA;AAAA;AAWhC,IAAM,sBAAsB;AAAA;AAAA;AAAA;AAM5B,IAAM,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa5B,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAOzB,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAQzB,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASxB,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA,IAK5B,cAAc;AAAA;AAGX,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAWzB,IAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ3B,IAAM,mBAAmB;AAAA;AAAA;AASzB,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAOxB,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAOvB,IAAM,oBAAoB;AAAA;AAAA;AAAA;AAW1B,IAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa1B,IAAM,mBAAmB;AAAA;AAAA;AAYzB,IAAM,uBAAuB;AAAA;AAAA;AAK7B,IAAM,oBAAoB;AAC1B,IAAM,oBAAoB;","names":[]}

package/dist/chunk-RMIJVTFS.js

@@ -0,0 +1,397 @@
+import {
+  buttonResetStyles,
+  controlBaseStyles,
+  fontFamilyStyles
+} from "./chunk-RHAOQ6K4.js";
+import {
+  __decorateClass
+} from "./chunk-EUXUH3YW.js";
+
+// src/dropdown/Dropdown.ts
+import { LitElement, css, html, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+var Dropdown = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.label = "";
+    this.href = "";
+    this.iconPosition = "left";
+    this.iconSize = "1.2rem";
+    this.iconColor = "currentColor";
+    this.align = "left";
+    this.target = "_self";
+    this.triggerClassName = "";
+    this.itemGroupClassName = "";
+    this.itemClassName = "";
+    this.disabled = false;
+    this.active = false;
+    this.inline = false;
+    this.open = false;
+    this.hasContent = false;
+    this.hasIcon = false;
+    this.closeOnOutsideMouseDown = (event) => {
+      if (this.open && !event.composedPath().includes(this)) this.setOpen(false);
+    };
+    this.closeOnEscape = (event) => {
+      if (!this.open || event.key !== "Escape") return;
+      const focusWasInside = event.composedPath().includes(this);
+      this.setOpen(false);
+      if (focusWasInside) this.trigger()?.focus();
+    };
+    /** Enter/Space/ArrowDown open the panel and focus its first entry; ArrowUp its last. */
+    this.onTitleKeyDown = (event) => {
+      if (!this.hasContent || this.disabled) return;
+      if (event.key === "ArrowDown" || event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        event.stopPropagation();
+        this.setOpen(true);
+        this.focusItem((items) => items[0]);
+      } else if (event.key === "ArrowUp") {
+        event.preventDefault();
+        event.stopPropagation();
+        this.setOpen(true);
+        this.focusItem((items) => items[items.length - 1]);
+      }
+    };
+    /** Arrow keys/Home/End move between the panel's entries; Tab closes the panel and moves on. */
+    this.onPanelKeyDown = (event) => {
+      if (event.key === "Tab") {
+        this.setOpen(false);
+        return;
+      }
+      if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) return;
+      const items = this.panelItems();
+      if (items.length === 0) return;
+      event.preventDefault();
+      event.stopPropagation();
+      const path = event.composedPath();
+      const current = items.findIndex((item) => path.includes(item));
+      const last = items.length - 1;
+      const next = event.key === "Home" ? 0 : event.key === "End" ? last : event.key === "ArrowDown" ? current < 0 || current === last ? 0 : current + 1 : current <= 0 ? last : current - 1;
+      items[next].focus();
+    };
+    this.onTitleClick = (event) => {
+      event.stopPropagation();
+      if (!this.hasContent) return;
+      event.preventDefault();
+      this.setOpen(!this.open);
+    };
+    /** A click anywhere inside the panel closes it, as in the source. */
+    this.onPanelClick = () => {
+      this.setOpen(false);
+    };
+    this.onContentSlotChange = (event) => {
+      this.hasContent = event.target.assignedNodes({ flatten: true }).some(
+        (node) => node.nodeType === Node.ELEMENT_NODE || !!node.textContent?.trim()
+      );
+    };
+    this.onIconSlotChange = (event) => {
+      this.hasIcon = event.target.assignedNodes({ flatten: true }).length > 0;
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    document.addEventListener("mousedown", this.closeOnOutsideMouseDown);
+    window.addEventListener("keydown", this.closeOnEscape);
+  }
+  disconnectedCallback() {
+    document.removeEventListener("mousedown", this.closeOnOutsideMouseDown);
+    window.removeEventListener("keydown", this.closeOnEscape);
+    if (Dropdown.openDropdown === this) Dropdown.openDropdown = null;
+    super.disconnectedCallback();
+  }
+  updated(changed) {
+    if (!changed.has("open")) return;
+    if (this.open) {
+      const previous = Dropdown.openDropdown;
+      Dropdown.openDropdown = this;
+      if (previous && previous !== this) previous.setOpen(false);
+    } else if (Dropdown.openDropdown === this) {
+      Dropdown.openDropdown = null;
+    }
+  }
+  setOpen(open) {
+    if (this.open === open) return;
+    this.open = open;
+    this.dispatchEvent(new CustomEvent("dropdown-toggle", { detail: { open }, bubbles: true, composed: true }));
+  }
+  trigger() {
+    return this.renderRoot.querySelector(".menu-title");
+  }
+  /** Keyboard-reachable entries in the panel, in order: menu items (they delegate focus to their
+   * own link) plus any plain links/buttons/tabbable elements a caller slots in. */
+  panelItems() {
+    const slot = this.renderRoot.querySelector(".menu-dropdown slot");
+    if (!slot) return [];
+    const selector = 'st-menu-item, st-menu-grid-item, a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])';
+    const items = [];
+    for (const el of slot.assignedElements({ flatten: true })) {
+      if (el.matches(selector)) items.push(el);
+      items.push(...Array.from(el.querySelectorAll(selector)));
+    }
+    return items;
+  }
+  /** Moves focus into the panel once it has become visible (it is `visibility: hidden` until the
+   * `show` class lands, and hidden elements can't take focus). */
+  focusItem(pick) {
+    void this.updateComplete.then(() => pick(this.panelItems())?.focus());
+  }
+  render() {
+    const icon = html`<span
+      class="icon ${this.iconPosition === "left" ? "icon-left" : "icon-right"}"
+      ?hidden=${!this.hasIcon}
+      style="width:${this.iconSize};height:${this.iconSize};color:${this.iconColor}"
+      ><slot name="icon" @slotchange=${this.onIconSlotChange}></slot
+    ></span>`;
+    const titleContent = html`
+      ${this.iconPosition === "left" ? icon : nothing} ${this.label ? html`<span part="label">${this.label}</span>` : nothing}
+      ${this.iconPosition === "right" ? icon : nothing}
+      ${this.hasContent ? html`<span class="arrow" part="caret" aria-hidden="true">▼</span>` : nothing}
+    `;
+    const titleClass = `menu-title ${this.triggerClassName} ${this.open ? "active" : ""}`;
+    return html`
+      <div class="menu" part="menu">
+        ${this.href ? html`
+              <a
+                part="trigger"
+                class=${titleClass}
+                href=${this.href}
+                target=${this.target}
+                aria-haspopup=${this.hasContent ? "true" : "false"}
+                aria-expanded=${this.open}
+                aria-disabled=${this.disabled ? "true" : nothing}
+                @click=${this.onTitleClick}
+                @keydown=${this.onTitleKeyDown}
+              >
+                ${titleContent}
+              </a>
+            ` : html`
+              <button
+                part="trigger"
+                class=${titleClass}
+                type="button"
+                aria-haspopup="true"
+                aria-expanded=${this.open}
+                ?disabled=${this.disabled}
+                @click=${this.onTitleClick}
+                @keydown=${this.onTitleKeyDown}
+              >
+                ${titleContent}
+              </button>
+            `}
+        <div
+          part="panel"
+          class="menu-dropdown align-${this.align} ${this.itemGroupClassName} ${this.open ? "show" : ""}"
+          role="menu"
+          @click=${this.onPanelClick}
+          @keydown=${this.onPanelKeyDown}
+        >
+          <slot @slotchange=${this.onContentSlotChange}></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+/** The open dropdown, if any — the source's `DropdownContext.activeDropdown`. */
+Dropdown.openDropdown = null;
+Dropdown.styles = css`
+    ${controlBaseStyles}
+
+    :host {
+      display: inline-block;
+      position: relative;
+      ${fontFamilyStyles}
+    }
+
+    .menu-title {
+      ${buttonResetStyles}
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-sizing: border-box;
+      min-height: 40px;
+      padding: 12px;
+      gap: 8px;
+      text-align: center;
+      width: fit-content;
+      border-radius: var(--st-radius-sm);
+      color: var(--st-color-text);
+      font-size: 0.875rem;
+      text-decoration: none;
+      white-space: nowrap;
+      transition: background-color 0.3s ease;
+    }
+
+    .menu-title:hover,
+    .menu-title[aria-expanded='true'] {
+      background: var(--st-color-hover);
+      color: var(--st-color-text-strong);
+    }
+
+    :host([active]) .menu-title {
+      background: var(--st-color-accent-subtle);
+      color: var(--st-color-accent-text);
+    }
+
+    :host([disabled]) .menu-title {
+      color: var(--st-color-text-muted);
+      cursor: not-allowed;
+      pointer-events: none;
+    }
+
+    .icon {
+      display: inline-flex;
+      flex: none;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .icon[hidden] {
+      display: none;
+    }
+
+    .arrow {
+      display: inline-block;
+      margin-left: 8px;
+      font-size: 0.75rem;
+      transition: transform 0.3s ease;
+    }
+
+    .menu-title[aria-expanded='true'] .arrow {
+      transform: rotate(180deg);
+    }
+
+    .menu-dropdown {
+      position: absolute;
+      top: 100%;
+      left: 0;
+      z-index: 100;
+      padding: 16px;
+      background: var(--st-color-surface);
+      color: var(--st-color-text);
+      border: 1px solid var(--st-color-border);
+      border-radius: var(--st-radius-sm);
+      box-shadow: 0 4px 16px var(--st-shadow-color-sm);
+      opacity: 0;
+      visibility: hidden;
+      transform: translateY(-10px);
+      /* visibility flips at once on open (so keyboard focus can move into the panel on the same
+         frame) and only after the 0.3s fade on close. */
+      transition:
+        opacity 0.3s ease,
+        transform 0.3s ease,
+        visibility 0s linear 0.3s;
+      pointer-events: none;
+    }
+
+    .menu-dropdown.align-right {
+      left: auto;
+      right: 0;
+    }
+
+    .menu-dropdown.show {
+      opacity: 1;
+      visibility: visible;
+      transform: translateY(0);
+      pointer-events: auto;
+      transition-delay: 0s;
+    }
+
+    /* Inline: the panel opens in the flow under its trigger and pushes what follows down, instead
+       of floating — the source's .touch-device layout. st-header turns this on for its menu while
+       the hamburger panel is showing. */
+    :host([inline]) {
+      display: block;
+    }
+
+    :host([inline]) .menu-title {
+      width: 100%;
+      justify-content: flex-start;
+    }
+
+    :host([inline]) .arrow {
+      margin-left: auto;
+    }
+
+    :host([inline]) .menu-dropdown {
+      display: none;
+      position: relative;
+      top: auto;
+      left: auto;
+      right: auto;
+      width: 100%;
+      box-sizing: border-box;
+      box-shadow: none;
+      opacity: 1;
+      visibility: visible;
+      transform: none;
+    }
+
+    :host([inline]) .menu-dropdown.show {
+      display: block;
+      pointer-events: auto;
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      .menu-dropdown,
+      .arrow {
+        transition: none;
+      }
+    }
+  `;
+__decorateClass([
+  property({ type: String })
+], Dropdown.prototype, "label", 2);
+__decorateClass([
+  property({ type: String })
+], Dropdown.prototype, "href", 2);
+__decorateClass([
+  property({ type: String, attribute: "icon-position" })
+], Dropdown.prototype, "iconPosition", 2);
+__decorateClass([
+  property({ type: String, attribute: "icon-size" })
+], Dropdown.prototype, "iconSize", 2);
+__decorateClass([
+  property({ type: String, attribute: "icon-color" })
+], Dropdown.prototype, "iconColor", 2);
+__decorateClass([
+  property({ type: String })
+], Dropdown.prototype, "align", 2);
+__decorateClass([
+  property({ type: String })
+], Dropdown.prototype, "target", 2);
+__decorateClass([
+  property({ type: String, attribute: "trigger-class-name" })
+], Dropdown.prototype, "triggerClassName", 2);
+__decorateClass([
+  property({ type: String, attribute: "item-group-class-name" })
+], Dropdown.prototype, "itemGroupClassName", 2);
+__decorateClass([
+  property({ type: String, attribute: "item-class-name" })
+], Dropdown.prototype, "itemClassName", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], Dropdown.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], Dropdown.prototype, "active", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], Dropdown.prototype, "inline", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], Dropdown.prototype, "open", 2);
+__decorateClass([
+  state()
+], Dropdown.prototype, "hasContent", 2);
+__decorateClass([
+  state()
+], Dropdown.prototype, "hasIcon", 2);
+Dropdown = __decorateClass([
+  customElement("st-dropdown")
+], Dropdown);
+
+export {
+  Dropdown
+};
+//# sourceMappingURL=chunk-RMIJVTFS.js.map

package/dist/chunk-RMIJVTFS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/dropdown/Dropdown.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\n\r\nimport { buttonResetStyles, controlBaseStyles, fontFamilyStyles } from '../shared/styles';\r\nimport type { DropdownToggleEventDetail } from './DropdownEvents';\r\n\r\n/**\r\n * A labeled trigger + slotted dropdown panel — nav menus (typically holding an `st-menu-grid`),\r\n * action menus, anything \"click a trigger, show content under it\". A 1:1 port of `SankhyaUI`'s\r\n * React `Dropdown` (`SankhyaCMS/SankhyaUI/src/components/Dropdown`): same markup\r\n * (`.menu` > `.menu-title` + `.menu-dropdown`), sizes, 0.3s slide/fade, and behavior —\r\n *\r\n * - only one dropdown is open at a time (the source's `DropdownProvider`, built in here, so no\r\n *   provider element is needed);\r\n * - a mousedown outside, Escape, or a click inside the panel closes it;\r\n * - an `href` trigger toggles the panel when it has content, and is a plain link when it doesn't;\r\n * - `inline` opens the panel in the flow, the source's `.touch-device` layout.\r\n *\r\n * Colors and the panel's surface come from the suite theme (the source left those to the\r\n * consumer's `className`/`itemGroupClassName` utility classes). Two source rules are left out\r\n * because they break existing suite uses (`st-source-bar`'s site/library menus): the 100vw panel\r\n * at <=768px (overflows the screen from wherever the trigger sits; the header uses `inline`\r\n * instead) and `overflow: hidden` on slotted children (clips their focus rings). Suite additions\r\n * kept on top: `align`, `active`, `disabled`, `inline`, and the `dropdown-toggle` event.\r\n */\r\n@customElement('st-dropdown')\r\nexport class Dropdown extends LitElement {\r\n  /** The open dropdown, if any — the source's `DropdownContext.activeDropdown`. */\r\n  private static openDropdown: Dropdown | null = null;\r\n\r\n  static styles = css`\r\n    ${controlBaseStyles}\r\n\r\n    :host {\r\n      display: inline-block;\r\n      position: relative;\r\n      ${fontFamilyStyles}\r\n    }\r\n\r\n    .menu-title {\r\n      ${buttonResetStyles}\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      box-sizing: border-box;\r\n      min-height: 40px;\r\n      padding: 12px;\r\n      gap: 8px;\r\n      text-align: center;\r\n      width: fit-content;\r\n      border-radius: var(--st-radius-sm);\r\n      color: var(--st-color-text);\r\n      font-size: 0.875rem;\r\n      text-decoration: none;\r\n      white-space: nowrap;\r\n      transition: background-color 0.3s ease;\r\n    }\r\n\r\n    .menu-title:hover,\r\n    .menu-title[aria-expanded='true'] {\r\n      background: var(--st-color-hover);\r\n      color: var(--st-color-text-strong);\r\n    }\r\n\r\n    :host([active]) .menu-title {\r\n      background: var(--st-color-accent-subtle);\r\n      color: var(--st-color-accent-text);\r\n    }\r\n\r\n    :host([disabled]) .menu-title {\r\n      color: var(--st-color-text-muted);\r\n      cursor: not-allowed;\r\n      pointer-events: none;\r\n    }\r\n\r\n    .icon {\r\n      display: inline-flex;\r\n      flex: none;\r\n      align-items: center;\r\n      justify-content: center;\r\n    }\r\n\r\n    .icon[hidden] {\r\n      display: none;\r\n    }\r\n\r\n    .arrow {\r\n      display: inline-block;\r\n      margin-left: 8px;\r\n      font-size: 0.75rem;\r\n      transition: transform 0.3s ease;\r\n    }\r\n\r\n    .menu-title[aria-expanded='true'] .arrow {\r\n      transform: rotate(180deg);\r\n    }\r\n\r\n    .menu-dropdown {\r\n      position: absolute;\r\n      top: 100%;\r\n      left: 0;\r\n      z-index: 100;\r\n      padding: 16px;\r\n      background: var(--st-color-surface);\r\n      color: var(--st-color-text);\r\n      border: 1px solid var(--st-color-border);\r\n      border-radius: var(--st-radius-sm);\r\n      box-shadow: 0 4px 16px var(--st-shadow-color-sm);\r\n      opacity: 0;\r\n      visibility: hidden;\r\n      transform: translateY(-10px);\r\n      /* visibility flips at once on open (so keyboard focus can move into the panel on the same\r\n         frame) and only after the 0.3s fade on close. */\r\n      transition:\r\n        opacity 0.3s ease,\r\n        transform 0.3s ease,\r\n        visibility 0s linear 0.3s;\r\n      pointer-events: none;\r\n    }\r\n\r\n    .menu-dropdown.align-right {\r\n      left: auto;\r\n      right: 0;\r\n    }\r\n\r\n    .menu-dropdown.show {\r\n      opacity: 1;\r\n      visibility: visible;\r\n      transform: translateY(0);\r\n      pointer-events: auto;\r\n      transition-delay: 0s;\r\n    }\r\n\r\n    /* Inline: the panel opens in the flow under its trigger and pushes what follows down, instead\r\n       of floating — the source's .touch-device layout. st-header turns this on for its menu while\r\n       the hamburger panel is showing. */\r\n    :host([inline]) {\r\n      display: block;\r\n    }\r\n\r\n    :host([inline]) .menu-title {\r\n      width: 100%;\r\n      justify-content: flex-start;\r\n    }\r\n\r\n    :host([inline]) .arrow {\r\n      margin-left: auto;\r\n    }\r\n\r\n    :host([inline]) .menu-dropdown {\r\n      display: none;\r\n      position: relative;\r\n      top: auto;\r\n      left: auto;\r\n      right: auto;\r\n      width: 100%;\r\n      box-sizing: border-box;\r\n      box-shadow: none;\r\n      opacity: 1;\r\n      visibility: visible;\r\n      transform: none;\r\n    }\r\n\r\n    :host([inline]) .menu-dropdown.show {\r\n      display: block;\r\n      pointer-events: auto;\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .menu-dropdown,\r\n      .arrow {\r\n        transition: none;\r\n      }\r\n    }\r\n  `;\r\n\r\n  /** Trigger label text (source: `title`, renamed because `title` is the native tooltip\r\n   * attribute). Leave empty to show only `slot=\"icon\"`. */\r\n  @property({ type: String })\r\n  label = '';\r\n\r\n  /** Renders the trigger as an `<a href>`. With panel content the click toggles the panel (as in\r\n   * the source); with none it navigates. */\r\n  @property({ type: String })\r\n  href = '';\r\n\r\n  @property({ type: String, attribute: 'icon-position' })\r\n  iconPosition: 'left' | 'right' = 'left';\r\n\r\n  /** Inline `width`/`height` of the `slot=\"icon\"` wrapper (source: `iconSize`, default `1.2rem`). */\r\n  @property({ type: String, attribute: 'icon-size' })\r\n  iconSize = '1.2rem';\r\n\r\n  /** Inline `color` of the `slot=\"icon\"` wrapper (source: `iconColor`). */\r\n  @property({ type: String, attribute: 'icon-color' })\r\n  iconColor = 'currentColor';\r\n\r\n  /** Which edge of the trigger the panel lines up with. */\r\n  @property({ type: String })\r\n  align: 'left' | 'right' = 'left';\r\n\r\n  /** `target` of an `href` trigger (source default `_self`). */\r\n  @property({ type: String })\r\n  target = '_self';\r\n\r\n  /** Extra class(es) on the trigger (source: `className`; a `class` on `st-dropdown` styles the host). */\r\n  @property({ type: String, attribute: 'trigger-class-name' })\r\n  triggerClassName = '';\r\n\r\n  /** Extra class(es) on the panel (source: `itemGroupClassName`). */\r\n  @property({ type: String, attribute: 'item-group-class-name' })\r\n  itemGroupClassName = '';\r\n\r\n  /** Unused, as in the source (`itemClassName` is never read there); kept for prop parity. */\r\n  @property({ type: String, attribute: 'item-class-name' })\r\n  itemClassName = '';\r\n\r\n  @property({ type: Boolean, reflect: true })\r\n  disabled = false;\r\n\r\n  /** Highlights the trigger as the current section (e.g. the current page is one of its items). */\r\n  @property({ type: Boolean, reflect: true })\r\n  active = false;\r\n\r\n  /** Opens the panel in the flow under the trigger instead of floating over the page (see the\r\n   * styles). `st-header` sets this on its own menu's dropdowns while its hamburger panel shows. */\r\n  @property({ type: Boolean, reflect: true })\r\n  inline = false;\r\n\r\n  /** Whether the panel is showing. Follows user toggles; may also be set from outside. */\r\n  @property({ type: Boolean, reflect: true })\r\n  open = false;\r\n\r\n  /** Whether the default slot has content — the source's `children` check. */\r\n  @state() private hasContent = false;\r\n\r\n  /** Whether `slot=\"icon\"` has content. */\r\n  @state() private hasIcon = false;\r\n\r\n  connectedCallback(): void {\r\n    super.connectedCallback();\r\n    document.addEventListener('mousedown', this.closeOnOutsideMouseDown);\r\n    window.addEventListener('keydown', this.closeOnEscape);\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    document.removeEventListener('mousedown', this.closeOnOutsideMouseDown);\r\n    window.removeEventListener('keydown', this.closeOnEscape);\r\n    if (Dropdown.openDropdown === this) Dropdown.openDropdown = null;\r\n    super.disconnectedCallback();\r\n  }\r\n\r\n  protected updated(changed: Map<string, unknown>): void {\r\n    if (!changed.has('open')) return;\r\n    if (this.open) {\r\n      const previous = Dropdown.openDropdown;\r\n      Dropdown.openDropdown = this;\r\n      if (previous && previous !== this) previous.setOpen(false);\r\n    } else if (Dropdown.openDropdown === this) {\r\n      Dropdown.openDropdown = null;\r\n    }\r\n  }\r\n\r\n  private setOpen(open: boolean): void {\r\n    if (this.open === open) return;\r\n    this.open = open;\r\n    this.dispatchEvent(new CustomEvent<DropdownToggleEventDetail>('dropdown-toggle', { detail: { open }, bubbles: true, composed: true }));\r\n  }\r\n\r\n  private closeOnOutsideMouseDown = (event: Event): void => {\r\n    if (this.open && !event.composedPath().includes(this)) this.setOpen(false);\r\n  };\r\n\r\n  private closeOnEscape = (event: KeyboardEvent): void => {\r\n    if (!this.open || event.key !== 'Escape') return;\r\n    const focusWasInside = event.composedPath().includes(this);\r\n    this.setOpen(false);\r\n    if (focusWasInside) this.trigger()?.focus();\r\n  };\r\n\r\n  private trigger(): HTMLElement | null {\r\n    return this.renderRoot.querySelector<HTMLElement>('.menu-title');\r\n  }\r\n\r\n  /** Keyboard-reachable entries in the panel, in order: menu items (they delegate focus to their\r\n   * own link) plus any plain links/buttons/tabbable elements a caller slots in. */\r\n  private panelItems(): HTMLElement[] {\r\n    const slot = this.renderRoot.querySelector<HTMLSlotElement>('.menu-dropdown slot');\r\n    if (!slot) return [];\r\n    const selector =\r\n      'st-menu-item, st-menu-grid-item, a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\r\n    const items: HTMLElement[] = [];\r\n    for (const el of slot.assignedElements({ flatten: true })) {\r\n      if (el.matches(selector)) items.push(el as HTMLElement);\r\n      items.push(...Array.from(el.querySelectorAll<HTMLElement>(selector)));\r\n    }\r\n    return items;\r\n  }\r\n\r\n  /** Moves focus into the panel once it has become visible (it is `visibility: hidden` until the\r\n   * `show` class lands, and hidden elements can't take focus). */\r\n  private focusItem(pick: (items: HTMLElement[]) => HTMLElement | undefined): void {\r\n    void this.updateComplete.then(() => pick(this.panelItems())?.focus());\r\n  }\r\n\r\n  /** Enter/Space/ArrowDown open the panel and focus its first entry; ArrowUp its last. */\r\n  private onTitleKeyDown = (event: KeyboardEvent): void => {\r\n    if (!this.hasContent || this.disabled) return;\r\n    if (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ') {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n      this.setOpen(true);\r\n      this.focusItem((items) => items[0]);\r\n    } else if (event.key === 'ArrowUp') {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n      this.setOpen(true);\r\n      this.focusItem((items) => items[items.length - 1]);\r\n    }\r\n  };\r\n\r\n  /** Arrow keys/Home/End move between the panel's entries; Tab closes the panel and moves on. */\r\n  private onPanelKeyDown = (event: KeyboardEvent): void => {\r\n    if (event.key === 'Tab') {\r\n      this.setOpen(false);\r\n      return;\r\n    }\r\n    if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;\r\n    const items = this.panelItems();\r\n    if (items.length === 0) return;\r\n    event.preventDefault();\r\n    event.stopPropagation();\r\n    const path = event.composedPath();\r\n    const current = items.findIndex((item) => path.includes(item));\r\n    const last = items.length - 1;\r\n    const next =\r\n      event.key === 'Home'\r\n        ? 0\r\n        : event.key === 'End'\r\n          ? last\r\n          : event.key === 'ArrowDown'\r\n            ? current < 0 || current === last ? 0 : current + 1\r\n            : current <= 0 ? last : current - 1;\r\n    items[next].focus();\r\n  };\r\n\r\n  private onTitleClick = (event: Event): void => {\r\n    event.stopPropagation();\r\n    if (!this.hasContent) return;\r\n    event.preventDefault();\r\n    this.setOpen(!this.open);\r\n  };\r\n\r\n  /** A click anywhere inside the panel closes it, as in the source. */\r\n  private onPanelClick = (): void => {\r\n    this.setOpen(false);\r\n  };\r\n\r\n  private onContentSlotChange = (event: Event): void => {\r\n    this.hasContent = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).some(\r\n      (node) => node.nodeType === Node.ELEMENT_NODE || !!node.textContent?.trim()\r\n    );\r\n  };\r\n\r\n  private onIconSlotChange = (event: Event): void => {\r\n    this.hasIcon = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\r\n  };\r\n\r\n  render() {\r\n    const icon = html`<span\r\n      class=\"icon ${this.iconPosition === 'left' ? 'icon-left' : 'icon-right'}\"\r\n      ?hidden=${!this.hasIcon}\r\n      style=\"width:${this.iconSize};height:${this.iconSize};color:${this.iconColor}\"\r\n      ><slot name=\"icon\" @slotchange=${this.onIconSlotChange}></slot\r\n    ></span>`;\r\n    const titleContent = html`\r\n      ${this.iconPosition === 'left' ? icon : nothing} ${this.label ? html`<span part=\"label\">${this.label}</span>` : nothing}\r\n      ${this.iconPosition === 'right' ? icon : nothing}\r\n      ${this.hasContent ? html`<span class=\"arrow\" part=\"caret\" aria-hidden=\"true\">▼</span>` : nothing}\r\n    `;\r\n    const titleClass = `menu-title ${this.triggerClassName} ${this.open ? 'active' : ''}`;\r\n\r\n    return html`\r\n      <div class=\"menu\" part=\"menu\">\r\n        ${this.href\r\n          ? html`\r\n              <a\r\n                part=\"trigger\"\r\n                class=${titleClass}\r\n                href=${this.href}\r\n                target=${this.target}\r\n                aria-haspopup=${this.hasContent ? 'true' : 'false'}\r\n                aria-expanded=${this.open}\r\n                aria-disabled=${this.disabled ? 'true' : nothing}\r\n                @click=${this.onTitleClick}\r\n                @keydown=${this.onTitleKeyDown}\r\n              >\r\n                ${titleContent}\r\n              </a>\r\n            `\r\n          : html`\r\n              <button\r\n                part=\"trigger\"\r\n                class=${titleClass}\r\n                type=\"button\"\r\n                aria-haspopup=\"true\"\r\n                aria-expanded=${this.open}\r\n                ?disabled=${this.disabled}\r\n                @click=${this.onTitleClick}\r\n                @keydown=${this.onTitleKeyDown}\r\n              >\r\n                ${titleContent}\r\n              </button>\r\n            `}\r\n        <div\r\n          part=\"panel\"\r\n          class=\"menu-dropdown align-${this.align} ${this.itemGroupClassName} ${this.open ? 'show' : ''}\"\r\n          role=\"menu\"\r\n          @click=${this.onPanelClick}\r\n          @keydown=${this.onPanelKeyDown}\r\n        >\r\n          <slot @slotchange=${this.onContentSlotChange}></slot>\r\n        </div>\r\n      </div>\r\n    `;\r\n  }\r\n}\r\n"],"mappings":"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","names":[]}