@net-advantage/nabs-ui-slider 0.70.0 → 0.72.0

package/dist/nabs-ui-slider.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime");var n=(0,e.forwardRef)(({label:n=`Slider`,value:r=0,min:i=0,max:a=100,step:o=1,disabled:s=!1,className:c=``,inputClassName:l=``,labelClassName:u=``,valueClassName:d=``,id:f,onChange:p,...m},h)=>{let g=(0,e.useId)(),_=f??`nabs-ui-slider-${g.replace(/:/g,``)}`,v=[`nabs-ui-slider`,s?`nabs-ui-slider--disabled`:``,c].filter(Boolean).join(` `),y=[`nabs-ui-slider__input`,l].filter(Boolean).join(` `),b=[`nabs-ui-slider__label`,u].filter(Boolean).join(` `),x=[`nabs-ui-slider__value`,d].filter(Boolean).join(` `);return(0,t.jsxs)(`div`,{className:v,children:[(0,t.jsxs)(`div`,{className:`nabs-ui-slider__header`,children:[(0,t.jsx)(`label`,{className:b,htmlFor:_,children:n}),(0,t.jsx)(`output`,{className:x,htmlFor:_,children:r})]}),(0,t.jsx)(`input`,{ref:h,id:_,className:y,type:`range`,value:r,min:i,max:a,step:o,disabled:s,onChange:p,...m}),(0,t.jsxs)(`div`,{className:`nabs-ui-slider__scale`,"aria-hidden":`true`,children:[(0,t.jsx)(`span`,{children:i}),(0,t.jsx)(`span`,{children:a})]})]})});n.displayName=`Slider`,exports.Slider=n;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime");var n={value:0,min:0,max:100,step:1};function r(e,t){return typeof e==`number`&&Number.isFinite(e)?e:t}function i(e,t){let i=r(e,n.min),a=r(t,n.max);return i<=a?{min:i,max:a}:{min:a,max:i}}function a(e){let t=r(e,n.step);return t>0?t:n.step}function o(e,t,i){let a=r(e,n.value);return a<t?t:a>i?i:a}function s(e,t){return e||`nabs-ui-slider-${t.replace(/:/g,``)}`}function c({disabled:e=!1,className:t}){return[`nabs-ui-slider`,e?`nabs-ui-slider--disabled`:``,t??``].filter(Boolean).join(` `)}function l(e){return[`nabs-ui-slider__input`,e??``].filter(Boolean).join(` `)}function u(e){return[`nabs-ui-slider__label`,e??``].filter(Boolean).join(` `)}function d(e){return[`nabs-ui-slider__value`,e??``].filter(Boolean).join(` `)}function f({value:e,min:t,max:n,step:r}){let s=i(t,n),c=a(r);return{renderedValue:o(e,s.min,s.max),renderedMin:s.min,renderedMax:s.max,renderedStep:c}}var p=(0,e.forwardRef)(({label:n=`Slider`,value:r=0,min:i=0,max:a=100,step:o=1,disabled:p=!1,className:m=``,inputClassName:h=``,labelClassName:g=``,valueClassName:_=``,id:v,onChange:y,...b},x)=>{let S=s(v,(0,e.useId)()),C=c({disabled:p,className:m}),w=l(h),T=u(g),E=d(_),{renderedValue:D,renderedMin:O,renderedMax:k,renderedStep:A}=f({value:r,min:i,max:a,step:o});return(0,t.jsxs)(`div`,{className:C,children:[(0,t.jsxs)(`div`,{className:`nabs-ui-slider__header`,children:[(0,t.jsx)(`label`,{className:T,htmlFor:S,children:n}),(0,t.jsx)(`output`,{className:E,htmlFor:S,children:r})]}),(0,t.jsx)(`input`,{ref:x,id:S,className:w,type:`range`,value:D,min:O,max:k,step:A,disabled:p,onChange:y,...b}),(0,t.jsxs)(`div`,{className:`nabs-ui-slider__scale`,"aria-hidden":`true`,children:[(0,t.jsx)(`span`,{children:O}),(0,t.jsx)(`span`,{children:k})]})]})});p.displayName=`Slider`,exports.Slider=p;

package/dist/nabs-ui-slider.js

@@ -1,48 +1,111 @@
 import { forwardRef as e, useId as t } from "react";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/Slider.tsx
