@cordwainer/cw-elements 1.1.0-alpha.1 → 1.1.0-alpha.4

package/dist/chunks/chunk.SGYYGJ74.js

@@ -0,0 +1,24 @@
+import {
+  CwPagination
+} from "./chunk.WKMWHEBG.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/dist/chunks/{chunk.AUK3FUDQ.js → chunk.SHWH5KAH.js}

@@ -12,7 +12,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.QHO2UAQT.js → chunk.SIO7T2Y6.js}

@@ -1,6 +1,6 @@
 import {
   CwProgressBar
-} from "./chunk.FFOZ5QYG.js";
+} from "./chunk.YAHB5UDG.js";
 
 // src/react/progress-bar/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.R73XOGFN.js → chunk.SNQNN2V2.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 
 // src/components/visually-hidden/visually-hidden.component.ts
 import { html } from "lit";

package/dist/chunks/{chunk.YFCIPDEQ.js → chunk.SOXQ64QU.js}

@@ -1,6 +1,6 @@
 import {
   CwCarousel
-} from "./chunk.GDTFI5GT.js";
+} from "./chunk.3BTFJOLL.js";
 
 // src/components/carousel/carousel.ts
 var carousel_default = CwCarousel;

package/{cdn/chunks/chunk.3ZFAS3AL.js → dist/chunks/chunk.SP43KMOX.js}

@@ -1,6 +1,6 @@
 import {
   CwTree
-} from "./chunk.MA7BRXRJ.js";
+} from "./chunk.GRWRE5EI.js";
 
 // src/react/tree/index.ts
 import * as React from "react";

package/{cdn/chunks/chunk.QEEST3EB.js → dist/chunks/chunk.SPMTWSQB.js}

@@ -1,6 +1,6 @@
 import {
   CwCopyButton
-} from "./chunk.XRJQMOKI.js";
+} from "./chunk.QMKKVLNQ.js";
 
 // src/react/copy-button/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.INTNI2AM.js → chunk.STF7IMR5.js}

@@ -1,6 +1,6 @@
 import {
   CwPopup
-} from "./chunk.UQJ6QVAZ.js";
+} from "./chunk.QQK2SIME.js";
 
 // src/react/popup/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.KT4VDHOS.js → chunk.STMGOWCS.js}

@@ -1,6 +1,6 @@
 import {
   CwFormatBytes
-} from "./chunk.E6532JK6.js";
+} from "./chunk.RSFT3XPR.js";
 
 // src/react/format-bytes/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.QXFO3QWK.js → chunk.T7DZOP3H.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.QGH7J6CH.js → chunk.TBMCGVRM.js}

@@ -1,6 +1,6 @@
 import {
   CwCopyButton
-} from "./chunk.XSSQNTMJ.js";
+} from "./chunk.QMKKVLNQ.js";
 
 // src/components/copy-button/copy-button.ts
 var copy_button_default = CwCopyButton;

package/dist/chunks/{chunk.WQHQN73Y.js → chunk.THHLYN5R.js}

@@ -1,6 +1,6 @@
 import {
   CwTree
-} from "./chunk.MDNPNMFX.js";
+} from "./chunk.GRWRE5EI.js";
 
 // src/components/tree/tree.ts
 var tree_default = CwTree;

package/{cdn/chunks/chunk.G3JTEGO6.js → dist/chunks/chunk.UL6LUHU6.js}

@@ -1,6 +1,6 @@
 import {
   CwCard
-} from "./chunk.G4F5AGXC.js";
+} from "./chunk.3W3N7S5T.js";
 
 // src/react/card/index.ts
 import * as React from "react";

package/{cdn/chunks/chunk.ZRUOMTCM.js → dist/chunks/chunk.UMMSW5RY.js}

@@ -1,6 +1,6 @@
 import {
   CwBadge
-} from "./chunk.64DQ5UHZ.js";
+} from "./chunk.NFTRHP3Z.js";
 
 // src/react/badge/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.J7MTCPEZ.js → chunk.UQYF4O5Y.js}

