@vielzeug/refine 1.1.3 → 1.3.1

package/dist/number-input.cjs

@@ -1,38 +1,38 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/states.css.cjs"),t=require("./shared/prop-bundles.cjs"),n=require("./headless/spinner.cjs"),r=require("./inputs/shared/form-context.cjs"),i=require("./inputs/number-input/number-input.css?inline.cjs");let a=require("@vielzeug/ore"),o=require("@vielzeug/ripple"),s=require("@vielzeug/arsenal");var c=`ore-number-input`;(0,a.define)(c,{formAssociated:!0,props:{...t.themableBundle,...t.sizableBundle,...t.disablableBundle,...t.roundableBundle,error:a.prop.string(),fullwidth:a.prop.bool(!1),helper:a.prop.string(),label:a.prop.string(),"label-placement":a.prop.oneOf([`inset`,`outside`],`inset`),"large-step":a.prop.json(void 0),max:a.prop.json(void 0),min:a.prop.json(void 0),name:a.prop.string(),placeholder:a.prop.string(),readonly:a.prop.bool(!1),ref:a.prop.json(void 0),step:a.prop.number(1),value:a.prop.json(void 0),variant:a.prop.string()},setup(e,{bind:t,emit:i,onElement:c,watch:l}){let u=r.useFormContext(t,e,(0,a.inject)(r.FORM_CTX)),d=u.disabled,f=(0,o.computed)(()=>!!e.readonly.value),p=(0,o.signal)(e.value.value==null?``:String(e.value.value));(0,o.watch)(e.value,e=>{let t=e==null?``:String(e);p.value!==t&&(p.value=t)});function m(){let e=p.value.trim();if(!e)return null;let t=Number.parseFloat(e);return Number.isNaN(t)?null:t}function h(t,n){let r=e.min.value==null?void 0:Number(e.min.value),a=e.max.value==null?void 0:Number(e.max.value),o=t==null?null:(0,s.clamp)(t,r,a),c=o==null?``:String(o);p.value!==c&&(p.value=c),i(`change`,{originalEvent:n,value:o})}let g=n.createSpinnerControl({commit:h,disabled:d,largeStep:e[`large-step`],max:e.max,min:e.min,parse:m,readonly:f,step:e.step}),_=(0,a.ref)(),v=null,y=null,b=null,x=t=>{if(!t){v?.(),y?.(),b?.dispose(),v=null,y=null,b=null,e.ref.value?.(null);return}t.setAttribute(`inputmode`,`decimal`),t.setAttribute(`role`,`spinbutton`);let n=e=>{let t=e.target.value,n=t===``?null:Number.parseFloat(t);h(Number.isNaN(n??NaN)?null:n,e)},r=e=>{let t=e.target.value,n=t===``?null:Number.parseFloat(t);p.value=t,i(`input`,{originalEvent:e,value:Number.isNaN(n??NaN)?null:n})};t.addEventListener(`change`,n),t.addEventListener(`input`,r),y=()=>{t.removeEventListener(`change`,n),t.removeEventListener(`input`,r)},v=l(()=>{let n=m();n==null?t.removeAttribute(`aria-valuenow`):t.setAttribute(`aria-valuenow`,String(n)),e.min.value==null?t.removeAttribute(`aria-valuemin`):t.setAttribute(`aria-valuemin`,String(e.min.value)),e.max.value==null?t.removeAttribute(`aria-valuemax`):t.setAttribute(`aria-valuemax`,String(e.max.value)),f.value?t.setAttribute(`aria-readonly`,`true`):t.removeAttribute(`aria-readonly`)}),e.ref.value?.(t),b=(0,o.watch)(e.ref,e=>{e?.(t)})};c(_,e=>{e.ref=x}),t({attr:{size:u.size,value:()=>p.value||null,variant:u.variant}});let S=(0,o.computed)(()=>d.value||f.value);return a.html`
-      <div class="wrapper" part="control" @keydown="${e=>g.handleKeydown(e)}">
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/states.css.cjs"),t=require("./shared/prop-bundles.cjs"),n=require("./headless/spinner.cjs"),r=require("./inputs/shared/form-context.cjs"),i=require("./inputs/number-input/number-input.css.cjs");let a=require("@vielzeug/ore"),o=require("@vielzeug/ripple"),s=require("@vielzeug/arsenal");var c=`ore-number-input`;(0,a.define)(c,{formAssociated:!0,props:{...t.themableBundle,...t.sizableBundle,...t.disablableBundle,...t.roundableBundle,error:a.prop.string(),fullwidth:a.prop.bool(!1),helper:a.prop.string(),label:a.prop.string(),"label-placement":a.prop.oneOf([`inset`,`outside`],`inset`),"large-step":a.prop.json(void 0),max:a.prop.json(void 0),min:a.prop.json(void 0),name:a.prop.string(),placeholder:a.prop.string(),readonly:a.prop.bool(!1),ref:a.prop.json(void 0),step:a.prop.number(1),value:a.prop.json(void 0),variant:a.prop.string()},setup(e){let t=(0,a.useEmit)(),i=a.watchEffect,c=r.useFormContext(e,(0,a.inject)(r.FORM_CTX)),l=c.disabled,u=(0,o.computed)(()=>!!e.readonly.value),d=(0,o.signal)(e.value.value==null?``:String(e.value.value));(0,o.watch)(e.value,e=>{let t=e==null?``:String(e);d.value!==t&&(d.value=t)});function f(){let e=d.value.trim();if(!e)return null;let t=Number.parseFloat(e);return Number.isNaN(t)?null:t}function p(n,r){let i=e.min.value==null?void 0:Number(e.min.value),a=e.max.value==null?void 0:Number(e.max.value),o=n==null?null:(0,s.clamp)(n,i,a),c=o==null?``:String(o);d.value!==c&&(d.value=c),t(`change`,{originalEvent:r,value:o})}let m=n.createSpinnerControl({commit:p,disabled:l,largeStep:e[`large-step`],max:e.max,min:e.min,parse:f,readonly:u,step:e.step}),h=(0,a.ref)(),g=null,_=null,v=null,y=n=>{if(!n){g?.(),_?.(),v?.dispose(),g=null,_=null,v=null,e.ref.value?.(null);return}n.setAttribute(`inputmode`,`decimal`),n.setAttribute(`role`,`spinbutton`);let r=e=>{let t=e.target.value,n=t===``?null:Number.parseFloat(t);p(Number.isNaN(n??NaN)?null:n,e)},a=e=>{let n=e.target.value,r=n===``?null:Number.parseFloat(n);d.value=n,t(`input`,{originalEvent:e,value:Number.isNaN(r??NaN)?null:r})};n.addEventListener(`change`,r),n.addEventListener(`input`,a),_=()=>{n.removeEventListener(`change`,r),n.removeEventListener(`input`,a)},g=i(()=>{let t=f();t==null?n.removeAttribute(`aria-valuenow`):n.setAttribute(`aria-valuenow`,String(t)),e.min.value==null?n.removeAttribute(`aria-valuemin`):n.setAttribute(`aria-valuemin`,String(e.min.value)),e.max.value==null?n.removeAttribute(`aria-valuemax`):n.setAttribute(`aria-valuemax`,String(e.max.value)),u.value?n.setAttribute(`aria-readonly`,`true`):n.removeAttribute(`aria-readonly`)}),e.ref.value?.(n),v=(0,o.watch)(e.ref,e=>{e?.(n)})};(0,a.onElement)(h,e=>{e.ref=y}),(0,a.bind)({attr:{size:c.size,value:()=>d.value||null,variant:c.variant}});let b=(0,o.computed)(()=>l.value||u.value);return a.html`
+      <div class="wrapper" part="control" @keydown="${e=>m.handleKeydown(e)}">
         <button
           type="button"
           part="decrement-btn"
           aria-label="Decrease"
-          ?disabled="${()=>S.value||g.atMin()}"
-          @click="${t=>g.incrementBy(-(Number(e.step.value)||1),t)}">
+          ?disabled="${()=>b.value||m.atMin()}"
+          @click="${t=>m.incrementBy(-(Number(e.step.value)||1),t)}">
           <ore-icon name="minus" size="14" stroke-width="2.5" aria-hidden="true"></ore-icon>
         </button>
         <ore-input
           class="field"
           part="field"
-          ref="${_}"
-          :value="${()=>p.value}"
+          ref="${h}"
+          :value="${()=>d.value}"
           :label="${()=>e.label.value??``}"
           :label-placement="${()=>e[`label-placement`].value??`inset`}"
           :placeholder="${()=>e.placeholder.value??``}"
           :name="${()=>e.name.value??``}"
           :helper="${()=>e.helper.value??``}"
           :error="${()=>e.error.value??``}"
-          :size="${u.size}"
+          :size="${c.size}"
           :color="${()=>e.color.value??``}"
           :variant="${()=>e.variant.value??``}"
           :rounded="${()=>e.rounded.value}"
-          ?disabled="${d}"
-          ?readonly="${f}"
+          ?disabled="${l}"
+          ?readonly="${u}"
           ?fullwidth="${()=>!1}">
         </ore-input>
         <button
           type="button"
           part="increment-btn"
           aria-label="Increase"
-          ?disabled="${()=>S.value||g.atMax()}"
-          @click="${t=>g.incrementBy(Number(e.step.value)||1,t)}">
+          ?disabled="${()=>b.value||m.atMax()}"
+          @click="${t=>m.incrementBy(Number(e.step.value)||1,t)}">
           <ore-icon name="plus" size="14" stroke-width="2.5" aria-hidden="true"></ore-icon>
         </button>
       </div>

