@gunkin/uiify 0.0.1-alpha

package/dist/components/modal/types.d.ts

@@ -0,0 +1,58 @@
+import type { ComponentPropsWithRef, ElementType, ReactNode } from "react";
+import type { NativeButtonProps } from "@gunkin/uiify/core/render";
+export interface ModalProps {
+    readonly id: string;
+    readonly trigger: ReactNode;
+    readonly title: ReactNode;
+    readonly description?: ReactNode;
+    readonly children?: ReactNode;
+    readonly closeLabel?: ReactNode;
+    readonly triggerClassName?: string;
+    readonly className?: string;
+    readonly closeClassName?: string;
+}
+/** Own props of the native `show-modal` invoker. */
+export interface ModalTriggerOwnProps {
+    readonly children?: ReactNode;
+    /** `id` of the `ModalContent` this button opens; the browser resolves it at click time. */
+    readonly target: string;
+}
+export type ModalTriggerProps<TAs extends ElementType = "button"> = NativeButtonProps<TAs, ModalTriggerOwnProps>;
+/** Own props of the native `request-close` invoker. */
+export interface ModalCloseOwnProps {
+    readonly children?: ReactNode;
+    /** `id` of the `ModalContent` this button closes. */
+    readonly target: string;
+}
+export type ModalCloseProps<TAs extends ElementType = "button"> = NativeButtonProps<TAs, ModalCloseOwnProps>;
+export interface ModalContentOwnProps {
+    readonly children?: ReactNode;
+    /** Unique id supplied by the consumer; referenced by trigger and close `target`. */
+    readonly id: string;
+}
+/** A plain, initially closed `<dialog>`: `open` and `popover` are not part of the native contract. */
+export type ModalContentProps = ModalContentOwnProps & Omit<ComponentPropsWithRef<"dialog">, keyof ModalContentOwnProps | "open" | "popover">;
+export interface ModalClientContentOwnProps {
+    readonly children?: ReactNode;
+    /**
+     * Close when the backdrop is clicked — a click whose target is the `<dialog>`
+     * itself, not one of its children. Default `false` (matches the native parts).
+     */
+    readonly closeOnBackdropClick?: boolean;
+    /** Uncontrolled initial state, applied with `showModal()` after hydration; SSR markup stays closed. */
+    readonly defaultOpen?: boolean;
+    readonly id: string;
+    /**
+     * Fires once per native or programmatic change with the state the element
+     * just entered. Also fires once at mount if the browser opened the dialog
+     * natively before hydration. Not reported: a pre-hydration open→close cycle
+     * that nets back to closed — the DOM retains no `toggle` history, so there
+     * is no evidence left that a transition happened at all.
+     */
+    readonly onOpenChange?: (open: boolean) => void;
+    /** Controlled state, authoritative after hydration. */
+    readonly open?: boolean;
+}
+/** Props of the client adapter; `popover` is excluded because the adapter is always modal. */
+export type ModalClientContentProps = ModalClientContentOwnProps & Omit<ComponentPropsWithRef<"dialog">, keyof ModalClientContentOwnProps | "popover">;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/modal/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/modal/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,UAAU,CAAC,EAAE,SAAS,CAAC;IAChC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC;CAClC;AAED,oDAAoD;AACpD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,2FAA2F;IAC3F,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,iBAAiB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,IAAI,iBAAiB,CACnF,GAAG,EACH,oBAAoB,CACrB,CAAC;AAEF,uDAAuD;AACvD,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,qDAAqD;IACrD,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,eAAe,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,IAAI,iBAAiB,CACjF,GAAG,EACH,kBAAkB,CACnB,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,oFAAoF;IACpF,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;CACrB;AAED,sGAAsG;AACtG,MAAM,MAAM,iBAAiB,GAAG,oBAAoB,GAClD,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,oBAAoB,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAEzF,MAAM,WAAW,0BAA0B;IACzC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IACxC,uGAAuG;IACvG,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB;;;;;;OAMG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,uDAAuD;IACvD,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,8FAA8F;AAC9F,MAAM,MAAM,uBAAuB,GAAG,0BAA0B,GAC9D,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,0BAA0B,GAAG,SAAS,CAAC,CAAC"}

package/dist/components/modal/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/components/modal/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/modal.d.ts

@@ -0,0 +1 @@
+export * from "./modal/index.js";

package/dist/components/modal.js

@@ -0,0 +1 @@
+export * from "./modal/index.js";

package/dist/components/number-field/NumberField.d.ts

@@ -0,0 +1,19 @@
+import { type ElementType, type ReactElement } from "react";
+import type { NumberFieldRootProps, NumberFieldGroupProps, NumberFieldInputProps, NumberFieldIncrementProps, NumberFieldDecrementProps } from "./types.js";
+export type { NumberFieldDecrementProps, NumberFieldGroupProps, NumberFieldIncrementProps, NumberFieldInputProps, NumberFieldRootOwnProps, NumberFieldRootProps, } from "./types.js";
+export declare function NumberFieldRoot<TAs extends ElementType = "div">(props: NumberFieldRootProps<TAs>): ReactElement | null;
+export declare namespace NumberFieldRoot {
+    var displayName: string;
+}
+export declare function NumberFieldGroup<TAs extends ElementType = "div">(props: NumberFieldGroupProps<TAs>): ReactElement | null;
+export declare function NumberFieldInput<TAs extends ElementType = "input">(props: NumberFieldInputProps<TAs>): ReactElement | null;
+export declare function NumberFieldIncrement<TAs extends ElementType = "button">(props: NumberFieldIncrementProps<TAs>): ReactElement | null;
+export declare function NumberFieldDecrement<TAs extends ElementType = "button">(props: NumberFieldDecrementProps<TAs>): ReactElement | null;
+export declare const NumberField: {
+    Root: typeof NumberFieldRoot;
+    Group: typeof NumberFieldGroup;
+    Input: typeof NumberFieldInput;
+    Increment: typeof NumberFieldIncrement;
+    Decrement: typeof NumberFieldDecrement;
+};
+//# sourceMappingURL=NumberField.d.ts.map

