@cordwainer/cw-elements 1.2.2 → 1.3.0-alpha.0

package/cdn/chunks/chunk.BRWH3DPD.js

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

package/cdn/chunks/chunk.BRZJKF5N.js

@@ -1,26 +0,0 @@
-import {
-  CwAnimation
-} from "./chunk.FJ5OLSSX.js";
-
-// src/react/animation/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cw-animation";
-CwAnimation.define("cw-animation");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CwAnimation,
-  react: React,
-  events: {
-    onCwCancel: "cw-cancel",
-    onCwFinish: "cw-finish",
-    onCwStart: "cw-start"
-  },
-  displayName: "CwAnimation"
-});
-var animation_default = reactWrapper;
-
-export {
-  animation_default
-};

package/cdn/chunks/chunk.BYFOH5PZ.js

@@ -1,346 +0,0 @@
-import {
-  range_styles_default
-} from "./chunk.K6S2YE3Q.js";
-import {
-  defaultValue,
-  l
-} from "./chunk.747MVI2Y.js";
-import {
-  form_control_styles_default
-} from "./chunk.DJVND463.js";
-import {
-  FormControlController
-} from "./chunk.FIVNGT4O.js";
-import {
-  LocalizeController
-} from "./chunk.3ITR3YMH.js";
-import {
-  o
-} from "./chunk.LRAERZML.js";
-import {
-  HasSlotController
-} from "./chunk.BVGZUUCX.js";
-import {
-  e
-} from "./chunk.VBR4VS53.js";
-import {
-  watch
-} from "./chunk.RB5L7E7Z.js";
-import {
-  component_styles_default
-} from "./chunk.NJIHXHXI.js";
-import {
-  CwElement,
-  e as e2,
-  n,
-  r,
-  t
-} from "./chunk.FS65H6I7.js";
-import {
-  b
-} from "./chunk.6A2LG33L.js";
-import {
-  __decorateClass
-} from "./chunk.QIOX6AG5.js";
-
-// src/components/range/range.component.ts
-var CwRange = class extends CwElement {
-  constructor() {
-    super(...arguments);
-    this.formControlController = new FormControlController(this);
-    this.hasSlotController = new HasSlotController(this, "help-text", "label");
-    this.localize = new LocalizeController(this);
-    this.hasFocus = false;
-    this.hasTooltip = false;
-    this.title = "";
-    this.name = "";
-    this.value = 0;
-    this.label = "";
-    this.helpText = "";
-    this.disabled = false;
-    this.min = 0;
-    this.max = 100;
-    this.step = 1;
-    this.tooltip = "top";
-    this.tooltipFormatter = (value) => value.toString();
-    this.form = "";
-    this.defaultValue = 0;
-  }
-  /** Gets the validity state object */
-  get validity() {
-    return this.input.validity;
-  }
-  /** Gets the validation message */
-  get validationMessage() {
-    return this.input.validationMessage;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.resizeObserver = new ResizeObserver(() => this.syncRange());
-    if (this.value < this.min) {
-      this.value = this.min;
-    }
-    if (this.value > this.max) {
-      this.value = this.max;
-    }
-    this.updateComplete.then(() => {
-      this.syncRange();
-      this.resizeObserver.observe(this.input);
-    });
-  }
-  disconnectedCallback() {
-    var _a;
-    super.disconnectedCallback();
-    (_a = this.resizeObserver) == null ? void 0 : _a.unobserve(this.input);
-  }
-  handleChange() {
-    this.emit("cw-change");
-  }
-  handleInput() {
-    this.value = parseFloat(this.input.value);
-    this.emit("cw-input");
-    this.syncRange();
-  }
-  handleBlur() {
-    this.hasFocus = false;
-    this.hasTooltip = false;
-    this.emit("cw-blur");
-  }
-  handleFocus() {
-    this.hasFocus = true;
-    this.hasTooltip = true;
-    this.emit("cw-focus");
-  }
-  handleThumbDragStart() {
-    this.hasTooltip = true;
-  }
-  handleThumbDragEnd() {
-    this.hasTooltip = false;
-  }
-  syncProgress(percent) {
-    this.input.style.setProperty("--percent", `${percent * 100}%`);
-  }
-  syncTooltip(percent) {
-    if (this.output !== null) {
-      const inputWidth = this.input.offsetWidth;
-      const tooltipWidth = this.output.offsetWidth;
-      const thumbSize = getComputedStyle(this.input).getPropertyValue("--thumb-size");
-      const isRtl = this.localize.dir() === "rtl";
-      const percentAsWidth = inputWidth * percent;
-      if (isRtl) {
-        const x = `${inputWidth - percentAsWidth}px + ${percent} * ${thumbSize}`;
-        this.output.style.translate = `calc((${x} - ${tooltipWidth / 2}px - ${thumbSize} / 2))`;
-      } else {
-        const x = `${percentAsWidth}px - ${percent} * ${thumbSize}`;
-        this.output.style.translate = `calc(${x} - ${tooltipWidth / 2}px + ${thumbSize} / 2)`;
-      }
-    }
-  }
-  handleValueChange() {
-    this.formControlController.updateValidity();
-    this.input.value = this.value.toString();
-    this.value = parseFloat(this.input.value);
-    this.syncRange();
-  }
-  handleDisabledChange() {
-    this.formControlController.setValidity(this.disabled);
-  }
-  syncRange() {
-    const percent = Math.max(0, (this.value - this.min) / (this.max - this.min));
-    this.syncProgress(percent);
-    if (this.tooltip !== "none" && this.hasTooltip) {
-      this.updateComplete.then(() => this.syncTooltip(percent));
-    }
-  }
-  handleInvalid(event) {
-    this.formControlController.setValidity(false);
-    this.formControlController.emitInvalidEvent(event);
-  }
-  /** Sets focus on the range. */
-  focus(options) {
-    this.input.focus(options);
-  }
-  /** Removes focus from the range. */
-  blur() {
-    this.input.blur();
-  }
-  /** Increments the value of the range by the value of the step attribute. */
-  stepUp() {
-    this.input.stepUp();
-    if (this.value !== Number(this.input.value)) {
-      this.value = Number(this.input.value);
-    }
-  }
-  /** Decrements the value of the range by the value of the step attribute. */
-  stepDown() {
-    this.input.stepDown();
-    if (this.value !== Number(this.input.value)) {
-      this.value = Number(this.input.value);
-    }
-  }
-  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
-  checkValidity() {
-    return this.input.checkValidity();
-  }
-  /** Gets the associated form, if one exists. */
-  getForm() {
-    return this.formControlController.getForm();
-  }
-  /** Checks for validity and shows the browser's validation message if the control is invalid. */
-  reportValidity() {
-    return this.input.reportValidity();
-  }
-  /** Sets a custom validation message. Pass an empty string to restore validity. */
-  setCustomValidity(message) {
-    this.input.setCustomValidity(message);
-    this.formControlController.updateValidity();
-  }
-  render() {
-    const hasLabelSlot = this.hasSlotController.test("label");
-    const hasHelpTextSlot = this.hasSlotController.test("help-text");
-    const hasLabel = this.label ? true : !!hasLabelSlot;
-    const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;
-    return b`
-      <div
-        part="form-control"
-        class=${e({
-      "form-control": true,
-      "form-control--medium": true,
-      // range only has one size
-      "form-control--has-label": hasLabel,
-      "form-control--has-help-text": hasHelpText
-    })}
-      >
-        <label
-          part="form-control-label"
-          class="form-control__label"
-          for="input"
-          aria-hidden=${hasLabel ? "false" : "true"}
-        >
-          <slot name="label">${this.label}</slot>
-        </label>
-
-        <div part="form-control-input" class="form-control-input">
-          <div
-            part="base"
-            class=${e({
-      range: true,
-      "range--disabled": this.disabled,
-      "range--focused": this.hasFocus,
-      "range--rtl": this.localize.dir() === "rtl",
-      "range--tooltip-visible": this.hasTooltip,
-      "range--tooltip-top": this.tooltip === "top",
-      "range--tooltip-bottom": this.tooltip === "bottom"
-    })}
-            @mousedown=${this.handleThumbDragStart}
-            @mouseup=${this.handleThumbDragEnd}
-            @touchstart=${this.handleThumbDragStart}
-            @touchend=${this.handleThumbDragEnd}
-          >
-            <input
-              part="input"
-              id="input"
-              class="range__control"
-              title=${this.title}
-              type="range"
-              name=${o(this.name)}
-              ?disabled=${this.disabled}
-              min=${o(this.min)}
-              max=${o(this.max)}
-              step=${o(this.step)}
-              .value=${l(this.value.toString())}
-              aria-describedby="help-text"
-              @change=${this.handleChange}
-              @focus=${this.handleFocus}
-              @input=${this.handleInput}
-              @invalid=${this.handleInvalid}
-              @blur=${this.handleBlur}
-            />
-            ${this.tooltip !== "none" && !this.disabled ? b`
-                    <output part="tooltip" class="range__tooltip">
-                      ${typeof this.tooltipFormatter === "function" ? this.tooltipFormatter(this.value) : this.value}
-                    </output>
-                  ` : ""}
-          </div>
-        </div>
-
-        <div
-          part="form-control-help-text"
-          id="help-text"
-          class="form-control__help-text"
-          aria-hidden=${hasHelpText ? "false" : "true"}
-        >
-          <slot name="help-text">${this.helpText}</slot>
-        </div>
-      </div>
-    `;
-  }
-};
-CwRange.styles = [component_styles_default, form_control_styles_default, range_styles_default];
-__decorateClass([
-  e2(".range__control")
-], CwRange.prototype, "input", 2);
-__decorateClass([
-  e2(".range__tooltip")
-], CwRange.prototype, "output", 2);
-__decorateClass([
-  r()
-], CwRange.prototype, "hasFocus", 2);
-__decorateClass([
-  r()
-], CwRange.prototype, "hasTooltip", 2);
-__decorateClass([
-  n()
-], CwRange.prototype, "title", 2);
-__decorateClass([
-  n()
-], CwRange.prototype, "name", 2);
-__decorateClass([
-  n({ type: Number })
-], CwRange.prototype, "value", 2);
-__decorateClass([
-  n()
-], CwRange.prototype, "label", 2);
-__decorateClass([
-  n({ attribute: "help-text" })
-], CwRange.prototype, "helpText", 2);
-__decorateClass([
-  n({ type: Boolean, reflect: true })
-], CwRange.prototype, "disabled", 2);
-__decorateClass([
-  n({ type: Number })
-], CwRange.prototype, "min", 2);
-__decorateClass([
-  n({ type: Number })
-], CwRange.prototype, "max", 2);
-__decorateClass([
-  n({ type: Number })
-], CwRange.prototype, "step", 2);
-__decorateClass([
-  n()
-], CwRange.prototype, "tooltip", 2);
-__decorateClass([
-  n({ attribute: false })
-], CwRange.prototype, "tooltipFormatter", 2);
-__decorateClass([
-  n({ reflect: true })
-], CwRange.prototype, "form", 2);
-__decorateClass([
-  defaultValue()
-], CwRange.prototype, "defaultValue", 2);
-__decorateClass([
-  t({ passive: true })
-], CwRange.prototype, "handleThumbDragStart", 1);
-__decorateClass([
-  watch("value", { waitUntilFirstUpdate: true })
-], CwRange.prototype, "handleValueChange", 1);
-__decorateClass([
-  watch("disabled", { waitUntilFirstUpdate: true })
-], CwRange.prototype, "handleDisabledChange", 1);
-__decorateClass([
-  watch("hasTooltip", { waitUntilFirstUpdate: true })
-], CwRange.prototype, "syncRange", 1);
-
-export {
-  CwRange
-};

