@tamagui/input 3.0.0-beta.831.1 → 3.0.0-beta.889.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/dist/cjs/Input.cjs +3 -9
- package/dist/cjs/Input.native.cjs +1 -1
- package/dist/cjs/Input.native.js +1 -1
- package/dist/cjs/Input.native.js.map +1 -1
- package/dist/cjs/TextArea.cjs +3 -5
- package/dist/cjs/TextArea.native.cjs +3 -5
- package/dist/cjs/TextArea.native.js +3 -5
- package/dist/cjs/TextArea.native.js.map +1 -1
- package/dist/cjs/shared.cjs +59 -45
- package/dist/cjs/shared.native.cjs +64 -48
- package/dist/cjs/shared.native.js +64 -48
- package/dist/cjs/shared.native.js.map +1 -1
- package/dist/esm/Input.mjs +5 -11
- package/dist/esm/Input.mjs.map +1 -1
- package/dist/esm/Input.native.js +2 -2
- package/dist/esm/Input.native.js.map +1 -1
- package/dist/esm/TextArea.mjs +4 -6
- package/dist/esm/TextArea.mjs.map +1 -1
- package/dist/esm/TextArea.native.js +4 -6
- package/dist/esm/TextArea.native.js.map +1 -1
- package/dist/esm/shared.mjs +59 -46
- package/dist/esm/shared.mjs.map +1 -1
- package/dist/esm/shared.native.js +63 -48
- package/dist/esm/shared.native.js.map +1 -1
- package/dist/jsx/Input.mjs +5 -11
- package/dist/jsx/Input.mjs.map +1 -1
- package/dist/jsx/Input.native.cjs +1 -1
- package/dist/jsx/Input.native.js +1 -1
- package/dist/jsx/Input.native.js.map +1 -1
- package/dist/jsx/TextArea.mjs +4 -6
- package/dist/jsx/TextArea.mjs.map +1 -1
- package/dist/jsx/TextArea.native.cjs +3 -5
- package/dist/jsx/TextArea.native.js +3 -5
- package/dist/jsx/TextArea.native.js.map +1 -1
- package/dist/jsx/shared.mjs +59 -46
- package/dist/jsx/shared.mjs.map +1 -1
- package/dist/jsx/shared.native.cjs +64 -48
- package/dist/jsx/shared.native.js +64 -48
- package/dist/jsx/shared.native.js.map +1 -1
- package/package.json +12 -12
- package/src/Input.native.tsx +4 -2
- package/src/Input.tsx +5 -19
- package/src/TextArea.tsx +5 -6
- package/src/shared.tsx +69 -54
- package/types/Input.d.ts +8 -42
- package/types/Input.d.ts.map +1 -1
- package/types/Input.native.d.ts +8 -42
- package/types/Input.native.d.ts.map +1 -1
- package/types/TextArea.d.ts +5 -171
- package/types/TextArea.d.ts.map +1 -1
- package/types/shared.d.ts +31 -17
- package/types/shared.d.ts.map +1 -1
|
@@ -25,12 +25,13 @@ __export(shared_exports, {
|
|
|
25
25
|
INPUT_NAME: () => INPUT_NAME,
|
|
26
26
|
defaultStyles: () => defaultStyles,
|
|
27
27
|
inputSizeVariant: () => inputSizeVariant,
|
|
28
|
+
resolveMultilineInputSize: () => resolveMultilineInputSize,
|
|
29
|
+
resolveTextAreaSize: () => resolveTextAreaSize,
|
|
28
30
|
styledBody: () => styledBody,
|
|
29
31
|
textAreaSizeVariant: () => textAreaSizeVariant
|
|
30
32
|
});
|
|
31
33
|
module.exports = __toCommonJS(shared_exports);
|
|
32
34
|
var import_core = require("@tamagui/core");
|
|
33
|
-
var import_core2 = require("@tamagui/core");
|
|
34
35
|
var import_get_font_sized = require("@tamagui/get-font-sized");
|
|
35
36
|
var defaultStyles = {
|
|
36
37
|
size: true,
|
|
@@ -38,10 +39,10 @@ var defaultStyles = {
|
|
|
38
39
|
tabIndex: 0,
|
|
39
40
|
minWidth: 0
|
|
40
41
|
};
|
|
41
|
-
var resolveInputFrame = function(val,
|
|
42
|
-
return (0,
|
|
43
|
-
tokens:
|
|
44
|
-
font:
|
|
42
|
+
var resolveInputFrame = function(val, env) {
|
|
43
|
+
return (0, import_core.resolveTokenSize)(val, {
|
|
44
|
+
tokens: env.tokens,
|
|
45
|
+
font: env.font
|
|
45
46
|
}).frame;
|
|
46
47
|
};
|
|
47
48
|
var inputSizeKeys = [
|
|
@@ -74,72 +75,87 @@ var inputSizeKeys = [
|
|
|
74
75
|
"19",
|
|
75
76
|
"20"
|
|
76
77
|
];
|
|
77
|
-
var getInputPadding = function(val,
|
|
78
|
+
var getInputPadding = function(val, env, steps) {
|
|
78
79
|
if (typeof val === "number") {
|
|
79
80
|
return steps === 1 ? Math.max(0, Math.round(val * .6 - 12)) : Math.max(0, Math.round(val * .52 - 11.5));
|
|
80
81
|
}
|
|
81
82
|
var key = val === true ? "4" : val;
|
|
82
83
|
var index = inputSizeKeys.indexOf(key);
|
|
83
|
-
return
|
|
84
|
+
return env.tokens.space[inputSizeKeys[Math.max(0, index - steps)]];
|
|
84
85
|
};
|
|
85
|
-
var inputSizeVariant = function() {
|
|
86
|
-
var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true,
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
}
|
|
90
|
-
var frame = resolveInputFrame(val, extras);
|
|
91
|
-
var fontStyle = (0, import_get_font_sized.getFontSized)(val, extras);
|
|
92
|
-
if (!import_core2.isWeb && fontStyle) {
|
|
93
|
-
delete fontStyle["lineHeight"];
|
|
94
|
-
}
|
|
86
|
+
var inputSizeVariant = import_core.styled.dynamic(function() {
|
|
87
|
+
var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, env = arguments.length > 1 ? arguments[1] : void 0;
|
|
88
|
+
var frame = resolveInputFrame(val, env);
|
|
89
|
+
var fontStyle = (0, import_get_font_sized.getFontSized)(val, env);
|
|
95
90
|
return {
|
|
96
|
-
|
|
91
|
+
color: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.color,
|
|
92
|
+
fontFamily: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontFamily,
|
|
93
|
+
fontSize: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontSize,
|
|
94
|
+
fontStyle: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontStyle,
|
|
95
|
+
fontWeight: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontWeight,
|
|
96
|
+
letterSpacing: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.letterSpacing,
|
|
97
|
+
lineHeight: import_core.isWeb ? fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight : void 0,
|
|
98
|
+
textTransform: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.textTransform,
|
|
97
99
|
height: frame.size,
|
|
98
100
|
borderRadius: frame.radius,
|
|
99
|
-
paddingHorizontal: getInputPadding(val,
|
|
101
|
+
paddingHorizontal: getInputPadding(val, env, 1)
|
|
100
102
|
};
|
|
101
|
-
};
|
|
102
|
-
var textAreaSizeVariant = function() {
|
|
103
|
-
var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true,
|
|
104
|
-
var
|
|
105
|
-
var
|
|
106
|
-
|
|
103
|
+
});
|
|
104
|
+
var textAreaSizeVariant = import_core.styled.dynamic(function() {
|
|
105
|
+
var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, env = arguments.length > 1 ? arguments[1] : void 0;
|
|
106
|
+
var frame = resolveInputFrame(val, env);
|
|
107
|
+
var fontStyle = (0, import_get_font_sized.getFontSized)(val, env);
|
|
108
|
+
return {
|
|
109
|
+
borderRadius: frame.radius,
|
|
110
|
+
color: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.color,
|
|
111
|
+
fontFamily: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontFamily,
|
|
112
|
+
fontSize: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontSize,
|
|
113
|
+
fontStyle: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontStyle,
|
|
114
|
+
fontWeight: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontWeight,
|
|
115
|
+
letterSpacing: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.letterSpacing,
|
|
116
|
+
lineHeight: import_core.isWeb ? fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight : void 0,
|
|
117
|
+
textTransform: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.textTransform,
|
|
118
|
+
paddingVertical: getInputPadding(val, env, 2),
|
|
119
|
+
paddingHorizontal: getInputPadding(val, env, 1),
|
|
120
|
+
height: "auto"
|
|
121
|
+
};
|
|
122
|
+
});
|
|
123
|
+
var resolveTextAreaSize = function(props, env) {
|
|
124
|
+
var _props_size;
|
|
125
|
+
var sized = textAreaSizeVariant((_props_size = props.size) !== null && _props_size !== void 0 ? _props_size : true, env);
|
|
126
|
+
var _props_size1;
|
|
127
|
+
var fontStyle = (0, import_get_font_sized.getFontSized)((_props_size1 = props.size) !== null && _props_size1 !== void 0 ? _props_size1 : true, env);
|
|
107
128
|
var _props_rows;
|
|
108
129
|
var lines = (_props_rows = props.rows) !== null && _props_rows !== void 0 ? _props_rows : props.numberOfLines;
|
|
109
|
-
var height = typeof lines === "number" ? lines * (0,
|
|
110
|
-
if (!import_core2.isWeb && fontStyle) {
|
|
111
|
-
delete fontStyle["lineHeight"];
|
|
112
|
-
}
|
|
130
|
+
var height = typeof lines === "number" ? lines * (0, import_core.getVariableValue)(fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight) : sized === null || sized === void 0 ? void 0 : sized.height;
|
|
113
131
|
return {
|
|
114
|
-
borderRadius:
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
132
|
+
borderRadius: sized === null || sized === void 0 ? void 0 : sized.borderRadius,
|
|
133
|
+
color: sized === null || sized === void 0 ? void 0 : sized.color,
|
|
134
|
+
fontFamily: sized === null || sized === void 0 ? void 0 : sized.fontFamily,
|
|
135
|
+
fontSize: sized === null || sized === void 0 ? void 0 : sized.fontSize,
|
|
136
|
+
fontStyle: sized === null || sized === void 0 ? void 0 : sized.fontStyle,
|
|
137
|
+
fontWeight: sized === null || sized === void 0 ? void 0 : sized.fontWeight,
|
|
138
|
+
letterSpacing: sized === null || sized === void 0 ? void 0 : sized.letterSpacing,
|
|
139
|
+
lineHeight: sized === null || sized === void 0 ? void 0 : sized.lineHeight,
|
|
140
|
+
textTransform: sized === null || sized === void 0 ? void 0 : sized.textTransform,
|
|
141
|
+
paddingVertical: sized === null || sized === void 0 ? void 0 : sized.paddingVertical,
|
|
142
|
+
paddingHorizontal: sized === null || sized === void 0 ? void 0 : sized.paddingHorizontal,
|
|
118
143
|
height
|
|
119
144
|
};
|
|
120
145
|
};
|
|
146
|
+
var resolveMultilineInputSize = function(props, env) {
|
|
147
|
+
if (!(props.rows > 1 || props.multiline || props.numberOfLines > 1)) return;
|
|
148
|
+
return resolveTextAreaSize(props, env);
|
|
149
|
+
};
|
|
121
150
|
var INPUT_NAME = "Input";
|
|
122
151
|
var styledBody = [{
|
|
123
152
|
name: INPUT_NAME,
|
|
124
153
|
render: "input",
|
|
125
154
|
...defaultStyles,
|
|
126
155
|
variants: {
|
|
127
|
-
size:
|
|
128
|
-
true: inputSizeVariant,
|
|
129
|
-
Size: inputSizeVariant
|
|
130
|
-
},
|
|
156
|
+
size: inputSizeVariant,
|
|
131
157
|
disabled: { true: {} }
|
|
132
158
|
}
|
|
133
|
-
}, {
|
|
134
|
-
isInput: true,
|
|
135
|
-
accept: {
|
|
136
|
-
placeholderTextColor: "color",
|
|
137
|
-
selectionColor: "color",
|
|
138
|
-
cursorColor: "color",
|
|
139
|
-
selectionHandleColor: "color",
|
|
140
|
-
underlineColorAndroid: "color"
|
|
141
|
-
},
|
|
142
|
-
validStyles: import_core.Text.staticConfig.validStyles
|
|
143
|
-
}];
|
|
159
|
+
}, { isInput: true }];
|
|
144
160
|
|
|
145
161
|
//# sourceMappingURL=shared.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.native.js","names":[],"sources":["cjs/shared.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar shared_exports = {};\n__export(shared_exports, {\n INPUT_NAME: () => INPUT_NAME,\n defaultStyles: () => defaultStyles,\n inputSizeVariant: () => inputSizeVariant,\n styledBody: () => styledBody,\n textAreaSizeVariant: () => textAreaSizeVariant\n});\nmodule.exports = __toCommonJS(shared_exports);\nvar import_core = require(\"@tamagui/core\");\nvar import_core2 = require(\"@tamagui/core\");\nvar import_get_font_sized = require(\"@tamagui/get-font-sized\");\nvar defaultStyles = {\n size: true,\n outlineWidth: 0,\n tabIndex: 0,\n // this fixes a flex bug where it overflows container\n minWidth: 0\n};\nvar resolveInputFrame = function(val, extras) {\n return (0, import_core2.resolveTokenSize)(val, {\n tokens: extras.tokens,\n font: extras.font\n }).frame;\n};\nvar inputSizeKeys = [\n \"0\",\n \"0-25\",\n \"0-5\",\n \"0-75\",\n \"1\",\n \"1-5\",\n \"2\",\n \"2-5\",\n \"3\",\n \"3-5\",\n \"4\",\n \"4-5\",\n \"5\",\n \"6\",\n \"7\",\n \"8\",\n \"9\",\n \"10\",\n \"11\",\n \"12\",\n \"13\",\n \"14\",\n \"15\",\n \"16\",\n \"17\",\n \"18\",\n \"19\",\n \"20\"\n];\nvar getInputPadding = function(val, extras, steps) {\n if (typeof val === \"number\") {\n return steps === 1 ? Math.max(0, Math.round(val * 0.6 - 12)) : Math.max(0, Math.round(val * 0.52 - 11.5));\n }\n var key = val === true ? \"4\" : val;\n var index = inputSizeKeys.indexOf(key);\n return extras.tokens.space[inputSizeKeys[Math.max(0, index - steps)]];\n};\nvar inputSizeVariant = function() {\n var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, extras = arguments.length > 1 ? arguments[1] : void 0;\n if (extras.props.tag === \"textarea\" || extras.props.rows > 1 || extras.props.multiline || extras.props.numberOfLines > 1) {\n return textAreaSizeVariant(val, extras);\n }\n var frame = resolveInputFrame(val, extras);\n var fontStyle = (0, import_get_font_sized.getFontSized)(val, extras);\n if (!import_core2.isWeb && fontStyle) {\n delete fontStyle[\"lineHeight\"];\n }\n return {\n ...fontStyle,\n height: frame.size,\n borderRadius: frame.radius,\n paddingHorizontal: getInputPadding(val, extras, 1)\n };\n};\nvar textAreaSizeVariant = function() {\n var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, extras = arguments.length > 1 ? arguments[1] : void 0;\n var { props } = extras;\n var frame = resolveInputFrame(val, extras);\n var fontStyle = (0, import_get_font_sized.getFontSized)(val, extras);\n var _props_rows;\n var lines = (_props_rows = props.rows) !== null && _props_rows !== void 0 ? _props_rows : props.numberOfLines;\n var height = typeof lines === \"number\" ? lines * (0, import_core2.getVariableValue)(fontStyle.lineHeight) : \"auto\";\n if (!import_core2.isWeb && fontStyle) {\n delete fontStyle[\"lineHeight\"];\n }\n return {\n borderRadius: frame.radius,\n ...fontStyle,\n paddingVertical: getInputPadding(val, extras, 2),\n paddingHorizontal: getInputPadding(val, extras, 1),\n height\n };\n};\nvar INPUT_NAME = \"Input\";\nvar styledBody = [\n {\n name: INPUT_NAME,\n render: \"input\",\n ...defaultStyles,\n variants: {\n size: {\n true: inputSizeVariant,\n Size: inputSizeVariant\n },\n disabled: {\n true: {}\n }\n }\n },\n {\n isInput: true,\n accept: {\n placeholderTextColor: \"color\",\n selectionColor: \"color\",\n cursorColor: \"color\",\n selectionHandleColor: \"color\",\n underlineColorAndroid: \"color\"\n },\n validStyles: import_core.Text.staticConfig.validStyles\n }\n];\n//# sourceMappingURL=shared.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"shared.native.js","names":[],"sources":["cjs/shared.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar shared_exports = {};\n__export(shared_exports, {\n INPUT_NAME: () => INPUT_NAME,\n defaultStyles: () => defaultStyles,\n inputSizeVariant: () => inputSizeVariant,\n resolveMultilineInputSize: () => resolveMultilineInputSize,\n resolveTextAreaSize: () => resolveTextAreaSize,\n styledBody: () => styledBody,\n textAreaSizeVariant: () => textAreaSizeVariant\n});\nmodule.exports = __toCommonJS(shared_exports);\nvar import_core = require(\"@tamagui/core\");\nvar import_get_font_sized = require(\"@tamagui/get-font-sized\");\nvar defaultStyles = {\n size: true,\n outlineWidth: 0,\n tabIndex: 0,\n // this fixes a flex bug where it overflows container\n minWidth: 0\n};\nvar resolveInputFrame = function(val, env) {\n return (0, import_core.resolveTokenSize)(val, {\n tokens: env.tokens,\n font: env.font\n }).frame;\n};\nvar inputSizeKeys = [\n \"0\",\n \"0-25\",\n \"0-5\",\n \"0-75\",\n \"1\",\n \"1-5\",\n \"2\",\n \"2-5\",\n \"3\",\n \"3-5\",\n \"4\",\n \"4-5\",\n \"5\",\n \"6\",\n \"7\",\n \"8\",\n \"9\",\n \"10\",\n \"11\",\n \"12\",\n \"13\",\n \"14\",\n \"15\",\n \"16\",\n \"17\",\n \"18\",\n \"19\",\n \"20\"\n];\nvar getInputPadding = function(val, env, steps) {\n if (typeof val === \"number\") {\n return steps === 1 ? Math.max(0, Math.round(val * 0.6 - 12)) : Math.max(0, Math.round(val * 0.52 - 11.5));\n }\n var key = val === true ? \"4\" : val;\n var index = inputSizeKeys.indexOf(key);\n return env.tokens.space[inputSizeKeys[Math.max(0, index - steps)]];\n};\nvar inputSizeVariant = import_core.styled.dynamic(function() {\n var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, env = arguments.length > 1 ? arguments[1] : void 0;\n var frame = resolveInputFrame(val, env);\n var fontStyle = (0, import_get_font_sized.getFontSized)(val, env);\n return {\n color: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.color,\n fontFamily: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontFamily,\n fontSize: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontSize,\n fontStyle: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontStyle,\n fontWeight: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontWeight,\n letterSpacing: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.letterSpacing,\n lineHeight: import_core.isWeb ? fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight : void 0,\n textTransform: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.textTransform,\n height: frame.size,\n borderRadius: frame.radius,\n paddingHorizontal: getInputPadding(val, env, 1)\n };\n});\nvar textAreaSizeVariant = import_core.styled.dynamic(function() {\n var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, env = arguments.length > 1 ? arguments[1] : void 0;\n var frame = resolveInputFrame(val, env);\n var fontStyle = (0, import_get_font_sized.getFontSized)(val, env);\n return {\n borderRadius: frame.radius,\n color: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.color,\n fontFamily: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontFamily,\n fontSize: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontSize,\n fontStyle: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontStyle,\n fontWeight: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontWeight,\n letterSpacing: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.letterSpacing,\n lineHeight: import_core.isWeb ? fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight : void 0,\n textTransform: fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.textTransform,\n paddingVertical: getInputPadding(val, env, 2),\n paddingHorizontal: getInputPadding(val, env, 1),\n height: \"auto\"\n };\n});\nvar resolveTextAreaSize = function(props, env) {\n var _props_size;\n var sized = textAreaSizeVariant((_props_size = props.size) !== null && _props_size !== void 0 ? _props_size : true, env);\n var _props_size1;\n var fontStyle = (0, import_get_font_sized.getFontSized)((_props_size1 = props.size) !== null && _props_size1 !== void 0 ? _props_size1 : true, env);\n var _props_rows;\n var lines = (_props_rows = props.rows) !== null && _props_rows !== void 0 ? _props_rows : props.numberOfLines;\n var height = typeof lines === \"number\" ? lines * (0, import_core.getVariableValue)(fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.lineHeight) : sized === null || sized === void 0 ? void 0 : sized.height;\n return {\n borderRadius: sized === null || sized === void 0 ? void 0 : sized.borderRadius,\n color: sized === null || sized === void 0 ? void 0 : sized.color,\n fontFamily: sized === null || sized === void 0 ? void 0 : sized.fontFamily,\n fontSize: sized === null || sized === void 0 ? void 0 : sized.fontSize,\n fontStyle: sized === null || sized === void 0 ? void 0 : sized.fontStyle,\n fontWeight: sized === null || sized === void 0 ? void 0 : sized.fontWeight,\n letterSpacing: sized === null || sized === void 0 ? void 0 : sized.letterSpacing,\n lineHeight: sized === null || sized === void 0 ? void 0 : sized.lineHeight,\n textTransform: sized === null || sized === void 0 ? void 0 : sized.textTransform,\n paddingVertical: sized === null || sized === void 0 ? void 0 : sized.paddingVertical,\n paddingHorizontal: sized === null || sized === void 0 ? void 0 : sized.paddingHorizontal,\n height\n };\n};\nvar resolveMultilineInputSize = function(props, env) {\n if (!(props.rows > 1 || props.multiline || props.numberOfLines > 1)) return;\n return resolveTextAreaSize(props, env);\n};\nvar INPUT_NAME = \"Input\";\nvar styledBody = [\n {\n name: INPUT_NAME,\n render: \"input\",\n ...defaultStyles,\n variants: {\n size: inputSizeVariant,\n disabled: {\n true: {}\n }\n }\n },\n {\n isInput: true\n }\n];\n//# sourceMappingURL=shared.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,YAAY,QAAQ,QAAQ;CAC9B,KAAK,IAAI,QAAQ,KACf,UAAU,QAAQ,MAAM;EAAE,KAAK,IAAI;EAAO,YAAY;CAAK,CAAC;AAChE;AACA,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,iBAAiB,CAAC;AACtB,SAAS,gBAAgB;CACvB,kBAAkB;CAClB,qBAAqB;CACrB,wBAAwB;CACxB,iCAAiC;CACjC,2BAA2B;CAC3B,kBAAkB;CAClB,2BAA2B;AAC7B,CAAC;AACD,OAAO,UAAU,aAAa,cAAc;AAC5C,IAAI,cAAc,QAAQ,eAAe;AACzC,IAAI,wBAAwB,QAAQ,yBAAyB;AAC7D,IAAI,gBAAgB;CAClB,MAAM;CACN,cAAc;CACd,UAAU;CAEV,UAAU;AACZ;AACA,IAAI,oBAAoB,SAAS,KAAK,KAAK;CACzC,QAAQ,GAAG,YAAY,iBAAgB,CAAE,KAAK;EAC5C,QAAQ,IAAI;EACZ,MAAM,IAAI;CACZ,CAAC,CAAC,CAAC;AACL;AACA,IAAI,gBAAgB;CAClB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AACA,IAAI,kBAAkB,SAAS,KAAK,KAAK,OAAO;CAC9C,IAAI,OAAO,QAAQ,UAAU;EAC3B,OAAO,UAAU,IAAI,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,KAAM,EAAE,CAAC,IAAI,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,MAAO,IAAI,CAAC;CAC1G;CACA,IAAI,MAAM,QAAQ,OAAO,MAAM;CAC/B,IAAI,QAAQ,cAAc,QAAQ,GAAG;CACrC,OAAO,IAAI,OAAO,MAAM,cAAc,KAAK,IAAI,GAAG,QAAQ,KAAK;AACjE;AACA,IAAI,mBAAmB,YAAY,OAAO,QAAQ,WAAW;CAC3D,IAAI,MAAM,UAAU,SAAS,KAAK,UAAU,OAAO,KAAK,IAAI,UAAU,KAAK,MAAM,MAAM,UAAU,SAAS,IAAI,UAAU,KAAK,KAAK;CAClI,IAAI,QAAQ,kBAAkB,KAAK,GAAG;CACtC,IAAI,aAAa,GAAG,sBAAsB,aAAY,CAAE,KAAK,GAAG;CAChE,OAAO;EACL,OAAO,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EACvE,YAAY,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC5E,UAAU,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC1E,WAAW,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC3E,YAAY,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC5E,eAAe,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC/E,YAAY,YAAY,QAAQ,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU,aAAa,KAAK;EAClH,eAAe,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC/E,QAAQ,MAAM;EACd,cAAc,MAAM;EACpB,mBAAmB,gBAAgB,KAAK,KAAK,CAAC;CAChD;AACF,CAAC;AACD,IAAI,sBAAsB,YAAY,OAAO,QAAQ,WAAW;CAC9D,IAAI,MAAM,UAAU,SAAS,KAAK,UAAU,OAAO,KAAK,IAAI,UAAU,KAAK,MAAM,MAAM,UAAU,SAAS,IAAI,UAAU,KAAK,KAAK;CAClI,IAAI,QAAQ,kBAAkB,KAAK,GAAG;CACtC,IAAI,aAAa,GAAG,sBAAsB,aAAY,CAAE,KAAK,GAAG;CAChE,OAAO;EACL,cAAc,MAAM;EACpB,OAAO,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EACvE,YAAY,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC5E,UAAU,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC1E,WAAW,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC3E,YAAY,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC5E,eAAe,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC/E,YAAY,YAAY,QAAQ,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU,aAAa,KAAK;EAClH,eAAe,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU;EAC/E,iBAAiB,gBAAgB,KAAK,KAAK,CAAC;EAC5C,mBAAmB,gBAAgB,KAAK,KAAK,CAAC;EAC9C,QAAQ;CACV;AACF,CAAC;AACD,IAAI,sBAAsB,SAAS,OAAO,KAAK;CAC7C,IAAI;CACJ,IAAI,QAAQ,qBAAqB,cAAc,MAAM,UAAU,QAAQ,gBAAgB,KAAK,IAAI,cAAc,MAAM,GAAG;CACvH,IAAI;CACJ,IAAI,aAAa,GAAG,sBAAsB,aAAY,EAAG,eAAe,MAAM,UAAU,QAAQ,iBAAiB,KAAK,IAAI,eAAe,MAAM,GAAG;CAClJ,IAAI;CACJ,IAAI,SAAS,cAAc,MAAM,UAAU,QAAQ,gBAAgB,KAAK,IAAI,cAAc,MAAM;CAChG,IAAI,SAAS,OAAO,UAAU,WAAW,SAAS,GAAG,YAAY,iBAAgB,CAAE,cAAc,QAAQ,cAAc,KAAK,IAAI,KAAK,IAAI,UAAU,UAAU,IAAI,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;CACrN,OAAO;EACL,cAAc,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAClE,OAAO,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAC3D,YAAY,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAChE,UAAU,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAC9D,WAAW,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAC/D,YAAY,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAChE,eAAe,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EACnE,YAAY,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EAChE,eAAe,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EACnE,iBAAiB,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EACrE,mBAAmB,UAAU,QAAQ,UAAU,KAAK,IAAI,KAAK,IAAI,MAAM;EACvE;CACF;AACF;AACA,IAAI,4BAA4B,SAAS,OAAO,KAAK;CACnD,IAAI,EAAE,MAAM,OAAO,KAAK,MAAM,aAAa,MAAM,gBAAgB,IAAI;CACrE,OAAO,oBAAoB,OAAO,GAAG;AACvC;AACA,IAAI,aAAa;AACjB,IAAI,aAAa,CACf;CACE,MAAM;CACN,QAAQ;CACR,GAAG;CACH,UAAU;EACR,MAAM;EACN,UAAU,EACR,MAAM,CAAC,EACT;CACF;AACF,GACA,EACE,SAAS,KACX,CACF"}
|
package/dist/esm/Input.mjs
CHANGED
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
import { View, createStyledHOC, styled
|
|
1
|
+
import { View, createStyledHOC, styled } from "@tamagui/core";
|
|
2
2
|
import { registerFocusable } from "@tamagui/focusable";
|
|
3
3
|
import { useWebRef } from "@tamagui/element";
|
|
4
4
|
import React from "react";
|
|
5
|
-
import { styledBody } from "./shared.mjs";
|
|
5
|
+
import { resolveMultilineInputSize, styledBody } from "./shared.mjs";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
|
|
8
|
-
const StyledInput = styled(View, styledBody[0], styledBody[1]);
|
|
8
|
+
const StyledInput = styled(View, styledBody[0], styledBody[1]).resolve(resolveMultilineInputSize);
|
|
9
9
|
const Input = createStyledHOC(StyledInput, (props, _forwardedRef) => {
|
|
10
|
-
const { disabled, id, onChangeText, onSubmitEditing, onSelectionChange, selection,
|
|
10
|
+
const { disabled, id, onChangeText, onSubmitEditing, onSelectionChange, selection, rows, keyboardAppearance, returnKeyType, submitBehavior, blurOnSubmit, caretHidden, contextMenuHidden, selectTextOnFocus, secureTextEntry, maxFontSizeMultiplier, allowFontScaling, multiline, keyboardType, autoCapitalize: autoCapitalizeProp, autoCorrect: autoCorrectProp, autoFocusNative, textContentType, onEndEditing, onContentSizeChange, onScroll, onKeyPress, clearButtonMode, clearTextOnFocus, enablesReturnKeyAutomatically, dataDetectorTypes, scrollEnabled, passwordRules, rejectResponderTermination, spellCheck, lineBreakStrategyIOS, lineBreakModeIOS, smartInsertDelete, inputAccessoryViewID, inputAccessoryViewButtonLabel, disableKeyboardShortcuts, underlineColorAndroid, importantForAutofill, disableFullscreenUI, inlineImageLeft, inlineImagePadding, returnKeyLabel, textBreakStrategy, textAlignVertical, verticalAlign, showSoftInputOnFocus, numberOfLines, ...rest } = props;
|
|
11
11
|
const { ref, composedRef } = useWebRef(_forwardedRef);
|
|
12
|
-
const theme = useTheme();
|
|
13
12
|
const autoCorrect = autoCorrectProp === true ? "on" : autoCorrectProp === false ? "off" : autoCorrectProp;
|
|
14
13
|
const autoCapitalize = autoCapitalizeProp === "sentences" || autoCapitalizeProp === "words" ? "on" : autoCapitalizeProp === "none" || autoCapitalizeProp === "characters" ? "off" : autoCapitalizeProp;
|
|
15
14
|
React.useEffect(() => {
|
|
@@ -55,12 +54,7 @@ const Input = createStyledHOC(StyledInput, (props, _forwardedRef) => {
|
|
|
55
54
|
autoCorrect,
|
|
56
55
|
autoCapitalize,
|
|
57
56
|
onKeyDown: onSubmitEditing ? handleKeyDown : rest.onKeyDown,
|
|
58
|
-
onChange: onChangeText ? handleChange : rest.onChange
|
|
59
|
-
style: {
|
|
60
|
-
...rest.style,
|
|
61
|
-
...placeholderTextColor && { "--t_placeholderColor": theme[placeholderTextColor]?.variable || placeholderTextColor },
|
|
62
|
-
...selectionColor && { "--t_selectionColor": theme[selectionColor]?.variable || selectionColor }
|
|
63
|
-
}
|
|
57
|
+
onChange: onChangeText ? handleChange : rest.onChange
|
|
64
58
|
};
|
|
65
59
|
return /* @__PURE__ */ jsx(StyledInput, {
|
|
66
60
|
ref: composedRef,
|
package/dist/esm/Input.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","names":[],"sources":["esm/Input.js"],"sourcesContent":["import { createStyledHOC, View, styled
|
|
1
|
+
{"version":3,"file":"Input.js","names":[],"sources":["esm/Input.js"],"sourcesContent":["import { createStyledHOC, View, styled } from \"@tamagui/core\";\nimport { registerFocusable } from \"@tamagui/focusable\";\nimport { useWebRef } from \"@tamagui/element\";\nimport React from \"react\";\nimport { resolveMultilineInputSize, styledBody } from \"./shared\";\nimport { jsx } from \"react/jsx-runtime\";\nconst StyledInput = styled(View, styledBody[0], styledBody[1]).resolve(\n resolveMultilineInputSize\n);\nconst Input = createStyledHOC(\n StyledInput,\n (props, _forwardedRef) => {\n const {\n disabled,\n id,\n onChangeText,\n onSubmitEditing,\n onSelectionChange,\n selection,\n rows,\n // Native-only props (ignored on web)\n keyboardAppearance,\n returnKeyType,\n submitBehavior,\n blurOnSubmit,\n caretHidden,\n contextMenuHidden,\n selectTextOnFocus,\n secureTextEntry,\n maxFontSizeMultiplier,\n allowFontScaling,\n multiline,\n keyboardType,\n autoCapitalize: autoCapitalizeProp,\n autoCorrect: autoCorrectProp,\n autoFocusNative,\n textContentType,\n onEndEditing,\n onContentSizeChange,\n onScroll,\n onKeyPress,\n // iOS-only props (ignored on web)\n clearButtonMode,\n clearTextOnFocus,\n enablesReturnKeyAutomatically,\n dataDetectorTypes,\n scrollEnabled,\n passwordRules,\n rejectResponderTermination,\n spellCheck,\n lineBreakStrategyIOS,\n lineBreakModeIOS,\n smartInsertDelete,\n inputAccessoryViewID,\n inputAccessoryViewButtonLabel,\n disableKeyboardShortcuts,\n // Android-only props (ignored on web)\n underlineColorAndroid,\n importantForAutofill,\n disableFullscreenUI,\n inlineImageLeft,\n inlineImagePadding,\n returnKeyLabel,\n textBreakStrategy,\n textAlignVertical,\n verticalAlign,\n showSoftInputOnFocus,\n numberOfLines,\n ...rest\n } = props;\n const { ref, composedRef } = useWebRef(_forwardedRef);\n const autoCorrect = autoCorrectProp === true ? \"on\" : autoCorrectProp === false ? \"off\" : autoCorrectProp;\n const autoCapitalize = autoCapitalizeProp === \"sentences\" || autoCapitalizeProp === \"words\" ? \"on\" : autoCapitalizeProp === \"none\" || autoCapitalizeProp === \"characters\" ? \"off\" : autoCapitalizeProp;\n React.useEffect(() => {\n if (!onSelectionChange) return;\n const node = ref.current;\n if (!node) return;\n const handleSelectionChange = () => {\n onSelectionChange({\n nativeEvent: {\n selection: {\n start: node.selectionStart ?? 0,\n end: node.selectionEnd ?? 0\n }\n }\n });\n };\n node.addEventListener(\"select\", handleSelectionChange);\n return () => node.removeEventListener(\"select\", handleSelectionChange);\n }, [onSelectionChange]);\n React.useEffect(() => {\n if (selection && ref.current) {\n ref.current.setSelectionRange(selection.start, selection.end ?? selection.start);\n }\n }, [selection?.start, selection?.end]);\n React.useEffect(() => {\n if (!id || disabled) return;\n return registerFocusable(id, {\n focusAndSelect: () => ref.current?.focus(),\n focus: () => ref.current?.focus()\n });\n }, [id, disabled]);\n const handleKeyDown = (e) => {\n if (e.key === \"Enter\" && onSubmitEditing) {\n onSubmitEditing({\n nativeEvent: { text: e.target.value }\n });\n }\n rest.onKeyDown?.(e);\n };\n const handleChange = (e) => {\n onChangeText?.(e.target.value);\n rest.onChange?.(e);\n };\n const finalProps = {\n ...rest,\n disabled,\n id,\n rows,\n autoCorrect,\n autoCapitalize,\n onKeyDown: onSubmitEditing ? handleKeyDown : rest.onKeyDown,\n onChange: onChangeText ? handleChange : rest.onChange\n };\n return /* @__PURE__ */ jsx(StyledInput, { ref: composedRef, ...finalProps });\n }\n);\nexport {\n Input\n};\n//# sourceMappingURL=Input.js.map\n"],"mappings":";;;;;;;;AAMA,MAAM,cAAc,OAAO,MAAM,WAAW,IAAI,WAAW,EAAE,CAAC,CAAC,QAC7D,yBACF;AACA,MAAM,QAAQ,gBACZ,cACC,OAAO,kBAAkB;CACxB,MAAM,EACJ,UACA,IACA,cACA,iBACA,mBACA,WACA,MAEA,oBACA,eACA,gBACA,cACA,aACA,mBACA,mBACA,iBACA,uBACA,kBACA,WACA,cACA,gBAAgB,oBAChB,aAAa,iBACb,iBACA,iBACA,cACA,qBACA,UACA,YAEA,iBACA,kBACA,+BACA,mBACA,eACA,eACA,4BACA,YACA,sBACA,kBACA,mBACA,sBACA,+BACA,0BAEA,uBACA,sBACA,qBACA,iBACA,oBACA,gBACA,mBACA,mBACA,eACA,sBACA,eACA,GAAG,SACD;CACJ,MAAM,EAAE,KAAK,gBAAgB,UAAU,aAAa;CACpD,MAAM,cAAc,oBAAoB,OAAO,OAAO,oBAAoB,QAAQ,QAAQ;CAC1F,MAAM,iBAAiB,uBAAuB,eAAe,uBAAuB,UAAU,OAAO,uBAAuB,UAAU,uBAAuB,eAAe,QAAQ;CACpL,MAAM,gBAAgB;EACpB,IAAI,CAAC,mBAAmB;EACxB,MAAM,OAAO,IAAI;EACjB,IAAI,CAAC,MAAM;EACX,MAAM,8BAA8B;GAClC,kBAAkB,EAChB,aAAa,EACX,WAAW;IACT,OAAO,KAAK,kBAAkB;IAC9B,KAAK,KAAK,gBAAgB;GAC5B,EACF,EACF,CAAC;EACH;EACA,KAAK,iBAAiB,UAAU,qBAAqB;EACrD,aAAa,KAAK,oBAAoB,UAAU,qBAAqB;CACvE,GAAG,CAAC,iBAAiB,CAAC;CACtB,MAAM,gBAAgB;EACpB,IAAI,aAAa,IAAI,SAAS;GAC5B,IAAI,QAAQ,kBAAkB,UAAU,OAAO,UAAU,OAAO,UAAU,KAAK;EACjF;CACF,GAAG,CAAC,WAAW,OAAO,WAAW,GAAG,CAAC;CACrC,MAAM,gBAAgB;EACpB,IAAI,CAAC,MAAM,UAAU;EACrB,OAAO,kBAAkB,IAAI;GAC3B,sBAAsB,IAAI,SAAS,MAAM;GACzC,aAAa,IAAI,SAAS,MAAM;EAClC,CAAC;CACH,GAAG,CAAC,IAAI,QAAQ,CAAC;CACjB,MAAM,iBAAiB,MAAM;EAC3B,IAAI,EAAE,QAAQ,WAAW,iBAAiB;GACxC,gBAAgB,EACd,aAAa,EAAE,MAAM,EAAE,OAAO,MAAM,EACtC,CAAC;EACH;EACA,KAAK,YAAY,CAAC;CACpB;CACA,MAAM,gBAAgB,MAAM;EAC1B,eAAe,EAAE,OAAO,KAAK;EAC7B,KAAK,WAAW,CAAC;CACnB;CACA,MAAM,aAAa;EACjB,GAAG;EACH;EACA;EACA;EACA;EACA;EACA,WAAW,kBAAkB,gBAAgB,KAAK;EAClD,UAAU,eAAe,eAAe,KAAK;CAC/C;CACA,OAAuB,oBAAI,aAAa;EAAE,KAAK;EAAa,GAAG;CAAW,CAAC;AAC7E,CACF"}
|
package/dist/esm/Input.native.js
CHANGED
|
@@ -4,9 +4,9 @@ import { TextInput } from "react-native";
|
|
|
4
4
|
import { createStyledHOC, styled } from "@tamagui/core";
|
|
5
5
|
import { registerFocusable } from "@tamagui/focusable";
|
|
6
6
|
import { useNativeInputRef } from "@tamagui/element";
|
|
7
|
-
import { styledBody } from "./shared.native.js";
|
|
7
|
+
import { resolveMultilineInputSize, styledBody } from "./shared.native.js";
|
|
8
8
|
|
|
9
|
-
var StyledInput = styled(TextInput, styledBody[0], styledBody[1]);
|
|
9
|
+
var StyledInput = styled(TextInput, styledBody[0], styledBody[1]).resolve(resolveMultilineInputSize);
|
|
10
10
|
var Input = createStyledHOC(StyledInput, function(props, forwardedRef) {
|
|
11
11
|
var { type, disabled, readOnly, id, rows, autoComplete, enterKeyHint, onChange, onInput, onKeyDown, onChangeText, onSubmitEditing, onSelectionChange, onEndEditing, onContentSizeChange, onScroll, onKeyPress: onKeyPressProp, selection, keyboardAppearance, returnKeyType: returnKeyTypeProp, submitBehavior, blurOnSubmit, caretHidden, contextMenuHidden, selectTextOnFocus, secureTextEntry: secureTextEntryProp, maxFontSizeMultiplier, allowFontScaling, multiline: multilineProp, keyboardType: keyboardTypeProp, inputMode: inputModeProp, autoCapitalize: autoCapitalizeProp, autoCorrect: autoCorrectProp, autoFocusNative, textContentType, clearButtonMode, clearTextOnFocus, enablesReturnKeyAutomatically, dataDetectorTypes, scrollEnabled, passwordRules, rejectResponderTermination, spellCheck, lineBreakStrategyIOS, lineBreakModeIOS, smartInsertDelete, inputAccessoryViewID, inputAccessoryViewButtonLabel, disableKeyboardShortcuts, importantForAutofill, disableFullscreenUI, inlineImageLeft, inlineImagePadding, returnKeyLabel, textBreakStrategy, textAlignVertical, verticalAlign, showSoftInputOnFocus, numberOfLines: numberOfLinesProp, dirname, min, max, minLength, multiple, name, pattern, required, step, render, caretColor, cursorColor: cursorColorProp, selectionColor: selectionColorProp, ...rest } = props;
|
|
12
12
|
var { ref, composedRef } = useNativeInputRef(forwardedRef);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.native.js","names":[],"sources":["esm/Input.native.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport { TextInput } from \"react-native\";\nimport { createStyledHOC, styled } from \"@tamagui/core\";\nimport { registerFocusable } from \"@tamagui/focusable\";\nimport { useNativeInputRef } from \"@tamagui/element\";\nimport { styledBody } from \"./shared\";\nvar StyledInput = styled(TextInput, styledBody[0], styledBody[1]);\nvar Input = createStyledHOC(StyledInput, function(props, forwardedRef) {\n var {\n // Web props we need to convert\n type,\n disabled,\n readOnly,\n id,\n rows,\n autoComplete,\n enterKeyHint,\n // Callbacks\n onChange,\n onInput,\n onKeyDown,\n onChangeText,\n onSubmitEditing,\n onSelectionChange,\n onEndEditing,\n onContentSizeChange,\n onScroll,\n onKeyPress: onKeyPressProp,\n selection,\n // Native-only props (pass through directly)\n keyboardAppearance,\n returnKeyType: returnKeyTypeProp,\n submitBehavior,\n blurOnSubmit,\n caretHidden,\n contextMenuHidden,\n selectTextOnFocus,\n secureTextEntry: secureTextEntryProp,\n maxFontSizeMultiplier,\n allowFontScaling,\n multiline: multilineProp,\n keyboardType: keyboardTypeProp,\n inputMode: inputModeProp,\n autoCapitalize: autoCapitalizeProp,\n autoCorrect: autoCorrectProp,\n autoFocusNative,\n textContentType,\n // iOS-only props\n clearButtonMode,\n clearTextOnFocus,\n enablesReturnKeyAutomatically,\n dataDetectorTypes,\n scrollEnabled,\n passwordRules,\n rejectResponderTermination,\n spellCheck,\n lineBreakStrategyIOS,\n lineBreakModeIOS,\n smartInsertDelete,\n inputAccessoryViewID,\n inputAccessoryViewButtonLabel,\n disableKeyboardShortcuts,\n // Android-only props\n importantForAutofill,\n disableFullscreenUI,\n inlineImageLeft,\n inlineImagePadding,\n returnKeyLabel,\n textBreakStrategy,\n textAlignVertical,\n verticalAlign,\n showSoftInputOnFocus,\n numberOfLines: numberOfLinesProp,\n // Web-only props to filter out\n // @ts-ignore\n dirname,\n min,\n max,\n minLength,\n multiple,\n name,\n pattern,\n required,\n step,\n render,\n // caretColor is web-only as a CSS prop; on native forward to\n // cursorColor (Android) + selectionColor (iOS+Android caret) unless\n // those are explicitly set.\n // @ts-ignore - caretColor is typed as web-only in core\n caretColor,\n cursorColor: cursorColorProp,\n selectionColor: selectionColorProp,\n ...rest\n } = props;\n var { ref, composedRef } = useNativeInputRef(forwardedRef);\n var secureTextEntry = secureTextEntryProp !== null && secureTextEntryProp !== void 0 ? secureTextEntryProp : false;\n var keyboardType = keyboardTypeProp !== null && keyboardTypeProp !== void 0 ? keyboardTypeProp : \"default\";\n var inputMode = inputModeProp;\n if (!secureTextEntryProp && !keyboardTypeProp && !inputModeProp) {\n switch (type) {\n case \"password\":\n secureTextEntry = true;\n break;\n case \"email\":\n keyboardType = \"email-address\";\n inputMode = \"email\";\n break;\n case \"tel\":\n keyboardType = \"phone-pad\";\n inputMode = \"tel\";\n break;\n case \"number\":\n keyboardType = \"numeric\";\n inputMode = \"numeric\";\n break;\n case \"url\":\n keyboardType = \"url\";\n inputMode = \"url\";\n break;\n case \"search\":\n inputMode = \"search\";\n break;\n }\n }\n var returnKeyType = returnKeyTypeProp;\n if (!returnKeyType && enterKeyHint) {\n switch (enterKeyHint) {\n case \"done\":\n returnKeyType = \"done\";\n break;\n case \"go\":\n returnKeyType = \"go\";\n break;\n case \"next\":\n returnKeyType = \"next\";\n break;\n case \"search\":\n returnKeyType = \"search\";\n break;\n case \"send\":\n returnKeyType = \"send\";\n break;\n }\n }\n var multiline = multilineProp !== null && multilineProp !== void 0 ? multilineProp : render === \"textarea\" || rows && rows > 1;\n var numberOfLines = numberOfLinesProp !== null && numberOfLinesProp !== void 0 ? numberOfLinesProp : rows;\n var autoCorrect = autoCorrectProp === \"on\" ? true : autoCorrectProp === \"off\" ? false : autoCorrectProp;\n var autoCapitalize = autoCapitalizeProp === \"on\" ? \"sentences\" : autoCapitalizeProp === \"off\" ? \"none\" : autoCapitalizeProp;\n React.useEffect(function() {\n if (!id || disabled) return;\n return registerFocusable(id, {\n focusAndSelect: function() {\n var _ref_current;\n return (_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.focus();\n },\n focus: function() {\n var _ref_current;\n return (_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.focus();\n }\n });\n }, [\n id,\n disabled\n ]);\n var handleChangeText = function(text) {\n onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(text);\n if (onChange) {\n onChange({\n target: {\n value: text\n },\n type: \"change\"\n });\n }\n if (onInput) {\n onInput({\n target: {\n value: text\n },\n type: \"input\"\n });\n }\n };\n var handleKeyPress = function(e) {\n onKeyPressProp === null || onKeyPressProp === void 0 ? void 0 : onKeyPressProp(e);\n if (onKeyDown) {\n var { key } = e.nativeEvent;\n if (key === \"Backspace\" || key === \"Enter\" || key.length === 1) {\n onKeyDown({\n key,\n type: \"keydown\"\n });\n }\n }\n };\n var handleSubmitEditing = function(e) {\n if (onKeyDown) {\n onKeyDown({\n key: \"Enter\",\n type: \"keydown\"\n });\n }\n onSubmitEditing === null || onSubmitEditing === void 0 ? void 0 : onSubmitEditing(e);\n };\n var handleSelectionChange = function(e) {\n onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(e);\n };\n var finalProps = {\n ...rest,\n editable: !disabled && !readOnly,\n secureTextEntry,\n keyboardType,\n keyboardAppearance,\n inputMode,\n returnKeyType,\n multiline,\n numberOfLines,\n selection,\n autoComplete,\n autoFocus: autoFocusNative,\n // callbacks\n onChangeText: handleChangeText,\n onKeyPress: onKeyPressProp || onKeyDown ? handleKeyPress : void 0,\n onSubmitEditing: onKeyDown || onSubmitEditing ? handleSubmitEditing : void 0,\n onSelectionChange: onSelectionChange ? handleSelectionChange : void 0,\n onEndEditing,\n onContentSizeChange,\n onScroll,\n // cross-platform native props\n submitBehavior,\n blurOnSubmit,\n caretHidden,\n contextMenuHidden,\n selectTextOnFocus,\n maxFontSizeMultiplier,\n allowFontScaling,\n autoCapitalize,\n autoCorrect,\n textContentType,\n // iOS-only props\n clearButtonMode,\n clearTextOnFocus,\n enablesReturnKeyAutomatically,\n dataDetectorTypes,\n scrollEnabled,\n passwordRules,\n rejectResponderTermination,\n spellCheck,\n lineBreakStrategyIOS,\n lineBreakModeIOS,\n smartInsertDelete,\n inputAccessoryViewID,\n inputAccessoryViewButtonLabel,\n disableKeyboardShortcuts,\n // Android-only props\n importantForAutofill,\n disableFullscreenUI,\n inlineImageLeft,\n inlineImagePadding,\n returnKeyLabel,\n textBreakStrategy,\n textAlignVertical,\n verticalAlign,\n showSoftInputOnFocus,\n // caretColor → cursorColor (Android) + selectionColor (iOS+Android),\n // unless the caller passed those explicitly.\n cursorColor: cursorColorProp !== null && cursorColorProp !== void 0 ? cursorColorProp : caretColor,\n selectionColor: selectionColorProp !== null && selectionColorProp !== void 0 ? selectionColorProp : caretColor\n };\n return /* @__PURE__ */ _jsx(StyledInput, {\n ref: composedRef,\n ...finalProps\n });\n});\nexport {\n Input\n};\n//# sourceMappingURL=Input.native.js.map\n"],"mappings":";;;;;;;;;AAOA,IAAI,cAAc,OAAO,WAAW,WAAW,IAAI,WAAW,EAAE;AAChE,IAAI,QAAQ,gBAAgB,aAAa,SAAS,OAAO,cAAc;CACrE,IAAI,EAEF,MACA,UACA,UACA,IACA,MACA,cACA,cAEA,UACA,SACA,WACA,cACA,iBACA,mBACA,cACA,qBACA,UACA,YAAY,gBACZ,WAEA,oBACA,eAAe,mBACf,gBACA,cACA,aACA,mBACA,mBACA,iBAAiB,qBACjB,uBACA,kBACA,WAAW,eACX,cAAc,kBACd,WAAW,eACX,gBAAgB,oBAChB,aAAa,iBACb,iBACA,iBAEA,iBACA,kBACA,+BACA,mBACA,eACA,eACA,4BACA,YACA,sBACA,kBACA,mBACA,sBACA,+BACA,0BAEA,sBACA,qBACA,iBACA,oBACA,gBACA,mBACA,mBACA,eACA,sBACA,eAAe,mBAGf,SACA,KACA,KACA,WACA,UACA,MACA,SACA,UACA,MACA,QAKA,YACA,aAAa,iBACb,gBAAgB,oBAChB,GAAG,SACD;CACJ,IAAI,EAAE,KAAK,gBAAgB,kBAAkB,YAAY;CACzD,IAAI,kBAAkB,wBAAwB,QAAQ,wBAAwB,KAAK,IAAI,sBAAsB;CAC7G,IAAI,eAAe,qBAAqB,QAAQ,qBAAqB,KAAK,IAAI,mBAAmB;CACjG,IAAI,YAAY;CAChB,IAAI,CAAC,uBAAuB,CAAC,oBAAoB,CAAC,eAAe;EAC/D,QAAQ,MAAR;GACE,KAAK;IACH,kBAAkB;IAClB;GACF,KAAK;IACH,eAAe;IACf,YAAY;IACZ;GACF,KAAK;IACH,eAAe;IACf,YAAY;IACZ;GACF,KAAK;IACH,eAAe;IACf,YAAY;IACZ;GACF,KAAK;IACH,eAAe;IACf,YAAY;IACZ;GACF,KAAK;IACH,YAAY;IACZ;EACJ;CACF;CACA,IAAI,gBAAgB;CACpB,IAAI,CAAC,iBAAiB,cAAc;EAClC,QAAQ,cAAR;GACE,KAAK;IACH,gBAAgB;IAChB;GACF,KAAK;IACH,gBAAgB;IAChB;GACF,KAAK;IACH,gBAAgB;IAChB;GACF,KAAK;IACH,gBAAgB;IAChB;GACF,KAAK;IACH,gBAAgB;IAChB;EACJ;CACF;CACA,IAAI,YAAY,kBAAkB,QAAQ,kBAAkB,KAAK,IAAI,gBAAgB,WAAW,cAAc,QAAQ,OAAO;CAC7H,IAAI,gBAAgB,sBAAsB,QAAQ,sBAAsB,KAAK,IAAI,oBAAoB;CACrG,IAAI,cAAc,oBAAoB,OAAO,OAAO,oBAAoB,QAAQ,QAAQ;CACxF,IAAI,iBAAiB,uBAAuB,OAAO,cAAc,uBAAuB,QAAQ,SAAS;CACzG,MAAM,UAAU,WAAW;EACzB,IAAI,CAAC,MAAM,UAAU;EACrB,OAAO,kBAAkB,IAAI;GAC3B,gBAAgB,WAAW;IACzB,IAAI;IACJ,QAAQ,eAAe,IAAI,aAAa,QAAQ,iBAAiB,KAAK,IAAI,KAAK,IAAI,aAAa,MAAM;GACxG;GACA,OAAO,WAAW;IAChB,IAAI;IACJ,QAAQ,eAAe,IAAI,aAAa,QAAQ,iBAAiB,KAAK,IAAI,KAAK,IAAI,aAAa,MAAM;GACxG;EACF,CAAC;CACH,GAAG,CACD,IACA,QACF,CAAC;CACD,IAAI,mBAAmB,SAAS,MAAM;EACpC,iBAAiB,QAAQ,iBAAiB,KAAK,IAAI,KAAK,IAAI,aAAa,IAAI;EAC7E,IAAI,UAAU;GACZ,SAAS;IACP,QAAQ,EACN,OAAO,KACT;IACA,MAAM;GACR,CAAC;EACH;EACA,IAAI,SAAS;GACX,QAAQ;IACN,QAAQ,EACN,OAAO,KACT;IACA,MAAM;GACR,CAAC;EACH;CACF;CACA,IAAI,iBAAiB,SAAS,GAAG;EAC/B,mBAAmB,QAAQ,mBAAmB,KAAK,IAAI,KAAK,IAAI,eAAe,CAAC;EAChF,IAAI,WAAW;GACb,IAAI,EAAE,QAAQ,EAAE;GAChB,IAAI,QAAQ,eAAe,QAAQ,WAAW,IAAI,WAAW,GAAG;IAC9D,UAAU;KACR;KACA,MAAM;IACR,CAAC;GACH;EACF;CACF;CACA,IAAI,sBAAsB,SAAS,GAAG;EACpC,IAAI,WAAW;GACb,UAAU;IACR,KAAK;IACL,MAAM;GACR,CAAC;EACH;EACA,oBAAoB,QAAQ,oBAAoB,KAAK,IAAI,KAAK,IAAI,gBAAgB,CAAC;CACrF;CACA,IAAI,wBAAwB,SAAS,GAAG;EACtC,sBAAsB,QAAQ,sBAAsB,KAAK,IAAI,KAAK,IAAI,kBAAkB,CAAC;CAC3F;CACA,IAAI,aAAa;EACf,GAAG;EACH,UAAU,CAAC,YAAY,CAAC;EACxB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;EAEX,cAAc;EACd,YAAY,kBAAkB,YAAY,iBAAiB,KAAK;EAChE,iBAAiB,aAAa,kBAAkB,sBAAsB,KAAK;EAC3E,mBAAmB,oBAAoB,wBAAwB,KAAK;EACpE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA,aAAa,oBAAoB,QAAQ,oBAAoB,KAAK,IAAI,kBAAkB;EACxF,gBAAgB,uBAAuB,QAAQ,uBAAuB,KAAK,IAAI,qBAAqB;CACtG;CACA,OAAuB,oBAAK,aAAa;EACvC,KAAK;EACL,GAAG;CACL,CAAC;AACH,CAAC"}
|
|
1
|
+
{"version":3,"file":"Input.native.js","names":[],"sources":["esm/Input.native.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport { TextInput } from \"react-native\";\nimport { createStyledHOC, styled } from \"@tamagui/core\";\nimport { registerFocusable } from \"@tamagui/focusable\";\nimport { useNativeInputRef } from \"@tamagui/element\";\nimport { resolveMultilineInputSize, styledBody } from \"./shared\";\nvar StyledInput = styled(TextInput, styledBody[0], styledBody[1]).resolve(resolveMultilineInputSize);\nvar Input = createStyledHOC(StyledInput, function(props, forwardedRef) {\n var {\n // Web props we need to convert\n type,\n disabled,\n readOnly,\n id,\n rows,\n autoComplete,\n enterKeyHint,\n // Callbacks\n onChange,\n onInput,\n onKeyDown,\n onChangeText,\n onSubmitEditing,\n onSelectionChange,\n onEndEditing,\n onContentSizeChange,\n onScroll,\n onKeyPress: onKeyPressProp,\n selection,\n // Native-only props (pass through directly)\n keyboardAppearance,\n returnKeyType: returnKeyTypeProp,\n submitBehavior,\n blurOnSubmit,\n caretHidden,\n contextMenuHidden,\n selectTextOnFocus,\n secureTextEntry: secureTextEntryProp,\n maxFontSizeMultiplier,\n allowFontScaling,\n multiline: multilineProp,\n keyboardType: keyboardTypeProp,\n inputMode: inputModeProp,\n autoCapitalize: autoCapitalizeProp,\n autoCorrect: autoCorrectProp,\n autoFocusNative,\n textContentType,\n // iOS-only props\n clearButtonMode,\n clearTextOnFocus,\n enablesReturnKeyAutomatically,\n dataDetectorTypes,\n scrollEnabled,\n passwordRules,\n rejectResponderTermination,\n spellCheck,\n lineBreakStrategyIOS,\n lineBreakModeIOS,\n smartInsertDelete,\n inputAccessoryViewID,\n inputAccessoryViewButtonLabel,\n disableKeyboardShortcuts,\n // Android-only props\n importantForAutofill,\n disableFullscreenUI,\n inlineImageLeft,\n inlineImagePadding,\n returnKeyLabel,\n textBreakStrategy,\n textAlignVertical,\n verticalAlign,\n showSoftInputOnFocus,\n numberOfLines: numberOfLinesProp,\n // Web-only props to filter out\n // @ts-ignore\n dirname,\n min,\n max,\n minLength,\n multiple,\n name,\n pattern,\n required,\n step,\n render,\n // caretColor is web-only as a CSS prop; on native forward to\n // cursorColor (Android) + selectionColor (iOS+Android caret) unless\n // those are explicitly set.\n // @ts-ignore - caretColor is typed as web-only in core\n caretColor,\n cursorColor: cursorColorProp,\n selectionColor: selectionColorProp,\n ...rest\n } = props;\n var { ref, composedRef } = useNativeInputRef(forwardedRef);\n var secureTextEntry = secureTextEntryProp !== null && secureTextEntryProp !== void 0 ? secureTextEntryProp : false;\n var keyboardType = keyboardTypeProp !== null && keyboardTypeProp !== void 0 ? keyboardTypeProp : \"default\";\n var inputMode = inputModeProp;\n if (!secureTextEntryProp && !keyboardTypeProp && !inputModeProp) {\n switch (type) {\n case \"password\":\n secureTextEntry = true;\n break;\n case \"email\":\n keyboardType = \"email-address\";\n inputMode = \"email\";\n break;\n case \"tel\":\n keyboardType = \"phone-pad\";\n inputMode = \"tel\";\n break;\n case \"number\":\n keyboardType = \"numeric\";\n inputMode = \"numeric\";\n break;\n case \"url\":\n keyboardType = \"url\";\n inputMode = \"url\";\n break;\n case \"search\":\n inputMode = \"search\";\n break;\n }\n }\n var returnKeyType = returnKeyTypeProp;\n if (!returnKeyType && enterKeyHint) {\n switch (enterKeyHint) {\n case \"done\":\n returnKeyType = \"done\";\n break;\n case \"go\":\n returnKeyType = \"go\";\n break;\n case \"next\":\n returnKeyType = \"next\";\n break;\n case \"search\":\n returnKeyType = \"search\";\n break;\n case \"send\":\n returnKeyType = \"send\";\n break;\n }\n }\n var multiline = multilineProp !== null && multilineProp !== void 0 ? multilineProp : render === \"textarea\" || rows && rows > 1;\n var numberOfLines = numberOfLinesProp !== null && numberOfLinesProp !== void 0 ? numberOfLinesProp : rows;\n var autoCorrect = autoCorrectProp === \"on\" ? true : autoCorrectProp === \"off\" ? false : autoCorrectProp;\n var autoCapitalize = autoCapitalizeProp === \"on\" ? \"sentences\" : autoCapitalizeProp === \"off\" ? \"none\" : autoCapitalizeProp;\n React.useEffect(function() {\n if (!id || disabled) return;\n return registerFocusable(id, {\n focusAndSelect: function() {\n var _ref_current;\n return (_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.focus();\n },\n focus: function() {\n var _ref_current;\n return (_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.focus();\n }\n });\n }, [\n id,\n disabled\n ]);\n var handleChangeText = function(text) {\n onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(text);\n if (onChange) {\n onChange({\n target: {\n value: text\n },\n type: \"change\"\n });\n }\n if (onInput) {\n onInput({\n target: {\n value: text\n },\n type: \"input\"\n });\n }\n };\n var handleKeyPress = function(e) {\n onKeyPressProp === null || onKeyPressProp === void 0 ? void 0 : onKeyPressProp(e);\n if (onKeyDown) {\n var { key } = e.nativeEvent;\n if (key === \"Backspace\" || key === \"Enter\" || key.length === 1) {\n onKeyDown({\n key,\n type: \"keydown\"\n });\n }\n }\n };\n var handleSubmitEditing = function(e) {\n if (onKeyDown) {\n onKeyDown({\n key: \"Enter\",\n type: \"keydown\"\n });\n }\n onSubmitEditing === null || onSubmitEditing === void 0 ? void 0 : onSubmitEditing(e);\n };\n var handleSelectionChange = function(e) {\n onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(e);\n };\n var finalProps = {\n ...rest,\n editable: !disabled && !readOnly,\n secureTextEntry,\n keyboardType,\n keyboardAppearance,\n inputMode,\n returnKeyType,\n multiline,\n numberOfLines,\n selection,\n autoComplete,\n autoFocus: autoFocusNative,\n // callbacks\n onChangeText: handleChangeText,\n onKeyPress: onKeyPressProp || onKeyDown ? handleKeyPress : void 0,\n onSubmitEditing: onKeyDown || onSubmitEditing ? handleSubmitEditing : void 0,\n onSelectionChange: onSelectionChange ? handleSelectionChange : void 0,\n onEndEditing,\n onContentSizeChange,\n onScroll,\n // cross-platform native props\n submitBehavior,\n blurOnSubmit,\n caretHidden,\n contextMenuHidden,\n selectTextOnFocus,\n maxFontSizeMultiplier,\n allowFontScaling,\n autoCapitalize,\n autoCorrect,\n textContentType,\n // iOS-only props\n clearButtonMode,\n clearTextOnFocus,\n enablesReturnKeyAutomatically,\n dataDetectorTypes,\n scrollEnabled,\n passwordRules,\n rejectResponderTermination,\n spellCheck,\n lineBreakStrategyIOS,\n lineBreakModeIOS,\n smartInsertDelete,\n inputAccessoryViewID,\n inputAccessoryViewButtonLabel,\n disableKeyboardShortcuts,\n // Android-only props\n importantForAutofill,\n disableFullscreenUI,\n inlineImageLeft,\n inlineImagePadding,\n returnKeyLabel,\n textBreakStrategy,\n textAlignVertical,\n verticalAlign,\n showSoftInputOnFocus,\n // caretColor → cursorColor (Android) + selectionColor (iOS+Android),\n // unless the caller passed those explicitly.\n cursorColor: cursorColorProp !== null && cursorColorProp !== void 0 ? cursorColorProp : caretColor,\n selectionColor: selectionColorProp !== null && selectionColorProp !== void 0 ? selectionColorProp : caretColor\n };\n return /* @__PURE__ */ _jsx(StyledInput, {\n ref: composedRef,\n ...finalProps\n });\n});\nexport {\n Input\n};\n//# sourceMappingURL=Input.native.js.map\n"],"mappings":"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"}
|
package/dist/esm/TextArea.mjs
CHANGED
|
@@ -1,19 +1,17 @@
|
|
|
1
1
|
import { styled } from "@tamagui/web";
|
|
2
2
|
import { Input } from "./Input.mjs";
|
|
3
|
-
import { defaultStyles, textAreaSizeVariant } from "./shared.mjs";
|
|
3
|
+
import { defaultStyles, resolveTextAreaSize, textAreaSizeVariant } from "./shared.mjs";
|
|
4
4
|
|
|
5
|
-
const
|
|
5
|
+
const TextAreaFrame = styled(Input, {
|
|
6
6
|
displayName: "TextArea",
|
|
7
7
|
render: "textarea",
|
|
8
8
|
whiteSpace: "pre-wrap",
|
|
9
9
|
height: "auto",
|
|
10
10
|
...defaultStyles,
|
|
11
11
|
rows: 3,
|
|
12
|
-
variants: { size:
|
|
13
|
-
true: textAreaSizeVariant,
|
|
14
|
-
Size: textAreaSizeVariant
|
|
15
|
-
} }
|
|
12
|
+
variants: { size: textAreaSizeVariant }
|
|
16
13
|
});
|
|
14
|
+
const TextArea = TextAreaFrame.resolve(resolveTextAreaSize);
|
|
17
15
|
|
|
18
16
|
export { TextArea };
|
|
19
17
|
//# sourceMappingURL=TextArea.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","names":[],"sources":["esm/TextArea.js"],"sourcesContent":["import { styled } from \"@tamagui/web\";\nimport { Input } from \"./Input\";\nimport { defaultStyles, textAreaSizeVariant } from \"./shared\";\nconst
|
|
1
|
+
{"version":3,"file":"TextArea.js","names":[],"sources":["esm/TextArea.js"],"sourcesContent":["import { styled } from \"@tamagui/web\";\nimport { Input } from \"./Input\";\nimport { defaultStyles, resolveTextAreaSize, textAreaSizeVariant } from \"./shared\";\nconst TextAreaFrame = styled(Input, {\n displayName: \"TextArea\",\n render: \"textarea\",\n // this attribute fixes firefox newline issue\n // @ts-ignore\n whiteSpace: \"pre-wrap\",\n height: \"auto\",\n ...defaultStyles,\n rows: 3,\n variants: {\n size: textAreaSizeVariant\n }\n});\nconst TextArea = TextAreaFrame.resolve(resolveTextAreaSize);\nexport {\n TextArea\n};\n//# sourceMappingURL=TextArea.js.map\n"],"mappings":";;;;;AAGA,MAAM,gBAAgB,OAAO,OAAO;CAClC,aAAa;CACb,QAAQ;CAGR,YAAY;CACZ,QAAQ;CACR,GAAG;CACH,MAAM;CACN,UAAU,EACR,MAAM,oBACR;AACF,CAAC;AACD,MAAM,WAAW,cAAc,QAAQ,mBAAmB"}
|
|
@@ -1,19 +1,17 @@
|
|
|
1
1
|
import { styled } from "@tamagui/web";
|
|
2
2
|
import { Input } from "./Input.native.js";
|
|
3
|
-
import { defaultStyles, textAreaSizeVariant } from "./shared.native.js";
|
|
3
|
+
import { defaultStyles, resolveTextAreaSize, textAreaSizeVariant } from "./shared.native.js";
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var TextAreaFrame = styled(Input, {
|
|
6
6
|
displayName: "TextArea",
|
|
7
7
|
render: "textarea",
|
|
8
8
|
whiteSpace: "pre-wrap",
|
|
9
9
|
height: "auto",
|
|
10
10
|
...defaultStyles,
|
|
11
11
|
rows: 3,
|
|
12
|
-
variants: { size:
|
|
13
|
-
true: textAreaSizeVariant,
|
|
14
|
-
Size: textAreaSizeVariant
|
|
15
|
-
} }
|
|
12
|
+
variants: { size: textAreaSizeVariant }
|
|
16
13
|
});
|
|
14
|
+
var TextArea = TextAreaFrame.resolve(resolveTextAreaSize);
|
|
17
15
|
|
|
18
16
|
export { TextArea };
|
|
19
17
|
//# sourceMappingURL=TextArea.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.native.js","names":[],"sources":["esm/TextArea.native.js"],"sourcesContent":["import { styled } from \"@tamagui/web\";\nimport { Input } from \"./Input\";\nimport { defaultStyles, textAreaSizeVariant } from \"./shared\";\nvar
|
|
1
|
+
{"version":3,"file":"TextArea.native.js","names":[],"sources":["esm/TextArea.native.js"],"sourcesContent":["import { styled } from \"@tamagui/web\";\nimport { Input } from \"./Input\";\nimport { defaultStyles, resolveTextAreaSize, textAreaSizeVariant } from \"./shared\";\nvar TextAreaFrame = styled(Input, {\n displayName: \"TextArea\",\n render: \"textarea\",\n // this attribute fixes firefox newline issue\n // @ts-ignore\n whiteSpace: \"pre-wrap\",\n height: \"auto\",\n ...defaultStyles,\n rows: 3,\n variants: {\n size: textAreaSizeVariant\n }\n});\nvar TextArea = TextAreaFrame.resolve(resolveTextAreaSize);\nexport {\n TextArea\n};\n//# sourceMappingURL=TextArea.js.map\n"],"mappings":";;;;;AAGA,IAAI,gBAAgB,OAAO,OAAO;CAChC,aAAa;CACb,QAAQ;CAGR,YAAY;CACZ,QAAQ;CACR,GAAG;CACH,MAAM;CACN,UAAU,EACR,MAAM,oBACR;AACF,CAAC;AACD,IAAI,WAAW,cAAc,QAAQ,mBAAmB"}
|
package/dist/esm/shared.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { getVariableValue, isWeb, resolveTokenSize, styled } from "@tamagui/core";
|
|
2
2
|
import { getFontSized } from "@tamagui/get-font-sized";
|
|
3
3
|
|
|
4
4
|
const defaultStyles = {
|
|
@@ -7,9 +7,9 @@ const defaultStyles = {
|
|
|
7
7
|
tabIndex: 0,
|
|
8
8
|
minWidth: 0
|
|
9
9
|
};
|
|
10
|
-
const resolveInputFrame = (val,
|
|
11
|
-
tokens:
|
|
12
|
-
font:
|
|
10
|
+
const resolveInputFrame = (val, env) => resolveTokenSize(val, {
|
|
11
|
+
tokens: env.tokens,
|
|
12
|
+
font: env.font
|
|
13
13
|
}).frame;
|
|
14
14
|
const inputSizeKeys = [
|
|
15
15
|
"0",
|
|
@@ -41,70 +41,83 @@ const inputSizeKeys = [
|
|
|
41
41
|
"19",
|
|
42
42
|
"20"
|
|
43
43
|
];
|
|
44
|
-
const getInputPadding = (val,
|
|
44
|
+
const getInputPadding = (val, env, steps) => {
|
|
45
45
|
if (typeof val === "number") {
|
|
46
46
|
return steps === 1 ? Math.max(0, Math.round(val * .6 - 12)) : Math.max(0, Math.round(val * .52 - 11.5));
|
|
47
47
|
}
|
|
48
48
|
const key = val === true ? "4" : val;
|
|
49
49
|
const index = inputSizeKeys.indexOf(key);
|
|
50
|
-
return
|
|
50
|
+
return env.tokens.space[inputSizeKeys[Math.max(0, index - steps)]];
|
|
51
51
|
};
|
|
52
|
-
const inputSizeVariant = (val = true,
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
const frame = resolveInputFrame(val, extras);
|
|
57
|
-
const fontStyle = getFontSized(val, extras);
|
|
58
|
-
if (!isWeb && fontStyle) {
|
|
59
|
-
delete fontStyle["lineHeight"];
|
|
60
|
-
}
|
|
52
|
+
const inputSizeVariant = styled.dynamic((val = true, env) => {
|
|
53
|
+
const frame = resolveInputFrame(val, env);
|
|
54
|
+
const fontStyle = getFontSized(val, env);
|
|
61
55
|
return {
|
|
62
|
-
|
|
56
|
+
color: fontStyle?.color,
|
|
57
|
+
fontFamily: fontStyle?.fontFamily,
|
|
58
|
+
fontSize: fontStyle?.fontSize,
|
|
59
|
+
fontStyle: fontStyle?.fontStyle,
|
|
60
|
+
fontWeight: fontStyle?.fontWeight,
|
|
61
|
+
letterSpacing: fontStyle?.letterSpacing,
|
|
62
|
+
lineHeight: isWeb ? fontStyle?.lineHeight : void 0,
|
|
63
|
+
textTransform: fontStyle?.textTransform,
|
|
63
64
|
height: frame.size,
|
|
64
65
|
borderRadius: frame.radius,
|
|
65
|
-
paddingHorizontal: getInputPadding(val,
|
|
66
|
+
paddingHorizontal: getInputPadding(val, env, 1)
|
|
66
67
|
};
|
|
67
|
-
};
|
|
68
|
-
const textAreaSizeVariant = (val = true,
|
|
69
|
-
const
|
|
70
|
-
const
|
|
71
|
-
const fontStyle = getFontSized(val, extras);
|
|
72
|
-
const lines = props.rows ?? props.numberOfLines;
|
|
73
|
-
const height = typeof lines === "number" ? lines * getVariableValue(fontStyle.lineHeight) : "auto";
|
|
74
|
-
if (!isWeb && fontStyle) {
|
|
75
|
-
delete fontStyle["lineHeight"];
|
|
76
|
-
}
|
|
68
|
+
});
|
|
69
|
+
const textAreaSizeVariant = styled.dynamic((val = true, env) => {
|
|
70
|
+
const frame = resolveInputFrame(val, env);
|
|
71
|
+
const fontStyle = getFontSized(val, env);
|
|
77
72
|
return {
|
|
78
73
|
borderRadius: frame.radius,
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
74
|
+
color: fontStyle?.color,
|
|
75
|
+
fontFamily: fontStyle?.fontFamily,
|
|
76
|
+
fontSize: fontStyle?.fontSize,
|
|
77
|
+
fontStyle: fontStyle?.fontStyle,
|
|
78
|
+
fontWeight: fontStyle?.fontWeight,
|
|
79
|
+
letterSpacing: fontStyle?.letterSpacing,
|
|
80
|
+
lineHeight: isWeb ? fontStyle?.lineHeight : void 0,
|
|
81
|
+
textTransform: fontStyle?.textTransform,
|
|
82
|
+
paddingVertical: getInputPadding(val, env, 2),
|
|
83
|
+
paddingHorizontal: getInputPadding(val, env, 1),
|
|
84
|
+
height: "auto"
|
|
85
|
+
};
|
|
86
|
+
});
|
|
87
|
+
const resolveTextAreaSize = (props, env) => {
|
|
88
|
+
const sized = textAreaSizeVariant(props.size ?? true, env);
|
|
89
|
+
const fontStyle = getFontSized(props.size ?? true, env);
|
|
90
|
+
const lines = props.rows ?? props.numberOfLines;
|
|
91
|
+
const height = typeof lines === "number" ? lines * getVariableValue(fontStyle?.lineHeight) : sized?.height;
|
|
92
|
+
return {
|
|
93
|
+
borderRadius: sized?.borderRadius,
|
|
94
|
+
color: sized?.color,
|
|
95
|
+
fontFamily: sized?.fontFamily,
|
|
96
|
+
fontSize: sized?.fontSize,
|
|
97
|
+
fontStyle: sized?.fontStyle,
|
|
98
|
+
fontWeight: sized?.fontWeight,
|
|
99
|
+
letterSpacing: sized?.letterSpacing,
|
|
100
|
+
lineHeight: sized?.lineHeight,
|
|
101
|
+
textTransform: sized?.textTransform,
|
|
102
|
+
paddingVertical: sized?.paddingVertical,
|
|
103
|
+
paddingHorizontal: sized?.paddingHorizontal,
|
|
82
104
|
height
|
|
83
105
|
};
|
|
84
106
|
};
|
|
107
|
+
const resolveMultilineInputSize = (props, env) => {
|
|
108
|
+
if (!(props.rows > 1 || props.multiline || props.numberOfLines > 1)) return;
|
|
109
|
+
return resolveTextAreaSize(props, env);
|
|
110
|
+
};
|
|
85
111
|
const INPUT_NAME = "Input";
|
|
86
112
|
const styledBody = [{
|
|
87
113
|
name: INPUT_NAME,
|
|
88
114
|
render: "input",
|
|
89
115
|
...defaultStyles,
|
|
90
116
|
variants: {
|
|
91
|
-
size:
|
|
92
|
-
true: inputSizeVariant,
|
|
93
|
-
Size: inputSizeVariant
|
|
94
|
-
},
|
|
117
|
+
size: inputSizeVariant,
|
|
95
118
|
disabled: { true: {} }
|
|
96
119
|
}
|
|
97
|
-
}, {
|
|
98
|
-
isInput: true,
|
|
99
|
-
accept: {
|
|
100
|
-
placeholderTextColor: "color",
|
|
101
|
-
selectionColor: "color",
|
|
102
|
-
cursorColor: "color",
|
|
103
|
-
selectionHandleColor: "color",
|
|
104
|
-
underlineColorAndroid: "color"
|
|
105
|
-
},
|
|
106
|
-
validStyles: Text.staticConfig.validStyles
|
|
107
|
-
}];
|
|
120
|
+
}, { isInput: true }];
|
|
108
121
|
|
|
109
|
-
export { INPUT_NAME, defaultStyles, inputSizeVariant, styledBody, textAreaSizeVariant };
|
|
122
|
+
export { INPUT_NAME, defaultStyles, inputSizeVariant, resolveMultilineInputSize, resolveTextAreaSize, styledBody, textAreaSizeVariant };
|
|
110
123
|
//# sourceMappingURL=shared.mjs.map
|
package/dist/esm/shared.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.js","names":[],"sources":["esm/shared.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"shared.js","names":[],"sources":["esm/shared.js"],"sourcesContent":["import { getVariableValue, isWeb, resolveTokenSize, styled } from \"@tamagui/core\";\nimport { getFontSized } from \"@tamagui/get-font-sized\";\nconst defaultStyles = {\n size: true,\n outlineWidth: 0,\n tabIndex: 0,\n // this fixes a flex bug where it overflows container\n minWidth: 0\n};\nconst resolveInputFrame = (val, env) => resolveTokenSize(val, { tokens: env.tokens, font: env.font }).frame;\nconst inputSizeKeys = [\n \"0\",\n \"0-25\",\n \"0-5\",\n \"0-75\",\n \"1\",\n \"1-5\",\n \"2\",\n \"2-5\",\n \"3\",\n \"3-5\",\n \"4\",\n \"4-5\",\n \"5\",\n \"6\",\n \"7\",\n \"8\",\n \"9\",\n \"10\",\n \"11\",\n \"12\",\n \"13\",\n \"14\",\n \"15\",\n \"16\",\n \"17\",\n \"18\",\n \"19\",\n \"20\"\n];\nconst getInputPadding = (val, env, steps) => {\n if (typeof val === \"number\") {\n return steps === 1 ? Math.max(0, Math.round(val * 0.6 - 12)) : Math.max(0, Math.round(val * 0.52 - 11.5));\n }\n const key = val === true ? \"4\" : val;\n const index = inputSizeKeys.indexOf(key);\n return env.tokens.space[inputSizeKeys[Math.max(0, index - steps)]];\n};\nconst inputSizeVariant = styled.dynamic((val = true, env) => {\n const frame = resolveInputFrame(val, env);\n const fontStyle = getFontSized(val, env);\n return {\n color: fontStyle?.color,\n fontFamily: fontStyle?.fontFamily,\n fontSize: fontStyle?.fontSize,\n fontStyle: fontStyle?.fontStyle,\n fontWeight: fontStyle?.fontWeight,\n letterSpacing: fontStyle?.letterSpacing,\n lineHeight: isWeb ? fontStyle?.lineHeight : void 0,\n textTransform: fontStyle?.textTransform,\n height: frame.size,\n borderRadius: frame.radius,\n paddingHorizontal: getInputPadding(val, env, 1)\n };\n});\nconst textAreaSizeVariant = styled.dynamic((val = true, env) => {\n const frame = resolveInputFrame(val, env);\n const fontStyle = getFontSized(val, env);\n return {\n borderRadius: frame.radius,\n color: fontStyle?.color,\n fontFamily: fontStyle?.fontFamily,\n fontSize: fontStyle?.fontSize,\n fontStyle: fontStyle?.fontStyle,\n fontWeight: fontStyle?.fontWeight,\n letterSpacing: fontStyle?.letterSpacing,\n lineHeight: isWeb ? fontStyle?.lineHeight : void 0,\n textTransform: fontStyle?.textTransform,\n paddingVertical: getInputPadding(val, env, 2),\n paddingHorizontal: getInputPadding(val, env, 1),\n height: \"auto\"\n };\n});\nconst resolveTextAreaSize = (props, env) => {\n const sized = textAreaSizeVariant(props.size ?? true, env);\n const fontStyle = getFontSized(props.size ?? true, env);\n const lines = props.rows ?? props.numberOfLines;\n const height = typeof lines === \"number\" ? lines * getVariableValue(fontStyle?.lineHeight) : sized?.height;\n return {\n borderRadius: sized?.borderRadius,\n color: sized?.color,\n fontFamily: sized?.fontFamily,\n fontSize: sized?.fontSize,\n fontStyle: sized?.fontStyle,\n fontWeight: sized?.fontWeight,\n letterSpacing: sized?.letterSpacing,\n lineHeight: sized?.lineHeight,\n textTransform: sized?.textTransform,\n paddingVertical: sized?.paddingVertical,\n paddingHorizontal: sized?.paddingHorizontal,\n height\n };\n};\nconst resolveMultilineInputSize = (props, env) => {\n if (!(props.rows > 1 || props.multiline || props.numberOfLines > 1)) return;\n return resolveTextAreaSize(props, env);\n};\nconst INPUT_NAME = \"Input\";\nconst styledBody = [\n {\n name: INPUT_NAME,\n render: \"input\",\n ...defaultStyles,\n variants: {\n size: inputSizeVariant,\n disabled: {\n true: {}\n }\n }\n },\n {\n isInput: true\n }\n];\nexport {\n INPUT_NAME,\n defaultStyles,\n inputSizeVariant,\n resolveMultilineInputSize,\n resolveTextAreaSize,\n styledBody,\n textAreaSizeVariant\n};\n//# sourceMappingURL=shared.js.map\n"],"mappings":"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"}
|