pixi-solid 0.0.29 → 0.0.30

package/dist/types/utils/index.d.ts

@@ -1,2 +1,5 @@
 export type { ObjectFitMode } from "./object-fit";
 export { objectFit } from "./object-fit";
+export { useSmoothDamp } from "./smooth-damp";
+export type { Spring, UseSpringProps } from "./spring";
+export { useSpring } from "./spring";

package/dist/types/utils/smooth-damp.d.ts

@@ -0,0 +1,36 @@
+import type { Accessor } from "solid-js";
+/**
+ * Smoothly dampens a value towards a target over time.
+ * This is similar to Unity's Mathf.SmoothDamp function.
+ *
+ * @param current - The current value.
+ * @param target - The target value.
+ * @param velocity - A reference to the current velocity. This should be persistent between calls.
+ * @param smoothTimeMs - The approximate time it will take to reach the target in milliseconds. Smaller values will reach the target faster.
+ * @param maxSpeed - Optionally, the maximum speed the value can move in units per second. Defaults to Infinity.
+ * @param deltaTime - The time since the last call in seconds. Defaults to 1/60 (assuming 60 FPS).
+ * @param precision - Optionally, the threshold for snapping the value to the target. If the absolute difference between the current and target value is less than this, it snaps to the target. Defaults to 0.01.
+ * @returns The new current value.
+ */
+export declare const smoothDamp: (current: number, target: number, velocity: {
+    value: number;
+}, smoothTimeMs?: number, maxSpeed?: number, deltaTime?: number, precision?: number) => number;
+/**
+ * A SolidJS hook that provides a smoothly damped signal towards a target value.
+ * Internally manages velocity and continuous updates synced to the Pixi ticker.
+ *
+ * @param to - An accessor for the target value to damp towards.
+ * @param smoothTimeMs - The approximate time it will take to reach the target in milliseconds. Smaller values will reach the target faster. Defaults to 300ms.
+ * @param maxSpeed - Optionally, the maximum speed the value can move in units per second. Defaults to Infinity.
+ * @returns A signal containing the current damped value.
+ */
+export type UseSmoothDampProps = {
+    to: () => number;
+    smoothTimeMs?: () => number;
+    maxSpeed?: () => number;
+};
+export type SmoothDamp = {
+    value: Accessor<number>;
+    velocity: Accessor<number>;
+};
+export declare const useSmoothDamp: (props: UseSmoothDampProps) => SmoothDamp;

package/dist/types/utils/spring.d.ts

@@ -0,0 +1,26 @@
+import type { Accessor } from "solid-js";
+/**
+ * @typedef {Object} UseSpringProps
+ * @property {Accessor<number>} to - An accessor for the target value for the spring.
+ * @property {Accessor<number>} [stiffness=10] - Effective range from 0 - 100. Controls the spring's resistance to displacement.
+ * @property {Accessor<number>} [damping=30] - Effective range from 0 - 100. Controls the amount of friction or resistance to motion.
+ * @property {Accessor<number>} [mass=20] - Effective range from 0 - 100. Controls the inertia of the spring.
+ */
+export type UseSpringProps = {
+    to: () => number;
+    stiffness?: () => number;
+    damping?: () => number;
+    mass?: () => number;
+};
+export type Spring = {
+    value: Accessor<number>;
+    velocity: Accessor<number>;
+};
+/**
+ * A SolidJS hook that provides a spring-animated signal towards a target value.
+ * Internally manages the spring physics and continuous updates synced to the Pixi ticker.
+ *
+ * @param {UseSpringProps} props - The properties for the spring animation.
+ * @returns {Accessor<number>} A signal containing the current spring-animated value.
+ */
+export declare const useSpring: (props: UseSpringProps) => Spring;

package/dist/utils/index.js

@@ -1,5 +1,9 @@
 import { objectFit } from "./object-fit.js";
+import { useSmoothDamp } from "./smooth-damp.js";
+import { useSpring } from "./spring.js";
 export {
-  objectFit
+  objectFit,
+  useSmoothDamp,
+  useSpring
 };
 //# sourceMappingURL=index.js.map

