@cordwainer/cw-elements 1.3.0-beta.1 → 1.3.0

package/cdn/chunks/chunk.QQZ6ECQI.js

@@ -0,0 +1,11 @@
+import {
+  CwFooter
+} from "./chunk.TYP7WH4C.js";
+
+// src/components/footer/footer.ts
+var footer_default = CwFooter;
+CwFooter.define("cw-footer");
+
+export {
+  footer_default
+};

package/cdn/chunks/chunk.QS4237YC.js

@@ -0,0 +1,11 @@
+import {
+  CwButtonGroup
+} from "./chunk.Z3GS56QK.js";
+
+// src/components/button-group/button-group.ts
+var button_group_default = CwButtonGroup;
+CwButtonGroup.define("cw-button-group");
+
+export {
+  button_group_default
+};

package/cdn/chunks/chunk.R56T5IQU.js

@@ -0,0 +1,11 @@
+import {
+  CwIconButton
+} from "./chunk.L5XLV3B4.js";
+
+// src/components/icon-button/icon-button.ts
+var icon_button_default = CwIconButton;
+CwIconButton.define("cw-icon-button");
+
+export {
+  icon_button_default
+};

package/cdn/chunks/chunk.RAXGMCN5.js

@@ -0,0 +1,21 @@
+import {
+  CwSkeleton
+} from "./chunk.2Y7X4JJP.js";
+
+// src/react/skeleton/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "cw-skeleton";
+CwSkeleton.define("cw-skeleton");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: CwSkeleton,
+  react: React,
+  events: {},
+  displayName: "CwSkeleton"
+});
+var skeleton_default = reactWrapper;
+
+export {
+  skeleton_default
+};

package/cdn/chunks/chunk.RD3KLWPH.js

@@ -0,0 +1,21 @@
+import {
+  CwLogo
+} from "./chunk.MVNZWPX3.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
+};

package/cdn/chunks/chunk.RO2MLSDH.js

