@editora/ui-core 0.1.9 → 0.1.10

package/dist/flex.cjs.js

@@ -0,0 +1,54 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("./ElementBase-1b301e7f.js"),y={sm:"var(--ui-breakpoint-sm, 640px)",md:"var(--ui-breakpoint-md, 768px)",lg:"var(--ui-breakpoint-lg, 1024px)",xl:"var(--ui-breakpoint-xl, 1280px)"},p=["display","direction","align","justify","wrap","gap","rowgap","columngap"],v={xs:"var(--ui-space-xs, 4px)",sm:"var(--ui-space-sm, 8px)",md:"var(--ui-space-md, 12px)",lg:"var(--ui-space-lg, 20px)",xl:"var(--ui-space-xl, 28px)"},b=`
+  :host {
+    --ui-flex-display: flex;
+    --ui-flex-direction: row;
+    --ui-flex-align: stretch;
+    --ui-flex-justify: flex-start;
+    --ui-flex-wrap: nowrap;
+    --ui-flex-gap: 0px;
+    --ui-flex-row-gap: var(--ui-flex-gap);
+    --ui-flex-column-gap: var(--ui-flex-gap);
+    --ui-flex-color: var(--ui-color-text, inherit);
+    color-scheme: light dark;
+    display: var(--ui-flex-display);
+    color: var(--ui-flex-color);
+    box-sizing: border-box;
+    min-inline-size: 0;
+    flex-direction: var(--ui-flex-direction);
+    align-items: var(--ui-flex-align);
+    justify-content: var(--ui-flex-justify);
+    flex-wrap: var(--ui-flex-wrap);
+    gap: var(--ui-flex-gap);
+    row-gap: var(--ui-flex-row-gap);
+    column-gap: var(--ui-flex-column-gap);
+  }
+
+  slot {
+    display: contents;
+  }
+
+  :host([headless]) {
+    display: block;
+    gap: 0;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :host {
+      scroll-behavior: auto;
+    }
+  }
+
+  @media (prefers-contrast: more) {
+    :host {
+      --ui-flex-color: var(--ui-color-text, inherit);
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-flex-color: CanvasText;
+    }
+  }
+`;function x(i){if(!i)return null;const e=i.trim();if(!e.startsWith("{"))return null;try{const s=JSON.parse(e);return!s||typeof s!="object"?null:s}catch{return null}}function f(i){return v[i]||i}function d(i,e){switch(i){case"display":return{"--ui-flex-display":e};case"direction":return{"--ui-flex-direction":e};case"align":return{"--ui-flex-align":e};case"justify":return{"--ui-flex-justify":e};case"wrap":return{"--ui-flex-wrap":e};case"gap":return{"--ui-flex-gap":f(e)};case"rowgap":return{"--ui-flex-row-gap":f(e)};case"columngap":return{"--ui-flex-column-gap":f(e)};default:return{}}}class m extends h.ElementBase{constructor(){super(...arguments),this._lastClassname="",this._appliedInlineProps=new Set}static get observedAttributes(){return["classname","headless",...p]}_syncLegacyClassname(){const e=this.getAttribute("classname")||"";e!==this._lastClassname&&(this._lastClassname&&this._lastClassname.split(/\s+/).forEach(s=>{s&&this.classList.remove(s)}),e&&e.split(/\s+/).forEach(s=>{s&&this.classList.add(s)}),this._lastClassname=e)}_applyInlineStyles(){this._appliedInlineProps.forEach(e=>this.style.removeProperty(e)),this._appliedInlineProps.clear(),p.forEach(e=>{const s=this.getAttribute(e);if(!s||x(s))return;const o=d(e,s);Object.entries(o).forEach(([n,u])=>{this.style.setProperty(n,u),this._appliedInlineProps.add(n)})})}_buildResponsiveCss(){const e={},s={sm:{},md:{},lg:{},xl:{}};p.forEach(r=>{const l=this.getAttribute(r),t=x(l);if(!t)return;const a=(c,g)=>{Object.assign(c,d(r,g))};typeof t.initial=="string"&&a(e,t.initial),typeof t.sm=="string"&&a(s.sm,t.sm),typeof t.md=="string"&&a(s.md,t.md),typeof t.lg=="string"&&a(s.lg,t.lg),typeof t.xl=="string"&&a(s.xl,t.xl)});const o=(r,l)=>{const t=Object.entries(l);return t.length?`${r} { ${t.map(([a,c])=>`${a}: ${c};`).join(" ")} }`:""},n=[],u=o(":host",e);return u&&n.push(u),Object.keys(s).forEach(r=>{const l=o(":host",s[r]);l&&n.push(`@media (min-width: ${y[r]}) { ${l} }`)}),n.join(`
+`)}render(){this._syncLegacyClassname(),this._applyInlineStyles();const e=this._buildResponsiveCss();this.setContent(`<style>${b}${e?`
+${e}`:""}</style><slot></slot>`)}shouldRenderOnAttributeChange(e,s,o){return!0}}typeof customElements<"u"&&!customElements.get("ui-flex")&&customElements.define("ui-flex",m);exports.UIFlex=m;