package/dist/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/utils/object-fit.js.map

@@ -1 +1 @@
-{"version":3,"file":"object-fit.js","sources":["../../src/utils/object-fit.ts"],"sourcesContent":["import type * as Pixi from \"pixi.js\";\n\nexport type ObjectFitMode = \"cover\" | \"contain\" | \"fill\" | \"scale-down\";\n\n/**\n * Scale an object to fit within the given bounds according to the specified fit mode.\n * @param object The object to be scaled.\n * @param bounds The bounds it should fit within.\n * @param fitMode The object fit mode to apply.\n */\nexport const objectFit = (\n  object: Pixi.Container,\n  bounds: { width: number; height: number },\n  fitMode: ObjectFitMode,\n): void => {\n  const originalWidth = object.width / object.scale.x;\n  const originalHeight = object.height / object.scale.y;\n\n  if (originalWidth === 0 || originalHeight === 0 || bounds.width === 0 || bounds.height === 0)\n    return;\n\n  const widthRatio = bounds.width / originalWidth;\n  const heightRatio = bounds.height / originalHeight;\n\n  let scaleX = 1;\n  let scaleY = 1;\n\n  switch (fitMode) {\n    case \"cover\": {\n      const coverScale = Math.max(widthRatio, heightRatio);\n      scaleX = coverScale;\n      scaleY = coverScale;\n      break;\n    }\n    case \"contain\": {\n      const containScale = Math.min(widthRatio, heightRatio);\n      scaleX = containScale;\n      scaleY = containScale;\n      break;\n    }\n    case \"fill\": {\n      scaleX = widthRatio;\n      scaleY = heightRatio;\n      break;\n    }\n    case \"scale-down\": {\n      // If the object is smaller than the container, it's 'none' (no scaling up).\n      // Otherwise, it's 'contain'.\n      if (originalWidth <= bounds.width && originalHeight <= bounds.height) {\n        scaleX = 1;\n        scaleY = 1;\n      } else {\n        const scaleDown = Math.min(widthRatio, heightRatio);\n        scaleX = scaleDown;\n        scaleY = scaleDown;\n      }\n      break;\n    }\n    default:\n      // Default to no scaling if an unknown fitMode is provided\n      break;\n  }\n\n  object.scale.set(scaleX, scaleY);\n\n  // Center the object\n  object.x = (bounds.width - object.width) / 2;\n  object.y = (bounds.height - object.height) / 2;\n};\n"],"names":[],"mappings":"AAUO,MAAM,YAAY,CACvB,QACA,QACA,YACS;AACT,QAAM,gBAAgB,OAAO,QAAQ,OAAO,MAAM;AAClD,QAAM,iBAAiB,OAAO,SAAS,OAAO,MAAM;AAEpD,MAAI,kBAAkB,KAAK,mBAAmB,KAAK,OAAO,UAAU,KAAK,OAAO,WAAW;AACzF;AAEF,QAAM,aAAa,OAAO,QAAQ;AAClC,QAAM,cAAc,OAAO,SAAS;AAEpC,MAAI,SAAS;AACb,MAAI,SAAS;AAEb,UAAQ,SAAA;AAAA,IACN,KAAK,SAAS;AACZ,YAAM,aAAa,KAAK,IAAI,YAAY,WAAW;AACnD,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,WAAW;AACd,YAAM,eAAe,KAAK,IAAI,YAAY,WAAW;AACrD,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,QAAQ;AACX,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,cAAc;AAGjB,UAAI,iBAAiB,OAAO,SAAS,kBAAkB,OAAO,QAAQ;AACpE,iBAAS;AACT,iBAAS;AAAA,MACX,OAAO;AACL,cAAM,YAAY,KAAK,IAAI,YAAY,WAAW;AAClD,iBAAS;AACT,iBAAS;AAAA,MACX;AACA;AAAA,IACF;AAAA,EAGE;AAGJ,SAAO,MAAM,IAAI,QAAQ,MAAM;AAG/B,SAAO,KAAK,OAAO,QAAQ,OAAO,SAAS;AAC3C,SAAO,KAAK,OAAO,SAAS,OAAO,UAAU;AAC/C;"}
+{"version":3,"file":"object-fit.js","sources":["../../src/utils/object-fit.ts"],"sourcesContent":["import type * as Pixi from \"pixi.js\";\n\nexport type ObjectFitMode = \"cover\" | \"contain\" | \"fill\" | \"scale-down\";\n\n/**\n * Scale an object to fit within the given bounds according to the specified fit mode.\n * @param object The object to be scaled.\n * @param bounds The bounds it should fit within.\n * @param fitMode The object fit mode to apply.\n */\nexport const objectFit = (\n  object: Pixi.Container,\n  bounds: { width: number; height: number },\n  fitMode: ObjectFitMode,\n): void => {\n  const originalWidth = object.width / object.scale.x;\n  const originalHeight = object.height / object.scale.y;\n\n  if (originalWidth === 0 || originalHeight === 0 || bounds.width === 0 || bounds.height === 0)\n    return;\n\n  const widthRatio = bounds.width / originalWidth;\n  const heightRatio = bounds.height / originalHeight;\n\n  let scaleX = 1;\n  let scaleY = 1;\n\n  // biome-ignore lint/nursery/noUnnecessaryConditions: <explanation>\n  switch (fitMode) {\n    case \"cover\": {\n      const coverScale = Math.max(widthRatio, heightRatio);\n      scaleX = coverScale;\n      scaleY = coverScale;\n      break;\n    }\n    case \"contain\": {\n      const containScale = Math.min(widthRatio, heightRatio);\n      scaleX = containScale;\n      scaleY = containScale;\n      break;\n    }\n    case \"fill\": {\n      scaleX = widthRatio;\n      scaleY = heightRatio;\n      break;\n    }\n    case \"scale-down\": {\n      // If the object is smaller than the container, it's 'none' (no scaling up).\n      // Otherwise, it's 'contain'.\n      if (originalWidth <= bounds.width && originalHeight <= bounds.height) {\n        scaleX = 1;\n        scaleY = 1;\n      } else {\n        const scaleDown = Math.min(widthRatio, heightRatio);\n        scaleX = scaleDown;\n        scaleY = scaleDown;\n      }\n      break;\n    }\n    default:\n      // Default to no scaling if an unknown fitMode is provided\n      break;\n  }\n\n  object.scale.set(scaleX, scaleY);\n\n  // Center the object\n  object.x = (bounds.width - object.width) / 2;\n  object.y = (bounds.height - object.height) / 2;\n};\n"],"names":[],"mappings":"AAUO,MAAM,YAAY,CACvB,QACA,QACA,YACS;AACT,QAAM,gBAAgB,OAAO,QAAQ,OAAO,MAAM;AAClD,QAAM,iBAAiB,OAAO,SAAS,OAAO,MAAM;AAEpD,MAAI,kBAAkB,KAAK,mBAAmB,KAAK,OAAO,UAAU,KAAK,OAAO,WAAW;AACzF;AAEF,QAAM,aAAa,OAAO,QAAQ;AAClC,QAAM,cAAc,OAAO,SAAS;AAEpC,MAAI,SAAS;AACb,MAAI,SAAS;AAGb,UAAQ,SAAA;AAAA,IACN,KAAK,SAAS;AACZ,YAAM,aAAa,KAAK,IAAI,YAAY,WAAW;AACnD,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,WAAW;AACd,YAAM,eAAe,KAAK,IAAI,YAAY,WAAW;AACrD,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,QAAQ;AACX,eAAS;AACT,eAAS;AACT;AAAA,IACF;AAAA,IACA,KAAK,cAAc;AAGjB,UAAI,iBAAiB,OAAO,SAAS,kBAAkB,OAAO,QAAQ;AACpE,iBAAS;AACT,iBAAS;AAAA,MACX,OAAO;AACL,cAAM,YAAY,KAAK,IAAI,YAAY,WAAW;AAClD,iBAAS;AACT,iBAAS;AAAA,MACX;AACA;AAAA,IACF;AAAA,EAGE;AAGJ,SAAO,MAAM,IAAI,QAAQ,MAAM;AAG/B,SAAO,KAAK,OAAO,QAAQ,OAAO,SAAS;AAC3C,SAAO,KAAK,OAAO,SAAS,OAAO,UAAU;AAC/C;"}

