50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T6c6,.cr-slider { display: grid; gap: var(--cr-space-3); color: var(--cr-color-text-default); font-family: var(--cr-font-family-sans); } .cr-slider[data-disabled] { opacity: 0.55; } .cr-slider__head { display: flex; justify-content: space-between; gap: var(--cr-space-3); } .cr-slider__label { font-size: var(--cr-font-size-sm); font-weight: var(--cr-font-weight-semibold); } .cr-slider__value { font-size: var(--cr-font-size-md); font-weight: var(--cr-font-weight-semibold); font-variant-numeric: tabular-nums; } .cr-slider__root { position: relative; display: flex; align-items: center; height: 24px; touch-action: none; user-select: none; } .cr-slider__track { position: relative; flex: 1; height: 6px; overflow: hidden; border-radius: var(--cr-radius-full); background: var(--cr-color-border-default); } .cr-slider__range { position: absolute; height: 100%; border-radius: var(--cr-radius-full); background: var(--cr-color-ink-bg); } .cr-slider__thumb { display: block; width: 24px; height: 24px; border-radius: var(--cr-radius-full); background: var(--cr-color-bg-raised); box-shadow: 0 2px 6px var(--cr-color-border-strong), inset 0 0 0 0.5px var(--cr-color-border-default); cursor: grab; } .cr-slider__thumb:active { cursor: grabbing; } .cr-slider__thumb:focus-visible { outline: var(--cr-focus-width) solid var(--cr-color-focus); outline-offset: var(--cr-focus-offset); } .cr-slider__marks { display: flex; justify-content: space-between; color: var(--cr-color-text-muted); font-size: var(--cr-font-size-xs); } .cr-slider__marks [data-active] { color: var(--cr-color-text-default); font-weight: var(--cr-font-weight-semibold); } 53:Tbd1,'use client'; import * as RadixSlider from '@radix-ui/react-slider'; import { useId, useState, type ReactNode } from 'react'; import { cx } from '@/lib/creance/cx'; import './Slider.css'; export interface SliderProps { label: ReactNode; /** One value, or two for a range. */ value?: number[]; defaultValue?: number[]; onValueChange?: (value: number[]) => void; /** Fires once when the person lets go. */ onValueCommit?: (value: number[]) => void; min?: number; max?: number; step?: number; /** How a value reads, on screen and to screen readers: `(v) => `${v / 1000}K tokens``. */ formatValue?: (value: number) => string; /** Names for the thumbs of a range, such as ['Minimum retry delay', 'Maximum retry delay']. */ thumbLabels?: string[]; /** Labels under the track. Use for stepped sliders; otherwise the ends show min and max. */ marks?: { value: number; label: ReactNode }[]; disabled?: boolean; name?: string; className?: string; } /** Radix Slider with a label and a live value. Arrow keys step; Page Up and Down take bigger steps. */ export function Slider({ label, value, defaultValue, onValueChange, onValueCommit, min = 0, max = 100, step = 1, formatValue = String, thumbLabels, marks, disabled, name, className, }: SliderProps) { const labelId = useId(); const [own, setOwn] = useState(defaultValue ?? [min]); const current = value ?? own; const shown = current.map(formatValue).join(' to '); return (

{label}

{ if (value === undefined) setOwn(v); onValueChange?.(v); }} onValueCommit={onValueCommit} > {current.map((v, i) => ( ))}

); } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@radix-ui/react-slider@^1.5.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40radix-ui%2Freact-slider","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@radix-ui/react-slider@^1.5.0"}]]}]}]]}],["$","$L50",null,{"namespace":"@creance","registryDependencies":["https://creance.pages.dev/r/creance-base.json"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"slider/Slider.css","content":"$52","type":"registry:file","target":"@components/creance/slider/Slider.css"},{"path":"slider/Slider.tsx","content":"$53","type":"registry:ui","target":"@components/creance/slider/Slider.tsx"}],"className":"h-[70svh] min-h-80"}]]}]