@rotki/ui-library 2.26.1 → 3.0.0-beta.1

package/dist/components/forms/slider/RuiSlider.vue_vue_type_script_setup_true_lang.js

@@ -1,19 +1,17 @@
 import { cn } from "../../../utils/tv.js";
 import { useFormTextDetail } from "../../../utils/form-text-detail.js";
 import RuiFormTextDetail_default from "../../helpers/RuiFormTextDetail.js";
+import RuiFieldLabel_default from "../field-label/RuiFieldLabel.js";
 import { getNonRootAttrs, getRootAttrs } from "../../../utils/helpers.js";
 import RuiSliderTicks_default from "./RuiSliderTicks.js";
 import { HIGHLIGHT_COLOR_MAP, HIGHLIGHT_DEFAULT, SliderInteraction, sliderStyles } from "./slider-styles.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeClass, normalizeProps, normalizeStyle, openBlock, ref, toDisplayString, unref, useModel, useTemplateRef, vModelText, withDirectives } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, mergeProps, normalizeClass, normalizeStyle, openBlock, ref, toDisplayString, unref, useAttrs, useId, useModel, useTemplateRef, vModelText, withDirectives } from "vue";
 import { useElementBounding, useEventListener } from "@vueuse/core";
 import { get as get$1, set as set$1 } from "@vueuse/shared";
 //#region src/components/forms/slider/RuiSlider.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["data-error"];
-var _hoisted_2 = {
-	key: 0,
-	class: "text-rui-error"
-};
-var _hoisted_3 = [
+var _hoisted_2 = [
+	"id",
 	"max",
 	"min",
 	"step",
@@ -62,8 +60,6 @@ var RuiSlider_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 			default: false
 		},
 		classNames: {},
-		sliderClass: { default: "" },
-		tickClass: { default: "" },
 		required: {
 			type: Boolean,
 			default: false
@@ -79,7 +75,13 @@ var RuiSlider_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 		const isFocused = ref(false);
 		const isActive = ref(false);
 		const outer = useTemplateRef("outer");
-		const { hasError, validation } = useFormTextDetail(() => __props.errorMessages, () => __props.successMessages);
+		const generatedId = useId();
+		const attrs = useAttrs();
+		const { hasError } = useFormTextDetail(() => __props.errorMessages, () => __props.successMessages);
+		const inputId = computed(() => {
+			const id = attrs.id;
+			return typeof id === "string" && id ? id : generatedId;
+		});
 		const { width, height } = useElementBounding(outer);
 		const bigTick = computed(() => __props.tickSize > BIG_TICK_THRESHOLD);
 		useEventListener(document, "mouseup", () => set$1(isActive, false));
@@ -93,9 +95,9 @@ var RuiSlider_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 		const ui = computed(() => sliderStyles({
 			disabled: __props.disabled,
 			vertical: __props.vertical,
-			validation: get$1(validation),
 			color: __props.color,
-			bigTick: get$1(bigTick)
+			bigTick: get$1(bigTick),
+			hasLabel: !!__props.label
 		}));
 		const trackUi = computed(() => sliderStyles({
 			disabled: __props.disabled,
@@ -118,7 +120,7 @@ var RuiSlider_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 			};
 			if (__props.vertical) {
 				style["transform-origin"] = "0 0";
-				style["--tw-translate-y"] = h;
+				style["--rui-slider-shift"] = h;
 			}
 			return style;
 		});
@@ -138,91 +140,112 @@ var RuiSlider_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 			};
 		});
 		const highlightClass = computed(() => get$1(bigTick) ? HIGHLIGHT_COLOR_MAP[__props.color] : HIGHLIGHT_DEFAULT);