package/dist/components/number-field/NumberField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberField.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/NumberField.tsx"],"names":[],"mappings":"AAEA,OAAO,EAKL,KAAK,WAAW,EAGhB,KAAK,YAAY,EAGlB,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAEV,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,yBAAyB,EACzB,yBAAyB,EAC1B,MAAM,YAAY,CAAC;AAEpB,YAAY,EACV,yBAAyB,EACzB,qBAAqB,EACrB,yBAAyB,EACzB,qBAAqB,EACrB,uBAAuB,EACvB,oBAAoB,GACrB,MAAM,YAAY,CAAC;AAKpB,wBAAgB,eAAe,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC7D,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,GAC/B,YAAY,GAAG,IAAI,CAgIrB;yBAlIe,eAAe;;;AAqI/B,wBAAgB,gBAAgB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC9D,KAAK,EAAE,qBAAqB,CAAC,GAAG,CAAC,GAChC,YAAY,GAAG,IAAI,CAWrB;AAED,wBAAgB,gBAAgB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,EAChE,KAAK,EAAE,qBAAqB,CAAC,GAAG,CAAC,GAChC,YAAY,GAAG,IAAI,CAsFrB;AAED,wBAAgB,oBAAoB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EACrE,KAAK,EAAE,yBAAyB,CAAC,GAAG,CAAC,GACpC,YAAY,GAAG,IAAI,CAiCrB;AAED,wBAAgB,oBAAoB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EACrE,KAAK,EAAE,yBAAyB,CAAC,GAAG,CAAC,GACpC,YAAY,GAAG,IAAI,CAiCrB;AAED,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAC"}

package/dist/components/number-field/NumberField.js