@@ -1,9 +1,9 @@
 import {
   LocalizeController
-} from "./chunk.IDPNXIPQ.js";
+} from "./chunk.2H4HZOD6.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.WF35TQ3B.js → chunk.UUGM4MYC.js}

@@ -1,6 +1,6 @@
 import {
   CwRadioGroup
-} from "./chunk.IEYNC5ZO.js";
+} from "./chunk.AVS3R3CD.js";
 
 // src/components/radio-group/radio-group.ts
 var radio_group_default = CwRadioGroup;

package/dist/chunks/{chunk.V53K453G.js → chunk.UUWJ5Y7W.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 
 // src/components/carousel-item/carousel-item.component.ts
 import { html } from "lit";

package/dist/chunks/{chunk.XLC63U4A.js → chunk.UUZSIOWQ.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.QDSZIVEL.js";
 import {
   CwIcon
-} from "./chunk.W2VPO4VE.js";
+} from "./chunk.ZOBVW4QZ.js";
 import {
   watch
 } from "./chunk.GQZ7EGMM.js";
@@ -12,7 +12,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.F4CQKCWM.js → chunk.UVMJKTNQ.js}

@@ -3,16 +3,16 @@ import {
 } from "./chunk.P4NYDBZP.js";
 import {
   LocalizeController
-} from "./chunk.IDPNXIPQ.js";
+} from "./chunk.2H4HZOD6.js";
 import {
   CwIcon
-} from "./chunk.W2VPO4VE.js";
+} from "./chunk.ZOBVW4QZ.js";
 import {
   component_styles_default
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.QIRVGE6Z.js → chunk.VEBNFGT3.js}

@@ -1,6 +1,6 @@
 import {
   CwIcon
-} from "./chunk.W2VPO4VE.js";
+} from "./chunk.ZOBVW4QZ.js";
 
 // src/react/icon/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.L6QTSP3C.js → chunk.VP2NZUD4.js}

@@ -15,10 +15,10 @@ import {
 } from "./chunk.TJQYJP53.js";
 import {
   LocalizeController
-} from "./chunk.IDPNXIPQ.js";
+} from "./chunk.2H4HZOD6.js";
 import {
   CwIcon
-} from "./chunk.W2VPO4VE.js";
+} from "./chunk.ZOBVW4QZ.js";
 import {
   watch
 } from "./chunk.GQZ7EGMM.js";
@@ -27,7 +27,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.X5NZMCF5.js → chunk.VQUQUJBX.js}

@@ -1,6 +1,6 @@
 import {
   CwDropdown
-} from "./chunk.RRA5SLN5.js";
+} from "./chunk.BRV45ASX.js";
 
 // src/components/dropdown/dropdown.ts
 var dropdown_default = CwDropdown;

package/dist/chunks/{chunk.HGYRJZEQ.js → chunk.W44BM5EI.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.SPZTN6LU.js → chunk.WFKW3NFP.js}

@@ -1,6 +1,6 @@
 import {
   CwCombobox
-} from "./chunk.SXSVZZB4.js";
+} from "./chunk.RGTANIXL.js";
 
 // src/components/combobox/combobox.ts
 var combobox_default = CwCombobox;

package/dist/chunks/{chunk.PJOUZH3H.js → chunk.WFUDAXS3.js}

@@ -1,6 +1,6 @@
 import {
   CwVisuallyHidden
-} from "./chunk.R73XOGFN.js";
+} from "./chunk.SNQNN2V2.js";
 
 // src/components/visually-hidden/visually-hidden.ts
 var visually_hidden_default = CwVisuallyHidden;

package/dist/chunks/{chunk.7433LIYL.js → chunk.WJZI3MMC.js}

@@ -1,6 +1,6 @@
 import {
   CwFormatBytes
-} from "./chunk.E6532JK6.js";
+} from "./chunk.RSFT3XPR.js";
 
 // src/components/format-bytes/format-bytes.ts
 var format_bytes_default = CwFormatBytes;

