@cordwainer/cw-elements 1.4.0-alpha.1 → 1.4.1

package/cdn/chunks/chunk.3KYQA6PB.js

@@ -0,0 +1,91 @@
+import {
+  social_link_styles_default
+} from "./chunk.RIL5ANBQ.js";
+import {
+  CwIconButton
+} from "./chunk.46OE2MNL.js";
+import {
+  o
+} from "./chunk.LRAERZML.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  n
+} from "./chunk.VW6RGEPL.js";
+import {
+  b
+} from "./chunk.6A2LG33L.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/social-link/social-link.component.ts
+var PLATFORMS = {
+  bluesky: { icon: "bluesky", label: "Bluesky" },
+  discord: { icon: "discord", label: "Discord" },
+  facebook: { icon: "facebook", label: "Facebook" },
+  github: { icon: "github", label: "GitHub" },
+  instagram: { icon: "instagram", label: "Instagram" },
+  linkedin: { icon: "linkedin", label: "LinkedIn" },
+  mastodon: { icon: "mastodon", label: "Mastodon" },
+  threads: { icon: "threads", label: "Threads" },
+  tiktok: { icon: "tiktok", label: "TikTok" },
+  twitter: { icon: "twitter-x", label: "X (Twitter)" },
+  youtube: { icon: "youtube", label: "YouTube" }
+};
+var CwSocialLink = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.href = "";
+    this.target = "_blank";
+    this.rel = "noreferrer noopener";
+  }
+  render() {
+    var _a, _b, _c, _d;
+    const platformInfo = this.platform ? PLATFORMS[this.platform] : void 0;
+    const resolvedName = (_a = this.name) != null ? _a : platformInfo == null ? void 0 : platformInfo.icon;
+    const resolvedLibrary = (_b = this.library) != null ? _b : platformInfo ? "system" : void 0;
+    const resolvedLabel = (_d = (_c = this.label) != null ? _c : platformInfo == null ? void 0 : platformInfo.label) != null ? _d : "";
+    return b`
+      <cw-icon-button
+        part="base"
+        exportparts="base:base__icon-button"
+        href=${this.href}
+        target=${this.target}
+        rel=${this.rel}
+        name=${o(resolvedName)}
+        library=${o(resolvedLibrary)}
+        label=${resolvedLabel}
+      ></cw-icon-button>
+    `;
+  }
+};
+CwSocialLink.styles = [component_styles_default, social_link_styles_default];
+CwSocialLink.dependencies = { "cw-icon-button": CwIconButton };
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "href", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "target", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "rel", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "platform", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "name", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "library", 2);
+__decorateClass([
+  n()
+], CwSocialLink.prototype, "label", 2);
+
+export {
+  CwSocialLink
+};

package/cdn/chunks/chunk.3NUMUMX2.js

@@ -0,0 +1,11 @@
+import {
+  CwPrimaryNavigationMenu
+} from "./chunk.SSBEEGNX.js";
+
+// src/components/primary-navigation-menu/primary-navigation-menu.ts
+var primary_navigation_menu_default = CwPrimaryNavigationMenu;
+CwPrimaryNavigationMenu.define("cw-primary-navigation-menu");
+
+export {
+  primary_navigation_menu_default
+};

package/cdn/chunks/chunk.3SCMLHCH.js

@@ -0,0 +1,11 @@
+import {
+  CwPrimaryNavigationItem
+} from "./chunk.IBBOX6EV.js";
+
+// src/components/primary-navigation-item/primary-navigation-item.ts
+var primary_navigation_item_default = CwPrimaryNavigationItem;
+CwPrimaryNavigationItem.define("cw-primary-navigation-item");
+
+export {
+  primary_navigation_item_default
+};

package/cdn/chunks/chunk.3YSIFFWX.js

@@ -0,0 +1,11 @@
+import {
+  CwBadge
+} from "./chunk.MQYK4VON.js";
+
+// src/components/badge/badge.ts
+var badge_default = CwBadge;
+CwBadge.define("cw-badge");
+
+export {
+  badge_default
+};

package/cdn/chunks/chunk.43F32UZG.js

@@ -0,0 +1,11 @@
+import {
+  CwFormatBytes
+} from "./chunk.TMZFUK34.js";
+
+// src/components/format-bytes/format-bytes.ts
+var format_bytes_default = CwFormatBytes;
+CwFormatBytes.define("cw-format-bytes");
+
+export {
+  format_bytes_default
+};

