ink 6.8.0 → 7.0.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.
Files changed (128) hide show
  1. package/build/components/AnimationContext.d.ts +9 -0
  2. package/build/components/AnimationContext.js +13 -0
  3. package/build/components/AnimationContext.js.map +1 -0
  4. package/build/components/App.d.ts +4 -1
  5. package/build/components/App.js +140 -20
  6. package/build/components/App.js.map +1 -1
  7. package/build/components/AppContext.d.ts +28 -2
  8. package/build/components/AppContext.js +2 -1
  9. package/build/components/AppContext.js.map +1 -1
  10. package/build/components/Box.d.ts +16 -3
  11. package/build/components/ErrorBoundary.d.ts +2 -2
  12. package/build/components/ErrorOverview.js +6 -6
  13. package/build/components/ErrorOverview.js.map +1 -1
  14. package/build/components/Static.js.map +1 -1
  15. package/build/components/StdinContext.d.ts +7 -1
  16. package/build/components/StdinContext.js +1 -0
  17. package/build/components/StdinContext.js.map +1 -1
  18. package/build/components/Text.d.ts +1 -1
  19. package/build/components/Text.js +1 -1
  20. package/build/components/Text.js.map +1 -1
  21. package/build/components/Transform.d.ts +1 -1
  22. package/build/devtools-window-polyfill.js +7 -4
  23. package/build/devtools-window-polyfill.js.map +1 -1
  24. package/build/devtools.js +31 -6
  25. package/build/devtools.js.map +1 -1
  26. package/build/dom.d.ts +5 -1
  27. package/build/dom.js +20 -1
  28. package/build/dom.js.map +1 -1
  29. package/build/hooks/use-animation.d.ts +49 -0
  30. package/build/hooks/use-animation.js +87 -0
  31. package/build/hooks/use-animation.js.map +1 -0
  32. package/build/hooks/use-app.d.ts +5 -2
  33. package/build/hooks/use-app.js +1 -1
  34. package/build/hooks/use-box-metrics.d.ts +59 -0
  35. package/build/hooks/use-box-metrics.js +88 -0
  36. package/build/hooks/use-box-metrics.js.map +1 -0
  37. package/build/hooks/use-cursor.d.ts +1 -1
  38. package/build/hooks/use-cursor.js +1 -1
  39. package/build/hooks/use-focus-manager.d.ts +17 -2
  40. package/build/hooks/use-focus-manager.js +2 -1
  41. package/build/hooks/use-focus-manager.js.map +1 -1
  42. package/build/hooks/use-focus.d.ts +2 -1
  43. package/build/hooks/use-focus.js +5 -4
  44. package/build/hooks/use-focus.js.map +1 -1
  45. package/build/hooks/use-input.d.ts +2 -1
  46. package/build/hooks/use-input.js +82 -80
  47. package/build/hooks/use-input.js.map +1 -1
  48. package/build/hooks/use-is-screen-reader-enabled.d.ts +2 -1
  49. package/build/hooks/use-is-screen-reader-enabled.js +2 -1
  50. package/build/hooks/use-is-screen-reader-enabled.js.map +1 -1
  51. package/build/hooks/use-paste.d.ts +35 -0
  52. package/build/hooks/use-paste.js +62 -0
  53. package/build/hooks/use-paste.js.map +1 -0
  54. package/build/hooks/use-stderr.d.ts +1 -1
  55. package/build/hooks/use-stderr.js +1 -1
  56. package/build/hooks/use-stdin.d.ts +4 -2
  57. package/build/hooks/use-stdin.js +2 -1
  58. package/build/hooks/use-stdin.js.map +1 -1
  59. package/build/hooks/use-stdout.d.ts +1 -1
  60. package/build/hooks/use-stdout.js +1 -1
  61. package/build/hooks/use-window-size.d.ts +18 -0
  62. package/build/hooks/use-window-size.js +22 -0
  63. package/build/hooks/use-window-size.js.map +1 -0
  64. package/build/index.d.ts +8 -1
  65. package/build/index.js +4 -0
  66. package/build/index.js.map +1 -1
  67. package/build/ink.d.ts +48 -3
  68. package/build/ink.js +325 -155
  69. package/build/ink.js.map +1 -1
  70. package/build/input-parser.d.ts +4 -1
  71. package/build/input-parser.js +70 -30
  72. package/build/input-parser.js.map +1 -1
  73. package/build/log-update.d.ts +1 -0
  74. package/build/log-update.js +13 -1
  75. package/build/log-update.js.map +1 -1
  76. package/build/measure-element.d.ts +4 -0
  77. package/build/measure-element.js +4 -0
  78. package/build/measure-element.js.map +1 -1
  79. package/build/output.js +25 -0
  80. package/build/output.js.map +1 -1
  81. package/build/parse-keypress.d.ts +1 -3
  82. package/build/parse-keypress.js +19 -17
  83. package/build/parse-keypress.js.map +1 -1
  84. package/build/reconciler.js +46 -27
  85. package/build/reconciler.js.map +1 -1
  86. package/build/render-border.js +29 -18
  87. package/build/render-border.js.map +1 -1
  88. package/build/render-to-string.js +2 -1
  89. package/build/render-to-string.js.map +1 -1
  90. package/build/render.d.ts +57 -2
  91. package/build/render.js +18 -11
  92. package/build/render.js.map +1 -1
  93. package/build/styles.d.ts +78 -16
  94. package/build/styles.js +102 -31
  95. package/build/styles.js.map +1 -1
  96. package/build/utils.d.ts +9 -2
  97. package/build/utils.js +18 -3
  98. package/build/utils.js.map +1 -1
  99. package/build/wrap-text.js +7 -0
  100. package/build/wrap-text.js.map +1 -1
  101. package/build/write-synchronized.d.ts +1 -1
  102. package/build/write-synchronized.js +4 -2
  103. package/build/write-synchronized.js.map +1 -1
  104. package/package.json +34 -98
  105. package/readme.md +554 -48
  106. package/build/apply-styles.js +0 -175
  107. package/build/build-layout.js +0 -77
  108. package/build/calculate-wrapped-text.js +0 -53
  109. package/build/components/Color.js +0 -62
  110. package/build/components/Cursor.d.ts +0 -83
  111. package/build/components/Cursor.js +0 -53
  112. package/build/components/Cursor.js.map +0 -1
  113. package/build/experimental/apply-style.js +0 -140
  114. package/build/experimental/dom.js +0 -123
  115. package/build/experimental/output.js +0 -91
  116. package/build/experimental/reconciler.js +0 -141
  117. package/build/experimental/renderer.js +0 -81
  118. package/build/hooks/useInput.js +0 -38
  119. package/build/instance.js +0 -205
  120. package/build/layout.d.ts +0 -7
  121. package/build/layout.js +0 -33
  122. package/build/layout.js.map +0 -1
  123. package/build/options.d.ts +0 -52
  124. package/build/options.js +0 -2
  125. package/build/options.js.map +0 -1
  126. package/build/screen-reader-update.d.ts +0 -13
  127. package/build/screen-reader-update.js +0 -38
  128. package/build/screen-reader-update.js.map +0 -1