@@ -0,0 +1,303 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import {
+  useCallback,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { useControllableState, useId } from "@gunkin/uiify/hooks";
+import { createPartContext } from "@gunkin/uiify/core";
+import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
+import { useRenderElement } from "@gunkin/uiify/core/render";
+import { clampNumber, createFormatter, formatNumber, parseNumber, stepNumber } from "./format.js";
+import { usePressRepeat } from "./use-press-repeat.js";
+const [NumberFieldProvider, useNumberFieldContext] = createPartContext("NumberField");
+function NumberFieldRoot(props) {
+  const {
+    as,
+    render,
+    value: controlledValue,
+    defaultValue,
+    onChange,
+    min,
+    max,
+    step = 1,
+    formatOptions,
+    clampValueOnBlur = true,
+    disabled = false,
+    readOnly = false,
+    required = false,
+    ...consumerProps
+  } = props;
+  const inputId = useId();
+  const inputRef = useRef(null);
+  const formatter = useMemo(() => createFormatter(formatOptions), [formatOptions]);
+  const [value, setValue] = useControllableState({
+    value: controlledValue,
+    defaultValue,
+    onChange
+  });
+  const [editing, setEditing] = useState(false);
+  const [displayValue, setDisplayValue] = useState(
+    () => value === void 0 ? "" : formatNumber(value, formatter)
+  );
+  const syncDisplay = useCallback(
+    (next) => {
+      setDisplayValue(next === void 0 ? "" : formatNumber(next, formatter));
+    },
+    [formatter]
+  );
+  const applyValue = useCallback(
+    (next) => {
+      const clamped = next === void 0 ? void 0 : clampValueOnBlur ? clampNumber(next, min, max) : next;
+      setValue(clamped);
+      syncDisplay(clamped);
+    },
+    [clampValueOnBlur, max, min, setValue, syncDisplay]
+  );
+  const increment = useCallback(
+    (multiplier = 1) => {
+      if (disabled || readOnly) return;
+      const base = value ?? min ?? 0;
+      applyValue(stepNumber(base, multiplier, step, min, max));
+    },
+    [applyValue, disabled, max, min, readOnly, step, value]
+  );
+  const decrement = useCallback(
+    (multiplier = 1) => {
+      increment(-multiplier);
+    },
+    [increment]
+  );
+  const commitInput = useCallback(
+    (raw) => {
+      const parsed = parseNumber(raw, formatter);
+      if (parsed === void 0) {
+        syncDisplay(value);
+        return;
+      }
+      applyValue(parsed);
+    },
+    [applyValue, formatter, syncDisplay, value]
+  );
+  const contextValue = useMemo(
+    () => ({
+      clampValueOnBlur,
+      commitInput,
+      decrement,
+      disabled,
+      displayValue: editing ? displayValue : value === void 0 ? "" : formatNumber(value, formatter),
+      formatter,
+      increment,
+      inputId,
+      inputRef,
+      max,
+      min,
+      numericValue: value,
+      readOnly,
+      required,
+      setDisplayValue,
+      setEditing,
+      step
+    }),
+    [
+      clampValueOnBlur,
+      commitInput,
+      decrement,
+      disabled,
+      displayValue,
+      editing,
+      formatter,
+      increment,
+      inputId,
+      max,
+      min,
+      readOnly,
+      required,
+      step,
+      value
+    ]
+  );
+  const element = useRenderElement({
+    as,
+    defaultTag: "div",
+    props: { ...consumerProps, "data-disabled": disabled ? "" : void 0 },
+    render,
+    state: { disabled, readOnly, required }
+  });
+  return /* @__PURE__ */ jsx(NumberFieldProvider, { value: contextValue, children: element });
+}
+NumberFieldRoot.displayName = "NumberFieldRoot";
+function NumberFieldGroup(props) {
+  const { as, render, ...consumerProps } = props;
+  const { disabled } = useNumberFieldContext("Group");
+  return useRenderElement({
+    as,
+    defaultTag: "div",
+    props: { ...consumerProps, "data-disabled": disabled ? "" : void 0 },
+    render,
+    state: { disabled }
+  });
+}
+function NumberFieldInput(props) {
+  const { as, render, ...consumerProps } = props;
+  const {
+    commitInput,
+    decrement,
+    disabled,
+    displayValue,
+    increment,
+    inputId,
+    inputRef,
+    max,
+    min,
+    numericValue,
+    readOnly,
+    required,
+    setDisplayValue,
+    setEditing
+  } = useNumberFieldContext("Input");
+  const onKeyDown = (event) => {
+    if (disabled || readOnly) return;
+    switch (event.key) {
+      case "ArrowUp":
+        event.preventDefault();
+        increment();
+        break;
+      case "ArrowDown":
+        event.preventDefault();
+        decrement();
+        break;
+      case "PageUp":
+        event.preventDefault();
+        increment(10);
+        break;
+      case "PageDown":
+        event.preventDefault();
+        decrement(10);
+        break;
+      case "Home":
+        event.preventDefault();
+        if (min !== void 0) commitInput(String(min));
+        break;
+      case "End":
+        event.preventDefault();
+        if (max !== void 0) commitInput(String(max));
+        break;
+      default:
+        break;
+    }
+  };
+  return useRenderElement({
+    as,
+    defaultTag: "input",
+    props: {
+      ...consumerProps,
+      id: inputId,
+      ref: inputRef,
+      role: "spinbutton",
+      inputMode: "decimal",
+      "aria-valuenow": numericValue,
+      "aria-valuemin": min,
+      "aria-valuemax": max,
+      "aria-required": required || void 0,
+      "data-disabled": disabled ? "" : void 0,
+      "data-readonly": readOnly ? "" : void 0,
+      disabled: disabled || void 0,
+      readOnly: readOnly || void 0,
+      required: required || void 0,
+      value: displayValue,
+      onFocus: composeEventHandlers(consumerProps.onFocus, () => setEditing(true)),
+      onBlur: composeEventHandlers(consumerProps.onBlur, (event) => {
+        setEditing(false);
+        commitInput(event.currentTarget.value);
+      }),
+      onChange: composeEventHandlers(
+        consumerProps.onChange,
+        (event) => {
+          setDisplayValue(event.currentTarget.value);
+        }
+      ),
+      onKeyDown: composeEventHandlers(consumerProps.onKeyDown, onKeyDown)
+    },
+    render,
+    state: { disabled, readOnly, required }
+  });
+}
+function NumberFieldIncrement(props) {
+  const { as, render, ...consumerProps } = props;
+  const { disabled, increment, readOnly } = useNumberFieldContext("Increment");
+  const inactive = disabled || readOnly;
+  const repeatProps = usePressRepeat(() => increment(), inactive);
+  return useRenderElement({
+    as,
+    defaultTag: "button",
+    props: {
+      ...consumerProps,
+      type: "button",
+      tabIndex: -1,
+      "data-disabled": inactive ? "" : void 0,
+      disabled: inactive || void 0,
+      onClick: composeEventHandlers(consumerProps.onClick, () => increment()),
+      onPointerDown: composeEventHandlers(consumerProps.onPointerDown, repeatProps.onPointerDown),
+      onPointerUp: composeEventHandlers(consumerProps.onPointerUp, repeatProps.onPointerUp),
+      onPointerLeave: composeEventHandlers(
+        consumerProps.onPointerLeave,
+        repeatProps.onPointerLeave
+      ),
+      onPointerCancel: composeEventHandlers(
+        consumerProps.onPointerCancel,
+        repeatProps.onPointerCancel
+      )
+    },
+    render,
+    state: { disabled: inactive }
+  });
+}
+function NumberFieldDecrement(props) {
+  const { as, render, ...consumerProps } = props;
+  const { decrement, disabled, readOnly } = useNumberFieldContext("Decrement");
+  const inactive = disabled || readOnly;
+  const repeatProps = usePressRepeat(() => decrement(), inactive);
+  return useRenderElement({
+    as,
+    defaultTag: "button",
+    props: {
+      ...consumerProps,
+      type: "button",
+      tabIndex: -1,
+      "data-disabled": inactive ? "" : void 0,
+      disabled: inactive || void 0,
+      onClick: composeEventHandlers(consumerProps.onClick, () => decrement()),
+      onPointerDown: composeEventHandlers(consumerProps.onPointerDown, repeatProps.onPointerDown),
+      onPointerUp: composeEventHandlers(consumerProps.onPointerUp, repeatProps.onPointerUp),
+      onPointerLeave: composeEventHandlers(
+        consumerProps.onPointerLeave,
+        repeatProps.onPointerLeave
+      ),
+      onPointerCancel: composeEventHandlers(
+        consumerProps.onPointerCancel,
+        repeatProps.onPointerCancel
+      )
+    },
+    render,
+    state: { disabled: inactive }
+  });
+}
+const NumberField = {
+  Root: NumberFieldRoot,
+  Group: NumberFieldGroup,
+  Input: NumberFieldInput,
+  Increment: NumberFieldIncrement,
+  Decrement: NumberFieldDecrement
+};
+export {
+  NumberField,
+  NumberFieldDecrement,
+  NumberFieldGroup,
+  NumberFieldIncrement,
+  NumberFieldInput,
+  NumberFieldRoot
+};
+//# sourceMappingURL=NumberField.js.map

package/dist/components/number-field/NumberField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/number-field/NumberField.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  type ElementType,\n  type FocusEvent,\n  type KeyboardEvent,\n  type ReactElement,\n  type ReactNode,\n  type SyntheticEvent,\n} from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement, type PolymorphicProps } from \"@gunkin/uiify/core/render\";\nimport { clampNumber, createFormatter, formatNumber, parseNumber, stepNumber } from \"./format.js\";\nimport { usePressRepeat } from \"./use-press-repeat.js\";\nimport type {\n  NumberFieldContextValue,\n  NumberFieldRootProps,\n  NumberFieldGroupProps,\n  NumberFieldInputProps,\n  NumberFieldIncrementProps,\n  NumberFieldDecrementProps,\n} from \"./types.js\";\n\nexport type {\n  NumberFieldDecrementProps,\n  NumberFieldGroupProps,\n  NumberFieldIncrementProps,\n  NumberFieldInputProps,\n  NumberFieldRootOwnProps,\n  NumberFieldRootProps,\n} from \"./types.js\";\n\nconst [NumberFieldProvider, useNumberFieldContext] =\n  createPartContext<NumberFieldContextValue>(\"NumberField\");\n\nexport function NumberFieldRoot<TAs extends ElementType = \"div\">(\n  props: NumberFieldRootProps<TAs>,\n): ReactElement | null {\n  const {\n    as,\n    render,\n    value: controlledValue,\n    defaultValue,\n    onChange,\n    min,\n    max,\n    step = 1,\n    formatOptions,\n    clampValueOnBlur = true,\n    disabled = false,\n    readOnly = false,\n    required = false,\n    ...consumerProps\n  } = props as NumberFieldRootProps<ElementType>;\n\n  const inputId = useId();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const formatter = useMemo(() => createFormatter(formatOptions), [formatOptions]);\n  const [value, setValue] = useControllableState<number | undefined>({\n    value: controlledValue,\n    defaultValue,\n    onChange,\n  });\n  const [editing, setEditing] = useState(false);\n  const [displayValue, setDisplayValue] = useState(() =>\n    value === undefined ? \"\" : formatNumber(value, formatter),\n  );\n\n  const syncDisplay = useCallback(\n    (next: number | undefined) => {\n      setDisplayValue(next === undefined ? \"\" : formatNumber(next, formatter));\n    },\n    [formatter],\n  );\n\n  const applyValue = useCallback(\n    (next: number | undefined) => {\n      const clamped =\n        next === undefined ? undefined : clampValueOnBlur ? clampNumber(next, min, max) : next;\n      setValue(clamped);\n      syncDisplay(clamped);\n    },\n    [clampValueOnBlur, max, min, setValue, syncDisplay],\n  );\n\n  const increment = useCallback(\n    (multiplier = 1) => {\n      if (disabled || readOnly) return;\n      const base = value ?? min ?? 0;\n      applyValue(stepNumber(base, multiplier, step, min, max));\n    },\n    [applyValue, disabled, max, min, readOnly, step, value],\n  );\n\n  const decrement = useCallback(\n    (multiplier = 1) => {\n      increment(-multiplier);\n    },\n    [increment],\n  );\n\n  const commitInput = useCallback(\n    (raw: string) => {\n      const parsed = parseNumber(raw, formatter);\n      if (parsed === undefined) {\n        syncDisplay(value);\n        return;\n      }\n      applyValue(parsed);\n    },\n    [applyValue, formatter, syncDisplay, value],\n  );\n\n  const contextValue = useMemo<NumberFieldContextValue>(\n    () => ({\n      clampValueOnBlur,\n      commitInput,\n      decrement,\n      disabled,\n      displayValue: editing\n        ? displayValue\n        : value === undefined\n          ? \"\"\n          : formatNumber(value, formatter),\n      formatter,\n      increment,\n      inputId,\n      inputRef,\n      max,\n      min,\n      numericValue: value,\n      readOnly,\n      required,\n      setDisplayValue,\n      setEditing,\n      step,\n    }),\n    [\n      clampValueOnBlur,\n      commitInput,\n      decrement,\n      disabled,\n      displayValue,\n      editing,\n      formatter,\n      increment,\n      inputId,\n      max,\n      min,\n      readOnly,\n      required,\n      step,\n      value,\n    ],\n  );\n\n  const element = useRenderElement({\n    as,\n    defaultTag: \"div\",\n    props: { ...consumerProps, \"data-disabled\": disabled ? \"\" : undefined },\n    render,\n    state: { disabled, readOnly, required },\n  });\n\n  return <NumberFieldProvider value={contextValue}>{element}</NumberFieldProvider>;\n}\nNumberFieldRoot.displayName = \"NumberFieldRoot\";\n\nexport function NumberFieldGroup<TAs extends ElementType = \"div\">(\n  props: NumberFieldGroupProps<TAs>,\n): ReactElement | null {\n  const { as, render, ...consumerProps } = props as NumberFieldGroupProps<ElementType>;\n  const { disabled } = useNumberFieldContext(\"Group\");\n\n  return useRenderElement({\n    as,\n    defaultTag: \"div\",\n    props: { ...consumerProps, \"data-disabled\": disabled ? \"\" : undefined },\n    render,\n    state: { disabled },\n  });\n}\n\nexport function NumberFieldInput<TAs extends ElementType = \"input\">(\n  props: NumberFieldInputProps<TAs>,\n): ReactElement | null {\n  const { as, render, ...consumerProps } = props as NumberFieldInputProps<\"input\">;\n  const {\n    commitInput,\n    decrement,\n    disabled,\n    displayValue,\n    increment,\n    inputId,\n    inputRef,\n    max,\n    min,\n    numericValue,\n    readOnly,\n    required,\n    setDisplayValue,\n    setEditing,\n  } = useNumberFieldContext(\"Input\");\n\n  const onKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (disabled || readOnly) return;\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        increment();\n        break;\n      case \"ArrowDown\":\n        event.preventDefault();\n        decrement();\n        break;\n      case \"PageUp\":\n        event.preventDefault();\n        increment(10);\n        break;\n      case \"PageDown\":\n        event.preventDefault();\n        decrement(10);\n        break;\n      case \"Home\":\n        event.preventDefault();\n        if (min !== undefined) commitInput(String(min));\n        break;\n      case \"End\":\n        event.preventDefault();\n        if (max !== undefined) commitInput(String(max));\n        break;\n      default:\n        break;\n    }\n  };\n\n  return useRenderElement({\n    as,\n    defaultTag: \"input\",\n    props: {\n      ...consumerProps,\n      id: inputId,\n      ref: inputRef,\n      role: \"spinbutton\",\n      inputMode: \"decimal\",\n      \"aria-valuenow\": numericValue,\n      \"aria-valuemin\": min,\n      \"aria-valuemax\": max,\n      \"aria-required\": required || undefined,\n      \"data-disabled\": disabled ? \"\" : undefined,\n      \"data-readonly\": readOnly ? \"\" : undefined,\n      disabled: disabled || undefined,\n      readOnly: readOnly || undefined,\n      required: required || undefined,\n      value: displayValue,\n      onFocus: composeEventHandlers(consumerProps.onFocus, () => setEditing(true)),\n      onBlur: composeEventHandlers(consumerProps.onBlur, (event: FocusEvent<HTMLInputElement>) => {\n        setEditing(false);\n        commitInput(event.currentTarget.value);\n      }),\n      onChange: composeEventHandlers(\n        consumerProps.onChange,\n        (event: SyntheticEvent<HTMLInputElement>) => {\n          setDisplayValue(event.currentTarget.value);\n        },\n      ),\n      onKeyDown: composeEventHandlers(consumerProps.onKeyDown, onKeyDown),\n    },\n    render,\n    state: { disabled, readOnly, required },\n  });\n}\n\nexport function NumberFieldIncrement<TAs extends ElementType = \"button\">(\n  props: NumberFieldIncrementProps<TAs>,\n): ReactElement | null {\n  const { as, render, ...consumerProps } = props as PolymorphicProps<\n    \"button\",\n    { readonly children?: ReactNode }\n  >;\n  const { disabled, increment, readOnly } = useNumberFieldContext(\"Increment\");\n  const inactive = disabled || readOnly;\n  const repeatProps = usePressRepeat(() => increment(), inactive);\n\n  return useRenderElement({\n    as,\n    defaultTag: \"button\",\n    props: {\n      ...consumerProps,\n      type: \"button\",\n      tabIndex: -1,\n      \"data-disabled\": inactive ? \"\" : undefined,\n      disabled: inactive || undefined,\n      onClick: composeEventHandlers(consumerProps.onClick, () => increment()),\n      onPointerDown: composeEventHandlers(consumerProps.onPointerDown, repeatProps.onPointerDown),\n      onPointerUp: composeEventHandlers(consumerProps.onPointerUp, repeatProps.onPointerUp),\n      onPointerLeave: composeEventHandlers(\n        consumerProps.onPointerLeave,\n        repeatProps.onPointerLeave,\n      ),\n      onPointerCancel: composeEventHandlers(\n        consumerProps.onPointerCancel,\n        repeatProps.onPointerCancel,\n      ),\n    },\n    render,\n    state: { disabled: inactive },\n  });\n}\n\nexport function NumberFieldDecrement<TAs extends ElementType = \"button\">(\n  props: NumberFieldDecrementProps<TAs>,\n): ReactElement | null {\n  const { as, render, ...consumerProps } = props as PolymorphicProps<\n    \"button\",\n    { readonly children?: ReactNode }\n  >;\n  const { decrement, disabled, readOnly } = useNumberFieldContext(\"Decrement\");\n  const inactive = disabled || readOnly;\n  const repeatProps = usePressRepeat(() => decrement(), inactive);\n\n  return useRenderElement({\n    as,\n    defaultTag: \"button\",\n    props: {\n      ...consumerProps,\n      type: \"button\",\n      tabIndex: -1,\n      \"data-disabled\": inactive ? \"\" : undefined,\n      disabled: inactive || undefined,\n      onClick: composeEventHandlers(consumerProps.onClick, () => decrement()),\n      onPointerDown: composeEventHandlers(consumerProps.onPointerDown, repeatProps.onPointerDown),\n      onPointerUp: composeEventHandlers(consumerProps.onPointerUp, repeatProps.onPointerUp),\n      onPointerLeave: composeEventHandlers(\n        consumerProps.onPointerLeave,\n        repeatProps.onPointerLeave,\n      ),\n      onPointerCancel: composeEventHandlers(\n        consumerProps.onPointerCancel,\n        repeatProps.onPointerCancel,\n      ),\n    },\n    render,\n    state: { disabled: inactive },\n  });\n}\n\nexport const NumberField = {\n  Root: NumberFieldRoot,\n  Group: NumberFieldGroup,\n  Input: NumberFieldInput,\n  Increment: NumberFieldIncrement,\n  Decrement: NumberFieldDecrement,\n};\n"],"mappings":"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","names":[]}