package/cdn/chunks/chunk.46OE2MNL.js

@@ -0,0 +1,139 @@
+import {
+  icon_button_styles_default
+} from "./chunk.DH2BQY42.js";
+import {
+  i,
+  u
+} from "./chunk.FYKGNQO2.js";
+import {
+  o
+} from "./chunk.LRAERZML.js";
+import {
+  e
+} from "./chunk.VBR4VS53.js";
+import {
+  CwIcon
+} from "./chunk.ZDQ5JSGO.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  e as e2,
+  n,
+  r
+} from "./chunk.VW6RGEPL.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/icon-button/icon-button.component.ts
+var CwIconButton = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.hasFocus = false;
+    this.label = "";
+    this.disabled = false;
+  }
+  handleBlur() {
+    this.hasFocus = false;
+    this.emit("cw-blur");
+  }
+  handleFocus() {
+    this.hasFocus = true;
+    this.emit("cw-focus");
+  }
+  handleClick(event) {
+    if (this.disabled) {
+      event.preventDefault();
+      event.stopPropagation();
+    }
+  }
+  /** Simulates a click on the icon button. */
+  click() {
+    this.button.click();
+  }
+  /** Sets focus on the icon button. */
+  focus(options) {
+    this.button.focus(options);
+  }
+  /** Removes focus from the icon button. */
+  blur() {
+    this.button.blur();
+  }
+  render() {
+    var _a;
+    const isLink = this.href ? true : false;
+    const tag = isLink ? i`a` : i`button`;
+    return u`
+      <${tag}
+        part="base"
+        class=${e({
+      "icon-button": true,
+      "icon-button--disabled": !isLink && this.disabled,
+      "icon-button--focused": this.hasFocus
+    })}
+        ?disabled=${o(isLink ? void 0 : this.disabled)}
+        type=${o(isLink ? void 0 : "button")}
+        href=${o(isLink ? this.href : void 0)}
+        target=${o(isLink ? this.target : void 0)}
+        download=${o(isLink ? this.download : void 0)}
+        rel=${o(isLink ? (_a = this.rel) != null ? _a : this.target ? "noreferrer noopener" : void 0 : void 0)}
+        role=${o(isLink ? void 0 : "button")}
+        aria-disabled=${this.disabled ? "true" : "false"}
+        aria-label="${this.label}"
+        tabindex=${this.disabled ? "-1" : "0"}
+        @blur=${this.handleBlur}
+        @focus=${this.handleFocus}
+        @click=${this.handleClick}
+      >
+        <cw-icon
+          class="icon-button__icon"
+          name=${o(this.name)}
+          library=${o(this.library)}
+          src=${o(this.src)}
+          aria-hidden="true"
+        ></cw-icon>
+      </${tag}>
+    `;
+  }
+};
+CwIconButton.styles = [component_styles_default, icon_button_styles_default];
+CwIconButton.dependencies = { "cw-icon": CwIcon };
+__decorateClass([
+  e2(".icon-button")
+], CwIconButton.prototype, "button", 2);
+__decorateClass([
+  r()
+], CwIconButton.prototype, "hasFocus", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "name", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "library", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "src", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "href", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "target", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "download", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "rel", 2);
+__decorateClass([
+  n()
+], CwIconButton.prototype, "label", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwIconButton.prototype, "disabled", 2);
+
+export {
+  CwIconButton
+};

package/cdn/chunks/chunk.46ONZNXR.js

