@tremolo-ui/react 0.0.7 → 0.0.9
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/cjs/index.js +675 -253
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/AnimationCanvas/index.d.ts +16 -9
- package/dist/cjs/types/components/AnimationCanvas/index.d.ts.map +1 -1
- package/dist/cjs/types/components/AnimationKnob/index.d.ts +53 -0
- package/dist/cjs/types/components/AnimationKnob/index.d.ts.map +1 -0
- package/dist/cjs/types/components/DragObserver/index.d.ts +19 -0
- package/dist/cjs/types/components/DragObserver/index.d.ts.map +1 -0
- package/dist/cjs/types/components/Knob/index.d.ts +26 -26
- package/dist/cjs/types/components/Knob/index.d.ts.map +1 -1
- package/dist/cjs/types/components/NumberInput/index.d.ts +2 -5
- package/dist/cjs/types/components/NumberInput/index.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/BlackKey.d.ts +3 -3
- package/dist/cjs/types/components/Piano/BlackKey.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/KeyLabel.d.ts +5 -8
- package/dist/cjs/types/components/Piano/KeyLabel.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/WhiteKey.d.ts +4 -3
- package/dist/cjs/types/components/Piano/WhiteKey.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/index.d.ts +3 -4
- package/dist/cjs/types/components/Piano/index.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/key.d.ts +4 -7
- package/dist/cjs/types/components/Piano/key.d.ts.map +1 -1
- package/dist/cjs/types/components/Piano/keyboardShortcuts.d.ts.map +1 -1
- package/dist/cjs/types/components/Slider/Scale.d.ts +11 -0
- package/dist/cjs/types/components/Slider/Scale.d.ts.map +1 -0
- package/dist/cjs/types/components/Slider/ScaleOption.d.ts +25 -0
- package/dist/cjs/types/components/Slider/ScaleOption.d.ts.map +1 -0
- package/dist/cjs/types/components/Slider/Thumb.d.ts +5 -13
- package/dist/cjs/types/components/Slider/Thumb.d.ts.map +1 -1
- package/dist/cjs/types/components/Slider/Track.d.ts +10 -21
- package/dist/cjs/types/components/Slider/Track.d.ts.map +1 -1
- package/dist/cjs/types/components/Slider/context.d.ts +21 -0
- package/dist/cjs/types/components/Slider/context.d.ts.map +1 -0
- package/dist/cjs/types/components/Slider/index.d.ts +18 -12
- package/dist/cjs/types/components/Slider/index.d.ts.map +1 -1
- package/dist/cjs/types/components/WheelObserver/index.d.ts +24 -0
- package/dist/cjs/types/components/WheelObserver/index.d.ts.map +1 -0
- package/dist/cjs/types/components/XYPad/Area.d.ts +13 -0
- package/dist/cjs/types/components/XYPad/Area.d.ts.map +1 -0
- package/dist/cjs/types/components/XYPad/Thumb.d.ts +19 -0
- package/dist/cjs/types/components/XYPad/Thumb.d.ts.map +1 -0
- package/dist/cjs/types/components/XYPad/index.d.ts +39 -0
- package/dist/cjs/types/components/XYPad/index.d.ts.map +1 -0
- package/dist/cjs/types/hooks/useCallbackRef.d.ts.map +1 -1
- package/dist/cjs/types/index.d.ts +10 -0
- package/dist/cjs/types/index.d.ts.map +1 -1
- package/dist/esm/index.js +658 -254
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/AnimationCanvas/index.d.ts +16 -9
- package/dist/esm/types/components/AnimationCanvas/index.d.ts.map +1 -1
- package/dist/esm/types/components/AnimationKnob/index.d.ts +53 -0
- package/dist/esm/types/components/AnimationKnob/index.d.ts.map +1 -0
- package/dist/esm/types/components/DragObserver/index.d.ts +19 -0
- package/dist/esm/types/components/DragObserver/index.d.ts.map +1 -0
- package/dist/esm/types/components/Knob/index.d.ts +26 -26
- package/dist/esm/types/components/Knob/index.d.ts.map +1 -1
- package/dist/esm/types/components/NumberInput/index.d.ts +2 -5
- package/dist/esm/types/components/NumberInput/index.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/BlackKey.d.ts +3 -3
- package/dist/esm/types/components/Piano/BlackKey.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/KeyLabel.d.ts +5 -8
- package/dist/esm/types/components/Piano/KeyLabel.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/WhiteKey.d.ts +4 -3
- package/dist/esm/types/components/Piano/WhiteKey.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/index.d.ts +3 -4
- package/dist/esm/types/components/Piano/index.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/key.d.ts +4 -7
- package/dist/esm/types/components/Piano/key.d.ts.map +1 -1
- package/dist/esm/types/components/Piano/keyboardShortcuts.d.ts.map +1 -1
- package/dist/esm/types/components/Slider/Scale.d.ts +11 -0
- package/dist/esm/types/components/Slider/Scale.d.ts.map +1 -0
- package/dist/esm/types/components/Slider/ScaleOption.d.ts +25 -0
- package/dist/esm/types/components/Slider/ScaleOption.d.ts.map +1 -0
- package/dist/esm/types/components/Slider/Thumb.d.ts +5 -13
- package/dist/esm/types/components/Slider/Thumb.d.ts.map +1 -1
- package/dist/esm/types/components/Slider/Track.d.ts +10 -21
- package/dist/esm/types/components/Slider/Track.d.ts.map +1 -1
- package/dist/esm/types/components/Slider/context.d.ts +21 -0
- package/dist/esm/types/components/Slider/context.d.ts.map +1 -0
- package/dist/esm/types/components/Slider/index.d.ts +18 -12
- package/dist/esm/types/components/Slider/index.d.ts.map +1 -1
- package/dist/esm/types/components/WheelObserver/index.d.ts +24 -0
- package/dist/esm/types/components/WheelObserver/index.d.ts.map +1 -0
- package/dist/esm/types/components/XYPad/Area.d.ts +13 -0
- package/dist/esm/types/components/XYPad/Area.d.ts.map +1 -0
- package/dist/esm/types/components/XYPad/Thumb.d.ts +19 -0
- package/dist/esm/types/components/XYPad/Thumb.d.ts.map +1 -0
- package/dist/esm/types/components/XYPad/index.d.ts +39 -0
- package/dist/esm/types/components/XYPad/index.d.ts.map +1 -0
- package/dist/esm/types/hooks/useCallbackRef.d.ts.map +1 -1
- package/dist/esm/types/index.d.ts +10 -0
- package/dist/esm/types/index.d.ts.map +1 -1
- package/dist/styles/index.css +242 -0
- package/package.json +5 -8
- package/src/components/AnimationCanvas/index.tsx +87 -57
- package/src/components/AnimationKnob/index.tsx +305 -0
- package/src/components/DragObserver/index.tsx +94 -0
- package/src/components/Knob/index.css +48 -0
- package/src/components/Knob/index.tsx +152 -165
- package/src/components/NumberInput/index.css +26 -0
- package/src/components/NumberInput/index.tsx +8 -41
- package/src/components/Piano/BlackKey.tsx +105 -98
- package/src/components/Piano/KeyLabel.tsx +18 -40
- package/src/components/Piano/WhiteKey.tsx +94 -87
- package/src/components/Piano/index.css +63 -0
- package/src/components/Piano/index.tsx +78 -61
- package/src/components/Piano/key.ts +4 -7
- package/src/components/Piano/keyboardShortcuts.ts +23 -4
- package/src/components/Slider/Scale.tsx +55 -0
- package/src/components/Slider/ScaleOption.tsx +103 -0
- package/src/components/Slider/Thumb.tsx +69 -76
- package/src/components/Slider/Track.tsx +37 -48
- package/src/components/Slider/context.tsx +66 -0
- package/src/components/Slider/index.css +76 -0
- package/src/components/Slider/index.tsx +256 -298
- package/src/components/WheelObserver/index.tsx +47 -0
- package/src/components/XYPad/Area.tsx +40 -0
- package/src/components/XYPad/Thumb.tsx +92 -0
- package/src/components/XYPad/index.css +24 -0
- package/src/components/XYPad/index.tsx +317 -0
- package/src/hooks/useCallbackRef.ts +1 -0
- package/src/hooks/useRefCallbackEvent.ts +1 -0
- package/src/index.ts +11 -0
- package/dist/cjs/types/components/Slider/type.d.ts +0 -7
- package/dist/cjs/types/components/Slider/type.d.ts.map +0 -1
- package/dist/cjs/types/system/pseudo.d.ts +0 -14
- package/dist/cjs/types/system/pseudo.d.ts.map +0 -1
- package/dist/esm/types/components/Slider/type.d.ts +0 -7
- package/dist/esm/types/components/Slider/type.d.ts.map +0 -1
- package/dist/esm/types/system/pseudo.d.ts +0 -14
- package/dist/esm/types/system/pseudo.d.ts.map +0 -1
- package/src/components/Slider/type.ts +0 -16
- package/src/system/pseudo.ts +0 -55
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
import { InputEventOption } from '@tremolo-ui/functions';
|
|
3
|
-
import { ComponentPropsWithRef } from 'react';
|
|
4
|
-
import { UserActionPseudoProps } from '../../system/pseudo';
|
|
5
|
-
import { DrawFunction } from '../AnimationCanvas';
|
|
6
3
|
export interface KnobProps {
|
|
7
4
|
value: number;
|
|
8
5
|
min: number;
|
|
9
6
|
max: number;
|
|
7
|
+
step?: number;
|
|
8
|
+
skew?: number;
|
|
10
9
|
/**
|
|
11
10
|
* value set when double-clicking
|
|
11
|
+
* @default min
|
|
12
12
|
* @see enableDoubleClickDefault
|
|
13
13
|
*/
|
|
14
14
|
defaultValue?: number;
|
|
@@ -17,31 +17,31 @@ export interface KnobProps {
|
|
|
17
17
|
* @default min
|
|
18
18
|
*/
|
|
19
19
|
startValue?: number;
|
|
20
|
-
|
|
21
|
-
skew?: number;
|
|
22
|
-
/** Priority over width or height */
|
|
23
|
-
size?: number | `${number}%`;
|
|
24
|
-
width?: number | `${number}%`;
|
|
25
|
-
height?: number | `${number}%`;
|
|
26
|
-
/** drawing options */
|
|
27
|
-
options?: {
|
|
28
|
-
active?: string;
|
|
29
|
-
inactive?: string;
|
|
30
|
-
bg?: string;
|
|
31
|
-
thumb?: string;
|
|
32
|
-
lineWeight?: number;
|
|
33
|
-
thumbWeight?: number;
|
|
34
|
-
};
|
|
35
|
-
draw?: DrawFunction;
|
|
20
|
+
size?: number;
|
|
36
21
|
/** Whether to apply `{use-select: none}` when dragging */
|
|
37
22
|
bodyNoSelect?: boolean;
|
|
38
|
-
|
|
23
|
+
/**
|
|
24
|
+
* wheel control option
|
|
25
|
+
*/
|
|
26
|
+
wheel?: InputEventOption | null;
|
|
27
|
+
/**
|
|
28
|
+
* keyboard control option
|
|
29
|
+
*/
|
|
30
|
+
keyboard?: InputEventOption | null;
|
|
39
31
|
enableDoubleClickDefault?: boolean;
|
|
40
|
-
|
|
32
|
+
disabled?: boolean;
|
|
33
|
+
readonly?: boolean;
|
|
34
|
+
activeLine?: string;
|
|
35
|
+
inactiveLine?: string;
|
|
36
|
+
thumb?: string;
|
|
37
|
+
thumbLine?: string;
|
|
38
|
+
classes?: {
|
|
39
|
+
activeLine?: string;
|
|
40
|
+
inactiveLine?: string;
|
|
41
|
+
thumb?: string;
|
|
42
|
+
thumbLine?: string;
|
|
43
|
+
};
|
|
41
44
|
onChange?: (value: number) => void;
|
|
42
45
|
}
|
|
43
|
-
|
|
44
|
-
* simple rotary Knob.
|
|
45
|
-
*/
|
|
46
|
-
export declare function Knob({ value, min, max, defaultValue, startValue, step, skew, size, width, height, options, draw, bodyNoSelect, wheel, enableDoubleClickDefault, style, className, onChange, _active, _focus, _hover, ...props }: KnobProps & UserActionPseudoProps & Omit<ComponentPropsWithRef<'div'>, keyof KnobProps>): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
46
|
+
export declare function Knob({ value, min, max, step, skew, defaultValue, startValue, size, bodyNoSelect, wheel, keyboard, enableDoubleClickDefault, disabled, readonly, activeLine, inactiveLine, thumb, thumbLine, onChange, className, classes, ...props }: KnobProps & Omit<ComponentPropsWithoutRef<'svg'>, keyof KnobProps>): import("react/jsx-runtime").JSX.Element;
|
|
47
47
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Knob/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Knob/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAuB,MAAM,OAAO,CAAA;AAErE,OAAO,EAEL,gBAAgB,EAKjB,MAAM,uBAAuB,CAAA;AAM9B,MAAM,WAAW,SAAS;IAExB,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;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IAGnB,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,0DAA0D;IAC1D,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,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAElC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,OAAO,CAAC,EAAE;QACR,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,CAAA;IAED,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,wBAAgB,IAAI,CAAC,EACnB,KAAK,EACL,GAAG,EACH,GAAG,EACH,IAAQ,EACR,IAAQ,EACR,YAAkB,EAClB,UAAgB,EAChB,IAAS,EACT,YAAmB,EACnB,KAAkB,EAClB,QAAqB,EACrB,wBAA+B,EAC/B,QAAgB,EAChB,QAAgB,EAChB,UAAU,EACV,YAAY,EACZ,KAAK,EACL,SAAS,EACT,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACT,EAAE,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,SAAS,CAAC,2CAoLpE"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import { CSSObject } from '@emotion/react';
|
|
2
|
-
import { Units } from '@tremolo-ui/functions/NumberInput';
|
|
3
1
|
import { ChangeEvent, ComponentPropsWithoutRef } from 'react';
|
|
4
|
-
import {
|
|
2
|
+
import { Units } from '@tremolo-ui/functions/NumberInput';
|
|
5
3
|
export interface NumberInputProps {
|
|
6
4
|
value: number | string;
|
|
7
5
|
min?: number;
|
|
@@ -36,7 +34,6 @@ export interface NumberInputProps {
|
|
|
36
34
|
selectWithFocus?: 'all' | 'number' | 'none';
|
|
37
35
|
blurWithEnter?: boolean;
|
|
38
36
|
className?: string;
|
|
39
|
-
style?: CSSObject;
|
|
40
37
|
onChange?: (value: number, event: ChangeEvent<HTMLInputElement>) => void;
|
|
41
38
|
onFocus?: (value: number, event: React.FocusEvent<HTMLInputElement, Element>) => void;
|
|
42
39
|
onBlur?: (value: number, event: React.FocusEvent<HTMLInputElement, Element>) => void;
|
|
@@ -44,5 +41,5 @@ export interface NumberInputProps {
|
|
|
44
41
|
/**
|
|
45
42
|
* Input with some useful functions for entering numerical values.
|
|
46
43
|
*/
|
|
47
|
-
export declare function NumberInput({ value, min, max, step, defaultValue, units, disabled, placeholder, readOnly, tabIndex, typeNumber, digit, selectWithFocus, blurWithEnter, className,
|
|
44
|
+
export declare function NumberInput({ value, min, max, step, defaultValue, units, disabled, placeholder, readOnly, tabIndex, typeNumber, digit, selectWithFocus, blurWithEnter, className, onChange, onFocus, onBlur, ...props }: NumberInputProps & Omit<ComponentPropsWithoutRef<'input'>, keyof NumberInputProps | 'type'>): import("react/jsx-runtime").JSX.Element;
|
|
48
45
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/NumberInput/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/NumberInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAY,MAAM,OAAO,CAAA;AAGvE,OAAO,EAAc,KAAK,EAAE,MAAM,mCAAmC,CAAA;AAErE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IAEtB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IAGrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAA;IAEtB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;;;;;OAQG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,eAAe,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAA;IAC3C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;IACxE,OAAO,CAAC,EAAE,CACR,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,EAAE,OAAO,CAAC,KAC/C,IAAI,CAAA;IACT,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,EAAE,OAAO,CAAC,KAC/C,IAAI,CAAA;CACV;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,GAAG,EACH,GAAG,EACH,IAAI,EACJ,YAAkB,EAClB,KAAK,EACL,QAAgB,EAChB,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,UAAkB,EAClB,KAAK,EACL,eAAwB,EACxB,aAAoB,EACpB,SAAS,EACT,QAAQ,EACR,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACT,EAAE,gBAAgB,GACjB,IAAI,CAAC,wBAAwB,CAAC,OAAO,CAAC,EAAE,MAAM,gBAAgB,GAAG,MAAM,CAAC,2CAyDzE"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import { KeyMethods, KeyProps } from
|
|
3
|
-
export declare const BlackKey: React.ForwardRefExoticComponent<KeyProps & React.RefAttributes<KeyMethods>>;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { KeyMethods, KeyProps } from './key';
|
|
3
|
+
export declare const BlackKey: React.ForwardRefExoticComponent<KeyProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof KeyProps> & React.RefAttributes<KeyMethods>>;
|
|
4
4
|
//# sourceMappingURL=BlackKey.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlackKey.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/BlackKey.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"BlackKey.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/BlackKey.tsx"],"names":[],"mappings":"AACA,OAAO,KAKN,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAM5C,eAAO,MAAM,QAAQ,gMAoGpB,CAAA"}
|
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
interface Props {
|
|
1
|
+
import { ComponentPropsWithoutRef, CSSProperties, ReactNode } from 'react';
|
|
2
|
+
export interface KeyLabelProps {
|
|
4
3
|
/**
|
|
5
4
|
* override Piano.label
|
|
6
5
|
*/
|
|
7
6
|
label?: (note: number, index: number) => ReactNode;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
wrapperStyle?: CSSObject;
|
|
7
|
+
wrapperClassName?: string;
|
|
8
|
+
wrapperStyle?: CSSProperties;
|
|
11
9
|
/** @internal */
|
|
12
10
|
__note?: number;
|
|
13
11
|
/** @internal */
|
|
@@ -15,6 +13,5 @@ interface Props {
|
|
|
15
13
|
/** @internal */
|
|
16
14
|
__label?: (note: number, index: number) => ReactNode;
|
|
17
15
|
}
|
|
18
|
-
export declare function KeyLabel({ label, className,
|
|
19
|
-
export {};
|
|
16
|
+
export declare function KeyLabel({ label, className, wrapperClassName, wrapperStyle, __note, __index, __label, ...props }: KeyLabelProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KeyLabelProps>): false | import("react/jsx-runtime").JSX.Element;
|
|
20
17
|
//# sourceMappingURL=KeyLabel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyLabel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/KeyLabel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"KeyLabel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/KeyLabel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE1E,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;IAElD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY,CAAC,EAAE,aAAa,CAAA;IAE5B,gBAAgB;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gBAAgB;IAChB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;CACrD;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,OAAO,EACP,OAAO,EACP,GAAG,KAAK,EACT,EAAE,aAAa,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,aAAa,CAAC,mDAiB5E"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import { KeyMethods, KeyProps } from
|
|
3
|
-
export declare const
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { KeyMethods, KeyProps } from './key';
|
|
3
|
+
export declare const defaultWhiteKeyWidth = 40;
|
|
4
|
+
export declare const WhiteKey: React.ForwardRefExoticComponent<KeyProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof KeyProps> & React.RefAttributes<KeyMethods>>;
|
|
4
5
|
//# sourceMappingURL=WhiteKey.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WhiteKey.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/WhiteKey.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"WhiteKey.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/WhiteKey.tsx"],"names":[],"mappings":"AACA,OAAO,KAKN,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAK5C,eAAO,MAAM,oBAAoB,KAAK,CAAA;AAEtC,eAAO,MAAM,QAAQ,gMAoGpB,CAAA"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { ReactElement, ReactNode } from 'react';
|
|
2
|
-
import { CSSObject } from '@emotion/react';
|
|
1
|
+
import { ComponentPropsWithoutRef, CSSProperties, ReactElement, ReactNode } from 'react';
|
|
3
2
|
import { KeyBoardShortcuts } from './keyboardShortcuts';
|
|
4
3
|
/**
|
|
5
4
|
* Piano component
|
|
@@ -17,7 +16,7 @@ export interface PianoProps {
|
|
|
17
16
|
midiMax?: number;
|
|
18
17
|
keyboardShortcuts?: KeyBoardShortcuts;
|
|
19
18
|
fill?: boolean;
|
|
20
|
-
style?:
|
|
19
|
+
style?: CSSProperties;
|
|
21
20
|
playNote?: (noteNumber: number) => void;
|
|
22
21
|
stopNote?: (noteNumber: number) => void;
|
|
23
22
|
label?: (note: number, index: number) => ReactNode;
|
|
@@ -26,7 +25,7 @@ export interface PianoProps {
|
|
|
26
25
|
*/
|
|
27
26
|
children?: ReactElement | ReactElement[];
|
|
28
27
|
}
|
|
29
|
-
export declare function Piano({ noteRange, glissando, midiMax, keyboardShortcuts, fill, height, style, playNote, stopNote, label, children, }: PianoProps): import("
|
|
28
|
+
export declare function Piano({ noteRange, glissando, midiMax, keyboardShortcuts, fill, height, style, className, playNote, stopNote, label, children, ...props }: PianoProps & Omit<ComponentPropsWithoutRef<'div'>, keyof PianoProps>): import("react/jsx-runtime").JSX.Element;
|
|
30
29
|
export * from './key';
|
|
31
30
|
export * from './keyboardShortcuts';
|
|
32
31
|
export { WhiteKey } from './WhiteKey';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/index.tsx"],"names":[],"mappings":"AACA,OAAc,EACZ,wBAAwB,EAExB,aAAa,EACb,YAAY,EACZ,SAAS,EAKV,MAAM,OAAO,CAAA;AAcd,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAGvD;;;;;GAKG;AAEH,MAAM,WAAW,UAAU;IAEzB,SAAS,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAG1C,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd,KAAK,CAAC,EAAE,aAAa,CAAA;IAErB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IAEvC,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;IAElD;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAA;CACzC;AAED,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,SAAgB,EAChB,OAAa,EACb,iBAAiB,EACjB,IAAY,EACZ,MAA4B,EAC5B,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,UAAU,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,UAAU,CAAC,2CA6JtE;AAED,cAAc,OAAO,CAAA;AACrB,cAAc,qBAAqB,CAAA;AAEnC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { ReactElement, ReactNode } from "react";
|
|
1
|
+
import { CSSProperties, ReactElement, ReactNode } from 'react';
|
|
3
2
|
export interface KeyProps {
|
|
4
3
|
width?: number;
|
|
5
|
-
height?: number |
|
|
6
|
-
|
|
7
|
-
activeBg?: string;
|
|
8
|
-
style?: CSSObject;
|
|
4
|
+
height?: number | `${number}%`;
|
|
5
|
+
style?: CSSProperties;
|
|
9
6
|
/**
|
|
10
7
|
* \<KeyLabel />
|
|
11
8
|
*/
|
|
@@ -29,7 +26,7 @@ export interface KeyProps {
|
|
|
29
26
|
/** @internal */
|
|
30
27
|
__stopNote?: (noteNumber: number) => void;
|
|
31
28
|
/** @internal */
|
|
32
|
-
__label?: (note: number) => ReactNode;
|
|
29
|
+
__label?: (note: number, index: number) => ReactNode;
|
|
33
30
|
}
|
|
34
31
|
export interface KeyMethods {
|
|
35
32
|
play: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"key.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/key.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"key.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/key.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE9D,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,CAAA;IAE9B,KAAK,CAAC,EAAE,aAAa,CAAA;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAA;IAEvB,gBAAgB;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,gBAAgB;IAChB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,gBAAgB;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gBAAgB;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,gBAAgB;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gBAAgB;IAChB,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,gBAAgB;IAChB,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,gBAAgB;IAChB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;CACrD;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,MAAM,EAAE,MAAM,OAAO,CAAA;CACtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"keyboardShortcuts.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/keyboardShortcuts.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"keyboardShortcuts.d.ts","sourceRoot":"","sources":["../../../../../src/components/Piano/keyboardShortcuts.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,EAAE,CAAA;IAEd,KAAK,CAAC,EAAE;QACN,WAAW,CAAC,EAAE,OAAO,CAAA;KACtB,CAAA;CACF,CAAA;AAED,eAAO,MAAM,SAAS;;;;CAsBrB,CAAA"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, ReactNode } from 'react';
|
|
2
|
+
import { ScaleOptions } from '@tremolo-ui/functions/Slider';
|
|
3
|
+
export interface ScaleProps {
|
|
4
|
+
gap?: number | string;
|
|
5
|
+
options?: ScaleOptions;
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
}
|
|
8
|
+
type Props = ScaleProps & Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleProps>;
|
|
9
|
+
export declare function Scale({ gap, options, children, className, style, ...props }: Props): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=Scale.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Scale.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Scale.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAG3D,OAAO,EAAuB,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAKhF,MAAM,WAAW,UAAU;IACzB,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,KAAK,KAAK,GAAG,UAAU,GACrB,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,UAAU,CAAC,CAAA;AAEzD,wBAAgB,KAAK,CAAC,EACpB,GAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,KAAK,2CA6BP"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, CSSProperties } from 'react';
|
|
2
|
+
import { ScaleType } from '@tremolo-ui/functions/Slider';
|
|
3
|
+
export interface ScaleOptionProps {
|
|
4
|
+
value: number;
|
|
5
|
+
type?: ScaleType;
|
|
6
|
+
/** Display text instead of value. */
|
|
7
|
+
label?: string;
|
|
8
|
+
/** mark thickness */
|
|
9
|
+
thickness?: number | string;
|
|
10
|
+
/** mark length */
|
|
11
|
+
length?: number | string;
|
|
12
|
+
/** Gap between mark and label. */
|
|
13
|
+
gap?: number | string;
|
|
14
|
+
labelWidth?: number | string;
|
|
15
|
+
classes?: {
|
|
16
|
+
mark?: string;
|
|
17
|
+
label?: string;
|
|
18
|
+
};
|
|
19
|
+
styles?: {
|
|
20
|
+
mark?: CSSProperties;
|
|
21
|
+
label?: CSSProperties;
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
export declare function ScaleOption({ value, type, label, thickness, length, gap, labelWidth, classes, styles, className, style, ...props }: ScaleOptionProps & Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleOptionProps>): import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
//# sourceMappingURL=ScaleOption.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScaleOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/ScaleOption.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,aAAa,EAAe,MAAM,OAAO,CAAA;AAG5E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAIxD,MAAM,WAAW,gBAAgB;IAE/B,KAAK,EAAE,MAAM,CAAA;IAGb,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,qBAAqB;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,kBAAkB;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,OAAO,CAAC,EAAE;QACR,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,KAAK,CAAC,EAAE,MAAM,CAAA;KACf,CAAA;IACD,MAAM,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,aAAa,CAAA;QACpB,KAAK,CAAC,EAAE,aAAa,CAAA;KACtB,CAAA;CACF;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,IAAoB,EACpB,KAAK,EACL,SAAa,EACb,MAAiB,EACjB,GAAO,EACP,UAAU,EACV,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,gBAAgB,GACjB,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,gBAAgB,CAAC,2CAuD9D"}
|
|
@@ -1,26 +1,18 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
interface SliderThumbProps {
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
export interface SliderThumbProps {
|
|
4
3
|
size?: number | string;
|
|
5
4
|
width?: number | string;
|
|
6
5
|
height?: number | string;
|
|
7
|
-
color?: string;
|
|
8
|
-
hoverColor?: string;
|
|
9
|
-
disabledColor?: string;
|
|
10
|
-
disabledHoverColor?: string;
|
|
11
|
-
zIndex?: number;
|
|
12
6
|
className?: string;
|
|
13
|
-
style?:
|
|
7
|
+
style?: CSSProperties;
|
|
14
8
|
children?: ReactNode;
|
|
15
9
|
/** @internal */
|
|
16
|
-
|
|
17
|
-
/** @internal */
|
|
18
|
-
__css?: CSSObject;
|
|
10
|
+
__percent?: number;
|
|
19
11
|
}
|
|
20
12
|
export interface SliderThumbMethods {
|
|
21
13
|
focus: () => void;
|
|
22
14
|
blur: () => void;
|
|
23
15
|
}
|
|
16
|
+
export declare const defaultThumbSize = 22;
|
|
24
17
|
export declare const SliderThumb: import("react").ForwardRefExoticComponent<SliderThumbProps & import("react").RefAttributes<SliderThumbMethods>>;
|
|
25
|
-
export {};
|
|
26
18
|
//# sourceMappingURL=Thumb.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Thumb.tsx"],"names":[],"mappings":"
|
|
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,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,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAED,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,eAAO,MAAM,WAAW,iHAwDvB,CAAA"}
|
|
@@ -1,29 +1,18 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
interface SliderTrackProps {
|
|
1
|
+
import { CSSProperties, ReactElement } from 'react';
|
|
2
|
+
export declare const defaultLength = 140;
|
|
3
|
+
export declare const defaultThickness = 10;
|
|
4
|
+
export interface SliderTrackProps {
|
|
5
5
|
length?: number | string;
|
|
6
6
|
thickness?: number | string;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
activeHoverBg?: string;
|
|
10
|
-
inactiveHoverBg?: string;
|
|
11
|
-
disabledActiveBg?: string;
|
|
12
|
-
disabledInactiveBg?: string;
|
|
13
|
-
disabledActiveHoverBg?: string;
|
|
14
|
-
disabledInactiveHoverBg?: string;
|
|
7
|
+
active?: string;
|
|
8
|
+
inactive?: string;
|
|
15
9
|
className?: string;
|
|
16
|
-
style?:
|
|
10
|
+
style?: CSSProperties;
|
|
17
11
|
children?: ReactElement;
|
|
18
|
-
/**
|
|
12
|
+
/** @internal */
|
|
19
13
|
__thumb?: ReactElement;
|
|
20
|
-
/**
|
|
21
|
-
__direction?: Direction;
|
|
22
|
-
/** inherit */
|
|
23
|
-
__disabled?: boolean;
|
|
24
|
-
/** internal */
|
|
14
|
+
/** @internal */
|
|
25
15
|
__percent?: number;
|
|
26
16
|
}
|
|
27
|
-
export declare function SliderTrack({ length, thickness,
|
|
28
|
-
export {};
|
|
17
|
+
export declare function SliderTrack({ length, thickness, active, inactive, children, className, style, __thumb, __percent, }: SliderTrackProps): import("react/jsx-runtime").JSX.Element;
|
|
29
18
|
//# sourceMappingURL=Track.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Track.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/Track.tsx"],"names":[],"mappings":"
|
|
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,eAAO,MAAM,aAAa,MAAM,CAAA;AAChC,eAAO,MAAM,gBAAgB,KAAK,CAAA;AAElC,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,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,wBAAgB,WAAW,CAAC,EAC1B,MAAsB,EACtB,SAA4B,EAC5B,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,KAAK,EACL,OAAO,EACP,SAAS,GACV,EAAE,gBAAgB,2CA8BlB"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
interface Props {
|
|
3
|
+
min: number;
|
|
4
|
+
max: number;
|
|
5
|
+
step: number;
|
|
6
|
+
skew: number;
|
|
7
|
+
vertical: boolean;
|
|
8
|
+
reverse: boolean;
|
|
9
|
+
disabled: boolean;
|
|
10
|
+
children: ReactNode;
|
|
11
|
+
}
|
|
12
|
+
export declare function SliderValuesProvider({ min: _min, max: _max, step: _step, skew: _skew, vertical: _vertical, reverse: _reverse, disabled: _disabled, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare const useMin: () => number;
|
|
14
|
+
export declare const useMax: () => number;
|
|
15
|
+
export declare const useStep: () => number;
|
|
16
|
+
export declare const useSkew: () => number;
|
|
17
|
+
export declare const useVertical: () => boolean;
|
|
18
|
+
export declare const useReverse: () => boolean;
|
|
19
|
+
export declare const useDisabled: () => boolean;
|
|
20
|
+
export {};
|
|
21
|
+
//# sourceMappingURL=context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,SAAS,EAAE,MAAM,OAAO,CAAA;AAUtE,UAAU,KAAK;IACb,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,SAAS,CAAA;CACpB;AAED,wBAAgB,oBAAoB,CAAC,EACnC,GAAG,EAAE,IAAI,EACT,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,KAAK,EACX,IAAI,EAAE,KAAK,EACX,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,SAAS,EACnB,QAAQ,GACT,EAAE,KAAK,2CA0BP;AAED,eAAO,MAAM,MAAM,cAA+B,CAAA;AAClD,eAAO,MAAM,MAAM,cAA+B,CAAA;AAClD,eAAO,MAAM,OAAO,cAAgC,CAAA;AACpD,eAAO,MAAM,OAAO,cAAgC,CAAA;AACpD,eAAO,MAAM,WAAW,eAAoC,CAAA;AAE5D,eAAO,MAAM,UAAU,eAAmC,CAAA;AAC1D,eAAO,MAAM,WAAW,eAAoC,CAAA"}
|
|
@@ -1,31 +1,35 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { Direction, ScaleOrderList, ScaleType } from '@tremolo-ui/functions/Slider';
|
|
1
|
+
import React, { CSSProperties, ReactElement } from 'react';
|
|
3
2
|
import { InputEventOption } from '@tremolo-ui/functions';
|
|
4
|
-
import React, { ReactElement } from 'react';
|
|
5
|
-
import { ScaleOption } from './type';
|
|
6
3
|
export interface SliderProps {
|
|
7
4
|
value: number;
|
|
8
5
|
min: number;
|
|
9
6
|
max: number;
|
|
10
7
|
step?: number;
|
|
11
8
|
skew?: number;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
scaleOption?: ScaleOption;
|
|
9
|
+
vertical?: boolean;
|
|
10
|
+
reverse?: boolean;
|
|
15
11
|
bodyNoSelect?: boolean;
|
|
16
12
|
/**
|
|
17
13
|
* wheel control option
|
|
18
14
|
*/
|
|
19
|
-
wheel?: InputEventOption;
|
|
15
|
+
wheel?: InputEventOption | null;
|
|
20
16
|
/**
|
|
21
17
|
* keyboard control option
|
|
22
18
|
*/
|
|
23
|
-
keyboard?: InputEventOption;
|
|
19
|
+
keyboard?: InputEventOption | null;
|
|
20
|
+
/**
|
|
21
|
+
* Only the appearance will change.
|
|
22
|
+
* Please consider using with readonly.
|
|
23
|
+
*/
|
|
24
24
|
disabled?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Make the value unchangeable.
|
|
27
|
+
*/
|
|
25
28
|
readonly?: boolean;
|
|
26
29
|
className?: string;
|
|
27
|
-
style?:
|
|
30
|
+
style?: CSSProperties;
|
|
28
31
|
onChange?: (value: number) => void;
|
|
32
|
+
/** \<SliderThumb /> | \<SliderTrack /> */
|
|
29
33
|
children?: ReactElement | ReactElement[];
|
|
30
34
|
}
|
|
31
35
|
export interface SliderMethods {
|
|
@@ -35,8 +39,10 @@ export interface SliderMethods {
|
|
|
35
39
|
/**
|
|
36
40
|
* Customizable slider
|
|
37
41
|
*/
|
|
38
|
-
export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<SliderMethods>>;
|
|
42
|
+
export declare const Slider: React.ForwardRefExoticComponent<SliderProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof SliderProps> & React.RefAttributes<SliderMethods>>;
|
|
43
|
+
export * from './context';
|
|
39
44
|
export * from './Thumb';
|
|
40
45
|
export * from './Track';
|
|
41
|
-
export * from './
|
|
46
|
+
export * from './Scale';
|
|
47
|
+
export * from './ScaleOption';
|
|
42
48
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/index.tsx"],"names":[],"mappings":"
|
|
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,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,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAKD;;GAEG;AACH,eAAO,MAAM,MAAM,yMAyOlB,CAAA;AAED,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* @example
|
|
4
|
+
* <WheelObserver
|
|
5
|
+
* onWheel={(event) => {
|
|
6
|
+
* event.preventDefault()
|
|
7
|
+
* console.log(event.deltaY)
|
|
8
|
+
* }
|
|
9
|
+
* >
|
|
10
|
+
* <div>Wheel here</div>
|
|
11
|
+
* </WheelObserver>
|
|
12
|
+
*/
|
|
13
|
+
interface Props<T extends ElementType> {
|
|
14
|
+
/**
|
|
15
|
+
* React.ElementType
|
|
16
|
+
* @default div
|
|
17
|
+
*/
|
|
18
|
+
as?: T;
|
|
19
|
+
children?: ReactNode;
|
|
20
|
+
onWheel?: (event: WheelEvent) => void;
|
|
21
|
+
}
|
|
22
|
+
export declare function WheelObserver<T extends ElementType = 'div'>(props: Props<T> & Omit<ComponentPropsWithoutRef<T>, keyof Props<T>>): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
export {};
|
|
24
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/WheelObserver/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIxE;;;;;;;;;;GAUG;AAEH,UAAU,KAAK,CAAC,CAAC,SAAS,WAAW;IACnC;;;OAGG;IACH,EAAE,CAAC,EAAE,CAAC,CAAA;IAEN,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CACtC;AAED,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,EACzD,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,2CAkBpE"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { CSSProperties, ReactElement } from 'react';
|
|
2
|
+
export interface AreaProps {
|
|
3
|
+
width?: number | string;
|
|
4
|
+
height?: number | string;
|
|
5
|
+
bg?: string;
|
|
6
|
+
className?: string;
|
|
7
|
+
style?: CSSProperties;
|
|
8
|
+
children?: ReactElement;
|
|
9
|
+
/** inherit */
|
|
10
|
+
__thumb?: ReactElement;
|
|
11
|
+
}
|
|
12
|
+
export declare function XYPadArea({ width, height, bg, children, className, style, __thumb, }: AreaProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
//# sourceMappingURL=Area.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Area.d.ts","sourceRoot":"","sources":["../../../../../src/components/XYPad/Area.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAEnD,MAAM,WAAW,SAAS;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,YAAY,CAAA;IAEvB,cAAc;IACd,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAW,EACX,MAAY,EACZ,EAAW,EACX,QAAQ,EACR,SAAS,EACT,KAAK,EACL,OAAO,GACR,EAAE,SAAS,2CAgBX"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
export interface ThumbProps {
|
|
3
|
+
size?: number | string;
|
|
4
|
+
width?: number | string;
|
|
5
|
+
height?: number | string;
|
|
6
|
+
wrapperClassName?: string;
|
|
7
|
+
wrapperStyle?: CSSProperties;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
/** @internal */
|
|
10
|
+
__disabled?: boolean;
|
|
11
|
+
/** @internal */
|
|
12
|
+
__css?: CSSProperties;
|
|
13
|
+
}
|
|
14
|
+
export interface XYPadThumbMethods {
|
|
15
|
+
focus: () => void;
|
|
16
|
+
blur: () => void;
|
|
17
|
+
}
|
|
18
|
+
export declare const XYPadThumb: import("react").ForwardRefExoticComponent<ThumbProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof ThumbProps> & import("react").RefAttributes<XYPadThumbMethods>>;
|
|
19
|
+
//# sourceMappingURL=Thumb.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/XYPad/Thumb.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,aAAa,EAEb,SAAS,EAGV,MAAM,OAAO,CAAA;AAEd,MAAM,WAAW,UAAU;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY,CAAC,EAAE,aAAa,CAAA;IAE5B,QAAQ,CAAC,EAAE,SAAS,CAAA;IAEpB,gBAAgB;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,gBAAgB;IAChB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAKD,eAAO,MAAM,UAAU,mPAyDtB,CAAA"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React, { ReactElement } from 'react';
|
|
2
|
+
import { InputEventOption } from '@tremolo-ui/functions';
|
|
3
|
+
export interface ValueOptions {
|
|
4
|
+
value: number;
|
|
5
|
+
min: number;
|
|
6
|
+
max: number;
|
|
7
|
+
step?: number;
|
|
8
|
+
skew?: number;
|
|
9
|
+
reverse?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* wheel control option
|
|
12
|
+
*/
|
|
13
|
+
wheel?: InputEventOption | null;
|
|
14
|
+
/**
|
|
15
|
+
* keyboard control option
|
|
16
|
+
*/
|
|
17
|
+
keyboard?: InputEventOption | null;
|
|
18
|
+
}
|
|
19
|
+
export interface XYPadProps {
|
|
20
|
+
x: ValueOptions;
|
|
21
|
+
y: ValueOptions;
|
|
22
|
+
bodyNoSelect?: boolean;
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
readonly?: boolean;
|
|
25
|
+
onChange?: (valueX: number, valueY: number) => void;
|
|
26
|
+
/** \<XYPadThumb /> | \<XYPadArea /> */
|
|
27
|
+
children?: ReactElement | ReactElement[];
|
|
28
|
+
}
|
|
29
|
+
export interface XYPadMethods {
|
|
30
|
+
focus: () => void;
|
|
31
|
+
blur: () => void;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Simple XYPad
|
|
35
|
+
*/
|
|
36
|
+
export declare const XYPad: React.ForwardRefExoticComponent<XYPadProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof XYPadProps> & React.RefAttributes<XYPadMethods>>;
|
|
37
|
+
export * from './Thumb';
|
|
38
|
+
export * from './Area';
|
|
39
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/XYPad/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAGZ,YAAY,EAKb,MAAM,OAAO,CAAA;AAEd,OAAO,EAML,gBAAgB,EAEjB,MAAM,uBAAuB,CAAA;AAS9B,MAAM,WAAW,YAAY;IAE3B,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,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAC/B;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAA;CACnC;AAED,MAAM,WAAW,UAAU;IACzB,CAAC,EAAE,YAAY,CAAA;IACf,CAAC,EAAE,YAAY,CAAA;IAEf,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACnD,uCAAuC;IACvC,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAA;CACzC;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAaD;;GAEG;AACH,eAAO,MAAM,KAAK,sMA0OjB,CAAA;AAED,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA"}
|