-		const tickClassOverride = computed(() => cn(__props.classNames?.tick) ?? (__props.tickClass || void 0));
+		const tickClassOverride = computed(() => cn(__props.classNames?.tick));
 		function isHighlightedTick(index) {
 			return index <= get$1(currentTick);
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(unref(getRootAttrs)(_ctx.$attrs))), [createElementVNode("label", {
-				class: normalizeClass(unref(ui).wrapper()),
-				"data-error": unref(hasError) ? "" : void 0
-			}, [__props.label ? (openBlock(), createElementBlock("div", {
-				key: 0,
-				class: normalizeClass(unref(ui).label())
-			}, [createTextVNode(toDisplayString(__props.label) + " ", 1), __props.required ? (openBlock(), createElementBlock("span", _hoisted_2, " ﹡ ")) : createCommentVNode("", true)], 2)) : createCommentVNode("", true), createElementVNode("div", {
-				ref_key: "outer",
-				ref: outer,
-				class: normalizeClass(unref(ui).outer())
-			}, [createElementVNode("div", {
-				class: normalizeClass(unref(ui).inner()),
-				style: normalizeStyle(unref(innerStyle))
-			}, [withDirectives(createElementVNode("input", mergeProps({
-				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-				class: unref(ui).input(),
-				type: "range",
-				max: __props.max,
-				min: __props.min,
-				step: __props.step,
-				disabled: __props.disabled,
-				"aria-invalid": unref(hasError),
-				"aria-label": __props.label || void 0,
-				"aria-valuetext": String(modelValue.value)
-			}, unref(getNonRootAttrs)(_ctx.$attrs), {
-				onMouseenter: _cache[1] || (_cache[1] = ($event) => isHovered.value = true),
-				onMouseleave: _cache[2] || (_cache[2] = ($event) => isHovered.value = false),
-				onFocus: _cache[3] || (_cache[3] = ($event) => isFocused.value = true),
-				onBlur: _cache[4] || (_cache[4] = ($event) => isFocused.value = false),
-				onMousedown: _cache[5] || (_cache[5] = ($event) => isActive.value = true),
-				onMouseup: _cache[6] || (_cache[6] = ($event) => isActive.value = false)
-			}), null, 16, _hoisted_3), [[vModelText, modelValue.value]]), createElementVNode("div", { class: normalizeClass(unref(trackUi).slider()) }, [createElementVNode("div", { class: normalizeClass(unref(trackUi).sliderInner()) }, [
-				createElementVNode("div", { class: normalizeClass(unref(trackUi).container({ class: unref(cn)(__props.classNames?.slider) ?? __props.sliderClass })) }, [!__props.hideTrack ? (openBlock(), createElementBlock("div", {
+			return openBlock(), createElementBlock("div", mergeProps(unref(getRootAttrs)(_ctx.$attrs), { class: unref(ui).root() }), [
+				__props.label ? (openBlock(), createBlock(RuiFieldLabel_default, {
 					key: 0,
-					class: normalizeClass(unref(trackUi).track()),
-					style: normalizeStyle({ width: unref(trackWidth) }),
-					"data-id": "slider-track"
-				}, null, 6)) : createCommentVNode("", true), __props.showTicks && !__props.disabled ? (openBlock(), createBlock(RuiSliderTicks_default, {
-					key: 1,
-					count: unref(totalTicks),
-					"container-class": unref(trackUi).ticks(),
-					"container-style": unref(ticksStyle),
-					"tick-class": unref(trackUi).tick(),
-					"tick-style": unref(tickStyle),
-					"hide-track": __props.hideTrack,
-					"highlight-class": unref(highlightClass),
-					"tick-class-override": unref(tickClassOverride),
-					"is-highlighted": isHighlightedTick
+					text: __props.label,
+					for: unref(inputId),
+					required: __props.required,
+					disabled: __props.disabled,
+					class: normalizeClass(unref(ui).label())
 				}, null, 8, [
-					"count",
-					"container-class",
-					"container-style",
-					"tick-class",
-					"tick-style",
-					"hide-track",
-					"highlight-class",
-					"tick-class-override"
-				])) : createCommentVNode("", true)], 2),
+					"text",
+					"for",
+					"required",
+					"disabled",
+					"class"
+				])) : createCommentVNode("", true),
 				createElementVNode("div", {
-					class: normalizeClass([unref(trackUi).thumb(), unref(trackUi).thumbRipple()]),
-					style: normalizeStyle({ left: unref(trackWidth) }),
-					"data-id": "slider-thumb"
-				}, null, 6),
-				__props.showThumbLabel && !__props.disabled ? (openBlock(), createElementBlock("div", {
-					key: 0,
-					class: normalizeClass(unref(trackUi).thumbLabel()),
-					style: normalizeStyle({ left: unref(trackWidth) }),
-					"data-id": "slider-thumb-label"
-				}, toDisplayString(modelValue.value), 7)) : createCommentVNode("", true)
-			], 2)], 2)], 6)], 2)], 10, _hoisted_1), !__props.hideDetails ? (openBlock(), createBlock(RuiFormTextDetail_default, {
-				key: 0,
-				class: "pt-1",
-				"error-messages": __props.errorMessages,
-				"success-messages": __props.successMessages,
-				hint: __props.hint
-			}, null, 8, [
-				"error-messages",
-				"success-messages",
-				"hint"
-			])) : createCommentVNode("", true)], 16);
+					class: normalizeClass(unref(ui).wrapper()),
+					"data-error": unref(hasError) ? "" : void 0,
+					"data-id": "slider-wrapper"
+				}, [createElementVNode("div", {
+					ref_key: "outer",
+					ref: outer,
+					class: normalizeClass(unref(ui).outer())
+				}, [createElementVNode("div", {
+					class: normalizeClass(unref(ui).inner()),
+					style: normalizeStyle(unref(innerStyle))
+				}, [withDirectives(createElementVNode("input", mergeProps({
+					id: unref(inputId),
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
+					class: unref(ui).input(),
+					type: "range",
+					max: __props.max,
+					min: __props.min,
+					step: __props.step,
+					disabled: __props.disabled,
+					"aria-invalid": unref(hasError),
+					"aria-label": __props.label || void 0,
+					"aria-valuetext": String(modelValue.value)
+				}, unref(getNonRootAttrs)(_ctx.$attrs, ["class", "id"]), {
+					onMouseenter: _cache[1] || (_cache[1] = ($event) => isHovered.value = true),
+					onMouseleave: _cache[2] || (_cache[2] = ($event) => isHovered.value = false),
+					onFocus: _cache[3] || (_cache[3] = ($event) => isFocused.value = true),
+					onBlur: _cache[4] || (_cache[4] = ($event) => isFocused.value = false),
+					onMousedown: _cache[5] || (_cache[5] = ($event) => isActive.value = true),
+					onMouseup: _cache[6] || (_cache[6] = ($event) => isActive.value = false)
+				}), null, 16, _hoisted_2), [[
+					vModelText,
+					modelValue.value,
+					void 0,
+					{ number: true }
+				]]), createElementVNode("div", { class: normalizeClass(unref(trackUi).slider()) }, [createElementVNode("div", { class: normalizeClass(unref(trackUi).sliderInner()) }, [
+					createElementVNode("div", { class: normalizeClass(unref(trackUi).container({ class: unref(cn)(__props.classNames?.slider) })) }, [!__props.hideTrack ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: normalizeClass(unref(trackUi).track()),
+						style: normalizeStyle({ width: unref(trackWidth) }),
+						"data-id": "slider-track"
+					}, null, 6)) : createCommentVNode("", true), __props.showTicks && !__props.disabled ? (openBlock(), createBlock(RuiSliderTicks_default, {
+						key: 1,
+						count: unref(totalTicks),
+						"container-class": unref(trackUi).ticks(),
+						"container-style": unref(ticksStyle),
+						"tick-class": unref(trackUi).tick(),
+						"tick-style": unref(tickStyle),
+						"hide-track": __props.hideTrack,
+						"highlight-class": unref(highlightClass),
+						"tick-class-override": unref(tickClassOverride),
+						"is-highlighted": isHighlightedTick
+					}, null, 8, [
+						"count",
+						"container-class",
+						"container-style",
+						"tick-class",
+						"tick-style",
+						"hide-track",
+						"highlight-class",
+						"tick-class-override"
+					])) : createCommentVNode("", true)], 2),
+					createElementVNode("div", {
+						class: normalizeClass(unref(trackUi).thumb()),
+						style: normalizeStyle({ left: unref(trackWidth) }),
+						"data-id": "slider-thumb"
+					}, null, 6),
+					__props.showThumbLabel && !__props.disabled ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: normalizeClass(unref(trackUi).thumbLabel()),
+						style: normalizeStyle({ left: unref(trackWidth) }),
+						"data-id": "slider-thumb-label"
+					}, toDisplayString(modelValue.value), 7)) : createCommentVNode("", true)
+				], 2)], 2)], 6)], 2)], 10, _hoisted_1),
+				!__props.hideDetails ? (openBlock(), createBlock(RuiFormTextDetail_default, {
+					key: 1,
+					class: "pt-1",
+					"error-messages": __props.errorMessages,
+					"success-messages": __props.successMessages,
+					hint: __props.hint
+				}, null, 8, [
+					"error-messages",
+					"success-messages",
+					"hint"
+				])) : createCommentVNode("", true)
+			], 16);
 		};
 	}
 });