package/cdn/chunks/chunk.C3ZA6VYO.js

@@ -1,73 +0,0 @@
-import {
-  LocalizeController
-} from "./chunk.3ITR3YMH.js";
-import {
-  CwElement,
-  n
-} from "./chunk.FS65H6I7.js";
-import {
-  __decorateClass
-} from "./chunk.QIOX6AG5.js";
-
-// src/components/format-number/format-number.component.ts
-var CwFormatNumber = class extends CwElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.value = 0;
-    this.type = "decimal";
-    this.noGrouping = false;
-    this.currency = "USD";
-    this.currencyDisplay = "symbol";
-  }
-  render() {
-    if (isNaN(this.value)) {
-      return "";
-    }
-    return this.localize.number(this.value, {
-      style: this.type,
-      currency: this.currency,
-      currencyDisplay: this.currencyDisplay,
-      useGrouping: !this.noGrouping,
-      minimumIntegerDigits: this.minimumIntegerDigits,
-      minimumFractionDigits: this.minimumFractionDigits,
-      maximumFractionDigits: this.maximumFractionDigits,
-      minimumSignificantDigits: this.minimumSignificantDigits,
-      maximumSignificantDigits: this.maximumSignificantDigits
-    });
-  }
-};
-__decorateClass([
-  n({ type: Number })
-], CwFormatNumber.prototype, "value", 2);
-__decorateClass([
-  n()
-], CwFormatNumber.prototype, "type", 2);
-__decorateClass([
-  n({ attribute: "no-grouping", type: Boolean })
-], CwFormatNumber.prototype, "noGrouping", 2);
-__decorateClass([
-  n()
-], CwFormatNumber.prototype, "currency", 2);
-__decorateClass([
-  n({ attribute: "currency-display" })
-], CwFormatNumber.prototype, "currencyDisplay", 2);
-__decorateClass([
-  n({ attribute: "minimum-integer-digits", type: Number })
-], CwFormatNumber.prototype, "minimumIntegerDigits", 2);
-__decorateClass([
-  n({ attribute: "minimum-fraction-digits", type: Number })
-], CwFormatNumber.prototype, "minimumFractionDigits", 2);
-__decorateClass([
-  n({ attribute: "maximum-fraction-digits", type: Number })
-], CwFormatNumber.prototype, "maximumFractionDigits", 2);
-__decorateClass([
-  n({ attribute: "minimum-significant-digits", type: Number })
-], CwFormatNumber.prototype, "minimumSignificantDigits", 2);
-__decorateClass([
-  n({ attribute: "maximum-significant-digits", type: Number })
-], CwFormatNumber.prototype, "maximumSignificantDigits", 2);
-
-export {
-  CwFormatNumber
-};

