ink 6.1.1 → 6.2.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/build/components/AccessibilityContext.d.ts +3 -0
- package/build/components/AccessibilityContext.js +5 -0
- package/build/components/AccessibilityContext.js.map +1 -0
- package/build/components/Box.d.ts +55 -1
- package/build/components/Box.js +12 -3
- package/build/components/Box.js.map +1 -1
- package/build/components/ErrorOverview.js +8 -3
- package/build/components/ErrorOverview.js.map +1 -1
- package/build/components/Text.d.ts +9 -1
- package/build/components/Text.js +9 -3
- package/build/components/Text.js.map +1 -1
- package/build/components/Transform.d.ts +6 -1
- package/build/components/Transform.js +7 -3
- package/build/components/Transform.js.map +1 -1
- package/build/dom.d.ts +14 -0
- package/build/dom.js +6 -0
- package/build/dom.js.map +1 -1
- package/build/hooks/use-is-screen-reader-enabled.d.ts +6 -0
- package/build/hooks/use-is-screen-reader-enabled.js +12 -0
- package/build/hooks/use-is-screen-reader-enabled.js.map +1 -0
- package/build/index.d.ts +1 -0
- package/build/index.js +1 -0
- package/build/index.js.map +1 -1
- package/build/ink.d.ts +2 -0
- package/build/ink.js +11 -4
- package/build/ink.js.map +1 -1
- package/build/render-node-to-output.d.ts +3 -0
- package/build/render-node-to-output.js +39 -0
- package/build/render-node-to-output.js.map +1 -1
- package/build/render.d.ts +7 -0
- package/build/render.js.map +1 -1
- package/build/renderer.d.ts +1 -1
- package/build/renderer.js +14 -3
- package/build/renderer.js.map +1 -1
- package/package.json +1 -1
- package/readme.md +121 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccessibilityContext.js","sourceRoot":"","sources":["../../src/components/AccessibilityContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAEpC,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC;IACjD,qBAAqB,EAAE,KAAK;CAC5B,CAAC,CAAC"}
|
|
@@ -2,7 +2,34 @@ import React from 'react';
|
|
|
2
2
|
import { type Except } from 'type-fest';
|
|
3
3
|
import { type Styles } from '../styles.js';
|
|
4
4
|
import { type DOMElement } from '../dom.js';
|
|
5
|
-
export type Props = Except<Styles, 'textWrap'
|
|
5
|
+
export type Props = Except<Styles, 'textWrap'> & {
|
|
6
|
+
/**
|
|
7
|
+
* Label for the element for screen readers.
|
|
8
|
+
*/
|
|
9
|
+
readonly 'aria-label'?: string;
|
|
10
|
+
/**
|
|
11
|
+
* Hide the element from screen readers.
|
|
12
|
+
*/
|
|
13
|
+
readonly 'aria-hidden'?: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* Role of the element.
|
|
16
|
+
*/
|
|
17
|
+
readonly 'aria-role'?: 'button' | 'checkbox' | 'combobox' | 'list' | 'listbox' | 'listitem' | 'menu' | 'menuitem' | 'option' | 'progressbar' | 'radio' | 'radiogroup' | 'tab' | 'tablist' | 'table' | 'textbox' | 'timer' | 'toolbar';
|
|
18
|
+
/**
|
|
19
|
+
* State of the element.
|
|
20
|
+
*/
|
|
21
|
+
readonly 'aria-state'?: {
|
|
22
|
+
readonly busy?: boolean;
|
|
23
|
+
readonly checked?: boolean;
|
|
24
|
+
readonly disabled?: boolean;
|
|
25
|
+
readonly expanded?: boolean;
|
|
26
|
+
readonly multiline?: boolean;
|
|
27
|
+
readonly multiselectable?: boolean;
|
|
28
|
+
readonly readonly?: boolean;
|
|
29
|
+
readonly required?: boolean;
|
|
30
|
+
readonly selected?: boolean;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
6
33
|
/**
|
|
7
34
|
* `<Box>` is an essential Ink component to build your layout. It's like `<div style="display: flex">` in the browser.
|
|
8
35
|
*/
|
|
@@ -57,6 +84,33 @@ declare const Box: React.ForwardRefExoticComponent<{
|
|
|
57
84
|
readonly overflowX?: "visible" | "hidden" | undefined;
|
|
58
85
|
readonly overflowY?: "visible" | "hidden" | undefined;
|
|
59
86
|
readonly backgroundColor?: import("type-fest").LiteralUnion<import("ansi-styles").ForegroundColorName, string> | undefined;
|
|
87
|
+
} & {
|
|
88
|
+
/**
|
|
89
|
+
* Label for the element for screen readers.
|
|
90
|
+
*/
|
|
91
|
+
readonly 'aria-label'?: string;
|
|
92
|
+
/**
|
|
93
|
+
* Hide the element from screen readers.
|
|
94
|
+
*/
|
|
95
|
+
readonly 'aria-hidden'?: boolean;
|
|
96
|
+
/**
|
|
97
|
+
* Role of the element.
|
|
98
|
+
*/
|
|
99
|
+
readonly 'aria-role'?: "button" | "checkbox" | "combobox" | "list" | "listbox" | "listitem" | "menu" | "menuitem" | "option" | "progressbar" | "radio" | "radiogroup" | "tab" | "tablist" | "table" | "textbox" | "timer" | "toolbar";
|
|
100
|
+
/**
|
|
101
|
+
* State of the element.
|
|
102
|
+
*/
|
|
103
|
+
readonly 'aria-state'?: {
|
|
104
|
+
readonly busy?: boolean;
|
|
105
|
+
readonly checked?: boolean;
|
|
106
|
+
readonly disabled?: boolean;
|
|
107
|
+
readonly expanded?: boolean;
|
|
108
|
+
readonly multiline?: boolean;
|
|
109
|
+
readonly multiselectable?: boolean;
|
|
110
|
+
readonly readonly?: boolean;
|
|
111
|
+
readonly required?: boolean;
|
|
112
|
+
readonly selected?: boolean;
|
|
113
|
+
};
|
|
60
114
|
} & {
|
|
61
115
|
children?: React.ReactNode | undefined;
|
|
62
116
|
} & React.RefAttributes<DOMElement>>;
|
package/build/components/Box.js
CHANGED
|
@@ -1,9 +1,15 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
1
|
+
import React, { forwardRef, useContext } from 'react';
|
|
2
|
+
import { accessibilityContext } from './AccessibilityContext.js';
|
|
2
3
|
import { backgroundContext } from './BackgroundContext.js';
|
|
3
4
|
/**
|
|
4
5
|
* `<Box>` is an essential Ink component to build your layout. It's like `<div style="display: flex">` in the browser.
|
|
5
6
|
*/
|
|
6
|
-
const Box = forwardRef(({ children, backgroundColor, ...style }, ref) => {
|
|
7
|
+
const Box = forwardRef(({ children, backgroundColor, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, 'aria-role': role, 'aria-state': ariaState, ...style }, ref) => {
|
|
8
|
+
const { isScreenReaderEnabled } = useContext(accessibilityContext);
|
|
9
|
+
const label = ariaLabel ? React.createElement("ink-text", null, ariaLabel) : undefined;
|
|
10
|
+
if (isScreenReaderEnabled && ariaHidden) {
|
|
11
|
+
return null;
|
|
12
|
+
}
|
|
7
13
|
const boxElement = (React.createElement("ink-box", { ref: ref, style: {
|
|
8
14
|
flexWrap: 'nowrap',
|
|
9
15
|
flexDirection: 'row',
|
|
@@ -13,7 +19,10 @@ const Box = forwardRef(({ children, backgroundColor, ...style }, ref) => {
|
|
|
13
19
|
backgroundColor,
|
|
14
20
|
overflowX: style.overflowX ?? style.overflow ?? 'visible',
|
|
15
21
|
overflowY: style.overflowY ?? style.overflow ?? 'visible',
|
|
16
|
-
}
|
|
22
|
+
}, internal_accessibility: {
|
|
23
|
+
role,
|
|
24
|
+
state: ariaState,
|
|
25
|
+
} }, isScreenReaderEnabled && label ? label : children));
|
|
17
26
|
// If this Box has a background color, provide it to children via context
|
|
18
27
|
if (backgroundColor) {
|
|
19
28
|
return (React.createElement(backgroundContext.Provider, { value: backgroundColor }, boxElement));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.js","sourceRoot":"","sources":["../../src/components/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAyB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Box.js","sourceRoot":"","sources":["../../src/components/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAE,UAAU,EAAyB,MAAM,OAAO,CAAC;AAI5E,OAAO,EAAC,oBAAoB,EAAC,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AAoDzD;;GAEG;AACH,MAAM,GAAG,GAAG,UAAU,CACrB,CACC,EACC,QAAQ,EACR,eAAe,EACf,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,UAAU,EACzB,WAAW,EAAE,IAAI,EACjB,YAAY,EAAE,SAAS,EACvB,GAAG,KAAK,EACR,EACD,GAAG,EACF,EAAE;IACH,MAAM,EAAC,qBAAqB,EAAC,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjE,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,sCAAW,SAAS,CAAY,CAAC,CAAC,CAAC,SAAS,CAAC;IACvE,IAAI,qBAAqB,IAAI,UAAU,EAAE,CAAC;QACzC,OAAO,IAAI,CAAC;IACb,CAAC;IAED,MAAM,UAAU,GAAG,CAClB,iCACC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACN,QAAQ,EAAE,QAAQ;YAClB,aAAa,EAAE,KAAK;YACpB,QAAQ,EAAE,CAAC;YACX,UAAU,EAAE,CAAC;YACb,GAAG,KAAK;YACR,eAAe;YACf,SAAS,EAAE,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,QAAQ,IAAI,SAAS;YACzD,SAAS,EAAE,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,QAAQ,IAAI,SAAS;SACzD,EACD,sBAAsB,EAAE;YACvB,IAAI;YACJ,KAAK,EAAE,SAAS;SAChB,IAEA,qBAAqB,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CACzC,CACV,CAAC;IAEF,yEAAyE;IACzE,IAAI,eAAe,EAAE,CAAC;QACrB,OAAO,CACN,oBAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,eAAe,IAChD,UAAU,CACiB,CAC7B,CAAC;IACH,CAAC;IAED,OAAO,UAAU,CAAC;AACnB,CAAC,CACD,CAAC;AAEF,GAAG,CAAC,WAAW,GAAG,KAAK,CAAC;AAExB,eAAe,GAAG,CAAC"}
|
|
@@ -47,7 +47,9 @@ export default function ErrorOverview({ error }) {
|
|
|
47
47
|
origin.column))),
|
|
48
48
|
origin && excerpt && (React.createElement(Box, { marginTop: 1, flexDirection: "column" }, excerpt.map(({ line, value }) => (React.createElement(Box, { key: line },
|
|
49
49
|
React.createElement(Box, { width: lineWidth + 1 },
|
|
50
|
-
React.createElement(Text, { dimColor: line !== origin.line, backgroundColor: line === origin.line ? 'red' : undefined, color: line === origin.line ? 'white' : undefined
|
|
50
|
+
React.createElement(Text, { dimColor: line !== origin.line, backgroundColor: line === origin.line ? 'red' : undefined, color: line === origin.line ? 'white' : undefined, "aria-label": line === origin.line
|
|
51
|
+
? `Line ${line}, error`
|
|
52
|
+
: `Line ${line}` },
|
|
51
53
|
String(line).padStart(lineWidth, ' '),
|
|
52
54
|
":")),
|
|
53
55
|
React.createElement(Text, { key: line, backgroundColor: line === origin.line ? 'red' : undefined, color: line === origin.line ? 'white' : undefined }, ' ' + value)))))),
|
|
@@ -60,12 +62,15 @@ export default function ErrorOverview({ error }) {
|
|
|
60
62
|
if (!parsedLine) {
|
|
61
63
|
return (React.createElement(Box, { key: line },
|
|
62
64
|
React.createElement(Text, { dimColor: true }, "- "),
|
|
63
|
-
React.createElement(Text, { dimColor: true, bold: true },
|
|
65
|
+
React.createElement(Text, { dimColor: true, bold: true },
|
|
66
|
+
line,
|
|
67
|
+
"\\t",
|
|
68
|
+
' ')));
|
|
64
69
|
}
|
|
65
70
|
return (React.createElement(Box, { key: line },
|
|
66
71
|
React.createElement(Text, { dimColor: true }, "- "),
|
|
67
72
|
React.createElement(Text, { dimColor: true, bold: true }, parsedLine.function),
|
|
68
|
-
React.createElement(Text, { dimColor: true, color: "gray" },
|
|
73
|
+
React.createElement(Text, { dimColor: true, color: "gray", "aria-label": `at ${cleanupPath(parsedLine.file) ?? ''} line ${parsedLine.line} column ${parsedLine.column}` },
|
|
69
74
|
' ',
|
|
70
75
|
"(",
|
|
71
76
|
cleanupPath(parsedLine.file) ?? '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ErrorOverview.js","sourceRoot":"","sources":["../../src/components/ErrorOverview.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ErrorOverview.js","sourceRoot":"","sources":["../../src/components/ErrorOverview.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,6 +3,14 @@ import { type ForegroundColorName } from 'chalk';
|
|
|
3
3
|
import { type LiteralUnion } from 'type-fest';
|
|
4
4
|
import { type Styles } from '../styles.js';
|
|
5
5
|
export type Props = {
|
|
6
|
+
/**
|
|
7
|
+
* Label for the element for screen readers.
|
|
8
|
+
*/
|
|
9
|
+
readonly 'aria-label'?: string;
|
|
10
|
+
/**
|
|
11
|
+
* Hide the element from screen readers.
|
|
12
|
+
*/
|
|
13
|
+
readonly 'aria-hidden'?: boolean;
|
|
6
14
|
/**
|
|
7
15
|
* Change text color. Ink uses chalk under the hood, so all its functionality is supported.
|
|
8
16
|
*/
|
|
@@ -46,4 +54,4 @@ export type Props = {
|
|
|
46
54
|
/**
|
|
47
55
|
* This component can display text, and change its style to make it colorful, bold, underline, italic or strikethrough.
|
|
48
56
|
*/
|
|
49
|
-
export default function Text({ color, backgroundColor, dimColor, bold, italic, underline, strikethrough, inverse, wrap, children, }: Props): React.JSX.Element | null;
|
|
57
|
+
export default function Text({ color, backgroundColor, dimColor, bold, italic, underline, strikethrough, inverse, wrap, children, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, }: Props): React.JSX.Element | null;
|
package/build/components/Text.js
CHANGED
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import chalk from 'chalk';
|
|
3
3
|
import colorize from '../colorize.js';
|
|
4
|
+
import { accessibilityContext } from './AccessibilityContext.js';
|
|
4
5
|
import { backgroundContext } from './BackgroundContext.js';
|
|
5
6
|
/**
|
|
6
7
|
* This component can display text, and change its style to make it colorful, bold, underline, italic or strikethrough.
|
|
7
8
|
*/
|
|
8
|
-
export default function Text({ color, backgroundColor, dimColor = false, bold = false, italic = false, underline = false, strikethrough = false, inverse = false, wrap = 'wrap', children, }) {
|
|
9
|
+
export default function Text({ color, backgroundColor, dimColor = false, bold = false, italic = false, underline = false, strikethrough = false, inverse = false, wrap = 'wrap', children, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden = false, }) {
|
|
10
|
+
const { isScreenReaderEnabled } = useContext(accessibilityContext);
|
|
9
11
|
const inheritedBackgroundColor = useContext(backgroundContext);
|
|
10
|
-
|
|
12
|
+
const childrenOrAriaLabel = isScreenReaderEnabled && ariaLabel ? ariaLabel : children;
|
|
13
|
+
if (childrenOrAriaLabel === undefined || childrenOrAriaLabel === null) {
|
|
11
14
|
return null;
|
|
12
15
|
}
|
|
13
16
|
const transform = (children) => {
|
|
@@ -39,6 +42,9 @@ export default function Text({ color, backgroundColor, dimColor = false, bold =
|
|
|
39
42
|
}
|
|
40
43
|
return children;
|
|
41
44
|
};
|
|
42
|
-
|
|
45
|
+
if (isScreenReaderEnabled && ariaHidden) {
|
|
46
|
+
return null;
|
|
47
|
+
}
|
|
48
|
+
return (React.createElement("ink-text", { style: { flexGrow: 0, flexShrink: 1, flexDirection: 'row', textWrap: wrap }, internal_transform: transform }, isScreenReaderEnabled && ariaLabel ? ariaLabel : children));
|
|
43
49
|
}
|
|
44
50
|
//# sourceMappingURL=Text.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/components/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAiB,MAAM,OAAO,CAAC;AACxD,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/components/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAiB,MAAM,OAAO,CAAC;AACxD,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAC,oBAAoB,EAAC,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AA+DzD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC5B,KAAK,EACL,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,SAAS,GAAG,KAAK,EACjB,aAAa,GAAG,KAAK,EACrB,OAAO,GAAG,KAAK,EACf,IAAI,GAAG,MAAM,EACb,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,UAAU,GAAG,KAAK,GAC1B;IACP,MAAM,EAAC,qBAAqB,EAAC,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjE,MAAM,wBAAwB,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC/D,MAAM,mBAAmB,GACxB,qBAAqB,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC;IAE3D,IAAI,mBAAmB,KAAK,SAAS,IAAI,mBAAmB,KAAK,IAAI,EAAE,CAAC;QACvE,OAAO,IAAI,CAAC;IACb,CAAC;IAED,MAAM,SAAS,GAAG,CAAC,QAAgB,EAAU,EAAE;QAC9C,IAAI,QAAQ,EAAE,CAAC;YACd,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAChC,CAAC;QAED,IAAI,KAAK,EAAE,CAAC;YACX,QAAQ,GAAG,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC;QACpD,CAAC;QAED,oFAAoF;QACpF,MAAM,wBAAwB,GAC7B,eAAe,IAAI,wBAAwB,CAAC;QAC7C,IAAI,wBAAwB,EAAE,CAAC;YAC9B,QAAQ,GAAG,QAAQ,CAAC,QAAQ,EAAE,wBAAwB,EAAE,YAAY,CAAC,CAAC;QACvE,CAAC;QAED,IAAI,IAAI,EAAE,CAAC;YACV,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACjC,CAAC;QAED,IAAI,MAAM,EAAE,CAAC;YACZ,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;QAED,IAAI,SAAS,EAAE,CAAC;YACf,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;QACtC,CAAC;QAED,IAAI,aAAa,EAAE,CAAC;YACnB,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC1C,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACb,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QACpC,CAAC;QAED,OAAO,QAAQ,CAAC;IACjB,CAAC,CAAC;IAEF,IAAI,qBAAqB,IAAI,UAAU,EAAE,CAAC;QACzC,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,CACN,kCACC,KAAK,EAAE,EAAC,QAAQ,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAC,EACzE,kBAAkB,EAAE,SAAS,IAE5B,qBAAqB,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAChD,CACX,CAAC;AACH,CAAC"}
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
import React, { type ReactNode } from 'react';
|
|
2
2
|
export type Props = {
|
|
3
|
+
/**
|
|
4
|
+
* Screen-reader-specific text to output.
|
|
5
|
+
* If this is set, all children will be ignored.
|
|
6
|
+
*/
|
|
7
|
+
readonly accessibilityLabel?: string;
|
|
3
8
|
/**
|
|
4
9
|
* Function which transforms children output. It accepts children and must return transformed children too.
|
|
5
10
|
*/
|
|
@@ -12,4 +17,4 @@ export type Props = {
|
|
|
12
17
|
* These use cases can't accept React nodes as input, they are expecting a string.
|
|
13
18
|
* That's what <Transform> component does, it gives you an output string of its child components and lets you transform it in any way.
|
|
14
19
|
*/
|
|
15
|
-
export default function Transform({ children, transform }: Props): React.JSX.Element | null;
|
|
20
|
+
export default function Transform({ children, transform, accessibilityLabel, }: Props): React.JSX.Element | null;
|
|
@@ -1,14 +1,18 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useContext } from 'react';
|
|
2
|
+
import { accessibilityContext } from './AccessibilityContext.js';
|
|
2
3
|
/**
|
|
3
4
|
* Transform a string representation of React components before they are written to output.
|
|
4
5
|
* For example, you might want to apply a gradient to text, add a clickable link or create some text effects.
|
|
5
6
|
* These use cases can't accept React nodes as input, they are expecting a string.
|
|
6
7
|
* That's what <Transform> component does, it gives you an output string of its child components and lets you transform it in any way.
|
|
7
8
|
*/
|
|
8
|
-
export default function Transform({ children, transform }) {
|
|
9
|
+
export default function Transform({ children, transform, accessibilityLabel, }) {
|
|
10
|
+
const { isScreenReaderEnabled } = useContext(accessibilityContext);
|
|
9
11
|
if (children === undefined || children === null) {
|
|
10
12
|
return null;
|
|
11
13
|
}
|
|
12
|
-
return (React.createElement("ink-text", { style: { flexGrow: 0, flexShrink: 1, flexDirection: 'row' }, internal_transform: transform },
|
|
14
|
+
return (React.createElement("ink-text", { style: { flexGrow: 0, flexShrink: 1, flexDirection: 'row' }, internal_transform: transform }, isScreenReaderEnabled && accessibilityLabel
|
|
15
|
+
? accessibilityLabel
|
|
16
|
+
: children));
|
|
13
17
|
}
|
|
14
18
|
//# sourceMappingURL=Transform.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Transform.js","sourceRoot":"","sources":["../../src/components/Transform.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Transform.js","sourceRoot":"","sources":["../../src/components/Transform.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAiB,MAAM,OAAO,CAAC;AACxD,OAAO,EAAC,oBAAoB,EAAC,MAAM,2BAA2B,CAAC;AAiB/D;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,kBAAkB,GACX;IACP,MAAM,EAAC,qBAAqB,EAAC,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEjE,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;QACjD,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,CACN,kCACC,KAAK,EAAE,EAAC,QAAQ,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,KAAK,EAAC,EACzD,kBAAkB,EAAE,SAAS,IAE5B,qBAAqB,IAAI,kBAAkB;QAC3C,CAAC,CAAC,kBAAkB;QACpB,CAAC,CAAC,QAAQ,CACD,CACX,CAAC;AACH,CAAC"}
|
package/build/dom.d.ts
CHANGED
|
@@ -15,6 +15,20 @@ export type DOMElement = {
|
|
|
15
15
|
attributes: Record<string, DOMNodeAttribute>;
|
|
16
16
|
childNodes: DOMNode[];
|
|
17
17
|
internal_transform?: OutputTransformer;
|
|
18
|
+
internal_accessibility?: {
|
|
19
|
+
role?: 'button' | 'checkbox' | 'combobox' | 'list' | 'listbox' | 'listitem' | 'menu' | 'menuitem' | 'option' | 'progressbar' | 'radio' | 'radiogroup' | 'tab' | 'tablist' | 'table' | 'textbox' | 'timer' | 'toolbar';
|
|
20
|
+
state?: {
|
|
21
|
+
busy?: boolean;
|
|
22
|
+
checked?: boolean;
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
expanded?: boolean;
|
|
25
|
+
multiline?: boolean;
|
|
26
|
+
multiselectable?: boolean;
|
|
27
|
+
readonly?: boolean;
|
|
28
|
+
required?: boolean;
|
|
29
|
+
selected?: boolean;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
18
32
|
isStaticDirty?: boolean;
|
|
19
33
|
staticNode?: DOMElement;
|
|
20
34
|
onComputeLayout?: () => void;
|
package/build/dom.js
CHANGED
|
@@ -10,6 +10,8 @@ export const createNode = (nodeName) => {
|
|
|
10
10
|
childNodes: [],
|
|
11
11
|
parentNode: undefined,
|
|
12
12
|
yogaNode: nodeName === 'ink-virtual-text' ? undefined : Yoga.Node.create(),
|
|
13
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
14
|
+
internal_accessibility: {},
|
|
13
15
|
};
|
|
14
16
|
if (nodeName === 'ink-text') {
|
|
15
17
|
node.yogaNode?.setMeasureFunc(measureTextNode.bind(null, node));
|
|
@@ -64,6 +66,10 @@ export const removeChildNode = (node, removeNode) => {
|
|
|
64
66
|
}
|
|
65
67
|
};
|
|
66
68
|
export const setAttribute = (node, key, value) => {
|
|
69
|
+
if (key === 'internal_accessibility') {
|
|
70
|
+
node.internal_accessibility = value;
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
67
73
|
node.attributes[key] = value;
|
|
68
74
|
};
|
|
69
75
|
export const setStyle = (node, style) => {
|
package/build/dom.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom.js","sourceRoot":"","sources":["../src/dom.ts"],"names":[],"mappings":"AAAA,OAAO,IAA6B,MAAM,aAAa,CAAC;AACxD,OAAO,WAAW,MAAM,mBAAmB,CAAC;AAE5C,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,OAAO,eAAe,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"dom.js","sourceRoot":"","sources":["../src/dom.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { useContext } from 'react';
|
|
2
|
+
import { accessibilityContext } from '../components/AccessibilityContext.js';
|
|
3
|
+
/**
|
|
4
|
+
* Returns whether screen reader is enabled. This is useful when you want to
|
|
5
|
+
* render a different output for screen readers.
|
|
6
|
+
*/
|
|
7
|
+
const useIsScreenReaderEnabled = () => {
|
|
8
|
+
const { isScreenReaderEnabled } = useContext(accessibilityContext);
|
|
9
|
+
return isScreenReaderEnabled;
|
|
10
|
+
};
|
|
11
|
+
export default useIsScreenReaderEnabled;
|
|
12
|
+
//# sourceMappingURL=use-is-screen-reader-enabled.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-is-screen-reader-enabled.js","sourceRoot":"","sources":["../../src/hooks/use-is-screen-reader-enabled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,OAAO,CAAC;AACjC,OAAO,EAAC,oBAAoB,EAAC,MAAM,uCAAuC,CAAC;AAE3E;;;GAGG;AACH,MAAM,wBAAwB,GAAG,GAAY,EAAE;IAC9C,MAAM,EAAC,qBAAqB,EAAC,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjE,OAAO,qBAAqB,CAAC;AAC9B,CAAC,CAAC;AAEF,eAAe,wBAAwB,CAAC"}
|
package/build/index.d.ts
CHANGED
|
@@ -23,5 +23,6 @@ export { default as useStdout } from './hooks/use-stdout.js';
|
|
|
23
23
|
export { default as useStderr } from './hooks/use-stderr.js';
|
|
24
24
|
export { default as useFocus } from './hooks/use-focus.js';
|
|
25
25
|
export { default as useFocusManager } from './hooks/use-focus-manager.js';
|
|
26
|
+
export { default as useIsScreenReaderEnabled } from './hooks/use-is-screen-reader-enabled.js';
|
|
26
27
|
export { default as measureElement } from './measure-element.js';
|
|
27
28
|
export type { DOMElement } from './dom.js';
|
package/build/index.js
CHANGED
|
@@ -12,5 +12,6 @@ export { default as useStdout } from './hooks/use-stdout.js';
|
|
|
12
12
|
export { default as useStderr } from './hooks/use-stderr.js';
|
|
13
13
|
export { default as useFocus } from './hooks/use-focus.js';
|
|
14
14
|
export { default as useFocusManager } from './hooks/use-focus-manager.js';
|
|
15
|
+
export { default as useIsScreenReaderEnabled } from './hooks/use-is-screen-reader-enabled.js';
|
|
15
16
|
export { default as measureElement } from './measure-element.js';
|
|
16
17
|
//# sourceMappingURL=index.js.map
|
package/build/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAC,OAAO,IAAI,GAAG,EAAC,MAAM,qBAAqB,CAAC;AAEnD,OAAO,EAAC,OAAO,IAAI,IAAI,EAAC,MAAM,sBAAsB,CAAC;AAMrD,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,2BAA2B,CAAC;AAE/D,OAAO,EAAC,OAAO,IAAI,OAAO,EAAC,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,eAAe,EAAC,MAAM,8BAA8B,CAAC;AACxE,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,MAAM,sBAAsB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAC,OAAO,IAAI,GAAG,EAAC,MAAM,qBAAqB,CAAC;AAEnD,OAAO,EAAC,OAAO,IAAI,IAAI,EAAC,MAAM,sBAAsB,CAAC;AAMrD,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,2BAA2B,CAAC;AAE/D,OAAO,EAAC,OAAO,IAAI,OAAO,EAAC,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,MAAM,EAAC,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAC,OAAO,IAAI,eAAe,EAAC,MAAM,8BAA8B,CAAC;AACxE,OAAO,EAAC,OAAO,IAAI,wBAAwB,EAAC,MAAM,yCAAyC,CAAC;AAC5F,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,MAAM,sBAAsB,CAAC"}
|
package/build/ink.d.ts
CHANGED
|
@@ -6,12 +6,14 @@ export type Options = {
|
|
|
6
6
|
debug: boolean;
|
|
7
7
|
exitOnCtrlC: boolean;
|
|
8
8
|
patchConsole: boolean;
|
|
9
|
+
isScreenReaderEnabled?: boolean;
|
|
9
10
|
waitUntilExit?: () => Promise<void>;
|
|
10
11
|
};
|
|
11
12
|
export default class Ink {
|
|
12
13
|
private readonly options;
|
|
13
14
|
private readonly log;
|
|
14
15
|
private readonly throttledLog;
|
|
16
|
+
private readonly isScreenReaderEnabled;
|
|
15
17
|
private isUnmounted;
|
|
16
18
|
private lastOutput;
|
|
17
19
|
private lastOutputHeight;
|
package/build/ink.js
CHANGED
|
@@ -14,11 +14,13 @@ import * as dom from './dom.js';
|
|
|
14
14
|
import logUpdate from './log-update.js';
|
|
15
15
|
import instances from './instances.js';
|
|
16
16
|
import App from './components/App.js';
|
|
17
|
+
import { accessibilityContext as AccessibilityContext } from './components/AccessibilityContext.js';
|
|
17
18
|
const noop = () => { };
|
|
18
19
|
export default class Ink {
|
|
19
20
|
options;
|
|
20
21
|
log;
|
|
21
22
|
throttledLog;
|
|
23
|
+
isScreenReaderEnabled;
|
|
22
24
|
// Ignore last render after unmounting a tree to prevent empty output before exit
|
|
23
25
|
isUnmounted;
|
|
24
26
|
lastOutput;
|
|
@@ -36,7 +38,11 @@ export default class Ink {
|
|
|
36
38
|
this.options = options;
|
|
37
39
|
this.rootNode = dom.createNode('ink-root');
|
|
38
40
|
this.rootNode.onComputeLayout = this.calculateLayout;
|
|
39
|
-
this.
|
|
41
|
+
this.isScreenReaderEnabled =
|
|
42
|
+
options.isScreenReaderEnabled ??
|
|
43
|
+
process.env['INK_SCREEN_READER'] === 'true';
|
|
44
|
+
const unthrottled = options.debug || this.isScreenReaderEnabled;
|
|
45
|
+
this.rootNode.onRender = unthrottled
|
|
40
46
|
? this.onRender
|
|
41
47
|
: throttle(this.onRender, 32, {
|
|
42
48
|
leading: true,
|
|
@@ -44,7 +50,7 @@ export default class Ink {
|
|
|
44
50
|
});
|
|
45
51
|
this.rootNode.onImmediateRender = this.onRender;
|
|
46
52
|
this.log = logUpdate.create(options.stdout);
|
|
47
|
-
this.throttledLog =
|
|
53
|
+
this.throttledLog = unthrottled
|
|
48
54
|
? this.log
|
|
49
55
|
: throttle(this.log, undefined, {
|
|
50
56
|
leading: true,
|
|
@@ -102,7 +108,7 @@ export default class Ink {
|
|
|
102
108
|
if (this.isUnmounted) {
|
|
103
109
|
return;
|
|
104
110
|
}
|
|
105
|
-
const { output, outputHeight, staticOutput } = render(this.rootNode);
|
|
111
|
+
const { output, outputHeight, staticOutput } = render(this.rootNode, this.isScreenReaderEnabled);
|
|
106
112
|
// If <Static> output isn't empty, it means new children have been added to it
|
|
107
113
|
const hasStaticOutput = staticOutput && staticOutput !== '\n';
|
|
108
114
|
if (this.options.debug) {
|
|
@@ -143,7 +149,8 @@ export default class Ink {
|
|
|
143
149
|
this.lastOutputHeight = outputHeight;
|
|
144
150
|
};
|
|
145
151
|
render(node) {
|
|
146
|
-
const tree = (React.createElement(
|
|
152
|
+
const tree = (React.createElement(AccessibilityContext.Provider, { value: { isScreenReaderEnabled: this.isScreenReaderEnabled } },
|
|
153
|
+
React.createElement(App, { stdin: this.options.stdin, stdout: this.options.stdout, stderr: this.options.stderr, writeToStdout: this.writeToStdout, writeToStderr: this.writeToStderr, exitOnCtrlC: this.options.exitOnCtrlC, onExit: this.unmount }, node)));
|
|
147
154
|
// @ts-expect-error the types for `react-reconciler` are not up to date with the library.
|
|
148
155
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
|
|
149
156
|
reconciler.updateContainerSync(tree, this.container, null, noop);
|
package/build/ink.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ink.js","sourceRoot":"","sources":["../src/ink.tsx"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,cAAc,CAAC;AACnC,OAAO,KAAuB,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,WAAW,MAAM,cAAc,CAAC;AACvC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,UAAU,MAAM,aAAa,CAAC;AACrC,OAAO,YAAY,MAAM,eAAe,CAAC;AACzC,OAAO,EAAC,UAAU,EAAC,MAAM,+BAA+B,CAAC;AAEzD,OAAO,IAAI,MAAM,aAAa,CAAC;AAC/B,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,MAAM,MAAM,eAAe,CAAC;AACnC,OAAO,KAAK,GAAG,MAAM,UAAU,CAAC;AAChC,OAAO,SAA2B,MAAM,iBAAiB,CAAC;AAC1D,OAAO,SAAS,MAAM,gBAAgB,CAAC;AACvC,OAAO,GAAG,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"ink.js","sourceRoot":"","sources":["../src/ink.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { type DOMElement } from './dom.js';
|
|
2
2
|
import type Output from './output.js';
|
|
3
3
|
export type OutputTransformer = (s: string, index: number) => string;
|
|
4
|
+
export declare const renderNodeToScreenReaderOutput: (node: DOMElement, options?: {
|
|
5
|
+
parentRole?: string;
|
|
6
|
+
}) => string;
|
|
4
7
|
declare const renderNodeToOutput: (node: DOMElement, output: Output, options: {
|
|
5
8
|
offsetX?: number;
|
|
6
9
|
offsetY?: number;
|
|
@@ -21,6 +21,45 @@ const applyPaddingToText = (node, text) => {
|
|
|
21
21
|
}
|
|
22
22
|
return text;
|
|
23
23
|
};
|
|
24
|
+
export const renderNodeToScreenReaderOutput = (node, options = {}) => {
|
|
25
|
+
if (node.yogaNode?.getDisplay() === Yoga.DISPLAY_NONE) {
|
|
26
|
+
return '';
|
|
27
|
+
}
|
|
28
|
+
let output = '';
|
|
29
|
+
if (node.nodeName === 'ink-text') {
|
|
30
|
+
output = squashTextNodes(node);
|
|
31
|
+
}
|
|
32
|
+
else if (node.nodeName === 'ink-box' || node.nodeName === 'ink-root') {
|
|
33
|
+
const separator = node.style.flexDirection === 'row' ||
|
|
34
|
+
node.style.flexDirection === 'row-reverse'
|
|
35
|
+
? ' '
|
|
36
|
+
: '\n';
|
|
37
|
+
const childNodes = node.style.flexDirection === 'row-reverse' ||
|
|
38
|
+
node.style.flexDirection === 'column-reverse'
|
|
39
|
+
? [...node.childNodes].reverse()
|
|
40
|
+
: [...node.childNodes];
|
|
41
|
+
output = childNodes
|
|
42
|
+
.map(childNode => renderNodeToScreenReaderOutput(childNode, {
|
|
43
|
+
parentRole: node.internal_accessibility?.role,
|
|
44
|
+
}))
|
|
45
|
+
.filter(Boolean)
|
|
46
|
+
.join(separator);
|
|
47
|
+
}
|
|
48
|
+
if (node.internal_accessibility) {
|
|
49
|
+
const { role, state } = node.internal_accessibility;
|
|
50
|
+
if (state) {
|
|
51
|
+
const stateKeys = Object.keys(state);
|
|
52
|
+
const stateDescription = stateKeys.filter(key => state[key]).join(', ');
|
|
53
|
+
if (stateDescription) {
|
|
54
|
+
output = `(${stateDescription}) ${output}`;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
if (role && role !== options.parentRole) {
|
|
58
|
+
output = `${role}: ${output}`;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
return output;
|
|
62
|
+
};
|
|
24
63
|
// After nodes are laid out, render each to output object, which later gets rendered to terminal
|
|
25
64
|
const renderNodeToOutput = (node, output, options) => {
|
|
26
65
|
const { offsetX = 0, offsetY = 0, transformers = [], skipStaticElements, } = options;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-node-to-output.js","sourceRoot":"","sources":["../src/render-node-to-output.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"render-node-to-output.js","sourceRoot":"","sources":["../src/render-node-to-output.ts"],"names":[],"mappings":"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"}
|
package/build/render.d.ts
CHANGED
|
@@ -36,6 +36,13 @@ export type RenderOptions = {
|
|
|
36
36
|
* @default true
|
|
37
37
|
*/
|
|
38
38
|
patchConsole?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* Enable screen reader support.
|
|
41
|
+
* See https://github.com/vadimdemedes/ink/blob/master/readme.md#screen-reader-support
|
|
42
|
+
*
|
|
43
|
+
* @default process.env['INK_SCREEN_READER'] === 'true'
|
|
44
|
+
*/
|
|
45
|
+
isScreenReaderEnabled?: boolean;
|
|
39
46
|
};
|
|
40
47
|
export type Instance = {
|
|
41
48
|
/**
|
package/build/render.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render.js","sourceRoot":"","sources":["../src/render.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,OAAO,MAAM,cAAc,CAAC;AAEnC,OAAO,GAAiC,MAAM,UAAU,CAAC;AACzD,OAAO,SAAS,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"render.js","sourceRoot":"","sources":["../src/render.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,OAAO,MAAM,cAAc,CAAC;AAEnC,OAAO,GAAiC,MAAM,UAAU,CAAC;AACzD,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAsEvC;;GAEG;AACH,MAAM,MAAM,GAAG,CACd,IAAe,EACf,OAA4C,EACjC,EAAE;IACb,MAAM,UAAU,GAAe;QAC9B,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,KAAK,EAAE,OAAO,CAAC,KAAK;QACpB,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,KAAK,EAAE,KAAK;QACZ,WAAW,EAAE,IAAI;QACjB,YAAY,EAAE,IAAI;QAClB,GAAG,UAAU,CAAC,OAAO,CAAC;KACtB,CAAC;IAEF,MAAM,QAAQ,GAAQ,WAAW,CAChC,UAAU,CAAC,MAAM,EACjB,GAAG,EAAE,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,CACzB,CAAC;IAEF,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEtB,OAAO;QACN,QAAQ,EAAE,QAAQ,CAAC,MAAM;QACzB,OAAO;YACN,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,CAAC;QACD,aAAa,EAAE,QAAQ,CAAC,aAAa;QACrC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC;QAClD,KAAK,EAAE,QAAQ,CAAC,KAAK;KACrB,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC;AAEtB,MAAM,UAAU,GAAG,CAClB,SAAyD,EAAE,EAC3C,EAAE;IAClB,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;QAC9B,OAAO;YACN,MAAM;YACN,KAAK,EAAE,OAAO,CAAC,KAAK;SACpB,CAAC;IACH,CAAC;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CACnB,MAA0B,EAC1B,cAAyB,EACnB,EAAE;IACR,IAAI,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IAErC,IAAI,CAAC,QAAQ,EAAE,CAAC;QACf,QAAQ,GAAG,cAAc,EAAE,CAAC;QAC5B,SAAS,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACjC,CAAC;IAED,OAAO,QAAQ,CAAC;AACjB,CAAC,CAAC"}
|
package/build/renderer.d.ts
CHANGED
package/build/renderer.js
CHANGED
|
@@ -1,12 +1,23 @@
|
|
|
1
|
-
import renderNodeToOutput from './render-node-to-output.js';
|
|
1
|
+
import renderNodeToOutput, { renderNodeToScreenReaderOutput, } from './render-node-to-output.js';
|
|
2
2
|
import Output from './output.js';
|
|
3
|
-
const renderer = (node) => {
|
|
3
|
+
const renderer = (node, isScreenReaderEnabled) => {
|
|
4
4
|
if (node.yogaNode) {
|
|
5
|
+
if (isScreenReaderEnabled) {
|
|
6
|
+
const output = renderNodeToScreenReaderOutput(node);
|
|
7
|
+
const outputHeight = output === '' ? 0 : output.split('\n').length;
|
|
8
|
+
return {
|
|
9
|
+
output,
|
|
10
|
+
outputHeight,
|
|
11
|
+
staticOutput: '',
|
|
12
|
+
};
|
|
13
|
+
}
|
|
5
14
|
const output = new Output({
|
|
6
15
|
width: node.yogaNode.getComputedWidth(),
|
|
7
16
|
height: node.yogaNode.getComputedHeight(),
|
|
8
17
|
});
|
|
9
|
-
renderNodeToOutput(node, output, {
|
|
18
|
+
renderNodeToOutput(node, output, {
|
|
19
|
+
skipStaticElements: true,
|
|
20
|
+
});
|
|
10
21
|
let staticOutput;
|
|
11
22
|
if (node.staticNode?.yogaNode) {
|
|
12
23
|
staticOutput = new Output({
|
package/build/renderer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderer.js","sourceRoot":"","sources":["../src/renderer.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"renderer.js","sourceRoot":"","sources":["../src/renderer.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,EAAE,EAC1B,8BAA8B,GAC9B,MAAM,4BAA4B,CAAC;AACpC,OAAO,MAAM,MAAM,aAAa,CAAC;AASjC,MAAM,QAAQ,GAAG,CAAC,IAAgB,EAAE,qBAA8B,EAAU,EAAE;IAC7E,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;QACnB,IAAI,qBAAqB,EAAE,CAAC;YAC3B,MAAM,MAAM,GAAG,8BAA8B,CAAC,IAAI,CAAC,CAAC;YACpD,MAAM,YAAY,GAAG,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC;YAEnE,OAAO;gBACN,MAAM;gBACN,YAAY;gBACZ,YAAY,EAAE,EAAE;aAChB,CAAC;QACH,CAAC;QAED,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;YACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE;YACvC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,iBAAiB,EAAE;SACzC,CAAC,CAAC;QAEH,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE;YAChC,kBAAkB,EAAE,IAAI;SACxB,CAAC,CAAC;QAEH,IAAI,YAAY,CAAC;QAEjB,IAAI,IAAI,CAAC,UAAU,EAAE,QAAQ,EAAE,CAAC;YAC/B,YAAY,GAAG,IAAI,MAAM,CAAC;gBACzB,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,EAAE;gBAClD,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,iBAAiB,EAAE;aACpD,CAAC,CAAC;YAEH,kBAAkB,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE;gBACjD,kBAAkB,EAAE,KAAK;aACzB,CAAC,CAAC;QACJ,CAAC;QAED,MAAM,EAAC,MAAM,EAAE,eAAe,EAAE,MAAM,EAAE,YAAY,EAAC,GAAG,MAAM,CAAC,GAAG,EAAE,CAAC;QAErE,OAAO;YACN,MAAM,EAAE,eAAe;YACvB,YAAY;YACZ,2EAA2E;YAC3E,8DAA8D;YAC9D,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,GAAG,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;SAClE,CAAC;IACH,CAAC;IAED,OAAO;QACN,MAAM,EAAE,EAAE;QACV,YAAY,EAAE,CAAC;QACf,YAAY,EAAE,EAAE;KAChB,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -121,6 +121,7 @@ Feel free to play around with the code and fork this repl at [https://repl.it/@v
|
|
|
121
121
|
- [Sea Trader](https://github.com/zyishai/sea-trader) - Taipan! inspired trading simulator game.
|
|
122
122
|
- [srtd](https://github.com/t1mmen/srtd) - Live-reloading SQL templates for Supabase projects.
|
|
123
123
|
- [tweakcc](https://github.com/Piebald-AI/tweakcc) - Customize your Claude Code styling.
|
|
124
|
+
- [argonaut](https://github.com/darksworm/argonaut) - Manage Argo CD resources.
|
|
124
125
|
|
|
125
126
|
## Contents
|
|
126
127
|
|
|
@@ -143,6 +144,7 @@ Feel free to play around with the code and fork this repl at [https://repl.it/@v
|
|
|
143
144
|
- [API](#api)
|
|
144
145
|
- [Testing](#testing)
|
|
145
146
|
- [Using React Devtools](#using-react-devtools)
|
|
147
|
+
- [Screen Reader Support](#screen-reader-support)
|
|
146
148
|
- [Useful Components](#useful-components)
|
|
147
149
|
- [Useful Hooks](#useful-hooks)
|
|
148
150
|
- [Examples](#examples)
|
|
@@ -1967,6 +1969,26 @@ const Example = () => {
|
|
|
1967
1969
|
};
|
|
1968
1970
|
```
|
|
1969
1971
|
|
|
1972
|
+
### useIsScreenReaderEnabled()
|
|
1973
|
+
|
|
1974
|
+
Returns whether screen reader is enabled. This is useful when you want to render a different output for screen readers.
|
|
1975
|
+
|
|
1976
|
+
```jsx
|
|
1977
|
+
import {useIsScreenReaderEnabled, Text} from 'ink';
|
|
1978
|
+
|
|
1979
|
+
const Example = () => {
|
|
1980
|
+
const isScreenReaderEnabled = useIsScreenReaderEnabled();
|
|
1981
|
+
|
|
1982
|
+
return (
|
|
1983
|
+
<Text>
|
|
1984
|
+
{isScreenReaderEnabled
|
|
1985
|
+
? 'Screen reader is enabled'
|
|
1986
|
+
: 'Screen reader is disabled'}
|
|
1987
|
+
</Text>
|
|
1988
|
+
);
|
|
1989
|
+
};
|
|
1990
|
+
```
|
|
1991
|
+
|
|
1970
1992
|
## API
|
|
1971
1993
|
|
|
1972
1994
|
#### render(tree, options?)
|
|
@@ -2152,6 +2174,105 @@ You can even inspect and change the props of components, and see the results imm
|
|
|
2152
2174
|
|
|
2153
2175
|
**Note**: You must manually quit your CLI via <kbd>Ctrl</kbd>+<kbd>C</kbd> after you're done testing.
|
|
2154
2176
|
|
|
2177
|
+
## Screen Reader Support
|
|
2178
|
+
|
|
2179
|
+
Ink has a basic support for screen readers.
|
|
2180
|
+
|
|
2181
|
+
To enable it, you can either pass the `isScreenReaderEnabled` option to the `render` function or set the `INK_SCREEN_READER` environment variable to `true`.
|
|
2182
|
+
|
|
2183
|
+
Ink implements a small subset of functionality from the [ARIA specification](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA).
|
|
2184
|
+
|
|
2185
|
+
```jsx
|
|
2186
|
+
render(<MyApp />, {isScreenReaderEnabled: true});
|
|
2187
|
+
```
|
|
2188
|
+
|
|
2189
|
+
When screen reader support is enabled, Ink will try its best to generate a screen-reader-friendly output.
|
|
2190
|
+
|
|
2191
|
+
For example, for this code:
|
|
2192
|
+
|
|
2193
|
+
```jsx
|
|
2194
|
+
<Box aria-role="checkbox" aria-state={{checked: true}}>
|
|
2195
|
+
Accept terms and conditions
|
|
2196
|
+
</Box>
|
|
2197
|
+
```
|
|
2198
|
+
|
|
2199
|
+
Ink will generate the following output for screen readers:
|
|
2200
|
+
|
|
2201
|
+
```
|
|
2202
|
+
(checked) checkbox: Accept terms and conditions
|
|
2203
|
+
```
|
|
2204
|
+
|
|
2205
|
+
You can also provide a custom label for screen readers, if you want to render something different for them.
|
|
2206
|
+
|
|
2207
|
+
For example, if you are building a progress bar, you can use `aria-label` to provide a more descriptive label for screen readers.
|
|
2208
|
+
|
|
2209
|
+
```jsx
|
|
2210
|
+
<Box>
|
|
2211
|
+
<Box width="50%" height={1} backgroundColor="green" />
|
|
2212
|
+
<Text aria-label="Progress: 50%">50%</Text>
|
|
2213
|
+
</Box>
|
|
2214
|
+
```
|
|
2215
|
+
|
|
2216
|
+
In the example above, screen reader will read "Progress: 50%", instead of "50%".
|
|
2217
|
+
|
|
2218
|
+
### `aria-label`
|
|
2219
|
+
|
|
2220
|
+
Type: `string`
|
|
2221
|
+
|
|
2222
|
+
Label for the element for screen readers.
|
|
2223
|
+
|
|
2224
|
+
### `aria-hidden`
|
|
2225
|
+
|
|
2226
|
+
Type: `boolean`\
|
|
2227
|
+
Default: `false`
|
|
2228
|
+
|
|
2229
|
+
Hide the element from screen readers.
|
|
2230
|
+
|
|
2231
|
+
##### aria-role
|
|
2232
|
+
|
|
2233
|
+
Type: `string`
|
|
2234
|
+
|
|
2235
|
+
Role of the element.
|
|
2236
|
+
|
|
2237
|
+
Supported values:
|
|
2238
|
+
- `button`
|
|
2239
|
+
- `checkbox`
|
|
2240
|
+
- `radio`
|
|
2241
|
+
- `radiogroup`
|
|
2242
|
+
- `list`
|
|
2243
|
+
- `listitem`
|
|
2244
|
+
- `menu`
|
|
2245
|
+
- `menuitem`
|
|
2246
|
+
- `progressbar`
|
|
2247
|
+
- `tab`
|
|
2248
|
+
- `tablist`
|
|
2249
|
+
- `timer`
|
|
2250
|
+
- `toolbar`
|
|
2251
|
+
- `table`
|
|
2252
|
+
|
|
2253
|
+
##### aria-state
|
|
2254
|
+
|
|
2255
|
+
Type: `object`
|
|
2256
|
+
|
|
2257
|
+
State of the element.
|
|
2258
|
+
|
|
2259
|
+
Supported values:
|
|
2260
|
+
- `checked` (boolean)
|
|
2261
|
+
- `disabled` (boolean)
|
|
2262
|
+
- `expanded` (boolean)
|
|
2263
|
+
- `selected` (boolean)
|
|
2264
|
+
|
|
2265
|
+
## Creating Components
|
|
2266
|
+
|
|
2267
|
+
When building custom components, it's important to keep accessibility in mind. While Ink provides the building blocks, ensuring your components are accessible will make your CLIs usable by a wider audience.
|
|
2268
|
+
|
|
2269
|
+
### General Principles
|
|
2270
|
+
|
|
2271
|
+
- **Provide screen reader-friendly output:** Use the `useIsScreenReaderEnabled` hook to detect if a screen reader is active. You can then render a more descriptive output for screen reader users.
|
|
2272
|
+
- **Leverage ARIA props:** For components that have a specific role (e.g., a checkbox or a button), use the `aria-role`, `aria-state`, and `aria-label` props on `<Box>` and `<Text>` to provide semantic meaning to screen readers.
|
|
2273
|
+
|
|
2274
|
+
For a practical example of building an accessible component, see the [ARIA example](/examples/aria/aria.tsx).
|
|
2275
|
+
|
|
2155
2276
|
## Useful Components
|
|
2156
2277
|
|
|
2157
2278
|
- [ink-text-input](https://github.com/vadimdemedes/ink-text-input) - Text input.
|