package/dist/components/number-field/format.d.ts

@@ -0,0 +1,6 @@
+export declare function clampNumber(value: number, min?: number, max?: number): number;
+export declare function createFormatter(options?: Intl.NumberFormatOptions): Intl.NumberFormat;
+export declare function formatNumber(value: number, formatter: Intl.NumberFormat): string;
+export declare function parseNumber(input: string, formatter: Intl.NumberFormat): number | undefined;
+export declare function stepNumber(value: number, delta: number, step: number, min?: number, max?: number): number;
+//# sourceMappingURL=format.d.ts.map

package/dist/components/number-field/format.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/format.ts"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAK7E;AAED,wBAAgB,eAAe,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,YAAY,CAErF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,YAAY,GAAG,MAAM,CAEhF;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,YAAY,GAAG,MAAM,GAAG,SAAS,CAa3F;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,MAAM,EACZ,GAAG,CAAC,EAAE,MAAM,EACZ,GAAG,CAAC,EAAE,MAAM,GACX,MAAM,CAMR"}

package/dist/components/number-field/format.js

@@ -0,0 +1,35 @@
+function clampNumber(value, min, max) {
+  let next = value;
+  if (min !== void 0 && next < min) next = min;
+  if (max !== void 0 && next > max) next = max;
+  return next;
+}
+function createFormatter(options) {
+  return new Intl.NumberFormat(void 0, options);
+}
+function formatNumber(value, formatter) {
+  return formatter.format(value);
+}
+function parseNumber(input, formatter) {
+  const trimmed = input.trim();
+  if (trimmed === "") return void 0;
+  const parts = formatter.formatToParts(12345.6);
+  const decimal = parts.find((part) => part.type === "decimal")?.value ?? ".";
+  const group = parts.find((part) => part.type === "group")?.value ?? ",";
+  const normalized = trimmed.replaceAll(group, "").replace(decimal, ".").replace(/[^\d.-]/g, "");
+  const parsed = Number(normalized);
+  return Number.isFinite(parsed) ? parsed : void 0;
+}
+function stepNumber(value, delta, step, min, max) {
+  const precision = step.toString().includes(".") ? step.toString().split(".")[1]?.length ?? 0 : 0;
+  const next = Number((value + delta * step).toFixed(precision));
+  return clampNumber(next, min, max);
+}
+export {
+  clampNumber,
+  createFormatter,
+  formatNumber,
+  parseNumber,
+  stepNumber
+};
+//# sourceMappingURL=format.js.map