package/dist/utils/smooth-damp.js

@@ -0,0 +1,54 @@
+import { createSignal } from "solid-js";
+import { createMutable } from "solid-js/store";
+import { onTick } from "../pixi-application.js";
+const smoothDamp = (current, target, velocity, smoothTimeMs = 300, maxSpeed = Infinity, deltaTime = 1 / 60, precision = 0.01) => {
+  if (Math.abs(current - target) < precision && Math.abs(velocity.value) < precision) {
+    velocity.value = 0;
+    return target;
+  }
+  const smoothTime = smoothTimeMs / 1e3;
+  const omega = 2 / smoothTime;
+  const x = omega * deltaTime;
+  const exp = 1 / (1 + x + 0.48 * x * x + 0.235 * x * x * x);
+  const change = current - target;
+  const temp = (velocity.value + omega * change) * deltaTime;
+  velocity.value = (velocity.value - omega * temp) * exp;
+  let result = target + (change + temp) * exp;
+  if (maxSpeed !== Infinity) {
+    const maxChange = maxSpeed * deltaTime;
+    result = current + Math.max(-maxChange, Math.min(maxChange, result - current));
+  }
+  return result;
+};
+const useSmoothDamp = (props) => {
+  const [current, setCurrent] = createSignal(props.to());
+  const velocity = createMutable({ value: 0 });
+  const update = (deltaTimeMS) => {
+    if (current() === props.to()) {
+      velocity.value = 0;
+      return;
+    }
+    const deltaTime = deltaTimeMS / 1e3;
+    const newCurrent = smoothDamp(
+      current(),
+      props.to(),
+      velocity,
+      props.smoothTimeMs?.(),
+      props.maxSpeed?.(),
+      deltaTime
+    );
+    setCurrent(newCurrent);
+  };
+  onTick((ticker) => {
+    update(ticker.deltaMS);
+  });
+  return {
+    value: current,
+    velocity: () => velocity.value
+  };
+};
+export {
+  smoothDamp,
+  useSmoothDamp
+};
+//# sourceMappingURL=smooth-damp.js.map