package/cdn/chunks/chunk.C4QY7KGQ.js

@@ -1,44 +0,0 @@
-import {
-  library_default_default
-} from "./chunk.CJFFVBAI.js";
-import {
-  library_system_default
-} from "./chunk.3TFKS637.js";
-
-// src/components/icon/library.ts
-var registry = [library_default_default, library_system_default];
-var watchedIcons = [];
-function watchIcon(icon) {
-  watchedIcons.push(icon);
-}
-function unwatchIcon(icon) {
-  watchedIcons = watchedIcons.filter((el) => el !== icon);
-}
-function getIconLibrary(name) {
-  return registry.find((lib) => lib.name === name);
-}
-function registerIconLibrary(name, options) {
-  unregisterIconLibrary(name);
-  registry.push({
-    name,
-    resolver: options.resolver,
-    mutator: options.mutator,
-    spriteSheet: options.spriteSheet
-  });
-  watchedIcons.forEach((icon) => {
-    if (icon.library === name) {
-      icon.setIcon();
-    }
-  });
-}
-function unregisterIconLibrary(name) {
-  registry = registry.filter((lib) => lib.name !== name);
-}
-
-export {
-  watchIcon,
-  unwatchIcon,
-  getIconLibrary,
-  registerIconLibrary,
-  unregisterIconLibrary
-};