package/dist/components/forms/slider/RuiSlider.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiSlider.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/slider/RuiSlider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiSliderTicks from '@/components/forms/slider/RuiSliderTicks.vue';\nimport { HIGHLIGHT_COLOR_MAP, HIGHLIGHT_DEFAULT, SliderInteraction, sliderStyles } from '@/components/forms/slider/slider-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiSliderClassNames {\n  root?: VueClassValue;\n  slider?: VueClassValue;\n  tick?: VueClassValue;\n}\n\nexport interface Props {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  showThumbLabel?: boolean;\n  showTicks?: boolean;\n  hideTrack?: boolean;\n  tickSize?: number;\n  vertical?: boolean;\n  color?: ContextColorsType;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  classNames?: RuiSliderClassNames;\n  /** @deprecated Use `classNames.slider` instead */\n  sliderClass?: string;\n  /** @deprecated Use `classNames.tick` instead */\n  tickClass?: string;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiSlider',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<number>({ default: 0 });\n\nconst {\n  min = 0,\n  max = 100,\n  step = 1,\n  disabled = false,\n  showThumbLabel = false,\n  showTicks = false,\n  hideTrack = false,\n  vertical = false,\n  tickSize = 2,\n  color = 'primary',\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  classNames,\n  sliderClass = '',\n  tickClass = '',\n  required = false,\n} = defineProps<Props>();\n\nconst BIG_TICK_THRESHOLD = 4;\n\nconst isHovered = ref<boolean>(false);\nconst isFocused = ref<boolean>(false);\nconst isActive = ref<boolean>(false);\n\nconst outer = useTemplateRef<HTMLDivElement>('outer');\n\nconst { hasError, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst { width, height } = useElementBounding(outer);\n\nconst bigTick = computed<boolean>(() => tickSize > BIG_TICK_THRESHOLD);\n\nuseEventListener(document, 'mouseup', () => set(isActive, false));\n\nconst interaction = computed<SliderInteraction>(() => {\n  if (disabled)\n    return SliderInteraction.idle;\n  if (get(isActive))\n    return SliderInteraction.active;\n  if (get(isFocused))\n    return SliderInteraction.focus;\n  if (get(isHovered))\n    return SliderInteraction.hover;\n  return SliderInteraction.idle;\n});\n\n// Layout ui: stable props only (not interaction), used for wrapper/label/outer/inner/input\nconst ui = computed<ReturnType<typeof sliderStyles>>(() => sliderStyles({\n  disabled,\n  vertical,\n  validation: get(validation),\n  color,\n  bigTick: get(bigTick),\n}));\n\n// Track ui: includes interaction state, used for slider/thumb/ticks (changes on hover/focus/active)\nconst trackUi = computed<ReturnType<typeof sliderStyles>>(() => sliderStyles({\n  disabled,\n  vertical,\n  interaction: get(interaction),\n  color,\n  bigTick: get(bigTick),\n}));\n\nconst totalTicks = computed<number>(() => (max - min) / step);\n\nconst currentTick = computed<number>(() => Math.round((get(modelValue) - min) / step));\n\nconst trackWidth = computed<string>(() => {\n  const percentage = Math.min(100, Math.max(0, Math.round((get(currentTick) / get(totalTicks)) * 100)));\n  return `${percentage}%`;\n});\n\nconst innerStyle = computed<Record<string, string>>(() => {\n  const w = `${get(width)}px`;\n  const h = `${get(height)}px`;\n  const style: Record<string, string> = { width: vertical ? h : w, height: vertical ? w : h };\n  if (vertical) {\n    style['transform-origin'] = '0 0';\n    style['--tw-translate-y'] = h;\n  }\n  return style;\n});\n\nconst tickSizePx = computed<string>(() => `${tickSize}px`);\n\nconst ticksStyle = computed<Record<string, string>>(() => {\n  const size = get(tickSizePx);\n  return { margin: `0 calc(${size} / -2)`, width: `calc(100% + ${size})` };\n});\n\nconst tickStyle = computed<Record<string, string>>(() => {\n  const size = get(tickSizePx);\n  return { width: size, height: size };\n});\n\nconst highlightClass = computed<string>(() => get(bigTick) ? HIGHLIGHT_COLOR_MAP[color] : HIGHLIGHT_DEFAULT);\n\nconst tickClassOverride = computed<string | undefined>(() => cn(classNames?.tick) ?? (tickClass || undefined));\n\nfunction isHighlightedTick(index: number): boolean {\n  return index <= get(currentTick);\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <label\n      :class=\"ui.wrapper()\"\n      :data-error=\"hasError ? '' : undefined\"\n    >\n      <div\n        v-if=\"label\"\n        :class=\"ui.label()\"\n      >\n        {{ label }}\n        <span\n          v-if=\"required\"\n          class=\"text-rui-error\"\n        >\n          ﹡\n        </span>\n      </div>\n      <div\n        ref=\"outer\"\n        :class=\"ui.outer()\"\n      >\n        <div\n          :class=\"ui.inner()\"\n          :style=\"innerStyle\"\n        >\n          <input\n            v-model=\"modelValue\"\n            :class=\"ui.input()\"\n            type=\"range\"\n            :max=\"max\"\n            :min=\"min\"\n            :step=\"step\"\n            :disabled=\"disabled\"\n            :aria-invalid=\"hasError\"\n            :aria-label=\"label || undefined\"\n            :aria-valuetext=\"String(modelValue)\"\n            v-bind=\"getNonRootAttrs($attrs)\"\n            @mouseenter=\"isHovered = true\"\n            @mouseleave=\"isHovered = false\"\n            @focus=\"isFocused = true\"\n            @blur=\"isFocused = false\"\n            @mousedown=\"isActive = true\"\n            @mouseup=\"isActive = false\"\n          />\n          <div :class=\"trackUi.slider()\">\n            <div :class=\"trackUi.sliderInner()\">\n              <div :class=\"trackUi.container({ class: cn(classNames?.slider) ?? sliderClass })\">\n                <div\n                  v-if=\"!hideTrack\"\n                  :class=\"trackUi.track()\"\n                  :style=\"{ width: trackWidth }\"\n                  data-id=\"slider-track\"\n                />\n                <RuiSliderTicks\n                  v-if=\"showTicks && !disabled\"\n                  :count=\"totalTicks\"\n                  :container-class=\"trackUi.ticks()\"\n                  :container-style=\"ticksStyle\"\n                  :tick-class=\"trackUi.tick()\"\n                  :tick-style=\"tickStyle\"\n                  :hide-track=\"hideTrack\"\n                  :highlight-class=\"highlightClass\"\n                  :tick-class-override=\"tickClassOverride\"\n                  :is-highlighted=\"isHighlightedTick\"\n                />\n              </div>\n              <div\n                :class=\"[trackUi.thumb(), trackUi.thumbRipple()]\"\n                :style=\"{ left: trackWidth }\"\n                data-id=\"slider-thumb\"\n              />\n              <div\n                v-if=\"showThumbLabel && !disabled\"\n                :class=\"trackUi.thumbLabel()\"\n                :style=\"{ left: trackWidth }\"\n                data-id=\"slider-thumb-label\"\n              >\n                {{ modelValue }}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </label>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      class=\"pt-1\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiSlider.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/slider/RuiSlider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport RuiSliderTicks from '@/components/forms/slider/RuiSliderTicks.vue';\nimport { HIGHLIGHT_COLOR_MAP, HIGHLIGHT_DEFAULT, SliderInteraction, sliderStyles } from '@/components/forms/slider/slider-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiSliderClassNames {\n  root?: VueClassValue;\n  slider?: VueClassValue;\n  tick?: VueClassValue;\n}\n\nexport interface Props {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  showThumbLabel?: boolean;\n  showTicks?: boolean;\n  hideTrack?: boolean;\n  tickSize?: number;\n  vertical?: boolean;\n  color?: ContextColorsType;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  classNames?: RuiSliderClassNames;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiSlider',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<number>({ default: 0 });\n\nconst {\n  min = 0,\n  max = 100,\n  step = 1,\n  disabled = false,\n  showThumbLabel = false,\n  showTicks = false,\n  hideTrack = false,\n  vertical = false,\n  tickSize = 2,\n  color = 'primary',\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  classNames,\n  required = false,\n} = defineProps<Props>();\n\nconst BIG_TICK_THRESHOLD = 4;\n\nconst isHovered = ref<boolean>(false);\nconst isFocused = ref<boolean>(false);\nconst isActive = ref<boolean>(false);\n\nconst outer = useTemplateRef<HTMLDivElement>('outer');\n\nconst generatedId = useId();\nconst attrs = useAttrs();\n\nconst { hasError } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\n// the label above points at the range input, keeping a consumer's own id\nconst inputId = computed<string>(() => {\n  const id = attrs.id;\n  return typeof id === 'string' && id ? id : generatedId;\n});\n\nconst { width, height } = useElementBounding(outer);\n\nconst bigTick = computed<boolean>(() => tickSize > BIG_TICK_THRESHOLD);\n\nuseEventListener(document, 'mouseup', () => set(isActive, false));\n\nconst interaction = computed<SliderInteraction>(() => {\n  if (disabled)\n    return SliderInteraction.idle;\n  if (get(isActive))\n    return SliderInteraction.active;\n  if (get(isFocused))\n    return SliderInteraction.focus;\n  if (get(isHovered))\n    return SliderInteraction.hover;\n  return SliderInteraction.idle;\n});\n\n// Layout ui: stable props only (not interaction), used for wrapper/label/outer/inner/input\nconst ui = computed<ReturnType<typeof sliderStyles>>(() => sliderStyles({\n  disabled,\n  vertical,\n  color,\n  bigTick: get(bigTick),\n  hasLabel: !!label,\n}));\n\n// Track ui: includes interaction state, used for slider/thumb/ticks (changes on hover/focus/active)\nconst trackUi = computed<ReturnType<typeof sliderStyles>>(() => sliderStyles({\n  disabled,\n  vertical,\n  interaction: get(interaction),\n  color,\n  bigTick: get(bigTick),\n}));\n\nconst totalTicks = computed<number>(() => (max - min) / step);\n\nconst currentTick = computed<number>(() => Math.round((get(modelValue) - min) / step));\n\nconst trackWidth = computed<string>(() => {\n  const percentage = Math.min(100, Math.max(0, Math.round((get(currentTick) / get(totalTicks)) * 100)));\n  return `${percentage}%`;\n});\n\nconst innerStyle = computed<Record<string, string>>(() => {\n  const w = `${get(width)}px`;\n  const h = `${get(height)}px`;\n  const style: Record<string, string> = { width: vertical ? h : w, height: vertical ? w : h };\n  if (vertical) {\n    style['transform-origin'] = '0 0';\n    style['--rui-slider-shift'] = h;\n  }\n  return style;\n});\n\nconst tickSizePx = computed<string>(() => `${tickSize}px`);\n\nconst ticksStyle = computed<Record<string, string>>(() => {\n  const size = get(tickSizePx);\n  return { margin: `0 calc(${size} / -2)`, width: `calc(100% + ${size})` };\n});\n\nconst tickStyle = computed<Record<string, string>>(() => {\n  const size = get(tickSizePx);\n  return { width: size, height: size };\n});\n\nconst highlightClass = computed<string>(() => get(bigTick) ? HIGHLIGHT_COLOR_MAP[color] : HIGHLIGHT_DEFAULT);\n\nconst tickClassOverride = computed<string | undefined>(() => cn(classNames?.tick));\n\nfunction isHighlightedTick(index: number): boolean {\n  return index <= get(currentTick);\n}\n</script>\n\n<template>\n  <div\n    v-bind=\"getRootAttrs($attrs)\"\n    :class=\"ui.root()\"\n  >\n    <!-- above the rail like any field's label, neutral in every state; the messages below carry the validation -->\n    <RuiFieldLabel\n      v-if=\"label\"\n      :text=\"label\"\n      :for=\"inputId\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n      :class=\"ui.label()\"\n    />\n    <div\n      :class=\"ui.wrapper()\"\n      :data-error=\"hasError ? '' : undefined\"\n      data-id=\"slider-wrapper\"\n    >\n      <div\n        ref=\"outer\"\n        :class=\"ui.outer()\"\n      >\n        <div\n          :class=\"ui.inner()\"\n          :style=\"innerStyle\"\n        >\n          <input\n            :id=\"inputId\"\n            v-model.number=\"modelValue\"\n            :class=\"ui.input()\"\n            type=\"range\"\n            :max=\"max\"\n            :min=\"min\"\n            :step=\"step\"\n            :disabled=\"disabled\"\n            :aria-invalid=\"hasError\"\n            :aria-label=\"label || undefined\"\n            :aria-valuetext=\"String(modelValue)\"\n            v-bind=\"getNonRootAttrs($attrs, ['class', 'id'])\"\n            @mouseenter=\"isHovered = true\"\n            @mouseleave=\"isHovered = false\"\n            @focus=\"isFocused = true\"\n            @blur=\"isFocused = false\"\n            @mousedown=\"isActive = true\"\n            @mouseup=\"isActive = false\"\n          />\n          <div :class=\"trackUi.slider()\">\n            <div :class=\"trackUi.sliderInner()\">\n              <div :class=\"trackUi.container({ class: cn(classNames?.slider) })\">\n                <div\n                  v-if=\"!hideTrack\"\n                  :class=\"trackUi.track()\"\n                  :style=\"{ width: trackWidth }\"\n                  data-id=\"slider-track\"\n                />\n                <RuiSliderTicks\n                  v-if=\"showTicks && !disabled\"\n                  :count=\"totalTicks\"\n                  :container-class=\"trackUi.ticks()\"\n                  :container-style=\"ticksStyle\"\n                  :tick-class=\"trackUi.tick()\"\n                  :tick-style=\"tickStyle\"\n                  :hide-track=\"hideTrack\"\n                  :highlight-class=\"highlightClass\"\n                  :tick-class-override=\"tickClassOverride\"\n                  :is-highlighted=\"isHighlightedTick\"\n                />\n              </div>\n              <div\n                :class=\"trackUi.thumb()\"\n                :style=\"{ left: trackWidth }\"\n                data-id=\"slider-thumb\"\n              />\n              <div\n                v-if=\"showThumbLabel && !disabled\"\n                :class=\"trackUi.thumbLabel()\"\n                :style=\"{ left: trackWidth }\"\n                data-id=\"slider-thumb-label\"\n              >\n                {{ modelValue }}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      class=\"pt-1\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/forms/slider/slider-styles.d.ts

@@ -9,11 +9,10 @@ export type SliderInteraction = (typeof SliderInteraction)[keyof typeof SliderIn
 /** Static class map for highlighted big-tick colors (avoids dynamic class construction) */
 export declare const HIGHLIGHT_COLOR_MAP: Record<ContextColorsType, string>;
 /** Default highlighted tick color (non-big-tick) */
-export declare const HIGHLIGHT_DEFAULT = "bg-rui-grey-100 dark:bg-[#121212]";
+export declare const HIGHLIGHT_DEFAULT = "bg-rui-neutral-100 dark:bg-rui-neutral-950";
 export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     disabled: {
         true: {
-            label: string;
             container: string;
             track: string;
             thumb: string;
@@ -21,6 +20,7 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     };
     vertical: {
         true: {
+            root: string;
             wrapper: string;
             label: string;
             outer: string;
@@ -31,24 +31,16 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     interaction: {
         idle: {};
         hover: {
-            thumbRipple: string;
+            thumb: string;
         };
         focus: {
-            thumbRipple: string;
+            thumbLabel: string;
         };
         active: {
-            thumbRipple: string;
+            thumb: string;
             thumbLabel: string;
         };
     };
-    validation: {
-        error: {
-            label: string;
-        };
-        success: {
-            label: string;
-        };
-    };
     color: {
         primary: {};
         secondary: {};
@@ -58,9 +50,18 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
         success: {};
     };
     bigTick: {
+        false: {
+            ticks: string;
+            tick: string;
+        };
+        true: {};
+    };
+    hasLabel: {
         true: {};
+        false: {};
     };
 }, {
+    root: string;
     wrapper: string;
     label: string;
     outer: string;
@@ -73,12 +74,10 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     ticks: string;
     tick: string;
     thumb: string;
-    thumbRipple: string;
     thumbLabel: string;
 }, undefined, {
     disabled: {
         true: {
-            label: string;
             container: string;
             track: string;
             thumb: string;
@@ -86,6 +85,7 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     };
     vertical: {
         true: {
+            root: string;
             wrapper: string;
             label: string;
             outer: string;
@@ -96,24 +96,16 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     interaction: {
         idle: {};
         hover: {
-            thumbRipple: string;
+            thumb: string;
         };
         focus: {
-            thumbRipple: string;
+            thumbLabel: string;
         };
         active: {
-            thumbRipple: string;
+            thumb: string;
             thumbLabel: string;
         };
     };
-    validation: {
-        error: {
-            label: string;
-        };
-        success: {
-            label: string;
-        };
-    };
     color: {
         primary: {};
         secondary: {};
@@ -123,9 +115,18 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
         success: {};
     };
     bigTick: {
+        false: {
+            ticks: string;
+            tick: string;
+        };
         true: {};
     };
+    hasLabel: {
+        true: {};
+        false: {};
+    };
 }, {
+    root: string;
     wrapper: string;
     label: string;
     outer: string;
@@ -138,12 +139,10 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     ticks: string;
     tick: string;
     thumb: string;
-    thumbRipple: string;
     thumbLabel: string;
 }, import("tailwind-variants").TVReturnTypeLike<{
     disabled: {
         true: {
-            label: string;
             container: string;
             track: string;
             thumb: string;
@@ -151,6 +150,7 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     };
     vertical: {
         true: {
+            root: string;
             wrapper: string;
             label: string;
             outer: string;
@@ -161,24 +161,16 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     interaction: {
         idle: {};
         hover: {
-            thumbRipple: string;
+            thumb: string;
         };
         focus: {
-            thumbRipple: string;
+            thumbLabel: string;
         };
         active: {
-            thumbRipple: string;
+            thumb: string;
             thumbLabel: string;
         };
     };
-    validation: {
-        error: {
-            label: string;
-        };
-        success: {
-            label: string;
-        };
-    };
     color: {
         primary: {};
         secondary: {};
@@ -188,9 +180,18 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
         success: {};
     };
     bigTick: {
+        false: {
+            ticks: string;
+            tick: string;
+        };
+        true: {};
+    };
+    hasLabel: {
         true: {};
+        false: {};
     };
 }, {
+    root: string;
     wrapper: string;
     label: string;
     outer: string;
@@ -203,6 +204,5 @@ export declare const sliderStyles: import("tailwind-variants").TVReturnType<{
     ticks: string;
     tick: string;
     thumb: string;
-    thumbRipple: string;
     thumbLabel: string;
 }>>;