@xaui/native 0.9.1-alpha.35 → 0.9.1-alpha.36
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/{chunk-I66VMLHE.cjs → chunk-2L7FOIWY.cjs} +21 -21
- package/dist/{chunk-VSALV7VO.cjs → chunk-2LNE4PWB.cjs} +2 -2
- package/dist/{chunk-HVD5EX7V.js → chunk-2OZPOWFB.js} +1 -1
- package/dist/{chunk-6M7RUU7V.cjs → chunk-2SCE7TFZ.cjs} +64 -64
- package/dist/{chunk-L55CDXNI.js → chunk-3YZSUDZ2.js} +108 -102
- package/dist/{chunk-NLASSGA7.js → chunk-4XFEEBPU.js} +10 -2
- package/dist/{chunk-4SLOOIE5.cjs → chunk-5BNIIDQD.cjs} +2 -2
- package/dist/{chunk-HXL2QCMR.js → chunk-5GMU7ESV.js} +14 -14
- package/dist/{chunk-Q3D6KIVF.cjs → chunk-6N5ZCEAB.cjs} +104 -98
- package/dist/{chunk-GBFQZQ77.js → chunk-6U5IUUAR.js} +2 -2
- package/dist/{chunk-XWMB66ZM.cjs → chunk-ADQVA2FQ.cjs} +2 -2
- package/dist/{chunk-YUG22AXX.cjs → chunk-AQXNEV6J.cjs} +16 -16
- package/dist/{chunk-CNNLMMFV.cjs → chunk-AZRMOWRG.cjs} +6 -6
- package/dist/{chunk-JCYWU5TO.js → chunk-B6OKVLC7.js} +1 -1
- package/dist/{chunk-M2BGCN77.js → chunk-BAPXLO5N.js} +4 -4
- package/dist/{chunk-MHEL3NAN.js → chunk-CVCE7TW5.js} +53 -53
- package/dist/{chunk-BA2MPBCO.js → chunk-DL2PGB5G.js} +58 -58
- package/dist/{chunk-NFFL3E4N.js → chunk-DOLWSO7A.js} +2 -2
- package/dist/{chunk-ZA6RT3XQ.js → chunk-E5ZW7MBW.js} +16 -16
- package/dist/{chunk-K7LLERKT.cjs → chunk-EFPWXJAJ.cjs} +11 -11
- package/dist/{chunk-GGW42MY4.js → chunk-FJ5TLRT3.js} +2 -1
- package/dist/{chunk-CYS6U374.cjs → chunk-FVKIQBHS.cjs} +4 -4
- package/dist/{chunk-PBR44KVV.cjs → chunk-FYCDRRJ2.cjs} +22 -22
- package/dist/{chunk-DBXFFJTC.cjs → chunk-GHKJ6MUH.cjs} +8 -8
- package/dist/{chunk-QY4MN7X3.cjs → chunk-GPZSTEEI.cjs} +12 -12
- package/dist/{chunk-OHEHPQLC.cjs → chunk-HQVVQGYV.cjs} +2 -2
- package/dist/{chunk-MC7SY2QH.cjs → chunk-HT7H35GU.cjs} +2 -1
- package/dist/{chunk-PCWT2YBE.cjs → chunk-ISPOIMGX.cjs} +2 -2
- package/dist/{chunk-TZG3DERP.js → chunk-JB5XANQY.js} +1 -1
- package/dist/{chunk-I6ZB3FZI.cjs → chunk-K3AVOT6L.cjs} +2 -2
- package/dist/{chunk-AYOVBZAX.js → chunk-K7GAHNMJ.js} +3 -3
- package/dist/{chunk-2IWL6R3D.js → chunk-KZVHC4FL.js} +3 -3
- package/dist/{chunk-AOEXU5UV.cjs → chunk-LCDHTLSG.cjs} +3 -3
- package/dist/{chunk-UORTYL63.cjs → chunk-MFXZHLOU.cjs} +11 -11
- package/dist/{chunk-MSMZBUZO.cjs → chunk-N2U63JUX.cjs} +6 -6
- package/dist/{chunk-SLUJFE6R.js → chunk-OMV5MUTM.js} +15 -15
- package/dist/{chunk-MEYCZS32.js → chunk-OSCW7I4H.js} +1 -1
- package/dist/{chunk-WJPQARJ5.js → chunk-OWE5IID7.js} +1 -1
- package/dist/{chunk-DUQUCOUY.cjs → chunk-PGQWUASE.cjs} +2 -2
- package/dist/{chunk-LZK77LFX.js → chunk-QZO57TPX.js} +1 -1
- package/dist/{chunk-7CTIE42J.cjs → chunk-RPOKLFRB.cjs} +16 -8
- package/dist/{chunk-U3RDU3HU.js → chunk-RSGIJ6RI.js} +2 -2
- package/dist/{chunk-UR6DNU2M.js → chunk-SAGMDVFU.js} +2 -2
- package/dist/{chunk-CM4LI5OH.cjs → chunk-TE7KVFE4.cjs} +9 -9
- package/dist/{chunk-NMAZ2TQF.js → chunk-U3HFQHGZ.js} +1 -1
- package/dist/{chunk-XNNJM5DQ.js → chunk-UCW25LL6.js} +75 -75
- package/dist/{chunk-ZC35YYKS.js → chunk-V5IVMZQJ.js} +1 -1
- package/dist/{chunk-HNW4HIMO.js → chunk-VWATEE5O.js} +15 -15
- package/dist/{chunk-TVCS5UOE.cjs → chunk-XARBUUIE.cjs} +49 -49
- package/dist/{chunk-OX2YNMNS.cjs → chunk-ZU3XQZ63.cjs} +63 -63
- package/dist/components/alert/index.cjs +7 -7
- package/dist/components/alert/index.js +6 -6
- package/dist/components/avatar/index.cjs +5 -5
- package/dist/components/avatar/index.js +4 -4
- package/dist/components/badge/index.cjs +4 -4
- package/dist/components/badge/index.js +3 -3
- package/dist/components/button/index.cjs +6 -6
- package/dist/components/button/index.js +5 -5
- package/dist/components/card/index.cjs +5 -5
- package/dist/components/card/index.js +4 -4
- package/dist/components/checkbox/index.cjs +5 -5
- package/dist/components/checkbox/index.js +4 -4
- package/dist/components/chip/index.cjs +7 -7
- package/dist/components/chip/index.js +6 -6
- package/dist/components/divider/index.cjs +4 -4
- package/dist/components/divider/index.js +3 -3
- package/dist/components/field-group/index.cjs +28 -0
- package/dist/components/{input-group → field-group}/index.d.cts +60 -60
- package/dist/components/{input-group → field-group}/index.d.ts +60 -60
- package/dist/components/field-group/index.js +28 -0
- package/dist/components/input-otp/index.cjs +4 -4
- package/dist/components/input-otp/index.js +3 -3
- package/dist/components/radio/index.cjs +5 -5
- package/dist/components/radio/index.js +4 -4
- package/dist/components/skeleton/index.cjs +4 -4
- package/dist/components/skeleton/index.js +3 -3
- package/dist/components/spinner/index.cjs +4 -4
- package/dist/components/spinner/index.js +3 -3
- package/dist/components/switch/index.cjs +5 -5
- package/dist/components/switch/index.js +4 -4
- package/dist/components/text-area/index.cjs +5 -5
- package/dist/components/text-area/index.d.cts +10 -10
- package/dist/components/text-area/index.d.ts +10 -10
- package/dist/components/text-area/index.js +4 -4
- package/dist/components/text-field/index.cjs +26 -0
- package/dist/components/{input → text-field}/index.d.cts +43 -43
- package/dist/components/{input → text-field}/index.d.ts +43 -43
- package/dist/components/text-field/index.js +26 -0
- package/dist/components/typography/index.cjs +4 -4
- package/dist/components/typography/index.js +3 -3
- package/dist/components/view/index.cjs +4 -4
- package/dist/components/view/index.js +3 -3
- package/dist/index.cjs +26 -26
- package/dist/index.d.cts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/index.js +60 -60
- package/dist/system/index.cjs +7 -7
- package/dist/system/index.js +6 -6
- package/dist/{input.type-D2qgi03E.d.ts → text-field.type-0l73acce.d.ts} +24 -24
- package/dist/{input.type-BUMDlzL9.d.cts → text-field.type-DBh06DU5.d.cts} +24 -24
- package/dist/theme/index.cjs +3 -3
- package/dist/theme/index.js +2 -2
- package/package.json +16 -16
- package/dist/components/input/index.cjs +0 -26
- package/dist/components/input/index.js +0 -26
- package/dist/components/input-group/index.cjs +0 -28
- package/dist/components/input-group/index.js +0 -28
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { T as TextFieldFieldProps, a as TextFieldProps } from '../../text-field.type-0l73acce.js';
|
|
4
4
|
import * as react_native from 'react-native';
|
|
5
5
|
import { T as TextStyleProps } from '../../style-props.type-CfnoGEP7.js';
|
|
6
6
|
import '../../theme.type-C2gNHpEx.js';
|
|
@@ -22,20 +22,20 @@ type TextAreaOwnProps = {
|
|
|
22
22
|
children?: ReactNode;
|
|
23
23
|
};
|
|
24
24
|
/**
|
|
25
|
-
* Everything the `
|
|
25
|
+
* Everything the `TextField` root understands, plus the two the shape of a multiline field
|
|
26
26
|
* needs. They sit on the **root** rather than on `TextArea.Field` for the reason `size`
|
|
27
27
|
* and `variant` do: the root is where the field's shape is decided, and the slot reads
|
|
28
28
|
* what it resolved.
|
|
29
29
|
*/
|
|
30
|
-
type TextAreaProps = Omit<
|
|
30
|
+
type TextAreaProps = Omit<TextFieldProps, 'children'> & TextAreaOwnProps;
|
|
31
31
|
/**
|
|
32
|
-
* Everything `
|
|
32
|
+
* Everything `TextField.Field` accepts except `multiline`, which this sets — it is the same
|
|
33
33
|
* `TextInput`, and the same props, with the three things several lines need.
|
|
34
34
|
*/
|
|
35
|
-
type TextAreaFieldProps = Omit<
|
|
35
|
+
type TextAreaFieldProps = Omit<TextFieldFieldProps, 'multiline'>;
|
|
36
36
|
/**
|
|
37
|
-
* The one thing the `
|
|
38
|
-
* `
|
|
37
|
+
* The one thing the `TextField`'s own context cannot carry, because `rows` is not the
|
|
38
|
+
* `TextField`'s business: a single-line field has no use for it, and a prop that does nothing
|
|
39
39
|
* in the common case is a prop that reads as broken.
|
|
40
40
|
*/
|
|
41
41
|
type TextAreaContextValue = {
|
|
@@ -46,14 +46,14 @@ type TextAreaContextValue = {
|
|
|
46
46
|
declare const useTextArea: () => TextAreaContextValue;
|
|
47
47
|
|
|
48
48
|
/**
|
|
49
|
-
* Three of the four slots **are** the `
|
|
49
|
+
* Three of the four slots **are** the `TextField`'s, re-exported rather than wrapped.
|
|
50
50
|
*
|
|
51
51
|
* A wrapper would add three components to the tree to change a `displayName` string, and
|
|
52
|
-
* the string it would change is the one that tells you the truth: a `XAUI.
|
|
52
|
+
* the string it would change is the one that tells you the truth: a `XAUI.TextField.Label`
|
|
53
53
|
* showing up inside a `XAUI.TextArea.Root` is exactly what is happening. Only the field
|
|
54
54
|
* differs, and it is the only one written here.
|
|
55
55
|
*/
|
|
56
|
-
declare const TextArea: react.ForwardRefExoticComponent<Omit<
|
|
56
|
+
declare const TextArea: react.ForwardRefExoticComponent<Omit<TextFieldProps, "children"> & {
|
|
57
57
|
rows?: number;
|
|
58
58
|
maxRows?: number;
|
|
59
59
|
children?: react.ReactNode;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import {
|
|
2
2
|
TextArea,
|
|
3
3
|
useTextArea
|
|
4
|
-
} from "../../chunk-
|
|
5
|
-
import "../../chunk-
|
|
4
|
+
} from "../../chunk-5GMU7ESV.js";
|
|
5
|
+
import "../../chunk-3YZSUDZ2.js";
|
|
6
6
|
import "../../chunk-YXPYOOHU.js";
|
|
7
7
|
import "../../chunk-36PRYGAM.js";
|
|
8
8
|
import "../../chunk-4GTAZM2C.js";
|
|
9
|
-
import "../../chunk-
|
|
9
|
+
import "../../chunk-OSCW7I4H.js";
|
|
10
10
|
import "../../chunk-A3EGFI6T.js";
|
|
11
|
-
import "../../chunk-
|
|
11
|
+
import "../../chunk-FJ5TLRT3.js";
|
|
12
12
|
export {
|
|
13
13
|
TextArea,
|
|
14
14
|
useTextArea
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
var _chunk6N5ZCEABcjs = require('../../chunk-6N5ZCEAB.cjs');
|
|
11
|
+
require('../../chunk-54FJOKAN.cjs');
|
|
12
|
+
require('../../chunk-H4E4HDEP.cjs');
|
|
13
|
+
require('../../chunk-FNEUOBCV.cjs');
|
|
14
|
+
require('../../chunk-K3AVOT6L.cjs');
|
|
15
|
+
require('../../chunk-57SJ4LJF.cjs');
|
|
16
|
+
require('../../chunk-HT7H35GU.cjs');
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
exports.TextField = _chunk6N5ZCEABcjs.TextField; exports.TextFieldDescription = _chunk6N5ZCEABcjs.TextFieldDescription; exports.TextFieldError = _chunk6N5ZCEABcjs.TextFieldError; exports.TextFieldField = _chunk6N5ZCEABcjs.TextFieldField; exports.TextFieldLabel = _chunk6N5ZCEABcjs.TextFieldLabel; exports.TextFieldRoot = _chunk6N5ZCEABcjs.TextFieldRoot; exports.textFieldRecipe = _chunk6N5ZCEABcjs.textFieldRecipe; exports.useTextField = _chunk6N5ZCEABcjs.useTextField;
|
|
@@ -3,33 +3,33 @@ import * as react_native from 'react-native';
|
|
|
3
3
|
import { View, Text, TextInput } from 'react-native';
|
|
4
4
|
import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.cjs';
|
|
5
5
|
import { R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.cjs';
|
|
6
|
-
import { i as
|
|
7
|
-
export { c as
|
|
6
|
+
import { i as TextFieldVariant, g as TextFieldSize, e as TextFieldLabelPlacement, b as TextFieldContextValue, h as TextFieldSlot } from '../../text-field.type-DBh06DU5.cjs';
|
|
7
|
+
export { c as TextFieldDescriptionProps, d as TextFieldErrorProps, T as TextFieldFieldProps, f as TextFieldLabelProps, a as TextFieldProps } from '../../text-field.type-DBh06DU5.cjs';
|
|
8
8
|
import { R as Recipe, S as SlotStyles, a as StyleFn } from '../../create-recipe-dC7wMfnj.cjs';
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
11
|
* A text field, with the label, the hint and the error that make it usable.
|
|
12
12
|
*
|
|
13
13
|
* ```tsx
|
|
14
|
-
* <
|
|
15
|
-
* <
|
|
16
|
-
* <
|
|
14
|
+
* <TextField>
|
|
15
|
+
* <TextField.Label>Courriel</TextField.Label>
|
|
16
|
+
* <TextField.Field
|
|
17
17
|
* value={email}
|
|
18
18
|
* onChangeText={setEmail}
|
|
19
19
|
* placeholder="nom@exemple.fr"
|
|
20
20
|
* keyboardType="email-address"
|
|
21
21
|
* />
|
|
22
|
-
* <
|
|
23
|
-
* </
|
|
22
|
+
* <TextField.Description>On ne le partage jamais.</TextField.Description>
|
|
23
|
+
* </TextField>
|
|
24
24
|
*
|
|
25
|
-
* <
|
|
26
|
-
* <
|
|
27
|
-
* <
|
|
28
|
-
* {error ? <
|
|
29
|
-
* </
|
|
25
|
+
* <TextField isInvalid={Boolean(error)}>
|
|
26
|
+
* <TextField.Label>Mot de passe</TextField.Label>
|
|
27
|
+
* <TextField.Field secureTextEntry value={password} onChangeText={setPassword} />
|
|
28
|
+
* {error ? <TextField.Error>{error}</TextField.Error> : null}
|
|
29
|
+
* </TextField>
|
|
30
30
|
* ```
|
|
31
31
|
*
|
|
32
|
-
* **The root is the column, not the field.** `
|
|
32
|
+
* **The root is the column, not the field.** `TextField.Field` is the `TextInput`, which is
|
|
33
33
|
* what makes the label, the hint and the error slots of one component rather than three
|
|
34
34
|
* components a form has to keep in step — and it is why `TextInputProps` are on the field
|
|
35
35
|
* rather than on the root.
|
|
@@ -37,21 +37,21 @@ import { R as Recipe, S as SlotStyles, a as StyleFn } from '../../create-recipe-
|
|
|
37
37
|
* There is no auto-wrap here (R3): a string child of an input is not a label, a value or
|
|
38
38
|
* a placeholder in any way the component could guess.
|
|
39
39
|
*/
|
|
40
|
-
declare const
|
|
41
|
-
variant?:
|
|
42
|
-
size?:
|
|
40
|
+
declare const TextFieldRoot: react.ForwardRefExoticComponent<{
|
|
41
|
+
variant?: TextFieldVariant;
|
|
42
|
+
size?: TextFieldSize;
|
|
43
43
|
radius?: RadiusKey;
|
|
44
|
-
labelPlacement?:
|
|
44
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
45
45
|
color?: string;
|
|
46
46
|
isInvalid?: boolean;
|
|
47
47
|
isDisabled?: boolean;
|
|
48
48
|
style?: react_native.StyleProp<react_native.ViewStyle>;
|
|
49
49
|
children?: react.ReactNode;
|
|
50
50
|
} & Omit<react_native.ViewProps, keyof {
|
|
51
|
-
variant?:
|
|
52
|
-
size?:
|
|
51
|
+
variant?: TextFieldVariant;
|
|
52
|
+
size?: TextFieldSize;
|
|
53
53
|
radius?: RadiusKey;
|
|
54
|
-
labelPlacement?:
|
|
54
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
55
55
|
color?: string;
|
|
56
56
|
isInvalid?: boolean;
|
|
57
57
|
isDisabled?: boolean;
|
|
@@ -70,7 +70,7 @@ declare const InputRoot: react.ForwardRefExoticComponent<{
|
|
|
70
70
|
* It sits inset by half the field's padding, so the column reads as one block rather than
|
|
71
71
|
* as a label, a box and a stray line.
|
|
72
72
|
*/
|
|
73
|
-
declare const
|
|
73
|
+
declare const TextFieldDescription: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
74
74
|
children?: react.ReactNode;
|
|
75
75
|
} & react.RefAttributes<Text>>;
|
|
76
76
|
|
|
@@ -83,17 +83,17 @@ declare const InputDescription: react.ForwardRefExoticComponent<react_native.Tex
|
|
|
83
83
|
* it:
|
|
84
84
|
*
|
|
85
85
|
* ```tsx
|
|
86
|
-
* <
|
|
87
|
-
* <
|
|
88
|
-
* {error ? <
|
|
89
|
-
* </
|
|
86
|
+
* <TextField isInvalid={Boolean(error)}>
|
|
87
|
+
* <TextField.Field value={value} onChangeText={onChange} />
|
|
88
|
+
* {error ? <TextField.Error>{error}</TextField.Error> : null}
|
|
89
|
+
* </TextField>
|
|
90
90
|
* ```
|
|
91
91
|
*
|
|
92
92
|
* `accessibilityLiveRegion` is deliberately not set: an error that appears while you are
|
|
93
93
|
* still typing in the field is announced by the field's own `aria-invalid`, and a live
|
|
94
94
|
* region on top of that reads the message on every keystroke that changes it.
|
|
95
95
|
*/
|
|
96
|
-
declare const
|
|
96
|
+
declare const TextFieldError: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
97
97
|
children?: react.ReactNode;
|
|
98
98
|
} & react.RefAttributes<Text>>;
|
|
99
99
|
|
|
@@ -101,7 +101,7 @@ declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps
|
|
|
101
101
|
* The `TextInput` itself — the one node of this component that the user types into.
|
|
102
102
|
*
|
|
103
103
|
* ```tsx
|
|
104
|
-
* <
|
|
104
|
+
* <TextField.Field value={email} onChangeText={setEmail} placeholder="nom@exemple.fr" />
|
|
105
105
|
* ```
|
|
106
106
|
*
|
|
107
107
|
* It takes everything `TextInput` takes, which is why `value`, `defaultValue`, `onChange`,
|
|
@@ -116,7 +116,7 @@ declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps
|
|
|
116
116
|
* focus state, so the root owns it and this composes the caller's handlers into the two
|
|
117
117
|
* the context published.
|
|
118
118
|
*/
|
|
119
|
-
declare const
|
|
119
|
+
declare const TextFieldField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
|
|
120
120
|
|
|
121
121
|
/**
|
|
122
122
|
* What the field is for. It turns `danger` with `isInvalid`, so the field that is wrong is
|
|
@@ -128,18 +128,18 @@ declare const InputField: react.ForwardRefExoticComponent<Omit<react_native.Text
|
|
|
128
128
|
* Its colour comes from the theme's `foreground` rather than the variant's: the label sits
|
|
129
129
|
* outside the box, on the screen behind it, so a tinted field does not tint it.
|
|
130
130
|
*/
|
|
131
|
-
declare const
|
|
131
|
+
declare const TextFieldLabel: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
132
132
|
children?: react.ReactNode;
|
|
133
133
|
} & react.RefAttributes<Text>>;
|
|
134
134
|
|
|
135
|
-
declare const
|
|
135
|
+
declare const useTextField: () => TextFieldContextValue;
|
|
136
136
|
|
|
137
|
-
declare const
|
|
137
|
+
declare const textFieldRecipe: Recipe<"label" | "field" | "description" | "suffix" | "root" | "icon" | "textArea" | "placeholder" | "error" | "prefix", TextFieldVariant, {
|
|
138
138
|
readonly size: {
|
|
139
|
-
readonly xs: (theme: XAUITheme) => SlotStyles<
|
|
140
|
-
readonly sm: (theme: XAUITheme) => SlotStyles<
|
|
141
|
-
readonly md: (theme: XAUITheme) => SlotStyles<
|
|
142
|
-
readonly lg: (theme: XAUITheme) => SlotStyles<
|
|
139
|
+
readonly xs: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
140
|
+
readonly sm: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
141
|
+
readonly md: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
142
|
+
readonly lg: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
143
143
|
};
|
|
144
144
|
readonly radius: Record<RadiusKey, StyleFn<"field">>;
|
|
145
145
|
/**
|
|
@@ -167,21 +167,21 @@ declare const inputRecipe: Recipe<"label" | "field" | "description" | "suffix" |
|
|
|
167
167
|
};
|
|
168
168
|
}>;
|
|
169
169
|
|
|
170
|
-
declare const
|
|
171
|
-
variant?:
|
|
172
|
-
size?:
|
|
170
|
+
declare const TextField: react.ForwardRefExoticComponent<{
|
|
171
|
+
variant?: TextFieldVariant;
|
|
172
|
+
size?: TextFieldSize;
|
|
173
173
|
radius?: RadiusKey;
|
|
174
|
-
labelPlacement?:
|
|
174
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
175
175
|
color?: string;
|
|
176
176
|
isInvalid?: boolean;
|
|
177
177
|
isDisabled?: boolean;
|
|
178
178
|
style?: react_native.StyleProp<react_native.ViewStyle>;
|
|
179
179
|
children?: react.ReactNode;
|
|
180
180
|
} & Omit<react_native.ViewProps, keyof {
|
|
181
|
-
variant?:
|
|
182
|
-
size?:
|
|
181
|
+
variant?: TextFieldVariant;
|
|
182
|
+
size?: TextFieldSize;
|
|
183
183
|
radius?: RadiusKey;
|
|
184
|
-
labelPlacement?:
|
|
184
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
185
185
|
color?: string;
|
|
186
186
|
isInvalid?: boolean;
|
|
187
187
|
isDisabled?: boolean;
|
|
@@ -202,4 +202,4 @@ declare const Input: react.ForwardRefExoticComponent<{
|
|
|
202
202
|
} & react.RefAttributes<react_native.Text>>;
|
|
203
203
|
};
|
|
204
204
|
|
|
205
|
-
export {
|
|
205
|
+
export { TextField, TextFieldContextValue, TextFieldDescription, TextFieldError, TextFieldField, TextFieldLabel, TextFieldLabelPlacement, TextFieldRoot, TextFieldSize, TextFieldSlot, TextFieldVariant, textFieldRecipe, useTextField };
|
|
@@ -3,33 +3,33 @@ import * as react_native from 'react-native';
|
|
|
3
3
|
import { View, Text, TextInput } from 'react-native';
|
|
4
4
|
import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.js';
|
|
5
5
|
import { R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.js';
|
|
6
|
-
import { i as
|
|
7
|
-
export { c as
|
|
6
|
+
import { i as TextFieldVariant, g as TextFieldSize, e as TextFieldLabelPlacement, b as TextFieldContextValue, h as TextFieldSlot } from '../../text-field.type-0l73acce.js';
|
|
7
|
+
export { c as TextFieldDescriptionProps, d as TextFieldErrorProps, T as TextFieldFieldProps, f as TextFieldLabelProps, a as TextFieldProps } from '../../text-field.type-0l73acce.js';
|
|
8
8
|
import { R as Recipe, S as SlotStyles, a as StyleFn } from '../../create-recipe-BdVd2ffi.js';
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
11
|
* A text field, with the label, the hint and the error that make it usable.
|
|
12
12
|
*
|
|
13
13
|
* ```tsx
|
|
14
|
-
* <
|
|
15
|
-
* <
|
|
16
|
-
* <
|
|
14
|
+
* <TextField>
|
|
15
|
+
* <TextField.Label>Courriel</TextField.Label>
|
|
16
|
+
* <TextField.Field
|
|
17
17
|
* value={email}
|
|
18
18
|
* onChangeText={setEmail}
|
|
19
19
|
* placeholder="nom@exemple.fr"
|
|
20
20
|
* keyboardType="email-address"
|
|
21
21
|
* />
|
|
22
|
-
* <
|
|
23
|
-
* </
|
|
22
|
+
* <TextField.Description>On ne le partage jamais.</TextField.Description>
|
|
23
|
+
* </TextField>
|
|
24
24
|
*
|
|
25
|
-
* <
|
|
26
|
-
* <
|
|
27
|
-
* <
|
|
28
|
-
* {error ? <
|
|
29
|
-
* </
|
|
25
|
+
* <TextField isInvalid={Boolean(error)}>
|
|
26
|
+
* <TextField.Label>Mot de passe</TextField.Label>
|
|
27
|
+
* <TextField.Field secureTextEntry value={password} onChangeText={setPassword} />
|
|
28
|
+
* {error ? <TextField.Error>{error}</TextField.Error> : null}
|
|
29
|
+
* </TextField>
|
|
30
30
|
* ```
|
|
31
31
|
*
|
|
32
|
-
* **The root is the column, not the field.** `
|
|
32
|
+
* **The root is the column, not the field.** `TextField.Field` is the `TextInput`, which is
|
|
33
33
|
* what makes the label, the hint and the error slots of one component rather than three
|
|
34
34
|
* components a form has to keep in step — and it is why `TextInputProps` are on the field
|
|
35
35
|
* rather than on the root.
|
|
@@ -37,21 +37,21 @@ import { R as Recipe, S as SlotStyles, a as StyleFn } from '../../create-recipe-
|
|
|
37
37
|
* There is no auto-wrap here (R3): a string child of an input is not a label, a value or
|
|
38
38
|
* a placeholder in any way the component could guess.
|
|
39
39
|
*/
|
|
40
|
-
declare const
|
|
41
|
-
variant?:
|
|
42
|
-
size?:
|
|
40
|
+
declare const TextFieldRoot: react.ForwardRefExoticComponent<{
|
|
41
|
+
variant?: TextFieldVariant;
|
|
42
|
+
size?: TextFieldSize;
|
|
43
43
|
radius?: RadiusKey;
|
|
44
|
-
labelPlacement?:
|
|
44
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
45
45
|
color?: string;
|
|
46
46
|
isInvalid?: boolean;
|
|
47
47
|
isDisabled?: boolean;
|
|
48
48
|
style?: react_native.StyleProp<react_native.ViewStyle>;
|
|
49
49
|
children?: react.ReactNode;
|
|
50
50
|
} & Omit<react_native.ViewProps, keyof {
|
|
51
|
-
variant?:
|
|
52
|
-
size?:
|
|
51
|
+
variant?: TextFieldVariant;
|
|
52
|
+
size?: TextFieldSize;
|
|
53
53
|
radius?: RadiusKey;
|
|
54
|
-
labelPlacement?:
|
|
54
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
55
55
|
color?: string;
|
|
56
56
|
isInvalid?: boolean;
|
|
57
57
|
isDisabled?: boolean;
|
|
@@ -70,7 +70,7 @@ declare const InputRoot: react.ForwardRefExoticComponent<{
|
|
|
70
70
|
* It sits inset by half the field's padding, so the column reads as one block rather than
|
|
71
71
|
* as a label, a box and a stray line.
|
|
72
72
|
*/
|
|
73
|
-
declare const
|
|
73
|
+
declare const TextFieldDescription: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
74
74
|
children?: react.ReactNode;
|
|
75
75
|
} & react.RefAttributes<Text>>;
|
|
76
76
|
|
|
@@ -83,17 +83,17 @@ declare const InputDescription: react.ForwardRefExoticComponent<react_native.Tex
|
|
|
83
83
|
* it:
|
|
84
84
|
*
|
|
85
85
|
* ```tsx
|
|
86
|
-
* <
|
|
87
|
-
* <
|
|
88
|
-
* {error ? <
|
|
89
|
-
* </
|
|
86
|
+
* <TextField isInvalid={Boolean(error)}>
|
|
87
|
+
* <TextField.Field value={value} onChangeText={onChange} />
|
|
88
|
+
* {error ? <TextField.Error>{error}</TextField.Error> : null}
|
|
89
|
+
* </TextField>
|
|
90
90
|
* ```
|
|
91
91
|
*
|
|
92
92
|
* `accessibilityLiveRegion` is deliberately not set: an error that appears while you are
|
|
93
93
|
* still typing in the field is announced by the field's own `aria-invalid`, and a live
|
|
94
94
|
* region on top of that reads the message on every keystroke that changes it.
|
|
95
95
|
*/
|
|
96
|
-
declare const
|
|
96
|
+
declare const TextFieldError: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
97
97
|
children?: react.ReactNode;
|
|
98
98
|
} & react.RefAttributes<Text>>;
|
|
99
99
|
|
|
@@ -101,7 +101,7 @@ declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps
|
|
|
101
101
|
* The `TextInput` itself — the one node of this component that the user types into.
|
|
102
102
|
*
|
|
103
103
|
* ```tsx
|
|
104
|
-
* <
|
|
104
|
+
* <TextField.Field value={email} onChangeText={setEmail} placeholder="nom@exemple.fr" />
|
|
105
105
|
* ```
|
|
106
106
|
*
|
|
107
107
|
* It takes everything `TextInput` takes, which is why `value`, `defaultValue`, `onChange`,
|
|
@@ -116,7 +116,7 @@ declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps
|
|
|
116
116
|
* focus state, so the root owns it and this composes the caller's handlers into the two
|
|
117
117
|
* the context published.
|
|
118
118
|
*/
|
|
119
|
-
declare const
|
|
119
|
+
declare const TextFieldField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
|
|
120
120
|
|
|
121
121
|
/**
|
|
122
122
|
* What the field is for. It turns `danger` with `isInvalid`, so the field that is wrong is
|
|
@@ -128,18 +128,18 @@ declare const InputField: react.ForwardRefExoticComponent<Omit<react_native.Text
|
|
|
128
128
|
* Its colour comes from the theme's `foreground` rather than the variant's: the label sits
|
|
129
129
|
* outside the box, on the screen behind it, so a tinted field does not tint it.
|
|
130
130
|
*/
|
|
131
|
-
declare const
|
|
131
|
+
declare const TextFieldLabel: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
|
|
132
132
|
children?: react.ReactNode;
|
|
133
133
|
} & react.RefAttributes<Text>>;
|
|
134
134
|
|
|
135
|
-
declare const
|
|
135
|
+
declare const useTextField: () => TextFieldContextValue;
|
|
136
136
|
|
|
137
|
-
declare const
|
|
137
|
+
declare const textFieldRecipe: Recipe<"label" | "field" | "description" | "suffix" | "root" | "icon" | "textArea" | "placeholder" | "error" | "prefix", TextFieldVariant, {
|
|
138
138
|
readonly size: {
|
|
139
|
-
readonly xs: (theme: XAUITheme) => SlotStyles<
|
|
140
|
-
readonly sm: (theme: XAUITheme) => SlotStyles<
|
|
141
|
-
readonly md: (theme: XAUITheme) => SlotStyles<
|
|
142
|
-
readonly lg: (theme: XAUITheme) => SlotStyles<
|
|
139
|
+
readonly xs: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
140
|
+
readonly sm: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
141
|
+
readonly md: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
142
|
+
readonly lg: (theme: XAUITheme) => SlotStyles<TextFieldSlot>;
|
|
143
143
|
};
|
|
144
144
|
readonly radius: Record<RadiusKey, StyleFn<"field">>;
|
|
145
145
|
/**
|
|
@@ -167,21 +167,21 @@ declare const inputRecipe: Recipe<"label" | "field" | "description" | "suffix" |
|
|
|
167
167
|
};
|
|
168
168
|
}>;
|
|
169
169
|
|
|
170
|
-
declare const
|
|
171
|
-
variant?:
|
|
172
|
-
size?:
|
|
170
|
+
declare const TextField: react.ForwardRefExoticComponent<{
|
|
171
|
+
variant?: TextFieldVariant;
|
|
172
|
+
size?: TextFieldSize;
|
|
173
173
|
radius?: RadiusKey;
|
|
174
|
-
labelPlacement?:
|
|
174
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
175
175
|
color?: string;
|
|
176
176
|
isInvalid?: boolean;
|
|
177
177
|
isDisabled?: boolean;
|
|
178
178
|
style?: react_native.StyleProp<react_native.ViewStyle>;
|
|
179
179
|
children?: react.ReactNode;
|
|
180
180
|
} & Omit<react_native.ViewProps, keyof {
|
|
181
|
-
variant?:
|
|
182
|
-
size?:
|
|
181
|
+
variant?: TextFieldVariant;
|
|
182
|
+
size?: TextFieldSize;
|
|
183
183
|
radius?: RadiusKey;
|
|
184
|
-
labelPlacement?:
|
|
184
|
+
labelPlacement?: TextFieldLabelPlacement;
|
|
185
185
|
color?: string;
|
|
186
186
|
isInvalid?: boolean;
|
|
187
187
|
isDisabled?: boolean;
|
|
@@ -202,4 +202,4 @@ declare const Input: react.ForwardRefExoticComponent<{
|
|
|
202
202
|
} & react.RefAttributes<react_native.Text>>;
|
|
203
203
|
};
|
|
204
204
|
|
|
205
|
-
export {
|
|
205
|
+
export { TextField, TextFieldContextValue, TextFieldDescription, TextFieldError, TextFieldField, TextFieldLabel, TextFieldLabelPlacement, TextFieldRoot, TextFieldSize, TextFieldSlot, TextFieldVariant, textFieldRecipe, useTextField };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import {
|
|
2
|
+
TextField,
|
|
3
|
+
TextFieldDescription,
|
|
4
|
+
TextFieldError,
|
|
5
|
+
TextFieldField,
|
|
6
|
+
TextFieldLabel,
|
|
7
|
+
TextFieldRoot,
|
|
8
|
+
textFieldRecipe,
|
|
9
|
+
useTextField
|
|
10
|
+
} from "../../chunk-3YZSUDZ2.js";
|
|
11
|
+
import "../../chunk-YXPYOOHU.js";
|
|
12
|
+
import "../../chunk-36PRYGAM.js";
|
|
13
|
+
import "../../chunk-4GTAZM2C.js";
|
|
14
|
+
import "../../chunk-OSCW7I4H.js";
|
|
15
|
+
import "../../chunk-A3EGFI6T.js";
|
|
16
|
+
import "../../chunk-FJ5TLRT3.js";
|
|
17
|
+
export {
|
|
18
|
+
TextField,
|
|
19
|
+
TextFieldDescription,
|
|
20
|
+
TextFieldError,
|
|
21
|
+
TextFieldField,
|
|
22
|
+
TextFieldLabel,
|
|
23
|
+
TextFieldRoot,
|
|
24
|
+
textFieldRecipe,
|
|
25
|
+
useTextField
|
|
26
|
+
};
|
|
@@ -2,15 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _chunkLCDHTLSGcjs = require('../../chunk-LCDHTLSG.cjs');
|
|
6
6
|
require('../../chunk-54FJOKAN.cjs');
|
|
7
7
|
require('../../chunk-H4E4HDEP.cjs');
|
|
8
8
|
require('../../chunk-FNEUOBCV.cjs');
|
|
9
|
-
require('../../chunk-
|
|
9
|
+
require('../../chunk-K3AVOT6L.cjs');
|
|
10
10
|
require('../../chunk-57SJ4LJF.cjs');
|
|
11
|
-
require('../../chunk-
|
|
11
|
+
require('../../chunk-HT7H35GU.cjs');
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
|
15
15
|
|
|
16
|
-
exports.TextSpan =
|
|
16
|
+
exports.TextSpan = _chunkLCDHTLSGcjs.TextSpan; exports.Typography = _chunkLCDHTLSGcjs.Typography; exports.typographyRecipe = _chunkLCDHTLSGcjs.typographyRecipe;
|
|
@@ -2,13 +2,13 @@ import {
|
|
|
2
2
|
TextSpan,
|
|
3
3
|
Typography,
|
|
4
4
|
typographyRecipe
|
|
5
|
-
} from "../../chunk-
|
|
5
|
+
} from "../../chunk-2OZPOWFB.js";
|
|
6
6
|
import "../../chunk-YXPYOOHU.js";
|
|
7
7
|
import "../../chunk-36PRYGAM.js";
|
|
8
8
|
import "../../chunk-4GTAZM2C.js";
|
|
9
|
-
import "../../chunk-
|
|
9
|
+
import "../../chunk-OSCW7I4H.js";
|
|
10
10
|
import "../../chunk-A3EGFI6T.js";
|
|
11
|
-
import "../../chunk-
|
|
11
|
+
import "../../chunk-FJ5TLRT3.js";
|
|
12
12
|
export {
|
|
13
13
|
TextSpan,
|
|
14
14
|
Typography,
|
|
@@ -4,15 +4,15 @@
|
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
var
|
|
7
|
+
var _chunkRPOKLFRBcjs = require('../../chunk-RPOKLFRB.cjs');
|
|
8
8
|
require('../../chunk-54FJOKAN.cjs');
|
|
9
9
|
require('../../chunk-H4E4HDEP.cjs');
|
|
10
|
-
require('../../chunk-
|
|
11
|
-
require('../../chunk-
|
|
10
|
+
require('../../chunk-K3AVOT6L.cjs');
|
|
11
|
+
require('../../chunk-HT7H35GU.cjs');
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
|
15
15
|
|
|
16
16
|
|
|
17
17
|
|
|
18
|
-
exports.Column =
|
|
18
|
+
exports.Column = _chunkRPOKLFRBcjs.Column; exports.Grid = _chunkRPOKLFRBcjs.Grid; exports.Row = _chunkRPOKLFRBcjs.Row; exports.Stack = _chunkRPOKLFRBcjs.Stack; exports.useGrid = _chunkRPOKLFRBcjs.useGrid;
|
|
@@ -4,11 +4,11 @@ import {
|
|
|
4
4
|
Row,
|
|
5
5
|
Stack,
|
|
6
6
|
useGrid
|
|
7
|
-
} from "../../chunk-
|
|
7
|
+
} from "../../chunk-4XFEEBPU.js";
|
|
8
8
|
import "../../chunk-YXPYOOHU.js";
|
|
9
9
|
import "../../chunk-36PRYGAM.js";
|
|
10
|
-
import "../../chunk-
|
|
11
|
-
import "../../chunk-
|
|
10
|
+
import "../../chunk-OSCW7I4H.js";
|
|
11
|
+
import "../../chunk-FJ5TLRT3.js";
|
|
12
12
|
export {
|
|
13
13
|
Column,
|
|
14
14
|
Grid,
|