Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@zag-js/number-input

Package Overview
Dependencies
Maintainers
0
Versions
1034
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@zag-js/number-input - npm Package Compare versions

Comparing version 0.70.0 to 0.71.0

192

dist/index.js

@@ -1,32 +0,14 @@

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
'use strict';
// src/index.ts
var src_exports = {};
__export(src_exports, {
anatomy: () => anatomy,
connect: () => connect,
machine: () => machine
});
module.exports = __toCommonJS(src_exports);
var anatomy$1 = require('@zag-js/anatomy');
var domEvent = require('@zag-js/dom-event');
var domQuery = require('@zag-js/dom-query');
var numberUtils = require('@zag-js/number-utils');
var core = require('@zag-js/core');
var formUtils = require('@zag-js/form-utils');
var utils = require('@zag-js/utils');
var number = require('@internationalized/number');
// src/number-input.anatomy.ts
var import_anatomy = require("@zag-js/anatomy");
var anatomy = (0, import_anatomy.createAnatomy)("numberInput").parts(
var anatomy = anatomy$1.createAnatomy("numberInput").parts(
"root",

@@ -42,12 +24,3 @@ "label",

var parts = anatomy.build();
// src/number-input.connect.ts
var import_dom_event = require("@zag-js/dom-event");
var import_dom_query2 = require("@zag-js/dom-query");
var import_number_utils2 = require("@zag-js/number-utils");
// src/number-input.dom.ts
var import_dom_query = require("@zag-js/dom-query");
var import_number_utils = require("@zag-js/number-utils");
var dom = (0, import_dom_query.createScope)({
var dom = domQuery.createScope({
getRootId: (ctx) => ctx.ids?.root ?? `number-input:${ctx.id}`,

@@ -76,3 +49,3 @@ getInputId: (ctx) => ctx.ids?.input ?? `number-input:${ctx.id}:input`,

setupVirtualCursor(ctx) {
if ((0, import_dom_query.isSafari)()) return;
if (domQuery.isSafari()) return;
dom.createVirtualCursor(ctx);

@@ -103,4 +76,4 @@ return () => {

getMousementValue(ctx, event) {
const x = (0, import_number_utils.roundToDevicePixel)(event.movementX);
const y = (0, import_number_utils.roundToDevicePixel)(event.movementY);
const x = numberUtils.roundToDevicePixel(event.movementX);
const y = numberUtils.roundToDevicePixel(event.movementY);
let hint = x > 0 ? "increment" : x < 0 ? "decrement" : null;

@@ -115,4 +88,4 @@ if (ctx.isRtl && hint === "increment") hint = "decrement";

const width = win.innerWidth;
const half = (0, import_number_utils.roundToDevicePixel)(7.5);
point.x = (0, import_number_utils.wrap)(point.x + half, width) - half;
const half = numberUtils.roundToDevicePixel(7.5);
point.x = numberUtils.wrap(point.x + half, width) - half;
return { hint, point };

@@ -132,3 +105,3 @@ },

top: "0px",
zIndex: import_dom_query.MAX_Z_INDEX,
zIndex: domQuery.MAX_Z_INDEX,
transform: ctx.scrubberCursorPoint ? `translate3d(${ctx.scrubberCursorPoint.x}px, ${ctx.scrubberCursorPoint.y}px, 0px)` : void 0,

@@ -190,5 +163,5 @@ willChange: "transform"

dir: state.context.dir,
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-focus": (0, import_dom_query2.dataAttr)(focused),
"data-invalid": (0, import_dom_query2.dataAttr)(invalid)
"data-disabled": domQuery.dataAttr(disabled),
"data-focus": domQuery.dataAttr(focused),
"data-invalid": domQuery.dataAttr(invalid)
});

@@ -200,5 +173,5 @@ },

dir: state.context.dir,
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-focus": (0, import_dom_query2.dataAttr)(focused),
"data-invalid": (0, import_dom_query2.dataAttr)(invalid),
"data-disabled": domQuery.dataAttr(disabled),
"data-focus": domQuery.dataAttr(focused),
"data-invalid": domQuery.dataAttr(invalid),
id: dom.getLabelId(state.context),

@@ -214,6 +187,6 @@ htmlFor: dom.getInputId(state.context)

"aria-disabled": disabled,
"data-focus": (0, import_dom_query2.dataAttr)(focused),
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-invalid": (0, import_dom_query2.dataAttr)(invalid),
"aria-invalid": (0, import_dom_query2.ariaAttr)(state.context.invalid)
"data-focus": domQuery.dataAttr(focused),
"data-disabled": domQuery.dataAttr(disabled),
"data-invalid": domQuery.dataAttr(invalid),
"aria-invalid": domQuery.ariaAttr(state.context.invalid)
});

@@ -225,5 +198,5 @@ },

dir: state.context.dir,
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-invalid": (0, import_dom_query2.dataAttr)(invalid),
"data-focus": (0, import_dom_query2.dataAttr)(focused)
"data-disabled": domQuery.dataAttr(disabled),
"data-invalid": domQuery.dataAttr(invalid),
"data-focus": domQuery.dataAttr(focused)
});