@@ -0,0 +1,285 @@
+import {
+  primary_navigation_item_styles_default
+} from "./chunk.BTEDTKBG.js";
+import {
+  CwDropdown
+} from "./chunk.DS7D7AEL.js";
+import {
+  getAnimation,
+  setDefaultAnimation
+} from "./chunk.JSLXCIMZ.js";
+import {
+  animateTo,
+  shimKeyframesHeightAuto,
+  stopAnimations
+} from "./chunk.3CTNMS55.js";
+import {
+  LocalizeController
+} from "./chunk.75ZQOYXC.js";
+import {
+  o
+} from "./chunk.LRAERZML.js";
+import {
+  e
+} from "./chunk.VBR4VS53.js";
+import {
+  CwIcon
+} from "./chunk.C2M7QWWQ.js";
+import {
+  watch
+} from "./chunk.RB5L7E7Z.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  e as e2,
+  n,
+  r
+} from "./chunk.FLNVNWJS.js";
+import {
+  A,
+  b
+} from "./chunk.6A2LG33L.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/primary-navigation-item/primary-navigation-item.component.ts
+var id = 0;
+var CwPrimaryNavigationItem = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.componentId = `cw-primary-navigation-item-${++id}`;
+    this.localize = new LocalizeController(this);
+    this.hasMenu = false;
+    this.open = false;
+    this.rel = "noreferrer noopener";
+    this.current = false;
+    this.mobile = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "listitem");
+  }
+  updated(changedProperties) {
+    super.updated(changedProperties);
+    if (this.panel && this.panel !== this.lastPanel) {
+      this.panel.hidden = !this.open;
+    }
+    this.lastPanel = this.panel;
+  }
+  // Queried by light-DOM `slot` attribute rather than the currently-rendered `<slot name="menu">` node's
+  // `assignedElements()` — which branch (and therefore which slot node) is active can change independently of
+  // this, so re-deriving from the host's actual children stays correct across a mobile/desktop switch.
+  syncMenuMobileState() {
+    [...this.children].forEach((el) => {
+      if (el.slot === "menu" && el.tagName.toLowerCase() === "cw-primary-navigation-menu") {
+        el.mobile = this.mobile;
+      }
+    });
+  }
+  handleMenuSlotChange() {
+    var _a;
+    this.hasMenu = Boolean((_a = this.menuSlot) == null ? void 0 : _a.assignedElements({ flatten: true }).length);
+    this.syncMenuMobileState();
+  }
+  handleDropdownShow() {
+    this.open = true;
+  }
+  handleDropdownHide() {
+    this.open = false;
+  }
+  handleTriggerClick() {
+    if (this.open) {
+      this.hide();
+    } else {
+      this.show();
+    }
+  }
+  handleMobileChange() {
+    var _a;
+    (_a = this.dropdown) == null ? void 0 : _a.hide();
+    this.open = false;
+    this.syncMenuMobileState();
+  }
+  async showInlineMenu() {
+    if (this.open) {
+      return void 0;
+    }
+    const cwShow = this.emit("cw-show", { cancelable: true });
+    if (cwShow.defaultPrevented) {
+      return void 0;
+    }
+    this.open = true;
+    await stopAnimations(this.panel);
+    this.panel.hidden = false;
+    const { keyframes, options } = getAnimation(this, "primary-navigation-item.show", { dir: this.localize.dir() });
+    await animateTo(this.panel, shimKeyframesHeightAuto(keyframes, this.panel.scrollHeight), options);
+    this.emit("cw-after-show");
+    return void 0;
+  }
+  async hideInlineMenu() {
+    if (!this.open) {
+      return void 0;
+    }
+    const cwHide = this.emit("cw-hide", { cancelable: true });
+    if (cwHide.defaultPrevented) {
+      return void 0;
+    }
+    await stopAnimations(this.panel);
+    const { keyframes, options } = getAnimation(this, "primary-navigation-item.hide", { dir: this.localize.dir() });
+    await animateTo(this.panel, shimKeyframesHeightAuto(keyframes, this.panel.scrollHeight), options);
+    this.panel.hidden = true;
+    this.open = false;
+    this.emit("cw-after-hide");
+    return void 0;
+  }
+  /** Opens the item's dropdown, if it has one. No-op for link/plain items. */
+  async show() {
+    var _a;
+    if (this.mobile) {
+      return this.showInlineMenu();
+    }
+    return (_a = this.dropdown) == null ? void 0 : _a.show();
+  }
+  /** Closes the item's dropdown, if it has one. No-op for link/plain items. */
+  async hide() {
+    var _a;
+    if (this.mobile) {
+      return this.hideInlineMenu();
+    }
+    return (_a = this.dropdown) == null ? void 0 : _a.hide();
+  }
+  render() {
+    const ariaCurrent = this.current ? "page" : A;
+    const menuSlot = b`<slot name="menu" @slotchange=${this.handleMenuSlotChange} hidden></slot>`;
+    let content;
+    if (this.href) {
+      content = b`
+        <a
+          part="link"
+          class="primary-navigation-item__link"
+          href=${this.href}
+          target=${o(this.target || void 0)}
+          rel=${o(this.rel || void 0)}
+          aria-current=${ariaCurrent}
+        >
+          <slot></slot>
+        </a>
+        ${menuSlot}
+      `;
+    } else if (this.hasMenu && this.mobile) {
+      content = b`
+        <button
+          part="trigger"
+          type="button"
+          id=${`${this.componentId}-trigger`}
+          class="primary-navigation-item__trigger"
+          aria-expanded=${this.open ? "true" : "false"}
+          aria-controls=${`${this.componentId}-panel`}
+          @click=${this.handleTriggerClick}
+        >
+          <slot></slot>
+          <cw-icon library="system" name="chevron-down"></cw-icon>
+        </button>
+
+        <div
+          part="panel"
+          id=${`${this.componentId}-panel`}
+          class="primary-navigation-item__panel"
+          role="region"
+          aria-labelledby=${`${this.componentId}-trigger`}
+        >
+          <slot name="menu" @slotchange=${this.handleMenuSlotChange}></slot>
+        </div>
+      `;
+    } else if (this.hasMenu) {
+      content = b`
+        <cw-dropdown
+          part="trigger"
+          placement="bottom-start"
+          @cw-show=${this.handleDropdownShow}
+          @cw-hide=${this.handleDropdownHide}
+        >
+          <button slot="trigger" type="button" class="primary-navigation-item__trigger">
+            <slot></slot>
+            <cw-icon library="system" name="chevron-down"></cw-icon>
+          </button>
+          <slot name="menu" @slotchange=${this.handleMenuSlotChange}></slot>
+        </cw-dropdown>
+      `;
+    } else {
+      content = b`
+        <span class="primary-navigation-item__label"><slot></slot></span>
+        ${menuSlot}
+      `;
+    }
+    return b`
+      <div
+        part="base"
+        class=${e({
+      "primary-navigation-item": true,
+      "primary-navigation-item--current": this.current,
+      "primary-navigation-item--open": this.open,
+      "primary-navigation-item--mobile": this.mobile
+    })}
+      >
+        ${content}
+      </div>
+    `;
+  }
+};
+CwPrimaryNavigationItem.styles = [component_styles_default, primary_navigation_item_styles_default];
+CwPrimaryNavigationItem.dependencies = { "cw-dropdown": CwDropdown, "cw-icon": CwIcon };
+__decorateClass([
+  e2("cw-dropdown")
+], CwPrimaryNavigationItem.prototype, "dropdown", 2);
+__decorateClass([
+  e2('slot[name="menu"]')
+], CwPrimaryNavigationItem.prototype, "menuSlot", 2);
+__decorateClass([
+  e2(".primary-navigation-item__panel")
+], CwPrimaryNavigationItem.prototype, "panel", 2);
+__decorateClass([
+  r()
+], CwPrimaryNavigationItem.prototype, "hasMenu", 2);
+__decorateClass([
+  r()
+], CwPrimaryNavigationItem.prototype, "open", 2);
+__decorateClass([
+  n()
+], CwPrimaryNavigationItem.prototype, "href", 2);
+__decorateClass([
+  n()
+], CwPrimaryNavigationItem.prototype, "target", 2);
+__decorateClass([
+  n()
+], CwPrimaryNavigationItem.prototype, "rel", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwPrimaryNavigationItem.prototype, "current", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwPrimaryNavigationItem.prototype, "mobile", 2);
+__decorateClass([
+  watch("mobile", { waitUntilFirstUpdate: true })
+], CwPrimaryNavigationItem.prototype, "handleMobileChange", 1);
+setDefaultAnimation("primary-navigation-item.show", {
+  keyframes: [
+    { height: "0", opacity: "0" },
+    { height: "auto", opacity: "1" }
+  ],
+  options: { duration: 200, easing: "ease" }
+});
+setDefaultAnimation("primary-navigation-item.hide", {
+  keyframes: [
+    { height: "auto", opacity: "1" },
+    { height: "0", opacity: "0" }
+  ],
+  options: { duration: 200, easing: "ease" }
+});
+
+export {
+  CwPrimaryNavigationItem
+};