package/dist/components/number-field/format.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/number-field/format.ts"],"sourcesContent":["export function clampNumber(value: number, min?: number, max?: number): number {\n  let next = value;\n  if (min !== undefined && next < min) next = min;\n  if (max !== undefined && next > max) next = max;\n  return next;\n}\n\nexport function createFormatter(options?: Intl.NumberFormatOptions): Intl.NumberFormat {\n  return new Intl.NumberFormat(undefined, options);\n}\n\nexport function formatNumber(value: number, formatter: Intl.NumberFormat): string {\n  return formatter.format(value);\n}\n\nexport function parseNumber(input: string, formatter: Intl.NumberFormat): number | undefined {\n  const trimmed = input.trim();\n  if (trimmed === \"\") return undefined;\n\n  const parts = formatter.formatToParts(12345.6);\n  const decimal = parts.find((part) => part.type === \"decimal\")?.value ?? \".\";\n  const group = parts.find((part) => part.type === \"group\")?.value ?? \",\";\n  const normalized = trimmed\n    .replaceAll(group, \"\")\n    .replace(decimal, \".\")\n    .replace(/[^\\d.-]/g, \"\");\n  const parsed = Number(normalized);\n  return Number.isFinite(parsed) ? parsed : undefined;\n}\n\nexport function stepNumber(\n  value: number,\n  delta: number,\n  step: number,\n  min?: number,\n  max?: number,\n): number {\n  const precision = step.toString().includes(\".\")\n    ? (step.toString().split(\".\")[1]?.length ?? 0)\n    : 0;\n  const next = Number((value + delta * step).toFixed(precision));\n  return clampNumber(next, min, max);\n}\n"],"mappings":"AAAO,SAAS,YAAY,OAAe,KAAc,KAAsB;AAC7E,MAAI,OAAO;AACX,MAAI,QAAQ,UAAa,OAAO,IAAK,QAAO;AAC5C,MAAI,QAAQ,UAAa,OAAO,IAAK,QAAO;AAC5C,SAAO;AACT;AAEO,SAAS,gBAAgB,SAAuD;AACrF,SAAO,IAAI,KAAK,aAAa,QAAW,OAAO;AACjD;AAEO,SAAS,aAAa,OAAe,WAAsC;AAChF,SAAO,UAAU,OAAO,KAAK;AAC/B;AAEO,SAAS,YAAY,OAAe,WAAkD;AAC3F,QAAM,UAAU,MAAM,KAAK;AAC3B,MAAI,YAAY,GAAI,QAAO;AAE3B,QAAM,QAAQ,UAAU,cAAc,OAAO;AAC7C,QAAM,UAAU,MAAM,KAAK,CAAC,SAAS,KAAK,SAAS,SAAS,GAAG,SAAS;AACxE,QAAM,QAAQ,MAAM,KAAK,CAAC,SAAS,KAAK,SAAS,OAAO,GAAG,SAAS;AACpE,QAAM,aAAa,QAChB,WAAW,OAAO,EAAE,EACpB,QAAQ,SAAS,GAAG,EACpB,QAAQ,YAAY,EAAE;AACzB,QAAM,SAAS,OAAO,UAAU;AAChC,SAAO,OAAO,SAAS,MAAM,IAAI,SAAS;AAC5C;AAEO,SAAS,WACd,OACA,OACA,MACA,KACA,KACQ;AACR,QAAM,YAAY,KAAK,SAAS,EAAE,SAAS,GAAG,IACzC,KAAK,SAAS,EAAE,MAAM,GAAG,EAAE,CAAC,GAAG,UAAU,IAC1C;AACJ,QAAM,OAAO,QAAQ,QAAQ,QAAQ,MAAM,QAAQ,SAAS,CAAC;AAC7D,SAAO,YAAY,MAAM,KAAK,GAAG;AACnC;","names":[]}