package/dist/chunks/chunk.WKMWHEBG.js

@@ -0,0 +1,170 @@
+import {
+  pagination_styles_default
+} from "./chunk.GB5ZNIFK.js";
+import {
+  CwIconButton
+} from "./chunk.OVQBZ4VN.js";
+import {
+  LocalizeController
+} from "./chunk.2H4HZOD6.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  CwElement
+} from "./chunk.EFVXMX3N.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/pagination/pagination.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var range = (start, end) => Array.from({ length: end - start + 1 }, (_, i) => start + i);
+function getPageList(page, totalPages, siblingCount, boundaryCount) {
+  const startPages = range(1, Math.min(boundaryCount, totalPages));
+  const endPages = range(Math.max(totalPages - boundaryCount + 1, boundaryCount + 1), totalPages);
+  const siblingsStart = Math.max(
+    Math.min(page - siblingCount, totalPages - boundaryCount - siblingCount * 2 - 1),
+    boundaryCount + 2
+  );
+  const siblingsEnd = Math.min(
+    Math.max(page + siblingCount, boundaryCount + siblingCount * 2 + 2),
+    endPages.length > 0 ? endPages[0] - 2 : totalPages - 1
+  );
+  return [
+    ...startPages,
+    ...siblingsStart > boundaryCount + 2 ? ["ellipsis"] : boundaryCount + 1 < totalPages - boundaryCount ? [boundaryCount + 1] : [],
+    ...range(siblingsStart, siblingsEnd),
+    ...siblingsEnd < totalPages - boundaryCount - 1 ? ["ellipsis"] : totalPages - boundaryCount > boundaryCount ? [totalPages - boundaryCount] : [],
+    ...endPages
+  ];
+}
+var CwPagination = class extends CwElement {
+  constructor() {
+    super(...arguments);
+    this.localize = new LocalizeController(this);
+    this.totalItems = 0;
+    this.pageSize = 10;
+    this.page = 1;
+    this.siblingCount = 1;
+    this.boundaryCount = 1;
+    this.size = "medium";
+    this.disabled = false;
+  }
+  /** The total number of pages, derived from `total-items` and `page-size`. */
+  get totalPages() {
+    return Math.max(1, Math.ceil(this.totalItems / this.pageSize));
+  }
+  setPage(page) {
+    const newPage = Math.min(Math.max(page, 1), this.totalPages);
+    if (this.disabled || newPage === this.page) {
+      return;
+    }
+    this.page = newPage;
+    this.emit("cw-change");
+  }
+  handlePreviousClick() {
+    this.setPage(this.page - 1);
+  }
+  handleNextClick() {
+    this.setPage(this.page + 1);
+  }
+  handlePageClick(page) {
+    this.setPage(page);
+  }
+  render() {
+    const totalPages = this.totalPages;
+    const currentPage = Math.min(Math.max(this.page, 1), totalPages);
+    const items = getPageList(currentPage, totalPages, Math.max(this.siblingCount, 0), Math.max(this.boundaryCount, 0));
+    return html`
+      <nav
+        part="base"
+        class=${classMap({
+      pagination: true,
+      "pagination--small": this.size === "small",
+      "pagination--medium": this.size === "medium",
+      "pagination--large": this.size === "large",
+      "pagination--disabled": this.disabled
+    })}
+        aria-label=${this.localize.term("pagination")}
+      >
+        <cw-icon-button
+          part="previous-button"
+          exportparts="base:previous-button__base"
+          class="pagination__previous"
+          name="chevron-left"
+          library="system"
+          label=${this.localize.term("previousPage")}
+          ?disabled=${this.disabled || currentPage <= 1}
+          @click=${this.handlePreviousClick}
+        ></cw-icon-button>
+
+        <ul part="pages" class="pagination__pages">
+          ${items.map(
+      (item) => item === "ellipsis" ? html`
+                  <li class="pagination__item" aria-hidden="true">
+                    <span part="ellipsis" class="pagination__ellipsis">&hellip;</span>
+                  </li>
+                ` : html`
+                  <li class="pagination__item">
+                    <button
+                      part=${item === currentPage ? "page page--active" : "page"}
+                      class=${classMap({
+        pagination__page: true,
+        "pagination__page--active": item === currentPage
+      })}
+                      aria-label=${this.localize.term("goToPage", item)}
+                      aria-current=${item === currentPage ? "page" : "false"}
+                      ?disabled=${this.disabled}
+                      @click=${() => this.handlePageClick(item)}
+                    >
+                      ${item}
+                    </button>
+                  </li>
+                `
+    )}
+        </ul>
+
+        <cw-icon-button
+          part="next-button"
+          exportparts="base:next-button__base"
+          class="pagination__next"
+          name="chevron-right"
+          library="system"
+          label=${this.localize.term("nextPage")}
+          ?disabled=${this.disabled || currentPage >= totalPages}
+          @click=${this.handleNextClick}
+        ></cw-icon-button>
+      </nav>
+    `;
+  }
+};
+CwPagination.styles = [component_styles_default, pagination_styles_default];
+CwPagination.dependencies = { "cw-icon-button": CwIconButton };
+__decorateClass([
+  property({ attribute: "total-items", type: Number })
+], CwPagination.prototype, "totalItems", 2);
+__decorateClass([
+  property({ attribute: "page-size", type: Number })
+], CwPagination.prototype, "pageSize", 2);
+__decorateClass([
+  property({ type: Number, reflect: true })
+], CwPagination.prototype, "page", 2);
+__decorateClass([
+  property({ attribute: "sibling-count", type: Number })
+], CwPagination.prototype, "siblingCount", 2);
+__decorateClass([
+  property({ attribute: "boundary-count", type: Number })
+], CwPagination.prototype, "boundaryCount", 2);
+__decorateClass([
+  property({ reflect: true })
+], CwPagination.prototype, "size", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], CwPagination.prototype, "disabled", 2);
+
+export {
+  CwPagination
+};

