@mirohq/design-system-slider 0.2.3 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.js +9 -1
- package/dist/main.js.map +1 -1
- package/dist/module.js +9 -1
- package/dist/module.js.map +1 -1
- package/package.json +3 -3
package/dist/main.js
CHANGED
|
@@ -343,7 +343,15 @@ const Slider = React__default["default"].forwardRef(
|
|
|
343
343
|
disabled,
|
|
344
344
|
ariaDisabled: designSystemUtils.booleanify(ariaDisabled),
|
|
345
345
|
name,
|
|
346
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
346
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
347
|
+
StyledSlider,
|
|
348
|
+
{
|
|
349
|
+
...restProps,
|
|
350
|
+
"aria-disabled": ariaDisabled,
|
|
351
|
+
ref: forwardRef,
|
|
352
|
+
children
|
|
353
|
+
}
|
|
354
|
+
)
|
|
347
355
|
}
|
|
348
356
|
)
|
|
349
357
|
);
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../src/partials/range.styled.tsx","../src/use-slider-context.tsx","../src/partials/range.tsx","../src/partials/thumb.styled.tsx","../src/partials/thumb.tsx","../src/slider.styled.tsx","../src/partials/value.styled.tsx","../src/partials/value.tsx","../src/partials/input.styled.tsx","../src/partials/input.tsx","../src/partials/track.styled.tsx","../src/partials/track.tsx","../src/slider.tsx"],"sourcesContent":["import { Range as RadixRange } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledRange = styled(RadixRange, {\n position: 'absolute',\n backgroundColor: '$background-primary-prominent',\n borderRadius: '$round',\n height: '100%',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\nexport type StyledRangeProps = StrictComponentProps<typeof StyledRange>\n","import React, { createContext, useCallback, useContext, useState } from 'react'\n\ninterface SharedProps {\n name?: string\n disabled: boolean\n ariaDisabled: boolean\n min: number\n max: number\n step?: number\n onValueCommit?: (value: number) => void\n}\n\ninterface SliderContextProps extends SharedProps {\n value: number\n onValueChange: (value: number) => void\n}\n\nexport interface SliderProviderProps extends SharedProps {\n value?: number\n onValueChange?: (value: number) => void\n}\n\nconst SliderContext = createContext<SliderContextProps>({} as any)\n\nexport const SliderProvider = ({\n children,\n min,\n value: valueProp,\n onValueChange: onValueChangeProp,\n ...restProps\n}: React.PropsWithChildren<SliderProviderProps>): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n const onValueChange = useCallback(\n (value: number): void => {\n setSliderValue(value)\n if (onValueChangeProp != null) {\n onValueChangeProp(value)\n }\n },\n [onValueChangeProp]\n )\n\n return (\n <SliderContext.Provider\n value={{\n ...restProps,\n min,\n value,\n onValueChange,\n }}\n >\n {children}\n </SliderContext.Provider>\n )\n}\n\nexport const useSliderContext = (): SliderContextProps =>\n useContext(SliderContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledRangeProps } from './range.styled'\nimport { StyledRange } from './range.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface RangeProps extends StyledRangeProps {}\n\nexport const Range = React.forwardRef<\n ElementRef<typeof StyledRange>,\n RangeProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n return (\n <StyledRange\n {...props}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n />\n )\n})\n","import { Thumb as RadixThumb } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { focus } from '@mirohq/design-system-styles'\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n width: '20px',\n height: '20px',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1px solid $border-neutrals-controls',\n cursor: 'pointer',\n outline: 'none',\n\n _hover: {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-active',\n },\n\n ...focus.css({\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-selected',\n }),\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n\n _hover: {\n boxShadow: 'none',\n border: 'none',\n },\n\n '&:active': {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n },\n },\n },\n})\nexport type StyledThumbProps = StrictComponentProps<typeof StyledThumb>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport type { StyledThumbProps } from './thumb.styled'\nimport { StyledThumb } from './thumb.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface ThumbProps extends StyledThumbProps {}\n\nexport const Thumb = React.forwardRef<\n ElementRef<typeof StyledThumb>,\n ThumbProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n })\n\n return <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef} />\n})\n","import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledSlider = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'row',\n gap: '$100',\n alignItems: 'center',\n})\n\nexport type StyledSliderProps = StrictComponentProps<typeof StyledSlider>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { ComponentPropsWithRef } from 'react'\n\nexport const StyledValue = styled('span', {})\nexport type StyledValueProps = ComponentPropsWithRef<typeof StyledValue>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledValueProps } from './value.styled'\nimport { StyledValue } from './value.styled'\n\nexport interface ValueProps extends StyledValueProps {}\n\nexport const Value = React.forwardRef<\n ElementRef<typeof StyledValue>,\n ValueProps\n>((props, forwardRef) => {\n const { value } = useSliderContext()\n\n return (\n <StyledValue {...props} ref={forwardRef}>\n {value}\n </StyledValue>\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport { textFieldStyles } from '@mirohq/design-system-base-text-field'\nimport { focus } from '@mirohq/design-system-styles'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst disabledAndReadonlySelectors =\n ':read-only, :disabled, [aria-disabled=\"true\"]'\n\nexport const StyledInput = styled('input', {\n all: 'unset',\n display: 'block',\n maxWidth: '$11',\n height: '$8',\n padding: '0 $50',\n textAlign: 'center',\n\n ...textFieldStyles.variants.idle,\n ...textFieldStyles.v1.idle,\n\n '&:read-only': textFieldStyles.v1.readOnly,\n\n '&:disabled, &[aria-disabled=\"true\"]': {\n ...textFieldStyles.variants.disabled,\n ...textFieldStyles.base.disabled,\n },\n\n [`&:not(${disabledAndReadonlySelectors})`]: {\n _hover: textFieldStyles.variants.hovered,\n },\n\n [`&:not(${disabledAndReadonlySelectors})::placeholder`]:\n textFieldStyles.base.placeholder.v1,\n\n ...focus.css({\n ...textFieldStyles.v1.focused,\n }),\n\n '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0,\n },\n '&[type=number]': {\n '-moz-appearance': 'textfield',\n },\n})\nexport type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>\n","import React, { useEffect, useState } from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledInputProps } from './input.styled'\nimport { StyledInput } from './input.styled'\n\nexport interface ValueProps extends StyledInputProps {}\n\nexport const Input = React.forwardRef<\n ElementRef<typeof StyledInput>,\n ValueProps\n>((props, forwardRef) => {\n const {\n value,\n onValueChange,\n onValueCommit,\n min,\n max,\n step,\n disabled,\n ariaDisabled,\n } = useSliderContext()\n const [inputValue, setInputValue] = useState(value.toString())\n\n useEffect(() => {\n setInputValue(value.toString())\n }, [value])\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n onKeyUp: e => {\n if (e.key === 'Enter') {\n let valueToSet = Number(inputValue)\n if (max !== undefined && valueToSet > max) {\n valueToSet = max\n } else if (min !== undefined && valueToSet < min) {\n valueToSet = min\n } else if (step !== undefined && valueToSet % step !== 0) {\n valueToSet = Math.round(valueToSet / step) * step\n }\n\n setInputValue(valueToSet.toString())\n onValueChange(valueToSet)\n onValueCommit?.(valueToSet)\n }\n },\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => {\n setInputValue(e.target.value)\n },\n })\n\n return (\n <StyledInput\n {...elementProps}\n type='number'\n ref={forwardRef}\n value={inputValue}\n disabled={disabled}\n />\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root, Track as RadixTrack } from '@radix-ui/react-slider'\n\nexport const StyledTrack = styled(RadixTrack, {\n backgroundColor: '$background-neutrals-scrollbar',\n position: 'relative',\n flexGrow: 1,\n borderRadius: '$round',\n height: '6px',\n display: 'flex',\n alignItems: 'center',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\n\nexport const StyledRoot = styled(Root, {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n userSelect: 'none',\n touchAction: 'none',\n flex: 1,\n height: '20px',\n})\n\nexport type StyledTrackProps = StrictComponentProps<typeof StyledTrack>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { useSliderContext } from '../use-slider-context'\nimport { StyledRoot, StyledTrack } from './track.styled'\nimport type { StyledTrackProps } from './track.styled'\n\nexport interface TrackProps extends StyledTrackProps {}\n\nexport const Track = React.forwardRef<\n ElementRef<typeof StyledRoot>,\n TrackProps\n>(\n (\n {\n children,\n css,\n // @ts-expect-error className required when extending the component with styled()\n className,\n ...restProps\n },\n forwardRef\n ) => {\n const {\n value,\n min,\n max,\n step,\n onValueCommit,\n onValueChange,\n disabled,\n ariaDisabled,\n name,\n } = useSliderContext()\n\n return (\n <StyledRoot\n css={css}\n // @ts-expect-error className required when extending the component with styled()\n className={className}\n step={step}\n disabled={disabled}\n aria-disabled={ariaDisabled}\n value={[value]}\n ref={forwardRef}\n min={min}\n max={max}\n name={name}\n onValueCommit={value => onValueCommit?.(value[0])}\n onValueChange={value => onValueChange(value[0])}\n onPointerDown={e => {\n if (booleanify(ariaDisabled)) {\n e.preventDefault()\n }\n }}\n >\n <StyledTrack\n {...restProps}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledTrack>\n </StyledRoot>\n )\n }\n)\n","import type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport React from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { Range } from './partials/range'\nimport { Thumb } from './partials/thumb'\nimport type { StyledSliderProps } from './slider.styled'\nimport { StyledSlider } from './slider.styled'\nimport { SliderProvider } from './use-slider-context'\nimport { Value } from './partials/value'\nimport { Input } from './partials/input'\nimport { Track } from './partials/track'\n\nexport interface SliderProps extends StyledSliderProps {\n /**\n * The maximum value for the range.\n * @default 100\n */\n max?: number\n\n /**\n * The children components of the slider.\n */\n children: React.ReactNode\n\n /**\n * The controlled value of the slider. Must be used in conjunction with onValueChange.\n */\n value?: number\n\n /**\n * The minimum value for the range.\n * @default 0\n */\n min?: number\n\n /**\n * The stepping interval.\n */\n step?: number\n\n /**\n * When true, prevents the user from interacting with the slider.\n */\n disabled?: boolean\n\n /**\n * Event handler called when the value changes at the end of an interaction.\n * Useful when you only need to capture a final value e.g. to update a backend service.\n */\n onValueCommit?: (value: number) => void\n\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: number) => void\n\n /**\n * When true, prevents the user from interacting with the slider but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n\n /**\n * The name of the slider. Submitted with its owning form as part of a\n * name/value pair.\n */\n name?: string\n}\n\nexport const Slider = React.forwardRef<\n ElementRef<typeof StyledSlider>,\n SliderProps\n>(\n (\n {\n step = 1,\n disabled = false,\n 'aria-disabled': ariaDisabled = false,\n min = 0,\n max = 100,\n value,\n onValueCommit,\n onValueChange,\n children,\n name,\n ...restProps\n },\n forwardRef\n ) => (\n <SliderProvider\n value={value}\n onValueCommit={onValueCommit}\n onValueChange={onValueChange}\n step={step}\n min={min}\n max={max}\n disabled={disabled}\n ariaDisabled={booleanify(ariaDisabled)}\n name={name}\n >\n <StyledSlider {...restProps} ref={forwardRef}>\n {children}\n </StyledSlider>\n </SliderProvider>\n )\n) as ForwardRefExoticComponent<SliderProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Track: typeof Track\n Range: typeof Range\n Thumb: typeof Thumb\n Value: typeof Value\n Input: typeof Input\n}\n\nSlider.Track = Track\nSlider.Range = Range\nSlider.Thumb = Thumb\nSlider.Value = Value\nSlider.Input = Input\n"],"names":["styled","RadixRange","createContext","useState","useCallback","value","jsx","useContext","React","RadixThumb","focus","useAriaDisabled","Primitive","textFieldStyles","useEffect","RadixTrack","Root","booleanify"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../src/partials/range.styled.tsx","../src/use-slider-context.tsx","../src/partials/range.tsx","../src/partials/thumb.styled.tsx","../src/partials/thumb.tsx","../src/slider.styled.tsx","../src/partials/value.styled.tsx","../src/partials/value.tsx","../src/partials/input.styled.tsx","../src/partials/input.tsx","../src/partials/track.styled.tsx","../src/partials/track.tsx","../src/slider.tsx"],"sourcesContent":["import { Range as RadixRange } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledRange = styled(RadixRange, {\n position: 'absolute',\n backgroundColor: '$background-primary-prominent',\n borderRadius: '$round',\n height: '100%',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\nexport type StyledRangeProps = StrictComponentProps<typeof StyledRange>\n","import React, { createContext, useCallback, useContext, useState } from 'react'\n\ninterface SharedProps {\n name?: string\n disabled: boolean\n ariaDisabled: boolean\n min: number\n max: number\n step?: number\n onValueCommit?: (value: number) => void\n}\n\ninterface SliderContextProps extends SharedProps {\n value: number\n onValueChange: (value: number) => void\n}\n\nexport interface SliderProviderProps extends SharedProps {\n value?: number\n onValueChange?: (value: number) => void\n}\n\nconst SliderContext = createContext<SliderContextProps>({} as any)\n\nexport const SliderProvider = ({\n children,\n min,\n value: valueProp,\n onValueChange: onValueChangeProp,\n ...restProps\n}: React.PropsWithChildren<SliderProviderProps>): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n const onValueChange = useCallback(\n (value: number): void => {\n setSliderValue(value)\n if (onValueChangeProp != null) {\n onValueChangeProp(value)\n }\n },\n [onValueChangeProp]\n )\n\n return (\n <SliderContext.Provider\n value={{\n ...restProps,\n min,\n value,\n onValueChange,\n }}\n >\n {children}\n </SliderContext.Provider>\n )\n}\n\nexport const useSliderContext = (): SliderContextProps =>\n useContext(SliderContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledRangeProps } from './range.styled'\nimport { StyledRange } from './range.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface RangeProps extends StyledRangeProps {}\n\nexport const Range = React.forwardRef<\n ElementRef<typeof StyledRange>,\n RangeProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n return (\n <StyledRange\n {...props}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n />\n )\n})\n","import { Thumb as RadixThumb } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { focus } from '@mirohq/design-system-styles'\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n width: '20px',\n height: '20px',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1px solid $border-neutrals-controls',\n cursor: 'pointer',\n outline: 'none',\n\n _hover: {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-active',\n },\n\n ...focus.css({\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-selected',\n }),\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n\n _hover: {\n boxShadow: 'none',\n border: 'none',\n },\n\n '&:active': {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n },\n },\n },\n})\nexport type StyledThumbProps = StrictComponentProps<typeof StyledThumb>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport type { StyledThumbProps } from './thumb.styled'\nimport { StyledThumb } from './thumb.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface ThumbProps extends StyledThumbProps {}\n\nexport const Thumb = React.forwardRef<\n ElementRef<typeof StyledThumb>,\n ThumbProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n })\n\n return <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef} />\n})\n","import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledSlider = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'row',\n gap: '$100',\n alignItems: 'center',\n})\n\nexport type StyledSliderProps = StrictComponentProps<typeof StyledSlider>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { ComponentPropsWithRef } from 'react'\n\nexport const StyledValue = styled('span', {})\nexport type StyledValueProps = ComponentPropsWithRef<typeof StyledValue>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledValueProps } from './value.styled'\nimport { StyledValue } from './value.styled'\n\nexport interface ValueProps extends StyledValueProps {}\n\nexport const Value = React.forwardRef<\n ElementRef<typeof StyledValue>,\n ValueProps\n>((props, forwardRef) => {\n const { value } = useSliderContext()\n\n return (\n <StyledValue {...props} ref={forwardRef}>\n {value}\n </StyledValue>\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport { textFieldStyles } from '@mirohq/design-system-base-text-field'\nimport { focus } from '@mirohq/design-system-styles'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst disabledAndReadonlySelectors =\n ':read-only, :disabled, [aria-disabled=\"true\"]'\n\nexport const StyledInput = styled('input', {\n all: 'unset',\n display: 'block',\n maxWidth: '$11',\n height: '$8',\n padding: '0 $50',\n textAlign: 'center',\n\n ...textFieldStyles.variants.idle,\n ...textFieldStyles.v1.idle,\n\n '&:read-only': textFieldStyles.v1.readOnly,\n\n '&:disabled, &[aria-disabled=\"true\"]': {\n ...textFieldStyles.variants.disabled,\n ...textFieldStyles.base.disabled,\n },\n\n [`&:not(${disabledAndReadonlySelectors})`]: {\n _hover: textFieldStyles.variants.hovered,\n },\n\n [`&:not(${disabledAndReadonlySelectors})::placeholder`]:\n textFieldStyles.base.placeholder.v1,\n\n ...focus.css({\n ...textFieldStyles.v1.focused,\n }),\n\n '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0,\n },\n '&[type=number]': {\n '-moz-appearance': 'textfield',\n },\n})\nexport type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>\n","import React, { useEffect, useState } from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledInputProps } from './input.styled'\nimport { StyledInput } from './input.styled'\n\nexport interface ValueProps extends StyledInputProps {}\n\nexport const Input = React.forwardRef<\n ElementRef<typeof StyledInput>,\n ValueProps\n>((props, forwardRef) => {\n const {\n value,\n onValueChange,\n onValueCommit,\n min,\n max,\n step,\n disabled,\n ariaDisabled,\n } = useSliderContext()\n const [inputValue, setInputValue] = useState(value.toString())\n\n useEffect(() => {\n setInputValue(value.toString())\n }, [value])\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n onKeyUp: e => {\n if (e.key === 'Enter') {\n let valueToSet = Number(inputValue)\n if (max !== undefined && valueToSet > max) {\n valueToSet = max\n } else if (min !== undefined && valueToSet < min) {\n valueToSet = min\n } else if (step !== undefined && valueToSet % step !== 0) {\n valueToSet = Math.round(valueToSet / step) * step\n }\n\n setInputValue(valueToSet.toString())\n onValueChange(valueToSet)\n onValueCommit?.(valueToSet)\n }\n },\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => {\n setInputValue(e.target.value)\n },\n })\n\n return (\n <StyledInput\n {...elementProps}\n type='number'\n ref={forwardRef}\n value={inputValue}\n disabled={disabled}\n />\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root, Track as RadixTrack } from '@radix-ui/react-slider'\n\nexport const StyledTrack = styled(RadixTrack, {\n backgroundColor: '$background-neutrals-scrollbar',\n position: 'relative',\n flexGrow: 1,\n borderRadius: '$round',\n height: '6px',\n display: 'flex',\n alignItems: 'center',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\n\nexport const StyledRoot = styled(Root, {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n userSelect: 'none',\n touchAction: 'none',\n flex: 1,\n height: '20px',\n})\n\nexport type StyledTrackProps = StrictComponentProps<typeof StyledTrack>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { useSliderContext } from '../use-slider-context'\nimport { StyledRoot, StyledTrack } from './track.styled'\nimport type { StyledTrackProps } from './track.styled'\n\nexport interface TrackProps extends StyledTrackProps {}\n\nexport const Track = React.forwardRef<\n ElementRef<typeof StyledRoot>,\n TrackProps\n>(\n (\n {\n children,\n css,\n // @ts-expect-error className required when extending the component with styled()\n className,\n ...restProps\n },\n forwardRef\n ) => {\n const {\n value,\n min,\n max,\n step,\n onValueCommit,\n onValueChange,\n disabled,\n ariaDisabled,\n name,\n } = useSliderContext()\n\n return (\n <StyledRoot\n css={css}\n // @ts-expect-error className required when extending the component with styled()\n className={className}\n step={step}\n disabled={disabled}\n aria-disabled={ariaDisabled}\n value={[value]}\n ref={forwardRef}\n min={min}\n max={max}\n name={name}\n onValueCommit={value => onValueCommit?.(value[0])}\n onValueChange={value => onValueChange(value[0])}\n onPointerDown={e => {\n if (booleanify(ariaDisabled)) {\n e.preventDefault()\n }\n }}\n >\n <StyledTrack\n {...restProps}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledTrack>\n </StyledRoot>\n )\n }\n)\n","import type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport React from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { Range } from './partials/range'\nimport { Thumb } from './partials/thumb'\nimport type { StyledSliderProps } from './slider.styled'\nimport { StyledSlider } from './slider.styled'\nimport { SliderProvider } from './use-slider-context'\nimport { Value } from './partials/value'\nimport { Input } from './partials/input'\nimport { Track } from './partials/track'\n\nexport interface SliderProps extends StyledSliderProps {\n /**\n * The maximum value for the range.\n * @default 100\n */\n max?: number\n\n /**\n * The children components of the slider.\n */\n children: React.ReactNode\n\n /**\n * The controlled value of the slider. Must be used in conjunction with onValueChange.\n */\n value?: number\n\n /**\n * The minimum value for the range.\n * @default 0\n */\n min?: number\n\n /**\n * The stepping interval.\n */\n step?: number\n\n /**\n * When true, prevents the user from interacting with the slider.\n */\n disabled?: boolean\n\n /**\n * Event handler called when the value changes at the end of an interaction.\n * Useful when you only need to capture a final value e.g. to update a backend service.\n */\n onValueCommit?: (value: number) => void\n\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: number) => void\n\n /**\n * When true, prevents the user from interacting with the slider but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n\n /**\n * The name of the slider. Submitted with its owning form as part of a\n * name/value pair.\n */\n name?: string\n}\n\nexport const Slider = React.forwardRef<\n ElementRef<typeof StyledSlider>,\n SliderProps\n>(\n (\n {\n step = 1,\n disabled = false,\n 'aria-disabled': ariaDisabled = false,\n min = 0,\n max = 100,\n value,\n onValueCommit,\n onValueChange,\n children,\n name,\n ...restProps\n },\n forwardRef\n ) => (\n <SliderProvider\n value={value}\n onValueCommit={onValueCommit}\n onValueChange={onValueChange}\n step={step}\n min={min}\n max={max}\n disabled={disabled}\n ariaDisabled={booleanify(ariaDisabled)}\n name={name}\n >\n <StyledSlider\n {...restProps}\n aria-disabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledSlider>\n </SliderProvider>\n )\n) as ForwardRefExoticComponent<SliderProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Track: typeof Track\n Range: typeof Range\n Thumb: typeof Thumb\n Value: typeof Value\n Input: typeof Input\n}\n\nSlider.Track = Track\nSlider.Range = Range\nSlider.Thumb = Thumb\nSlider.Value = Value\nSlider.Input = Input\n"],"names":["styled","RadixRange","createContext","useState","useCallback","value","jsx","useContext","React","RadixThumb","focus","useAriaDisabled","Primitive","textFieldStyles","useEffect","RadixTrack","Root","booleanify"],"mappings":"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"}
|
package/dist/module.js
CHANGED
|
@@ -335,7 +335,15 @@ const Slider = React.forwardRef(
|
|
|
335
335
|
disabled,
|
|
336
336
|
ariaDisabled: booleanify(ariaDisabled),
|
|
337
337
|
name,
|
|
338
|
-
children: /* @__PURE__ */ jsx(
|
|
338
|
+
children: /* @__PURE__ */ jsx(
|
|
339
|
+
StyledSlider,
|
|
340
|
+
{
|
|
341
|
+
...restProps,
|
|
342
|
+
"aria-disabled": ariaDisabled,
|
|
343
|
+
ref: forwardRef,
|
|
344
|
+
children
|
|
345
|
+
}
|
|
346
|
+
)
|
|
339
347
|
}
|
|
340
348
|
)
|
|
341
349
|
);
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.js","sources":["../src/partials/range.styled.tsx","../src/use-slider-context.tsx","../src/partials/range.tsx","../src/partials/thumb.styled.tsx","../src/partials/thumb.tsx","../src/slider.styled.tsx","../src/partials/value.styled.tsx","../src/partials/value.tsx","../src/partials/input.styled.tsx","../src/partials/input.tsx","../src/partials/track.styled.tsx","../src/partials/track.tsx","../src/slider.tsx"],"sourcesContent":["import { Range as RadixRange } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledRange = styled(RadixRange, {\n position: 'absolute',\n backgroundColor: '$background-primary-prominent',\n borderRadius: '$round',\n height: '100%',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\nexport type StyledRangeProps = StrictComponentProps<typeof StyledRange>\n","import React, { createContext, useCallback, useContext, useState } from 'react'\n\ninterface SharedProps {\n name?: string\n disabled: boolean\n ariaDisabled: boolean\n min: number\n max: number\n step?: number\n onValueCommit?: (value: number) => void\n}\n\ninterface SliderContextProps extends SharedProps {\n value: number\n onValueChange: (value: number) => void\n}\n\nexport interface SliderProviderProps extends SharedProps {\n value?: number\n onValueChange?: (value: number) => void\n}\n\nconst SliderContext = createContext<SliderContextProps>({} as any)\n\nexport const SliderProvider = ({\n children,\n min,\n value: valueProp,\n onValueChange: onValueChangeProp,\n ...restProps\n}: React.PropsWithChildren<SliderProviderProps>): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n const onValueChange = useCallback(\n (value: number): void => {\n setSliderValue(value)\n if (onValueChangeProp != null) {\n onValueChangeProp(value)\n }\n },\n [onValueChangeProp]\n )\n\n return (\n <SliderContext.Provider\n value={{\n ...restProps,\n min,\n value,\n onValueChange,\n }}\n >\n {children}\n </SliderContext.Provider>\n )\n}\n\nexport const useSliderContext = (): SliderContextProps =>\n useContext(SliderContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledRangeProps } from './range.styled'\nimport { StyledRange } from './range.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface RangeProps extends StyledRangeProps {}\n\nexport const Range = React.forwardRef<\n ElementRef<typeof StyledRange>,\n RangeProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n return (\n <StyledRange\n {...props}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n />\n )\n})\n","import { Thumb as RadixThumb } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { focus } from '@mirohq/design-system-styles'\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n width: '20px',\n height: '20px',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1px solid $border-neutrals-controls',\n cursor: 'pointer',\n outline: 'none',\n\n _hover: {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-active',\n },\n\n ...focus.css({\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-selected',\n }),\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n\n _hover: {\n boxShadow: 'none',\n border: 'none',\n },\n\n '&:active': {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n },\n },\n },\n})\nexport type StyledThumbProps = StrictComponentProps<typeof StyledThumb>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport type { StyledThumbProps } from './thumb.styled'\nimport { StyledThumb } from './thumb.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface ThumbProps extends StyledThumbProps {}\n\nexport const Thumb = React.forwardRef<\n ElementRef<typeof StyledThumb>,\n ThumbProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n })\n\n return <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef} />\n})\n","import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledSlider = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'row',\n gap: '$100',\n alignItems: 'center',\n})\n\nexport type StyledSliderProps = StrictComponentProps<typeof StyledSlider>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { ComponentPropsWithRef } from 'react'\n\nexport const StyledValue = styled('span', {})\nexport type StyledValueProps = ComponentPropsWithRef<typeof StyledValue>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledValueProps } from './value.styled'\nimport { StyledValue } from './value.styled'\n\nexport interface ValueProps extends StyledValueProps {}\n\nexport const Value = React.forwardRef<\n ElementRef<typeof StyledValue>,\n ValueProps\n>((props, forwardRef) => {\n const { value } = useSliderContext()\n\n return (\n <StyledValue {...props} ref={forwardRef}>\n {value}\n </StyledValue>\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport { textFieldStyles } from '@mirohq/design-system-base-text-field'\nimport { focus } from '@mirohq/design-system-styles'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst disabledAndReadonlySelectors =\n ':read-only, :disabled, [aria-disabled=\"true\"]'\n\nexport const StyledInput = styled('input', {\n all: 'unset',\n display: 'block',\n maxWidth: '$11',\n height: '$8',\n padding: '0 $50',\n textAlign: 'center',\n\n ...textFieldStyles.variants.idle,\n ...textFieldStyles.v1.idle,\n\n '&:read-only': textFieldStyles.v1.readOnly,\n\n '&:disabled, &[aria-disabled=\"true\"]': {\n ...textFieldStyles.variants.disabled,\n ...textFieldStyles.base.disabled,\n },\n\n [`&:not(${disabledAndReadonlySelectors})`]: {\n _hover: textFieldStyles.variants.hovered,\n },\n\n [`&:not(${disabledAndReadonlySelectors})::placeholder`]:\n textFieldStyles.base.placeholder.v1,\n\n ...focus.css({\n ...textFieldStyles.v1.focused,\n }),\n\n '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0,\n },\n '&[type=number]': {\n '-moz-appearance': 'textfield',\n },\n})\nexport type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>\n","import React, { useEffect, useState } from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledInputProps } from './input.styled'\nimport { StyledInput } from './input.styled'\n\nexport interface ValueProps extends StyledInputProps {}\n\nexport const Input = React.forwardRef<\n ElementRef<typeof StyledInput>,\n ValueProps\n>((props, forwardRef) => {\n const {\n value,\n onValueChange,\n onValueCommit,\n min,\n max,\n step,\n disabled,\n ariaDisabled,\n } = useSliderContext()\n const [inputValue, setInputValue] = useState(value.toString())\n\n useEffect(() => {\n setInputValue(value.toString())\n }, [value])\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n onKeyUp: e => {\n if (e.key === 'Enter') {\n let valueToSet = Number(inputValue)\n if (max !== undefined && valueToSet > max) {\n valueToSet = max\n } else if (min !== undefined && valueToSet < min) {\n valueToSet = min\n } else if (step !== undefined && valueToSet % step !== 0) {\n valueToSet = Math.round(valueToSet / step) * step\n }\n\n setInputValue(valueToSet.toString())\n onValueChange(valueToSet)\n onValueCommit?.(valueToSet)\n }\n },\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => {\n setInputValue(e.target.value)\n },\n })\n\n return (\n <StyledInput\n {...elementProps}\n type='number'\n ref={forwardRef}\n value={inputValue}\n disabled={disabled}\n />\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root, Track as RadixTrack } from '@radix-ui/react-slider'\n\nexport const StyledTrack = styled(RadixTrack, {\n backgroundColor: '$background-neutrals-scrollbar',\n position: 'relative',\n flexGrow: 1,\n borderRadius: '$round',\n height: '6px',\n display: 'flex',\n alignItems: 'center',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\n\nexport const StyledRoot = styled(Root, {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n userSelect: 'none',\n touchAction: 'none',\n flex: 1,\n height: '20px',\n})\n\nexport type StyledTrackProps = StrictComponentProps<typeof StyledTrack>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { useSliderContext } from '../use-slider-context'\nimport { StyledRoot, StyledTrack } from './track.styled'\nimport type { StyledTrackProps } from './track.styled'\n\nexport interface TrackProps extends StyledTrackProps {}\n\nexport const Track = React.forwardRef<\n ElementRef<typeof StyledRoot>,\n TrackProps\n>(\n (\n {\n children,\n css,\n // @ts-expect-error className required when extending the component with styled()\n className,\n ...restProps\n },\n forwardRef\n ) => {\n const {\n value,\n min,\n max,\n step,\n onValueCommit,\n onValueChange,\n disabled,\n ariaDisabled,\n name,\n } = useSliderContext()\n\n return (\n <StyledRoot\n css={css}\n // @ts-expect-error className required when extending the component with styled()\n className={className}\n step={step}\n disabled={disabled}\n aria-disabled={ariaDisabled}\n value={[value]}\n ref={forwardRef}\n min={min}\n max={max}\n name={name}\n onValueCommit={value => onValueCommit?.(value[0])}\n onValueChange={value => onValueChange(value[0])}\n onPointerDown={e => {\n if (booleanify(ariaDisabled)) {\n e.preventDefault()\n }\n }}\n >\n <StyledTrack\n {...restProps}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledTrack>\n </StyledRoot>\n )\n }\n)\n","import type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport React from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { Range } from './partials/range'\nimport { Thumb } from './partials/thumb'\nimport type { StyledSliderProps } from './slider.styled'\nimport { StyledSlider } from './slider.styled'\nimport { SliderProvider } from './use-slider-context'\nimport { Value } from './partials/value'\nimport { Input } from './partials/input'\nimport { Track } from './partials/track'\n\nexport interface SliderProps extends StyledSliderProps {\n /**\n * The maximum value for the range.\n * @default 100\n */\n max?: number\n\n /**\n * The children components of the slider.\n */\n children: React.ReactNode\n\n /**\n * The controlled value of the slider. Must be used in conjunction with onValueChange.\n */\n value?: number\n\n /**\n * The minimum value for the range.\n * @default 0\n */\n min?: number\n\n /**\n * The stepping interval.\n */\n step?: number\n\n /**\n * When true, prevents the user from interacting with the slider.\n */\n disabled?: boolean\n\n /**\n * Event handler called when the value changes at the end of an interaction.\n * Useful when you only need to capture a final value e.g. to update a backend service.\n */\n onValueCommit?: (value: number) => void\n\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: number) => void\n\n /**\n * When true, prevents the user from interacting with the slider but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n\n /**\n * The name of the slider. Submitted with its owning form as part of a\n * name/value pair.\n */\n name?: string\n}\n\nexport const Slider = React.forwardRef<\n ElementRef<typeof StyledSlider>,\n SliderProps\n>(\n (\n {\n step = 1,\n disabled = false,\n 'aria-disabled': ariaDisabled = false,\n min = 0,\n max = 100,\n value,\n onValueCommit,\n onValueChange,\n children,\n name,\n ...restProps\n },\n forwardRef\n ) => (\n <SliderProvider\n value={value}\n onValueCommit={onValueCommit}\n onValueChange={onValueChange}\n step={step}\n min={min}\n max={max}\n disabled={disabled}\n ariaDisabled={booleanify(ariaDisabled)}\n name={name}\n >\n <StyledSlider {...restProps} ref={forwardRef}>\n {children}\n </StyledSlider>\n </SliderProvider>\n )\n) as ForwardRefExoticComponent<SliderProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Track: typeof Track\n Range: typeof Range\n Thumb: typeof Thumb\n Value: typeof Value\n Input: typeof Input\n}\n\nSlider.Track = Track\nSlider.Range = Range\nSlider.Thumb = Thumb\nSlider.Value = Value\nSlider.Input = Input\n"],"names":["RadixRange","value","RadixThumb","RadixTrack"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"module.js","sources":["../src/partials/range.styled.tsx","../src/use-slider-context.tsx","../src/partials/range.tsx","../src/partials/thumb.styled.tsx","../src/partials/thumb.tsx","../src/slider.styled.tsx","../src/partials/value.styled.tsx","../src/partials/value.tsx","../src/partials/input.styled.tsx","../src/partials/input.tsx","../src/partials/track.styled.tsx","../src/partials/track.tsx","../src/slider.tsx"],"sourcesContent":["import { Range as RadixRange } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledRange = styled(RadixRange, {\n position: 'absolute',\n backgroundColor: '$background-primary-prominent',\n borderRadius: '$round',\n height: '100%',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\nexport type StyledRangeProps = StrictComponentProps<typeof StyledRange>\n","import React, { createContext, useCallback, useContext, useState } from 'react'\n\ninterface SharedProps {\n name?: string\n disabled: boolean\n ariaDisabled: boolean\n min: number\n max: number\n step?: number\n onValueCommit?: (value: number) => void\n}\n\ninterface SliderContextProps extends SharedProps {\n value: number\n onValueChange: (value: number) => void\n}\n\nexport interface SliderProviderProps extends SharedProps {\n value?: number\n onValueChange?: (value: number) => void\n}\n\nconst SliderContext = createContext<SliderContextProps>({} as any)\n\nexport const SliderProvider = ({\n children,\n min,\n value: valueProp,\n onValueChange: onValueChangeProp,\n ...restProps\n}: React.PropsWithChildren<SliderProviderProps>): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n const onValueChange = useCallback(\n (value: number): void => {\n setSliderValue(value)\n if (onValueChangeProp != null) {\n onValueChangeProp(value)\n }\n },\n [onValueChangeProp]\n )\n\n return (\n <SliderContext.Provider\n value={{\n ...restProps,\n min,\n value,\n onValueChange,\n }}\n >\n {children}\n </SliderContext.Provider>\n )\n}\n\nexport const useSliderContext = (): SliderContextProps =>\n useContext(SliderContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledRangeProps } from './range.styled'\nimport { StyledRange } from './range.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface RangeProps extends StyledRangeProps {}\n\nexport const Range = React.forwardRef<\n ElementRef<typeof StyledRange>,\n RangeProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n return (\n <StyledRange\n {...props}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n />\n )\n})\n","import { Thumb as RadixThumb } from '@radix-ui/react-slider'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { focus } from '@mirohq/design-system-styles'\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n width: '20px',\n height: '20px',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1px solid $border-neutrals-controls',\n cursor: 'pointer',\n outline: 'none',\n\n _hover: {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-active',\n },\n\n ...focus.css({\n boxShadow: '$focus-controls',\n borderColor: '$border-primary-selected',\n }),\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n\n _hover: {\n boxShadow: 'none',\n border: 'none',\n },\n\n '&:active': {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n cursor: 'default',\n },\n },\n },\n})\nexport type StyledThumbProps = StrictComponentProps<typeof StyledThumb>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport type { StyledThumbProps } from './thumb.styled'\nimport { StyledThumb } from './thumb.styled'\nimport { useSliderContext } from '../use-slider-context'\n\nexport interface ThumbProps extends StyledThumbProps {}\n\nexport const Thumb = React.forwardRef<\n ElementRef<typeof StyledThumb>,\n ThumbProps\n>((props, forwardRef) => {\n const { disabled, ariaDisabled } = useSliderContext()\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n })\n\n return <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef} />\n})\n","import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledSlider = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'row',\n gap: '$100',\n alignItems: 'center',\n})\n\nexport type StyledSliderProps = StrictComponentProps<typeof StyledSlider>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { ComponentPropsWithRef } from 'react'\n\nexport const StyledValue = styled('span', {})\nexport type StyledValueProps = ComponentPropsWithRef<typeof StyledValue>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledValueProps } from './value.styled'\nimport { StyledValue } from './value.styled'\n\nexport interface ValueProps extends StyledValueProps {}\n\nexport const Value = React.forwardRef<\n ElementRef<typeof StyledValue>,\n ValueProps\n>((props, forwardRef) => {\n const { value } = useSliderContext()\n\n return (\n <StyledValue {...props} ref={forwardRef}>\n {value}\n </StyledValue>\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport { textFieldStyles } from '@mirohq/design-system-base-text-field'\nimport { focus } from '@mirohq/design-system-styles'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst disabledAndReadonlySelectors =\n ':read-only, :disabled, [aria-disabled=\"true\"]'\n\nexport const StyledInput = styled('input', {\n all: 'unset',\n display: 'block',\n maxWidth: '$11',\n height: '$8',\n padding: '0 $50',\n textAlign: 'center',\n\n ...textFieldStyles.variants.idle,\n ...textFieldStyles.v1.idle,\n\n '&:read-only': textFieldStyles.v1.readOnly,\n\n '&:disabled, &[aria-disabled=\"true\"]': {\n ...textFieldStyles.variants.disabled,\n ...textFieldStyles.base.disabled,\n },\n\n [`&:not(${disabledAndReadonlySelectors})`]: {\n _hover: textFieldStyles.variants.hovered,\n },\n\n [`&:not(${disabledAndReadonlySelectors})::placeholder`]:\n textFieldStyles.base.placeholder.v1,\n\n ...focus.css({\n ...textFieldStyles.v1.focused,\n }),\n\n '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0,\n },\n '&[type=number]': {\n '-moz-appearance': 'textfield',\n },\n})\nexport type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>\n","import React, { useEffect, useState } from 'react'\nimport type { ElementRef } from 'react'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { useSliderContext } from '../use-slider-context'\nimport type { StyledInputProps } from './input.styled'\nimport { StyledInput } from './input.styled'\n\nexport interface ValueProps extends StyledInputProps {}\n\nexport const Input = React.forwardRef<\n ElementRef<typeof StyledInput>,\n ValueProps\n>((props, forwardRef) => {\n const {\n value,\n onValueChange,\n onValueCommit,\n min,\n max,\n step,\n disabled,\n ariaDisabled,\n } = useSliderContext()\n const [inputValue, setInputValue] = useState(value.toString())\n\n useEffect(() => {\n setInputValue(value.toString())\n }, [value])\n\n const elementProps = useAriaDisabled({\n ...props,\n ariaDisabled,\n onKeyUp: e => {\n if (e.key === 'Enter') {\n let valueToSet = Number(inputValue)\n if (max !== undefined && valueToSet > max) {\n valueToSet = max\n } else if (min !== undefined && valueToSet < min) {\n valueToSet = min\n } else if (step !== undefined && valueToSet % step !== 0) {\n valueToSet = Math.round(valueToSet / step) * step\n }\n\n setInputValue(valueToSet.toString())\n onValueChange(valueToSet)\n onValueCommit?.(valueToSet)\n }\n },\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => {\n setInputValue(e.target.value)\n },\n })\n\n return (\n <StyledInput\n {...elementProps}\n type='number'\n ref={forwardRef}\n value={inputValue}\n disabled={disabled}\n />\n )\n})\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root, Track as RadixTrack } from '@radix-ui/react-slider'\n\nexport const StyledTrack = styled(RadixTrack, {\n backgroundColor: '$background-neutrals-scrollbar',\n position: 'relative',\n flexGrow: 1,\n borderRadius: '$round',\n height: '6px',\n display: 'flex',\n alignItems: 'center',\n\n variants: {\n disabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n ariaDisabled: {\n true: {\n backgroundColor: '$background-neutrals-disabled',\n },\n },\n },\n})\n\nexport const StyledRoot = styled(Root, {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n userSelect: 'none',\n touchAction: 'none',\n flex: 1,\n height: '20px',\n})\n\nexport type StyledTrackProps = StrictComponentProps<typeof StyledTrack>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { useSliderContext } from '../use-slider-context'\nimport { StyledRoot, StyledTrack } from './track.styled'\nimport type { StyledTrackProps } from './track.styled'\n\nexport interface TrackProps extends StyledTrackProps {}\n\nexport const Track = React.forwardRef<\n ElementRef<typeof StyledRoot>,\n TrackProps\n>(\n (\n {\n children,\n css,\n // @ts-expect-error className required when extending the component with styled()\n className,\n ...restProps\n },\n forwardRef\n ) => {\n const {\n value,\n min,\n max,\n step,\n onValueCommit,\n onValueChange,\n disabled,\n ariaDisabled,\n name,\n } = useSliderContext()\n\n return (\n <StyledRoot\n css={css}\n // @ts-expect-error className required when extending the component with styled()\n className={className}\n step={step}\n disabled={disabled}\n aria-disabled={ariaDisabled}\n value={[value]}\n ref={forwardRef}\n min={min}\n max={max}\n name={name}\n onValueCommit={value => onValueCommit?.(value[0])}\n onValueChange={value => onValueChange(value[0])}\n onPointerDown={e => {\n if (booleanify(ariaDisabled)) {\n e.preventDefault()\n }\n }}\n >\n <StyledTrack\n {...restProps}\n disabled={disabled}\n ariaDisabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledTrack>\n </StyledRoot>\n )\n }\n)\n","import type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport React from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\nimport { booleanify } from '@mirohq/design-system-utils'\n\nimport { Range } from './partials/range'\nimport { Thumb } from './partials/thumb'\nimport type { StyledSliderProps } from './slider.styled'\nimport { StyledSlider } from './slider.styled'\nimport { SliderProvider } from './use-slider-context'\nimport { Value } from './partials/value'\nimport { Input } from './partials/input'\nimport { Track } from './partials/track'\n\nexport interface SliderProps extends StyledSliderProps {\n /**\n * The maximum value for the range.\n * @default 100\n */\n max?: number\n\n /**\n * The children components of the slider.\n */\n children: React.ReactNode\n\n /**\n * The controlled value of the slider. Must be used in conjunction with onValueChange.\n */\n value?: number\n\n /**\n * The minimum value for the range.\n * @default 0\n */\n min?: number\n\n /**\n * The stepping interval.\n */\n step?: number\n\n /**\n * When true, prevents the user from interacting with the slider.\n */\n disabled?: boolean\n\n /**\n * Event handler called when the value changes at the end of an interaction.\n * Useful when you only need to capture a final value e.g. to update a backend service.\n */\n onValueCommit?: (value: number) => void\n\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: number) => void\n\n /**\n * When true, prevents the user from interacting with the slider but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n\n /**\n * The name of the slider. Submitted with its owning form as part of a\n * name/value pair.\n */\n name?: string\n}\n\nexport const Slider = React.forwardRef<\n ElementRef<typeof StyledSlider>,\n SliderProps\n>(\n (\n {\n step = 1,\n disabled = false,\n 'aria-disabled': ariaDisabled = false,\n min = 0,\n max = 100,\n value,\n onValueCommit,\n onValueChange,\n children,\n name,\n ...restProps\n },\n forwardRef\n ) => (\n <SliderProvider\n value={value}\n onValueCommit={onValueCommit}\n onValueChange={onValueChange}\n step={step}\n min={min}\n max={max}\n disabled={disabled}\n ariaDisabled={booleanify(ariaDisabled)}\n name={name}\n >\n <StyledSlider\n {...restProps}\n aria-disabled={ariaDisabled}\n ref={forwardRef}\n >\n {children}\n </StyledSlider>\n </SliderProvider>\n )\n) as ForwardRefExoticComponent<SliderProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Track: typeof Track\n Range: typeof Range\n Thumb: typeof Thumb\n Value: typeof Value\n Input: typeof Input\n}\n\nSlider.Track = Track\nSlider.Range = Range\nSlider.Thumb = Thumb\nSlider.Value = Value\nSlider.Input = Input\n"],"names":["RadixRange","value","RadixThumb","RadixTrack"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-slider",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.4",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -28,11 +28,11 @@
|
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@radix-ui/react-slider": "^1.2.0",
|
|
30
30
|
"@mirohq/design-system-base-text-field": "^0.2.3",
|
|
31
|
-
"@mirohq/design-system-primitive": "^1.1.2",
|
|
32
31
|
"@mirohq/design-system-stitches": "^2.6.30",
|
|
33
32
|
"@mirohq/design-system-styles": "^1.2.30",
|
|
34
|
-
"@mirohq/design-system-use-aria-disabled": "^0.2.1",
|
|
35
33
|
"@mirohq/design-system-types": "^0.10.0",
|
|
34
|
+
"@mirohq/design-system-primitive": "^1.1.2",
|
|
35
|
+
"@mirohq/design-system-use-aria-disabled": "^0.2.1",
|
|
36
36
|
"@mirohq/design-system-utils": "^0.15.5"
|
|
37
37
|
},
|
|
38
38
|
"scripts": {
|