package/dist/components/number-field/index.d.ts

@@ -0,0 +1,3 @@
+export { NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, } from "./NumberField.js";
+export type { NumberFieldDecrementProps, NumberFieldGroupProps, NumberFieldIncrementProps, NumberFieldInputProps, NumberFieldRootOwnProps, NumberFieldRootProps, } from "./types.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/number-field/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,eAAe,GAChB,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EACV,yBAAyB,EACzB,qBAAqB,EACrB,yBAAyB,EACzB,qBAAqB,EACrB,uBAAuB,EACvB,oBAAoB,GACrB,MAAM,YAAY,CAAC"}

package/dist/components/number-field/index.js

@@ -0,0 +1,17 @@
+import {
+  NumberField,
+  NumberFieldDecrement,
+  NumberFieldGroup,
+  NumberFieldIncrement,
+  NumberFieldInput,
+  NumberFieldRoot
+} from "./NumberField.js";
+export {
+  NumberField,
+  NumberFieldDecrement,
+  NumberFieldGroup,
+  NumberFieldIncrement,
+  NumberFieldInput,
+  NumberFieldRoot
+};
+//# sourceMappingURL=index.js.map

package/dist/components/number-field/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/number-field/index.ts"],"sourcesContent":["export {\n  NumberField,\n  NumberFieldDecrement,\n  NumberFieldGroup,\n  NumberFieldIncrement,\n  NumberFieldInput,\n  NumberFieldRoot,\n} from \"./NumberField.js\";\nexport type {\n  NumberFieldDecrementProps,\n  NumberFieldGroupProps,\n  NumberFieldIncrementProps,\n  NumberFieldInputProps,\n  NumberFieldRootOwnProps,\n  NumberFieldRootProps,\n} from \"./types.js\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":[]}