package/dist/chunks/{chunk.3XXDGLXD.js → chunk.WO2KZSF2.js}

@@ -1,6 +1,6 @@
 import {
   CwMenuItem
-} from "./chunk.DQHJ5K4Z.js";
+} from "./chunk.KMO7LZN3.js";
 
 // src/react/menu-item/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.HJPFAS7Y.js → chunk.WQIL65HV.js}

@@ -1,6 +1,6 @@
 import {
   CwTooltip
-} from "./chunk.U7K3BGXK.js";
+} from "./chunk.2B2OZ5MJ.js";
 
 // src/react/tooltip/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.NX5IE35B.js → chunk.X3TL2DKM.js}

@@ -1,6 +1,6 @@
 import {
   CwInclude
-} from "./chunk.Q4YNMCNT.js";
+} from "./chunk.YISCALXN.js";
 
 // src/react/include/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.QTH5KWYR.js → chunk.X7UEC6HW.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.SFYH2R4X.js → chunk.XI7HZVJN.js}

@@ -1,6 +1,6 @@
 import {
   CwRating
-} from "./chunk.NMGHEELN.js";
+} from "./chunk.7AKBGAL7.js";
 
 // src/react/rating/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.VMMAAE4P.js → chunk.XXLXWXLZ.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk.KK7GGNWV.js";
 import {
   CwTag
-} from "./chunk.GA7G5JW4.js";
+} from "./chunk.HQA7RR42.js";
 import {
   scrollIntoView
 } from "./chunk.PH2N3MLE.js";
 import {
   CwPopup
-} from "./chunk.UQJ6QVAZ.js";
+} from "./chunk.QQK2SIME.js";
 import {
   form_control_styles_default
 } from "./chunk.YBI2MSEM.js";
