@tremolo-ui/react 0.4.0 → 0.6.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/compose-refs.cjs +72 -0
- package/dist/compose-refs.cjs.map +1 -0
- package/dist/compose-refs.d.cts +43 -0
- package/dist/compose-refs.d.cts.map +1 -0
- package/dist/compose-refs.d.ts +43 -0
- package/dist/compose-refs.d.ts.map +1 -0
- package/dist/compose-refs.js +70 -0
- package/dist/compose-refs.js.map +1 -0
- package/dist/index.cjs +2272 -1650
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1461 -475
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +1461 -475
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2258 -1648
- package/dist/index.js.map +1 -1
- package/package.json +32 -31
- package/src/components/AnimationCanvas/index.tsx +162 -194
- package/src/components/Knob/ActiveLine.tsx +9 -8
- package/src/components/Knob/InactiveLine.tsx +11 -14
- package/src/components/Knob/SVGRoot.tsx +10 -17
- package/src/components/Knob/Thumb.tsx +33 -11
- package/src/components/Knob/context.tsx +73 -89
- package/src/components/Knob/index.tsx +227 -105
- package/src/components/NumberInput/DecrementStepper.tsx +21 -50
- package/src/components/NumberInput/IncrementStepper.tsx +22 -50
- package/src/components/NumberInput/InputField.tsx +206 -0
- package/src/components/NumberInput/Stepper.tsx +150 -21
- package/src/components/NumberInput/StepperButton.tsx +95 -0
- package/src/components/NumberInput/context.tsx +104 -149
- package/src/components/NumberInput/index.tsx +461 -110
- package/src/components/Piano/index.tsx +413 -263
- package/src/components/Piano/keyboard-shortcuts.ts +61 -0
- package/src/components/PointsEditor/Background.tsx +19 -4
- package/src/components/PointsEditor/Container.tsx +92 -22
- package/src/components/PointsEditor/Point.tsx +293 -53
- package/src/components/PointsEditor/SelectionBox.tsx +54 -0
- package/src/components/PointsEditor/context.tsx +97 -75
- package/src/components/PointsEditor/index.tsx +497 -62
- package/src/components/Slider/Marks.tsx +84 -0
- package/src/components/Slider/MarksOption.tsx +115 -0
- package/src/components/Slider/Thumb.tsx +99 -54
- package/src/components/Slider/Track.tsx +73 -62
- package/src/components/Slider/context.tsx +40 -53
- package/src/components/Slider/index.tsx +237 -190
- package/src/components/Slider/type.ts +27 -9
- package/src/components/XYPad/Area.tsx +52 -33
- package/src/components/XYPad/Thumb.tsx +121 -60
- package/src/components/XYPad/context.tsx +49 -0
- package/src/components/XYPad/index.tsx +338 -246
- package/src/components/_util/Placement.tsx +68 -0
- package/src/components/_util/VisuallyHiddenRangeInput.tsx +24 -0
- package/src/components/_util/css-length.ts +13 -0
- package/src/{components/_util/composeRefs.tsx → compose-refs/index.tsx} +33 -5
- package/src/hooks/{useCallbackRef.ts → _internal/useCallbackRef.ts} +3 -1
- package/src/hooks/_internal/useCheckSteps.ts +170 -0
- package/src/hooks/useAnimationFrame.ts +17 -7
- package/src/hooks/useDrag.ts +39 -9
- package/src/hooks/useDragValue.ts +194 -0
- package/src/hooks/useEventListener.ts +11 -7
- package/src/hooks/useLongPress.ts +42 -8
- package/src/hooks/useMIDIAccess.ts +82 -11
- package/src/hooks/useMIDIInput.ts +45 -13
- package/src/hooks/useMIDIMessage.ts +23 -5
- package/src/hooks/useWheel.ts +29 -9
- package/src/index.ts +50 -27
- package/src/input-event.ts +32 -0
- package/dist/index.css +0 -536
- package/src/Globals.d.ts +0 -3
- package/src/components/AnimationCanvas/canvas.ts +0 -46
- package/src/components/Knob/index.css +0 -77
- package/src/components/NumberInput/InternalInput.tsx +0 -216
- package/src/components/NumberInput/index.css +0 -185
- package/src/components/NumberInput/type.ts +0 -58
- package/src/components/Piano/KeyLabel.tsx +0 -51
- package/src/components/Piano/context.tsx +0 -73
- package/src/components/Piano/index.css +0 -90
- package/src/components/Piano/key.tsx +0 -205
- package/src/components/Piano/keyboardShortcuts.ts +0 -31
- package/src/components/PointsEditor/index.css +0 -30
- package/src/components/Slider/Scale.tsx +0 -52
- package/src/components/Slider/ScaleOption.tsx +0 -103
- package/src/components/Slider/index.css +0 -112
- package/src/components/XYPad/index.css +0 -48
- package/src/components/_util/index.ts +0 -28
- package/src/components/_util/type.ts +0 -1
- package/src/hooks/useDragWithElement.ts +0 -100
- package/src/hooks/usePianoDrag.ts +0 -75
- package/src/hooks/useRefCallbackEvent.ts +0 -34
- package/src/styles/global.css +0 -19
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
let react = require("react");
|
|
3
|
+
//#region src/compose-refs/index.tsx
|
|
4
|
+
/**
|
|
5
|
+
* MIT License
|
|
6
|
+
*
|
|
7
|
+
* Copyright (c) 2022 WorkOS
|
|
8
|
+
*
|
|
9
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
10
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
11
|
+
* in the Software without restriction, including without limitation the rights
|
|
12
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
13
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
14
|
+
* furnished to do so, subject to the following conditions:
|
|
15
|
+
*
|
|
16
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
17
|
+
* copies or substantial portions of the Software.
|
|
18
|
+
*
|
|
19
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
20
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
21
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
22
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
23
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
24
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
25
|
+
* SOFTWARE.
|
|
26
|
+
*
|
|
27
|
+
*
|
|
28
|
+
* Copied from Radix UI Primitives.
|
|
29
|
+
* The source is here.
|
|
30
|
+
* https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx
|
|
31
|
+
*/
|
|
32
|
+
/**
|
|
33
|
+
* Set a given ref to a given value
|
|
34
|
+
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
35
|
+
*/
|
|
36
|
+
function setRef(ref, value) {
|
|
37
|
+
if (typeof ref === "function") return ref(value);
|
|
38
|
+
else if (ref !== null && ref !== void 0) ref.current = value;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* A utility to compose multiple refs together
|
|
42
|
+
* Accepts callback refs and RefObject(s)
|
|
43
|
+
*/
|
|
44
|
+
function composeRefs(...refs) {
|
|
45
|
+
return (node) => {
|
|
46
|
+
let hasCleanup = false;
|
|
47
|
+
const cleanups = refs.map((ref) => {
|
|
48
|
+
const cleanup = setRef(ref, node);
|
|
49
|
+
if (!hasCleanup && typeof cleanup === "function") hasCleanup = true;
|
|
50
|
+
return cleanup;
|
|
51
|
+
});
|
|
52
|
+
if (hasCleanup) return () => {
|
|
53
|
+
for (let i = 0; i < cleanups.length; i++) {
|
|
54
|
+
const cleanup = cleanups[i];
|
|
55
|
+
if (typeof cleanup === "function") cleanup();
|
|
56
|
+
else setRef(refs[i], null);
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* A custom hook that composes multiple refs
|
|
63
|
+
* Accepts callback refs and RefObject(s)
|
|
64
|
+
*/
|
|
65
|
+
function useComposedRefs(...refs) {
|
|
66
|
+
return (0, react.useCallback)(composeRefs(...refs), refs);
|
|
67
|
+
}
|
|
68
|
+
//#endregion
|
|
69
|
+
exports.composeRefs = composeRefs;
|
|
70
|
+
exports.useComposedRefs = useComposedRefs;
|
|
71
|
+
|
|
72
|
+
//# sourceMappingURL=compose-refs.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose-refs.cjs","names":["useCallback"],"sources":["../src/compose-refs/index.tsx"],"sourcesContent":["/**\n * MIT License\n *\n * Copyright (c) 2022 WorkOS\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n *\n *\n * Copied from Radix UI Primitives.\n * The source is here.\n * https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx\n */\n\nimport { useCallback } from 'react'\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n return ref(value)\n } else if (ref !== null && ref !== undefined) {\n ref.current = value\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n return (node) => {\n let hasCleanup = false\n const cleanups = refs.map((ref) => {\n const cleanup = setRef(ref, node)\n if (!hasCleanup && typeof cleanup === 'function') {\n hasCleanup = true\n }\n return cleanup\n })\n\n // React <19 will log an error to the console if a callback ref returns a\n // value. We don't use ref cleanups internally so this will only happen if a\n // user's ref callback returns a value, which we only expect if they are\n // using the cleanup functionality added in React 19.\n if (hasCleanup) {\n return () => {\n for (let i = 0; i < cleanups.length; i++) {\n const cleanup = cleanups[i]\n if (typeof cleanup === 'function') {\n cleanup()\n } else {\n setRef(refs[i], null)\n }\n }\n }\n }\n }\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n // The ref list is variadic, so neither the callback nor its dependencies can\n // be written as the literals the compiler rules expect.\n // oxlint-disable-next-line react-hooks/exhaustive-deps, react/use-memo\n return useCallback(composeRefs(...refs), refs)\n}\n\nexport { composeRefs, useComposedRefs }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,SAAS,OAAU,KAAqB,OAAU;CAChD,IAAI,OAAO,QAAQ,YACjB,OAAO,IAAI,KAAK;MACX,IAAI,QAAQ,QAAQ,QAAQ,KAAA,GACjC,IAAI,UAAU;AAElB;;;;;AAMA,SAAS,YAAe,GAAG,MAA8C;CACvE,QAAQ,SAAS;EACf,IAAI,aAAa;EACjB,MAAM,WAAW,KAAK,KAAK,QAAQ;GACjC,MAAM,UAAU,OAAO,KAAK,IAAI;GAChC,IAAI,CAAC,cAAc,OAAO,YAAY,YACpC,aAAa;GAEf,OAAO;EACT,CAAC;EAMD,IAAI,YACF,aAAa;GACX,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK;IACxC,MAAM,UAAU,SAAS;IACzB,IAAI,OAAO,YAAY,YACrB,QAAQ;SAER,OAAO,KAAK,IAAI,IAAI;GAExB;EACF;CAEJ;AACF;;;;;AAMA,SAAS,gBAAmB,GAAG,MAA8C;CAI3E,QAAA,GAAOA,MAAAA,YAAAA,CAAY,YAAY,GAAG,IAAI,GAAG,IAAI;AAC/C"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
//#region src/compose-refs/index.d.ts
|
|
2
|
+
/**
|
|
3
|
+
* MIT License
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) 2022 WorkOS
|
|
6
|
+
*
|
|
7
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
8
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
9
|
+
* in the Software without restriction, including without limitation the rights
|
|
10
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
11
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
12
|
+
* furnished to do so, subject to the following conditions:
|
|
13
|
+
*
|
|
14
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
15
|
+
* copies or substantial portions of the Software.
|
|
16
|
+
*
|
|
17
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
18
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
19
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
20
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
21
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
22
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
23
|
+
* SOFTWARE.
|
|
24
|
+
*
|
|
25
|
+
*
|
|
26
|
+
* Copied from Radix UI Primitives.
|
|
27
|
+
* The source is here.
|
|
28
|
+
* https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx
|
|
29
|
+
*/
|
|
30
|
+
type PossibleRef<T> = React.Ref<T> | undefined;
|
|
31
|
+
/**
|
|
32
|
+
* A utility to compose multiple refs together
|
|
33
|
+
* Accepts callback refs and RefObject(s)
|
|
34
|
+
*/
|
|
35
|
+
declare function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
36
|
+
/**
|
|
37
|
+
* A custom hook that composes multiple refs
|
|
38
|
+
* Accepts callback refs and RefObject(s)
|
|
39
|
+
*/
|
|
40
|
+
declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
41
|
+
//#endregion
|
|
42
|
+
export { composeRefs, useComposedRefs };
|
|
43
|
+
//# sourceMappingURL=compose-refs.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose-refs.d.cts","names":[],"sources":["../src/compose-refs/index.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BK,YAAY,KAAK,MAAM,IAAI;;;;;iBAkBvB,YAAY,MAAM,MAAM,YAAY,OAAO,MAAM,YAAY;;;;;iBAkC7D,gBAAgB,MAAM,MAAM,YAAY,OAAO,MAAM,YAAY"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
//#region src/compose-refs/index.d.ts
|
|
2
|
+
/**
|
|
3
|
+
* MIT License
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) 2022 WorkOS
|
|
6
|
+
*
|
|
7
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
8
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
9
|
+
* in the Software without restriction, including without limitation the rights
|
|
10
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
11
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
12
|
+
* furnished to do so, subject to the following conditions:
|
|
13
|
+
*
|
|
14
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
15
|
+
* copies or substantial portions of the Software.
|
|
16
|
+
*
|
|
17
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
18
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
19
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
20
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
21
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
22
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
23
|
+
* SOFTWARE.
|
|
24
|
+
*
|
|
25
|
+
*
|
|
26
|
+
* Copied from Radix UI Primitives.
|
|
27
|
+
* The source is here.
|
|
28
|
+
* https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx
|
|
29
|
+
*/
|
|
30
|
+
type PossibleRef<T> = React.Ref<T> | undefined;
|
|
31
|
+
/**
|
|
32
|
+
* A utility to compose multiple refs together
|
|
33
|
+
* Accepts callback refs and RefObject(s)
|
|
34
|
+
*/
|
|
35
|
+
declare function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
36
|
+
/**
|
|
37
|
+
* A custom hook that composes multiple refs
|
|
38
|
+
* Accepts callback refs and RefObject(s)
|
|
39
|
+
*/
|
|
40
|
+
declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
41
|
+
//#endregion
|
|
42
|
+
export { composeRefs, useComposedRefs };
|
|
43
|
+
//# sourceMappingURL=compose-refs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose-refs.d.ts","names":[],"sources":["../src/compose-refs/index.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BK,YAAY,KAAK,MAAM,IAAI;;;;;iBAkBvB,YAAY,MAAM,MAAM,YAAY,OAAO,MAAM,YAAY;;;;;iBAkC7D,gBAAgB,MAAM,MAAM,YAAY,OAAO,MAAM,YAAY"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { useCallback } from "react";
|
|
2
|
+
//#region src/compose-refs/index.tsx
|
|
3
|
+
/**
|
|
4
|
+
* MIT License
|
|
5
|
+
*
|
|
6
|
+
* Copyright (c) 2022 WorkOS
|
|
7
|
+
*
|
|
8
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
9
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
10
|
+
* in the Software without restriction, including without limitation the rights
|
|
11
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
12
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
13
|
+
* furnished to do so, subject to the following conditions:
|
|
14
|
+
*
|
|
15
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
16
|
+
* copies or substantial portions of the Software.
|
|
17
|
+
*
|
|
18
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
19
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
20
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
21
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
22
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
23
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
24
|
+
* SOFTWARE.
|
|
25
|
+
*
|
|
26
|
+
*
|
|
27
|
+
* Copied from Radix UI Primitives.
|
|
28
|
+
* The source is here.
|
|
29
|
+
* https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx
|
|
30
|
+
*/
|
|
31
|
+
/**
|
|
32
|
+
* Set a given ref to a given value
|
|
33
|
+
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
34
|
+
*/
|
|
35
|
+
function setRef(ref, value) {
|
|
36
|
+
if (typeof ref === "function") return ref(value);
|
|
37
|
+
else if (ref !== null && ref !== void 0) ref.current = value;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* A utility to compose multiple refs together
|
|
41
|
+
* Accepts callback refs and RefObject(s)
|
|
42
|
+
*/
|
|
43
|
+
function composeRefs(...refs) {
|
|
44
|
+
return (node) => {
|
|
45
|
+
let hasCleanup = false;
|
|
46
|
+
const cleanups = refs.map((ref) => {
|
|
47
|
+
const cleanup = setRef(ref, node);
|
|
48
|
+
if (!hasCleanup && typeof cleanup === "function") hasCleanup = true;
|
|
49
|
+
return cleanup;
|
|
50
|
+
});
|
|
51
|
+
if (hasCleanup) return () => {
|
|
52
|
+
for (let i = 0; i < cleanups.length; i++) {
|
|
53
|
+
const cleanup = cleanups[i];
|
|
54
|
+
if (typeof cleanup === "function") cleanup();
|
|
55
|
+
else setRef(refs[i], null);
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* A custom hook that composes multiple refs
|
|
62
|
+
* Accepts callback refs and RefObject(s)
|
|
63
|
+
*/
|
|
64
|
+
function useComposedRefs(...refs) {
|
|
65
|
+
return useCallback(composeRefs(...refs), refs);
|
|
66
|
+
}
|
|
67
|
+
//#endregion
|
|
68
|
+
export { composeRefs, useComposedRefs };
|
|
69
|
+
|
|
70
|
+
//# sourceMappingURL=compose-refs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose-refs.js","names":[],"sources":["../src/compose-refs/index.tsx"],"sourcesContent":["/**\n * MIT License\n *\n * Copyright (c) 2022 WorkOS\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n *\n *\n * Copied from Radix UI Primitives.\n * The source is here.\n * https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx\n */\n\nimport { useCallback } from 'react'\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n return ref(value)\n } else if (ref !== null && ref !== undefined) {\n ref.current = value\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n return (node) => {\n let hasCleanup = false\n const cleanups = refs.map((ref) => {\n const cleanup = setRef(ref, node)\n if (!hasCleanup && typeof cleanup === 'function') {\n hasCleanup = true\n }\n return cleanup\n })\n\n // React <19 will log an error to the console if a callback ref returns a\n // value. We don't use ref cleanups internally so this will only happen if a\n // user's ref callback returns a value, which we only expect if they are\n // using the cleanup functionality added in React 19.\n if (hasCleanup) {\n return () => {\n for (let i = 0; i < cleanups.length; i++) {\n const cleanup = cleanups[i]\n if (typeof cleanup === 'function') {\n cleanup()\n } else {\n setRef(refs[i], null)\n }\n }\n }\n }\n }\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n // The ref list is variadic, so neither the callback nor its dependencies can\n // be written as the literals the compiler rules expect.\n // oxlint-disable-next-line react-hooks/exhaustive-deps, react/use-memo\n return useCallback(composeRefs(...refs), refs)\n}\n\nexport { composeRefs, useComposedRefs }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,SAAS,OAAU,KAAqB,OAAU;CAChD,IAAI,OAAO,QAAQ,YACjB,OAAO,IAAI,KAAK;MACX,IAAI,QAAQ,QAAQ,QAAQ,KAAA,GACjC,IAAI,UAAU;AAElB;;;;;AAMA,SAAS,YAAe,GAAG,MAA8C;CACvE,QAAQ,SAAS;EACf,IAAI,aAAa;EACjB,MAAM,WAAW,KAAK,KAAK,QAAQ;GACjC,MAAM,UAAU,OAAO,KAAK,IAAI;GAChC,IAAI,CAAC,cAAc,OAAO,YAAY,YACpC,aAAa;GAEf,OAAO;EACT,CAAC;EAMD,IAAI,YACF,aAAa;GACX,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK;IACxC,MAAM,UAAU,SAAS;IACzB,IAAI,OAAO,YAAY,YACrB,QAAQ;SAER,OAAO,KAAK,IAAI,IAAI;GAExB;EACF;CAEJ;AACF;;;;;AAMA,SAAS,gBAAmB,GAAG,MAA8C;CAI3E,OAAO,YAAY,YAAY,GAAG,IAAI,GAAG,IAAI;AAC/C"}
|