UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

1 lines 2.1 kB
{"version":3,"file":"Track.cjs","names":["useSliderContext","Box","Marks"],"sources":["../../../../src/components/Slider/Track/Track.tsx"],"sourcesContent":["import { Box } from '../../../core';\nimport { Marks } from '../Marks/Marks';\nimport { useSliderContext } from '../Slider.context';\n\nexport interface TrackProps {\n filled: number;\n offset?: number;\n marksOffset?: number;\n marks: { value: number; label?: React.ReactNode }[] | undefined;\n min: number;\n max: number;\n value: number;\n children: React.ReactNode;\n disabled: boolean | undefined;\n inverted: boolean | undefined;\n containerProps?: React.ComponentProps<'div'>;\n}\n\nexport function Track({\n filled,\n children,\n offset,\n disabled,\n marksOffset,\n inverted,\n containerProps,\n ...others\n}: TrackProps) {\n const { getStyles } = useSliderContext();\n\n return (\n <Box {...getStyles('trackContainer')} mod={{ disabled }} {...containerProps}>\n <Box {...getStyles('track')} mod={{ inverted, disabled }}>\n <Box\n mod={{ inverted, disabled }}\n __vars={{\n '--slider-bar-width': `calc(${filled}% + 2 * var(--slider-size))`,\n '--slider-bar-offset': `calc(${offset}% - var(--slider-size))`,\n }}\n {...getStyles('bar')}\n />\n\n {children}\n\n <Marks {...others} offset={marksOffset} disabled={disabled} inverted={inverted} />\n </Box>\n </Box>\n );\n}\n\nTrack.displayName = '@mantine/core/SliderTrack';\n"],"mappings":";;;;;;;AAkBA,SAAgB,MAAM,EACpB,QACA,UACA,QACA,UACA,aACA,UACA,gBACA,GAAG,UACU;CACb,MAAM,EAAE,cAAcA,uBAAAA,kBAAkB;AAExC,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,iBAAiB;EAAE,KAAK,EAAE,UAAU;EAAE,GAAI;YAC3D,iBAAA,GAAA,kBAAA,MAACA,YAAAA,KAAD;GAAK,GAAI,UAAU,QAAQ;GAAE,KAAK;IAAE;IAAU;IAAU;aAAxD;IACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;KACE,KAAK;MAAE;MAAU;MAAU;KAC3B,QAAQ;MACN,sBAAsB,QAAQ,OAAO;MACrC,uBAAuB,QAAQ,OAAO;MACvC;KACD,GAAI,UAAU,MAAM;KACpB,CAAA;IAED;IAED,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;KAAO,GAAI;KAAQ,QAAQ;KAAuB;KAAoB;KAAY,CAAA;IAC9E;;EACF,CAAA;;AAIV,MAAM,cAAc"}