package/dist/flex.esm.js

@@ -0,0 +1,168 @@
+import { E as g } from "./ElementBase-909688f3.mjs";
+const h = {
+  sm: "var(--ui-breakpoint-sm, 640px)",
+  md: "var(--ui-breakpoint-md, 768px)",
+  lg: "var(--ui-breakpoint-lg, 1024px)",
+  xl: "var(--ui-breakpoint-xl, 1280px)"
+}, p = ["display", "direction", "align", "justify", "wrap", "gap", "rowgap", "columngap"], y = {
+  xs: "var(--ui-space-xs, 4px)",
+  sm: "var(--ui-space-sm, 8px)",
+  md: "var(--ui-space-md, 12px)",
+  lg: "var(--ui-space-lg, 20px)",
+  xl: "var(--ui-space-xl, 28px)"
+}, v = `
+  :host {
+    --ui-flex-display: flex;
+    --ui-flex-direction: row;
+    --ui-flex-align: stretch;
+    --ui-flex-justify: flex-start;
+    --ui-flex-wrap: nowrap;
+    --ui-flex-gap: 0px;
+    --ui-flex-row-gap: var(--ui-flex-gap);
+    --ui-flex-column-gap: var(--ui-flex-gap);
+    --ui-flex-color: var(--ui-color-text, inherit);
+    color-scheme: light dark;
+    display: var(--ui-flex-display);
+    color: var(--ui-flex-color);
+    box-sizing: border-box;
+    min-inline-size: 0;
+    flex-direction: var(--ui-flex-direction);
+    align-items: var(--ui-flex-align);
+    justify-content: var(--ui-flex-justify);
+    flex-wrap: var(--ui-flex-wrap);
+    gap: var(--ui-flex-gap);
+    row-gap: var(--ui-flex-row-gap);
+    column-gap: var(--ui-flex-column-gap);
+  }
+
+  slot {
+    display: contents;
+  }
+
+  :host([headless]) {
+    display: block;
+    gap: 0;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :host {
+      scroll-behavior: auto;
+    }
+  }
+
+  @media (prefers-contrast: more) {
+    :host {
+      --ui-flex-color: var(--ui-color-text, inherit);
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-flex-color: CanvasText;
+    }
+  }
+`;
+function x(i) {
+  if (!i)
+    return null;
+  const e = i.trim();
+  if (!e.startsWith("{"))
+    return null;
+  try {
+    const s = JSON.parse(e);
+    return !s || typeof s != "object" ? null : s;
+  } catch {
+    return null;
+  }
+}
+function f(i) {
+  return y[i] || i;
+}
+function d(i, e) {
+  switch (i) {
+    case "display":
+      return { "--ui-flex-display": e };
+    case "direction":
+      return { "--ui-flex-direction": e };
+    case "align":
+      return { "--ui-flex-align": e };
+    case "justify":
+      return { "--ui-flex-justify": e };
+    case "wrap":
+      return { "--ui-flex-wrap": e };
+    case "gap":
+      return { "--ui-flex-gap": f(e) };
+    case "rowgap":
+      return { "--ui-flex-row-gap": f(e) };
+    case "columngap":
+      return { "--ui-flex-column-gap": f(e) };
+    default:
+      return {};
+  }
+}
+class b extends g {
+  constructor() {
+    super(...arguments), this._lastClassname = "", this._appliedInlineProps = /* @__PURE__ */ new Set();
+  }
+  static get observedAttributes() {
+    return ["classname", "headless", ...p];
+  }
+  _syncLegacyClassname() {
+    const e = this.getAttribute("classname") || "";
+    e !== this._lastClassname && (this._lastClassname && this._lastClassname.split(/\s+/).forEach((s) => {
+      s && this.classList.remove(s);
+    }), e && e.split(/\s+/).forEach((s) => {
+      s && this.classList.add(s);
+    }), this._lastClassname = e);
+  }
+  _applyInlineStyles() {
+    this._appliedInlineProps.forEach((e) => this.style.removeProperty(e)), this._appliedInlineProps.clear(), p.forEach((e) => {
+      const s = this.getAttribute(e);
+      if (!s || x(s))
+        return;
+      const o = d(e, s);
+      Object.entries(o).forEach(([n, u]) => {
+        this.style.setProperty(n, u), this._appliedInlineProps.add(n);
+      });
+    });
+  }
+  _buildResponsiveCss() {
+    const e = {}, s = {
+      sm: {},
+      md: {},
+      lg: {},
+      xl: {}
+    };
+    p.forEach((r) => {
+      const l = this.getAttribute(r), t = x(l);
+      if (!t)
+        return;
+      const a = (c, m) => {
+        Object.assign(c, d(r, m));
+      };
+      typeof t.initial == "string" && a(e, t.initial), typeof t.sm == "string" && a(s.sm, t.sm), typeof t.md == "string" && a(s.md, t.md), typeof t.lg == "string" && a(s.lg, t.lg), typeof t.xl == "string" && a(s.xl, t.xl);
+    });
+    const o = (r, l) => {
+      const t = Object.entries(l);
+      return t.length ? `${r} { ${t.map(([a, c]) => `${a}: ${c};`).join(" ")} }` : "";
+    }, n = [], u = o(":host", e);
+    return u && n.push(u), Object.keys(s).forEach((r) => {
+      const l = o(":host", s[r]);
+      l && n.push(`@media (min-width: ${h[r]}) { ${l} }`);
+    }), n.join(`
+`);
+  }
+  render() {
+    this._syncLegacyClassname(), this._applyInlineStyles();
+    const e = this._buildResponsiveCss();
+    this.setContent(`<style>${v}${e ? `
+${e}` : ""}</style><slot></slot>`);
+  }
+  shouldRenderOnAttributeChange(e, s, o) {
+    return !0;
+  }
+}
+typeof customElements < "u" && !customElements.get("ui-flex") && customElements.define("ui-flex", b);
+export {
+  b as UIFlex
+};