package/dist/components/number-field/types.d.ts

@@ -0,0 +1,56 @@
+import type { ElementType, ReactNode, RefObject } from "react";
+import type { RenderableProps } from "@gunkin/uiify/core/render";
+export interface NumberFieldContextValue {
+    readonly clampValueOnBlur: boolean;
+    readonly commitInput: (raw: string) => void;
+    readonly decrement: (multiplier?: number) => void;
+    readonly disabled: boolean;
+    readonly displayValue: string;
+    readonly formatter: Intl.NumberFormat;
+    readonly increment: (multiplier?: number) => void;
+    readonly inputId: string;
+    readonly inputRef: RefObject<HTMLInputElement | null>;
+    readonly max?: number | undefined;
+    readonly min?: number | undefined;
+    readonly numericValue: number | undefined;
+    readonly readOnly: boolean;
+    readonly required: boolean;
+    readonly setDisplayValue: (next: string) => void;
+    readonly setEditing: (next: boolean) => void;
+}
+export interface NumberFieldRootOwnProps {
+    readonly allowWheel?: boolean;
+    readonly clampValueOnBlur?: boolean;
+    readonly defaultValue?: number;
+    readonly disabled?: boolean;
+    readonly formatOptions?: Intl.NumberFormatOptions;
+    readonly max?: number;
+    readonly min?: number;
+    readonly onChange?: (value: number | undefined) => void;
+    readonly readOnly?: boolean;
+    readonly required?: boolean;
+    readonly step?: number;
+    readonly value?: number;
+}
+export type NumberFieldRootProps<TAs extends ElementType = "div"> = RenderableProps<TAs, NumberFieldRootOwnProps, NumberFieldRootOwnProps, HTMLElement>;
+export type NumberFieldGroupProps<TAs extends ElementType = "div"> = RenderableProps<TAs, {
+    readonly children?: ReactNode;
+}, {
+    disabled: boolean;
+}, HTMLElement>;
+export type NumberFieldInputProps<TAs extends ElementType = "input"> = RenderableProps<TAs, Record<string, never>, {
+    disabled: boolean;
+    readOnly: boolean;
+    required: boolean;
+}, HTMLInputElement>;
+export type NumberFieldIncrementProps<TAs extends ElementType = "button"> = RenderableProps<TAs, {
+    readonly children?: ReactNode;
+}, {
+    disabled: boolean;
+}, HTMLButtonElement>;
+export type NumberFieldDecrementProps<TAs extends ElementType = "button"> = RenderableProps<TAs, {
+    readonly children?: ReactNode;
+}, {
+    disabled: boolean;
+}, HTMLButtonElement>;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/number-field/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACnC,QAAQ,CAAC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,SAAS,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC;IACtC,QAAQ,CAAC,SAAS,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACtD,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IACpC,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IAClD,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IACxD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,oBAAoB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CACjF,GAAG,EACH,uBAAuB,EACvB,uBAAuB,EACvB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAClF,GAAG,EACH;IAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,EACjC;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,IAAI,eAAe,CACpF,GAAG,EACH,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB;IAAE,QAAQ,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAE,EAC3D,gBAAgB,CACjB,CAAC;AAEF,MAAM,MAAM,yBAAyB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,IAAI,eAAe,CACzF,GAAG,EACH;IAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,EACjC;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,iBAAiB,CAClB,CAAC;AAEF,MAAM,MAAM,yBAAyB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,IAAI,eAAe,CACzF,GAAG,EACH;IAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,EACjC;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,iBAAiB,CAClB,CAAC"}