@@ -0,0 +1,236 @@
+import {
+  details_styles_default
+} from "./chunk.DT2PUVBX.js";
+import {
+  getAnimation,
+  setDefaultAnimation
+} from "./chunk.JSLXCIMZ.js";
+import {
+  waitForEvent
+} from "./chunk.B4BZKR24.js";
+import {
+  animateTo,
+  shimKeyframesHeightAuto,
+  stopAnimations
+} from "./chunk.3CTNMS55.js";
+import {
+  LocalizeController
+} from "./chunk.75ZQOYXC.js";
+import {
+  e
+} from "./chunk.VBR4VS53.js";
+import {
+  CwIcon
+} from "./chunk.ZDQ5JSGO.js";
+import {
+  watch
+} from "./chunk.RB5L7E7Z.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  e as e2,
+  n
+} from "./chunk.VW6RGEPL.js";
+import {
+  b
+} from "./chunk.6A2LG33L.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/details/details.component.ts
+var CwDetails = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.localize = new LocalizeController(this);
+    this.open = false;
+    this.disabled = false;
+  }
+  firstUpdated() {
+    this.body.style.height = this.open ? "auto" : "0";
+    if (this.open) {
+      this.details.open = true;
+    }
+    this.detailsObserver = new MutationObserver((changes) => {
+      for (const change of changes) {
+        if (change.type === "attributes" && change.attributeName === "open") {
+          if (this.details.open) {
+            this.show();
+          } else {
+            this.hide();
+          }
+        }
+      }
+    });
+    this.detailsObserver.observe(this.details, { attributes: true });
+  }
+  disconnectedCallback() {
+    var _a;
+    super.disconnectedCallback();
+    (_a = this.detailsObserver) == null ? void 0 : _a.disconnect();
+  }
+  handleSummaryClick(event) {
+    event.preventDefault();
+    if (!this.disabled) {
+      if (this.open) {
+        this.hide();
+      } else {
+        this.show();
+      }
+      this.header.focus();
+    }
+  }
+  handleSummaryKeyDown(event) {
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      if (this.open) {
+        this.hide();
+      } else {
+        this.show();
+      }
+    }
+    if (event.key === "ArrowUp" || event.key === "ArrowLeft") {
+      event.preventDefault();
+      this.hide();
+    }
+    if (event.key === "ArrowDown" || event.key === "ArrowRight") {
+      event.preventDefault();
+      this.show();
+    }
+  }
+  async handleOpenChange() {
+    if (this.open) {
+      this.details.open = true;
+      const cwShow = this.emit("cw-show", { cancelable: true });
+      if (cwShow.defaultPrevented) {
+        this.open = false;
+        this.details.open = false;
+        return;
+      }
+      await stopAnimations(this.body);
+      const { keyframes, options } = getAnimation(this, "details.show", { dir: this.localize.dir() });
+      await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);
+      this.body.style.height = "auto";
+      this.emit("cw-after-show");
+    } else {
+      const cwHide = this.emit("cw-hide", { cancelable: true });
+      if (cwHide.defaultPrevented) {
+        this.details.open = true;
+        this.open = true;
+        return;
+      }
+      await stopAnimations(this.body);
+      const { keyframes, options } = getAnimation(this, "details.hide", { dir: this.localize.dir() });
+      await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);
+      this.body.style.height = "auto";
+      this.details.open = false;
+      this.emit("cw-after-hide");
+    }
+  }
+  /** Shows the details. */
+  async show() {
+    if (this.open || this.disabled) {
+      return void 0;
+    }
+    this.open = true;
+    return waitForEvent(this, "cw-after-show");
+  }
+  /** Hides the details */
+  async hide() {
+    if (!this.open || this.disabled) {
+      return void 0;
+    }
+    this.open = false;
+    return waitForEvent(this, "cw-after-hide");
+  }
+  render() {
+    const isRtl = this.localize.dir() === "rtl";
+    return b`
+      <details
+        part="base"
+        class=${e({
+      details: true,
+      "details--open": this.open,
+      "details--disabled": this.disabled,
+      "details--rtl": isRtl
+    })}
+      >
+        <summary
+          part="header"
+          id="header"
+          class="details__header"
+          role="button"
+          aria-expanded=${this.open ? "true" : "false"}
+          aria-controls="content"
+          aria-disabled=${this.disabled ? "true" : "false"}
+          tabindex=${this.disabled ? "-1" : "0"}
+          @click=${this.handleSummaryClick}
+          @keydown=${this.handleSummaryKeyDown}
+        >
+          <slot name="summary" part="summary" class="details__summary">${this.summary}</slot>
+
+          <span part="summary-icon" class="details__summary-icon">
+            <slot name="expand-icon">
+              <cw-icon library="system" name=${isRtl ? "chevron-left" : "chevron-right"}></cw-icon>
+            </slot>
+            <slot name="collapse-icon">
+              <cw-icon library="system" name=${isRtl ? "chevron-left" : "chevron-right"}></cw-icon>
+            </slot>
+          </span>
+        </summary>
+
+        <div class="details__body" role="region" aria-labelledby="header">
+          <slot part="content" id="content" class="details__content"></slot>
+        </div>
+      </details>
+    `;
+  }
+};
+CwDetails.styles = [component_styles_default, details_styles_default];
+CwDetails.dependencies = {
+  "cw-icon": CwIcon
+};
+__decorateClass([
+  e2(".details")
+], CwDetails.prototype, "details", 2);
+__decorateClass([
+  e2(".details__header")
+], CwDetails.prototype, "header", 2);
+__decorateClass([
+  e2(".details__body")
+], CwDetails.prototype, "body", 2);
+__decorateClass([
+  e2(".details__expand-icon-slot")
+], CwDetails.prototype, "expandIconSlot", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwDetails.prototype, "open", 2);
+__decorateClass([
+  n()
+], CwDetails.prototype, "summary", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwDetails.prototype, "disabled", 2);
+__decorateClass([
+  watch("open", { waitUntilFirstUpdate: true })
+], CwDetails.prototype, "handleOpenChange", 1);
+setDefaultAnimation("details.show", {
+  keyframes: [
+    { height: "0", opacity: "0" },
+    { height: "auto", opacity: "1" }
+  ],
+  options: { duration: 250, easing: "linear" }
+});
+setDefaultAnimation("details.hide", {
+  keyframes: [
+    { height: "auto", opacity: "1" },
+    { height: "0", opacity: "0" }
+  ],
+  options: { duration: 250, easing: "linear" }
+});
+
+export {
+  CwDetails
+};