package/dist/utils/smooth-damp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"smooth-damp.js","sources":["../../src/utils/smooth-damp.ts"],"sourcesContent":["import type { Accessor } from \"solid-js\";\nimport { createSignal } from \"solid-js\";\nimport { createMutable } from \"solid-js/store\";\nimport { onTick } from \"../pixi-application\";\n\n/**\n * Smoothly dampens a value towards a target over time.\n * This is similar to Unity's Mathf.SmoothDamp function.\n *\n * @param current - The current value.\n * @param target - The target value.\n * @param velocity - A reference to the current velocity. This should be persistent between calls.\n * @param smoothTimeMs - The approximate time it will take to reach the target in milliseconds. Smaller values will reach the target faster.\n * @param maxSpeed - Optionally, the maximum speed the value can move in units per second. Defaults to Infinity.\n * @param deltaTime - The time since the last call in seconds. Defaults to 1/60 (assuming 60 FPS).\n * @param precision - Optionally, the threshold for snapping the value to the target. If the absolute difference between the current and target value is less than this, it snaps to the target. Defaults to 0.01.\n * @returns The new current value.\n */\nexport const smoothDamp = (\n  current: number,\n  target: number,\n  velocity: { value: number },\n  smoothTimeMs: number = 300,\n  maxSpeed: number = Infinity,\n  deltaTime: number = 1 / 60,\n  precision: number = 0.01, // Added precision parameter with a default\n): number => {\n  // Check precision and velocity before doing calculations\n  if (Math.abs(current - target) < precision && Math.abs(velocity.value) < precision) {\n    velocity.value = 0; // Reset velocity\n    return target; // Snap to target and return early\n  }\n\n  const smoothTime = smoothTimeMs / 1000; // Convert smoothTimeMs to seconds\n  const omega = 2 / smoothTime;\n  const x = omega * deltaTime;\n  const exp = 1 / (1 + x + 0.48 * x * x + 0.235 * x * x * x);\n  const change = current - target;\n  const temp = (velocity.value + omega * change) * deltaTime;\n  velocity.value = (velocity.value - omega * temp) * exp;\n\n  let result = target + (change + temp) * exp;\n\n  // Clamp to max speed\n  if (maxSpeed !== Infinity) {\n    const maxChange = maxSpeed * deltaTime;\n    result = current + Math.max(-maxChange, Math.min(maxChange, result - current));\n  }\n\n  return result;\n};\n\n/**\n * A SolidJS hook that provides a smoothly damped signal towards a target value.\n * Internally manages velocity and continuous updates synced to the Pixi ticker.\n *\n * @param to - An accessor for the target value to damp towards.\n * @param smoothTimeMs - The approximate time it will take to reach the target in milliseconds. Smaller values will reach the target faster. Defaults to 300ms.\n * @param maxSpeed - Optionally, the maximum speed the value can move in units per second. Defaults to Infinity.\n * @returns A signal containing the current damped value.\n */\n\nexport type UseSmoothDampProps = {\n  to: () => number;\n  smoothTimeMs?: () => number;\n  maxSpeed?: () => number;\n};\n\nexport type SmoothDamp = {\n  value: Accessor<number>;\n  velocity: Accessor<number>;\n};\n\nexport const useSmoothDamp = (props: UseSmoothDampProps): SmoothDamp => {\n  const [current, setCurrent] = createSignal(props.to());\n  const velocity = createMutable({ value: 0 });\n\n  const update = (deltaTimeMS: number) => {\n    if (current() === props.to()) {\n      velocity.value = 0;\n      return;\n    }\n\n    const deltaTime = deltaTimeMS / 1000; // Convert milliseconds to seconds\n    const newCurrent = smoothDamp(\n      current(),\n      props.to(),\n      velocity,\n      props.smoothTimeMs?.(),\n      props.maxSpeed?.(),\n      deltaTime,\n    );\n    setCurrent(newCurrent);\n  };\n\n  onTick((ticker) => {\n    update(ticker.deltaMS);\n  });\n\n  return {\n    value: current,\n    velocity: () => velocity.value,\n  };\n};\n"],"names":[],"mappings":";;;AAkBO,MAAM,aAAa,CACxB,SACA,QACA,UACA,eAAuB,KACvB,WAAmB,UACnB,YAAoB,IAAI,IACxB,YAAoB,SACT;AAEX,MAAI,KAAK,IAAI,UAAU,MAAM,IAAI,aAAa,KAAK,IAAI,SAAS,KAAK,IAAI,WAAW;AAClF,aAAS,QAAQ;AACjB,WAAO;AAAA,EACT;AAEA,QAAM,aAAa,eAAe;AAClC,QAAM,QAAQ,IAAI;AAClB,QAAM,IAAI,QAAQ;AAClB,QAAM,MAAM,KAAK,IAAI,IAAI,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI;AACxD,QAAM,SAAS,UAAU;AACzB,QAAM,QAAQ,SAAS,QAAQ,QAAQ,UAAU;AACjD,WAAS,SAAS,SAAS,QAAQ,QAAQ,QAAQ;AAEnD,MAAI,SAAS,UAAU,SAAS,QAAQ;AAGxC,MAAI,aAAa,UAAU;AACzB,UAAM,YAAY,WAAW;AAC7B,aAAS,UAAU,KAAK,IAAI,CAAC,WAAW,KAAK,IAAI,WAAW,SAAS,OAAO,CAAC;AAAA,EAC/E;AAEA,SAAO;AACT;AAuBO,MAAM,gBAAgB,CAAC,UAA0C;AACtE,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,MAAM,IAAI;AACrD,QAAM,WAAW,cAAc,EAAE,OAAO,GAAG;AAE3C,QAAM,SAAS,CAAC,gBAAwB;AACtC,QAAI,QAAA,MAAc,MAAM,MAAM;AAC5B,eAAS,QAAQ;AACjB;AAAA,IACF;AAEA,UAAM,YAAY,cAAc;AAChC,UAAM,aAAa;AAAA,MACjB,QAAA;AAAA,MACA,MAAM,GAAA;AAAA,MACN;AAAA,MACA,MAAM,eAAA;AAAA,MACN,MAAM,WAAA;AAAA,MACN;AAAA,IAAA;AAEF,eAAW,UAAU;AAAA,EACvB;AAEA,SAAO,CAAC,WAAW;AACjB,WAAO,OAAO,OAAO;AAAA,EACvB,CAAC;AAED,SAAO;AAAA,IACL,OAAO;AAAA,IACP,UAAU,MAAM,SAAS;AAAA,EAAA;AAE7B;"}