package/dist/number-input.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.cjs","names":[],"sources":["../src/inputs/number-input/number-input.ts"],"sourcesContent":["import { clamp } from '@vielzeug/arsenal';\nimport { define, html, inject, prop, ref } from '@vielzeug/ore';\nimport { computed, signal, watch as rippleWatch } from '@vielzeug/ripple';\n\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { createSpinnerControl } from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { disabledStateMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport styles from './number-input.css?inline';\n\nexport type OreNumberInputEvents = {\n  change: { originalEvent?: Event; value: number | null };\n  input: { originalEvent?: Event; value: number | null };\n};\n\n/** Number Input props */\nexport type OreNumberInputProps = {\n  /** Theme color */\n  color?: ThemeColor;\n  /** Disable interaction */\n  disabled?: boolean;\n  /** Error message */\n  error?: string;\n  /** Stretch to full width of container */\n  fullwidth?: boolean;\n  /** Helper text */\n  helper?: string;\n  /** Visible label */\n  label?: string;\n  /** Label placement: 'inset' renders the label inside the control box, 'outside' renders it above */\n  'label-placement'?: 'inset' | 'outside';\n  /** Large step (for Page Up/Down, default: 10 × step) */\n  'large-step'?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Minimum allowed value */\n  min?: number;\n  /** Form field name */\n  name?: string;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Make the input read-only */\n  readonly?: boolean;\n  /**\n   * JS-only callback fired with the inner `<input>` element when it mounts,\n   * and with `null` when it unmounts.\n   * Set as a JS property: `bitNumberInput.ref = (el) => { ... }`.\n   */\n  ref?: ((el: HTMLInputElement | null) => void) | null;\n  /** Border radius */\n  rounded?: string;\n  /** Component size */\n  size?: ComponentSize;\n  /** Step size for increment/decrement */\n  step?: number;\n  /** Current numeric value */\n  value?: number;\n  /** Visual variant */\n  variant?: VisualVariant;\n};\n\n/**\n * A numeric spin-button input with +/− controls, min/max clamping, and full keyboard support.\n *\n * @element ore-number-input\n *\n * @attr {number} value - Current value\n * @attr {number} min - Minimum value\n * @attr {number} max - Maximum value\n * @attr {number} step - Increment/decrement step (default: 1)\n * @attr {number} large-step - Step for Page Up/Down (default: 10)\n * @attr {boolean} disabled - Disables the control\n * @attr {boolean} readonly - Read-only mode\n * @attr {string} label - Visible label\n * @attr {string} name - Form field name\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} placeholder - Input placeholder\n *\n * @fires change - On committed value change. detail: { value: number | null, originalEvent?: Event }\n * @fires input - On every keystroke. detail: { value: number | null, originalEvent?: Event }\n *\n * @slot prefix - Content before the input (e.g. icon)\n * @slot suffix - Content after the input (e.g. unit label)\n * @slot label - Custom label content\n * @slot helper - Custom helper text content\n * @slot error - Custom error content\n *\n * @cssprop --number-input-height - Control height\n * @cssprop --number-input-border-color - Border color\n * @cssprop --number-input-radius - Border radius\n * @cssprop --number-input-bg - Background\n * @cssprop --number-input-btn-bg - Spin button background\n *\n * @part control - Control container.\n * @part decrement-btn - Decrement stepper button.\n * @part input - Input element.\n * @part increment-btn - Increment stepper button.\n * @example\n * ```html\n * <ore-number-input label=\"Quantity\" value=\"1\" min=\"1\" max=\"99\" step=\"1\"></ore-number-input>\n * ```\n */\nexport const NUMBER_INPUT_TAG = 'ore-number-input' as const;\ndefine<OreNumberInputProps, OreNumberInputEvents>(NUMBER_INPUT_TAG, {\n  formAssociated: true,\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    ...disablableBundle,\n    ...roundableBundle,\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    'large-step': prop.json(undefined as number | undefined),\n    max: prop.json(undefined as number | undefined),\n    min: prop.json(undefined as number | undefined),\n    name: prop.string(),\n    placeholder: prop.string(),\n    readonly: prop.bool(false),\n    ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n    step: prop.number(1),\n    value: prop.json(undefined as number | undefined),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props, { bind, emit, onElement, watch }) {\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(bind, props, formCtx);\n    const isDisabled = fCtxProps.disabled;\n    const isReadonly = computed(() => Boolean(props.readonly.value));\n\n    // Internal numeric value signal (string representation for the input)\n    const fieldValue = signal(props.value.value != null ? String(props.value.value) : '');\n\n    // Keep fieldValue in sync when props.value changes externally\n    rippleWatch(props.value, (v) => {\n      const next = v != null ? String(v) : '';\n\n      if (fieldValue.value !== next) fieldValue.value = next;\n    });\n\n    function parseValue(): number | null {\n      const v = fieldValue.value.trim();\n\n      if (!v) return null;\n\n      const n = Number.parseFloat(v);\n\n      return Number.isNaN(n) ? null : n;\n    }\n\n    function commit(val: number | null, originalEvent?: Event) {\n      const min = props.min.value != null ? Number(props.min.value) : undefined;\n      const max = props.max.value != null ? Number(props.max.value) : undefined;\n      const clamped = val != null ? clamp(val, min, max) : null;\n      const nextValue = clamped != null ? String(clamped) : '';\n\n      if (fieldValue.value !== nextValue) fieldValue.value = nextValue;\n\n      emit('change', { originalEvent, value: clamped });\n    }\n\n    const spinner = createSpinnerControl({\n      commit,\n      disabled: isDisabled,\n      largeStep: props['large-step'],\n      max: props.max,\n      min: props.min,\n      parse: parseValue,\n      readonly: isReadonly,\n      step: props.step,\n    });\n\n    // Composition uses ore-input's own documented `ref` prop (fired with the raw\n    // <input> on mount, `null` on unmount) instead of reaching into its shadow DOM —\n    // see `packages/refine/AGENTS.md` / input.ts's `ref` JSDoc for the supported contract.\n    // Set imperatively (rather than declared in the template) because ore's template\n    // engine treats a function-valued attr binding as a reactive getter to invoke, not\n    // a literal value to assign — a plain property assignment avoids that entirely.\n    const bitInputRef = ref<HTMLElementTagNameMap['ore-input']>();\n    let stopAriaWatch: (() => void) | null = null;\n    let detachListeners: (() => void) | null = null;\n    let refSub: { dispose(): void } | null = null;\n\n    const handleFieldRef = (rawInput: HTMLInputElement | null): void => {\n      if (!rawInput) {\n        stopAriaWatch?.();\n        detachListeners?.();\n        refSub?.dispose();\n        stopAriaWatch = null;\n        detachListeners = null;\n        refSub = null;\n        props.ref.value?.(null);\n\n        return;\n      }\n\n      rawInput.setAttribute('inputmode', 'decimal');\n      // The wrapper div is a plain layout container — WAI-ARIA spinbutton semantics\n      // live on the actually-focusable element (the raw <input> rendered by ore-input).\n      rawInput.setAttribute('role', 'spinbutton');\n\n      const handleChange = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        commit(Number.isNaN(n ?? NaN) ? null : n, e);\n      };\n\n      const handleInput = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        fieldValue.value = val;\n        emit('input', { originalEvent: e, value: Number.isNaN(n ?? NaN) ? null : n });\n      };\n\n      rawInput.addEventListener('change', handleChange);\n      rawInput.addEventListener('input', handleInput);\n      detachListeners = () => {\n        rawInput.removeEventListener('change', handleChange);\n        rawInput.removeEventListener('input', handleInput);\n      };\n\n      stopAriaWatch = watch(() => {\n        const now = parseValue();\n\n        if (now == null) rawInput.removeAttribute('aria-valuenow');\n        else rawInput.setAttribute('aria-valuenow', String(now));\n\n        if (props.min.value != null) rawInput.setAttribute('aria-valuemin', String(props.min.value));\n        else rawInput.removeAttribute('aria-valuemin');\n\n        if (props.max.value != null) rawInput.setAttribute('aria-valuemax', String(props.max.value));\n        else rawInput.removeAttribute('aria-valuemax');\n\n        if (isReadonly.value) rawInput.setAttribute('aria-readonly', 'true');\n        else rawInput.removeAttribute('aria-readonly');\n      });\n\n      // Fire user ref callback\n      props.ref.value?.(rawInput);\n\n      refSub = rippleWatch(props.ref, (cb) => {\n        cb?.(rawInput);\n      });\n    };\n\n    // ore-input's own onElement/ref lifecycle calls this back with `null` when its\n    // inner <input> unmounts, so no explicit teardown is needed here.\n    onElement(bitInputRef, (bitInputEl) => {\n      bitInputEl.ref = handleFieldRef;\n    });\n\n    bind({\n      attr: {\n        size: fCtxProps.size,\n        value: () => fieldValue.value || null,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    const isNonInteractive = computed(() => isDisabled.value || isReadonly.value);\n\n    return html`\n      <div class=\"wrapper\" part=\"control\" @keydown=\"${(e: KeyboardEvent) => spinner.handleKeydown(e)}\">\n        <button\n          type=\"button\"\n          part=\"decrement-btn\"\n          aria-label=\"Decrease\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMin()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(-(Number(props.step.value) || 1), e)}\">\n          <ore-icon name=\"minus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n        <ore-input\n          class=\"field\"\n          part=\"field\"\n          ref=\"${bitInputRef}\"\n          :value=\"${() => fieldValue.value}\"\n          :label=\"${() => props.label.value ?? ''}\"\n          :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n          :placeholder=\"${() => props.placeholder.value ?? ''}\"\n          :name=\"${() => props.name.value ?? ''}\"\n          :helper=\"${() => props.helper.value ?? ''}\"\n          :error=\"${() => props.error.value ?? ''}\"\n          :size=\"${fCtxProps.size}\"\n          :color=\"${() => props.color.value ?? ''}\"\n          :variant=\"${() => props.variant.value ?? ''}\"\n          :rounded=\"${() => props.rounded.value}\"\n          ?disabled=\"${isDisabled}\"\n          ?readonly=\"${isReadonly}\"\n          ?fullwidth=\"${() => false}\">\n        </ore-input>\n        <button\n          type=\"button\"\n          part=\"increment-btn\"\n          aria-label=\"Increase\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMax()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(Number(props.step.value) || 1, e)}\">\n          <ore-icon name=\"plus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [disabledStateMixin, styles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"number-input.cjs","names":[],"sources":["../src/inputs/number-input/number-input.ts"],"sourcesContent":["import { clamp } from '@vielzeug/arsenal';\nimport { define, html, inject, prop, ref, bind, onElement, useEmit, watchEffect } from '@vielzeug/ore';\nimport { computed, signal, watch as rippleWatch } from '@vielzeug/ripple';\n\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { createSpinnerControl } from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { disabledStateMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport styles from './number-input.css?inline';\n\nexport type OreNumberInputEvents = {\n  change: { originalEvent?: Event; value: number | null };\n  input: { originalEvent?: Event; value: number | null };\n};\n\n/** Number Input props */\nexport type OreNumberInputProps = {\n  /** Theme color */\n  color?: ThemeColor;\n  /** Disable interaction */\n  disabled?: boolean;\n  /** Error message */\n  error?: string;\n  /** Stretch to full width of container */\n  fullwidth?: boolean;\n  /** Helper text */\n  helper?: string;\n  /** Visible label */\n  label?: string;\n  /** Label placement: 'inset' renders the label inside the control box, 'outside' renders it above */\n  'label-placement'?: 'inset' | 'outside';\n  /** Large step (for Page Up/Down, default: 10 × step) */\n  'large-step'?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Minimum allowed value */\n  min?: number;\n  /** Form field name */\n  name?: string;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Make the input read-only */\n  readonly?: boolean;\n  /**\n   * JS-only callback fired with the inner `<input>` element when it mounts,\n   * and with `null` when it unmounts.\n   * Set as a JS property: `bitNumberInput.ref = (el) => { ... }`.\n   */\n  ref?: ((el: HTMLInputElement | null) => void) | null;\n  /** Border radius */\n  rounded?: string;\n  /** Component size */\n  size?: ComponentSize;\n  /** Step size for increment/decrement */\n  step?: number;\n  /** Current numeric value */\n  value?: number;\n  /** Visual variant */\n  variant?: VisualVariant;\n};\n\n/**\n * A numeric spin-button input with +/− controls, min/max clamping, and full keyboard support.\n *\n * @element ore-number-input\n *\n * @attr {number} value - Current value\n * @attr {number} min - Minimum value\n * @attr {number} max - Maximum value\n * @attr {number} step - Increment/decrement step (default: 1)\n * @attr {number} large-step - Step for Page Up/Down (default: 10)\n * @attr {boolean} disabled - Disables the control\n * @attr {boolean} readonly - Read-only mode\n * @attr {string} label - Visible label\n * @attr {string} name - Form field name\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} placeholder - Input placeholder\n *\n * @fires change - On committed value change. detail: { value: number | null, originalEvent?: Event }\n * @fires input - On every keystroke. detail: { value: number | null, originalEvent?: Event }\n *\n * @slot prefix - Content before the input (e.g. icon)\n * @slot suffix - Content after the input (e.g. unit label)\n * @slot label - Custom label content\n * @slot helper - Custom helper text content\n * @slot error - Custom error content\n *\n * @cssprop --number-input-height - Control height\n * @cssprop --number-input-border-color - Border color\n * @cssprop --number-input-radius - Border radius\n * @cssprop --number-input-bg - Background\n * @cssprop --number-input-btn-bg - Spin button background\n *\n * @part control - Control container.\n * @part decrement-btn - Decrement stepper button.\n * @part input - Input element.\n * @part increment-btn - Increment stepper button.\n * @example\n * ```html\n * <ore-number-input label=\"Quantity\" value=\"1\" min=\"1\" max=\"99\" step=\"1\"></ore-number-input>\n * ```\n */\nexport const NUMBER_INPUT_TAG = 'ore-number-input' as const;\ndefine<OreNumberInputProps>(NUMBER_INPUT_TAG, {\n  formAssociated: true,\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    ...disablableBundle,\n    ...roundableBundle,\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    'large-step': prop.json(undefined as number | undefined),\n    max: prop.json(undefined as number | undefined),\n    min: prop.json(undefined as number | undefined),\n    name: prop.string(),\n    placeholder: prop.string(),\n    readonly: prop.bool(false),\n    ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n    step: prop.number(1),\n    value: prop.json(undefined as number | undefined),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props) {\n    const emit = useEmit<OreNumberInputEvents>();\n    const watch = watchEffect;\n\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(props, formCtx);\n    const isDisabled = fCtxProps.disabled;\n    const isReadonly = computed(() => Boolean(props.readonly.value));\n\n    // Internal numeric value signal (string representation for the input)\n    const fieldValue = signal(props.value.value != null ? String(props.value.value) : '');\n\n    // Keep fieldValue in sync when props.value changes externally\n    rippleWatch(props.value, (v) => {\n      const next = v != null ? String(v) : '';\n\n      if (fieldValue.value !== next) fieldValue.value = next;\n    });\n\n    function parseValue(): number | null {\n      const v = fieldValue.value.trim();\n\n      if (!v) return null;\n\n      const n = Number.parseFloat(v);\n\n      return Number.isNaN(n) ? null : n;\n    }\n\n    function commit(val: number | null, originalEvent?: Event) {\n      const min = props.min.value != null ? Number(props.min.value) : undefined;\n      const max = props.max.value != null ? Number(props.max.value) : undefined;\n      const clamped = val != null ? clamp(val, min, max) : null;\n      const nextValue = clamped != null ? String(clamped) : '';\n\n      if (fieldValue.value !== nextValue) fieldValue.value = nextValue;\n\n      emit('change', { originalEvent, value: clamped });\n    }\n\n    const spinner = createSpinnerControl({\n      commit,\n      disabled: isDisabled,\n      largeStep: props['large-step'],\n      max: props.max,\n      min: props.min,\n      parse: parseValue,\n      readonly: isReadonly,\n      step: props.step,\n    });\n\n    // Composition uses ore-input's own documented `ref` prop (fired with the raw\n    // <input> on mount, `null` on unmount) instead of reaching into its shadow DOM —\n    // see `packages/refine/AGENTS.md` / input.ts's `ref` JSDoc for the supported contract.\n    // Set imperatively (rather than declared in the template) because ore's template\n    // engine treats a function-valued attr binding as a reactive getter to invoke, not\n    // a literal value to assign — a plain property assignment avoids that entirely.\n    const bitInputRef = ref<HTMLElementTagNameMap['ore-input']>();\n    let stopAriaWatch: (() => void) | null = null;\n    let detachListeners: (() => void) | null = null;\n    let refSub: { dispose(): void } | null = null;\n\n    const handleFieldRef = (rawInput: HTMLInputElement | null): void => {\n      if (!rawInput) {\n        stopAriaWatch?.();\n        detachListeners?.();\n        refSub?.dispose();\n        stopAriaWatch = null;\n        detachListeners = null;\n        refSub = null;\n        props.ref.value?.(null);\n\n        return;\n      }\n\n      rawInput.setAttribute('inputmode', 'decimal');\n      // The wrapper div is a plain layout container — WAI-ARIA spinbutton semantics\n      // live on the actually-focusable element (the raw <input> rendered by ore-input).\n      rawInput.setAttribute('role', 'spinbutton');\n\n      const handleChange = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        commit(Number.isNaN(n ?? NaN) ? null : n, e);\n      };\n\n      const handleInput = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        fieldValue.value = val;\n        emit('input', { originalEvent: e, value: Number.isNaN(n ?? NaN) ? null : n });\n      };\n\n      rawInput.addEventListener('change', handleChange);\n      rawInput.addEventListener('input', handleInput);\n      detachListeners = () => {\n        rawInput.removeEventListener('change', handleChange);\n        rawInput.removeEventListener('input', handleInput);\n      };\n\n      stopAriaWatch = watch(() => {\n        const now = parseValue();\n\n        if (now == null) rawInput.removeAttribute('aria-valuenow');\n        else rawInput.setAttribute('aria-valuenow', String(now));\n\n        if (props.min.value != null) rawInput.setAttribute('aria-valuemin', String(props.min.value));\n        else rawInput.removeAttribute('aria-valuemin');\n\n        if (props.max.value != null) rawInput.setAttribute('aria-valuemax', String(props.max.value));\n        else rawInput.removeAttribute('aria-valuemax');\n\n        if (isReadonly.value) rawInput.setAttribute('aria-readonly', 'true');\n        else rawInput.removeAttribute('aria-readonly');\n      });\n\n      // Fire user ref callback\n      props.ref.value?.(rawInput);\n\n      refSub = rippleWatch(props.ref, (cb) => {\n        cb?.(rawInput);\n      });\n    };\n\n    // ore-input's own onElement/ref lifecycle calls this back with `null` when its\n    // inner <input> unmounts, so no explicit teardown is needed here.\n    onElement(bitInputRef, (bitInputEl) => {\n      bitInputEl.ref = handleFieldRef;\n    });\n\n    bind({\n      attr: {\n        size: fCtxProps.size,\n        value: () => fieldValue.value || null,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    const isNonInteractive = computed(() => isDisabled.value || isReadonly.value);\n\n    return html`\n      <div class=\"wrapper\" part=\"control\" @keydown=\"${(e: KeyboardEvent) => spinner.handleKeydown(e)}\">\n        <button\n          type=\"button\"\n          part=\"decrement-btn\"\n          aria-label=\"Decrease\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMin()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(-(Number(props.step.value) || 1), e)}\">\n          <ore-icon name=\"minus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n        <ore-input\n          class=\"field\"\n          part=\"field\"\n          ref=\"${bitInputRef}\"\n          :value=\"${() => fieldValue.value}\"\n          :label=\"${() => props.label.value ?? ''}\"\n          :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n          :placeholder=\"${() => props.placeholder.value ?? ''}\"\n          :name=\"${() => props.name.value ?? ''}\"\n          :helper=\"${() => props.helper.value ?? ''}\"\n          :error=\"${() => props.error.value ?? ''}\"\n          :size=\"${fCtxProps.size}\"\n          :color=\"${() => props.color.value ?? ''}\"\n          :variant=\"${() => props.variant.value ?? ''}\"\n          :rounded=\"${() => props.rounded.value}\"\n          ?disabled=\"${isDisabled}\"\n          ?readonly=\"${isReadonly}\"\n          ?fullwidth=\"${() => false}\">\n        </ore-input>\n        <button\n          type=\"button\"\n          part=\"increment-btn\"\n          aria-label=\"Increase\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMax()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(Number(props.step.value) || 1, e)}\">\n          <ore-icon name=\"plus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [disabledStateMixin, styles],\n});\n"],"mappings":"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"}

package/dist/number-input.js

@@ -2,131 +2,131 @@ import { disabledStateMixin as e } from "./styles/mixins/states.css.js";
 import { disablableBundle as t, roundableBundle as n, sizableBundle as r, themableBundle as i } from "./shared/prop-bundles.js";
 import { createSpinnerControl as a } from "./headless/spinner.js";
 import { FORM_CTX as o, useFormContext as s } from "./inputs/shared/form-context.js";
-import c from "./inputs/number-input/number-input.css?inline.js";
-import { define as l, html as u, inject as d, prop as f, ref as p } from "@vielzeug/ore";
-import { computed as m, signal as h, watch as g } from "@vielzeug/ripple";
-import { clamp as _ } from "@vielzeug/arsenal";
+import c from "./inputs/number-input/number-input.css.js";
+import { bind as l, define as u, html as d, inject as f, onElement as p, prop as m, ref as h, useEmit as g, watchEffect as _ } from "@vielzeug/ore";
+import { computed as v, signal as y, watch as b } from "@vielzeug/ripple";
+import { clamp as x } from "@vielzeug/arsenal";
 //#region src/inputs/number-input/number-input.ts
-var v = "ore-number-input";
-l(v, {
+var S = "ore-number-input";
+u(S, {
 	formAssociated: !0,
 	props: {
 		...i,
 		...r,
 		...t,
 		...n,
-		error: f.string(),
-		fullwidth: f.bool(!1),
-		helper: f.string(),
-		label: f.string(),
-		"label-placement": f.oneOf(["inset", "outside"], "inset"),
-		"large-step": f.json(void 0),
-		max: f.json(void 0),
-		min: f.json(void 0),
-		name: f.string(),
-		placeholder: f.string(),
-		readonly: f.bool(!1),
-		ref: f.json(void 0),
-		step: f.number(1),
-		value: f.json(void 0),
-		variant: f.string()
+		error: m.string(),
+		fullwidth: m.bool(!1),
+		helper: m.string(),
+		label: m.string(),
+		"label-placement": m.oneOf(["inset", "outside"], "inset"),
+		"large-step": m.json(void 0),
+		max: m.json(void 0),
+		min: m.json(void 0),
+		name: m.string(),
+		placeholder: m.string(),
+		readonly: m.bool(!1),
+		ref: m.json(void 0),
+		step: m.number(1),
+		value: m.json(void 0),
+		variant: m.string()
 	},
-	setup(e, { bind: t, emit: n, onElement: r, watch: i }) {
-		let c = s(t, e, d(o)), l = c.disabled, f = m(() => !!e.readonly.value), v = h(e.value.value == null ? "" : String(e.value.value));
-		g(e.value, (e) => {
+	setup(e) {
+		let t = g(), n = _, r = s(e, f(o)), i = r.disabled, c = v(() => !!e.readonly.value), u = y(e.value.value == null ? "" : String(e.value.value));
+		b(e.value, (e) => {
 			let t = e == null ? "" : String(e);
-			v.value !== t && (v.value = t);
+			u.value !== t && (u.value = t);
 		});
-		function y() {
-			let e = v.value.trim();
+		function m() {
+			let e = u.value.trim();
 			if (!e) return null;
 			let t = Number.parseFloat(e);
 			return Number.isNaN(t) ? null : t;
 		}
-		function b(t, r) {
-			let i = e.min.value == null ? void 0 : Number(e.min.value), a = e.max.value == null ? void 0 : Number(e.max.value), o = t == null ? null : _(t, i, a), s = o == null ? "" : String(o);
-			v.value !== s && (v.value = s), n("change", {
+		function S(n, r) {
+			let i = e.min.value == null ? void 0 : Number(e.min.value), a = e.max.value == null ? void 0 : Number(e.max.value), o = n == null ? null : x(n, i, a), s = o == null ? "" : String(o);
+			u.value !== s && (u.value = s), t("change", {
 				originalEvent: r,
 				value: o
 			});
 		}
-		let x = a({
-			commit: b,
-			disabled: l,
+		let C = a({
+			commit: S,
+			disabled: i,
 			largeStep: e["large-step"],
 			max: e.max,
 			min: e.min,
-			parse: y,
-			readonly: f,
+			parse: m,
+			readonly: c,
 			step: e.step
-		}), S = p(), C = null, w = null, T = null, E = (t) => {
-			if (!t) {
-				C?.(), w?.(), T?.dispose(), C = null, w = null, T = null, e.ref.value?.(null);
+		}), w = h(), T = null, E = null, D = null, O = (r) => {
+			if (!r) {
+				T?.(), E?.(), D?.dispose(), T = null, E = null, D = null, e.ref.value?.(null);
 				return;
 			}
-			t.setAttribute("inputmode", "decimal"), t.setAttribute("role", "spinbutton");
-			let r = (e) => {
+			r.setAttribute("inputmode", "decimal"), r.setAttribute("role", "spinbutton");
+			let i = (e) => {
 				let t = e.target.value, n = t === "" ? null : Number.parseFloat(t);
-				b(Number.isNaN(n ?? NaN) ? null : n, e);
+				S(Number.isNaN(n ?? NaN) ? null : n, e);
 			}, a = (e) => {
-				let t = e.target.value, r = t === "" ? null : Number.parseFloat(t);
-				v.value = t, n("input", {
+				let n = e.target.value, r = n === "" ? null : Number.parseFloat(n);
+				u.value = n, t("input", {
 					originalEvent: e,
 					value: Number.isNaN(r ?? NaN) ? null : r
 				});
 			};
-			t.addEventListener("change", r), t.addEventListener("input", a), w = () => {
-				t.removeEventListener("change", r), t.removeEventListener("input", a);
-			}, C = i(() => {
-				let n = y();
-				n == null ? t.removeAttribute("aria-valuenow") : t.setAttribute("aria-valuenow", String(n)), e.min.value == null ? t.removeAttribute("aria-valuemin") : t.setAttribute("aria-valuemin", String(e.min.value)), e.max.value == null ? t.removeAttribute("aria-valuemax") : t.setAttribute("aria-valuemax", String(e.max.value)), f.value ? t.setAttribute("aria-readonly", "true") : t.removeAttribute("aria-readonly");
-			}), e.ref.value?.(t), T = g(e.ref, (e) => {
-				e?.(t);
+			r.addEventListener("change", i), r.addEventListener("input", a), E = () => {
+				r.removeEventListener("change", i), r.removeEventListener("input", a);
+			}, T = n(() => {
+				let t = m();
+				t == null ? r.removeAttribute("aria-valuenow") : r.setAttribute("aria-valuenow", String(t)), e.min.value == null ? r.removeAttribute("aria-valuemin") : r.setAttribute("aria-valuemin", String(e.min.value)), e.max.value == null ? r.removeAttribute("aria-valuemax") : r.setAttribute("aria-valuemax", String(e.max.value)), c.value ? r.setAttribute("aria-readonly", "true") : r.removeAttribute("aria-readonly");
+			}), e.ref.value?.(r), D = b(e.ref, (e) => {
+				e?.(r);
 			});
 		};
-		r(S, (e) => {
-			e.ref = E;
-		}), t({ attr: {
-			size: c.size,
-			value: () => v.value || null,
-			variant: c.variant
+		p(w, (e) => {
+			e.ref = O;
+		}), l({ attr: {
+			size: r.size,
+			value: () => u.value || null,
+			variant: r.variant
 		} });
-		let D = m(() => l.value || f.value);
-		return u`
-      <div class="wrapper" part="control" @keydown="${(e) => x.handleKeydown(e)}">
+		let k = v(() => i.value || c.value);
+		return d`
+      <div class="wrapper" part="control" @keydown="${(e) => C.handleKeydown(e)}">
         <button
           type="button"
           part="decrement-btn"
           aria-label="Decrease"
-          ?disabled="${() => D.value || x.atMin()}"
-          @click="${(t) => x.incrementBy(-(Number(e.step.value) || 1), t)}">
+          ?disabled="${() => k.value || C.atMin()}"
+          @click="${(t) => C.incrementBy(-(Number(e.step.value) || 1), t)}">
           <ore-icon name="minus" size="14" stroke-width="2.5" aria-hidden="true"></ore-icon>
         </button>
         <ore-input
           class="field"
           part="field"
-          ref="${S}"
-          :value="${() => v.value}"
+          ref="${w}"
+          :value="${() => u.value}"
           :label="${() => e.label.value ?? ""}"
           :label-placement="${() => e["label-placement"].value ?? "inset"}"
           :placeholder="${() => e.placeholder.value ?? ""}"
           :name="${() => e.name.value ?? ""}"
           :helper="${() => e.helper.value ?? ""}"
           :error="${() => e.error.value ?? ""}"
-          :size="${c.size}"
+          :size="${r.size}"
           :color="${() => e.color.value ?? ""}"
           :variant="${() => e.variant.value ?? ""}"
           :rounded="${() => e.rounded.value}"
-          ?disabled="${l}"
-          ?readonly="${f}"
+          ?disabled="${i}"
+          ?readonly="${c}"
           ?fullwidth="${() => !1}">
         </ore-input>
         <button
           type="button"
           part="increment-btn"
           aria-label="Increase"
-          ?disabled="${() => D.value || x.atMax()}"
-          @click="${(t) => x.incrementBy(Number(e.step.value) || 1, t)}">
+          ?disabled="${() => k.value || C.atMax()}"
+          @click="${(t) => C.incrementBy(Number(e.step.value) || 1, t)}">
           <ore-icon name="plus" size="14" stroke-width="2.5" aria-hidden="true"></ore-icon>
         </button>
       </div>
@@ -136,6 +136,6 @@ l(v, {
 	styles: [e, c]
 });
 //#endregion
-export { v as NUMBER_INPUT_TAG };
+export { S as NUMBER_INPUT_TAG };
 
 //# sourceMappingURL=number-input.js.map

package/dist/number-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.js","names":[],"sources":["../src/inputs/number-input/number-input.ts"],"sourcesContent":["import { clamp } from '@vielzeug/arsenal';\nimport { define, html, inject, prop, ref } from '@vielzeug/ore';\nimport { computed, signal, watch as rippleWatch } from '@vielzeug/ripple';\n\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { createSpinnerControl } from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { disabledStateMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport styles from './number-input.css?inline';\n\nexport type OreNumberInputEvents = {\n  change: { originalEvent?: Event; value: number | null };\n  input: { originalEvent?: Event; value: number | null };\n};\n\n/** Number Input props */\nexport type OreNumberInputProps = {\n  /** Theme color */\n  color?: ThemeColor;\n  /** Disable interaction */\n  disabled?: boolean;\n  /** Error message */\n  error?: string;\n  /** Stretch to full width of container */\n  fullwidth?: boolean;\n  /** Helper text */\n  helper?: string;\n  /** Visible label */\n  label?: string;\n  /** Label placement: 'inset' renders the label inside the control box, 'outside' renders it above */\n  'label-placement'?: 'inset' | 'outside';\n  /** Large step (for Page Up/Down, default: 10 × step) */\n  'large-step'?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Minimum allowed value */\n  min?: number;\n  /** Form field name */\n  name?: string;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Make the input read-only */\n  readonly?: boolean;\n  /**\n   * JS-only callback fired with the inner `<input>` element when it mounts,\n   * and with `null` when it unmounts.\n   * Set as a JS property: `bitNumberInput.ref = (el) => { ... }`.\n   */\n  ref?: ((el: HTMLInputElement | null) => void) | null;\n  /** Border radius */\n  rounded?: string;\n  /** Component size */\n  size?: ComponentSize;\n  /** Step size for increment/decrement */\n  step?: number;\n  /** Current numeric value */\n  value?: number;\n  /** Visual variant */\n  variant?: VisualVariant;\n};\n\n/**\n * A numeric spin-button input with +/− controls, min/max clamping, and full keyboard support.\n *\n * @element ore-number-input\n *\n * @attr {number} value - Current value\n * @attr {number} min - Minimum value\n * @attr {number} max - Maximum value\n * @attr {number} step - Increment/decrement step (default: 1)\n * @attr {number} large-step - Step for Page Up/Down (default: 10)\n * @attr {boolean} disabled - Disables the control\n * @attr {boolean} readonly - Read-only mode\n * @attr {string} label - Visible label\n * @attr {string} name - Form field name\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} placeholder - Input placeholder\n *\n * @fires change - On committed value change. detail: { value: number | null, originalEvent?: Event }\n * @fires input - On every keystroke. detail: { value: number | null, originalEvent?: Event }\n *\n * @slot prefix - Content before the input (e.g. icon)\n * @slot suffix - Content after the input (e.g. unit label)\n * @slot label - Custom label content\n * @slot helper - Custom helper text content\n * @slot error - Custom error content\n *\n * @cssprop --number-input-height - Control height\n * @cssprop --number-input-border-color - Border color\n * @cssprop --number-input-radius - Border radius\n * @cssprop --number-input-bg - Background\n * @cssprop --number-input-btn-bg - Spin button background\n *\n * @part control - Control container.\n * @part decrement-btn - Decrement stepper button.\n * @part input - Input element.\n * @part increment-btn - Increment stepper button.\n * @example\n * ```html\n * <ore-number-input label=\"Quantity\" value=\"1\" min=\"1\" max=\"99\" step=\"1\"></ore-number-input>\n * ```\n */\nexport const NUMBER_INPUT_TAG = 'ore-number-input' as const;\ndefine<OreNumberInputProps, OreNumberInputEvents>(NUMBER_INPUT_TAG, {\n  formAssociated: true,\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    ...disablableBundle,\n    ...roundableBundle,\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    'large-step': prop.json(undefined as number | undefined),\n    max: prop.json(undefined as number | undefined),\n    min: prop.json(undefined as number | undefined),\n    name: prop.string(),\n    placeholder: prop.string(),\n    readonly: prop.bool(false),\n    ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n    step: prop.number(1),\n    value: prop.json(undefined as number | undefined),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props, { bind, emit, onElement, watch }) {\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(bind, props, formCtx);\n    const isDisabled = fCtxProps.disabled;\n    const isReadonly = computed(() => Boolean(props.readonly.value));\n\n    // Internal numeric value signal (string representation for the input)\n    const fieldValue = signal(props.value.value != null ? String(props.value.value) : '');\n\n    // Keep fieldValue in sync when props.value changes externally\n    rippleWatch(props.value, (v) => {\n      const next = v != null ? String(v) : '';\n\n      if (fieldValue.value !== next) fieldValue.value = next;\n    });\n\n    function parseValue(): number | null {\n      const v = fieldValue.value.trim();\n\n      if (!v) return null;\n\n      const n = Number.parseFloat(v);\n\n      return Number.isNaN(n) ? null : n;\n    }\n\n    function commit(val: number | null, originalEvent?: Event) {\n      const min = props.min.value != null ? Number(props.min.value) : undefined;\n      const max = props.max.value != null ? Number(props.max.value) : undefined;\n      const clamped = val != null ? clamp(val, min, max) : null;\n      const nextValue = clamped != null ? String(clamped) : '';\n\n      if (fieldValue.value !== nextValue) fieldValue.value = nextValue;\n\n      emit('change', { originalEvent, value: clamped });\n    }\n\n    const spinner = createSpinnerControl({\n      commit,\n      disabled: isDisabled,\n      largeStep: props['large-step'],\n      max: props.max,\n      min: props.min,\n      parse: parseValue,\n      readonly: isReadonly,\n      step: props.step,\n    });\n\n    // Composition uses ore-input's own documented `ref` prop (fired with the raw\n    // <input> on mount, `null` on unmount) instead of reaching into its shadow DOM —\n    // see `packages/refine/AGENTS.md` / input.ts's `ref` JSDoc for the supported contract.\n    // Set imperatively (rather than declared in the template) because ore's template\n    // engine treats a function-valued attr binding as a reactive getter to invoke, not\n    // a literal value to assign — a plain property assignment avoids that entirely.\n    const bitInputRef = ref<HTMLElementTagNameMap['ore-input']>();\n    let stopAriaWatch: (() => void) | null = null;\n    let detachListeners: (() => void) | null = null;\n    let refSub: { dispose(): void } | null = null;\n\n    const handleFieldRef = (rawInput: HTMLInputElement | null): void => {\n      if (!rawInput) {\n        stopAriaWatch?.();\n        detachListeners?.();\n        refSub?.dispose();\n        stopAriaWatch = null;\n        detachListeners = null;\n        refSub = null;\n        props.ref.value?.(null);\n\n        return;\n      }\n\n      rawInput.setAttribute('inputmode', 'decimal');\n      // The wrapper div is a plain layout container — WAI-ARIA spinbutton semantics\n      // live on the actually-focusable element (the raw <input> rendered by ore-input).\n      rawInput.setAttribute('role', 'spinbutton');\n\n      const handleChange = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        commit(Number.isNaN(n ?? NaN) ? null : n, e);\n      };\n\n      const handleInput = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        fieldValue.value = val;\n        emit('input', { originalEvent: e, value: Number.isNaN(n ?? NaN) ? null : n });\n      };\n\n      rawInput.addEventListener('change', handleChange);\n      rawInput.addEventListener('input', handleInput);\n      detachListeners = () => {\n        rawInput.removeEventListener('change', handleChange);\n        rawInput.removeEventListener('input', handleInput);\n      };\n\n      stopAriaWatch = watch(() => {\n        const now = parseValue();\n\n        if (now == null) rawInput.removeAttribute('aria-valuenow');\n        else rawInput.setAttribute('aria-valuenow', String(now));\n\n        if (props.min.value != null) rawInput.setAttribute('aria-valuemin', String(props.min.value));\n        else rawInput.removeAttribute('aria-valuemin');\n\n        if (props.max.value != null) rawInput.setAttribute('aria-valuemax', String(props.max.value));\n        else rawInput.removeAttribute('aria-valuemax');\n\n        if (isReadonly.value) rawInput.setAttribute('aria-readonly', 'true');\n        else rawInput.removeAttribute('aria-readonly');\n      });\n\n      // Fire user ref callback\n      props.ref.value?.(rawInput);\n\n      refSub = rippleWatch(props.ref, (cb) => {\n        cb?.(rawInput);\n      });\n    };\n\n    // ore-input's own onElement/ref lifecycle calls this back with `null` when its\n    // inner <input> unmounts, so no explicit teardown is needed here.\n    onElement(bitInputRef, (bitInputEl) => {\n      bitInputEl.ref = handleFieldRef;\n    });\n\n    bind({\n      attr: {\n        size: fCtxProps.size,\n        value: () => fieldValue.value || null,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    const isNonInteractive = computed(() => isDisabled.value || isReadonly.value);\n\n    return html`\n      <div class=\"wrapper\" part=\"control\" @keydown=\"${(e: KeyboardEvent) => spinner.handleKeydown(e)}\">\n        <button\n          type=\"button\"\n          part=\"decrement-btn\"\n          aria-label=\"Decrease\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMin()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(-(Number(props.step.value) || 1), e)}\">\n          <ore-icon name=\"minus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n        <ore-input\n          class=\"field\"\n          part=\"field\"\n          ref=\"${bitInputRef}\"\n          :value=\"${() => fieldValue.value}\"\n          :label=\"${() => props.label.value ?? ''}\"\n          :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n          :placeholder=\"${() => props.placeholder.value ?? ''}\"\n          :name=\"${() => props.name.value ?? ''}\"\n          :helper=\"${() => props.helper.value ?? ''}\"\n          :error=\"${() => props.error.value ?? ''}\"\n          :size=\"${fCtxProps.size}\"\n          :color=\"${() => props.color.value ?? ''}\"\n          :variant=\"${() => props.variant.value ?? ''}\"\n          :rounded=\"${() => props.rounded.value}\"\n          ?disabled=\"${isDisabled}\"\n          ?readonly=\"${isReadonly}\"\n          ?fullwidth=\"${() => false}\">\n        </ore-input>\n        <button\n          type=\"button\"\n          part=\"increment-btn\"\n          aria-label=\"Increase\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMax()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(Number(props.step.value) || 1, e)}\">\n          <ore-icon name=\"plus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [disabledStateMixin, styles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"number-input.js","names":[],"sources":["../src/inputs/number-input/number-input.ts"],"sourcesContent":["import { clamp } from '@vielzeug/arsenal';\nimport { define, html, inject, prop, ref, bind, onElement, useEmit, watchEffect } from '@vielzeug/ore';\nimport { computed, signal, watch as rippleWatch } from '@vielzeug/ripple';\n\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { createSpinnerControl } from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { disabledStateMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport styles from './number-input.css?inline';\n\nexport type OreNumberInputEvents = {\n  change: { originalEvent?: Event; value: number | null };\n  input: { originalEvent?: Event; value: number | null };\n};\n\n/** Number Input props */\nexport type OreNumberInputProps = {\n  /** Theme color */\n  color?: ThemeColor;\n  /** Disable interaction */\n  disabled?: boolean;\n  /** Error message */\n  error?: string;\n  /** Stretch to full width of container */\n  fullwidth?: boolean;\n  /** Helper text */\n  helper?: string;\n  /** Visible label */\n  label?: string;\n  /** Label placement: 'inset' renders the label inside the control box, 'outside' renders it above */\n  'label-placement'?: 'inset' | 'outside';\n  /** Large step (for Page Up/Down, default: 10 × step) */\n  'large-step'?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Minimum allowed value */\n  min?: number;\n  /** Form field name */\n  name?: string;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Make the input read-only */\n  readonly?: boolean;\n  /**\n   * JS-only callback fired with the inner `<input>` element when it mounts,\n   * and with `null` when it unmounts.\n   * Set as a JS property: `bitNumberInput.ref = (el) => { ... }`.\n   */\n  ref?: ((el: HTMLInputElement | null) => void) | null;\n  /** Border radius */\n  rounded?: string;\n  /** Component size */\n  size?: ComponentSize;\n  /** Step size for increment/decrement */\n  step?: number;\n  /** Current numeric value */\n  value?: number;\n  /** Visual variant */\n  variant?: VisualVariant;\n};\n\n/**\n * A numeric spin-button input with +/− controls, min/max clamping, and full keyboard support.\n *\n * @element ore-number-input\n *\n * @attr {number} value - Current value\n * @attr {number} min - Minimum value\n * @attr {number} max - Maximum value\n * @attr {number} step - Increment/decrement step (default: 1)\n * @attr {number} large-step - Step for Page Up/Down (default: 10)\n * @attr {boolean} disabled - Disables the control\n * @attr {boolean} readonly - Read-only mode\n * @attr {string} label - Visible label\n * @attr {string} name - Form field name\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} placeholder - Input placeholder\n *\n * @fires change - On committed value change. detail: { value: number | null, originalEvent?: Event }\n * @fires input - On every keystroke. detail: { value: number | null, originalEvent?: Event }\n *\n * @slot prefix - Content before the input (e.g. icon)\n * @slot suffix - Content after the input (e.g. unit label)\n * @slot label - Custom label content\n * @slot helper - Custom helper text content\n * @slot error - Custom error content\n *\n * @cssprop --number-input-height - Control height\n * @cssprop --number-input-border-color - Border color\n * @cssprop --number-input-radius - Border radius\n * @cssprop --number-input-bg - Background\n * @cssprop --number-input-btn-bg - Spin button background\n *\n * @part control - Control container.\n * @part decrement-btn - Decrement stepper button.\n * @part input - Input element.\n * @part increment-btn - Increment stepper button.\n * @example\n * ```html\n * <ore-number-input label=\"Quantity\" value=\"1\" min=\"1\" max=\"99\" step=\"1\"></ore-number-input>\n * ```\n */\nexport const NUMBER_INPUT_TAG = 'ore-number-input' as const;\ndefine<OreNumberInputProps>(NUMBER_INPUT_TAG, {\n  formAssociated: true,\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    ...disablableBundle,\n    ...roundableBundle,\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    'large-step': prop.json(undefined as number | undefined),\n    max: prop.json(undefined as number | undefined),\n    min: prop.json(undefined as number | undefined),\n    name: prop.string(),\n    placeholder: prop.string(),\n    readonly: prop.bool(false),\n    ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n    step: prop.number(1),\n    value: prop.json(undefined as number | undefined),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props) {\n    const emit = useEmit<OreNumberInputEvents>();\n    const watch = watchEffect;\n\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(props, formCtx);\n    const isDisabled = fCtxProps.disabled;\n    const isReadonly = computed(() => Boolean(props.readonly.value));\n\n    // Internal numeric value signal (string representation for the input)\n    const fieldValue = signal(props.value.value != null ? String(props.value.value) : '');\n\n    // Keep fieldValue in sync when props.value changes externally\n    rippleWatch(props.value, (v) => {\n      const next = v != null ? String(v) : '';\n\n      if (fieldValue.value !== next) fieldValue.value = next;\n    });\n\n    function parseValue(): number | null {\n      const v = fieldValue.value.trim();\n\n      if (!v) return null;\n\n      const n = Number.parseFloat(v);\n\n      return Number.isNaN(n) ? null : n;\n    }\n\n    function commit(val: number | null, originalEvent?: Event) {\n      const min = props.min.value != null ? Number(props.min.value) : undefined;\n      const max = props.max.value != null ? Number(props.max.value) : undefined;\n      const clamped = val != null ? clamp(val, min, max) : null;\n      const nextValue = clamped != null ? String(clamped) : '';\n\n      if (fieldValue.value !== nextValue) fieldValue.value = nextValue;\n\n      emit('change', { originalEvent, value: clamped });\n    }\n\n    const spinner = createSpinnerControl({\n      commit,\n      disabled: isDisabled,\n      largeStep: props['large-step'],\n      max: props.max,\n      min: props.min,\n      parse: parseValue,\n      readonly: isReadonly,\n      step: props.step,\n    });\n\n    // Composition uses ore-input's own documented `ref` prop (fired with the raw\n    // <input> on mount, `null` on unmount) instead of reaching into its shadow DOM —\n    // see `packages/refine/AGENTS.md` / input.ts's `ref` JSDoc for the supported contract.\n    // Set imperatively (rather than declared in the template) because ore's template\n    // engine treats a function-valued attr binding as a reactive getter to invoke, not\n    // a literal value to assign — a plain property assignment avoids that entirely.\n    const bitInputRef = ref<HTMLElementTagNameMap['ore-input']>();\n    let stopAriaWatch: (() => void) | null = null;\n    let detachListeners: (() => void) | null = null;\n    let refSub: { dispose(): void } | null = null;\n\n    const handleFieldRef = (rawInput: HTMLInputElement | null): void => {\n      if (!rawInput) {\n        stopAriaWatch?.();\n        detachListeners?.();\n        refSub?.dispose();\n        stopAriaWatch = null;\n        detachListeners = null;\n        refSub = null;\n        props.ref.value?.(null);\n\n        return;\n      }\n\n      rawInput.setAttribute('inputmode', 'decimal');\n      // The wrapper div is a plain layout container — WAI-ARIA spinbutton semantics\n      // live on the actually-focusable element (the raw <input> rendered by ore-input).\n      rawInput.setAttribute('role', 'spinbutton');\n\n      const handleChange = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        commit(Number.isNaN(n ?? NaN) ? null : n, e);\n      };\n\n      const handleInput = (e: Event) => {\n        const val = (e.target as HTMLInputElement).value;\n        const n = val !== '' ? Number.parseFloat(val) : null;\n\n        fieldValue.value = val;\n        emit('input', { originalEvent: e, value: Number.isNaN(n ?? NaN) ? null : n });\n      };\n\n      rawInput.addEventListener('change', handleChange);\n      rawInput.addEventListener('input', handleInput);\n      detachListeners = () => {\n        rawInput.removeEventListener('change', handleChange);\n        rawInput.removeEventListener('input', handleInput);\n      };\n\n      stopAriaWatch = watch(() => {\n        const now = parseValue();\n\n        if (now == null) rawInput.removeAttribute('aria-valuenow');\n        else rawInput.setAttribute('aria-valuenow', String(now));\n\n        if (props.min.value != null) rawInput.setAttribute('aria-valuemin', String(props.min.value));\n        else rawInput.removeAttribute('aria-valuemin');\n\n        if (props.max.value != null) rawInput.setAttribute('aria-valuemax', String(props.max.value));\n        else rawInput.removeAttribute('aria-valuemax');\n\n        if (isReadonly.value) rawInput.setAttribute('aria-readonly', 'true');\n        else rawInput.removeAttribute('aria-readonly');\n      });\n\n      // Fire user ref callback\n      props.ref.value?.(rawInput);\n\n      refSub = rippleWatch(props.ref, (cb) => {\n        cb?.(rawInput);\n      });\n    };\n\n    // ore-input's own onElement/ref lifecycle calls this back with `null` when its\n    // inner <input> unmounts, so no explicit teardown is needed here.\n    onElement(bitInputRef, (bitInputEl) => {\n      bitInputEl.ref = handleFieldRef;\n    });\n\n    bind({\n      attr: {\n        size: fCtxProps.size,\n        value: () => fieldValue.value || null,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    const isNonInteractive = computed(() => isDisabled.value || isReadonly.value);\n\n    return html`\n      <div class=\"wrapper\" part=\"control\" @keydown=\"${(e: KeyboardEvent) => spinner.handleKeydown(e)}\">\n        <button\n          type=\"button\"\n          part=\"decrement-btn\"\n          aria-label=\"Decrease\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMin()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(-(Number(props.step.value) || 1), e)}\">\n          <ore-icon name=\"minus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n        <ore-input\n          class=\"field\"\n          part=\"field\"\n          ref=\"${bitInputRef}\"\n          :value=\"${() => fieldValue.value}\"\n          :label=\"${() => props.label.value ?? ''}\"\n          :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n          :placeholder=\"${() => props.placeholder.value ?? ''}\"\n          :name=\"${() => props.name.value ?? ''}\"\n          :helper=\"${() => props.helper.value ?? ''}\"\n          :error=\"${() => props.error.value ?? ''}\"\n          :size=\"${fCtxProps.size}\"\n          :color=\"${() => props.color.value ?? ''}\"\n          :variant=\"${() => props.variant.value ?? ''}\"\n          :rounded=\"${() => props.rounded.value}\"\n          ?disabled=\"${isDisabled}\"\n          ?readonly=\"${isReadonly}\"\n          ?fullwidth=\"${() => false}\">\n        </ore-input>\n        <button\n          type=\"button\"\n          part=\"increment-btn\"\n          aria-label=\"Increase\"\n          ?disabled=\"${() => isNonInteractive.value || spinner.atMax()}\"\n          @click=\"${(e: Event) => spinner.incrementBy(Number(props.step.value) || 1, e)}\">\n          <ore-icon name=\"plus\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n        </button>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [disabledStateMixin, styles],\n});\n"],"mappings":";;;;;;;;;AA2GA,IAAa,IAAmB;AAChC,EAA4B,GAAkB;CAC5C,gBAAgB;CAChB,OAAO;EACL,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,OAAO,EAAK,OAAO;EACnB,WAAW,EAAK,KAAK,EAAK;EAC1B,QAAQ,EAAK,OAAO;EACpB,OAAO,EAAK,OAAO;EACnB,mBAAmB,EAAK,MAAM,CAAC,SAAS,SAAS,GAAY,OAAO;EACpE,cAAc,EAAK,KAAK,KAAA,CAA+B;EACvD,KAAK,EAAK,KAAK,KAAA,CAA+B;EAC9C,KAAK,EAAK,KAAK,KAAA,CAA+B;EAC9C,MAAM,EAAK,OAAO;EAClB,aAAa,EAAK,OAAO;EACzB,UAAU,EAAK,KAAK,EAAK;EACzB,KAAK,EAAK,KAAK,KAAA,CAAuE;EACtF,MAAM,EAAK,OAAO,CAAC;EACnB,OAAO,EAAK,KAAK,KAAA,CAA+B;EAChD,SAAS,EAAK,OAAsB;CACtC;CACA,MAAM,GAAO;EACX,IAAM,IAAO,EAA8B,GACrC,IAAQ,GAGR,IAAY,EAAe,GADjB,EAAO,CACiB,CAAO,GACzC,IAAa,EAAU,UACvB,IAAa,QAAe,EAAQ,EAAM,SAAS,KAAM,GAGzD,IAAa,EAAO,EAAM,MAAM,SAAS,OAAmC,KAA5B,OAAO,EAAM,MAAM,KAAK,CAAM;EAGpF,EAAY,EAAM,QAAQ,MAAM;GAC9B,IAAM,IAAO,KAAK,OAAmB,KAAZ,OAAO,CAAC;GAEjC,AAAI,EAAW,UAAU,MAAM,EAAW,QAAQ;EACpD,CAAC;EAED,SAAS,IAA4B;GACnC,IAAM,IAAI,EAAW,MAAM,KAAK;GAEhC,IAAI,CAAC,GAAG,OAAO;GAEf,IAAM,IAAI,OAAO,WAAW,CAAC;GAE7B,OAAO,OAAO,MAAM,CAAC,IAAI,OAAO;EAClC;EAEA,SAAS,EAAO,GAAoB,GAAuB;GACzD,IAAM,IAAM,EAAM,IAAI,SAAS,OAAiC,KAAA,IAA1B,OAAO,EAAM,IAAI,KAAK,GACtD,IAAM,EAAM,IAAI,SAAS,OAAiC,KAAA,IAA1B,OAAO,EAAM,IAAI,KAAK,GACtD,IAAU,KAAO,OAA8B,OAAvB,EAAM,GAAK,GAAK,CAAG,GAC3C,IAAY,KAAW,OAAyB,KAAlB,OAAO,CAAO;GAIlD,AAFI,EAAW,UAAU,MAAW,EAAW,QAAQ,IAEvD,EAAK,UAAU;IAAE;IAAe,OAAO;GAAQ,CAAC;EAClD;EAEA,IAAM,IAAU,EAAqB;GACnC;GACA,UAAU;GACV,WAAW,EAAM;GACjB,KAAK,EAAM;GACX,KAAK,EAAM;GACX,OAAO;GACP,UAAU;GACV,MAAM,EAAM;EACd,CAAC,GAQK,IAAc,EAAwC,GACxD,IAAqC,MACrC,IAAuC,MACvC,IAAqC,MAEnC,KAAkB,MAA4C;GAClE,IAAI,CAAC,GAAU;IAOb,AANA,IAAgB,GAChB,IAAkB,GAClB,GAAQ,QAAQ,GAChB,IAAgB,MAChB,IAAkB,MAClB,IAAS,MACT,EAAM,IAAI,QAAQ,IAAI;IAEtB;GACF;GAKA,AAHA,EAAS,aAAa,aAAa,SAAS,GAG5C,EAAS,aAAa,QAAQ,YAAY;GAE1C,IAAM,KAAgB,MAAa;IACjC,IAAM,IAAO,EAAE,OAA4B,OACrC,IAAI,MAAQ,KAA8B,OAAzB,OAAO,WAAW,CAAG;IAE5C,EAAO,OAAO,MAAM,KAAK,GAAG,IAAI,OAAO,GAAG,CAAC;GAC7C,GAEM,KAAe,MAAa;IAChC,IAAM,IAAO,EAAE,OAA4B,OACrC,IAAI,MAAQ,KAA8B,OAAzB,OAAO,WAAW,CAAG;IAG5C,AADA,EAAW,QAAQ,GACnB,EAAK,SAAS;KAAE,eAAe;KAAG,OAAO,OAAO,MAAM,KAAK,GAAG,IAAI,OAAO;IAAE,CAAC;GAC9E;GA4BA,AA1BA,EAAS,iBAAiB,UAAU,CAAY,GAChD,EAAS,iBAAiB,SAAS,CAAW,GAC9C,UAAwB;IAEtB,AADA,EAAS,oBAAoB,UAAU,CAAY,GACnD,EAAS,oBAAoB,SAAS,CAAW;GACnD,GAEA,IAAgB,QAAY;IAC1B,IAAM,IAAM,EAAW;IAWvB,AATI,KAAO,OAAM,EAAS,gBAAgB,eAAe,IACpD,EAAS,aAAa,iBAAiB,OAAO,CAAG,CAAC,GAEnD,EAAM,IAAI,SAAS,OAClB,EAAS,gBAAgB,eAAe,IADhB,EAAS,aAAa,iBAAiB,OAAO,EAAM,IAAI,KAAK,CAAC,GAGvF,EAAM,IAAI,SAAS,OAClB,EAAS,gBAAgB,eAAe,IADhB,EAAS,aAAa,iBAAiB,OAAO,EAAM,IAAI,KAAK,CAAC,GAGvF,EAAW,QAAO,EAAS,aAAa,iBAAiB,MAAM,IAC9D,EAAS,gBAAgB,eAAe;GAC/C,CAAC,GAGD,EAAM,IAAI,QAAQ,CAAQ,GAE1B,IAAS,EAAY,EAAM,MAAM,MAAO;IACtC,IAAK,CAAQ;GACf,CAAC;EACH;EAQA,AAJA,EAAU,IAAc,MAAe;GACrC,EAAW,MAAM;EACnB,CAAC,GAED,EAAK,EACH,MAAM;GACJ,MAAM,EAAU;GAChB,aAAa,EAAW,SAAS;GACjC,SAAS,EAAU;EACrB,EACF,CAAC;EAED,IAAM,IAAmB,QAAe,EAAW,SAAS,EAAW,KAAK;EAE5E,OAAO,CAAI;uDACwC,MAAqB,EAAQ,cAAc,CAAC,EAAE;;;;;6BAKxE,EAAiB,SAAS,EAAQ,MAAM,EAAE;qBAClD,MAAa,EAAQ,YAAY,EAAE,OAAO,EAAM,KAAK,KAAK,KAAK,IAAI,CAAC,EAAE;;;;;;iBAM1E,EAAY;0BACH,EAAW,MAAM;0BACjB,EAAM,MAAM,SAAS,GAAG;oCACd,EAAM,kBAAkB,CAAC,SAAS,QAAQ;gCAC9C,EAAM,YAAY,SAAS,GAAG;yBACrC,EAAM,KAAK,SAAS,GAAG;2BACrB,EAAM,OAAO,SAAS,GAAG;0BAC1B,EAAM,MAAM,SAAS,GAAG;mBAC/B,EAAU,KAAK;0BACR,EAAM,MAAM,SAAS,GAAG;4BACtB,EAAM,QAAQ,SAAS,GAAG;4BAC1B,EAAM,QAAQ,MAAM;uBACzB,EAAW;uBACX,EAAW;8BACJ,GAAM;;;;;;6BAMP,EAAiB,SAAS,EAAQ,MAAM,EAAE;qBAClD,MAAa,EAAQ,YAAY,OAAO,EAAM,KAAK,KAAK,KAAK,GAAG,CAAC,EAAE;;;;;CAKtF;CACA,QAAQ,EAAE,gBAAgB,GAAK;CAC/B,QAAQ,CAAC,GAAoB,CAAM;AACrC,CAAC"}

package/dist/ore/dist/_dev.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"_dev.cjs","names":[],"sources":["../../../../ore/dist/_dev.js"],"sourcesContent":["var e=!globalThis.__ORE_PROD__;function t(t){e&&console.warn(`[@vielzeug/ore] ${t}`)}function n(t,...n){e&&console.error(`[@vielzeug/ore] ${t}`,...n)}function r(t){e&&t()}export{r as devOnly,n as error,t as warn};\n//# sourceMappingURL=_dev.js.map"],"mappings":"AAAA,IAAI,EAAE,CAAC,WAAW,aAAa,SAAS,EAAE,EAAE,CAAC,GAAG,QAAQ,KAAK,mBAAmB,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,GAAG,QAAQ,MAAM,mBAAmB,IAAI,GAAG,CAAC,CAAC"}
+{"version":3,"file":"_dev.cjs","names":[],"sources":["../../../../ore/dist/_dev.js"],"sourcesContent":["var e=!globalThis.__ORE_PROD__;function t(t){e&&console.warn(`[@vielzeug/ore] ${t}`)}function n(t,...n){e&&console.error(`[@vielzeug/ore] ${t}`,...n)}export{n as error,t as warn};\n//# sourceMappingURL=_dev.js.map"],"mappings":"AAAA,IAAI,EAAE,CAAC,WAAW,aAAa,SAAS,EAAE,EAAE,CAAC,GAAG,QAAQ,KAAK,mBAAmB,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,GAAG,QAAQ,MAAM,mBAAmB,IAAI,GAAG,CAAC,CAAC"}

package/dist/ore/dist/_dev.js.map

@@ -1 +1 @@
-{"version":3,"file":"_dev.js","names":[],"sources":["../../../../ore/dist/_dev.js"],"sourcesContent":["var e=!globalThis.__ORE_PROD__;function t(t){e&&console.warn(`[@vielzeug/ore] ${t}`)}function n(t,...n){e&&console.error(`[@vielzeug/ore] ${t}`,...n)}function r(t){e&&t()}export{r as devOnly,n as error,t as warn};\n//# sourceMappingURL=_dev.js.map"],"mappings":";AAAA,IAAI,IAAE,CAAC,WAAW;AAAa,SAAS,EAAE,GAAE;CAAC,KAAG,QAAQ,KAAK,mBAAmB,GAAG;AAAC;AAAC,SAAS,EAAE,GAAE,GAAG,GAAE;CAAC,KAAG,QAAQ,MAAM,mBAAmB,KAAI,GAAG,CAAC;AAAC"}
+{"version":3,"file":"_dev.js","names":[],"sources":["../../../../ore/dist/_dev.js"],"sourcesContent":["var e=!globalThis.__ORE_PROD__;function t(t){e&&console.warn(`[@vielzeug/ore] ${t}`)}function n(t,...n){e&&console.error(`[@vielzeug/ore] ${t}`,...n)}export{n as error,t as warn};\n//# sourceMappingURL=_dev.js.map"],"mappings":";AAAA,IAAI,IAAE,CAAC,WAAW;AAAa,SAAS,EAAE,GAAE;CAAC,KAAG,QAAQ,KAAK,mBAAmB,GAAG;AAAC;AAAC,SAAS,EAAE,GAAE,GAAG,GAAE;CAAC,KAAG,QAAQ,MAAM,mBAAmB,KAAI,GAAG,CAAC;AAAC"}

package/dist/ore/dist/base-element.cjs

@@ -1,2 +1,2 @@
-const e=require("./_dev.cjs"),t=require("./errors.cjs");require("./types/bindings.cjs");const n=require("./utils/css.cjs"),r=require("./runtime.cjs"),i=require("./props.cjs"),a=require("./context-bag.cjs"),o=require("./types.cjs");let s=require("@vielzeug/ripple");var c=()=>({generation:0,mountCallbacks:[],phase:o.ComponentPhase.UNINITIALIZED,scope:(0,s.scope)(),templateResult:null}),l=class extends HTMLElement{static _definition;static _normalizedPropDefs;static formAssociated=!1;static observedAttributes=[];_component;constructor(){super();let e=this.constructor._definition;e?.shadow!==!1&&this.attachShadow({mode:`open`,...e?.shadow}),this._component=c()}connectedCallback(){(0,s.untrack)(()=>{this._component.phase===o.ComponentPhase.UNINITIALIZED&&this._runSetup(),this._init()}),this.dispatchEvent(new CustomEvent(o.LIFECYCLE_EVENTS.CONNECT,{bubbles:!1,composed:!1}))}attributeChangedCallback(e,t,n){if(t===n)return;let r=i.getPropMeta(this,e);if(!r)return;let a=r.parse(n);Object.is((0,s.untrack)(()=>r.signal.value),a)||(r.signal.value=a)}disconnectedCallback(){this._component.generation++,this._component.phase=o.ComponentPhase.UNMOUNTED,this.dispatchEvent(new CustomEvent(o.LIFECYCLE_EVENTS.DISCONNECT,{bubbles:!1,composed:!1})),this._component.scope.dispose(),this._component.mountCallbacks=[],this._component.phase=o.ComponentPhase.UNINITIALIZED,this._component.scope=(0,s.scope)(),this._component.templateResult=null}_handleSetupError(e,n=`setup`){let r=e instanceof Error?e:Error(String(e)),i=new t.OreLifecycleError(`<${this.localName}> failed during ${this._component.phase} (${n})`,{cause:r,component:this.localName,phase:n}),a=this.constructor._definition;if(a?.onError)try{return a.onError(i,this)}catch{}t.reportRuntimeError(i,this)}_runSetup(){this._component.phase=o.ComponentPhase.SETUP_RUNNING;let e=this.constructor._definition,t=this.constructor._normalizedPropDefs,n={element:this,mountCallbacks:[]};try{let s;if(this._component.scope.run(()=>{s=r.runWithContext(n,()=>{let n=t?i.createProps(this,t):{},r=a.createContextBag(this);return e.setup(n,r)})}),this._component.mountCallbacks.push(...n.mountCallbacks),s!=null&&typeof s.then==`function`){let t=this._component.mountCallbacks.splice(0);this._component.phase=o.ComponentPhase.LOADING,e.loading&&(this._component.templateResult=e.loading()),this._runSetupAsync(s,t,this._component.generation)}else this._component.templateResult=s??null,this._component.phase=o.ComponentPhase.SETUP_DONE}catch(e){let t=this._handleSetupError(e);if(t)this._component.templateResult=t,this._component.phase=o.ComponentPhase.SETUP_DONE;else throw this._component.phase=o.ComponentPhase.UNINITIALIZED,e}}async _runSetupAsync(t,n,r){try{let i=await t;if(this._component.generation!==r||!this.isConnected){e.warn(`<${this.localName}> async setup result discarded — element disconnected before setup resolved.`);return}this._component.templateResult=i??null,this._component.phase=o.ComponentPhase.SETUP_DONE,this._component.mountCallbacks.push(...n),i&&this._applyResult(i),this._scheduleMountCallbacks()}catch(t){if(this._component.generation!==r||!this.isConnected){e.warn(`<${this.localName}> async setup error discarded — element disconnected before setup resolved.`);return}let n=this._handleSetupError(t,`async-setup`);n?(this._component.templateResult=n,this._component.phase=o.ComponentPhase.SETUP_DONE,this._applyResult(n)):this._component.phase=o.ComponentPhase.UNINITIALIZED}}_applyResult(e){e&&((this.shadowRoot??this).replaceChildren(e.fragment),this._component.scope.run(()=>{e.apply(r.onCleanup)}))}_init(){this._applyStyles(),this._mountTemplate(),this._component.phase===o.ComponentPhase.SETUP_DONE&&this._scheduleMountCallbacks()}_applyStyles(){let e=this.constructor._definition;this.shadowRoot&&e?.styles?.length&&(this.shadowRoot.adoptedStyleSheets=e.styles.map(n.loadStylesheet))}_mountTemplate(){let e=this._component.templateResult;e&&this._applyResult(e)}_scheduleMountCallbacks(){if(this._component.mountCallbacks.length===0)return;let e=this._component.generation;queueMicrotask(()=>{if(!this.isConnected||e!==this._component.generation)return;let t=this._component.mountCallbacks.splice(0);for(let e of t)try{let t={element:this,mountCallbacks:[]};this._component.scope.run(()=>{r.runWithContext(t,()=>{let t=e();typeof t==`function`&&r.onCleanup(t)})}),t.mountCallbacks.length>0&&this._component.mountCallbacks.push(...t.mountCallbacks)}catch(e){this._handleSetupError(e,`mounted`)}this._component.mountCallbacks.length>0&&this._scheduleMountCallbacks()})}};exports.BaseElement=l;
+const e=require("./_dev.cjs"),t=require("./errors.cjs");require("./types/bindings.cjs");const n=require("./runtime.cjs"),r=require("./utils/css.cjs"),i=require("./props.cjs"),a=require("./types.cjs");let o=require("@vielzeug/ripple");var s=()=>({generation:0,mountCallbacks:[],phase:a.ComponentPhase.UNINITIALIZED,scope:(0,o.scope)(),templateResult:null}),c=class extends HTMLElement{static _definition;static _normalizedPropDefs;static formAssociated=!1;static observedAttributes=[];_component;constructor(){super();let e=this.constructor._definition;e?.shadow!==!1&&this.attachShadow({mode:`open`,...e?.shadow}),this._component=s()}connectedCallback(){(0,o.untrack)(()=>{this._component.phase===a.ComponentPhase.UNINITIALIZED&&this._runSetup(),this._init()}),this.dispatchEvent(new CustomEvent(a.LIFECYCLE_EVENTS.CONNECT,{bubbles:!1,composed:!1}))}attributeChangedCallback(e,t,n){if(t===n)return;let r=i.getPropMeta(this,e);if(!r)return;let a=r.parse(n);Object.is((0,o.untrack)(()=>r.signal.value),a)||(r.signal.value=a)}disconnectedCallback(){this._component.generation++,this._component.phase=a.ComponentPhase.UNMOUNTED,this.dispatchEvent(new CustomEvent(a.LIFECYCLE_EVENTS.DISCONNECT,{bubbles:!1,composed:!1})),this._component.scope.dispose(),this._component.mountCallbacks=[],this._component.phase=a.ComponentPhase.UNINITIALIZED,this._component.scope=(0,o.scope)(),this._component.templateResult=null}_handleSetupError(e,n=`setup`){let r=e instanceof Error?e:Error(String(e)),i=new t.OreLifecycleError(`<${this.localName}> failed during ${this._component.phase} (${n})`,{cause:r,component:this.localName,phase:n}),a=this.constructor._definition;if(a?.onError)try{return a.onError(i,this)}catch{}t.reportRuntimeError(i,this)}_runSetup(){this._component.phase=a.ComponentPhase.SETUP_RUNNING;let e=this.constructor._definition,t=this.constructor._normalizedPropDefs,r={element:this,mountCallbacks:[]};try{let o;if(this._component.scope.run(()=>{o=n.runWithContext(r,()=>{let n=t?i.createProps(this,t):{};return e.setup(n)})}),this._component.mountCallbacks.push(...r.mountCallbacks),o!=null&&typeof o.then==`function`){let t=this._component.mountCallbacks.splice(0);this._component.phase=a.ComponentPhase.LOADING,e.loading&&(this._component.templateResult=e.loading()),this._runSetupAsync(o,t,this._component.generation)}else this._component.templateResult=o??null,this._component.phase=a.ComponentPhase.SETUP_DONE}catch(e){let t=this._handleSetupError(e);if(t)this._component.templateResult=t,this._component.phase=a.ComponentPhase.SETUP_DONE;else throw this._component.phase=a.ComponentPhase.UNINITIALIZED,e}}_isStale(e){return this._component.generation!==e||!this.isConnected}async _runSetupAsync(t,n,r){try{let i=await t;if(this._isStale(r)){e.warn(`<${this.localName}> async setup result discarded — element disconnected before setup resolved.`);return}this._component.templateResult=i??null,this._component.phase=a.ComponentPhase.SETUP_DONE,this._component.mountCallbacks.push(...n),i&&this._applyResult(i),this._scheduleMountCallbacks()}catch(t){if(this._isStale(r)){e.warn(`<${this.localName}> async setup error discarded — element disconnected before setup resolved.`);return}let n=this._handleSetupError(t,`async-setup`);n?(this._component.templateResult=n,this._component.phase=a.ComponentPhase.SETUP_DONE,this._applyResult(n)):this._component.phase=a.ComponentPhase.UNINITIALIZED}}_applyResult(e){e&&((this.shadowRoot??this).replaceChildren(e.fragment),this._component.scope.run(()=>{e.apply(n.onCleanup)}))}_init(){this._applyStyles(),this._mountTemplate(),this._component.phase===a.ComponentPhase.SETUP_DONE&&this._scheduleMountCallbacks()}_applyStyles(){let e=this.constructor._definition;this.shadowRoot&&e?.styles?.length&&(this.shadowRoot.adoptedStyleSheets=e.styles.map(r.loadStylesheet))}_mountTemplate(){let e=this._component.templateResult;e&&this._applyResult(e)}_scheduleMountCallbacks(){if(this._component.mountCallbacks.length===0)return;let e=this._component.generation;queueMicrotask(()=>{if(this._isStale(e))return;let t=this._component.mountCallbacks.splice(0);for(let e of t)try{let t={element:this,mountCallbacks:[]};this._component.scope.run(()=>{n.runWithContext(t,()=>{let t=e();typeof t==`function`&&n.onCleanup(t)})}),t.mountCallbacks.length>0&&this._component.mountCallbacks.push(...t.mountCallbacks)}catch(e){this._handleSetupError(e,`mounted`)}this._component.mountCallbacks.length>0&&this._scheduleMountCallbacks()})}};exports.BaseElement=c;
 //# sourceMappingURL=base-element.cjs.map

package/dist/ore/dist/base-element.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"base-element.cjs","names":["c","l","s","i","t","r","e","o","a","u"],"sources":["../../../../ore/dist/base-element.js"],"sourcesContent":["import{warn as e}from\"./_dev.js\";import{OreLifecycleError as t,reportRuntimeError as n}from\"./errors.js\";import\"./types/bindings.js\";import{onCleanup as r,runWithContext as i}from\"./runtime.js\";import{createContextBag as a}from\"./context-bag.js\";import{createProps as o,getPropMeta as s}from\"./props.js\";import{ComponentPhase as c,LIFECYCLE_EVENTS as l}from\"./types.js\";import{loadStylesheet as u}from\"./utils/css.js\";import{scope as d,untrack as f}from\"@vielzeug/ripple\";var p=()=>({generation:0,mountCallbacks:[],phase:c.UNINITIALIZED,scope:d(),templateResult:null}),m=class extends HTMLElement{static _definition;static _normalizedPropDefs;static formAssociated=!1;static observedAttributes=[];_component;constructor(){super();let e=this.constructor._definition;e?.shadow!==!1&&this.attachShadow({mode:`open`,...e?.shadow}),this._component=p()}connectedCallback(){f(()=>{this._component.phase===c.UNINITIALIZED&&this._runSetup(),this._init()}),this.dispatchEvent(new CustomEvent(l.CONNECT,{bubbles:!1,composed:!1}))}attributeChangedCallback(e,t,n){if(t===n)return;let r=s(this,e);if(!r)return;let i=r.parse(n);Object.is(f(()=>r.signal.value),i)||(r.signal.value=i)}disconnectedCallback(){this._component.generation++,this._component.phase=c.UNMOUNTED,this.dispatchEvent(new CustomEvent(l.DISCONNECT,{bubbles:!1,composed:!1})),this._component.scope.dispose(),this._component.mountCallbacks=[],this._component.phase=c.UNINITIALIZED,this._component.scope=d(),this._component.templateResult=null}_handleSetupError(e,r=`setup`){let i=e instanceof Error?e:Error(String(e)),a=new t(`<${this.localName}> failed during ${this._component.phase} (${r})`,{cause:i,component:this.localName,phase:r}),o=this.constructor._definition;if(o?.onError)try{return o.onError(a,this)}catch{}n(a,this)}_runSetup(){this._component.phase=c.SETUP_RUNNING;let e=this.constructor._definition,t=this.constructor._normalizedPropDefs,n={element:this,mountCallbacks:[]};try{let r;if(this._component.scope.run(()=>{r=i(n,()=>{let n=t?o(this,t):{},r=a(this);return e.setup(n,r)})}),this._component.mountCallbacks.push(...n.mountCallbacks),r!=null&&typeof r.then==`function`){let t=this._component.mountCallbacks.splice(0);this._component.phase=c.LOADING,e.loading&&(this._component.templateResult=e.loading()),this._runSetupAsync(r,t,this._component.generation)}else this._component.templateResult=r??null,this._component.phase=c.SETUP_DONE}catch(e){let t=this._handleSetupError(e);if(t)this._component.templateResult=t,this._component.phase=c.SETUP_DONE;else throw this._component.phase=c.UNINITIALIZED,e}}async _runSetupAsync(t,n,r){try{let i=await t;if(this._component.generation!==r||!this.isConnected){e(`<${this.localName}> async setup result discarded — element disconnected before setup resolved.`);return}this._component.templateResult=i??null,this._component.phase=c.SETUP_DONE,this._component.mountCallbacks.push(...n),i&&this._applyResult(i),this._scheduleMountCallbacks()}catch(t){if(this._component.generation!==r||!this.isConnected){e(`<${this.localName}> async setup error discarded — element disconnected before setup resolved.`);return}let n=this._handleSetupError(t,`async-setup`);n?(this._component.templateResult=n,this._component.phase=c.SETUP_DONE,this._applyResult(n)):this._component.phase=c.UNINITIALIZED}}_applyResult(e){e&&((this.shadowRoot??this).replaceChildren(e.fragment),this._component.scope.run(()=>{e.apply(r)}))}_init(){this._applyStyles(),this._mountTemplate(),this._component.phase===c.SETUP_DONE&&this._scheduleMountCallbacks()}_applyStyles(){let e=this.constructor._definition;this.shadowRoot&&e?.styles?.length&&(this.shadowRoot.adoptedStyleSheets=e.styles.map(u))}_mountTemplate(){let e=this._component.templateResult;e&&this._applyResult(e)}_scheduleMountCallbacks(){if(this._component.mountCallbacks.length===0)return;let e=this._component.generation;queueMicrotask(()=>{if(!this.isConnected||e!==this._component.generation)return;let t=this._component.mountCallbacks.splice(0);for(let e of t)try{let t={element:this,mountCallbacks:[]};this._component.scope.run(()=>{i(t,()=>{let t=e();typeof t==`function`&&r(t)})}),t.mountCallbacks.length>0&&this._component.mountCallbacks.push(...t.mountCallbacks)}catch(e){this._handleSetupError(e,`mounted`)}this._component.mountCallbacks.length>0&&this._scheduleMountCallbacks()})}};export{m as BaseElement};\n//# sourceMappingURL=base-element.js.map"],"mappings":"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"}
+{"version":3,"file":"base-element.cjs","names":["s","c","o","i","a","t","e","r","l"],"sources":["../../../../ore/dist/base-element.js"],"sourcesContent":["import{warn as e}from\"./_dev.js\";import{OreLifecycleError as t,reportRuntimeError as n}from\"./errors.js\";import\"./types/bindings.js\";import{onCleanup as r,runWithContext as i}from\"./runtime.js\";import{createProps as a,getPropMeta as o}from\"./props.js\";import{ComponentPhase as s,LIFECYCLE_EVENTS as c}from\"./types.js\";import{loadStylesheet as l}from\"./utils/css.js\";import{scope as u,untrack as d}from\"@vielzeug/ripple\";var f=()=>({generation:0,mountCallbacks:[],phase:s.UNINITIALIZED,scope:u(),templateResult:null}),p=class extends HTMLElement{static _definition;static _normalizedPropDefs;static formAssociated=!1;static observedAttributes=[];_component;constructor(){super();let e=this.constructor._definition;e?.shadow!==!1&&this.attachShadow({mode:`open`,...e?.shadow}),this._component=f()}connectedCallback(){d(()=>{this._component.phase===s.UNINITIALIZED&&this._runSetup(),this._init()}),this.dispatchEvent(new CustomEvent(c.CONNECT,{bubbles:!1,composed:!1}))}attributeChangedCallback(e,t,n){if(t===n)return;let r=o(this,e);if(!r)return;let i=r.parse(n);Object.is(d(()=>r.signal.value),i)||(r.signal.value=i)}disconnectedCallback(){this._component.generation++,this._component.phase=s.UNMOUNTED,this.dispatchEvent(new CustomEvent(c.DISCONNECT,{bubbles:!1,composed:!1})),this._component.scope.dispose(),this._component.mountCallbacks=[],this._component.phase=s.UNINITIALIZED,this._component.scope=u(),this._component.templateResult=null}_handleSetupError(e,r=`setup`){let i=e instanceof Error?e:Error(String(e)),a=new t(`<${this.localName}> failed during ${this._component.phase} (${r})`,{cause:i,component:this.localName,phase:r}),o=this.constructor._definition;if(o?.onError)try{return o.onError(a,this)}catch{}n(a,this)}_runSetup(){this._component.phase=s.SETUP_RUNNING;let e=this.constructor._definition,t=this.constructor._normalizedPropDefs,n={element:this,mountCallbacks:[]};try{let r;if(this._component.scope.run(()=>{r=i(n,()=>{let n=t?a(this,t):{};return e.setup(n)})}),this._component.mountCallbacks.push(...n.mountCallbacks),r!=null&&typeof r.then==`function`){let t=this._component.mountCallbacks.splice(0);this._component.phase=s.LOADING,e.loading&&(this._component.templateResult=e.loading()),this._runSetupAsync(r,t,this._component.generation)}else this._component.templateResult=r??null,this._component.phase=s.SETUP_DONE}catch(e){let t=this._handleSetupError(e);if(t)this._component.templateResult=t,this._component.phase=s.SETUP_DONE;else throw this._component.phase=s.UNINITIALIZED,e}}_isStale(e){return this._component.generation!==e||!this.isConnected}async _runSetupAsync(t,n,r){try{let i=await t;if(this._isStale(r)){e(`<${this.localName}> async setup result discarded — element disconnected before setup resolved.`);return}this._component.templateResult=i??null,this._component.phase=s.SETUP_DONE,this._component.mountCallbacks.push(...n),i&&this._applyResult(i),this._scheduleMountCallbacks()}catch(t){if(this._isStale(r)){e(`<${this.localName}> async setup error discarded — element disconnected before setup resolved.`);return}let n=this._handleSetupError(t,`async-setup`);n?(this._component.templateResult=n,this._component.phase=s.SETUP_DONE,this._applyResult(n)):this._component.phase=s.UNINITIALIZED}}_applyResult(e){e&&((this.shadowRoot??this).replaceChildren(e.fragment),this._component.scope.run(()=>{e.apply(r)}))}_init(){this._applyStyles(),this._mountTemplate(),this._component.phase===s.SETUP_DONE&&this._scheduleMountCallbacks()}_applyStyles(){let e=this.constructor._definition;this.shadowRoot&&e?.styles?.length&&(this.shadowRoot.adoptedStyleSheets=e.styles.map(l))}_mountTemplate(){let e=this._component.templateResult;e&&this._applyResult(e)}_scheduleMountCallbacks(){if(this._component.mountCallbacks.length===0)return;let e=this._component.generation;queueMicrotask(()=>{if(this._isStale(e))return;let t=this._component.mountCallbacks.splice(0);for(let e of t)try{let t={element:this,mountCallbacks:[]};this._component.scope.run(()=>{i(t,()=>{let t=e();typeof t==`function`&&r(t)})}),t.mountCallbacks.length>0&&this._component.mountCallbacks.push(...t.mountCallbacks)}catch(e){this._handleSetupError(e,`mounted`)}this._component.mountCallbacks.length>0&&this._scheduleMountCallbacks()})}};export{p as BaseElement};\n//# sourceMappingURL=base-element.js.map"],"mappings":"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"}