package/dist/components/number-field/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/components/number-field/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/number-field/use-press-repeat.d.ts

@@ -0,0 +1,8 @@
+import type { PointerEvent as ReactPointerEvent } from "react";
+export declare function usePressRepeat(onRepeat: () => void, disabled: boolean): {
+    onPointerDown: (event: ReactPointerEvent) => void;
+    onPointerUp: () => void;
+    onPointerLeave: () => void;
+    onPointerCancel: () => void;
+};
+//# sourceMappingURL=use-press-repeat.d.ts.map

package/dist/components/number-field/use-press-repeat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-press-repeat.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/use-press-repeat.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,IAAI,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAO/D,wBAAgB,cAAc,CAAC,QAAQ,EAAE,MAAM,IAAI,EAAE,QAAQ,EAAE,OAAO;2BAQ1D,iBAAiB;;;;EAoB5B"}

package/dist/components/number-field/use-press-repeat.js

@@ -0,0 +1,34 @@
+"use client";
+import { useCallback, useState } from "react";
+import { useInterval, useTimeout } from "@gunkin/uiify/hooks";
+const INITIAL_DELAY_MS = 400;
+const REPEAT_INTERVAL_MS = 80;
+function usePressRepeat(onRepeat, disabled) {
+  const [holding, setHolding] = useState(false);
+  const [repeating, setRepeating] = useState(false);
+  useTimeout(() => setRepeating(true), holding && !repeating ? INITIAL_DELAY_MS : null);
+  useInterval(onRepeat, holding && repeating ? REPEAT_INTERVAL_MS : null);
+  const onPointerDown = useCallback(
+    (event) => {
+      if (disabled || event.button !== 0) return;
+      event.preventDefault();
+      onRepeat();
+      setHolding(true);
+    },
+    [disabled, onRepeat]
+  );
+  const stop = useCallback(() => {
+    setHolding(false);
+    setRepeating(false);
+  }, []);
+  return {
+    onPointerDown,
+    onPointerUp: stop,
+    onPointerLeave: stop,
+    onPointerCancel: stop
+  };
+}
+export {
+  usePressRepeat
+};
+//# sourceMappingURL=use-press-repeat.js.map

package/dist/components/number-field/use-press-repeat.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/number-field/use-press-repeat.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useState } from \"react\";\nimport type { PointerEvent as ReactPointerEvent } from \"react\";\nimport { useInterval, useTimeout } from \"@gunkin/uiify/hooks\";\n\nconst INITIAL_DELAY_MS = 400;\n\nconst REPEAT_INTERVAL_MS = 80;\n\nexport function usePressRepeat(onRepeat: () => void, disabled: boolean) {\n  const [holding, setHolding] = useState(false);\n  const [repeating, setRepeating] = useState(false);\n\n  useTimeout(() => setRepeating(true), holding && !repeating ? INITIAL_DELAY_MS : null);\n  useInterval(onRepeat, holding && repeating ? REPEAT_INTERVAL_MS : null);\n\n  const onPointerDown = useCallback(\n    (event: ReactPointerEvent) => {\n      if (disabled || event.button !== 0) return;\n      event.preventDefault();\n      onRepeat();\n      setHolding(true);\n    },\n    [disabled, onRepeat],\n  );\n\n  const stop = useCallback(() => {\n    setHolding(false);\n    setRepeating(false);\n  }, []);\n\n  return {\n    onPointerDown,\n    onPointerUp: stop,\n    onPointerLeave: stop,\n    onPointerCancel: stop,\n  };\n}\n"],"mappings":";AAEA,SAAS,aAAa,gBAAgB;AAEtC,SAAS,aAAa,kBAAkB;AAExC,MAAM,mBAAmB;AAEzB,MAAM,qBAAqB;AAEpB,SAAS,eAAe,UAAsB,UAAmB;AACtE,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,aAAW,MAAM,aAAa,IAAI,GAAG,WAAW,CAAC,YAAY,mBAAmB,IAAI;AACpF,cAAY,UAAU,WAAW,YAAY,qBAAqB,IAAI;AAEtE,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAA6B;AAC5B,UAAI,YAAY,MAAM,WAAW,EAAG;AACpC,YAAM,eAAe;AACrB,eAAS;AACT,iBAAW,IAAI;AAAA,IACjB;AAAA,IACA,CAAC,UAAU,QAAQ;AAAA,EACrB;AAEA,QAAM,OAAO,YAAY,MAAM;AAC7B,eAAW,KAAK;AAChB,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,CAAC;AAEL,SAAO;AAAA,IACL;AAAA,IACA,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,EACnB;AACF;","names":[]}