package/dist/floating-toolbar.cjs.js

@@ -0,0 +1,223 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./ElementBase-1b301e7f.js"),_=`
+  :host {
+    position: fixed;
+    inset: 0;
+    z-index: var(--ui-floating-toolbar-z, 1300);
+    pointer-events: none;
+    display: none;
+    color-scheme: light dark;
+
+    --ui-floating-toolbar-bg: var(--ui-color-surface, #ffffff);
+    --ui-floating-toolbar-color: var(--ui-color-text, #0f172a);
+    --ui-floating-toolbar-muted: var(--ui-color-muted, #64748b);
+    --ui-floating-toolbar-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
+    --ui-floating-toolbar-border: 1px solid var(--ui-floating-toolbar-border-color);
+    --ui-floating-toolbar-radius: 12px;
+    --ui-floating-toolbar-shadow:
+      none;
+    --ui-floating-toolbar-padding: 6px;
+    --ui-floating-toolbar-gap: 6px;
+    --ui-floating-toolbar-focus-ring: var(--ui-color-focus-ring, #2563eb);
+    --ui-floating-toolbar-accent: var(--ui-color-primary, #2563eb);
+    --ui-floating-toolbar-backdrop: none;
+    --ui-floating-toolbar-x: 0px;
+    --ui-floating-toolbar-y: 0px;
+    --ui-floating-toolbar-enter-y: -4px;
+    --ui-floating-toolbar-duration: 170ms;
+    --ui-floating-toolbar-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
+  }
+
+  :host([open]) {
+    display: block;
+  }
+
+  .panel {
+    position: fixed;
+    left: 0;
+    top: 0;
+    box-sizing: border-box;
+    pointer-events: auto;
+    min-inline-size: min(180px, calc(100vw - 16px));
+    max-inline-size: min(560px, calc(100vw - 16px));
+    border-radius: var(--ui-floating-toolbar-radius);
+    border: var(--ui-floating-toolbar-border);
+    background: var(--ui-floating-toolbar-bg);
+    color: var(--ui-floating-toolbar-color);
+    box-shadow: var(--ui-floating-toolbar-shadow);
+    backdrop-filter: var(--ui-floating-toolbar-backdrop);
+    padding: var(--ui-floating-toolbar-padding);
+    display: grid;
+    gap: var(--ui-floating-toolbar-gap);
+    outline: none;
+    transform:
+      translate3d(
+        var(--ui-floating-toolbar-x, 0px),
+        calc(var(--ui-floating-toolbar-y, 0px) + var(--ui-floating-toolbar-enter-y, -4px)),
+        0
+      )
+      scale(0.985);
+    opacity: 0;
+    transition:
+      transform var(--ui-floating-toolbar-duration) var(--ui-floating-toolbar-easing),
+      opacity var(--ui-floating-toolbar-duration) ease,
+      border-color var(--ui-floating-toolbar-duration) var(--ui-floating-toolbar-easing),
+      box-shadow var(--ui-floating-toolbar-duration) var(--ui-floating-toolbar-easing);
+    transform-origin: var(--ui-floating-toolbar-origin-x, 50%) var(--ui-floating-toolbar-origin-y, 100%);
+    will-change: transform, opacity;
+  }
+
+  :host([open]) .panel {
+    opacity: 1;
+    transform:
+      translate3d(var(--ui-floating-toolbar-x, 0px), var(--ui-floating-toolbar-y, 0px), 0)
+      scale(1);
+  }
+
+  .panel[data-side="bottom"] {
+    --ui-floating-toolbar-enter-y: 4px;
+    --ui-floating-toolbar-origin-y: 0%;
+  }
+
+  .row {
+    min-width: 0;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--ui-floating-toolbar-gap);
+  }
+
+  .row[hidden] {
+    display: none;
+  }
+
+  ::slotted([slot="toolbar"]) {
+    display: inline-flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: var(--ui-floating-toolbar-gap);
+    min-width: 0;
+  }
+
+  :host([shape="square"]) {
+    --ui-floating-toolbar-radius: 6px;
+  }
+
+  :host([shape="soft"]) {
+    --ui-floating-toolbar-radius: 18px;
+  }
+
+  :host([density="compact"]) {
+    --ui-floating-toolbar-padding: 4px;
+    --ui-floating-toolbar-gap: 4px;
+  }
+
+  :host([density="comfortable"]) {
+    --ui-floating-toolbar-padding: 8px;
+    --ui-floating-toolbar-gap: 8px;
+  }
+
+  :host([elevation="none"]) {
+    --ui-floating-toolbar-shadow: none;
+  }
+
+  :host([elevation="low"]) {
+    --ui-floating-toolbar-shadow:
+      0 1px 4px rgba(2, 6, 23, 0.12),
+      0 12px 26px rgba(2, 6, 23, 0.16);
+  }
+
+  :host([elevation="high"]) {
+    --ui-floating-toolbar-shadow:
+      0 4px 14px rgba(2, 6, 23, 0.18),
+      0 26px 62px rgba(2, 6, 23, 0.26);
+  }
+
+  :host([variant="flat"]) {
+    --ui-floating-toolbar-shadow: none;
+    --ui-floating-toolbar-backdrop: none;
+  }
+
+  :host([variant="soft"]) {
+    --ui-floating-toolbar-bg: color-mix(in srgb, var(--ui-floating-toolbar-accent) 8%, var(--ui-color-surface, #ffffff));
+    --ui-floating-toolbar-border-color: color-mix(in srgb, var(--ui-floating-toolbar-accent) 30%, var(--ui-color-border, #cbd5e1));
+  }
+
+  :host([variant="glass"]) {
+    --ui-floating-toolbar-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 74%, transparent);
+    --ui-floating-toolbar-backdrop: blur(12px) saturate(1.08);
+  }
+
+  :host([variant="contrast"]) {
+    --ui-floating-toolbar-bg: #0f172a;
+    --ui-floating-toolbar-color: #f8fafc;
+    --ui-floating-toolbar-muted: #93a4bd;
+    --ui-floating-toolbar-border-color: #334155;
+    --ui-floating-toolbar-focus-ring: #93c5fd;
+  }
+
+  :host([tone="success"]) {
+    --ui-floating-toolbar-accent: var(--ui-color-success, #16a34a);
+  }
+
+  :host([tone="warning"]) {
+    --ui-floating-toolbar-accent: var(--ui-color-warning, #d97706);
+  }
+
+  :host([tone="danger"]) {
+    --ui-floating-toolbar-accent: var(--ui-color-danger, #dc2626);
+  }
+
+  :host([disabled]) .panel {
+    opacity: 0.62;
+    pointer-events: none;
+  }
+
+  :host([headless]) .panel {
+    display: none !important;
+  }
+
+  @media (prefers-contrast: more) {
+    :host {
+      --ui-floating-toolbar-border: 2px solid var(--ui-floating-toolbar-border-color);
+      --ui-floating-toolbar-shadow: none;
+      --ui-floating-toolbar-backdrop: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-floating-toolbar-bg: Canvas;
+      --ui-floating-toolbar-color: CanvasText;
+      --ui-floating-toolbar-muted: CanvasText;
+      --ui-floating-toolbar-border-color: CanvasText;
+      --ui-floating-toolbar-border: 1px solid CanvasText;
+      --ui-floating-toolbar-shadow: none;
+      --ui-floating-toolbar-focus-ring: Highlight;
+    }
+
+    .panel,
+    ::slotted([slot="toolbar"]) {
+      forced-color-adjust: none;
+      border-color: CanvasText;
+      background: Canvas;
+      color: CanvasText;
+      box-shadow: none;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .panel {
+      transition: none !important;
+    }
+  }
+`;function m(i,t){if(i==null||i==="")return t;const e=Number(i);return Number.isFinite(e)?e:t}function b(i,t){if(i==null)return t;const e=i.trim().toLowerCase();return e!=="false"&&e!=="0"&&e!=="off"}function c(i,t,e){return Math.min(e,Math.max(t,i))}function v(i){if(!document.body.contains(i))return!1;const t=window.getComputedStyle(i);return!(t.display==="none"||t.visibility==="hidden"||Number.parseFloat(t.opacity||"1")<=0)}function y(i){return i==="top"||i==="bottom"?i:"auto"}function w(i){return i==="start"||i==="end"?i:"center"}function x(i){const t='button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',e=[];return i.forEach(o=>{o instanceof HTMLElement&&(o.matches(t)&&e.push(o),e.push(...Array.from(o.querySelectorAll(t))))}),Array.from(new Set(e))}class f extends p.ElementBase{constructor(){super(...arguments),this._anchor=null,this._panel=null,this._toolbarSlot=null,this._defaultSlot=null,this._raf=null,this._resizeObserver=null,this._mutationObserver=null,this._globalListenersBound=!1,this._isOpen=!1,this._closeReason="programmatic",this._onWindowChangeBound=this._onWindowChange.bind(this),this._onDocumentPointerDownBound=this._onDocumentPointerDown.bind(this),this._onDocumentKeyDownBound=this._onDocumentKeyDown.bind(this),this._onPanelKeyDownBound=this._onPanelKeyDown.bind(this),this._onSlotChangeBound=this._onSlotChange.bind(this)}static get observedAttributes(){return["open","anchor-id","headless","disabled","placement","align","offset","close-on-outside","close-on-escape","aria-label","aria-labelledby","variant","density","shape","elevation","tone"]}connectedCallback(){super.connectedCallback(),this._syncAnchorFromAttribute(),this._syncOpenState(),this._schedulePosition()}disconnectedCallback(){this._unbindGlobalListeners(),this._teardownObservers(),this._raf!=null&&(cancelAnimationFrame(this._raf),this._raf=null),super.disconnectedCallback()}attributeChangedCallback(t,e,o){if(e!==o){if(t==="anchor-id"){this._syncAnchorFromAttribute(),this.hasAttribute("open")&&!this._anchor&&this._requestClose("anchor-missing"),this._schedulePosition();return}if(t==="open"){this._syncOpenState(),this._schedulePosition();return}if(t==="disabled"){this.hasAttribute("disabled")&&this.hasAttribute("open")&&this._requestClose("disabled");return}if(t==="headless"){this._syncOpenState(),this._schedulePosition();return}if(t==="aria-label"||t==="aria-labelledby"){this._syncPanelA11y();return}(t==="placement"||t==="align"||t==="offset")&&this._schedulePosition()}}showForAnchorId(t){if(this.hasAttribute("disabled")||!t)return;const e=document.getElementById(t);if(!e){this._requestClose("anchor-missing");return}this._anchor=e,this.setAttribute("anchor-id",t),this.openToolbar()}hide(){this.closeToolbar("programmatic")}openToolbar(){this.hasAttribute("disabled")||(this.hasAttribute("open")||this.setAttribute("open",""),this._schedulePosition())}closeToolbar(t="programmatic"){this.hasAttribute("open")&&(this._closeReason=t,this.removeAttribute("open"))}_syncOpenState(){const t=this.hasAttribute("open")&&!this.hasAttribute("headless")&&!this.hasAttribute("disabled");if(t===this._isOpen){t&&this._schedulePosition();return}if(this._isOpen=t,t){this._bindGlobalListeners(),this._ensureObservers(),this._dispatchOpenEvents(),this._schedulePosition();return}this._unbindGlobalListeners(),this._teardownObservers(),this._raf!=null&&(cancelAnimationFrame(this._raf),this._raf=null),this._dispatchCloseEvents(this._closeReason),this._closeReason="programmatic"}_dispatchOpenEvents(){this.dispatchEvent(new CustomEvent("open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{open:!0}}))}_dispatchCloseEvents(t){this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0,detail:{reason:t}})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{open:!1,reason:t}}))}_requestClose(t){if(!this.hasAttribute("open"))return;const e=new CustomEvent("request-close",{detail:{reason:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(e);const o=new CustomEvent("ui-request-close",{detail:{reason:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(o),!(e.defaultPrevented||o.defaultPrevented)&&this.closeToolbar(t)}_syncAnchorFromAttribute(){const t=this.getAttribute("anchor-id");if(!t){this._anchor=null;return}this._anchor=document.getElementById(t)}_schedulePosition(){!this.hasAttribute("open")||this.hasAttribute("headless")||this.hasAttribute("disabled")||(this._raf!=null&&cancelAnimationFrame(this._raf),this._raf=requestAnimationFrame(()=>{this._raf=null,this._position()}))}_ensureObservers(){if(!(this._resizeObserver&&this._mutationObserver)){if(typeof ResizeObserver<"u"){if(this._resizeObserver=new ResizeObserver(()=>this._schedulePosition()),this._panel)try{this._resizeObserver.observe(this._panel)}catch{}if(this._anchor)try{this._resizeObserver.observe(this._anchor)}catch{}}if(typeof MutationObserver<"u"&&this._anchor){this._mutationObserver=new MutationObserver(()=>this._schedulePosition());try{this._mutationObserver.observe(this._anchor,{attributes:!0,childList:!1,subtree:!1})}catch{}}}}_teardownObservers(){this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null),this._mutationObserver&&(this._mutationObserver.disconnect(),this._mutationObserver=null)}_refreshObservers(){this._isOpen&&(this._teardownObservers(),this._ensureObservers())}_bindGlobalListeners(){this._globalListenersBound||(window.addEventListener("scroll",this._onWindowChangeBound,!0),window.addEventListener("resize",this._onWindowChangeBound),document.addEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.addEventListener("keydown",this._onDocumentKeyDownBound,!0),this._globalListenersBound=!0)}_unbindGlobalListeners(){this._globalListenersBound&&(window.removeEventListener("scroll",this._onWindowChangeBound,!0),window.removeEventListener("resize",this._onWindowChangeBound),document.removeEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.removeEventListener("keydown",this._onDocumentKeyDownBound,!0),this._globalListenersBound=!1)}_position(){if(!this.hasAttribute("open")||this.hasAttribute("headless")||this.hasAttribute("disabled"))return;if(!this._anchor){this._requestClose("anchor-missing");return}if(!v(this._anchor)){this._requestClose("anchor-hidden");return}if(!this._panel)return;const t=this._anchor.getBoundingClientRect(),e=this._panel.getBoundingClientRect(),o=8,n=Math.max(0,m(this.getAttribute("offset"),8)),r=y(this.getAttribute("placement")),s=w(this.getAttribute("align")),a=t.top-o,l=window.innerHeight-t.bottom-o,d=r==="bottom"||r==="auto"&&l>a&&a<e.height+n,g=d?"bottom":"top";let h=d?t.bottom+n:t.top-e.height-n;h=c(h,o,window.innerHeight-e.height-o);let u=t.left+t.width/2-e.width/2;s==="start"&&(u=t.left),s==="end"&&(u=t.right-e.width),u=c(u,o,window.innerWidth-e.width-o),this.style.setProperty("--ui-floating-toolbar-x",`${Math.round(u)}px`),this.style.setProperty("--ui-floating-toolbar-y",`${Math.round(h)}px`),this.style.setProperty("--ui-floating-toolbar-origin-x",s==="start"?"0%":s==="end"?"100%":"50%"),this._panel.setAttribute("data-side",g)}_onWindowChange(){this.hasAttribute("open")&&this._schedulePosition()}_onDocumentPointerDown(t){if(!this.hasAttribute("open")||!b(this.getAttribute("close-on-outside"),!0))return;const e=t.composedPath();e.includes(this)||this._anchor&&e.includes(this._anchor)||this._requestClose("outside")}_onDocumentKeyDown(t){this.hasAttribute("open")&&t.key==="Escape"&&b(this.getAttribute("close-on-escape"),!0)&&(t.preventDefault(),this._requestClose("escape"))}_onPanelKeyDown(t){if(!this._panel||!["ArrowRight","ArrowLeft","Home","End"].includes(t.key))return;const e=this._getFocusableItems();if(e.length===0)return;const o=document.activeElement,n=o?e.indexOf(o):-1;let r=n;t.key==="Home"?r=0:t.key==="End"?r=e.length-1:t.key==="ArrowRight"?r=n<0?0:(n+1)%e.length:t.key==="ArrowLeft"&&(r=n<0?e.length-1:(n-1+e.length)%e.length);const s=e[r];s&&(t.preventDefault(),s.focus())}_getFocusableItems(){var o,n;const t=((o=this._toolbarSlot)==null?void 0:o.assignedElements({flatten:!0}))||[],e=((n=this._defaultSlot)==null?void 0:n.assignedElements({flatten:!0}))||[];return x([...t,...e])}_onSlotChange(){this._syncRowVisibility(),this._schedulePosition()}_syncRowVisibility(){var r,s;const t=this.root.querySelector(".row-toolbar"),e=this.root.querySelector(".row-default");if(!t||!e)return;const o=(((r=this._toolbarSlot)==null?void 0:r.assignedNodes({flatten:!0}))||[]).some(a=>{var l;return a.nodeType===Node.TEXT_NODE?!!((l=a.textContent)!=null&&l.trim()):a.nodeType===Node.ELEMENT_NODE}),n=(((s=this._defaultSlot)==null?void 0:s.assignedNodes({flatten:!0}))||[]).some(a=>{var l;return a.nodeType===Node.TEXT_NODE?!!((l=a.textContent)!=null&&l.trim()):a.nodeType===Node.ELEMENT_NODE});o?t.removeAttribute("hidden"):t.setAttribute("hidden",""),n?e.removeAttribute("hidden"):e.setAttribute("hidden","")}_syncPanelA11y(){if(!this._panel)return;const t=this.getAttribute("aria-labelledby"),e=this.getAttribute("aria-label")||(t?null:"Floating toolbar");t?this._panel.setAttribute("aria-labelledby",t):this._panel.removeAttribute("aria-labelledby"),e?this._panel.setAttribute("aria-label",e):this._panel.removeAttribute("aria-label")}render(){var t,e,o,n,r,s;this.setContent(`
+      <style>${_}</style>
+      <section class="panel" part="panel" role="toolbar" aria-orientation="horizontal" tabindex="-1">
+        <div class="row row-toolbar" part="row-toolbar">
+          <slot name="toolbar"></slot>
+        </div>
+        <div class="row row-default" part="row-default">
+          <slot></slot>
+        </div>
+      </section>
+    `),this._panel=this.root.querySelector(".panel"),this._toolbarSlot=this.root.querySelector('slot[name="toolbar"]'),this._defaultSlot=this.root.querySelector("slot:not([name])"),(t=this._panel)==null||t.removeEventListener("keydown",this._onPanelKeyDownBound),(e=this._panel)==null||e.addEventListener("keydown",this._onPanelKeyDownBound),(o=this._toolbarSlot)==null||o.removeEventListener("slotchange",this._onSlotChangeBound),(n=this._defaultSlot)==null||n.removeEventListener("slotchange",this._onSlotChangeBound),(r=this._toolbarSlot)==null||r.addEventListener("slotchange",this._onSlotChangeBound),(s=this._defaultSlot)==null||s.addEventListener("slotchange",this._onSlotChangeBound),this._syncPanelA11y(),this._syncRowVisibility(),this._refreshObservers(),this._schedulePosition()}}typeof customElements<"u"&&!customElements.get("ui-floating-toolbar")&&customElements.define("ui-floating-toolbar",f);exports.UIFloatingToolbar=f;