@tremolo-ui/react 0.0.10 → 0.0.11

package/dist/cjs/types/components/Slider/Thumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Thumb.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,aAAa,EAEb,SAAS,EAGV,MAAM,OAAO,CAAA;AAId,uBAAuB;AACvB,MAAM,WAAW,gBAAgB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAA;IAEpB,gBAAgB;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,uBAAuB;AACvB,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAED,uBAAuB;AACvB,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,uBAAuB;AACvB,eAAO,MAAM,WAAW,iHAwDvB,CAAA"}
+{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Thumb.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,aAAa,EAEb,SAAS,EAGV,MAAM,OAAO,CAAA;AAId,uBAAuB;AACvB,MAAM,WAAW,gBAAgB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAA;IAEpB,gBAAgB;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,uBAAuB;AACvB,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAED,uBAAuB;AACvB,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,uBAAuB;AACvB,eAAO,MAAM,WAAW,iHA0DvB,CAAA"}

package/dist/cjs/types/components/Slider/Track.d.ts

@@ -1,7 +1,5 @@
 import { CSSProperties, ReactElement } from 'react';
-/** @category Slider */
 export declare const defaultLength = 140;
-/** @category Slider */
 export declare const defaultThickness = 10;
 /** @category Slider */
 export interface SliderTrackProps {

package/dist/cjs/types/components/Slider/Track.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Track.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Track.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAMnD,uBAAuB;AACvB,eAAO,MAAM,aAAa,MAAM,CAAA;AAChC,uBAAuB;AACvB,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,uBAAuB;AACvB,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAE3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,CAAC,EAAE,OAAO,CAAA;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,YAAY,CAAA;IAEvB,gBAAgB;IAChB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,gBAAgB;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,uBAAuB;AACvB,wBAAgB,WAAW,CAAC,EAC1B,MAAsB,EACtB,SAA4B,EAC5B,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,KAAK,EACL,YAAmB,EACnB,OAAO,EACP,SAAa,GACd,EAAE,gBAAgB,2CAmClB"}
+{"version":3,"file":"Track.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Track.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAMnD,eAAO,MAAM,aAAa,MAAM,CAAA;AAChC,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,uBAAuB;AACvB,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAE3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,CAAC,EAAE,OAAO,CAAA;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,YAAY,CAAA;IAEvB,gBAAgB;IAChB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,gBAAgB;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,uBAAuB;AACvB,wBAAgB,WAAW,CAAC,EAC1B,MAAsB,EACtB,SAA4B,EAC5B,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,KAAK,EACL,YAAmB,EACnB,OAAO,EACP,SAAa,GACd,EAAE,gBAAgB,2CAmClB"}

package/dist/cjs/types/components/Slider/context.d.ts

@@ -6,19 +6,11 @@ type State = {
     vertical: boolean;
     reverse: boolean;
     disabled: boolean;
-};
-type Action = {
-    updateMin: (min: State['min']) => void;
-    updateMax: (max: State['max']) => void;
-    updateStep: (step: State['step']) => void;
-    updateSkew: (skew: State['skew']) => void;
-    updateVertical: (vertical: State['vertical']) => void;
-    updateReverse: (reverse: State['reverse']) => void;
-    updateDisabled: (disabled: State['disabled']) => void;
+    readonly: boolean;
 };
 type SliderProviderProps = React.PropsWithChildren<Partial<State>>;
 export declare function SliderProvider({ children, ...props }: SliderProviderProps): import("react/jsx-runtime").JSX.Element;
 /** @category Slider */
-export declare function useSliderContext<T>(selector: (state: State & Action) => T): T;
+export declare function useSliderContext<T>(selector: (state: State) => T): T;
 export {};
 //# sourceMappingURL=context.d.ts.map

package/dist/cjs/types/components/Slider/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/context.tsx"],"names":[],"mappings":"AAGA,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,MAAM,GAAG;IACZ,SAAS,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,IAAI,CAAA;IACtC,SAAS,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,IAAI,CAAA;IACtC,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;IACzC,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;IACzC,cAAc,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK,IAAI,CAAA;IACrD,aAAa,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,IAAI,CAAA;IAClD,cAAc,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK,IAAI,CAAA;CACtD,CAAA;AA8BD,KAAK,mBAAmB,GAAG,KAAK,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAA;AAElE,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAmBzE;AAED,uBAAuB;AACvB,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM,KAAK,CAAC,GAAG,CAAC,CAI7E"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/context.tsx"],"names":[],"mappings":"AAGA,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAA;AAwBD,KAAK,mBAAmB,GAAG,KAAK,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAA;AAElE,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAmBzE;AAED,uBAAuB;AACvB,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,CAAC,GAAG,CAAC,CAIpE"}

package/dist/cjs/types/components/Slider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAEZ,aAAa,EAEb,YAAY,EAKb,MAAM,OAAO,CAAA;AAEd,OAAO,EAML,gBAAgB,EAGjB,MAAM,uBAAuB,CAAA;AAW9B,uBAAuB;AACvB,MAAM,WAAW,WAAW;IAE1B,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IAGX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAC/B;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAA;CAEzC;AAED,uBAAuB;AACvB,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAKD;;;GAGG;AACH,eAAO,MAAM,MAAM,yMA2OlB,CAAA;AAED,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,EACL,WAAW,EACX,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,GACtB,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAC5D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAEZ,aAAa,EAEb,YAAY,EAKb,MAAM,OAAO,CAAA;AAEd,OAAO,EAML,gBAAgB,EAGjB,MAAM,uBAAuB,CAAA;AAW9B,uBAAuB;AACvB,MAAM,WAAW,WAAW;IAE1B,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IAGX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAC/B;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAA;CAEzC;AAED,uBAAuB;AACvB,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAKD;;;GAGG;AACH,eAAO,MAAM,MAAM,yMA4OlB,CAAA;AAED,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,EACL,WAAW,EACX,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,GACtB,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAC5D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA"}

