143 lines
4.3 KiB
JavaScript
143 lines
4.3 KiB
JavaScript
'use client'
|
|
"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);
|
|
|
|
// src/slider-utils.ts
|
|
var slider_utils_exports = {};
|
|
__export(slider_utils_exports, {
|
|
getIds: () => getIds,
|
|
getIsReversed: () => getIsReversed,
|
|
getStyles: () => getStyles,
|
|
orient: () => orient
|
|
});
|
|
module.exports = __toCommonJS(slider_utils_exports);
|
|
function getIds(id) {
|
|
return {
|
|
root: `slider-root-${id}`,
|
|
getThumb: (i) => `slider-thumb-${id}-${i}`,
|
|
getInput: (i) => `slider-input-${id}-${i}`,
|
|
track: `slider-track-${id}`,
|
|
innerTrack: `slider-filled-track-${id}`,
|
|
getMarker: (i) => `slider-marker-${id}-${i}`,
|
|
output: `slider-output-${id}`
|
|
};
|
|
}
|
|
function orient(options) {
|
|
const { orientation, vertical, horizontal } = options;
|
|
return orientation === "vertical" ? vertical : horizontal;
|
|
}
|
|
var zeroSize = { width: 0, height: 0 };
|
|
var normalize = (a) => a || zeroSize;
|
|
function getStyles(options) {
|
|
const { orientation, thumbPercents, thumbRects, isReversed } = options;
|
|
const getThumbStyle = (i) => {
|
|
var _a;
|
|
const rect = (_a = thumbRects[i]) != null ? _a : zeroSize;
|
|
return {
|
|
position: "absolute",
|
|
userSelect: "none",
|
|
WebkitUserSelect: "none",
|
|
MozUserSelect: "none",
|
|
msUserSelect: "none",
|
|
touchAction: "none",
|
|
...orient({
|
|
orientation,
|
|
vertical: {
|
|
bottom: `calc(${thumbPercents[i]}% - ${rect.height / 2}px)`
|
|
},
|
|
horizontal: {
|
|
left: `calc(${thumbPercents[i]}% - ${rect.width / 2}px)`
|
|
}
|
|
})
|
|
};
|
|
};
|
|
const size = orientation === "vertical" ? thumbRects.reduce(
|
|
(a, b) => normalize(a).height > normalize(b).height ? a : b,
|
|
zeroSize
|
|
) : thumbRects.reduce(
|
|
(a, b) => normalize(a).width > normalize(b).width ? a : b,
|
|
zeroSize
|
|
);
|
|
const rootStyle = {
|
|
position: "relative",
|
|
touchAction: "none",
|
|
WebkitTapHighlightColor: "rgba(0,0,0,0)",
|
|
userSelect: "none",
|
|
outline: 0,
|
|
...orient({
|
|
orientation,
|
|
vertical: size ? {
|
|
paddingLeft: size.width / 2,
|
|
paddingRight: size.width / 2
|
|
} : {},
|
|
horizontal: size ? {
|
|
paddingTop: size.height / 2,
|
|
paddingBottom: size.height / 2
|
|
} : {}
|
|
})
|
|
};
|
|
const trackStyle = {
|
|
position: "absolute",
|
|
...orient({
|
|
orientation,
|
|
vertical: {
|
|
left: "50%",
|
|
transform: "translateX(-50%)",
|
|
height: "100%"
|
|
},
|
|
horizontal: {
|
|
top: "50%",
|
|
transform: "translateY(-50%)",
|
|
width: "100%"
|
|
}
|
|
})
|
|
};
|
|
const isSingleThumb = thumbPercents.length === 1;
|
|
const fallback = [0, isReversed ? 100 - thumbPercents[0] : thumbPercents[0]];
|
|
const range = isSingleThumb ? fallback : thumbPercents;
|
|
let start = range[0];
|
|
if (!isSingleThumb && isReversed) {
|
|
start = 100 - start;
|
|
}
|
|
const percent = Math.abs(range[range.length - 1] - range[0]);
|
|
const innerTrackStyle = {
|
|
...trackStyle,
|
|
...orient({
|
|
orientation,
|
|
vertical: isReversed ? { height: `${percent}%`, top: `${start}%` } : { height: `${percent}%`, bottom: `${start}%` },
|
|
horizontal: isReversed ? { width: `${percent}%`, right: `${start}%` } : { width: `${percent}%`, left: `${start}%` }
|
|
})
|
|
};
|
|
return { trackStyle, innerTrackStyle, rootStyle, getThumbStyle };
|
|
}
|
|
function getIsReversed(options) {
|
|
const { isReversed, direction, orientation } = options;
|
|
if (direction === "ltr" || orientation === "vertical") {
|
|
return isReversed;
|
|
}
|
|
return !isReversed;
|
|
}
|
|
// Annotate the CommonJS export names for ESM import in node:
|
|
0 && (module.exports = {
|
|
getIds,
|
|
getIsReversed,
|
|
getStyles,
|
|
orient
|
|
});
|
|
//# sourceMappingURL=slider-utils.js.map
|