@mirohq/design-system-slider 1.1.3-aria-label-icon-button.2 → 1.2.0-fix-stitches-types.0
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 +6 -12
- package/dist/main.js.map +1 -1
- package/dist/module.js +1 -1
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +28 -8
- package/package.json +8 -8
package/dist/main.js
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var designSystemUtils = require('@mirohq/design-system-utils');
|
|
@@ -12,10 +10,6 @@ var designSystemStyles = require('@mirohq/design-system-styles');
|
|
|
12
10
|
var designSystemPrimitive = require('@mirohq/design-system-primitive');
|
|
13
11
|
var designSystemBaseTextField = require('@mirohq/design-system-base-text-field');
|
|
14
12
|
|
|
15
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
|
-
|
|
17
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
18
|
-
|
|
19
13
|
const StyledRange = designSystemStitches.styled(reactSlider.Range, {
|
|
20
14
|
position: "absolute",
|
|
21
15
|
backgroundColor: "$background-primary-prominent",
|
|
@@ -69,7 +63,7 @@ const SliderProvider = ({
|
|
|
69
63
|
};
|
|
70
64
|
const useSliderContext = () => React.useContext(SliderContext);
|
|
71
65
|
|
|
72
|
-
const Range =
|
|
66
|
+
const Range = React.forwardRef((props, forwardRef) => {
|
|
73
67
|
const { disabled, ariaDisabled } = useSliderContext();
|
|
74
68
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
75
69
|
StyledRange,
|
|
@@ -156,7 +150,7 @@ const StyledThumb = designSystemStitches.styled(reactSlider.Thumb, {
|
|
|
156
150
|
}
|
|
157
151
|
});
|
|
158
152
|
|
|
159
|
-
const Thumb =
|
|
153
|
+
const Thumb = React.forwardRef((props, forwardRef) => {
|
|
160
154
|
const { disabled, ariaDisabled } = useSliderContext();
|
|
161
155
|
const elementProps = designSystemUseAriaDisabled.useAriaDisabled({
|
|
162
156
|
...props,
|
|
@@ -174,7 +168,7 @@ const StyledSlider = designSystemStitches.styled(designSystemPrimitive.Primitive
|
|
|
174
168
|
|
|
175
169
|
const StyledValue = designSystemStitches.styled("span", {});
|
|
176
170
|
|
|
177
|
-
const Value =
|
|
171
|
+
const Value = React.forwardRef((props, forwardRef) => {
|
|
178
172
|
const { value } = useSliderContext();
|
|
179
173
|
return /* @__PURE__ */ jsxRuntime.jsx(StyledValue, { ...props, ref: forwardRef, children: value });
|
|
180
174
|
});
|
|
@@ -207,7 +201,7 @@ const StyledInput = designSystemStitches.styled("input", {
|
|
|
207
201
|
}
|
|
208
202
|
});
|
|
209
203
|
|
|
210
|
-
const Input =
|
|
204
|
+
const Input = React.forwardRef((props, forwardRef) => {
|
|
211
205
|
const {
|
|
212
206
|
value,
|
|
213
207
|
onValueChange,
|
|
@@ -287,7 +281,7 @@ const StyledRoot = designSystemStitches.styled(reactSlider.Root, {
|
|
|
287
281
|
height: "20px"
|
|
288
282
|
});
|
|
289
283
|
|
|
290
|
-
const Track =
|
|
284
|
+
const Track = React.forwardRef(
|
|
291
285
|
({
|
|
292
286
|
children,
|
|
293
287
|
css,
|
|
@@ -341,7 +335,7 @@ const Track = React__default["default"].forwardRef(
|
|
|
341
335
|
}
|
|
342
336
|
);
|
|
343
337
|
|
|
344
|
-
const Slider =
|
|
338
|
+
const Slider = React.forwardRef(
|
|
345
339
|
({
|
|
346
340
|
step = 1,
|
|
347
341
|
disabled = false,
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../src/partials/range.styled.tsx","../src/hooks/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 {\n createContext,\n useCallback,\n useContext,\n useEffect,\n useState,\n} from 'react'\nimport type { ReactNode } 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 children?: ReactNode\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}: SliderProviderProps): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n\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 useEffect(() => setSliderValue(valueProp ?? min), [valueProp, min])\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 '../hooks/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 StyledKnob = styled('div', {\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1.5px solid $border-primary',\n cursor: 'pointer',\n outline: 'none',\n boxSizing: 'border-box',\n})\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n square: '24px',\n padding: '$25',\n transition: `padding 100ms`,\n willChange: 'padding',\n boxSizing: 'border-box',\n outline: 'none',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n border: '2px solid $border-primary-hover',\n boxShadow: '0px 4px 4px 0px #00000040',\n },\n padding: '0',\n },\n\n ...focus.css({\n [`& ${StyledKnob}`]: {\n boxShadow: '$focus',\n },\n }),\n\n '&:active, &[data-pressed]': {\n [`& ${StyledKnob}`]: {\n borderColor: '$border-primary-active',\n boxShadow: '0px 0px 0px 4px #3859FF33',\n },\n },\n\n variants: {\n disabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n cursor: 'default',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n padding: '$25',\n },\n\n '&:active': {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n },\n ariaDisabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n\n cursor: 'default',\n },\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, StyledKnob } from './thumb.styled'\nimport { useSliderContext } from '../hooks/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 (\n <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef}>\n <StyledKnob />\n </StyledThumb>\n )\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 '../hooks/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 ...focus.css(textFieldStyles.variants.focused),\n\n '&:read-only': textFieldStyles.variants.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.color,\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 '../hooks/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 '../hooks/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 './hooks/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","useEffect","jsx","useContext","React","RadixThumb","focus","useAriaDisabled","Primitive","textFieldStyles","RadixTrack","Root","booleanify"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../src/partials/range.styled.tsx","../src/hooks/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 {\n createContext,\n useCallback,\n useContext,\n useEffect,\n useState,\n} from 'react'\nimport type { ReactNode } 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 children?: ReactNode\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}: SliderProviderProps): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n\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 useEffect(() => setSliderValue(valueProp ?? min), [valueProp, min])\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 '../hooks/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 StyledKnob = styled('div', {\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1.5px solid $border-primary',\n cursor: 'pointer',\n outline: 'none',\n boxSizing: 'border-box',\n})\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n square: '24px',\n padding: '$25',\n transition: `padding 100ms`,\n willChange: 'padding',\n boxSizing: 'border-box',\n outline: 'none',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n border: '2px solid $border-primary-hover',\n boxShadow: '0px 4px 4px 0px #00000040',\n },\n padding: '0',\n },\n\n ...focus.css({\n [`& ${StyledKnob}`]: {\n boxShadow: '$focus',\n },\n }),\n\n '&:active, &[data-pressed]': {\n [`& ${StyledKnob}`]: {\n borderColor: '$border-primary-active',\n boxShadow: '0px 0px 0px 4px #3859FF33',\n },\n },\n\n variants: {\n disabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n cursor: 'default',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n padding: '$25',\n },\n\n '&:active': {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n },\n ariaDisabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n\n cursor: 'default',\n },\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, StyledKnob } from './thumb.styled'\nimport { useSliderContext } from '../hooks/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 (\n <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef}>\n <StyledKnob />\n </StyledThumb>\n )\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 '../hooks/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 ...focus.css(textFieldStyles.variants.focused),\n\n '&:read-only': textFieldStyles.variants.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.color,\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 '../hooks/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 '../hooks/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 './hooks/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","useEffect","jsx","useContext","RadixThumb","focus","useAriaDisabled","Primitive","textFieldStyles","RadixTrack","Root","booleanify"],"mappings":"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"}
|
package/dist/module.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import React, { createContext, useState, useCallback, useEffect
|
|
2
|
+
import React, { createContext, useContext, useState, useCallback, useEffect } from 'react';
|
|
3
3
|
import { booleanify } from '@mirohq/design-system-utils';
|
|
4
4
|
import { Range as Range$1, Thumb as Thumb$1, Track as Track$1, Root } from '@radix-ui/react-slider';
|
|
5
5
|
import { styled } from '@mirohq/design-system-stitches';
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.js","sources":["../src/partials/range.styled.tsx","../src/hooks/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 {\n createContext,\n useCallback,\n useContext,\n useEffect,\n useState,\n} from 'react'\nimport type { ReactNode } 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 children?: ReactNode\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}: SliderProviderProps): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n\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 useEffect(() => setSliderValue(valueProp ?? min), [valueProp, min])\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 '../hooks/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 StyledKnob = styled('div', {\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1.5px solid $border-primary',\n cursor: 'pointer',\n outline: 'none',\n boxSizing: 'border-box',\n})\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n square: '24px',\n padding: '$25',\n transition: `padding 100ms`,\n willChange: 'padding',\n boxSizing: 'border-box',\n outline: 'none',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n border: '2px solid $border-primary-hover',\n boxShadow: '0px 4px 4px 0px #00000040',\n },\n padding: '0',\n },\n\n ...focus.css({\n [`& ${StyledKnob}`]: {\n boxShadow: '$focus',\n },\n }),\n\n '&:active, &[data-pressed]': {\n [`& ${StyledKnob}`]: {\n borderColor: '$border-primary-active',\n boxShadow: '0px 0px 0px 4px #3859FF33',\n },\n },\n\n variants: {\n disabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n cursor: 'default',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n padding: '$25',\n },\n\n '&:active': {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n },\n ariaDisabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n\n cursor: 'default',\n },\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, StyledKnob } from './thumb.styled'\nimport { useSliderContext } from '../hooks/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 (\n <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef}>\n <StyledKnob />\n </StyledThumb>\n )\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 '../hooks/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 ...focus.css(textFieldStyles.variants.focused),\n\n '&:read-only': textFieldStyles.variants.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.color,\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 '../hooks/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 '../hooks/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 './hooks/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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"}
|
|
1
|
+
{"version":3,"file":"module.js","sources":["../src/partials/range.styled.tsx","../src/hooks/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 {\n createContext,\n useCallback,\n useContext,\n useEffect,\n useState,\n} from 'react'\nimport type { ReactNode } 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 children?: ReactNode\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}: SliderProviderProps): JSX.Element => {\n const [value, setSliderValue] = useState<number>(valueProp ?? min)\n\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 useEffect(() => setSliderValue(valueProp ?? min), [valueProp, min])\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 '../hooks/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 StyledKnob = styled('div', {\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: '$background-neutrals',\n borderRadius: '$round',\n border: '1.5px solid $border-primary',\n cursor: 'pointer',\n outline: 'none',\n boxSizing: 'border-box',\n})\n\nexport const StyledThumb = styled(RadixThumb, {\n display: 'block',\n square: '24px',\n padding: '$25',\n transition: `padding 100ms`,\n willChange: 'padding',\n boxSizing: 'border-box',\n outline: 'none',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n border: '2px solid $border-primary-hover',\n boxShadow: '0px 4px 4px 0px #00000040',\n },\n padding: '0',\n },\n\n ...focus.css({\n [`& ${StyledKnob}`]: {\n boxShadow: '$focus',\n },\n }),\n\n '&:active, &[data-pressed]': {\n [`& ${StyledKnob}`]: {\n borderColor: '$border-primary-active',\n boxShadow: '0px 0px 0px 4px #3859FF33',\n },\n },\n\n variants: {\n disabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n cursor: 'default',\n\n _hover: {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n padding: '$25',\n },\n\n '&:active': {\n [`& ${StyledKnob}`]: {\n boxShadow: 'none',\n border: 'none',\n },\n },\n },\n },\n ariaDisabled: {\n true: {\n [`& ${StyledKnob}`]: {\n backgroundColor: '$background-neutrals-disabled',\n border: 'none',\n boxShadow: 'none',\n },\n\n cursor: 'default',\n },\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, StyledKnob } from './thumb.styled'\nimport { useSliderContext } from '../hooks/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 (\n <StyledThumb {...elementProps} disabled={disabled} ref={forwardRef}>\n <StyledKnob />\n </StyledThumb>\n )\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 '../hooks/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 ...focus.css(textFieldStyles.variants.focused),\n\n '&:read-only': textFieldStyles.variants.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.color,\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 '../hooks/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 '../hooks/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 './hooks/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/dist/types.d.ts
CHANGED
|
@@ -1,13 +1,32 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import react__default, { ComponentPropsWithRef, ForwardRefExoticComponent } from 'react';
|
|
3
3
|
import { Booleanish } from '@mirohq/design-system-types';
|
|
4
|
-
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
5
4
|
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
6
5
|
import { StrictComponentProps } from '@mirohq/design-system-stitches';
|
|
7
6
|
import * as _radix_ui_react_slider from '@radix-ui/react-slider';
|
|
8
7
|
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
9
8
|
|
|
10
|
-
|
|
9
|
+
/* Utilities */
|
|
10
|
+
/* ========================================================================== */
|
|
11
|
+
|
|
12
|
+
/** Returns a string with the given prefix followed by the given values. */
|
|
13
|
+
type Prefixed<K extends string, T> = `${K}${Extract<T, boolean | number | string>}`
|
|
14
|
+
|
|
15
|
+
type TransformProps<Props, Media> = {
|
|
16
|
+
[K in keyof Props]: (
|
|
17
|
+
| Props[K]
|
|
18
|
+
| (
|
|
19
|
+
& {
|
|
20
|
+
[KMedia in Prefixed<'@', 'initial' | keyof Media>]?: Props[K]
|
|
21
|
+
}
|
|
22
|
+
& {
|
|
23
|
+
[KMedia in string]: Props[K]
|
|
24
|
+
}
|
|
25
|
+
)
|
|
26
|
+
)
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
declare const StyledRange: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderRangeProps & react.RefAttributes<HTMLSpanElement>>>, "disabled" | "ariaDisabled"> & TransformProps<{
|
|
11
30
|
disabled?: boolean | "true" | undefined;
|
|
12
31
|
ariaDisabled?: boolean | "true" | undefined;
|
|
13
32
|
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderRangeProps & react.RefAttributes<HTMLSpanElement>>, {
|
|
@@ -20,7 +39,7 @@ interface RangeProps extends StyledRangeProps {
|
|
|
20
39
|
}
|
|
21
40
|
declare const Range: react__default.ForwardRefExoticComponent<Omit<RangeProps, "ref"> & react__default.RefAttributes<HTMLSpanElement>>;
|
|
22
41
|
|
|
23
|
-
declare const StyledThumb: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderThumbProps & react.RefAttributes<HTMLSpanElement>>>, "disabled" | "ariaDisabled"> &
|
|
42
|
+
declare const StyledThumb: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderThumbProps & react.RefAttributes<HTMLSpanElement>>>, "disabled" | "ariaDisabled"> & TransformProps<{
|
|
24
43
|
disabled?: boolean | "true" | undefined;
|
|
25
44
|
ariaDisabled?: boolean | "true" | undefined;
|
|
26
45
|
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderThumbProps & react.RefAttributes<HTMLSpanElement>>, {
|
|
@@ -33,24 +52,24 @@ interface ThumbProps extends StyledThumbProps {
|
|
|
33
52
|
}
|
|
34
53
|
declare const Thumb: react__default.ForwardRefExoticComponent<Omit<ThumbProps, "ref"> & react__default.RefAttributes<HTMLSpanElement>>;
|
|
35
54
|
|
|
36
|
-
declare const StyledSlider: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> &
|
|
55
|
+
declare const StyledSlider: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
|
|
37
56
|
type StyledSliderProps = StrictComponentProps<typeof StyledSlider>;
|
|
38
57
|
|
|
39
|
-
declare const StyledValue: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<"span">, never> &
|
|
58
|
+
declare const StyledValue: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<"span">, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<"span", {}, {}>;
|
|
40
59
|
type StyledValueProps = ComponentPropsWithRef<typeof StyledValue>;
|
|
41
60
|
|
|
42
61
|
interface ValueProps$1 extends StyledValueProps {
|
|
43
62
|
}
|
|
44
63
|
declare const Value: react__default.ForwardRefExoticComponent<Omit<ValueProps$1, "ref"> & react__default.RefAttributes<HTMLSpanElement>>;
|
|
45
64
|
|
|
46
|
-
declare const StyledInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<"input">, never> &
|
|
65
|
+
declare const StyledInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<"input">, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLInputElement>> & _mirohq_design_system_stitches.StitchesInternals<"input", {}, {}>;
|
|
47
66
|
type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>;
|
|
48
67
|
|
|
49
68
|
interface ValueProps extends StyledInputProps {
|
|
50
69
|
}
|
|
51
70
|
declare const Input: react__default.ForwardRefExoticComponent<Omit<ValueProps, "ref"> & react__default.RefAttributes<HTMLInputElement>>;
|
|
52
71
|
|
|
53
|
-
declare const StyledTrack: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderTrackProps & react.RefAttributes<HTMLSpanElement>>>, "disabled" | "ariaDisabled"> &
|
|
72
|
+
declare const StyledTrack: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderTrackProps & react.RefAttributes<HTMLSpanElement>>>, "disabled" | "ariaDisabled"> & TransformProps<{
|
|
54
73
|
disabled?: boolean | "true" | undefined;
|
|
55
74
|
ariaDisabled?: boolean | "true" | undefined;
|
|
56
75
|
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_slider.SliderTrackProps & react.RefAttributes<HTMLSpanElement>>, {
|
|
@@ -119,4 +138,5 @@ interface Partials {
|
|
|
119
138
|
Input: typeof Input;
|
|
120
139
|
}
|
|
121
140
|
|
|
122
|
-
export { Slider
|
|
141
|
+
export { Slider };
|
|
142
|
+
export type { SliderProps, RangeProps as SliderRangeProps, ThumbProps as SliderThumbProps, TrackProps as SliderTrackProps, ValueProps$1 as SliderValueProps };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-slider",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0-fix-stitches-types.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -27,13 +27,13 @@
|
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@radix-ui/react-slider": "^1.2.0",
|
|
30
|
-
"@mirohq/design-system-base-text-field": "^1.
|
|
31
|
-
"@mirohq/design-system-primitive": "^2.
|
|
32
|
-
"@mirohq/design-system-
|
|
33
|
-
"@mirohq/design-system-styles": "^3.0
|
|
34
|
-
"@mirohq/design-system-
|
|
35
|
-
"@mirohq/design-system-use-aria-disabled": "^1.1.1
|
|
36
|
-
"@mirohq/design-system-
|
|
30
|
+
"@mirohq/design-system-base-text-field": "^1.3.0-fix-stitches-types.0",
|
|
31
|
+
"@mirohq/design-system-primitive": "^2.2.0-fix-stitches-types.0",
|
|
32
|
+
"@mirohq/design-system-types": "^1.0.1",
|
|
33
|
+
"@mirohq/design-system-styles": "^3.1.0-fix-stitches-types.0",
|
|
34
|
+
"@mirohq/design-system-utils": "^1.2.1",
|
|
35
|
+
"@mirohq/design-system-use-aria-disabled": "^1.1.1",
|
|
36
|
+
"@mirohq/design-system-stitches": "^3.2.0-fix-stitches-types.0"
|
|
37
37
|
},
|
|
38
38
|
"scripts": {
|
|
39
39
|
"build": "rollup -c ../../../rollup.config.js",
|