@fluentui/react-link 9.3.6 → 9.3.7
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/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,24 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-link
|
|
2
2
|
|
|
3
|
-
This log was last generated on Wed,
|
|
3
|
+
This log was last generated on Wed, 22 Jan 2025 13:55:28 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.3.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-link_v9.3.7)
|
|
8
|
+
|
|
9
|
+
Wed, 22 Jan 2025 13:55:28 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-link_v9.3.6..@fluentui/react-link_v9.3.7)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- fix: support Enter and Space interaction, if rendered as span ([PR #33587](https://github.com/microsoft/fluentui/pull/33587) by vgenaev@gmail.com)
|
|
15
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.50 ([PR #33631](https://github.com/microsoft/fluentui/pull/33631) by beachball)
|
|
16
|
+
- Bump @fluentui/react-tabster to v9.23.3 ([PR #33631](https://github.com/microsoft/fluentui/pull/33631) by beachball)
|
|
17
|
+
- Bump @fluentui/react-utilities to v9.18.20 ([PR #33631](https://github.com/microsoft/fluentui/pull/33631) by beachball)
|
|
18
|
+
|
|
7
19
|
## [9.3.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-link_v9.3.6)
|
|
8
20
|
|
|
9
|
-
Wed, 08 Jan 2025 18:
|
|
21
|
+
Wed, 08 Jan 2025 18:33:36 GMT
|
|
10
22
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-link_v9.3.5..@fluentui/react-link_v9.3.6)
|
|
11
23
|
|
|
12
24
|
### Patches
|
|
@@ -28,11 +28,17 @@ import { Enter, Space } from '@fluentui/keyboard-keys';
|
|
|
28
28
|
};
|
|
29
29
|
// Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.
|
|
30
30
|
state.root.onKeyDown = (ev)=>{
|
|
31
|
-
|
|
31
|
+
const keyPressed = ev.key === Enter || ev.key === Space;
|
|
32
|
+
if ((disabled || disabledFocusable) && keyPressed) {
|
|
32
33
|
ev.preventDefault();
|
|
33
34
|
ev.stopPropagation();
|
|
34
35
|
} else {
|
|
35
36
|
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(ev);
|
|
37
|
+
// if there is already onKeyDown provided - respect it
|
|
38
|
+
if (state.root.as === 'span' && !!state.root.onClick && !onKeyDown && keyPressed) {
|
|
39
|
+
ev.preventDefault();
|
|
40
|
+
ev.currentTarget.click();
|
|
41
|
+
}
|
|
36
42
|
}
|
|
37
43
|
};
|
|
38
44
|
// Set the aria-disabled and disabled props correctly.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Link/useLinkState.ts"],"sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport type { LinkState } from './Link.types';\n\n/**\n * The useLinkState_unstable hook processes the Link state.\n * @param state - Link state to mutate.\n */\nexport const useLinkState_unstable = (state: LinkState): LinkState => {\n const { disabled, disabledFocusable } = state;\n const { onClick, onKeyDown, role, tabIndex } = state.root;\n\n // Add href for anchor elements.\n if (state.root.as === 'a') {\n state.root.href = disabled ? undefined : state.root.href;\n\n // Add role=\"link\" for disabled and disabledFocusable links.\n if (disabled || disabledFocusable) {\n state.root.role = role || 'link';\n }\n }\n\n // Add tabIndex=0 for anchor and span elements.\n if (state.root.as === 'a' || state.root.as === 'span') {\n state.root.tabIndex = tabIndex ?? (disabled && !disabledFocusable ? undefined : 0);\n }\n\n // Disallow click event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onClick = (ev: React.MouseEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n if (disabled || disabledFocusable) {\n ev.preventDefault();\n } else {\n onClick?.(ev);\n }\n };\n\n // Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onKeyDown = (ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/Link/useLinkState.ts"],"sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport type { LinkState } from './Link.types';\n\n/**\n * The useLinkState_unstable hook processes the Link state.\n * @param state - Link state to mutate.\n */\nexport const useLinkState_unstable = (state: LinkState): LinkState => {\n const { disabled, disabledFocusable } = state;\n const { onClick, onKeyDown, role, tabIndex } = state.root;\n\n // Add href for anchor elements.\n if (state.root.as === 'a') {\n state.root.href = disabled ? undefined : state.root.href;\n\n // Add role=\"link\" for disabled and disabledFocusable links.\n if (disabled || disabledFocusable) {\n state.root.role = role || 'link';\n }\n }\n\n // Add tabIndex=0 for anchor and span elements.\n if (state.root.as === 'a' || state.root.as === 'span') {\n state.root.tabIndex = tabIndex ?? (disabled && !disabledFocusable ? undefined : 0);\n }\n\n // Disallow click event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onClick = (ev: React.MouseEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n if (disabled || disabledFocusable) {\n ev.preventDefault();\n } else {\n onClick?.(ev);\n }\n };\n\n // Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onKeyDown = (ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n const keyPressed = ev.key === Enter || ev.key === Space;\n\n if ((disabled || disabledFocusable) && keyPressed) {\n ev.preventDefault();\n ev.stopPropagation();\n } else {\n onKeyDown?.(ev);\n // if there is already onKeyDown provided - respect it\n if (state.root.as === 'span' && !!state.root.onClick && !onKeyDown && keyPressed) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n }\n };\n\n // Set the aria-disabled and disabled props correctly.\n state.disabled = disabled || disabledFocusable;\n state.root['aria-disabled'] = disabled || disabledFocusable || undefined;\n if (state.root.as === 'button') {\n state.root.disabled = disabled && !disabledFocusable;\n }\n\n return state;\n};\n"],"names":["React","Enter","Space","useLinkState_unstable","state","disabled","disabledFocusable","onClick","onKeyDown","role","tabIndex","root","as","href","undefined","ev","preventDefault","keyPressed","key","stopPropagation","currentTarget","click"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,EAAEC,KAAK,QAAQ,0BAA0B;AAGvD;;;CAGC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpC,MAAM,EAAEC,QAAQ,EAAEC,iBAAiB,EAAE,GAAGF;IACxC,MAAM,EAAEG,OAAO,EAAEC,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGN,MAAMO,IAAI;IAEzD,gCAAgC;IAChC,IAAIP,MAAMO,IAAI,CAACC,EAAE,KAAK,KAAK;QACzBR,MAAMO,IAAI,CAACE,IAAI,GAAGR,WAAWS,YAAYV,MAAMO,IAAI,CAACE,IAAI;QAExD,4DAA4D;QAC5D,IAAIR,YAAYC,mBAAmB;YACjCF,MAAMO,IAAI,CAACF,IAAI,GAAGA,QAAQ;QAC5B;IACF;IAEA,+CAA+C;IAC/C,IAAIL,MAAMO,IAAI,CAACC,EAAE,KAAK,OAAOR,MAAMO,IAAI,CAACC,EAAE,KAAK,QAAQ;QACrDR,MAAMO,IAAI,CAACD,QAAQ,GAAGA,qBAAAA,sBAAAA,WAAaL,YAAY,CAACC,oBAAoBQ,YAAY;IAClF;IAEA,wGAAwG;IACxGV,MAAMO,IAAI,CAACJ,OAAO,GAAG,CAACQ;QACpB,IAAIV,YAAYC,mBAAmB;YACjCS,GAAGC,cAAc;QACnB,OAAO;YACLT,oBAAAA,8BAAAA,QAAUQ;QACZ;IACF;IAEA,0GAA0G;IAC1GX,MAAMO,IAAI,CAACH,SAAS,GAAG,CAACO;QACtB,MAAME,aAAaF,GAAGG,GAAG,KAAKjB,SAASc,GAAGG,GAAG,KAAKhB;QAElD,IAAI,AAACG,CAAAA,YAAYC,iBAAgB,KAAMW,YAAY;YACjDF,GAAGC,cAAc;YACjBD,GAAGI,eAAe;QACpB,OAAO;YACLX,sBAAAA,gCAAAA,UAAYO;YACZ,sDAAsD;YACtD,IAAIX,MAAMO,IAAI,CAACC,EAAE,KAAK,UAAU,CAAC,CAACR,MAAMO,IAAI,CAACJ,OAAO,IAAI,CAACC,aAAaS,YAAY;gBAChFF,GAAGC,cAAc;gBACjBD,GAAGK,aAAa,CAACC,KAAK;YACxB;QACF;IACF;IAEA,sDAAsD;IACtDjB,MAAMC,QAAQ,GAAGA,YAAYC;IAC7BF,MAAMO,IAAI,CAAC,gBAAgB,GAAGN,YAAYC,qBAAqBQ;IAC/D,IAAIV,MAAMO,IAAI,CAACC,EAAE,KAAK,UAAU;QAC9BR,MAAMO,IAAI,CAACN,QAAQ,GAAGA,YAAY,CAACC;IACrC;IAEA,OAAOF;AACT,EAAE"}
|
|
@@ -36,11 +36,17 @@ const useLinkState_unstable = (state)=>{
|
|
|
36
36
|
};
|
|
37
37
|
// Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.
|
|
38
38
|
state.root.onKeyDown = (ev)=>{
|
|
39
|
-
|
|
39
|
+
const keyPressed = ev.key === _keyboardkeys.Enter || ev.key === _keyboardkeys.Space;
|
|
40
|
+
if ((disabled || disabledFocusable) && keyPressed) {
|
|
40
41
|
ev.preventDefault();
|
|
41
42
|
ev.stopPropagation();
|
|
42
43
|
} else {
|
|
43
44
|
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(ev);
|
|
45
|
+
// if there is already onKeyDown provided - respect it
|
|
46
|
+
if (state.root.as === 'span' && !!state.root.onClick && !onKeyDown && keyPressed) {
|
|
47
|
+
ev.preventDefault();
|
|
48
|
+
ev.currentTarget.click();
|
|
49
|
+
}
|
|
44
50
|
}
|
|
45
51
|
};
|
|
46
52
|
// Set the aria-disabled and disabled props correctly.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Link/useLinkState.ts"],"sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport type { LinkState } from './Link.types';\n\n/**\n * The useLinkState_unstable hook processes the Link state.\n * @param state - Link state to mutate.\n */\nexport const useLinkState_unstable = (state: LinkState): LinkState => {\n const { disabled, disabledFocusable } = state;\n const { onClick, onKeyDown, role, tabIndex } = state.root;\n\n // Add href for anchor elements.\n if (state.root.as === 'a') {\n state.root.href = disabled ? undefined : state.root.href;\n\n // Add role=\"link\" for disabled and disabledFocusable links.\n if (disabled || disabledFocusable) {\n state.root.role = role || 'link';\n }\n }\n\n // Add tabIndex=0 for anchor and span elements.\n if (state.root.as === 'a' || state.root.as === 'span') {\n state.root.tabIndex = tabIndex ?? (disabled && !disabledFocusable ? undefined : 0);\n }\n\n // Disallow click event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onClick = (ev: React.MouseEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n if (disabled || disabledFocusable) {\n ev.preventDefault();\n } else {\n onClick?.(ev);\n }\n };\n\n // Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onKeyDown = (ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/Link/useLinkState.ts"],"sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport type { LinkState } from './Link.types';\n\n/**\n * The useLinkState_unstable hook processes the Link state.\n * @param state - Link state to mutate.\n */\nexport const useLinkState_unstable = (state: LinkState): LinkState => {\n const { disabled, disabledFocusable } = state;\n const { onClick, onKeyDown, role, tabIndex } = state.root;\n\n // Add href for anchor elements.\n if (state.root.as === 'a') {\n state.root.href = disabled ? undefined : state.root.href;\n\n // Add role=\"link\" for disabled and disabledFocusable links.\n if (disabled || disabledFocusable) {\n state.root.role = role || 'link';\n }\n }\n\n // Add tabIndex=0 for anchor and span elements.\n if (state.root.as === 'a' || state.root.as === 'span') {\n state.root.tabIndex = tabIndex ?? (disabled && !disabledFocusable ? undefined : 0);\n }\n\n // Disallow click event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onClick = (ev: React.MouseEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n if (disabled || disabledFocusable) {\n ev.preventDefault();\n } else {\n onClick?.(ev);\n }\n };\n\n // Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.\n state.root.onKeyDown = (ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {\n const keyPressed = ev.key === Enter || ev.key === Space;\n\n if ((disabled || disabledFocusable) && keyPressed) {\n ev.preventDefault();\n ev.stopPropagation();\n } else {\n onKeyDown?.(ev);\n // if there is already onKeyDown provided - respect it\n if (state.root.as === 'span' && !!state.root.onClick && !onKeyDown && keyPressed) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n }\n };\n\n // Set the aria-disabled and disabled props correctly.\n state.disabled = disabled || disabledFocusable;\n state.root['aria-disabled'] = disabled || disabledFocusable || undefined;\n if (state.root.as === 'button') {\n state.root.disabled = disabled && !disabledFocusable;\n }\n\n return state;\n};\n"],"names":["useLinkState_unstable","state","disabled","disabledFocusable","onClick","onKeyDown","role","tabIndex","root","as","href","undefined","ev","preventDefault","keyPressed","key","Enter","Space","stopPropagation","currentTarget","click"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;8BACM;AAOtB,MAAMA,wBAAwB,CAACC;IACpC,MAAM,EAAEC,QAAQ,EAAEC,iBAAiB,EAAE,GAAGF;IACxC,MAAM,EAAEG,OAAO,EAAEC,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGN,MAAMO,IAAI;IAEzD,gCAAgC;IAChC,IAAIP,MAAMO,IAAI,CAACC,EAAE,KAAK,KAAK;QACzBR,MAAMO,IAAI,CAACE,IAAI,GAAGR,WAAWS,YAAYV,MAAMO,IAAI,CAACE,IAAI;QAExD,4DAA4D;QAC5D,IAAIR,YAAYC,mBAAmB;YACjCF,MAAMO,IAAI,CAACF,IAAI,GAAGA,QAAQ;QAC5B;IACF;IAEA,+CAA+C;IAC/C,IAAIL,MAAMO,IAAI,CAACC,EAAE,KAAK,OAAOR,MAAMO,IAAI,CAACC,EAAE,KAAK,QAAQ;QACrDR,MAAMO,IAAI,CAACD,QAAQ,GAAGA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,WAAaL,YAAY,CAACC,oBAAoBQ,YAAY;IAClF;IAEA,wGAAwG;IACxGV,MAAMO,IAAI,CAACJ,OAAO,GAAG,CAACQ;QACpB,IAAIV,YAAYC,mBAAmB;YACjCS,GAAGC,cAAc;QACnB,OAAO;YACLT,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUQ;QACZ;IACF;IAEA,0GAA0G;IAC1GX,MAAMO,IAAI,CAACH,SAAS,GAAG,CAACO;QACtB,MAAME,aAAaF,GAAGG,GAAG,KAAKC,mBAAAA,IAASJ,GAAGG,GAAG,KAAKE,mBAAAA;QAElD,IAAI,AAACf,CAAAA,YAAYC,iBAAAA,KAAsBW,YAAY;YACjDF,GAAGC,cAAc;YACjBD,GAAGM,eAAe;QACpB,OAAO;YACLb,cAAAA,QAAAA,cAAAA,KAAAA,IAAAA,KAAAA,IAAAA,UAAYO;YACZ,sDAAsD;YACtD,IAAIX,MAAMO,IAAI,CAACC,EAAE,KAAK,UAAU,CAAC,CAACR,MAAMO,IAAI,CAACJ,OAAO,IAAI,CAACC,aAAaS,YAAY;gBAChFF,GAAGC,cAAc;gBACjBD,GAAGO,aAAa,CAACC,KAAK;YACxB;QACF;IACF;IAEA,sDAAsD;IACtDnB,MAAMC,QAAQ,GAAGA,YAAYC;IAC7BF,MAAMO,IAAI,CAAC,gBAAgB,GAAGN,YAAYC,qBAAqBQ;IAC/D,IAAIV,MAAMO,IAAI,CAACC,EAAE,KAAK,UAAU;QAC9BR,MAAMO,IAAI,CAACN,QAAQ,GAAGA,YAAY,CAACC;IACrC;IAEA,OAAOF;AACT"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-link",
|
|
3
|
-
"version": "9.3.
|
|
3
|
+
"version": "9.3.7",
|
|
4
4
|
"description": "Fluent UI React Link component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -20,11 +20,11 @@
|
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
23
|
-
"@fluentui/react-jsx-runtime": "^9.0.
|
|
23
|
+
"@fluentui/react-jsx-runtime": "^9.0.50",
|
|
24
24
|
"@fluentui/react-shared-contexts": "^9.21.2",
|
|
25
|
-
"@fluentui/react-tabster": "^9.23.
|
|
25
|
+
"@fluentui/react-tabster": "^9.23.3",
|
|
26
26
|
"@fluentui/react-theme": "^9.1.24",
|
|
27
|
-
"@fluentui/react-utilities": "^9.18.
|
|
27
|
+
"@fluentui/react-utilities": "^9.18.20",
|
|
28
28
|
"@griffel/react": "^1.5.22",
|
|
29
29
|
"@swc/helpers": "^0.5.1"
|
|
30
30
|
},
|