package/dist/utils/spring.js

@@ -0,0 +1,32 @@
+import { createSignal } from "solid-js";
+import { onTick } from "../pixi-application.js";
+const useSpring = (props) => {
+  const [value, setValue] = createSignal(props.to());
+  const [velocity, setVelocity] = createSignal(0);
+  const update = (deltaTimeMS) => {
+    const targetInput = props.to();
+    if (Math.abs(velocity()) < 0.1 && Math.abs(value() - targetInput) < 0.01) {
+      setVelocity(0);
+      setValue(targetInput);
+      return;
+    }
+    const deltaTime = deltaTimeMS / 1e3;
+    const stiffness = percentToValueBetweenRange(props.stiffness?.() ?? 10, -1, -300);
+    const damping = percentToValueBetweenRange(props.damping?.() ?? 30, -0.4, -20);
+    const mass = percentToValueBetweenRange(props.mass?.() ?? 20, 0.1, 10);
+    const springX = stiffness * (value() - targetInput);
+    const damperX = damping * velocity();
+    const amplitude = (springX + damperX) / mass;
+    setVelocity((prev) => prev + amplitude * deltaTime);
+    setValue(value() + velocity() * deltaTime);
+  };
+  onTick((ticker) => {
+    update(ticker.deltaMS);
+  });
+  return { value, velocity };
+};
+const percentToValueBetweenRange = (percent, min, max) => percent * (max - min) / 100 + min;
+export {
+  useSpring
+};
+//# sourceMappingURL=spring.js.map

