@editora/ui-core 0.1.8 → 0.1.10

package/dist/masonry-grid.cjs.js

@@ -0,0 +1,65 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("./ElementBase-1b301e7f.js"),b={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","columns","columnwidth","gap","columngap","itemgap","fill"],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)"},x=`
+  :host {
+    --ui-masonry-display: block;
+    --ui-masonry-columns: auto;
+    --ui-masonry-column-width: auto;
+    --ui-masonry-column-gap: 0px;
+    --ui-masonry-item-gap: var(--ui-masonry-column-gap);
+    --ui-masonry-fill: balance;
+    --ui-masonry-color: var(--ui-color-text, inherit);
+    color-scheme: light dark;
+    display: var(--ui-masonry-display);
+    color: var(--ui-masonry-color);
+    box-sizing: border-box;
+    inline-size: 100%;
+    min-inline-size: 0;
+    margin-block-end: calc(var(--ui-masonry-item-gap) * -1);
+    column-count: var(--ui-masonry-columns);
+    column-width: var(--ui-masonry-column-width);
+    column-gap: var(--ui-masonry-column-gap);
+    column-fill: var(--ui-masonry-fill);
+    overflow-anchor: none;
+  }
+
+  slot {
+    display: contents;
+  }
+
+  ::slotted(*) {
+    box-sizing: border-box;
+    display: block;
+    inline-size: 100%;
+    margin: 0 0 var(--ui-masonry-item-gap) 0;
+    break-inside: avoid;
+    -webkit-column-break-inside: avoid;
+    page-break-inside: avoid;
+  }
+
+  ::slotted([hidden]) {
+    display: none;
+  }
+
+  :host([headless]) {
+    display: none !important;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :host {
+      scroll-behavior: auto;
+    }
+  }
+
+  @media (prefers-contrast: more) {
+    :host {
+      --ui-masonry-color: var(--ui-color-text, inherit);
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-masonry-color: CanvasText;
+    }
+  }
+`;function d(t){if(!t)return null;const s=t.trim();if(!s.startsWith("{"))return null;try{const e=JSON.parse(s);return!e||typeof e!="object"?null:e}catch{return null}}function c(t){return v[t]||t}function y(t,s){switch(t){case"display":return{"--ui-masonry-display":s};case"columns":return{"--ui-masonry-columns":s};case"columnwidth":return{"--ui-masonry-column-width":s};case"gap":return{"--ui-masonry-column-gap":c(s),"--ui-masonry-item-gap":c(s)};case"columngap":return{"--ui-masonry-column-gap":c(s)};case"itemgap":return{"--ui-masonry-item-gap":c(s)};case"fill":return{"--ui-masonry-fill":s};default:return{}}}class h extends f.ElementBase{constructor(){super(...arguments),this._lastClassname="",this._appliedInlineProps=new Set}static get observedAttributes(){return["classname","headless",...p]}_syncLegacyClassname(){const s=this.getAttribute("classname")||"";s!==this._lastClassname&&(this._lastClassname&&this._lastClassname.split(/\s+/).forEach(e=>{e&&this.classList.remove(e)}),s&&s.split(/\s+/).forEach(e=>{e&&this.classList.add(e)}),this._lastClassname=s)}_applyInlineStyles(){this._appliedInlineProps.forEach(s=>this.style.removeProperty(s)),this._appliedInlineProps.clear(),p.forEach(s=>{const e=this.getAttribute(s);if(!e||d(e))return;const l=y(s,e);Object.entries(l).forEach(([o,u])=>{this.style.setProperty(o,u),this._appliedInlineProps.add(o)})})}_buildResponsiveCss(){const s={},e={sm:{},md:{},lg:{},xl:{}};p.forEach(n=>{const a=this.getAttribute(n),i=d(a);if(!i)return;const r=(m,g)=>{Object.assign(m,y(n,g))};typeof i.initial=="string"&&r(s,i.initial),typeof i.sm=="string"&&r(e.sm,i.sm),typeof i.md=="string"&&r(e.md,i.md),typeof i.lg=="string"&&r(e.lg,i.lg),typeof i.xl=="string"&&r(e.xl,i.xl)});const l=(n,a)=>{const i=Object.entries(a);return i.length?`${n} { ${i.map(([r,m])=>`${r}: ${m};`).join(" ")} }`:""},o=[],u=l(":host",s);return u&&o.push(u),Object.keys(e).forEach(n=>{const a=l(":host",e[n]);a&&o.push(`@media (min-width: ${b[n]}) { ${a} }`)}),o.join(`
+`)}render(){this._syncLegacyClassname(),this._applyInlineStyles();const s=this._buildResponsiveCss();this.setContent(`<style>${x}${s?`
+${s}`:""}</style><slot></slot>`),this.dispatchEvent(new CustomEvent("layoutchange",{bubbles:!0,composed:!0}))}shouldRenderOnAttributeChange(s,e,l){return!0}}typeof customElements<"u"&&!customElements.get("ui-masonry-grid")&&customElements.define("ui-masonry-grid",h);exports.UIMasonryGrid=h;