package/cdn/chunks/chunk.47OFWWTT.js

@@ -0,0 +1,11 @@
+import {
+  CwRelativeTime
+} from "./chunk.X5BPACYZ.js";
+
+// src/components/relative-time/relative-time.ts
+var relative_time_default = CwRelativeTime;
+CwRelativeTime.define("cw-relative-time");
+
+export {
+  relative_time_default
+};

package/cdn/chunks/chunk.4AMCNG6Y.js

@@ -0,0 +1,11 @@
+import {
+  CwMenu
+} from "./chunk.7KFMKPDD.js";
+
+// src/components/menu/menu.ts
+var menu_default = CwMenu;
+CwMenu.define("cw-menu");
+
+export {
+  menu_default
+};

package/cdn/chunks/chunk.4ASJVQBW.js

@@ -0,0 +1,77 @@
+import {
+  include_styles_default
+} from "./chunk.4D2OGC2H.js";
+import {
+  requestInclude
+} from "./chunk.XNEONNEJ.js";
+import {
+  watch
+} from "./chunk.RB5L7E7Z.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  n
+} from "./chunk.VW6RGEPL.js";
+import {
+  b
+} from "./chunk.6A2LG33L.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/include/include.component.ts
+var CwInclude = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.mode = "cors";
+    this.allowScripts = false;
+  }
+  executeScript(script) {
+    const newScript = document.createElement("script");
+    [...script.attributes].forEach((attr) => newScript.setAttribute(attr.name, attr.value));
+    newScript.textContent = script.textContent;
+    script.parentNode.replaceChild(newScript, script);
+  }
+  async handleSrcChange() {
+    try {
+      const src = this.src;
+      const file = await requestInclude(src, this.mode);
+      if (src !== this.src) {
+        return;
+      }
+      if (!file.ok) {
+        this.emit("cw-error", { detail: { status: file.status } });
+        return;
+      }
+      this.innerHTML = file.html;
+      if (this.allowScripts) {
+        [...this.querySelectorAll("script")].forEach((script) => this.executeScript(script));
+      }
+      this.emit("cw-load");
+    } catch (e) {
+      this.emit("cw-error", { detail: { status: -1 } });
+    }
+  }
+  render() {
+    return b`<slot></slot>`;
+  }
+};
+CwInclude.styles = [component_styles_default, include_styles_default];
+__decorateClass([
+  n()
+], CwInclude.prototype, "src", 2);
+__decorateClass([
+  n()
+], CwInclude.prototype, "mode", 2);
+__decorateClass([
+  n({ attribute: "allow-scripts", type: Boolean })
+], CwInclude.prototype, "allowScripts", 2);
+__decorateClass([
+  watch("src")
+], CwInclude.prototype, "handleSrcChange", 1);
+
+export {
+  CwInclude
+};

package/cdn/chunks/chunk.4C44IR3E.js

@@ -0,0 +1,21 @@
+import {
+  CwLogo
+} from "./chunk.36NSQ7OQ.js";
+
+// src/react/logo/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "cw-logo";
+CwLogo.define("cw-logo");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: CwLogo,
+  react: React,
+  events: {},
+  displayName: "CwLogo"
+});
+var logo_default = reactWrapper;
+
+export {
+  logo_default
+};