package/cdn/chunks/chunk.CAT3P7YD.js

@@ -1,11 +0,0 @@
-import {
-  CwColorPicker
-} from "./chunk.EJDYLREA.js";
-
-// src/components/color-picker/color-picker.ts
-var color_picker_default = CwColorPicker;
-CwColorPicker.define("cw-color-picker");
-
-export {
-  color_picker_default
-};

package/cdn/chunks/chunk.CSO62GSM.js

@@ -1,21 +0,0 @@
-import {
-  CwFormatNumber
-} from "./chunk.C3ZA6VYO.js";
-
-// src/react/format-number/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "cw-format-number";
-CwFormatNumber.define("cw-format-number");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CwFormatNumber,
-  react: React,
-  events: {},
-  displayName: "CwFormatNumber"
-});
-var format_number_default = reactWrapper;
-
-export {
-  format_number_default
-};

package/cdn/chunks/chunk.CZ6UD3VE.js

@@ -1,11 +0,0 @@
-import {
-  CwDialog
-} from "./chunk.AKRU6EJJ.js";
-
-// src/components/dialog/dialog.ts
-var dialog_default = CwDialog;
-CwDialog.define("cw-dialog");
-
-export {
-  dialog_default
-};

package/cdn/chunks/chunk.D5J4Y4QP.js