-var i = e(({ label: e = "Slider", value: i = 0, min: a = 0, max: o = 100, step: s = 1, disabled: c = !1, className: l = "", inputClassName: u = "", labelClassName: d = "", valueClassName: f = "", id: p, onChange: m, ...h }, g) => {
-	let _ = t(), v = p ?? `nabs-ui-slider-${_.replace(/:/g, "")}`, y = [
+//#region src/slider.model.ts
+var i = {
+	value: 0,
+	min: 0,
+	max: 100,
+	step: 1
+};
+function a(e, t) {
+	return typeof e == "number" && Number.isFinite(e) ? e : t;
+}
+function o(e, t) {
+	let n = a(e, i.min), r = a(t, i.max);
+	return n <= r ? {
+		min: n,
+		max: r
+	} : {
+		min: r,
+		max: n
+	};
+}
+function s(e) {
+	let t = a(e, i.step);
+	return t > 0 ? t : i.step;
+}
+function c(e, t, n) {
+	let r = a(e, i.value);
+	return r < t ? t : r > n ? n : r;
+}
+//#endregion
+//#region src/slider.view-model.ts
+function l(e, t) {
+	return e || `nabs-ui-slider-${t.replace(/:/g, "")}`;
+}
+function u({ disabled: e = !1, className: t }) {
+	return [
 		"nabs-ui-slider",
-		c ? "nabs-ui-slider--disabled" : "",
-		l
-	].filter(Boolean).join(" "), b = ["nabs-ui-slider__input", u].filter(Boolean).join(" "), x = ["nabs-ui-slider__label", d].filter(Boolean).join(" "), S = ["nabs-ui-slider__value", f].filter(Boolean).join(" ");
+		e ? "nabs-ui-slider--disabled" : "",
+		t ?? ""
+	].filter(Boolean).join(" ");
+}
+function d(e) {
+	return ["nabs-ui-slider__input", e ?? ""].filter(Boolean).join(" ");
+}
+function f(e) {
+	return ["nabs-ui-slider__label", e ?? ""].filter(Boolean).join(" ");
+}
+function p(e) {
+	return ["nabs-ui-slider__value", e ?? ""].filter(Boolean).join(" ");
+}
+function m({ value: e, min: t, max: n, step: r }) {
+	let i = o(t, n), a = s(r);
+	return {
+		renderedValue: c(e, i.min, i.max),
+		renderedMin: i.min,
+		renderedMax: i.max,
+		renderedStep: a
+	};
+}
+//#endregion
+//#region src/Slider.tsx
+var h = e(({ label: e = "Slider", value: i = 0, min: a = 0, max: o = 100, step: s = 1, disabled: c = !1, className: h = "", inputClassName: g = "", labelClassName: _ = "", valueClassName: v = "", id: y, onChange: b, ...x }, S) => {
+	let C = l(y, t()), w = u({
+		disabled: c,
+		className: h
+	}), T = d(g), E = f(_), D = p(v), { renderedValue: O, renderedMin: k, renderedMax: A, renderedStep: j } = m({
+		value: i,
+		min: a,
+		max: o,
+		step: s
+	});
 	return /* @__PURE__ */ r("div", {
-		className: y,
+		className: w,
 		children: [
 			/* @__PURE__ */ r("div", {
 				className: "nabs-ui-slider__header",
 				children: [/* @__PURE__ */ n("label", {
-					className: x,
-					htmlFor: v,
+					className: E,
+					htmlFor: C,
 					children: e
 				}), /* @__PURE__ */ n("output", {
-					className: S,
-					htmlFor: v,
+					className: D,
+					htmlFor: C,
 					children: i
 				})]
 			}),
 			/* @__PURE__ */ n("input", {
-				ref: g,
-				id: v,
-				className: b,
+				ref: S,
+				id: C,
+				className: T,
 				type: "range",
-				value: i,
-				min: a,
-				max: o,
-				step: s,
+				value: O,
+				min: k,
+				max: A,
+				step: j,
 				disabled: c,
-				onChange: m,
-				...h
+				onChange: b,
+				...x
 			}),
 			/* @__PURE__ */ r("div", {
 				className: "nabs-ui-slider__scale",
 				"aria-hidden": "true",
-				children: [/* @__PURE__ */ n("span", { children: a }), /* @__PURE__ */ n("span", { children: o })]
+				children: [/* @__PURE__ */ n("span", { children: k }), /* @__PURE__ */ n("span", { children: A })]
 			})
 		]
 	});
 });
-i.displayName = "Slider";
+h.displayName = "Slider";
 //#endregion
-export { i as Slider };
+export { h as Slider };

package/dist/slider.model.d.ts

@@ -0,0 +1,12 @@
+export declare const sliderDefaults: {
+    readonly value: 0;
+    readonly min: 0;
+    readonly max: 100;
+    readonly step: 1;
+};
+export declare function normalizeSliderBounds(min: unknown, max: unknown): {
+    min: number;
+    max: number;
+};
+export declare function normalizeSliderStep(step: unknown): number;
+export declare function clampSliderValue(value: unknown, min: number, max: number): number;

package/dist/slider.model.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/slider.view-model.d.ts

@@ -0,0 +1,26 @@
+import { SliderProps } from './Slider.types';
+export declare function buildSliderId(id: string | undefined, generatedId: string): string;
+export declare function buildSliderClassName({ disabled, className }: {
+    disabled?: boolean;
+    className?: string | null;
+}): string;
+export declare function buildSliderInputClassName(inputClassName?: string | null): string;
+export declare function buildSliderLabelClassName(labelClassName?: string | null): string;
+export declare function buildSliderValueClassName(valueClassName?: string | null): string;
+export declare function resolveSliderRenderModel({ value, min, max, step, }: {
+    value?: SliderProps["value"];
+    min?: SliderProps["min"];
+    max?: SliderProps["max"];
+    step?: SliderProps["step"];
+}): {
+    renderedValue: number;
+    renderedMin: number;
+    renderedMax: number;
+    renderedStep: number;
+};
+export declare function toSliderStateLabel({ value, min, max, step, }: {
+    value: number;
+    min: number;
+    max: number;
+    step: number;
+}): string;

package/dist/slider.view-model.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@net-advantage/nabs-ui-slider",
-  "version": "0.70.0",
+  "version": "0.72.0",
   "description": "Reusable slider control for the Nabs UI library.",
   "type": "module",
   "main": "./dist/nabs-ui-slider.cjs",
@@ -25,11 +25,16 @@
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@vitejs/plugin-react": "^6.0.1",
+    "@vitest/coverage-v8": "^3.2.4",
     "react-dom": "^19.2.6",
-    "vite": "^8.0.12"
+    "vite": "^8.0.12",
+    "vitest": "^3.2.4"
   },
   "scripts": {
     "build": "vite build",
-    "dev": "vite"
+    "dev": "vite",
+    "test:unit": "vitest run",
+    "test:unit:watch": "vitest",
+    "test:unit:coverage": "vitest run --coverage --coverage.reporter=html --coverage.reporter=json-summary --coverage.reporter=text-summary"
   }
 }