@molecule/app-ui-react 1.3.1 → 1.3.3
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/README.md +1434 -1425
- package/dist/components/Switch.d.ts.map +1 -1
- package/dist/components/Switch.js +17 -5
- package/dist/components/Switch.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAyD,MAAM,OAAO,CAAA;AAE7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAQnD;;GAEG;AACH,eAAO,MAAM,MAAM,uFAuFlB,CAAA"}
|
|
@@ -4,8 +4,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
4
4
|
*
|
|
5
5
|
* @module
|
|
6
6
|
*/
|
|
7
|
-
import { forwardRef, useEffect, useRef } from 'react';
|
|
7
|
+
import { forwardRef, useEffect, useLayoutEffect, useRef } from 'react';
|
|
8
8
|
import { getClassMap } from '@molecule/app-ui';
|
|
9
|
+
// Layout effects run in the commit itself, so the listener below is attached
|
|
10
|
+
// before the browser can deliver a click; on the server, fall back to
|
|
11
|
+
// useEffect to avoid React's SSR useLayoutEffect warning.
|
|
12
|
+
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
|
|
9
13
|
/**
|
|
10
14
|
* Switch component.
|
|
11
15
|
*/
|
|
@@ -28,14 +32,22 @@ export const Switch = forwardRef(({ label, checked, size = 'md', color, classNam
|
|
|
28
32
|
// native label-click-forwarding firing a SECOND, redundant click on
|
|
29
33
|
// whichever one isn't the direct target.
|
|
30
34
|
const hiddenInputRef = useRef(null);
|
|
31
|
-
|
|
35
|
+
// Attached ONCE, in the commit, reading the latest `onChange` through a
|
|
36
|
+
// ref. A passive `useEffect` left a gap between the switch appearing and
|
|
37
|
+
// its listener existing: a click in that gap toggled nothing, silently
|
|
38
|
+
// (it flaked molecule-dev's auto-refill toggle test under load).
|
|
39
|
+
const onChangeRef = useRef(onChange);
|
|
40
|
+
useIsomorphicLayoutEffect(() => {
|
|
41
|
+
onChangeRef.current = onChange;
|
|
42
|
+
});
|
|
43
|
+
useIsomorphicLayoutEffect(() => {
|
|
32
44
|
const input = hiddenInputRef.current;
|
|
33
|
-
if (!input
|
|
45
|
+
if (!input)
|
|
34
46
|
return;
|
|
35
|
-
const listener = (event) =>
|
|
47
|
+
const listener = (event) => onChangeRef.current?.(event);
|
|
36
48
|
input.addEventListener('change', listener);
|
|
37
49
|
return () => input.removeEventListener('change', listener);
|
|
38
|
-
}, [
|
|
50
|
+
}, []);
|
|
39
51
|
const handleClick = () => {
|
|
40
52
|
if (!disabled) {
|
|
41
53
|
hiddenInputRef.current?.click();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":";AAAA;;;;GAIG;AAEH,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@molecule/app-ui-react",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.3",
|
|
4
4
|
"description": "React UI components for molecule.dev",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"@molecule/app-i18n": "1.0.3",
|
|
45
45
|
"@molecule/app-icons": "1.0.2",
|
|
46
|
-
"@molecule/app-react": "1.6.
|
|
46
|
+
"@molecule/app-react": "1.6.3",
|
|
47
47
|
"@testing-library/react": "16.3.2",
|
|
48
48
|
"@types/node": "26.1.2",
|
|
49
49
|
"@types/react": "19.2.17",
|