@@ -1,21 +0,0 @@
-import {
-  CwCarouselItem
-} from "./chunk.NV3DRB7R.js";
-
-// src/react/carousel-item/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "cw-carousel-item";
-CwCarouselItem.define("cw-carousel-item");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CwCarouselItem,
-  react: React,
-  events: {},
-  displayName: "CwCarouselItem"
-});
-var carousel_item_default = reactWrapper;
-
-export {
-  carousel_item_default
-};

package/cdn/chunks/chunk.D7MCNNCT.js

@@ -1,21 +0,0 @@
-import {
-  CwProgressRing
-} from "./chunk.JRB7BES7.js";
-
-// src/react/progress-ring/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "cw-progress-ring";
-CwProgressRing.define("cw-progress-ring");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CwProgressRing,
-  react: React,
-  events: {},
-  displayName: "CwProgressRing"
-});
-var progress_ring_default = reactWrapper;
-
-export {
-  progress_ring_default
-};

package/cdn/chunks/chunk.DF3P7FLR.js

@@ -1,87 +0,0 @@
-import {
-  LocalizeController
-} from "./chunk.3ITR3YMH.js";
-import {
-  CwElement,
-  n
-} from "./chunk.FS65H6I7.js";
-import {
-  b
-} from "./chunk.6A2LG33L.js";
-import {
-  __decorateClass
-} from "./chunk.QIOX6AG5.js";
-
-// src/components/format-date/format-date.component.ts
-var CwFormatDate = class extends CwElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.date = /* @__PURE__ */ new Date();
-    this.hourFormat = "auto";
-  }
-  render() {
-    const date = new Date(this.date);
-    const hour12 = this.hourFormat === "auto" ? void 0 : this.hourFormat === "12";
-    if (isNaN(date.getMilliseconds())) {
-      return void 0;
-    }
-    return b`
-      <time datetime=${date.toISOString()}>
-        ${this.localize.date(date, {
-      weekday: this.weekday,
-      era: this.era,
-      year: this.year,
-      month: this.month,
-      day: this.day,
-      hour: this.hour,
-      minute: this.minute,
-      second: this.second,
-      timeZoneName: this.timeZoneName,
-      timeZone: this.timeZone,
-      hour12
-    })}
-      </time>
-    `;
-  }
-};
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "date", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "weekday", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "era", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "year", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "month", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "day", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "hour", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "minute", 2);
-__decorateClass([
-  n()
-], CwFormatDate.prototype, "second", 2);
-__decorateClass([
-  n({ attribute: "time-zone-name" })
-], CwFormatDate.prototype, "timeZoneName", 2);
-__decorateClass([
-  n({ attribute: "time-zone" })
-], CwFormatDate.prototype, "timeZone", 2);
-__decorateClass([
-  n({ attribute: "hour-format" })
-], CwFormatDate.prototype, "hourFormat", 2);
-
-export {
-  CwFormatDate
-};

package/cdn/chunks/chunk.DP7KH5NP.js

@@ -1,11 +0,0 @@
-import {
-  CwDivider
-} from "./chunk.33JRP7BH.js";
-
-// src/components/divider/divider.ts
-var divider_default = CwDivider;
-CwDivider.define("cw-divider");
-
-export {
-  divider_default
-};