@@ -1,175 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _yogaLayoutPrebuilt = _interopRequireDefault(require("yoga-layout-prebuilt"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
- const applyMarginStyles = (node, style) => {
13
- if (style.margin) {
14
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_TOP, style.margin);
15
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.margin);
16
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_START, style.margin);
17
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_END, style.margin);
18
- }
19
-
20
- if (style.marginX) {
21
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_START, style.marginX);
22
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_END, style.marginX);
23
- }
24
-
25
- if (style.marginY) {
26
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_TOP, style.marginY);
27
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.marginY);
28
- }
29
-
30
- if (style.marginTop) {
31
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_TOP, style.marginTop);
32
- }
33
-
34
- if (style.marginBottom) {
35
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.marginBottom);
36
- }
37
-
38
- if (style.marginLeft) {
39
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_START, style.marginLeft);
40
- }
41
-
42
- if (style.marginRight) {
43
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_END, style.marginRight);
44
- }
45
- };
46
-
47
- const applyPaddingStyles = (node, style) => {
48
- if (style.padding) {
49
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_TOP, style.padding);
50
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.padding);
51
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_LEFT, style.padding);
52
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_RIGHT, style.padding);
53
- }
54
-
55
- if (style.paddingX) {
56
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_LEFT, style.paddingX);
57
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_RIGHT, style.paddingX);
58
- }
59
-
60
- if (style.paddingY) {
61
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_TOP, style.paddingY);
62
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.paddingY);
63
- }
64
-
65
- if (style.paddingTop) {
66
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_TOP, style.paddingTop);
67
- }
68
-
69
- if (style.paddingBottom) {
70
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.paddingBottom);
71
- }
72
-
73
- if (style.paddingLeft) {
74
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_LEFT, style.paddingLeft);
75
- }
76
-
77
- if (style.paddingRight) {
78
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_RIGHT, style.paddingRight);
79
- }
80
- };
81
-
82
- const applyFlexStyles = (node, style) => {
83
- if (style.flexGrow) {
84
- node.setFlexGrow(style.flexGrow);
85
- }
86
-
87
- if (style.flexShrink) {
88
- node.setFlexShrink(style.flexShrink);
89
- }
90
-
91
- if (style.flexDirection) {
92
- if (style.flexDirection === 'row') {
93
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_ROW);
94
- }
95
-
96
- if (style.flexDirection === 'row-reverse') {
97
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_ROW_REVERSE);
98
- }
99
-
100
- if (style.flexDirection === 'column') {
101
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_COLUMN);
102
- }
103
-
104
- if (style.flexDirection === 'column-reverse') {
105
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_COLUMN_REVERSE);
106
- }
107
- }
108
-
109
- if (style.flexBasis !== undefined) {
110
- node.setFlexBasis(style.flexBasis);
111
- }
112
-
113
- if (style.alignItems) {
114
- if (style.alignItems === 'flex-start') {
115
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_FLEX_START);
116
- }
117
-
118
- if (style.alignItems === 'center') {
119
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_CENTER);
120
- }
121
-
122
- if (style.alignItems === 'flex-end') {
123
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_FLEX_END);
124
- }
125
- }
126
-
127
- if (style.justifyContent) {
128
- if (style.justifyContent === 'flex-start') {
129
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_FLEX_START);
130
- }
131
-
132
- if (style.justifyContent === 'center') {
133
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_CENTER);
134
- }
135
-
136
- if (style.justifyContent === 'flex-end') {
137
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_FLEX_END);
138
- }
139
-
140
- if (style.justifyContent === 'space-between') {
141
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_SPACE_BETWEEN);
142
- }
143
-
144
- if (style.justifyContent === 'space-around') {
145
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_SPACE_AROUND);
146
- }
147
- }
148
- };
149
-
150
- const applyDimensionStyles = (node, style) => {
151
- if (style.width !== undefined) {
152
- node.setWidth(style.width);
153
- }
154
-
155
- if (style.height !== undefined) {
156
- node.setHeight(style.height);
157
- }
158
-
159
- if (style.minWidth !== undefined) {
160
- node.setMinWidth(style.minWidth);
161
- }
162
-
163
- if (style.minHeight !== undefined) {
164
- node.setMinHeight(style.minHeight);
165
- }
166
- };
167
-
168
- var _default = (node, style = {}) => {
169
- applyMarginStyles(node, style);
170
- applyPaddingStyles(node, style);
171
- applyFlexStyles(node, style);
172
- applyDimensionStyles(node, style);
173
- };
174
-
175
- exports.default = _default;
@@ -1,77 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _yogaLayoutPrebuilt = _interopRequireDefault(require("yoga-layout-prebuilt"));
9
-
10
- var _applyStyles = _interopRequireDefault(require("./apply-styles"));
11
-
12
- var _measureText = _interopRequireDefault(require("./measure-text"));
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- // Traverse the node tree, create Yoga nodes and assign styles to each Yoga node
17
- const buildLayout = (node, options) => {
18
- const {
19
- config,
20
- terminalWidth,
21
- skipStaticElements
22
- } = options;
23
-
24
- const yogaNode = _yogaLayoutPrebuilt.default.Node.create(config);
25
-
26
- node.yogaNode = yogaNode;
27
- const style = node.style || {}; // Root node of the tree
28
-
29
- if (node.nodeName === 'ROOT') {
30
- // `terminalWidth` can be `undefined` if env isn't a TTY
31
- yogaNode.setWidth(terminalWidth || 100);
32
-
33
- if (node.childNodes.length > 0) {
34
- const childNodes = node.childNodes.filter(childNode => {
35
- return skipStaticElements ? !childNode.unstable__static : true;
36
- });
37
-
38
- for (const [index, childNode] of Object.entries(childNodes)) {
39
- const childYogaNode = buildLayout(childNode, options).yogaNode;
40
- yogaNode.insertChild(childYogaNode, index);
41
- }
42
- }
43
-
44
- return node;
45
- } // Apply margin, padding, flex, etc styles
46
-
47
-
48
- (0, _applyStyles.default)(yogaNode, style); // Nodes with only text have a child Yoga node dedicated for that text
49
-
50
- if (node.textContent || node.nodeValue) {
51
- const {
52
- width,
53
- height
54
- } = (0, _measureText.default)(node.textContent || node.nodeValue);
55
- yogaNode.setWidth(style.width || width);
56
- yogaNode.setHeight(style.height || height);
57
- return node;
58
- }
59
-
60
- if (Array.isArray(node.childNodes) && node.childNodes.length > 0) {
61
- const childNodes = node.childNodes.filter(childNode => {
62
- return skipStaticElements ? !childNode.unstable__static : true;
63
- });
64
-
65
- for (const [index, childNode] of Object.entries(childNodes)) {
66
- const {
67
- yogaNode: childYogaNode
68
- } = buildLayout(childNode, options);
69
- yogaNode.insertChild(childYogaNode, index);
70
- }
71
- }
72
-
73
- return node;
74
- };
75
-
76
- var _default = buildLayout;
77
- exports.default = _default;
@@ -1,53 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _measureText = _interopRequireDefault(require("./measure-text"));
9
-
10
- var _wrapText = _interopRequireDefault(require("./wrap-text"));
11
-
12
- var _getMaxWidth = _interopRequireDefault(require("./get-max-width"));
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- // Since we need to know the width of text container to wrap text, we have to calculate layout twice
17
- // This function is executed after first layout calculation to reassign width and height of text nodes
18
- const calculateWrappedText = node => {
19
- if (node.textContent && typeof node.parentNode.style.textWrap === 'string') {
20
- const {
21
- yogaNode
22
- } = node;
23
- const parentYogaNode = node.parentNode.yogaNode;
24
- const maxWidth = (0, _getMaxWidth.default)(parentYogaNode);
25
- const currentWidth = yogaNode.getComputedWidth();
26
-
27
- if (currentWidth > maxWidth) {
28
- const {
29
- textWrap
30
- } = node.parentNode.style;
31
- const wrappedText = (0, _wrapText.default)(node.textContent, maxWidth, {
32
- textWrap
33
- });
34
- const {
35
- width,
36
- height
37
- } = (0, _measureText.default)(wrappedText);
38
- yogaNode.setWidth(width);
39
- yogaNode.setHeight(height);
40
- }
41
-
42
- return;
43
- }
44
-
45
- if (Array.isArray(node.childNodes) && node.childNodes.length > 0) {
46
- for (const childNode of node.childNodes) {
47
- calculateWrappedText(childNode);
48
- }
49
- }
50
- };
51
-
52
- var _default = calculateWrappedText;
53
- exports.default = _default;
@@ -1,62 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
- var _arrify = _interopRequireDefault(require("arrify"));
13
-
14
- var _chalk = _interopRequireDefault(require("chalk"));
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
19
-
20
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
21
-
22
- const methods = ['hex', 'hsl', 'hsv', 'hwb', 'rgb', 'keyword', 'bgHex', 'bgHsl', 'bgHsv', 'bgHwb', 'bgRgb', 'bgKeyword'];
23
-
24
- const Color = (_ref) => {
25
- let {
26
- children
27
- } = _ref,
28
- colorProps = _objectWithoutProperties(_ref, ["children"]);
29
-
30
- if (children === '') {
31
- return null;
32
- }
33
-
34
- const transformChildren = children => {
35
- Object.keys(colorProps).forEach(method => {
36
- if (colorProps[method]) {
37
- if (methods.includes(method)) {
38
- children = _chalk.default[method](...(0, _arrify.default)(colorProps[method]))(children);
39
- } else if (typeof _chalk.default[method] === 'function') {
40
- children = _chalk.default[method](children);
41
- }
42
- }
43
- });
44
- return children;
45
- };
46
-
47
- return _react.default.createElement("span", {
48
- style: {
49
- flexDirection: 'row'
50
- },
51
- unstable__transformChildren: transformChildren
52
- }, children);
53
- };
54
-
55
- Color.propTypes = {
56
- children: _propTypes.default.node
57
- };
58
- Color.defaultProps = {
59
- children: ''
60
- };
61
- var _default = Color;
62
- exports.default = _default;
@@ -1,83 +0,0 @@
1
- import React, { type RefObject } from 'react';
2
- import { type DOMElement, type CursorAnchorMode } from '../dom.js';
3
- export type Props = {
4
- /**
5
- Optional reference to anchor cursor coordinates to a different element.
6
-
7
- By default, `anchorRef` uses `anchor="textEnd"` behavior to follow the rendered end of that element's text, including wrapping and wide characters.
8
-
9
- Use this for inputs where the cursor should stay at the visible end of text.
10
-
11
- If `anchorRef` is set but currently unresolved, Ink hides the cursor for that frame unless `anchor="flow"` is used.
12
-
13
- If multiple `<Cursor>` components are rendered in one frame, the last rendered one controls terminal cursor position.
14
- */
15
- readonly anchorRef?: RefObject<DOMElement | null>;
16
- /**
17
- Anchor mode used to resolve cursor coordinates.
18
-
19
- - `'flow'`: Anchor to `<Cursor />` position in layout flow.
20
- Use this when you place `<Cursor />` exactly where it should appear.
21
-
22
- - `'origin'`: Anchor to content origin (top-left) of `anchorRef` or parent when no `anchorRef` is provided.
23
- Use this for manual `x/y` positioning.
24
-
25
- - `'textEnd'`: Anchor to rendered end of text for `anchorRef` or parent when no `anchorRef` is provided.
26
- Use this when cursor should follow wrapped text.
27
-
28
- Defaults to `'flow'` when `anchorRef` is omitted and `'textEnd'` when `anchorRef` is provided.
29
-
30
- `'flow'` is the default without `anchorRef` to avoid coupling cursor position to surrounding sibling text changes.
31
- */
32
- readonly anchor?: CursorAnchorMode;
33
- /**
34
- Horizontal offset from resolved anchor position.
35
- */
36
- readonly x?: number;
37
- /**
38
- Vertical offset from resolved anchor position.
39
- */
40
- readonly y?: number;
41
- };
42
- /**
43
- Declaratively position the terminal cursor relative to a container.
44
-
45
- Use this component when building reusable inputs where absolute root coordinates are inconvenient.
46
-
47
- `<Cursor>` must not be rendered inside `<Text>`.
48
-
49
- @example
50
- ```jsx
51
- import {Box, Cursor, Text} from 'ink';
52
- import {useRef} from 'react';
53
-
54
- const prompt = '> ';
55
- const value = 'hello';
56
-
57
- const Example = () => {
58
- return (
59
- <Box flexDirection="row">
60
- <Text>{prompt}</Text>
61
- <Text>{value}</Text>
62
- <Cursor />
63
- </Box>
64
- );
65
- };
66
- ```
67
-
68
- ```jsx
69
- const ExampleWithAnchor = () => {
70
- const lineReference = useRef();
71
-
72
- return (
73
- <Box flexDirection="column">
74
- <Box ref={lineReference}>
75
- <Text>{`${prompt}${value}`}</Text>
76
- </Box>
77
- <Cursor anchorRef={lineReference} />
78
- </Box>
79
- );
80
- };
81
- ```
82
- */
83
- export default function Cursor({ anchorRef, anchor, x, y }: Props): React.JSX.Element;
@@ -1,53 +0,0 @@
1
- import React from 'react';
2
- /**
3
- Declaratively position the terminal cursor relative to a container.
4
-
5
- Use this component when building reusable inputs where absolute root coordinates are inconvenient.
6
-
7
- `<Cursor>` must not be rendered inside `<Text>`.
8
-
9
- @example
10
- ```jsx
11
- import {Box, Cursor, Text} from 'ink';
12
- import {useRef} from 'react';
13
-
14
- const prompt = '> ';
15
- const value = 'hello';
16
-
17
- const Example = () => {
18
- return (
19
- <Box flexDirection="row">
20
- <Text>{prompt}</Text>
21
- <Text>{value}</Text>
22
- <Cursor />
23
- </Box>
24
- );
25
- };
26
- ```
27
-
28
- ```jsx
29
- const ExampleWithAnchor = () => {
30
- const lineReference = useRef();
31
-
32
- return (
33
- <Box flexDirection="column">
34
- <Box ref={lineReference}>
35
- <Text>{`${prompt}${value}`}</Text>
36
- </Box>
37
- <Cursor anchorRef={lineReference} />
38
- </Box>
39
- );
40
- };
41
- ```
42
- */
43
- export default function Cursor({ anchorRef, anchor, x = 0, y = 0 }) {
44
- const normalizedAnchorReference = anchorRef ?? undefined;
45
- const normalizedAnchor = anchor ?? (normalizedAnchorReference ? 'textEnd' : 'flow');
46
- return (React.createElement("ink-cursor", { internal_cursor: {
47
- anchorRef: normalizedAnchorReference,
48
- anchor: normalizedAnchor,
49
- x,
50
- y,
51
- } }));
52
- }
53
- //# sourceMappingURL=Cursor.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Cursor.js","sourceRoot":"","sources":["../../src/components/Cursor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuB,MAAM,OAAO,CAAC;AAmD5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwCE;AACF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAC,SAAS,EAAE,MAAM,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAQ;IACtE,MAAM,yBAAyB,GAC9B,SAAS,IAAI,SAAS,CAAC;IACxB,MAAM,gBAAgB,GACrB,MAAM,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAE5D,OAAO,CACN,oCACC,eAAe,EAAE;YAChB,SAAS,EAAE,yBAAyB;YACpC,MAAM,EAAE,gBAAgB;YACxB,CAAC;YACD,CAAC;SACD,GACA,CACF,CAAC;AACH,CAAC"}
@@ -1,140 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _yogaLayoutPrebuilt = _interopRequireDefault(require("yoga-layout-prebuilt"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
- const applyPositionStyles = (node, style) => {
13
- if (!style.position) {
14
- node.setPositionType(NaN);
15
- }
16
-
17
- if (style.position === 'absolute') {
18
- node.setPositionType(_yogaLayoutPrebuilt.default.POSITION_TYPE_ABSOLUTE);
19
- }
20
- };
21
-
22
- const applyMarginStyles = (node, style) => {
23
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_START, style.marginLeft || style.marginX || style.margin || 0);
24
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_END, style.marginRight || style.marginX || style.margin || 0);
25
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_TOP, style.marginTop || style.marginY || style.margin || 0);
26
- node.setMargin(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.marginBottom || style.marginY || style.margin || 0);
27
- };
28
-
29
- const applyPaddingStyles = (node, style) => {
30
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_LEFT, style.paddingLeft || style.paddingX || style.padding || 0);
31
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_RIGHT, style.paddingRight || style.paddingX || style.padding || 0);
32
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_TOP, style.paddingTop || style.paddingY || style.padding || 0);
33
- node.setPadding(_yogaLayoutPrebuilt.default.EDGE_BOTTOM, style.paddingBottom || style.paddingY || style.padding || 0);
34
- };
35
-
36
- const applyFlexStyles = (node, style) => {
37
- node.setFlexGrow(style.flexGrow || 0);
38
- node.setFlexShrink(typeof style.flexShrink === 'number' ? style.flexShrink : 1);
39
-
40
- if (style.flexDirection === 'row') {
41
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_ROW);
42
- }
43
-
44
- if (style.flexDirection === 'row-reverse') {
45
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_ROW_REVERSE);
46
- }
47
-
48
- if (style.flexDirection === 'column') {
49
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_COLUMN);
50
- }
51
-
52
- if (style.flexDirection === 'column-reverse') {
53
- node.setFlexDirection(_yogaLayoutPrebuilt.default.FLEX_DIRECTION_COLUMN_REVERSE);
54
- }
55
-
56
- if (typeof style.flexBasis === 'number') {
57
- node.setFlexBasis(style.flexBasis);
58
- } else if (typeof style.flexBasis === 'string') {
59
- node.setFlexBasisPercent(parseInt(style.flexBasis, 10));
60
- } else {
61
- // This should be replaced with node.setFlexBasisAuto() when new Yoga release is out
62
- node.setFlexBasis(NaN);
63
- }
64
-
65
- if (style.alignItems === 'stretch' || !style.alignItems) {
66
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_STRETCH);
67
- }
68
-
69
- if (style.alignItems === 'flex-start') {
70
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_FLEX_START);
71
- }
72
-
73
- if (style.alignItems === 'center') {
74
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_CENTER);
75
- }
76
-
77
- if (style.alignItems === 'flex-end') {
78
- node.setAlignItems(_yogaLayoutPrebuilt.default.ALIGN_FLEX_END);
79
- }
80
-
81
- if (style.justifyContent === 'flex-start' || !style.justifyContent) {
82
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_FLEX_START);
83
- }
84
-
85
- if (style.justifyContent === 'center') {
86
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_CENTER);
87
- }
88
-
89
- if (style.justifyContent === 'flex-end') {
90
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_FLEX_END);
91
- }
92
-
93
- if (style.justifyContent === 'space-between') {
94
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_SPACE_BETWEEN);
95
- }
96
-
97
- if (style.justifyContent === 'space-around') {
98
- node.setJustifyContent(_yogaLayoutPrebuilt.default.JUSTIFY_SPACE_AROUND);
99
- }
100
- };
101
-
102
- const applyDimensionStyles = (node, style) => {
103
- if (typeof style.width === 'number') {
104
- node.setWidth(style.width);
105
- } else if (typeof style.width === 'string') {
106
- node.setWidthPercent(parseInt(style.width, 10));
107
- } else {
108
- node.setWidthAuto();
109
- }
110
-
111
- if (typeof style.height === 'number') {
112
- node.setHeight(style.height);
113
- } else if (typeof style.height === 'string') {
114
- node.setHeightPercent(parseInt(style.height, 10));
115
- } else {
116
- node.setHeightAuto();
117
- }
118
-
119
- if (typeof style.minWidth === 'string') {
120
- node.setMinWidthPercent(parseInt(style.minWidth, 10));
121
- } else {
122
- node.setMinWidth(style.minWidth || 0);
123
- }
124
-
125
- if (typeof style.minHeight === 'string') {
126
- node.setMinHeightPercent(parseInt(style.minHeight, 10));
127
- } else {
128
- node.setMinHeight(style.minHeight || 0);
129
- }
130
- };
131
-
132
- var _default = (node, style = {}) => {
133
- applyPositionStyles(node, style);
134
- applyMarginStyles(node, style);
135
- applyPaddingStyles(node, style);
136
- applyFlexStyles(node, style);
137
- applyDimensionStyles(node, style);
138
- };
139
-
140
- exports.default = _default;