package/cdn/chunks/chunk.RPG7WVUV.js

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

package/cdn/chunks/chunk.RS4OWTJ5.js

@@ -0,0 +1,45 @@
+import {
+  primary_navigation_menu_styles_default
+} from "./chunk.PGPONQV7.js";
+import {
+  e
+} from "./chunk.VBR4VS53.js";
+import {
+  component_styles_default
+} from "./chunk.NJIHXHXI.js";
+import {
+  CwElement,
+  n
+} from "./chunk.FLNVNWJS.js";
+import {
+  b
+} from "./chunk.6A2LG33L.js";
+import {
+  __decorateClass
+} from "./chunk.QIOX6AG5.js";
+
+// src/components/primary-navigation-menu/primary-navigation-menu.component.ts
+var CwPrimaryNavigationMenu = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.mobile = false;
+  }
+  render() {
+    return b`
+      <div
+        part="base"
+        class=${e({ "primary-navigation-menu": true, "primary-navigation-menu--mobile": this.mobile })}
+      >
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+CwPrimaryNavigationMenu.styles = [component_styles_default, primary_navigation_menu_styles_default];
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], CwPrimaryNavigationMenu.prototype, "mobile", 2);
+
+export {
+  CwPrimaryNavigationMenu
+};

package/cdn/chunks/chunk.RWHV7O4S.js

@@ -0,0 +1,11 @@
+import {
+  CwResizeObserver
+} from "./chunk.5BDJ6YC2.js";
+
+// src/components/resize-observer/resize-observer.ts
+var resize_observer_default = CwResizeObserver;
+CwResizeObserver.define("cw-resize-observer");
+
+export {
+  resize_observer_default
+};

package/cdn/chunks/chunk.RWKZUNZA.js

@@ -0,0 +1,24 @@
+import {
+  CwPagination
+} from "./chunk.JEIYXY4Y.js";
+
+// src/react/pagination/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "cw-pagination";
+CwPagination.define("cw-pagination");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: CwPagination,
+  react: React,
+  events: {
+    onCwChange: "cw-change"
+  },
+  displayName: "CwPagination"
+});
+var pagination_default = reactWrapper;
+
+export {
+  pagination_default
+};

package/cdn/chunks/chunk.RXLYNMRL.js

@@ -0,0 +1,24 @@
+import {
+  CwSplitPanel
+} from "./chunk.M7WRXDRS.js";
+
+// src/react/split-panel/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "cw-split-panel";
+CwSplitPanel.define("cw-split-panel");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: CwSplitPanel,
+  react: React,
+  events: {
+    onCwReposition: "cw-reposition"
+  },
+  displayName: "CwSplitPanel"
+});
+var split_panel_default = reactWrapper;
+
+export {
+  split_panel_default
+};

package/cdn/chunks/chunk.RXQ57RZO.js

@@ -0,0 +1,11 @@
+import {
+  CwCombobox
+} from "./chunk.LB4RCMXI.js";
+
+// src/components/combobox/combobox.ts
+var combobox_default = CwCombobox;
+CwCombobox.define("cw-combobox");
+
+export {
+  combobox_default
+};