package/dist/masonry-grid.esm.js

@@ -0,0 +1,180 @@
+import { E as f } from "./ElementBase-909688f3.mjs";
+const g = {
+  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", "columns", "columnwidth", "gap", "columngap", "itemgap", "fill"], b = {
+  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-masonry-display: block;
+    --ui-masonry-columns: auto;
+    --ui-masonry-column-width: auto;
+    --ui-masonry-column-gap: 0px;
+    --ui-masonry-item-gap: var(--ui-masonry-column-gap);
+    --ui-masonry-fill: balance;
+    --ui-masonry-color: var(--ui-color-text, inherit);
+    color-scheme: light dark;
+    display: var(--ui-masonry-display);
+    color: var(--ui-masonry-color);
+    box-sizing: border-box;
+    inline-size: 100%;
+    min-inline-size: 0;
+    margin-block-end: calc(var(--ui-masonry-item-gap) * -1);
+    column-count: var(--ui-masonry-columns);
+    column-width: var(--ui-masonry-column-width);
+    column-gap: var(--ui-masonry-column-gap);
+    column-fill: var(--ui-masonry-fill);
+    overflow-anchor: none;
+  }
+
+  slot {
+    display: contents;
+  }
+
+  ::slotted(*) {
+    box-sizing: border-box;
+    display: block;
+    inline-size: 100%;
+    margin: 0 0 var(--ui-masonry-item-gap) 0;
+    break-inside: avoid;
+    -webkit-column-break-inside: avoid;
+    page-break-inside: avoid;
+  }
+
+  ::slotted([hidden]) {
+    display: none;
+  }
+
+  :host([headless]) {
+    display: none !important;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :host {
+      scroll-behavior: auto;
+    }
+  }
+
+  @media (prefers-contrast: more) {
+    :host {
+      --ui-masonry-color: var(--ui-color-text, inherit);
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-masonry-color: CanvasText;
+    }
+  }
+`;
+function d(t) {
+  if (!t)
+    return null;
+  const s = t.trim();
+  if (!s.startsWith("{"))
+    return null;
+  try {
+    const e = JSON.parse(s);
+    return !e || typeof e != "object" ? null : e;
+  } catch {
+    return null;
+  }
+}
+function u(t) {
+  return b[t] || t;
+}
+function y(t, s) {
+  switch (t) {
+    case "display":
+      return { "--ui-masonry-display": s };
+    case "columns":
+      return { "--ui-masonry-columns": s };
+    case "columnwidth":
+      return { "--ui-masonry-column-width": s };
+    case "gap":
+      return {
+        "--ui-masonry-column-gap": u(s),
+        "--ui-masonry-item-gap": u(s)
+      };
+    case "columngap":
+      return { "--ui-masonry-column-gap": u(s) };
+    case "itemgap":
+      return { "--ui-masonry-item-gap": u(s) };
+    case "fill":
+      return { "--ui-masonry-fill": s };
+    default:
+      return {};
+  }
+}
+class x extends f {
+  constructor() {
+    super(...arguments), this._lastClassname = "", this._appliedInlineProps = /* @__PURE__ */ new Set();
+  }
+  static get observedAttributes() {
+    return ["classname", "headless", ...p];
+  }
+  _syncLegacyClassname() {
+    const s = this.getAttribute("classname") || "";
+    s !== this._lastClassname && (this._lastClassname && this._lastClassname.split(/\s+/).forEach((e) => {
+      e && this.classList.remove(e);
+    }), s && s.split(/\s+/).forEach((e) => {
+      e && this.classList.add(e);
+    }), this._lastClassname = s);
+  }
+  _applyInlineStyles() {
+    this._appliedInlineProps.forEach((s) => this.style.removeProperty(s)), this._appliedInlineProps.clear(), p.forEach((s) => {
+      const e = this.getAttribute(s);
+      if (!e || d(e))
+        return;
+      const l = y(s, e);
+      Object.entries(l).forEach(([o, c]) => {
+        this.style.setProperty(o, c), this._appliedInlineProps.add(o);
+      });
+    });
+  }
+  _buildResponsiveCss() {
+    const s = {}, e = {
+      sm: {},
+      md: {},
+      lg: {},
+      xl: {}
+    };
+    p.forEach((n) => {
+      const a = this.getAttribute(n), i = d(a);
+      if (!i)
+        return;
+      const r = (m, h) => {
+        Object.assign(m, y(n, h));
+      };
+      typeof i.initial == "string" && r(s, i.initial), typeof i.sm == "string" && r(e.sm, i.sm), typeof i.md == "string" && r(e.md, i.md), typeof i.lg == "string" && r(e.lg, i.lg), typeof i.xl == "string" && r(e.xl, i.xl);
+    });
+    const l = (n, a) => {
+      const i = Object.entries(a);
+      return i.length ? `${n} { ${i.map(([r, m]) => `${r}: ${m};`).join(" ")} }` : "";
+    }, o = [], c = l(":host", s);
+    return c && o.push(c), Object.keys(e).forEach((n) => {
+      const a = l(":host", e[n]);
+      a && o.push(`@media (min-width: ${g[n]}) { ${a} }`);
+    }), o.join(`
+`);
+  }
+  render() {
+    this._syncLegacyClassname(), this._applyInlineStyles();
+    const s = this._buildResponsiveCss();
+    this.setContent(`<style>${v}${s ? `
+${s}` : ""}</style><slot></slot>`), this.dispatchEvent(new CustomEvent("layoutchange", { bubbles: !0, composed: !0 }));
+  }
+  shouldRenderOnAttributeChange(s, e, l) {
+    return !0;
+  }
+}
+typeof customElements < "u" && !customElements.get("ui-masonry-grid") && customElements.define("ui-masonry-grid", x);
+export {
+  x as UIMasonryGrid
+};

package/dist/menu-item-styles-27fdbac4.mjs

@@ -0,0 +1,181 @@
+const y = [
+  '[role="menuitem"]',
+  '[role="menuitemcheckbox"]',
+  '[role="menuitemradio"]',
+  ".item",
+  "[data-menu-item]"
+], T = [".shortcut"];
+function r(e, o) {
+  return e.flatMap((i) => o.map((n) => `${i} ${n}`)).join(`,
+  `);
+}
+function c(e, o) {
+  return e.map((i) => `${i}${o}`);
+}
+function s(e, o) {
+  return e.map((i) => `${i}${o}`);
+}
+function E(e) {
+  const o = e.itemSelectors ?? y, i = e.shortcutSelectors ?? T, n = e.activeStateSelectors ?? [], t = e.prefix, a = r(e.scopes, o), l = r(e.scopes, [
+    ...c(o, ":hover"),
+    ...c(o, ":focus-visible"),
+    ...n
+  ]), p = r(e.scopes, c(o, ":focus-visible")), m = r(e.scopes, s(o, '[aria-disabled="true"]')), d = r(e.scopes, s(o, '[data-tone="danger"]')), x = r(e.scopes, s(o, '[data-tone="success"]')), u = r(e.scopes, s(o, '[data-tone="warning"]')), b = r(e.scopes, [".separator", '[role="separator"]']), g = r(e.scopes, [".label"]), h = r(e.scopes, [".label .text"]), $ = r(e.scopes, [".label .caption"]), f = r(e.scopes, [".section-label"]), v = r(e.scopes, [".icon"]), S = r(e.scopes, [".selection-icon"]), k = r(e.scopes, ['[role="menuitemcheckbox"][aria-checked="true"] .selection-icon::before']), w = r(e.scopes, ['[role="menuitemradio"][aria-checked="true"] .selection-icon::before']), z = r(e.scopes, i), C = r(e.scopes, [".submenu-arrow"]);
+  return `
+  ${f} {
+    padding: 6px 10px 4px;
+    color: color-mix(in srgb, var(${t}-color, #0f172a) 54%, transparent);
+    font: 600 11px/1.4 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+  }
+
+  ${b} {
+    height: 1px;
+    margin: var(${t}-separator-margin, 6px 10px);
+    background: color-mix(in srgb, var(${t}-border-color, rgba(15, 23, 42, 0.14)) 86%, transparent);
+    border-radius: 999px;
+  }
+
+  ${a} {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: var(${t}-item-gap, 10px);
+    inline-size: 100%;
+    min-height: var(${t}-item-min-height, 36px);
+    padding: var(${t}-item-pad-y, 8px) var(${t}-item-pad-x, 10px);
+    border-radius: var(${t}-item-radius, 8px);
+    box-sizing: border-box;
+    color: inherit;
+    font: var(${t}-item-font-weight, 400) var(${t}-item-font-size, 14px)/var(${t}-item-line-height, 20px) Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    letter-spacing: var(--ui-default-letter-spacing, 0em);
+    outline: none;
+    cursor: default;
+    scroll-margin: var(${t}-padding, 6px) 0;
+    user-select: none;
+    transition:
+      background-color 130ms ease,
+      box-shadow 130ms ease,
+      color 130ms ease,
+      transform 130ms ease;
+  }
+
+  ${l} {
+    background: var(${t}-item-hover-bg);
+    color: var(${t}-item-active-color, inherit);
+  }
+
+  ${p} {
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(${t}-ring, #2563eb) 42%, transparent);
+  }
+
+  ${m} {
+    opacity: 0.46;
+    pointer-events: none;
+  }
+
+  ${d} {
+    color: #dc2626;
+  }
+
+  ${x} {
+    color: #15803d;
+  }
+
+  ${u} {
+    color: #b45309;
+  }
+
+  ${v} {
+    display: inline-grid;
+    place-items: center;
+    inline-size: 16px;
+    block-size: 16px;
+    flex: 0 0 16px;
+    color: color-mix(in srgb, currentColor 72%, transparent);
+  }
+
+  ${S} {
+    position: relative;
+    display: inline-grid;
+    place-items: center;
+    inline-size: 16px;
+    block-size: 16px;
+    flex: 0 0 16px;
+    border-radius: 999px;
+    color: currentColor;
+    opacity: 0;
+  }
+
+  ${k} {
+    content: '';
+    inline-size: 8px;
+    block-size: 8px;
+    border-radius: 2px;
+    background: currentColor;
+  }
+
+  ${w} {
+    content: '';
+    inline-size: 8px;
+    block-size: 8px;
+    border-radius: 999px;
+    background: currentColor;
+  }
+
+  ${r(e.scopes, [
+    '[role="menuitemcheckbox"][aria-checked="true"] .selection-icon',
+    '[role="menuitemradio"][aria-checked="true"] .selection-icon'
+  ])} {
+    opacity: 1;
+  }
+
+  ${g} {
+    min-width: 0;
+    display: grid;
+    flex: 1 1 auto;
+    overflow: hidden;
+    gap: 1px;
+  }
+
+  ${h} {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: inherit;
+    line-height: inherit;
+    letter-spacing: inherit;
+  }
+
+  ${$} {
+    color: color-mix(in srgb, currentColor 58%, transparent);
+    font-size: calc(var(${t}-item-font-size, 14px) - 1px);
+    line-height: 1.35;
+    letter-spacing: inherit;
+  }
+
+  ${z} {
+    margin-left: auto;
+    padding-left: 14px;
+    flex: 0 0 auto;
+    min-width: max-content;
+    color: color-mix(in srgb, currentColor 54%, transparent);
+    font-size: calc(var(${t}-item-font-size, 14px) - 1px);
+    line-height: 1;
+    letter-spacing: inherit;
+    white-space: nowrap;
+  }
+
+  ${C} {
+    margin-left: 6px;
+    flex: 0 0 auto;
+    color: color-mix(in srgb, currentColor 54%, transparent);
+    font-size: 12px;
+  }
+`;
+}
+export {
+  E as c
+};

package/dist/menu-item-styles-83ad1e22.js

@@ -0,0 +1,152 @@
+"use strict";const y=['[role="menuitem"]','[role="menuitemcheckbox"]','[role="menuitemradio"]',".item","[data-menu-item]"],I=[".shortcut"];function r(e,o){return e.flatMap(i=>o.map(n=>`${i} ${n}`)).join(`,
+  `)}function c(e,o){return e.map(i=>`${i}${o}`)}function s(e,o){return e.map(i=>`${i}${o}`)}function T(e){const o=e.itemSelectors??y,i=e.shortcutSelectors??I,n=e.activeStateSelectors??[],t=e.prefix,a=r(e.scopes,o),l=r(e.scopes,[...c(o,":hover"),...c(o,":focus-visible"),...n]),p=r(e.scopes,c(o,":focus-visible")),m=r(e.scopes,s(o,'[aria-disabled="true"]')),d=r(e.scopes,s(o,'[data-tone="danger"]')),u=r(e.scopes,s(o,'[data-tone="success"]')),x=r(e.scopes,s(o,'[data-tone="warning"]')),b=r(e.scopes,[".separator",'[role="separator"]']),g=r(e.scopes,[".label"]),h=r(e.scopes,[".label .text"]),$=r(e.scopes,[".label .caption"]),f=r(e.scopes,[".section-label"]),v=r(e.scopes,[".icon"]),S=r(e.scopes,[".selection-icon"]),k=r(e.scopes,['[role="menuitemcheckbox"][aria-checked="true"] .selection-icon::before']),w=r(e.scopes,['[role="menuitemradio"][aria-checked="true"] .selection-icon::before']),z=r(e.scopes,i),C=r(e.scopes,[".submenu-arrow"]);return`
+  ${f} {
+    padding: 6px 10px 4px;
+    color: color-mix(in srgb, var(${t}-color, #0f172a) 54%, transparent);
+    font: 600 11px/1.4 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+  }
+
+  ${b} {
+    height: 1px;
+    margin: var(${t}-separator-margin, 6px 10px);
+    background: color-mix(in srgb, var(${t}-border-color, rgba(15, 23, 42, 0.14)) 86%, transparent);
+    border-radius: 999px;
+  }
+
+  ${a} {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: var(${t}-item-gap, 10px);
+    inline-size: 100%;
+    min-height: var(${t}-item-min-height, 36px);
+    padding: var(${t}-item-pad-y, 8px) var(${t}-item-pad-x, 10px);
+    border-radius: var(${t}-item-radius, 8px);
+    box-sizing: border-box;
+    color: inherit;
+    font: var(${t}-item-font-weight, 400) var(${t}-item-font-size, 14px)/var(${t}-item-line-height, 20px) Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    letter-spacing: var(--ui-default-letter-spacing, 0em);
+    outline: none;
+    cursor: default;
+    scroll-margin: var(${t}-padding, 6px) 0;
+    user-select: none;
+    transition:
+      background-color 130ms ease,
+      box-shadow 130ms ease,
+      color 130ms ease,
+      transform 130ms ease;
+  }
+
+  ${l} {
+    background: var(${t}-item-hover-bg);
+    color: var(${t}-item-active-color, inherit);
+  }
+
+  ${p} {
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(${t}-ring, #2563eb) 42%, transparent);
+  }
+
+  ${m} {
+    opacity: 0.46;
+    pointer-events: none;
+  }
+
+  ${d} {
+    color: #dc2626;
+  }
+
+  ${u} {
+    color: #15803d;
+  }
+
+  ${x} {
+    color: #b45309;
+  }
+
+  ${v} {
+    display: inline-grid;
+    place-items: center;
+    inline-size: 16px;
+    block-size: 16px;
+    flex: 0 0 16px;
+    color: color-mix(in srgb, currentColor 72%, transparent);
+  }
+
+  ${S} {
+    position: relative;
+    display: inline-grid;
+    place-items: center;
+    inline-size: 16px;
+    block-size: 16px;
+    flex: 0 0 16px;
+    border-radius: 999px;
+    color: currentColor;
+    opacity: 0;
+  }
+
+  ${k} {
+    content: '';
+    inline-size: 8px;
+    block-size: 8px;
+    border-radius: 2px;
+    background: currentColor;
+  }
+
+  ${w} {
+    content: '';
+    inline-size: 8px;
+    block-size: 8px;
+    border-radius: 999px;
+    background: currentColor;
+  }
+
+  ${r(e.scopes,['[role="menuitemcheckbox"][aria-checked="true"] .selection-icon','[role="menuitemradio"][aria-checked="true"] .selection-icon'])} {
+    opacity: 1;
+  }
+
+  ${g} {
+    min-width: 0;
+    display: grid;
+    flex: 1 1 auto;
+    overflow: hidden;
+    gap: 1px;
+  }
+
+  ${h} {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: inherit;
+    line-height: inherit;
+    letter-spacing: inherit;
+  }
+
+  ${$} {
+    color: color-mix(in srgb, currentColor 58%, transparent);
+    font-size: calc(var(${t}-item-font-size, 14px) - 1px);
+    line-height: 1.35;
+    letter-spacing: inherit;
+  }
+
+  ${z} {
+    margin-left: auto;
+    padding-left: 14px;
+    flex: 0 0 auto;
+    min-width: max-content;
+    color: color-mix(in srgb, currentColor 54%, transparent);
+    font-size: calc(var(${t}-item-font-size, 14px) - 1px);
+    line-height: 1;
+    letter-spacing: inherit;
+    white-space: nowrap;
+  }
+
+  ${C} {
+    margin-left: 6px;
+    flex: 0 0 auto;
+    color: color-mix(in srgb, currentColor 54%, transparent);
+    font-size: 12px;
+  }
+`}exports.createSharedMenuItemCss=T;