package/dist/cjs/types/hooks/useAnimationFrame.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimationFrame.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useAnimationFrame.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAkC,MAAM,OAAO,CAAA;AAEtE,eAAO,MAAM,iBAAiB,iCAEtB,cAAc,SAarB,CAAA"}
+{"version":3,"file":"useAnimationFrame.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useAnimationFrame.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAkC,MAAM,OAAO,CAAA;AAEtE,eAAO,MAAM,iBAAiB,GAC5B,qBAAmB,EACnB,OAAM,cAAmB,SAa1B,CAAA"}

package/dist/esm/index.js

@@ -70,7 +70,7 @@ function AnimationCanvas(_a) {
     var { width = 100, height = 100, relativeSize = false, reduceFlickering = true, options, init, draw, className } = _a, props = __rest(_a, ["width", "height", "relativeSize", "reduceFlickering", "options", "init", "draw", "className"]);
     const canvasRef = useRef(null);
     const memoCanvasRef = useRef(null);
-    const reqIdRef = useRef();
+    const reqIdRef = useRef(-1);
     const widthRef = useRef(0);
     const heightRef = useRef(0);
     const loop = useCallback((context, width, height, count) => {
@@ -777,7 +777,7 @@ const createNumberInputStore = (initProps) => {
 const NumberInputContext = createContext(null);
 function NumberInputProvider(_a) {
     var { children } = _a, props = __rest(_a, ["children"]);
-    const storeRef = useRef();
+    const storeRef = useRef(null);
     if (!storeRef.current) {
         storeRef.current = createNumberInputStore(props);
     }
@@ -1185,13 +1185,14 @@ const createSliderStore = (initProps) => {
         vertical: false,
         reverse: false,
         disabled: false,
+        readonly: false,
     };
-    return createStore()((set) => (Object.assign(Object.assign(Object.assign({}, DEFAULT_PROPS), initProps), { updateMin: (min) => set(() => ({ min: min })), updateMax: (max) => set(() => ({ max: max })), updateStep: (step) => set(() => ({ step: step })), updateSkew: (skew) => set(() => ({ skew: skew })), updateVertical: (vertical) => set(() => ({ vertical: vertical })), updateReverse: (reverse) => set(() => ({ reverse: reverse })), updateDisabled: (disabled) => set(() => ({ disabled: disabled })) })));
+    return createStore()(() => (Object.assign(Object.assign({}, DEFAULT_PROPS), initProps)));
 };
 const SliderContext = createContext(null);
 function SliderProvider(_a) {
     var { children } = _a, props = __rest(_a, ["children"]);
-    const storeRef = useRef();
+    const storeRef = useRef(null);
     if (!storeRef.current) {
         storeRef.current = createSliderStore(props);
     }
@@ -1290,6 +1291,7 @@ const SliderThumb = forwardRef(({ size, width = defaultThumbSize, height = defau
     const wrapperRef = useRef(null);
     const vertical = useSliderContext((s) => s.vertical);
     const disabled = useSliderContext((s) => s.disabled);
+    const readonly = useSliderContext((s) => s.readonly);
     useImperativeHandle(ref, () => {
         return {
             focus() {
@@ -1309,12 +1311,10 @@ const SliderThumb = forwardRef(({ size, width = defaultThumbSize, height = defau
         // default slider thumb
         jsx("div", { ref: wrapperRef, className: clsx('tremolo-slider-thumb', className), 
             // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-            tabIndex: 0, "aria-disabled": disabled, style: Object.assign({ width: size !== null && size !== void 0 ? size : width, height: size !== null && size !== void 0 ? size : height }, style) })) }));
+            tabIndex: 0, "aria-disabled": disabled, "aria-readonly": readonly, style: Object.assign({ width: size !== null && size !== void 0 ? size : width, height: size !== null && size !== void 0 ? size : height }, style) })) }));
 });
 
-/** @category Slider */
 const defaultLength = 140;
-/** @category Slider */
 const defaultThickness = 10;
 /** @category Slider */
 function SliderTrack({ length = defaultLength, thickness = defaultThickness, active, inactive, children, className, style, defaultStyle = true, __thumb, __percent = 0, }) {
@@ -1469,7 +1469,7 @@ const Slider = forwardRef((_a, ref) => {
             },
         };
     }, []);
-    return (jsx(SliderProvider, { min: min, max: max, step: step, skew: skew, vertical: vertical, reverse: reverse, disabled: disabled, children: jsx("div", Object.assign({ className: clsx('tremolo-slider', className), ref: (div) => {
+    return (jsx(SliderProvider, { min: min, max: max, step: step, skew: skew, vertical: vertical, reverse: reverse, disabled: disabled, readonly: readonly, children: jsx("div", Object.assign({ className: clsx('tremolo-slider', className), ref: (div) => {
                 wheelRefCallback(div);
                 touchMoveRefCallback(div);
             }, tabIndex: -1, role: "slider", "aria-valuenow": value, "aria-valuemin": min, "aria-valuemax": max, "aria-orientation": vertical ? 'vertical' : 'horizontal', "aria-disabled": disabled, "aria-readonly": readonly, style: Object.assign({ margin: `calc(${styleHelper((_b = thumbProps === null || thumbProps === void 0 ? void 0 : thumbProps.size) !== null && _b !== void 0 ? _b : 22)} / 2)` }, style), onPointerDown: (event) => {