@krollins/blueprint 0.1.11 → 0.1.13

package/dist/components/number-input.js

@@ -0,0 +1,556 @@
+import { css as d, LitElement as m, nothing as u, html as p } from "lit";
+import { property as i, query as h, customElement as v } from "lit/decorators.js";
+import { classMap as c } from "lit/directives/class-map.js";
+const f = d`
+  /* Base styles */
+  :host {
+    display: block;
+  }
+
+  .number-input {
+    font-family: var(--bp-font-family);
+    display: flex;
+    flex-direction: column;
+    gap: var(--bp-spacing-xs);
+  }
+
+  .number-input__label {
+    font-size: var(--bp-font-size-sm);
+    font-weight: var(--bp-font-weight-medium);
+    color: var(--bp-color-text);
+    line-height: var(--bp-line-height-normal);
+  }
+
+  .number-input__required {
+    color: var(--bp-color-error);
+    margin-left: var(--bp-spacing-xs);
+  }
+
+  .number-input__container {
+    display: flex;
+    align-items: stretch;
+  }
+
+  .number-input__input {
+    flex: 1;
+    min-width: 0;
+    font-family: var(--bp-font-family);
+    font-size: var(--bp-font-size-base);
+    line-height: var(--bp-line-height-normal);
+    color: var(--bp-color-text);
+    background-color: var(--bp-color-background);
+    border: var(--bp-border-width) solid var(--bp-color-border);
+    padding: var(--bp-spacing-sm) var(--bp-spacing-md);
+    text-align: center;
+    font-variant-numeric: tabular-nums;
+    transition:
+      border-color var(--bp-transition-fast),
+      box-shadow var(--bp-transition-fast);
+  }
+
+  .number-input__input::placeholder {
+    color: var(--bp-color-text-muted);
+    opacity: var(--bp-opacity-subtle);
+  }
+
+  .number-input__input:hover:not(:disabled):not(:readonly) {
+    border-color: var(--bp-color-border-strong);
+  }
+
+  .number-input__input:focus {
+    outline: none;
+    border-color: var(--bp-color-focus);
+    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-focus);
+  }
+
+  .number-input__input:focus-visible {
+    outline: none;
+    border-color: var(--bp-color-focus);
+    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-focus);
+  }
+
+  /* Button styling */
+  .number-input__button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: var(--bp-color-surface);
+    border: var(--bp-border-width) solid var(--bp-color-border);
+    color: var(--bp-color-text);
+    cursor: pointer;
+    transition:
+      background-color var(--bp-transition-fast),
+      border-color var(--bp-transition-fast);
+    padding: 0;
+  }
+
+  .number-input__button:hover:not(:disabled) {
+    background-color: var(--bp-color-surface-elevated);
+    border-color: var(--bp-color-border-strong);
+  }
+
+  .number-input__button:active:not(:disabled) {
+    background-color: var(--bp-color-surface-subdued);
+  }
+
+  .number-input__button:focus-visible {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: var(--bp-focus-offset);
+    z-index: 1;
+  }
+
+  .number-input__button:disabled {
+    opacity: var(--bp-opacity-disabled);
+    background-color: var(--bp-color-surface-subdued);
+    cursor: not-allowed;
+  }
+
+  .number-input__button--decrement {
+    border-right: none;
+    border-radius: var(--bp-border-radius-md) 0 0 var(--bp-border-radius-md);
+  }
+
+  .number-input__button--increment {
+    border-left: none;
+    border-radius: 0 var(--bp-border-radius-md) var(--bp-border-radius-md) 0;
+  }
+
+  .number-input__button-icon {
+    font-size: var(--bp-font-size-lg);
+    font-weight: var(--bp-font-weight-bold);
+    line-height: 1;
+    user-select: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  /* Input border radius adjustment when buttons visible */
+  .number-input:not(.number-input--hide-buttons) .number-input__input {
+    border-radius: 0;
+  }
+
+  .number-input--hide-buttons .number-input__input {
+    border-radius: var(--bp-border-radius-md);
+  }
+
+  /* Size variants */
+  .number-input--sm .number-input__input {
+    font-size: var(--bp-font-size-sm);
+    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);
+  }
+
+  .number-input--sm .number-input__button {
+    width: var(--bp-spacing-8);
+  }
+
+  .number-input--sm .number-input__button-icon {
+    font-size: var(--bp-font-size-base);
+  }
+
+  .number-input--md .number-input__input {
+    font-size: var(--bp-font-size-base);
+    padding: var(--bp-spacing-sm) var(--bp-spacing-md);
+  }
+
+  .number-input--md .number-input__button {
+    width: var(--bp-spacing-10);
+  }
+
+  .number-input--lg .number-input__input {
+    font-size: var(--bp-font-size-lg);
+    padding: var(--bp-spacing-md) var(--bp-spacing-lg);
+  }
+
+  .number-input--lg .number-input__button {
+    width: var(--bp-spacing-12);
+  }
+
+  .number-input--lg .number-input__button-icon {
+    font-size: var(--bp-font-size-xl);
+  }
+
+  /* Variant styles */
+  .number-input__input--default {
+    border-color: var(--bp-color-border);
+  }
+
+  .number-input__input--success {
+    border-color: var(--bp-color-success);
+  }
+
+  .number-input__input--success:focus,
+  .number-input__input--success:focus-visible {
+    border-color: var(--bp-color-success);
+    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-success);
+  }
+
+  .number-input__input--error {
+    border-color: var(--bp-color-error);
+  }
+
+  .number-input__input--error:focus,
+  .number-input__input--error:focus-visible {
+    border-color: var(--bp-color-error);
+    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-error);
+  }
+
+  .number-input__input--warning {
+    border-color: var(--bp-color-warning);
+  }
+
+  .number-input__input--warning:focus,
+  .number-input__input--warning:focus-visible {
+    border-color: var(--bp-color-warning);
+    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-warning);
+  }
+
+  /* Match button border color to input variant */
+  .number-input--success .number-input__button {
+    border-color: var(--bp-color-success);
+  }
+
+  .number-input--error .number-input__button {
+    border-color: var(--bp-color-error);
+  }
+
+  .number-input--warning .number-input__button {
+    border-color: var(--bp-color-warning);
+  }
+
+  /* States */
+  .number-input--disabled {
+    pointer-events: none;
+  }
+
+  .number-input--disabled .number-input__input {
+    opacity: var(--bp-opacity-disabled);
+    background-color: var(--bp-color-surface-subdued);
+    cursor: not-allowed;
+  }
+
+  .number-input--disabled .number-input__label {
+    opacity: var(--bp-opacity-disabled);
+  }
+
+  .number-input--readonly .number-input__input {
+    background-color: var(--bp-color-surface-subdued);
+    cursor: default;
+  }
+
+  .number-input--readonly .number-input__button {
+    background-color: var(--bp-color-surface-subdued);
+    pointer-events: none;
+  }
+
+  /* Message styles */
+  .number-input__message {
+    font-size: var(--bp-font-size-sm);
+    line-height: var(--bp-line-height-normal);
+    color: var(--bp-color-text-muted);
+  }
+
+  .number-input__message--error {
+    color: var(--bp-color-error);
+  }
+
+  .number-input__message--success {
+    color: var(--bp-color-success);
+  }
+
+  .number-input__message--warning {
+    color: var(--bp-color-warning);
+  }
+
+  /* iOS zoom prevention: ensure 16px minimum on touch devices */
+  @media (max-width: 768px) {
+    .number-input--sm .number-input__input {
+      font-size: 16px;
+    }
+  }
+`;
+var _ = Object.defineProperty, g = Object.getOwnPropertyDescriptor, n = (t, e, o, a) => {
+  for (var s = a > 1 ? void 0 : a ? g(e, o) : e, l = t.length - 1, b; l >= 0; l--)
+    (b = t[l]) && (s = (a ? b(e, o, s) : b(s)) || s);
+  return a && s && _(e, o, s), s;
+};
+let r = class extends m {
+  constructor() {
+    super(), this.value = null, this.min = void 0, this.max = void 0, this.step = 1, this.name = "", this.label = "", this.placeholder = "", this.disabled = !1, this.required = !1, this.readonly = !1, this.size = "md", this.variant = "default", this.message = "", this.precision = void 0, this.hideButtons = !1;
+  }
+  /**
+   * Check if decrement is allowed
+   */
+  get canDecrement() {
+    return this.disabled || this.readonly ? !1 : this.value === null ? !0 : this.min !== void 0 ? this.value > this.min : !0;
+  }
+  /**
+   * Check if increment is allowed
+   */
+  get canIncrement() {
+    return this.disabled || this.readonly ? !1 : this.value === null ? !0 : this.max !== void 0 ? this.value < this.max : !0;
+  }
+  /**
+   * Format value for display
+   */
+  formatValue(t) {
+    return t === null ? "" : this.precision !== void 0 ? t.toFixed(this.precision) : String(t);
+  }
+  /**
+   * Clamp value to min/max range
+   */
+  clampValue(t) {
+    let e = t;
+    return this.min !== void 0 && (e = Math.max(this.min, e)), this.max !== void 0 && (e = Math.min(this.max, e)), e;
+  }
+  /**
+   * Round value to step precision
+   */
+  roundToStep(t) {
+    if (this.precision !== void 0) {
+      const a = Math.pow(10, this.precision);
+      return Math.round(t * a) / a;
+    }
+    const e = (String(this.step).split(".")[1] || "").length, o = Math.pow(10, e);
+    return Math.round(t * o) / o;
+  }
+  /**
+   * Update value and emit events
+   */
+  updateValue(t, e = !0) {
+    const o = this.value;
+    t !== null && (t = this.clampValue(t), t = this.roundToStep(t)), t !== o && (this.value = t, this.dispatchEvent(
+      new CustomEvent("bp-input", {
+        detail: { value: this.value },
+        bubbles: !0,
+        composed: !0
+      })
+    ), e && this.dispatchEvent(
+      new CustomEvent("bp-change", {
+        detail: { value: this.value },
+        bubbles: !0,
+        composed: !0
+      })
+    ));
+  }
+  /**
+   * Handle increment button click
+   */
+  handleIncrement() {
+    if (!this.canIncrement) return;
+    const t = this.value ?? this.min ?? 0;
+    this.updateValue(t + this.step);
+  }
+  /**
+   * Handle decrement button click
+   */
+  handleDecrement() {
+    if (!this.canDecrement) return;
+    const t = this.value ?? this.max ?? 0;
+    this.updateValue(t - this.step);
+  }
+  /**
+   * Handle direct input
+   */
+  handleInput(t) {
+    const o = t.target.value.trim();
+    if (o === "") {
+      this.updateValue(null, !1);
+      return;
+    }
+    const a = parseFloat(o);
+    isNaN(a) || (this.value = a, this.dispatchEvent(
+      new CustomEvent("bp-input", {
+        detail: { value: this.value },
+        bubbles: !0,
+        composed: !0
+      })
+    ));
+  }
+  /**
+   * Handle blur - validate and clamp
+   */
+  handleBlur() {
+    if (this.value !== null) {
+      const t = this.clampValue(this.value), e = this.roundToStep(t);
+      e !== this.value && (this.value = e), this.inputElement && (this.inputElement.value = this.formatValue(this.value));
+    }
+    this.dispatchEvent(
+      new CustomEvent("bp-change", {
+        detail: { value: this.value },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  /**
+   * Handle keyboard navigation
+   */
+  handleKeyDown(t) {
+    if (!(this.disabled || this.readonly))
+      switch (t.key) {
+        case "ArrowUp":
+          t.preventDefault(), this.handleIncrement();
+          break;
+        case "ArrowDown":
+          t.preventDefault(), this.handleDecrement();
+          break;
+        case "PageUp":
+          if (t.preventDefault(), this.canIncrement) {
+            const e = this.value ?? this.min ?? 0;
+            this.updateValue(e + this.step * 10);
+          }
+          break;
+        case "PageDown":
+          if (t.preventDefault(), this.canDecrement) {
+            const e = this.value ?? this.max ?? 0;
+            this.updateValue(e - this.step * 10);
+          }
+          break;
+        case "Home":
+          t.preventDefault(), this.min !== void 0 && this.updateValue(this.min);
+          break;
+        case "End":
+          t.preventDefault(), this.max !== void 0 && this.updateValue(this.max);
+          break;
+      }
+  }
+  render() {
+    const t = {
+      "number-input": !0,
+      [`number-input--${this.size}`]: !0,
+      [`number-input--${this.variant}`]: !0,
+      "number-input--disabled": this.disabled,
+      "number-input--readonly": this.readonly,
+      "number-input--hide-buttons": this.hideButtons
+    }, e = {
+      "number-input__input": !0,
+      [`number-input__input--${this.variant}`]: !0
+    };
+    return p`
+      <div class=${c(t)}>
+        ${this.label ? p`
+              <label class="number-input__label" part="label">
+                ${this.label}
+                ${this.required ? p`<span class="number-input__required">*</span>` : u}
+              </label>
+            ` : u}
+
+        <div class="number-input__container">
+          ${this.hideButtons ? u : p`
+                <button
+                  type="button"
+                  class="number-input__button number-input__button--decrement"
+                  part="decrement"
+                  tabindex="-1"
+                  ?disabled=${!this.canDecrement}
+                  aria-label="Decrease value"
+                  @click=${this.handleDecrement}
+                >
+                  <span class="number-input__button-icon">−</span>
+                </button>
+              `}
+
+          <input
+            type="text"
+            inputmode="decimal"
+            class=${c(e)}
+            part="input"
+            .value=${this.formatValue(this.value)}
+            name=${this.name || u}
+            placeholder=${this.placeholder || u}
+            ?disabled=${this.disabled}
+            ?readonly=${this.readonly}
+            ?required=${this.required}
+            aria-valuemin=${this.min ?? u}
+            aria-valuemax=${this.max ?? u}
+            aria-valuenow=${this.value ?? u}
+            aria-invalid=${this.variant === "error" ? "true" : u}
+            @input=${this.handleInput}
+            @blur=${this.handleBlur}
+            @keydown=${this.handleKeyDown}
+          />
+
+          ${this.hideButtons ? u : p`
+                <button
+                  type="button"
+                  class="number-input__button number-input__button--increment"
+                  part="increment"
+                  tabindex="-1"
+                  ?disabled=${!this.canIncrement}
+                  aria-label="Increase value"
+                  @click=${this.handleIncrement}
+                >
+                  <span class="number-input__button-icon">+</span>
+                </button>
+              `}
+        </div>
+
+        ${this.message ? p`
+              <div
+                class="number-input__message number-input__message--${this.variant}"
+                part="message"
+              >
+                ${this.message}
+              </div>
+            ` : u}
+      </div>
+    `;
+  }
+};
+r.styles = [f];
+n([
+  i({ type: Number })
+], r.prototype, "value", 2);
+n([
+  i({ type: Number })
+], r.prototype, "min", 2);
+n([
+  i({ type: Number })
+], r.prototype, "max", 2);
+n([
+  i({ type: Number })
+], r.prototype, "step", 2);
+n([
+  i({ type: String })
+], r.prototype, "name", 2);
+n([
+  i({ type: String })
+], r.prototype, "label", 2);
+n([
+  i({ type: String })
+], r.prototype, "placeholder", 2);
+n([
+  i({ type: Boolean, reflect: !0 })
+], r.prototype, "disabled", 2);
+n([
+  i({ type: Boolean, reflect: !0 })
+], r.prototype, "required", 2);
+n([
+  i({ type: Boolean, reflect: !0 })
+], r.prototype, "readonly", 2);
+n([
+  i({ type: String })
+], r.prototype, "size", 2);
+n([
+  i({ type: String })
+], r.prototype, "variant", 2);
+n([
+  i({ type: String })
+], r.prototype, "message", 2);
+n([
+  i({ type: Number })
+], r.prototype, "precision", 2);
+n([
+  i({ type: Boolean, attribute: "hide-buttons" })
+], r.prototype, "hideButtons", 2);
+n([
+  h("input")
+], r.prototype, "inputElement", 2);
+r = n([
+  v("bp-number-input")
+], r);
+export {
+  r as BpNumberInput
+};
+//# sourceMappingURL=number-input.js.map

package/dist/components/number-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-input.js","sources":["../../source/components/number-input/number-input.style.ts","../../source/components/number-input/number-input.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const numberInputStyles = css`\n  /* Base styles */\n  :host {\n    display: block;\n  }\n\n  .number-input {\n    font-family: var(--bp-font-family);\n    display: flex;\n    flex-direction: column;\n    gap: var(--bp-spacing-xs);\n  }\n\n  .number-input__label {\n    font-size: var(--bp-font-size-sm);\n    font-weight: var(--bp-font-weight-medium);\n    color: var(--bp-color-text);\n    line-height: var(--bp-line-height-normal);\n  }\n\n  .number-input__required {\n    color: var(--bp-color-error);\n    margin-left: var(--bp-spacing-xs);\n  }\n\n  .number-input__container {\n    display: flex;\n    align-items: stretch;\n  }\n\n  .number-input__input {\n    flex: 1;\n    min-width: 0;\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-base);\n    line-height: var(--bp-line-height-normal);\n    color: var(--bp-color-text);\n    background-color: var(--bp-color-background);\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    text-align: center;\n    font-variant-numeric: tabular-nums;\n    transition:\n      border-color var(--bp-transition-fast),\n      box-shadow var(--bp-transition-fast);\n  }\n\n  .number-input__input::placeholder {\n    color: var(--bp-color-text-muted);\n    opacity: var(--bp-opacity-subtle);\n  }\n\n  .number-input__input:hover:not(:disabled):not(:readonly) {\n    border-color: var(--bp-color-border-strong);\n  }\n\n  .number-input__input:focus {\n    outline: none;\n    border-color: var(--bp-color-focus);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-focus);\n  }\n\n  .number-input__input:focus-visible {\n    outline: none;\n    border-color: var(--bp-color-focus);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-focus);\n  }\n\n  /* Button styling */\n  .number-input__button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--bp-color-surface);\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    color: var(--bp-color-text);\n    cursor: pointer;\n    transition:\n      background-color var(--bp-transition-fast),\n      border-color var(--bp-transition-fast);\n    padding: 0;\n  }\n\n  .number-input__button:hover:not(:disabled) {\n    background-color: var(--bp-color-surface-elevated);\n    border-color: var(--bp-color-border-strong);\n  }\n\n  .number-input__button:active:not(:disabled) {\n    background-color: var(--bp-color-surface-subdued);\n  }\n\n  .number-input__button:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n    z-index: 1;\n  }\n\n  .number-input__button:disabled {\n    opacity: var(--bp-opacity-disabled);\n    background-color: var(--bp-color-surface-subdued);\n    cursor: not-allowed;\n  }\n\n  .number-input__button--decrement {\n    border-right: none;\n    border-radius: var(--bp-border-radius-md) 0 0 var(--bp-border-radius-md);\n  }\n\n  .number-input__button--increment {\n    border-left: none;\n    border-radius: 0 var(--bp-border-radius-md) var(--bp-border-radius-md) 0;\n  }\n\n  .number-input__button-icon {\n    font-size: var(--bp-font-size-lg);\n    font-weight: var(--bp-font-weight-bold);\n    line-height: 1;\n    user-select: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  /* Input border radius adjustment when buttons visible */\n  .number-input:not(.number-input--hide-buttons) .number-input__input {\n    border-radius: 0;\n  }\n\n  .number-input--hide-buttons .number-input__input {\n    border-radius: var(--bp-border-radius-md);\n  }\n\n  /* Size variants */\n  .number-input--sm .number-input__input {\n    font-size: var(--bp-font-size-sm);\n    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);\n  }\n\n  .number-input--sm .number-input__button {\n    width: var(--bp-spacing-8);\n  }\n\n  .number-input--sm .number-input__button-icon {\n    font-size: var(--bp-font-size-base);\n  }\n\n  .number-input--md .number-input__input {\n    font-size: var(--bp-font-size-base);\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n  }\n\n  .number-input--md .number-input__button {\n    width: var(--bp-spacing-10);\n  }\n\n  .number-input--lg .number-input__input {\n    font-size: var(--bp-font-size-lg);\n    padding: var(--bp-spacing-md) var(--bp-spacing-lg);\n  }\n\n  .number-input--lg .number-input__button {\n    width: var(--bp-spacing-12);\n  }\n\n  .number-input--lg .number-input__button-icon {\n    font-size: var(--bp-font-size-xl);\n  }\n\n  /* Variant styles */\n  .number-input__input--default {\n    border-color: var(--bp-color-border);\n  }\n\n  .number-input__input--success {\n    border-color: var(--bp-color-success);\n  }\n\n  .number-input__input--success:focus,\n  .number-input__input--success:focus-visible {\n    border-color: var(--bp-color-success);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-success);\n  }\n\n  .number-input__input--error {\n    border-color: var(--bp-color-error);\n  }\n\n  .number-input__input--error:focus,\n  .number-input__input--error:focus-visible {\n    border-color: var(--bp-color-error);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-error);\n  }\n\n  .number-input__input--warning {\n    border-color: var(--bp-color-warning);\n  }\n\n  .number-input__input--warning:focus,\n  .number-input__input--warning:focus-visible {\n    border-color: var(--bp-color-warning);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-warning);\n  }\n\n  /* Match button border color to input variant */\n  .number-input--success .number-input__button {\n    border-color: var(--bp-color-success);\n  }\n\n  .number-input--error .number-input__button {\n    border-color: var(--bp-color-error);\n  }\n\n  .number-input--warning .number-input__button {\n    border-color: var(--bp-color-warning);\n  }\n\n  /* States */\n  .number-input--disabled {\n    pointer-events: none;\n  }\n\n  .number-input--disabled .number-input__input {\n    opacity: var(--bp-opacity-disabled);\n    background-color: var(--bp-color-surface-subdued);\n    cursor: not-allowed;\n  }\n\n  .number-input--disabled .number-input__label {\n    opacity: var(--bp-opacity-disabled);\n  }\n\n  .number-input--readonly .number-input__input {\n    background-color: var(--bp-color-surface-subdued);\n    cursor: default;\n  }\n\n  .number-input--readonly .number-input__button {\n    background-color: var(--bp-color-surface-subdued);\n    pointer-events: none;\n  }\n\n  /* Message styles */\n  .number-input__message {\n    font-size: var(--bp-font-size-sm);\n    line-height: var(--bp-line-height-normal);\n    color: var(--bp-color-text-muted);\n  }\n\n  .number-input__message--error {\n    color: var(--bp-color-error);\n  }\n\n  .number-input__message--success {\n    color: var(--bp-color-success);\n  }\n\n  .number-input__message--warning {\n    color: var(--bp-color-warning);\n  }\n\n  /* iOS zoom prevention: ensure 16px minimum on touch devices */\n  @media (max-width: 768px) {\n    .number-input--sm .number-input__input {\n      font-size: 16px;\n    }\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { numberInputStyles } from './number-input.style.js';\n\n/**\n * Size variants for the number input\n */\nexport type NumberInputSize = 'sm' | 'md' | 'lg';\n\n/**\n * Validation variant for the number input\n */\nexport type NumberInputVariant = 'default' | 'success' | 'error' | 'warning';\n\n/**\n * A number input component with increment/decrement buttons.\n *\n * @element bp-number-input\n *\n * @fires bp-input - Fired when the value changes during input\n * @fires bp-change - Fired when the value changes (on blur or button click)\n *\n * @csspart input - The native input element\n * @csspart decrement - The decrement button\n * @csspart increment - The increment button\n * @csspart label - The label element\n * @csspart message - The help/error message element\n */\n@customElement('bp-number-input')\nexport class BpNumberInput extends LitElement {\n  /**\n   * Current value of the input\n   */\n  @property({ type: Number }) declare value: number | null;\n\n  /**\n   * Minimum allowed value\n   */\n  @property({ type: Number }) declare min: number | undefined;\n\n  /**\n   * Maximum allowed value\n   */\n  @property({ type: Number }) declare max: number | undefined;\n\n  /**\n   * Step increment for buttons and arrow keys\n   */\n  @property({ type: Number }) declare step: number;\n\n  /**\n   * Name attribute for form association\n   */\n  @property({ type: String }) declare name: string;\n\n  /**\n   * Label text for the input\n   */\n  @property({ type: String }) declare label: string;\n\n  /**\n   * Placeholder text when empty\n   */\n  @property({ type: String }) declare placeholder: string;\n\n  /**\n   * Whether the input is disabled\n   */\n  @property({ type: Boolean, reflect: true }) declare disabled: boolean;\n\n  /**\n   * Whether the input is required\n   */\n  @property({ type: Boolean, reflect: true }) declare required: boolean;\n\n  /**\n   * Whether the input is readonly\n   */\n  @property({ type: Boolean, reflect: true }) declare readonly: boolean;\n\n  /**\n   * Size variant\n   */\n  @property({ type: String }) declare size: NumberInputSize;\n\n  /**\n   * Validation variant\n   */\n  @property({ type: String }) declare variant: NumberInputVariant;\n\n  /**\n   * Help or error message to display\n   */\n  @property({ type: String }) declare message: string;\n\n  /**\n   * Number of decimal places to display\n   */\n  @property({ type: Number }) declare precision: number | undefined;\n\n  /**\n   * Hide the increment/decrement buttons\n   */\n  @property({ type: Boolean, attribute: 'hide-buttons' })\n  declare hideButtons: boolean;\n\n  @query('input') private inputElement!: HTMLInputElement;\n\n  static styles = [numberInputStyles];\n\n  constructor() {\n    super();\n    this.value = null;\n    this.min = undefined;\n    this.max = undefined;\n    this.step = 1;\n    this.name = '';\n    this.label = '';\n    this.placeholder = '';\n    this.disabled = false;\n    this.required = false;\n    this.readonly = false;\n    this.size = 'md';\n    this.variant = 'default';\n    this.message = '';\n    this.precision = undefined;\n    this.hideButtons = false;\n  }\n\n  /**\n   * Check if decrement is allowed\n   */\n  private get canDecrement(): boolean {\n    if (this.disabled || this.readonly) return false;\n    if (this.value === null) return true;\n    if (this.min !== undefined) return this.value > this.min;\n    return true;\n  }\n\n  /**\n   * Check if increment is allowed\n   */\n  private get canIncrement(): boolean {\n    if (this.disabled || this.readonly) return false;\n    if (this.value === null) return true;\n    if (this.max !== undefined) return this.value < this.max;\n    return true;\n  }\n\n  /**\n   * Format value for display\n   */\n  private formatValue(value: number | null): string {\n    if (value === null) return '';\n    if (this.precision !== undefined) {\n      return value.toFixed(this.precision);\n    }\n    return String(value);\n  }\n\n  /**\n   * Clamp value to min/max range\n   */\n  private clampValue(value: number): number {\n    let result = value;\n    if (this.min !== undefined) result = Math.max(this.min, result);\n    if (this.max !== undefined) result = Math.min(this.max, result);\n    return result;\n  }\n\n  /**\n   * Round value to step precision\n   */\n  private roundToStep(value: number): number {\n    if (this.precision !== undefined) {\n      const factor = Math.pow(10, this.precision);\n      return Math.round(value * factor) / factor;\n    }\n    // Handle floating point precision for step\n    const stepDecimals = (String(this.step).split('.')[1] || '').length;\n    const factor = Math.pow(10, stepDecimals);\n    return Math.round(value * factor) / factor;\n  }\n\n  /**\n   * Update value and emit events\n   */\n  private updateValue(\n    newValue: number | null,\n    emitChange: boolean = true\n  ): void {\n    const oldValue = this.value;\n\n    if (newValue !== null) {\n      newValue = this.clampValue(newValue);\n      newValue = this.roundToStep(newValue);\n    }\n\n    if (newValue !== oldValue) {\n      this.value = newValue;\n\n      this.dispatchEvent(\n        new CustomEvent('bp-input', {\n          detail: { value: this.value },\n          bubbles: true,\n          composed: true,\n        })\n      );\n\n      if (emitChange) {\n        this.dispatchEvent(\n          new CustomEvent('bp-change', {\n            detail: { value: this.value },\n            bubbles: true,\n            composed: true,\n          })\n        );\n      }\n    }\n  }\n\n  /**\n   * Handle increment button click\n   */\n  private handleIncrement(): void {\n    if (!this.canIncrement) return;\n    const currentValue = this.value ?? this.min ?? 0;\n    this.updateValue(currentValue + this.step);\n  }\n\n  /**\n   * Handle decrement button click\n   */\n  private handleDecrement(): void {\n    if (!this.canDecrement) return;\n    const currentValue = this.value ?? this.max ?? 0;\n    this.updateValue(currentValue - this.step);\n  }\n\n  /**\n   * Handle direct input\n   */\n  private handleInput(event: Event): void {\n    const input = event.target as HTMLInputElement;\n    const inputValue = input.value.trim();\n\n    if (inputValue === '') {\n      this.updateValue(null, false);\n      return;\n    }\n\n    const numValue = parseFloat(inputValue);\n    if (!isNaN(numValue)) {\n      // Don't clamp during input, only on blur\n      this.value = numValue;\n      this.dispatchEvent(\n        new CustomEvent('bp-input', {\n          detail: { value: this.value },\n          bubbles: true,\n          composed: true,\n        })\n      );\n    }\n  }\n\n  /**\n   * Handle blur - validate and clamp\n   */\n  private handleBlur(): void {\n    if (this.value !== null) {\n      const clampedValue = this.clampValue(this.value);\n      const roundedValue = this.roundToStep(clampedValue);\n\n      if (roundedValue !== this.value) {\n        this.value = roundedValue;\n      }\n\n      // Update input display\n      if (this.inputElement) {\n        this.inputElement.value = this.formatValue(this.value);\n      }\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('bp-change', {\n        detail: { value: this.value },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /**\n   * Handle keyboard navigation\n   */\n  private handleKeyDown(event: globalThis.KeyboardEvent): void {\n    if (this.disabled || this.readonly) return;\n\n    switch (event.key) {\n      case 'ArrowUp':\n        event.preventDefault();\n        this.handleIncrement();\n        break;\n      case 'ArrowDown':\n        event.preventDefault();\n        this.handleDecrement();\n        break;\n      case 'PageUp':\n        event.preventDefault();\n        if (this.canIncrement) {\n          const currentValue = this.value ?? this.min ?? 0;\n          this.updateValue(currentValue + this.step * 10);\n        }\n        break;\n      case 'PageDown':\n        event.preventDefault();\n        if (this.canDecrement) {\n          const currentValue = this.value ?? this.max ?? 0;\n          this.updateValue(currentValue - this.step * 10);\n        }\n        break;\n      case 'Home':\n        event.preventDefault();\n        if (this.min !== undefined) {\n          this.updateValue(this.min);\n        }\n        break;\n      case 'End':\n        event.preventDefault();\n        if (this.max !== undefined) {\n          this.updateValue(this.max);\n        }\n        break;\n    }\n  }\n\n  render() {\n    const wrapperClasses = {\n      'number-input': true,\n      [`number-input--${this.size}`]: true,\n      [`number-input--${this.variant}`]: true,\n      'number-input--disabled': this.disabled,\n      'number-input--readonly': this.readonly,\n      'number-input--hide-buttons': this.hideButtons,\n    };\n\n    const inputClasses = {\n      'number-input__input': true,\n      [`number-input__input--${this.variant}`]: true,\n    };\n\n    return html`\n      <div class=${classMap(wrapperClasses)}>\n        ${this.label\n          ? html`\n              <label class=\"number-input__label\" part=\"label\">\n                ${this.label}\n                ${this.required\n                  ? html`<span class=\"number-input__required\">*</span>`\n                  : nothing}\n              </label>\n            `\n          : nothing}\n\n        <div class=\"number-input__container\">\n          ${!this.hideButtons\n            ? html`\n                <button\n                  type=\"button\"\n                  class=\"number-input__button number-input__button--decrement\"\n                  part=\"decrement\"\n                  tabindex=\"-1\"\n                  ?disabled=${!this.canDecrement}\n                  aria-label=\"Decrease value\"\n                  @click=${this.handleDecrement}\n                >\n                  <span class=\"number-input__button-icon\">−</span>\n                </button>\n              `\n            : nothing}\n\n          <input\n            type=\"text\"\n            inputmode=\"decimal\"\n            class=${classMap(inputClasses)}\n            part=\"input\"\n            .value=${this.formatValue(this.value)}\n            name=${this.name || nothing}\n            placeholder=${this.placeholder || nothing}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            ?required=${this.required}\n            aria-valuemin=${this.min ?? nothing}\n            aria-valuemax=${this.max ?? nothing}\n            aria-valuenow=${this.value ?? nothing}\n            aria-invalid=${this.variant === 'error' ? 'true' : nothing}\n            @input=${this.handleInput}\n            @blur=${this.handleBlur}\n            @keydown=${this.handleKeyDown}\n          />\n\n          ${!this.hideButtons\n            ? html`\n                <button\n                  type=\"button\"\n                  class=\"number-input__button number-input__button--increment\"\n                  part=\"increment\"\n                  tabindex=\"-1\"\n                  ?disabled=${!this.canIncrement}\n                  aria-label=\"Increase value\"\n                  @click=${this.handleIncrement}\n                >\n                  <span class=\"number-input__button-icon\">+</span>\n                </button>\n              `\n            : nothing}\n        </div>\n\n        ${this.message\n          ? html`\n              <div\n                class=\"number-input__message number-input__message--${this\n                  .variant}\"\n                part=\"message\"\n              >\n                ${this.message}\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-number-input': BpNumberInput;\n  }\n}\n"],"names":["numberInputStyles","css","BpNumberInput","LitElement","value","result","factor","stepDecimals","newValue","emitChange","oldValue","currentValue","event","inputValue","numValue","clampedValue","roundedValue","wrapperClasses","inputClasses","html","classMap","nothing","__decorateClass","property","query","customElement"],"mappings":";;;AAEO,MAAMA,IAAoBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA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"}