@ixfx/components 0.5.20 → 0.6.0

package/dist/{slider-input-SW7e2Ac2.js → slider-input-CT4gcF-o.js}

@@ -1,8 +1,8 @@
 import { t as themeFallbacks } from "./fallbacks-DEE1nCTt.js";
-import { n as safeCustomElement, t as __decorate } from "./decorate-DdjvVHS-.js";
+import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
 import { t as prominenceStyles } from "./prominence-DlFShic3.js";
 import { t as resolveAxisStep } from "./keyboard-B5xD7Fz-.js";
-import { t as WheelNudgeMixin } from "./wheel-nudge-Dhzi5nHc.js";
+import { t as WheelNudgeMixin } from "./wheel-nudge-BlSCe_hD.js";
 import { LitElement, css, html, svg } from "lit";
 import { property } from "lit/decorators.js";
 /**
@@ -12,14 +12,14 @@ function getTrackBounds(orientation) {
 	if (orientation === `horizontal`) return {
 		trackStart: 5,
 		trackEnd: 95,
-		centre: 100 / 2,
-		crossCentre: 24 / 2
+		centre: 50,
+		crossCentre: 12
 	};
 	return {
 		trackStart: 5,
 		trackEnd: 95,
-		centre: 100 / 2,
-		crossCentre: 24 / 2
+		centre: 50,
+		crossCentre: 12
 	};
 }
 /**
@@ -39,11 +39,12 @@ function valueToPosition(relativeValue, singleStyle, trackBounds, orientation) {
 	const crossCentre = trackBounds.crossCentre;
 	let pos;
 	if (singleStyle === `range`) pos = trackBounds.trackStart + relativeValue * span;
-	else if (singleStyle === `bipolar`) if (relativeValue <= .5) {
-		const t = relativeValue / .5;
-		pos = trackBounds.trackStart + t * (centre - trackBounds.trackStart);
-	} else pos = centre + (relativeValue - .5) / .5 * (trackBounds.trackEnd - centre);
-	else pos = centre + relativeValue * span / 2;
+	else if (singleStyle === `bipolar`) {
+		if (relativeValue <= .5) {
+			const t = relativeValue / .5;
+			pos = trackBounds.trackStart + t * (centre - trackBounds.trackStart);
+		} else pos = centre + (relativeValue - .5) / .5 * (trackBounds.trackEnd - centre);
+	} else pos = centre + relativeValue * span / 2;
 	if (orientation === `horizontal`) return {
 		x: pos,
 		y: crossCentre
@@ -454,7 +455,6 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 					if (this.valueMode === `single`) this.#setSingleValueFromRelative(1, true);
 					else this.#stepHandleByRelativeDelta(handle, 1);
 					handled = true;
-					break;
 			}
 			if (handled) event.preventDefault();
 		};
@@ -700,9 +700,10 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		const gap = this.#getEffectiveValueMin();
 		const other = handle === `a` ? poleB : poleA;
 		let desired = this.#quantise(clamp(proposed, this.min, this.max));
-		if (this.crossover === `none`) if ((handle === `a` ? poleA : poleB) <= other) desired = Math.min(desired, other - gap);
-		else desired = Math.max(desired, other + gap);
-		else if (desired > other - gap && desired < other + gap) desired = Math.abs(desired - (other - gap)) <= Math.abs(desired - (other + gap)) ? other - gap : other + gap;
+		if (this.crossover === `none`) {
+			if ((handle === `a` ? poleA : poleB) <= other) desired = Math.min(desired, other - gap);
+			else desired = Math.max(desired, other + gap);
+		} else if (desired > other - gap && desired < other + gap) desired = Math.abs(desired - (other - gap)) <= Math.abs(desired - (other + gap)) ? other - gap : other + gap;
 		desired = clamp(desired, this.min, this.max);
 		if (handle === `a`) {
 			if (desired === poleA) return null;
@@ -975,7 +976,7 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		if (isVertical) return svg`
         <rect
           class="track"
-          x="${24 / 2 - strokeWidth / 2}"
+          x="${12 - strokeWidth / 2}"
           y="${5}"
           width="${strokeWidth}"
           height="${90}"
@@ -988,7 +989,7 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
       <rect
         class="track"
         x="${5}"
-        y="${24 / 2 - strokeWidth / 2}"
+        y="${12 - strokeWidth / 2}"
         width="${90}"
         height="${strokeWidth}"
         fill="${fill}"
@@ -1056,9 +1057,9 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		const markerBorderWidth = this.#getCssVar(`--marker-border-width`, 0);
 		const center = isHorizontal ? {
 			x: pos.x,
-			y: bounds.crossCentre + markerOffset * (24 / 2)
+			y: bounds.crossCentre + markerOffset * 12
 		} : {
-			x: bounds.crossCentre + markerOffset * (24 / 2),
+			x: bounds.crossCentre + markerOffset * 12,
 			y: pos.y
 		};
 		const lowCenter = this.valueMode === `single` && this.singleStyle === `unipolar` ? isHorizontal ? {
@@ -1071,7 +1072,7 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		const id = handle ?? `s`;
 		const effectiveMarkerStyle = handle === `c` && this.markerStyleC ? this.markerStyleC : this.markerStyle;
 		if (effectiveMarkerStyle === `dot`) {
-			const r = markerThickness * (24 / 2);
+			const r = markerThickness * 12;
 			const renderDot = (cx, cy, mid) => {
 				if (markerBorderWidth > 0) {
 					defs.push(svg`<circle id="dot-${mid}-path" cx="${cx}" cy="${cy}" r="${r}" />`);
@@ -1126,7 +1127,7 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		}
 		if (effectiveMarkerStyle === `triangle`) {
 			const halfLen = markerLength * 24 / 4;
-			const halfBase = markerThickness * (24 / 2);
+			const halfBase = markerThickness * 12;
 			const renderTriangle = (cx, cy, mid) => {
 				let apex;
 				let base1;
@@ -1191,7 +1192,7 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 			const size = this.#getCssVar(`--midpoint-thickness`, .08);
 			return svg`
         <g class="midpoint-marker" part="midpoint-marker">
-          <circle cx="${center.x}" cy="${center.y}" r="${size * (24 / 2)}" />
+          <circle cx="${center.x}" cy="${center.y}" r="${size * 12}" />
         </g>
       `;
 		}
@@ -1263,10 +1264,12 @@ let SliderInputElement = class SliderInputElement extends WheelNudgeMixin(LitEle
 		} else this.#poleC = void 0;
 		if (changed.has(`valueA`) || changed.has(`valueB`) || changed.has(`valueMode`) || changed.has(`singleStyle`) || !this.hasUpdated) {
 			const valueLane = this.#lanes.get(`value`);
-			if (valueLane && valueLane.type === `value`) if (this.valueMode === `single`) this.#applySingleStyleValueLane(valueLane, this.#getRelativeValueA());
-			else {
-				valueLane.valueMin = valueToRelative(this.#low(), this.min, this.max);
-				valueLane.valueMax = valueToRelative(this.#high(), this.min, this.max);
+			if (valueLane && valueLane.type === `value`) {
+				if (this.valueMode === `single`) this.#applySingleStyleValueLane(valueLane, this.#getRelativeValueA());
+				else {
+					valueLane.valueMin = valueToRelative(this.#low(), this.min, this.max);
+					valueLane.valueMax = valueToRelative(this.#high(), this.min, this.max);
+				}
 			}
 		}
 	}
@@ -1586,4 +1589,4 @@ SliderInputElement = __decorate([safeCustomElement(`ixfx-slider-input`)], Slider
 //#endregion
 export { SliderInputElement as t };
 
-//# sourceMappingURL=slider-input-SW7e2Ac2.js.map
+//# sourceMappingURL=slider-input-CT4gcF-o.js.map