@@ -29,13 +29,13 @@ import {
 } from "./chunk.TJQYJP53.js";
 import {
   LocalizeController
-} from "./chunk.IDPNXIPQ.js";
+} from "./chunk.2H4HZOD6.js";
 import {
   HasSlotController
 } from "./chunk.BVGZUUCX.js";
 import {
   CwIcon
-} from "./chunk.W2VPO4VE.js";
+} from "./chunk.ZOBVW4QZ.js";
 import {
   watch
 } from "./chunk.GQZ7EGMM.js";
@@ -44,7 +44,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.U45TJLC6.js → chunk.Y2KWIFH3.js}

@@ -1,6 +1,6 @@
 import {
   CwColorPicker
-} from "./chunk.6IFYZB4Q.js";
+} from "./chunk.ZIDENU6R.js";
 
 // src/components/color-picker/color-picker.ts
 var color_picker_default = CwColorPicker;

package/dist/chunks/{chunk.SMSBTM6G.js → chunk.Y6WLZGKR.js}

@@ -1,6 +1,6 @@
 import {
   CwSpinner
-} from "./chunk.AZHMWS6L.js";
+} from "./chunk.MVK6NQQE.js";
 
 // src/components/spinner/spinner.ts
 var spinner_default = CwSpinner;

package/dist/chunks/{chunk.FFOZ5QYG.js → chunk.YAHB5UDG.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk.JNHEJWKJ.js";
 import {
   LocalizeController
-} from "./chunk.IDPNXIPQ.js";
+} from "./chunk.2H4HZOD6.js";
 import {
   component_styles_default
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.DESAXJQ5.js → chunk.YDWC7HQY.js}

@@ -1,6 +1,6 @@
 import {
   CwAnimation
-} from "./chunk.QAT3D7DX.js";
+} from "./chunk.R5LBYWPF.js";
 
 // src/components/animation/animation.ts
 var animation_default = CwAnimation;

package/dist/chunks/{chunk.AL65PY7V.js → chunk.YED3QE3C.js}

@@ -1,6 +1,6 @@
 import {
   CwSelect
-} from "./chunk.VMMAAE4P.js";
+} from "./chunk.XXLXWXLZ.js";
 
 // src/components/select/select.ts
 var select_default = CwSelect;

package/dist/chunks/{chunk.SJ24DYR2.js → chunk.YGY6MLAX.js}

@@ -1,6 +1,6 @@
 import {
   CwInput
-} from "./chunk.7SIWEJUF.js";
+} from "./chunk.O5WLECKX.js";
 
 // src/react/input/index.ts
 import * as React from "react";

package/dist/chunks/{chunk.JEUQMOE6.js → chunk.YHAXZVAW.js}

@@ -1,6 +1,6 @@
 import {
   CwMutationObserver
-} from "./chunk.P6WYIVRU.js";
+} from "./chunk.A3G2HX2N.js";
 
 // src/components/mutation-observer/mutation-observer.ts
 var mutation_observer_default = CwMutationObserver;

package/dist/chunks/{chunk.Q4YNMCNT.js → chunk.YISCALXN.js}

@@ -1,9 +1,9 @@
-import {
-  requestInclude
-} from "./chunk.XNEONNEJ.js";
 import {
   include_styles_default
 } from "./chunk.FY7IKLNL.js";
+import {
+  requestInclude
+} from "./chunk.XNEONNEJ.js";
 import {
   watch
 } from "./chunk.GQZ7EGMM.js";
@@ -12,7 +12,7 @@ import {
 } from "./chunk.TUVJKY7S.js";
 import {
   CwElement
-} from "./chunk.567JN6DK.js";
+} from "./chunk.EFVXMX3N.js";
 import {
   __decorateClass
 } from "./chunk.Q44EX5TP.js";

package/dist/chunks/{chunk.UR6NVETE.js → chunk.YKQNYFMU.js}

@@ -1,6 +1,6 @@
 import {
   CwTabGroup
-} from "./chunk.KBFG6YOY.js";
+} from "./chunk.JIEFUD4K.js";
 
 // src/components/tab-group/tab-group.ts
 var tab_group_default = CwTabGroup;