@ledgerhq/react-ui 0.33.0-nightly.0 → 0.33.0-nightly.1
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/lib/cjs/pre-ldls/components/TextInput/TextInput.js +226 -0
- package/lib/cjs/pre-ldls/components/TextInput/TextInput.js.map +7 -0
- package/lib/cjs/pre-ldls/components/TextInput/TextInput.stories.js +93 -0
- package/lib/cjs/pre-ldls/components/TextInput/TextInput.stories.js.map +7 -0
- package/lib/cjs/pre-ldls/components/index.js +1 -0
- package/lib/cjs/pre-ldls/components/index.js.map +2 -2
- package/lib/pre-ldls/components/TextInput/TextInput.d.ts +20 -0
- package/lib/pre-ldls/components/TextInput/TextInput.d.ts.map +1 -0
- package/lib/pre-ldls/components/TextInput/TextInput.js +159 -0
- package/lib/pre-ldls/components/TextInput/TextInput.js.map +1 -0
- package/lib/pre-ldls/components/index.d.ts +1 -0
- package/lib/pre-ldls/components/index.d.ts.map +1 -1
- package/lib/pre-ldls/components/index.js +1 -0
- package/lib/pre-ldls/components/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,226 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var TextInput_exports = {};
|
|
30
|
+
__export(TextInput_exports, {
|
|
31
|
+
TextInput: () => TextInput
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(TextInput_exports);
|
|
34
|
+
var import_debounce = __toESM(require("lodash/debounce"));
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
37
|
+
var import_assets = require("../../../assets");
|
|
38
|
+
var import_components = require("../../../components");
|
|
39
|
+
var import_libs = require("../../libs");
|
|
40
|
+
const DEBOUNCE_MS = 250;
|
|
41
|
+
const COLORS_BORDER_STATUS_ERROR_DEFAULT = "colors-border-status-error-default";
|
|
42
|
+
const EXTRA_FONT_SIZE = "0.75rem";
|
|
43
|
+
const ICON_BUTTONS_SIZE = "32px";
|
|
44
|
+
const LABEL_OFFSET_Y = `calc(-0.5 * ${EXTRA_FONT_SIZE})`;
|
|
45
|
+
const LABEL_OFFSET_X = "var(--spacing-s, 16px)";
|
|
46
|
+
const LABEL_PADDING = "5px";
|
|
47
|
+
const ClearButton = import_styled_components.default.button`
|
|
48
|
+
${(0, import_libs.withTokens)("colors-surface-dark-default")}
|
|
49
|
+
|
|
50
|
+
all: unset;
|
|
51
|
+
cursor: pointer;
|
|
52
|
+
display: inline-flex;
|
|
53
|
+
align-items: center;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
height: ${ICON_BUTTONS_SIZE};
|
|
56
|
+
width: ${ICON_BUTTONS_SIZE};
|
|
57
|
+
`;
|
|
58
|
+
const Container = import_styled_components.default.div`
|
|
59
|
+
${(0, import_libs.withTokens)("spacing-xxs")}
|
|
60
|
+
|
|
61
|
+
display: flex;
|
|
62
|
+
flex-direction: column;
|
|
63
|
+
gap: var(--spacing-xxs, 4px);
|
|
64
|
+
position: relative;
|
|
65
|
+
min-width: 328px;
|
|
66
|
+
`;
|
|
67
|
+
const Label = import_styled_components.default.label`
|
|
68
|
+
${(0, import_libs.withTokens)(
|
|
69
|
+
COLORS_BORDER_STATUS_ERROR_DEFAULT,
|
|
70
|
+
"colors-border-active-default",
|
|
71
|
+
"colors-content-disabled",
|
|
72
|
+
"colors-content-subdued-default-default",
|
|
73
|
+
"spacing-s"
|
|
74
|
+
)}
|
|
75
|
+
color: ${({ hasError, isDisabled, isFocused }) => isDisabled ? "var(--colors-content-disabled)" : hasError ? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});` : isFocused ? "var(--colors-border-active-default)" : "var(--colors-content-subdued-default-default);"};
|
|
76
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
77
|
+
padding-inline: ${LABEL_PADDING};
|
|
78
|
+
position: absolute;
|
|
79
|
+
top: ${LABEL_OFFSET_Y};
|
|
80
|
+
left: calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});
|
|
81
|
+
`;
|
|
82
|
+
const Wrapper = import_styled_components.default.div`
|
|
83
|
+
${(0, import_libs.withTokens)(
|
|
84
|
+
"colors-content-default-default",
|
|
85
|
+
"colors-surface-transparent-subdued-default",
|
|
86
|
+
"radius-s",
|
|
87
|
+
"spacing-s",
|
|
88
|
+
"spacing-xxs"
|
|
89
|
+
)}
|
|
90
|
+
|
|
91
|
+
align-items: center;
|
|
92
|
+
border-radius: var(--radius-s);
|
|
93
|
+
display: flex;
|
|
94
|
+
gap: var(--spacing-xxs, 8px);
|
|
95
|
+
height: 56px;
|
|
96
|
+
padding: ${({ hasEnd, hasStart }) => `0 ${hasEnd ? "var(--spacing-xs, 8px)" : LABEL_OFFSET_X} 0 ${hasStart ? "var(--spacing-xs, 8px)" : LABEL_OFFSET_X}`};
|
|
97
|
+
position: relative;
|
|
98
|
+
transition: height 0.3s linear;
|
|
99
|
+
`;
|
|
100
|
+
const StyledInput = import_styled_components.default.input`
|
|
101
|
+
${(0, import_libs.withTokens)("colors-border-disabled-default")}
|
|
102
|
+
|
|
103
|
+
flex: 1;
|
|
104
|
+
background: none;
|
|
105
|
+
border: none;
|
|
106
|
+
cursor: text;
|
|
107
|
+
&[disabled] {
|
|
108
|
+
color: var(--colors-border-disabled-default);
|
|
109
|
+
cursor: not-allowed;
|
|
110
|
+
}
|
|
111
|
+
`;
|
|
112
|
+
const Fieldset = import_styled_components.default.fieldset`
|
|
113
|
+
${(0, import_libs.withTokens)(
|
|
114
|
+
COLORS_BORDER_STATUS_ERROR_DEFAULT,
|
|
115
|
+
"colors-border-active-default",
|
|
116
|
+
"colors-content-subdued-default-default",
|
|
117
|
+
"colors-content-disabled",
|
|
118
|
+
"spacing-s"
|
|
119
|
+
)}
|
|
120
|
+
border-radius: var(--radius-s);
|
|
121
|
+
border-color: ${({ isDisabled, hasError, isFocused }) => isDisabled ? "var(--colors-content-disabled)" : hasError ? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})` : isFocused ? "var(--colors-border-active-default)" : "var(--colors-content-subdued-default-default)"};
|
|
122
|
+
border-style: solid;
|
|
123
|
+
border-width: 1px;
|
|
124
|
+
bottom: 0;
|
|
125
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
126
|
+
left: 0;
|
|
127
|
+
overflow: hidden;
|
|
128
|
+
padding: 0 calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});
|
|
129
|
+
pointer-events: none;
|
|
130
|
+
position: absolute;
|
|
131
|
+
right: 0;
|
|
132
|
+
top: ${({ hasLabel }) => hasLabel ? LABEL_OFFSET_Y : "0"};
|
|
133
|
+
`;
|
|
134
|
+
const Legend = import_styled_components.default.legend`
|
|
135
|
+
visibility: hidden;
|
|
136
|
+
padding-inline: ${LABEL_PADDING};
|
|
137
|
+
`;
|
|
138
|
+
const HelperContainer = (0, import_styled_components.default)(import_components.Flex)`
|
|
139
|
+
${(0, import_libs.withTokens)(COLORS_BORDER_STATUS_ERROR_DEFAULT)}
|
|
140
|
+
align-items: center;
|
|
141
|
+
`;
|
|
142
|
+
const HelperText = import_styled_components.default.span`
|
|
143
|
+
${(0, import_libs.withTokens)(COLORS_BORDER_STATUS_ERROR_DEFAULT, "colors-border-disabled-default")}
|
|
144
|
+
${({ isDisabled, hasError }) => isDisabled ? "var(--colors-border-disabled-default)" : hasError ? `color: var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});` : ""}
|
|
145
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
146
|
+
`;
|
|
147
|
+
const TextInput = import_react.default.forwardRef(
|
|
148
|
+
({
|
|
149
|
+
label,
|
|
150
|
+
name,
|
|
151
|
+
defaultValue = "",
|
|
152
|
+
startAdornment = null,
|
|
153
|
+
endAdornment = null,
|
|
154
|
+
error = false,
|
|
155
|
+
helperText,
|
|
156
|
+
style,
|
|
157
|
+
onFocus,
|
|
158
|
+
onBlur,
|
|
159
|
+
onChange,
|
|
160
|
+
...rest
|
|
161
|
+
}, ref) => {
|
|
162
|
+
const inputRef = import_react.default.useRef(null);
|
|
163
|
+
const [isFocused, setIsFocused] = import_react.default.useState(false);
|
|
164
|
+
const [value, setValue] = import_react.default.useState(defaultValue);
|
|
165
|
+
import_react.default.useImperativeHandle(ref, () => inputRef.current);
|
|
166
|
+
const hideClearDebounced = import_react.default.useMemo(
|
|
167
|
+
() => (0, import_debounce.default)(() => setIsFocused(false), DEBOUNCE_MS),
|
|
168
|
+
[]
|
|
169
|
+
);
|
|
170
|
+
const handleFocus = (e) => {
|
|
171
|
+
hideClearDebounced.cancel();
|
|
172
|
+
setIsFocused(true);
|
|
173
|
+
onFocus == null ? void 0 : onFocus(e);
|
|
174
|
+
};
|
|
175
|
+
const handleBlur = (e) => {
|
|
176
|
+
onBlur == null ? void 0 : onBlur(e);
|
|
177
|
+
hideClearDebounced();
|
|
178
|
+
};
|
|
179
|
+
import_react.default.useEffect(() => () => hideClearDebounced.cancel(), [hideClearDebounced]);
|
|
180
|
+
const handleChange = (e) => {
|
|
181
|
+
setValue(e.target.value);
|
|
182
|
+
onChange == null ? void 0 : onChange(e);
|
|
183
|
+
};
|
|
184
|
+
const clearInput = () => {
|
|
185
|
+
if (inputRef.current) {
|
|
186
|
+
inputRef.current.value = "";
|
|
187
|
+
setValue("");
|
|
188
|
+
inputRef.current.focus();
|
|
189
|
+
}
|
|
190
|
+
};
|
|
191
|
+
const showClear = value.length > 0 && (isFocused || error);
|
|
192
|
+
const hasEnd = showClear || Boolean(endAdornment);
|
|
193
|
+
const hasError = Boolean(error);
|
|
194
|
+
const hasLabel = Boolean(label);
|
|
195
|
+
const isDisabled = Boolean(rest.disabled);
|
|
196
|
+
return /* @__PURE__ */ import_react.default.createElement(Container, { style }, label && /* @__PURE__ */ import_react.default.createElement(Label, { isDisabled, hasError, isFocused, htmlFor: name }, label), /* @__PURE__ */ import_react.default.createElement(Wrapper, { hasStart: Boolean(startAdornment), hasEnd }, startAdornment, /* @__PURE__ */ import_react.default.createElement(
|
|
197
|
+
StyledInput,
|
|
198
|
+
{
|
|
199
|
+
name,
|
|
200
|
+
defaultValue,
|
|
201
|
+
onFocus: handleFocus,
|
|
202
|
+
onBlur: handleBlur,
|
|
203
|
+
onChange: handleChange,
|
|
204
|
+
...rest,
|
|
205
|
+
ref: inputRef
|
|
206
|
+
}
|
|
207
|
+
), showClear ? /* @__PURE__ */ import_react.default.createElement(ClearButton, { onClick: clearInput, "aria-label": "Clear" }, /* @__PURE__ */ import_react.default.createElement(import_assets.Icons.DeleteCircleFill, { size: "S", color: "var(--colors-surface-dark-default)" })) : endAdornment, /* @__PURE__ */ import_react.default.createElement(
|
|
208
|
+
Fieldset,
|
|
209
|
+
{
|
|
210
|
+
hasError,
|
|
211
|
+
hasLabel,
|
|
212
|
+
isDisabled,
|
|
213
|
+
isFocused
|
|
214
|
+
},
|
|
215
|
+
label ? /* @__PURE__ */ import_react.default.createElement(Legend, null, label) : null
|
|
216
|
+
)), helperText ? /* @__PURE__ */ import_react.default.createElement(HelperContainer, { columnGap: 2 }, hasError ? /* @__PURE__ */ import_react.default.createElement(
|
|
217
|
+
import_assets.Icons.DeleteCircleFill,
|
|
218
|
+
{
|
|
219
|
+
size: "S",
|
|
220
|
+
color: `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})`
|
|
221
|
+
}
|
|
222
|
+
) : null, /* @__PURE__ */ import_react.default.createElement(HelperText, { isDisabled, hasError }, helperText)) : null);
|
|
223
|
+
}
|
|
224
|
+
);
|
|
225
|
+
TextInput.displayName = "TextInput";
|
|
226
|
+
//# sourceMappingURL=TextInput.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../src/pre-ldls/components/TextInput/TextInput.tsx"],
|
|
4
|
+
"sourcesContent": ["import debounce from \"lodash/debounce\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport { Icons } from \"../../../assets\";\nimport { Flex } from \"../../../components\";\nimport { withTokens } from \"../../libs\";\n\nconst DEBOUNCE_MS = 250;\n\nconst COLORS_BORDER_STATUS_ERROR_DEFAULT = \"colors-border-status-error-default\";\nconst EXTRA_FONT_SIZE = \"0.75rem\";\nconst ICON_BUTTONS_SIZE = \"32px\";\nconst LABEL_OFFSET_Y = `calc(-0.5 * ${EXTRA_FONT_SIZE})`;\nconst LABEL_OFFSET_X = \"var(--spacing-s, 16px)\";\nconst LABEL_PADDING = \"5px\";\n\ntype NativeInputProps = Omit<React.ComponentProps<\"input\">, \"value\" | \"defaultValue\">;\n\nexport type TextInputProps = Readonly<\n NativeInputProps & {\n defaultValue?: string;\n label?: string;\n startAdornment?: React.ReactNode;\n endAdornment?: React.ReactNode;\n error?: boolean;\n helperText?: string;\n }\n>;\n\nconst ClearButton = styled.button`\n ${withTokens(\"colors-surface-dark-default\")}\n\n all: unset;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: ${ICON_BUTTONS_SIZE};\n width: ${ICON_BUTTONS_SIZE};\n`;\n\nconst Container = styled.div`\n ${withTokens(\"spacing-xxs\")}\n\n display: flex;\n flex-direction: column;\n gap: var(--spacing-xxs, 4px);\n position: relative;\n min-width: 328px;\n`;\n\nconst Label = styled.label<{ isDisabled: boolean; hasError: boolean; isFocused: boolean }>`\n ${withTokens(\n COLORS_BORDER_STATUS_ERROR_DEFAULT,\n \"colors-border-active-default\",\n \"colors-content-disabled\",\n \"colors-content-subdued-default-default\",\n \"spacing-s\",\n )}\n color: ${({ hasError, isDisabled, isFocused }) =>\n isDisabled\n ? \"var(--colors-content-disabled)\"\n : hasError\n ? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});`\n : isFocused\n ? \"var(--colors-border-active-default)\"\n : \"var(--colors-content-subdued-default-default);\"};\n font-size: ${EXTRA_FONT_SIZE};\n padding-inline: ${LABEL_PADDING};\n position: absolute;\n top: ${LABEL_OFFSET_Y};\n left: calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});\n`;\n\nconst Wrapper = styled.div<{\n hasStart: boolean;\n hasEnd: boolean;\n}>`\n ${withTokens(\n \"colors-content-default-default\",\n \"colors-surface-transparent-subdued-default\",\n \"radius-s\",\n \"spacing-s\",\n \"spacing-xxs\",\n )}\n\n align-items: center;\n border-radius: var(--radius-s);\n display: flex;\n gap: var(--spacing-xxs, 8px);\n height: 56px;\n padding: ${({ hasEnd, hasStart }) =>\n `0 ${hasEnd ? \"var(--spacing-xs, 8px)\" : LABEL_OFFSET_X} 0 ${\n hasStart ? \"var(--spacing-xs, 8px)\" : LABEL_OFFSET_X\n }`};\n position: relative;\n transition: height 0.3s linear;\n`;\n\nconst StyledInput = styled.input`\n ${withTokens(\"colors-border-disabled-default\")}\n\n flex: 1;\n background: none;\n border: none;\n cursor: text;\n &[disabled] {\n color: var(--colors-border-disabled-default);\n cursor: not-allowed;\n }\n`;\n\nconst Fieldset = styled.fieldset<{\n hasError: boolean;\n hasLabel: boolean;\n isDisabled: boolean;\n isFocused: boolean;\n}>`\n ${withTokens(\n COLORS_BORDER_STATUS_ERROR_DEFAULT,\n \"colors-border-active-default\",\n \"colors-content-subdued-default-default\",\n \"colors-content-disabled\",\n \"spacing-s\",\n )}\n border-radius: var(--radius-s);\n border-color: ${({ isDisabled, hasError, isFocused }) =>\n isDisabled\n ? \"var(--colors-content-disabled)\"\n : hasError\n ? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})`\n : isFocused\n ? \"var(--colors-border-active-default)\"\n : \"var(--colors-content-subdued-default-default)\"};\n border-style: solid;\n border-width: 1px;\n bottom: 0;\n font-size: ${EXTRA_FONT_SIZE};\n left: 0;\n overflow: hidden;\n padding: 0 calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});\n pointer-events: none;\n position: absolute;\n right: 0;\n top: ${({ hasLabel }) => (hasLabel ? LABEL_OFFSET_Y : \"0\")};\n`;\n\nconst Legend = styled.legend`\n visibility: hidden;\n padding-inline: ${LABEL_PADDING};\n`;\n\nconst HelperContainer = styled(Flex)`\n ${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT)}\n align-items: center;\n`;\n\n// TODO what's the color for disabled helperText?\nconst HelperText = styled.span<{ hasError: boolean; isDisabled: boolean }>`\n ${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT, \"colors-border-disabled-default\")}\n ${({ isDisabled, hasError }) =>\n isDisabled\n ? \"var(--colors-border-disabled-default)\"\n : hasError\n ? `color: var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});`\n : \"\"}\n font-size: ${EXTRA_FONT_SIZE};\n`;\n\nexport const TextInput = React.forwardRef<HTMLInputElement, TextInputProps>(\n (\n {\n label,\n name,\n defaultValue = \"\",\n startAdornment = null,\n endAdornment = null,\n error = false,\n helperText,\n style,\n onFocus,\n onBlur,\n onChange,\n ...rest\n },\n ref,\n ) => {\n const inputRef = React.useRef<HTMLInputElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n const [value, setValue] = React.useState(defaultValue);\n\n // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n React.useImperativeHandle(ref, () => inputRef.current as HTMLInputElement);\n\n const hideClearDebounced = React.useMemo(\n () => debounce(() => setIsFocused(false), DEBOUNCE_MS),\n [],\n );\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n hideClearDebounced.cancel();\n setIsFocused(true);\n onFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n onBlur?.(e);\n hideClearDebounced();\n };\n\n React.useEffect(() => () => hideClearDebounced.cancel(), [hideClearDebounced]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n setValue(e.target.value);\n onChange?.(e);\n };\n\n const clearInput = () => {\n if (inputRef.current) {\n inputRef.current.value = \"\";\n setValue(\"\");\n inputRef.current.focus();\n }\n };\n\n const showClear = value.length > 0 && (isFocused || error);\n const hasEnd = showClear || Boolean(endAdornment);\n const hasError = Boolean(error);\n const hasLabel = Boolean(label);\n const isDisabled = Boolean(rest.disabled);\n\n return (\n <Container style={style}>\n {label && (\n <Label isDisabled={isDisabled} hasError={hasError} isFocused={isFocused} htmlFor={name}>\n {label}\n </Label>\n )}\n\n <Wrapper hasStart={Boolean(startAdornment)} hasEnd={hasEnd}>\n {startAdornment}\n\n <StyledInput\n name={name}\n defaultValue={defaultValue}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChange={handleChange}\n {...rest}\n ref={inputRef}\n />\n\n {showClear ? (\n <ClearButton onClick={clearInput} aria-label=\"Clear\">\n <Icons.DeleteCircleFill size=\"S\" color=\"var(--colors-surface-dark-default)\" />\n </ClearButton>\n ) : (\n endAdornment\n )}\n\n <Fieldset\n hasError={hasError}\n hasLabel={hasLabel}\n isDisabled={isDisabled}\n isFocused={isFocused}\n >\n {label ? <Legend>{label}</Legend> : null}\n </Fieldset>\n </Wrapper>\n\n {helperText ? (\n <HelperContainer columnGap={2}>\n {hasError ? (\n <Icons.DeleteCircleFill\n size=\"S\"\n color={`var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})`}\n />\n ) : null}\n <HelperText isDisabled={isDisabled} hasError={hasError}>\n {helperText}\n </HelperText>\n </HelperContainer>\n ) : null}\n </Container>\n );\n },\n);\n\nTextInput.displayName = \"TextInput\";\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styled", "React", "debounce"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var TextInput_stories_exports = {};
|
|
30
|
+
__export(TextInput_stories_exports, {
|
|
31
|
+
Default: () => Default,
|
|
32
|
+
Disabled: () => Disabled,
|
|
33
|
+
Filled: () => Filled,
|
|
34
|
+
WithAdornments: () => WithAdornments,
|
|
35
|
+
WithError: () => WithError,
|
|
36
|
+
WithLabel: () => WithLabel,
|
|
37
|
+
default: () => TextInput_stories_default
|
|
38
|
+
});
|
|
39
|
+
module.exports = __toCommonJS(TextInput_stories_exports);
|
|
40
|
+
var import_react = __toESM(require("react"));
|
|
41
|
+
var import_assets = require("../../../assets");
|
|
42
|
+
var import_TextInput = require("./TextInput");
|
|
43
|
+
const meta = {
|
|
44
|
+
component: import_TextInput.TextInput,
|
|
45
|
+
title: "PreLdls/Components/TextInput",
|
|
46
|
+
tags: ["autodocs"]
|
|
47
|
+
};
|
|
48
|
+
var TextInput_stories_default = meta;
|
|
49
|
+
const Default = {
|
|
50
|
+
args: {
|
|
51
|
+
name: "plain",
|
|
52
|
+
placeholder: "Type here"
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
const WithLabel = {
|
|
56
|
+
args: {
|
|
57
|
+
name: "labelled",
|
|
58
|
+
label: "Your comment",
|
|
59
|
+
placeholder: "Write something"
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
const WithAdornments = {
|
|
63
|
+
args: {
|
|
64
|
+
name: "adorned",
|
|
65
|
+
startAdornment: /* @__PURE__ */ import_react.default.createElement(import_assets.Icons.Search, { size: "S" }),
|
|
66
|
+
placeholder: "Search accounts"
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
const WithError = {
|
|
70
|
+
args: {
|
|
71
|
+
name: "errorDemo",
|
|
72
|
+
label: "Errored label",
|
|
73
|
+
defaultValue: "-20.00",
|
|
74
|
+
error: true,
|
|
75
|
+
helperText: "Amount must be a positive number"
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
const Filled = {
|
|
79
|
+
args: {
|
|
80
|
+
name: "filledDemo",
|
|
81
|
+
defaultValue: "Clear me",
|
|
82
|
+
helperText: "This is a filled input"
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
const Disabled = {
|
|
86
|
+
args: {
|
|
87
|
+
name: "disabled",
|
|
88
|
+
label: "Disabled label",
|
|
89
|
+
placeholder: "Disabled",
|
|
90
|
+
disabled: true
|
|
91
|
+
}
|
|
92
|
+
};
|
|
93
|
+
//# sourceMappingURL=TextInput.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../src/pre-ldls/components/TextInput/TextInput.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Icons } from \"../../../assets\";\nimport { TextInput, TextInputProps } from \"./TextInput\";\n\nconst meta: Meta<typeof TextInput> = {\n component: TextInput,\n title: \"PreLdls/Components/TextInput\",\n tags: [\"autodocs\"],\n};\nexport default meta;\n\ntype Story = StoryObj<TextInputProps>;\n\nexport const Default: Story = {\n args: {\n name: \"plain\",\n placeholder: \"Type here\",\n },\n};\n\nexport const WithLabel: Story = {\n args: {\n name: \"labelled\",\n label: \"Your comment\",\n placeholder: \"Write something\",\n },\n};\n\nexport const WithAdornments: Story = {\n args: {\n name: \"adorned\",\n startAdornment: <Icons.Search size=\"S\" />,\n placeholder: \"Search accounts\",\n },\n};\n\nexport const WithError: Story = {\n args: {\n name: \"errorDemo\",\n label: \"Errored label\",\n defaultValue: \"-20.00\",\n error: true,\n helperText: \"Amount must be a positive number\",\n },\n};\n\nexport const Filled: Story = {\n args: {\n name: \"filledDemo\",\n defaultValue: \"Clear me\",\n helperText: \"This is a filled input\",\n },\n};\n\nexport const Disabled: Story = {\n args: {\n name: \"disabled\",\n label: \"Disabled label\",\n placeholder: \"Disabled\",\n disabled: true,\n },\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,oBAAsB;AACtB,uBAA0C;AAE1C,MAAM,OAA+B;AAAA,EACnC,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM,CAAC,UAAU;AACnB;AACA,IAAO,4BAAQ;AAIR,MAAM,UAAiB;AAAA,EAC5B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,aAAa;AAAA,EACf;AACF;AAEO,MAAM,YAAmB;AAAA,EAC9B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aAAa;AAAA,EACf;AACF;AAEO,MAAM,iBAAwB;AAAA,EACnC,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,gBAAgB,6BAAAA,QAAA,cAAC,oBAAM,QAAN,EAAa,MAAK,KAAI;AAAA,IACvC,aAAa;AAAA,EACf;AACF;AAEO,MAAM,YAAmB;AAAA,EAC9B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,cAAc;AAAA,IACd,OAAO;AAAA,IACP,YAAY;AAAA,EACd;AACF;AAEO,MAAM,SAAgB;AAAA,EAC3B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AACF;AAEO,MAAM,WAAkB;AAAA,EAC7B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aAAa;AAAA,IACb,UAAU;AAAA,EACZ;AACF;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -26,5 +26,6 @@ __reExport(components_exports, require("./NetworkItem/NetworkItem"), module.expo
|
|
|
26
26
|
__reExport(components_exports, require("./NetworkList/NetworkList"), module.exports);
|
|
27
27
|
__reExport(components_exports, require("./Search/Search"), module.exports);
|
|
28
28
|
__reExport(components_exports, require("./Tag/Tag"), module.exports);
|
|
29
|
+
__reExport(components_exports, require("./TextInput/TextInput"), module.exports);
|
|
29
30
|
__reExport(components_exports, require("./VirtualList/VirtualList"), module.exports);
|
|
30
31
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/pre-ldls/components/index.ts"],
|
|
4
|
-
"sourcesContent": ["export * from \"./AccountItem/AccountItem\";\nexport * from \"./AccountList/AccountList\";\nexport * from \"./Address/Address\";\nexport * from \"./AssetItem/AssetItem\";\nexport * from \"./AssetList/AssetList\";\nexport * from \"./CardButton/CardButton\";\nexport * from \"./Input/Input\";\nexport * from \"./NetworkItem/NetworkItem\";\nexport * from \"./NetworkList/NetworkList\";\nexport * from \"./Search/Search\";\nexport * from \"./Tag/Tag\";\nexport * from \"./VirtualList/VirtualList\";\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,sCAAd;AACA,+BAAc,sCADd;AAEA,+BAAc,8BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,kCAJd;AAKA,+BAAc,oCALd;AAMA,+BAAc,0BANd;AAOA,+BAAc,sCAPd;AAQA,+BAAc,sCARd;AASA,+BAAc,4BATd;AAUA,+BAAc,sBAVd;AAWA,+BAAc,
|
|
4
|
+
"sourcesContent": ["export * from \"./AccountItem/AccountItem\";\nexport * from \"./AccountList/AccountList\";\nexport * from \"./Address/Address\";\nexport * from \"./AssetItem/AssetItem\";\nexport * from \"./AssetList/AssetList\";\nexport * from \"./CardButton/CardButton\";\nexport * from \"./Input/Input\";\nexport * from \"./NetworkItem/NetworkItem\";\nexport * from \"./NetworkList/NetworkList\";\nexport * from \"./Search/Search\";\nexport * from \"./Tag/Tag\";\nexport * from \"./TextInput/TextInput\";\nexport * from \"./VirtualList/VirtualList\";\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,sCAAd;AACA,+BAAc,sCADd;AAEA,+BAAc,8BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,kCAJd;AAKA,+BAAc,oCALd;AAMA,+BAAc,0BANd;AAOA,+BAAc,sCAPd;AAQA,+BAAc,sCARd;AASA,+BAAc,4BATd;AAUA,+BAAc,sBAVd;AAWA,+BAAc,kCAXd;AAYA,+BAAc,sCAZd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
type NativeInputProps = Omit<React.ComponentProps<"input">, "value" | "defaultValue">;
|
|
3
|
+
export type TextInputProps = Readonly<NativeInputProps & {
|
|
4
|
+
defaultValue?: string;
|
|
5
|
+
label?: string;
|
|
6
|
+
startAdornment?: React.ReactNode;
|
|
7
|
+
endAdornment?: React.ReactNode;
|
|
8
|
+
error?: boolean;
|
|
9
|
+
helperText?: string;
|
|
10
|
+
}>;
|
|
11
|
+
export declare const TextInput: React.ForwardRefExoticComponent<Omit<Readonly<NativeInputProps & {
|
|
12
|
+
defaultValue?: string | undefined;
|
|
13
|
+
label?: string | undefined;
|
|
14
|
+
startAdornment?: React.ReactNode;
|
|
15
|
+
endAdornment?: React.ReactNode;
|
|
16
|
+
error?: boolean | undefined;
|
|
17
|
+
helperText?: string | undefined;
|
|
18
|
+
}>, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
19
|
+
export {};
|
|
20
|
+
//# sourceMappingURL=TextInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/TextInput/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAe1B,KAAK,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC,CAAC;AAEtF,MAAM,MAAM,cAAc,GAAG,QAAQ,CACnC,gBAAgB,GAAG;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CACF,CAAC;AA8IF,eAAO,MAAM,SAAS;;;qBAnJD,MAAM,SAAS;mBACjB,MAAM,SAAS;;;mDAuQjC,CAAC"}
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
import debounce from "lodash/debounce";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import styled from "styled-components";
|
|
4
|
+
import { Icons } from "../../../assets";
|
|
5
|
+
import { Flex } from "../../../components";
|
|
6
|
+
import { withTokens } from "../../libs";
|
|
7
|
+
const DEBOUNCE_MS = 250;
|
|
8
|
+
const COLORS_BORDER_STATUS_ERROR_DEFAULT = "colors-border-status-error-default";
|
|
9
|
+
const EXTRA_FONT_SIZE = "0.75rem";
|
|
10
|
+
const ICON_BUTTONS_SIZE = "32px";
|
|
11
|
+
const LABEL_OFFSET_Y = `calc(-0.5 * ${EXTRA_FONT_SIZE})`;
|
|
12
|
+
const LABEL_OFFSET_X = "var(--spacing-s, 16px)";
|
|
13
|
+
const LABEL_PADDING = "5px";
|
|
14
|
+
const ClearButton = styled.button `
|
|
15
|
+
${withTokens("colors-surface-dark-default")}
|
|
16
|
+
|
|
17
|
+
all: unset;
|
|
18
|
+
cursor: pointer;
|
|
19
|
+
display: inline-flex;
|
|
20
|
+
align-items: center;
|
|
21
|
+
justify-content: center;
|
|
22
|
+
height: ${ICON_BUTTONS_SIZE};
|
|
23
|
+
width: ${ICON_BUTTONS_SIZE};
|
|
24
|
+
`;
|
|
25
|
+
const Container = styled.div `
|
|
26
|
+
${withTokens("spacing-xxs")}
|
|
27
|
+
|
|
28
|
+
display: flex;
|
|
29
|
+
flex-direction: column;
|
|
30
|
+
gap: var(--spacing-xxs, 4px);
|
|
31
|
+
position: relative;
|
|
32
|
+
min-width: 328px;
|
|
33
|
+
`;
|
|
34
|
+
const Label = styled.label `
|
|
35
|
+
${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT, "colors-border-active-default", "colors-content-disabled", "colors-content-subdued-default-default", "spacing-s")}
|
|
36
|
+
color: ${({ hasError, isDisabled, isFocused }) => isDisabled
|
|
37
|
+
? "var(--colors-content-disabled)"
|
|
38
|
+
: hasError
|
|
39
|
+
? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});`
|
|
40
|
+
: isFocused
|
|
41
|
+
? "var(--colors-border-active-default)"
|
|
42
|
+
: "var(--colors-content-subdued-default-default);"};
|
|
43
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
44
|
+
padding-inline: ${LABEL_PADDING};
|
|
45
|
+
position: absolute;
|
|
46
|
+
top: ${LABEL_OFFSET_Y};
|
|
47
|
+
left: calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});
|
|
48
|
+
`;
|
|
49
|
+
const Wrapper = styled.div `
|
|
50
|
+
${withTokens("colors-content-default-default", "colors-surface-transparent-subdued-default", "radius-s", "spacing-s", "spacing-xxs")}
|
|
51
|
+
|
|
52
|
+
align-items: center;
|
|
53
|
+
border-radius: var(--radius-s);
|
|
54
|
+
display: flex;
|
|
55
|
+
gap: var(--spacing-xxs, 8px);
|
|
56
|
+
height: 56px;
|
|
57
|
+
padding: ${({ hasEnd, hasStart }) => `0 ${hasEnd ? "var(--spacing-xs, 8px)" : LABEL_OFFSET_X} 0 ${hasStart ? "var(--spacing-xs, 8px)" : LABEL_OFFSET_X}`};
|
|
58
|
+
position: relative;
|
|
59
|
+
transition: height 0.3s linear;
|
|
60
|
+
`;
|
|
61
|
+
const StyledInput = styled.input `
|
|
62
|
+
${withTokens("colors-border-disabled-default")}
|
|
63
|
+
|
|
64
|
+
flex: 1;
|
|
65
|
+
background: none;
|
|
66
|
+
border: none;
|
|
67
|
+
cursor: text;
|
|
68
|
+
&[disabled] {
|
|
69
|
+
color: var(--colors-border-disabled-default);
|
|
70
|
+
cursor: not-allowed;
|
|
71
|
+
}
|
|
72
|
+
`;
|
|
73
|
+
const Fieldset = styled.fieldset `
|
|
74
|
+
${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT, "colors-border-active-default", "colors-content-subdued-default-default", "colors-content-disabled", "spacing-s")}
|
|
75
|
+
border-radius: var(--radius-s);
|
|
76
|
+
border-color: ${({ isDisabled, hasError, isFocused }) => isDisabled
|
|
77
|
+
? "var(--colors-content-disabled)"
|
|
78
|
+
: hasError
|
|
79
|
+
? `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})`
|
|
80
|
+
: isFocused
|
|
81
|
+
? "var(--colors-border-active-default)"
|
|
82
|
+
: "var(--colors-content-subdued-default-default)"};
|
|
83
|
+
border-style: solid;
|
|
84
|
+
border-width: 1px;
|
|
85
|
+
bottom: 0;
|
|
86
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
87
|
+
left: 0;
|
|
88
|
+
overflow: hidden;
|
|
89
|
+
padding: 0 calc(${LABEL_OFFSET_X} - ${LABEL_PADDING});
|
|
90
|
+
pointer-events: none;
|
|
91
|
+
position: absolute;
|
|
92
|
+
right: 0;
|
|
93
|
+
top: ${({ hasLabel }) => (hasLabel ? LABEL_OFFSET_Y : "0")};
|
|
94
|
+
`;
|
|
95
|
+
const Legend = styled.legend `
|
|
96
|
+
visibility: hidden;
|
|
97
|
+
padding-inline: ${LABEL_PADDING};
|
|
98
|
+
`;
|
|
99
|
+
const HelperContainer = styled(Flex) `
|
|
100
|
+
${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT)}
|
|
101
|
+
align-items: center;
|
|
102
|
+
`;
|
|
103
|
+
// TODO what's the color for disabled helperText?
|
|
104
|
+
const HelperText = styled.span `
|
|
105
|
+
${withTokens(COLORS_BORDER_STATUS_ERROR_DEFAULT, "colors-border-disabled-default")}
|
|
106
|
+
${({ isDisabled, hasError }) => isDisabled
|
|
107
|
+
? "var(--colors-border-disabled-default)"
|
|
108
|
+
: hasError
|
|
109
|
+
? `color: var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT});`
|
|
110
|
+
: ""}
|
|
111
|
+
font-size: ${EXTRA_FONT_SIZE};
|
|
112
|
+
`;
|
|
113
|
+
export const TextInput = React.forwardRef(({ label, name, defaultValue = "", startAdornment = null, endAdornment = null, error = false, helperText, style, onFocus, onBlur, onChange, ...rest }, ref) => {
|
|
114
|
+
const inputRef = React.useRef(null);
|
|
115
|
+
const [isFocused, setIsFocused] = React.useState(false);
|
|
116
|
+
const [value, setValue] = React.useState(defaultValue);
|
|
117
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
118
|
+
React.useImperativeHandle(ref, () => inputRef.current);
|
|
119
|
+
const hideClearDebounced = React.useMemo(() => debounce(() => setIsFocused(false), DEBOUNCE_MS), []);
|
|
120
|
+
const handleFocus = (e) => {
|
|
121
|
+
hideClearDebounced.cancel();
|
|
122
|
+
setIsFocused(true);
|
|
123
|
+
onFocus?.(e);
|
|
124
|
+
};
|
|
125
|
+
const handleBlur = (e) => {
|
|
126
|
+
onBlur?.(e);
|
|
127
|
+
hideClearDebounced();
|
|
128
|
+
};
|
|
129
|
+
React.useEffect(() => () => hideClearDebounced.cancel(), [hideClearDebounced]);
|
|
130
|
+
const handleChange = (e) => {
|
|
131
|
+
setValue(e.target.value);
|
|
132
|
+
onChange?.(e);
|
|
133
|
+
};
|
|
134
|
+
const clearInput = () => {
|
|
135
|
+
if (inputRef.current) {
|
|
136
|
+
inputRef.current.value = "";
|
|
137
|
+
setValue("");
|
|
138
|
+
inputRef.current.focus();
|
|
139
|
+
}
|
|
140
|
+
};
|
|
141
|
+
const showClear = value.length > 0 && (isFocused || error);
|
|
142
|
+
const hasEnd = showClear || Boolean(endAdornment);
|
|
143
|
+
const hasError = Boolean(error);
|
|
144
|
+
const hasLabel = Boolean(label);
|
|
145
|
+
const isDisabled = Boolean(rest.disabled);
|
|
146
|
+
return (React.createElement(Container, { style: style },
|
|
147
|
+
label && (React.createElement(Label, { isDisabled: isDisabled, hasError: hasError, isFocused: isFocused, htmlFor: name }, label)),
|
|
148
|
+
React.createElement(Wrapper, { hasStart: Boolean(startAdornment), hasEnd: hasEnd },
|
|
149
|
+
startAdornment,
|
|
150
|
+
React.createElement(StyledInput, { name: name, defaultValue: defaultValue, onFocus: handleFocus, onBlur: handleBlur, onChange: handleChange, ...rest, ref: inputRef }),
|
|
151
|
+
showClear ? (React.createElement(ClearButton, { onClick: clearInput, "aria-label": "Clear" },
|
|
152
|
+
React.createElement(Icons.DeleteCircleFill, { size: "S", color: "var(--colors-surface-dark-default)" }))) : (endAdornment),
|
|
153
|
+
React.createElement(Fieldset, { hasError: hasError, hasLabel: hasLabel, isDisabled: isDisabled, isFocused: isFocused }, label ? React.createElement(Legend, null, label) : null)),
|
|
154
|
+
helperText ? (React.createElement(HelperContainer, { columnGap: 2 },
|
|
155
|
+
hasError ? (React.createElement(Icons.DeleteCircleFill, { size: "S", color: `var(--${COLORS_BORDER_STATUS_ERROR_DEFAULT})` })) : null,
|
|
156
|
+
React.createElement(HelperText, { isDisabled: isDisabled, hasError: hasError }, helperText))) : null));
|
|
157
|
+
});
|
|
158
|
+
TextInput.displayName = "TextInput";
|
|
159
|
+
//# sourceMappingURL=TextInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,5 +9,6 @@ export * from "./NetworkItem/NetworkItem";
|
|
|
9
9
|
export * from "./NetworkList/NetworkList";
|
|
10
10
|
export * from "./Search/Search";
|
|
11
11
|
export * from "./Tag/Tag";
|
|
12
|
+
export * from "./TextInput/TextInput";
|
|
12
13
|
export * from "./VirtualList/VirtualList";
|
|
13
14
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,2BAA2B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC"}
|
|
@@ -9,5 +9,6 @@ export * from "./NetworkItem/NetworkItem";
|
|
|
9
9
|
export * from "./NetworkList/NetworkList";
|
|
10
10
|
export * from "./Search/Search";
|
|
11
11
|
export * from "./Tag/Tag";
|
|
12
|
+
export * from "./TextInput/TextInput";
|
|
12
13
|
export * from "./VirtualList/VirtualList";
|
|
13
14
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,2BAA2B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ledgerhq/react-ui",
|
|
3
|
-
"version": "0.33.0-nightly.
|
|
3
|
+
"version": "0.33.0-nightly.1",
|
|
4
4
|
"description": "Ledger Live - Desktop UI",
|
|
5
5
|
"author": "Ledger Live Team <team-live@ledger.fr>",
|
|
6
6
|
"repository": {
|
|
@@ -76,7 +76,7 @@
|
|
|
76
76
|
"react-window": "^1.8.6",
|
|
77
77
|
"styled-system": "^5.1.5",
|
|
78
78
|
"@ledgerhq/crypto-icons-ui": "^1.16.0-nightly.0",
|
|
79
|
-
"@ledgerhq/icons-ui": "^0.
|
|
79
|
+
"@ledgerhq/icons-ui": "^0.13.0-nightly.0",
|
|
80
80
|
"@ledgerhq/ui-shared": "^0.3.0"
|
|
81
81
|
},
|
|
82
82
|
"peerDependencies": {
|