package/dist/utils/spring.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spring.js","sources":["../../src/utils/spring.ts"],"sourcesContent":["import type { Accessor } from \"solid-js\";\nimport { createSignal } from \"solid-js\";\nimport { onTick } from \"../pixi-application\";\n\n/**\n * @typedef {Object} UseSpringProps\n * @property {Accessor<number>} to - An accessor for the target value for the spring.\n * @property {Accessor<number>} [stiffness=10] - Effective range from 0 - 100. Controls the spring's resistance to displacement.\n * @property {Accessor<number>} [damping=30] - Effective range from 0 - 100. Controls the amount of friction or resistance to motion.\n * @property {Accessor<number>} [mass=20] - Effective range from 0 - 100. Controls the inertia of the spring.\n */\nexport type UseSpringProps = {\n  to: () => number;\n  stiffness?: () => number;\n  damping?: () => number;\n  mass?: () => number;\n};\n\nexport type Spring = {\n  value: Accessor<number>;\n  velocity: Accessor<number>;\n};\n\n/**\n * A SolidJS hook that provides a spring-animated signal towards a target value.\n * Internally manages the spring physics and continuous updates synced to the Pixi ticker.\n *\n * @param {UseSpringProps} props - The properties for the spring animation.\n * @returns {Accessor<number>} A signal containing the current spring-animated value.\n */\nexport const useSpring = (props: UseSpringProps): Spring => {\n  const [value, setValue] = createSignal(props.to());\n  const [velocity, setVelocity] = createSignal(0);\n\n  const update = (deltaTimeMS: number) => {\n    const targetInput = props.to();\n\n    // Settling condition: if output is very close to input and velocity is negligible,\n    // snap to input and stop calculations.\n    if (Math.abs(velocity()) < 0.1 && Math.abs(value() - targetInput) < 0.01) {\n      setVelocity(0);\n      setValue(targetInput);\n      return;\n    }\n\n    const deltaTime = deltaTimeMS / 1000; // Convert milliseconds to seconds\n\n    // Get current spring properties, using defaults if not provided\n    const stiffness = percentToValueBetweenRange(props.stiffness?.() ?? 10, -1, -300);\n    const damping = percentToValueBetweenRange(props.damping?.() ?? 30, -0.4, -20);\n    const mass = percentToValueBetweenRange(props.mass?.() ?? 20, 0.1, 10);\n\n    const springX = stiffness * (value() - targetInput);\n    const damperX = damping * velocity();\n    const amplitude = (springX + damperX) / mass;\n\n    setVelocity((prev) => prev + amplitude * deltaTime);\n    setValue(value() + velocity() * deltaTime);\n  };\n\n  onTick((ticker) => {\n    update(ticker.deltaMS);\n  });\n\n  return { value, velocity };\n};\n\n// Helper to convert 0-100 percent range to internal calculation range\nconst percentToValueBetweenRange = (percent: number, min: number, max: number) =>\n  (percent * (max - min)) / 100 + min;\n"],"names":[],"mappings":";;AA8BO,MAAM,YAAY,CAAC,UAAkC;AAC1D,QAAM,CAAC,OAAO,QAAQ,IAAI,aAAa,MAAM,IAAI;AACjD,QAAM,CAAC,UAAU,WAAW,IAAI,aAAa,CAAC;AAE9C,QAAM,SAAS,CAAC,gBAAwB;AACtC,UAAM,cAAc,MAAM,GAAA;AAI1B,QAAI,KAAK,IAAI,SAAA,CAAU,IAAI,OAAO,KAAK,IAAI,MAAA,IAAU,WAAW,IAAI,MAAM;AACxE,kBAAY,CAAC;AACb,eAAS,WAAW;AACpB;AAAA,IACF;AAEA,UAAM,YAAY,cAAc;AAGhC,UAAM,YAAY,2BAA2B,MAAM,iBAAiB,IAAI,IAAI,IAAI;AAChF,UAAM,UAAU,2BAA2B,MAAM,eAAe,IAAI,MAAM,GAAG;AAC7E,UAAM,OAAO,2BAA2B,MAAM,YAAY,IAAI,KAAK,EAAE;AAErE,UAAM,UAAU,aAAa,MAAA,IAAU;AACvC,UAAM,UAAU,UAAU,SAAA;AAC1B,UAAM,aAAa,UAAU,WAAW;AAExC,gBAAY,CAAC,SAAS,OAAO,YAAY,SAAS;AAClD,aAAS,MAAA,IAAU,SAAA,IAAa,SAAS;AAAA,EAC3C;AAEA,SAAO,CAAC,WAAW;AACjB,WAAO,OAAO,OAAO;AAAA,EACvB,CAAC;AAED,SAAO,EAAE,OAAO,SAAA;AAClB;AAGA,MAAM,6BAA6B,CAAC,SAAiB,KAAa,QAC/D,WAAW,MAAM,OAAQ,MAAM;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "pixi-solid",
   "private": false,
-  "version": "0.0.29",
+  "version": "0.0.30",
   "description": "A library to write PixiJS applications with SolidJS",
   "author": "Luke Thompson",
   "license": "MIT",