@@ -242,6 +215,6 @@ },

inputMode: state.context.inputMode,
"aria-invalid": (0, import_dom_query2.ariaAttr)(invalid),
"data-invalid": (0, import_dom_query2.dataAttr)(invalid),
"aria-invalid": domQuery.ariaAttr(invalid),
"data-invalid": domQuery.dataAttr(invalid),
disabled,
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-disabled": domQuery.dataAttr(disabled),
readOnly: state.context.readOnly,

@@ -281,4 +254,4 @@ required: state.context.required,

if (readOnly) return;
if ((0, import_dom_query2.isComposingEvent)(event)) return;
const step = (0, import_dom_event.getEventStep)(event) * state.context.step;
if (domQuery.isComposingEvent(event)) return;
const step = domEvent.getEventStep(event) * state.context.step;
const keyMap = {

@@ -316,3 +289,3 @@ ArrowUp() {

disabled: isDecrementDisabled,
"data-disabled": (0, import_dom_query2.dataAttr)(isDecrementDisabled),
"data-disabled": domQuery.dataAttr(isDecrementDisabled),
"aria-label": translations.decrementLabel,

@@ -323,3 +296,3 @@ type: "button",

onPointerDown(event) {
if (isDecrementDisabled || !(0, import_dom_event.isLeftClick)(event)) return;
if (isDecrementDisabled || !domEvent.isLeftClick(event)) return;
send({ type: "TRIGGER.PRESS_DOWN", hint: "decrement", pointerType: event.pointerType });

@@ -348,3 +321,3 @@ if (event.pointerType === "mouse") {

disabled: isIncrementDisabled,
"data-disabled": (0, import_dom_query2.dataAttr)(isIncrementDisabled),
"data-disabled": domQuery.dataAttr(isIncrementDisabled),
"aria-label": translations.incrementLabel,

@@ -355,3 +328,3 @@ type: "button",

onPointerDown(event) {
if (isIncrementDisabled || !(0, import_dom_event.isLeftClick)(event)) return;
if (isIncrementDisabled || !domEvent.isLeftClick(event)) return;
send({ type: "TRIGGER.PRESS_DOWN", hint: "increment", pointerType: event.pointerType });

@@ -377,3 +350,3 @@ if (event.pointerType === "mouse") {

dir: state.context.dir,
"data-disabled": (0, import_dom_query2.dataAttr)(disabled),
"data-disabled": domQuery.dataAttr(disabled),
id: dom.getScrubberId(state.context),

@@ -383,5 +356,5 @@ role: "presentation",

if (disabled) return;
const point = (0, import_dom_event.getEventPoint)(event);
point.x = point.x - (0, import_number_utils2.roundToDevicePixel)(7.5);
point.y = point.y - (0, import_number_utils2.roundToDevicePixel)(7.5);
const point = domEvent.getEventPoint(event);
point.x = point.x - numberUtils.roundToDevicePixel(7.5);
point.y = point.y - numberUtils.roundToDevicePixel(7.5);
send({ type: "SCRUBBER.PRESS_DOWN", point });

@@ -398,10 +371,2 @@ event.preventDefault();

// src/number-input.machine.ts
var import_core2 = require("@zag-js/core");
var import_dom_event2 = require("@zag-js/dom-event");
var import_dom_query3 = require("@zag-js/dom-query");
var import_form_utils = require("@zag-js/form-utils");
var import_number_utils3 = require("@zag-js/number-utils");
var import_utils = require("@zag-js/utils");
// src/cursor.ts

@@ -449,11 +414,7 @@ function recordCursor(inputEl) {

}
// src/number-input.utils.ts
var import_number = require("@internationalized/number");
var import_core = require("@zag-js/core");
var createFormatter = (locale, options = {}) => {
return (0, import_core.ref)(new Intl.NumberFormat(locale, options));
return core.ref(new Intl.NumberFormat(locale, options));
};
var createParser = (locale, options = {}) => {
return (0, import_core.ref)(new import_number.NumberParser(locale, options));
return core.ref(new number.NumberParser(locale, options));
};

@@ -471,6 +432,6 @@ var parseValue = (ctx, value) => {

// src/number-input.machine.ts
var { not, and } = import_core2.guards;
var { not, and } = core.guards;
function machine(userContext) {
const ctx = (0, import_utils.compact)(userContext);
return (0, import_core2.createMachine)(
const ctx = utils.compact(userContext);
return core.createMachine(
{

@@ -511,5 +472,5 @@ id: "number-input",

formattedValue: (ctx2) => formatValue(ctx2, ctx2.valueAsNumber),
isAtMin: (ctx2) => (0, import_number_utils3.isAtMin)(ctx2.valueAsNumber, ctx2),
isAtMax: (ctx2) => (0, import_number_utils3.isAtMax)(ctx2.valueAsNumber, ctx2),
isOutOfRange: (ctx2) => !(0, import_number_utils3.isWithinRange)(ctx2.valueAsNumber, ctx2),
isAtMin: (ctx2) => numberUtils.isAtMin(ctx2.valueAsNumber, ctx2),
isAtMax: (ctx2) => numberUtils.isAtMax(ctx2.valueAsNumber, ctx2),
isOutOfRange: (ctx2) => !numberUtils.isWithinRange(ctx2.valueAsNumber, ctx2),
isValueEmpty: (ctx2) => ctx2.value === "",

@@ -609,3 +570,3 @@ isDisabled: (ctx2) => !!ctx2.disabled || ctx2.fieldsetDisabled,

activities: "trackButtonDisabled",
entry: (0, import_core2.choose)([
entry: core.choose([
{ guard: "isIncrementHint", actions: "increment" },

@@ -689,3 +650,3 @@ { guard: "isDecrementHint", actions: "decrement" }

const inputEl = dom.getInputEl(ctx2);
return (0, import_form_utils.trackFormControl)(inputEl, {
return formUtils.trackFormControl(inputEl, {
onFieldsetDisabledChange(disabled) {

@@ -707,3 +668,3 @@ ctx2.fieldsetDisabled = disabled;

const btn = dom.getPressedTriggerEl(ctx2, ctx2.hint);
return (0, import_dom_query3.observeAttributes)(btn, {
return domQuery.observeAttributes(btn, {
attributes: ["disabled"],

@@ -727,7 +688,7 @@ callback() {

}
return (0, import_dom_event2.addDomEvent)(inputEl, "wheel", onWheel, { passive: false });
return domEvent.addDomEvent(inputEl, "wheel", onWheel, { passive: false });
},
activatePointerLock(ctx2) {
if ((0, import_dom_query3.isSafari)()) return;
return (0, import_dom_event2.requestPointerLock)(dom.getDoc(ctx2));
if (domQuery.isSafari()) return;
return domEvent.requestPointerLock(dom.getDoc(ctx2));
},

@@ -749,5 +710,5 @@ trackMousemove(ctx2, _evt, { send }) {

}
return (0, import_utils.callAll)(
(0, import_dom_event2.addDomEvent)(doc, "mousemove", onMousemove, false),
(0, import_dom_event2.addDomEvent)(doc, "mouseup", onMouseup, false)
return utils.callAll(
domEvent.addDomEvent(doc, "mousemove", onMousemove, false),
domEvent.addDomEvent(doc, "mouseup", onMouseup, false)
);

@@ -761,16 +722,16 @@ }

if (dom.isActiveElement(ctx2, inputEl)) return;
(0, import_dom_query3.raf)(() => inputEl?.focus({ preventScroll: true }));
domQuery.raf(() => inputEl?.focus({ preventScroll: true }));
},
increment(ctx2, evt) {
const nextValue = (0, import_number_utils3.increment)(ctx2.valueAsNumber, evt.step ?? ctx2.step);
const value = formatValue(ctx2, (0, import_number_utils3.clamp)(nextValue, ctx2));
const nextValue = numberUtils.increment(ctx2.valueAsNumber, evt.step ?? ctx2.step);
const value = formatValue(ctx2, numberUtils.clamp(nextValue, ctx2));
set.value(ctx2, value);
},
decrement(ctx2, evt) {
const nextValue = (0, import_number_utils3.decrement)(ctx2.valueAsNumber, evt.step ?? ctx2.step);
const value = formatValue(ctx2, (0, import_number_utils3.clamp)(nextValue, ctx2));
const nextValue = numberUtils.decrement(ctx2.valueAsNumber, evt.step ?? ctx2.step);
const value = formatValue(ctx2, numberUtils.clamp(nextValue, ctx2));
set.value(ctx2, value);
},
setClampedValue(ctx2) {
const nextValue = (0, import_number_utils3.clamp)(ctx2.valueAsNumber, ctx2);
const nextValue = numberUtils.clamp(ctx2.valueAsNumber, ctx2);
set.value(ctx2, formatValue(ctx2, nextValue));

@@ -780,3 +741,3 @@ },

const parsedValue = parseValue(ctx2, evt.value);
const value = formatValue(ctx2, (0, import_number_utils3.clamp)(parsedValue, ctx2));
const value = formatValue(ctx2, numberUtils.clamp(parsedValue, ctx2));
set.value(ctx2, value);

@@ -857,4 +818,4 @@ },

compareFns: {
formatOptions: (a, b) => (0, import_utils.isEqual)(a, b),
scrubberCursorPoint: (a, b) => (0, import_utils.isEqual)(a, b)
formatOptions: (a, b) => utils.isEqual(a, b),
scrubberCursorPoint: (a, b) => utils.isEqual(a, b)
}

@@ -869,3 +830,3 @@ }

const sel = recordCursor(inputEl);
(0, import_dom_query3.raf)(() => {
domQuery.raf(() => {
dom.setValue(inputEl, value);

@@ -886,3 +847,3 @@ restoreCursor(inputEl, sel);

value: (ctx, value) => {
if ((0, import_utils.isEqual)(ctx.value, value)) return;
if (utils.isEqual(ctx.value, value)) return;
ctx.value = value;

@@ -892,8 +853,5 @@ invoke.onChange(ctx);

};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
anatomy,
connect,
machine
});
//# sourceMappingURL=index.js.map
exports.anatomy = anatomy;
exports.connect = connect;
exports.machine = machine;
{
"name": "@zag-js/number-input",
"version": "0.70.0",
"version": "0.71.0",
"description": "Core logic for the number-input widget implemented as a state machine",

@@ -20,4 +20,3 @@ "keywords": [

"files": [
"dist",
"src"
"dist"
],

@@ -32,10 +31,10 @@ "publishConfig": {

"@internationalized/number": "3.5.3",
"@zag-js/anatomy": "0.70.0",
"@zag-js/core": "0.70.0",
"@zag-js/dom-event": "0.70.0",
"@zag-js/dom-query": "0.70.0",
"@zag-js/form-utils": "0.70.0",
"@zag-js/number-utils": "0.70.0",
"@zag-js/types": "0.70.0",
"@zag-js/utils": "0.70.0"
"@zag-js/anatomy": "0.71.0",
"@zag-js/core": "0.71.0",
"@zag-js/dom-event": "0.71.0",
"@zag-js/dom-query": "0.71.0",
"@zag-js/form-utils": "0.71.0",
"@zag-js/number-utils": "0.71.0",
"@zag-js/types": "0.71.0",
"@zag-js/utils": "0.71.0"
},

@@ -42,0 +41,0 @@ "devDependencies": {

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc