@xaui/native 0.9.1-alpha.16 → 0.9.1-alpha.18
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-4K3LZS7M.js +448 -0
- package/dist/chunk-5SU7FXWH.cjs +448 -0
- package/dist/chunk-6PZF4PI7.js +100 -0
- package/dist/chunk-6VTBGBPP.cjs +100 -0
- package/dist/{chunk-KCUT47FY.cjs → chunk-BHAHJHAI.cjs} +5 -1
- package/dist/{chunk-UOJBK5Z4.js → chunk-L3AQNVRN.js} +1 -1
- package/dist/{chunk-BAACHVM4.cjs → chunk-M2VYRHVS.cjs} +2 -2
- package/dist/{chunk-E3756MJC.js → chunk-MBLPPOSO.js} +16 -15
- package/dist/{chunk-NLFE3CRM.cjs → chunk-ODH5WAVM.cjs} +24 -23
- package/dist/{chunk-PUER6Y4M.cjs → chunk-P5MKOLIW.cjs} +110 -409
- package/dist/chunk-VQPP6FCB.js +728 -0
- package/dist/{chunk-EHHSY2KB.js → chunk-XQE5PXOD.js} +5 -1
- package/dist/components/button/index.cjs +4 -3
- package/dist/components/button/index.d.cts +179 -178
- package/dist/components/button/index.d.ts +179 -178
- package/dist/components/button/index.js +3 -2
- package/dist/components/typography/index.cjs +12 -0
- package/dist/components/typography/index.d.cts +115 -0
- package/dist/components/typography/index.d.ts +115 -0
- package/dist/components/typography/index.js +12 -0
- package/dist/create-recipe-3_ElpCYt.d.cts +117 -0
- package/dist/create-recipe-DImq1AZA.d.ts +117 -0
- package/dist/index.cjs +17 -7
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +21 -11
- package/dist/pressable-feedback.type-UwqIG6ES.d.ts +195 -0
- package/dist/pressable-feedback.type-lgW5wQx5.d.cts +195 -0
- package/dist/system/index.cjs +5 -3
- package/dist/system/index.d.cts +10 -4
- package/dist/system/index.d.ts +10 -4
- package/dist/system/index.js +11 -9
- package/dist/theme/index.cjs +2 -2
- package/dist/theme/index.d.cts +2 -2
- package/dist/theme/index.d.ts +2 -2
- package/dist/theme/index.js +1 -1
- package/dist/{theme.type-C9bFJKFm.d.cts → theme.type-C2gNHpEx.d.cts} +1 -1
- package/dist/{theme.type-C9bFJKFm.d.ts → theme.type-C2gNHpEx.d.ts} +1 -1
- package/package.json +11 -1
- package/dist/chunk-64L44HEI.js +0 -1021
- package/dist/create-recipe-BcUu9b2I.d.cts +0 -280
- package/dist/create-recipe-DD9W6m9b.d.ts +0 -280
|
@@ -2,8 +2,9 @@ import * as react from 'react';
|
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
import * as react_native from 'react-native';
|
|
4
4
|
import { StyleProp, TextStyle, ViewStyle, TextProps, PressableStateCallbackType } from 'react-native';
|
|
5
|
-
import {
|
|
6
|
-
import { S as Size, R as RadiusKey,
|
|
5
|
+
import { o as TextStyleProps, V as ViewStyleProps, R as Recipe, g as SlotStyles } from '../../create-recipe-DImq1AZA.js';
|
|
6
|
+
import { S as Size, R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.js';
|
|
7
|
+
import { a as IconContextValue, b as IconProps, P as PressableFeedbackProps, c as AnimationProp } from '../../pressable-feedback.type-UwqIG6ES.js';
|
|
7
8
|
import 'react-native-reanimated';
|
|
8
9
|
|
|
9
10
|
type ButtonSlot = 'root' | 'label' | 'icon' | 'spinner';
|
|
@@ -216,194 +217,29 @@ declare const Button: react.ForwardRefExoticComponent<{
|
|
|
216
217
|
style?: react_native.StyleProp<react_native.ViewStyle> | ((state: react_native.PressableStateCallbackType) => react_native.StyleProp<react_native.ViewStyle>);
|
|
217
218
|
children?: react.ReactNode;
|
|
218
219
|
} & {
|
|
219
|
-
|
|
220
|
-
id?: string | undefined | undefined;
|
|
221
|
-
needsOffscreenAlphaCompositing?: boolean | undefined | undefined;
|
|
222
|
-
onLayout?: ((event: react_native.LayoutChangeEvent) => void) | undefined | undefined;
|
|
223
|
-
pointerEvents?: "box-none" | "none" | "box-only" | "auto" | undefined | undefined;
|
|
224
|
-
removeClippedSubviews?: boolean | undefined | undefined;
|
|
225
|
-
testID?: string | undefined | undefined;
|
|
226
|
-
nativeID?: string | undefined | undefined;
|
|
227
|
-
collapsable?: boolean | undefined | undefined;
|
|
228
|
-
collapsableChildren?: boolean | undefined | undefined;
|
|
229
|
-
onBlur?: null | ((event: react_native.NativeSyntheticEvent<react_native.TargetedEvent>) => void) | undefined | undefined;
|
|
230
|
-
onFocus?: null | ((event: react_native.NativeSyntheticEvent<react_native.TargetedEvent>) => void) | undefined | undefined;
|
|
231
|
-
renderToHardwareTextureAndroid?: boolean | undefined | undefined;
|
|
232
|
-
focusable?: boolean | undefined | undefined;
|
|
233
|
-
tabIndex?: 0 | -1 | undefined | undefined;
|
|
234
|
-
shouldRasterizeIOS?: boolean | undefined | undefined;
|
|
235
|
-
isTVSelectable?: boolean | undefined | undefined;
|
|
236
|
-
hasTVPreferredFocus?: boolean | undefined | undefined;
|
|
237
|
-
tvParallaxShiftDistanceX?: number | undefined | undefined;
|
|
238
|
-
tvParallaxShiftDistanceY?: number | undefined | undefined;
|
|
239
|
-
tvParallaxTiltAngle?: number | undefined | undefined;
|
|
240
|
-
tvParallaxMagnification?: number | undefined | undefined;
|
|
241
|
-
onStartShouldSetResponder?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
242
|
-
onMoveShouldSetResponder?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
243
|
-
onResponderEnd?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
244
|
-
onResponderGrant?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
245
|
-
onResponderReject?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
246
|
-
onResponderMove?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
247
|
-
onResponderRelease?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
248
|
-
onResponderStart?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
249
|
-
onResponderTerminationRequest?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
250
|
-
onResponderTerminate?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
251
|
-
onStartShouldSetResponderCapture?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
252
|
-
onMoveShouldSetResponderCapture?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
253
|
-
onTouchStart?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
254
|
-
onTouchMove?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
255
|
-
onTouchEnd?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
256
|
-
onTouchCancel?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
257
|
-
onTouchEndCapture?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
258
|
-
onPointerEnter?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
259
|
-
onPointerEnterCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
260
|
-
onPointerLeave?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
261
|
-
onPointerLeaveCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
262
|
-
onPointerMove?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
263
|
-
onPointerMoveCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
264
|
-
onPointerCancel?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
265
|
-
onPointerCancelCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
266
|
-
onPointerDown?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
267
|
-
onPointerDownCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
268
|
-
onPointerUp?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
269
|
-
onPointerUpCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
270
|
-
accessible?: boolean | undefined | undefined;
|
|
271
|
-
accessibilityActions?: readonly Readonly<{
|
|
272
|
-
name: react_native.AccessibilityActionName | string;
|
|
273
|
-
label?: string | undefined;
|
|
274
|
-
}>[] | undefined;
|
|
275
|
-
accessibilityLabel?: string | undefined | undefined;
|
|
276
|
-
'aria-label'?: string | undefined | undefined;
|
|
277
|
-
accessibilityRole?: react_native.AccessibilityRole | undefined;
|
|
278
|
-
accessibilityState?: react_native.AccessibilityState | undefined;
|
|
279
|
-
'aria-busy'?: boolean | undefined | undefined;
|
|
280
|
-
'aria-checked'?: boolean | "mixed" | undefined | undefined;
|
|
281
|
-
'aria-disabled'?: boolean | undefined | undefined;
|
|
282
|
-
'aria-expanded'?: boolean | undefined | undefined;
|
|
283
|
-
'aria-selected'?: boolean | undefined | undefined;
|
|
284
|
-
accessibilityHint?: string | undefined | undefined;
|
|
285
|
-
accessibilityValue?: react_native.AccessibilityValue | undefined;
|
|
286
|
-
'aria-valuemax'?: number | undefined;
|
|
287
|
-
'aria-valuemin'?: number | undefined;
|
|
288
|
-
'aria-valuenow'?: number | undefined;
|
|
289
|
-
'aria-valuetext'?: string | undefined;
|
|
290
|
-
onAccessibilityAction?: ((event: react_native.AccessibilityActionEvent) => void) | undefined | undefined;
|
|
291
|
-
importantForAccessibility?: ("auto" | "yes" | "no" | "no-hide-descendants") | undefined | undefined;
|
|
292
|
-
'aria-hidden'?: boolean | undefined | undefined;
|
|
293
|
-
'aria-modal'?: boolean | undefined | undefined;
|
|
294
|
-
role?: react_native.Role | undefined;
|
|
295
|
-
accessibilityLabelledBy?: string | string[] | undefined | undefined;
|
|
296
|
-
'aria-labelledby'?: string | undefined | undefined;
|
|
297
|
-
accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined | undefined;
|
|
298
|
-
'aria-live'?: ("polite" | "assertive" | "off") | undefined | undefined;
|
|
299
|
-
screenReaderFocusable?: boolean | undefined | undefined;
|
|
300
|
-
accessibilityElementsHidden?: boolean | undefined | undefined;
|
|
301
|
-
accessibilityViewIsModal?: boolean | undefined | undefined;
|
|
302
|
-
onAccessibilityEscape?: (() => void) | undefined | undefined;
|
|
303
|
-
onAccessibilityTap?: (() => void) | undefined | undefined;
|
|
304
|
-
onMagicTap?: (() => void) | undefined | undefined;
|
|
305
|
-
accessibilityIgnoresInvertColors?: boolean | undefined | undefined;
|
|
306
|
-
accessibilityLanguage?: string | undefined | undefined;
|
|
307
|
-
accessibilityShowsLargeContentViewer?: boolean | undefined | undefined;
|
|
308
|
-
accessibilityLargeContentTitle?: string | undefined | undefined;
|
|
309
|
-
accessibilityRespondsToUserInteraction?: boolean | undefined | undefined;
|
|
310
|
-
onHoverIn?: null | ((event: react_native.MouseEvent) => void) | undefined | undefined;
|
|
311
|
-
onHoverOut?: null | ((event: react_native.MouseEvent) => void) | undefined | undefined;
|
|
312
|
-
onPress?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
313
|
-
onPressIn?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
314
|
-
onPressOut?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
315
|
-
onLongPress?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
316
|
-
cancelable?: null | boolean | undefined | undefined;
|
|
317
|
-
delayHoverIn?: number | null | undefined | undefined;
|
|
318
|
-
delayHoverOut?: number | null | undefined | undefined;
|
|
319
|
-
delayLongPress?: null | number | undefined | undefined;
|
|
320
|
-
pressRetentionOffset?: number | react_native.Insets | null | undefined;
|
|
321
|
-
android_disableSound?: null | boolean | undefined | undefined;
|
|
322
|
-
android_ripple?: react_native.PressableAndroidRippleConfig | null | undefined;
|
|
323
|
-
testOnly_pressed?: null | boolean | undefined | undefined;
|
|
324
|
-
unstable_pressDelay?: number | undefined | undefined;
|
|
325
|
-
backfaceVisibility?: "visible" | "hidden" | undefined | undefined;
|
|
326
|
-
backgroundColor?: react_native.ColorValue | undefined;
|
|
327
|
-
borderBlockColor?: react_native.ColorValue | undefined;
|
|
328
|
-
borderBlockEndColor?: react_native.ColorValue | undefined;
|
|
329
|
-
borderBlockStartColor?: react_native.ColorValue | undefined;
|
|
330
|
-
borderBottomColor?: react_native.ColorValue | undefined;
|
|
331
|
-
borderBottomEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
332
|
-
borderBottomStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
333
|
-
borderColor?: react_native.ColorValue | undefined;
|
|
334
|
-
borderCurve?: "circular" | "continuous" | undefined | undefined;
|
|
335
|
-
borderEndColor?: react_native.ColorValue | undefined;
|
|
336
|
-
borderEndEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
337
|
-
borderEndStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
338
|
-
borderRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
339
|
-
borderStartColor?: react_native.ColorValue | undefined;
|
|
340
|
-
borderStartEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
341
|
-
borderStartStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
342
|
-
borderStyle?: "solid" | "dotted" | "dashed" | undefined | undefined;
|
|
343
|
-
borderTopColor?: react_native.ColorValue | undefined;
|
|
344
|
-
borderTopEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
345
|
-
borderTopStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
346
|
-
outlineColor?: react_native.ColorValue | undefined;
|
|
347
|
-
outlineOffset?: react_native.AnimatableNumericValue | undefined;
|
|
348
|
-
outlineStyle?: "solid" | "dotted" | "dashed" | undefined | undefined;
|
|
349
|
-
outlineWidth?: react_native.AnimatableNumericValue | undefined;
|
|
220
|
+
borderWidth?: number | undefined | undefined;
|
|
350
221
|
opacity?: react_native.AnimatableNumericValue | undefined;
|
|
351
|
-
elevation?: number | undefined | undefined;
|
|
352
|
-
isolation?: "auto" | "isolate" | undefined | undefined;
|
|
353
|
-
cursor?: react_native.CursorValue | undefined;
|
|
354
|
-
boxShadow?: string | readonly react_native.BoxShadowValue[] | undefined;
|
|
355
222
|
filter?: string | readonly react_native.FilterFunction[] | undefined;
|
|
356
|
-
mixBlendMode?: react_native.BlendMode | undefined;
|
|
357
|
-
experimental_backgroundImage?: string | readonly react_native.GradientValue[] | undefined;
|
|
358
223
|
alignContent?: "flex-start" | "flex-end" | "center" | "stretch" | "space-between" | "space-around" | "space-evenly" | undefined | undefined;
|
|
359
224
|
alignItems?: react_native.FlexAlignType | undefined;
|
|
360
225
|
alignSelf?: "auto" | react_native.FlexAlignType | undefined;
|
|
361
226
|
aspectRatio?: number | string | undefined | undefined;
|
|
362
|
-
borderBottomWidth?: number | undefined | undefined;
|
|
363
|
-
borderEndWidth?: number | undefined | undefined;
|
|
364
|
-
borderStartWidth?: number | undefined | undefined;
|
|
365
|
-
borderTopWidth?: number | undefined | undefined;
|
|
366
|
-
borderWidth?: number | undefined | undefined;
|
|
367
|
-
bottom?: react_native.DimensionValue | undefined;
|
|
368
227
|
boxSizing?: "border-box" | "content-box" | undefined | undefined;
|
|
228
|
+
columnGap?: number | string | undefined | undefined;
|
|
229
|
+
direction?: "inherit" | "ltr" | "rtl" | undefined | undefined;
|
|
369
230
|
display?: "none" | "flex" | "contents" | undefined | undefined;
|
|
370
|
-
end?: react_native.DimensionValue | undefined;
|
|
371
231
|
flex?: number | undefined | undefined;
|
|
372
232
|
flexBasis?: react_native.DimensionValue | undefined;
|
|
373
233
|
flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" | undefined | undefined;
|
|
374
|
-
rowGap?: number | string | undefined | undefined;
|
|
375
|
-
gap?: number | string | undefined | undefined;
|
|
376
|
-
columnGap?: number | string | undefined | undefined;
|
|
377
234
|
flexGrow?: number | undefined | undefined;
|
|
378
235
|
flexShrink?: number | undefined | undefined;
|
|
379
236
|
flexWrap?: "wrap" | "nowrap" | "wrap-reverse" | undefined | undefined;
|
|
380
|
-
|
|
237
|
+
gap?: number | string | undefined | undefined;
|
|
381
238
|
justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly" | undefined | undefined;
|
|
382
|
-
margin?: react_native.DimensionValue | undefined;
|
|
383
|
-
marginBottom?: react_native.DimensionValue | undefined;
|
|
384
|
-
marginEnd?: react_native.DimensionValue | undefined;
|
|
385
|
-
marginHorizontal?: react_native.DimensionValue | undefined;
|
|
386
|
-
marginStart?: react_native.DimensionValue | undefined;
|
|
387
|
-
marginTop?: react_native.DimensionValue | undefined;
|
|
388
|
-
marginVertical?: react_native.DimensionValue | undefined;
|
|
389
|
-
maxHeight?: react_native.DimensionValue | undefined;
|
|
390
|
-
maxWidth?: react_native.DimensionValue | undefined;
|
|
391
|
-
minHeight?: react_native.DimensionValue | undefined;
|
|
392
|
-
minWidth?: react_native.DimensionValue | undefined;
|
|
393
239
|
overflow?: "visible" | "hidden" | "scroll" | undefined | undefined;
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
paddingHorizontal?: react_native.DimensionValue | undefined;
|
|
398
|
-
paddingStart?: react_native.DimensionValue | undefined;
|
|
399
|
-
paddingTop?: react_native.DimensionValue | undefined;
|
|
400
|
-
paddingVertical?: react_native.DimensionValue | undefined;
|
|
401
|
-
position?: "absolute" | "relative" | "static" | undefined | undefined;
|
|
402
|
-
start?: react_native.DimensionValue | undefined;
|
|
403
|
-
top?: react_native.DimensionValue | undefined;
|
|
404
|
-
width?: react_native.DimensionValue | undefined;
|
|
405
|
-
zIndex?: number | undefined | undefined;
|
|
406
|
-
direction?: "inherit" | "ltr" | "rtl" | undefined | undefined;
|
|
240
|
+
rowGap?: number | string | undefined | undefined;
|
|
241
|
+
bottom?: react_native.DimensionValue | undefined;
|
|
242
|
+
end?: react_native.DimensionValue | undefined;
|
|
407
243
|
inset?: react_native.DimensionValue | undefined;
|
|
408
244
|
insetBlock?: react_native.DimensionValue | undefined;
|
|
409
245
|
insetBlockEnd?: react_native.DimensionValue | undefined;
|
|
@@ -411,18 +247,77 @@ declare const Button: react.ForwardRefExoticComponent<{
|
|
|
411
247
|
insetInline?: react_native.DimensionValue | undefined;
|
|
412
248
|
insetInlineEnd?: react_native.DimensionValue | undefined;
|
|
413
249
|
insetInlineStart?: react_native.DimensionValue | undefined;
|
|
250
|
+
position?: "absolute" | "relative" | "static" | undefined | undefined;
|
|
251
|
+
start?: react_native.DimensionValue | undefined;
|
|
252
|
+
top?: react_native.DimensionValue | undefined;
|
|
253
|
+
zIndex?: number | undefined | undefined;
|
|
254
|
+
margin?: react_native.DimensionValue | undefined;
|
|
414
255
|
marginBlock?: react_native.DimensionValue | undefined;
|
|
415
256
|
marginBlockEnd?: react_native.DimensionValue | undefined;
|
|
416
257
|
marginBlockStart?: react_native.DimensionValue | undefined;
|
|
258
|
+
marginBottom?: react_native.DimensionValue | undefined;
|
|
259
|
+
marginEnd?: react_native.DimensionValue | undefined;
|
|
260
|
+
marginHorizontal?: react_native.DimensionValue | undefined;
|
|
417
261
|
marginInline?: react_native.DimensionValue | undefined;
|
|
418
262
|
marginInlineEnd?: react_native.DimensionValue | undefined;
|
|
419
263
|
marginInlineStart?: react_native.DimensionValue | undefined;
|
|
264
|
+
marginStart?: react_native.DimensionValue | undefined;
|
|
265
|
+
marginTop?: react_native.DimensionValue | undefined;
|
|
266
|
+
marginVertical?: react_native.DimensionValue | undefined;
|
|
267
|
+
padding?: react_native.DimensionValue | undefined;
|
|
420
268
|
paddingBlock?: react_native.DimensionValue | undefined;
|
|
421
269
|
paddingBlockEnd?: react_native.DimensionValue | undefined;
|
|
422
270
|
paddingBlockStart?: react_native.DimensionValue | undefined;
|
|
271
|
+
paddingBottom?: react_native.DimensionValue | undefined;
|
|
272
|
+
paddingEnd?: react_native.DimensionValue | undefined;
|
|
273
|
+
paddingHorizontal?: react_native.DimensionValue | undefined;
|
|
423
274
|
paddingInline?: react_native.DimensionValue | undefined;
|
|
424
275
|
paddingInlineEnd?: react_native.DimensionValue | undefined;
|
|
425
276
|
paddingInlineStart?: react_native.DimensionValue | undefined;
|
|
277
|
+
paddingStart?: react_native.DimensionValue | undefined;
|
|
278
|
+
paddingTop?: react_native.DimensionValue | undefined;
|
|
279
|
+
paddingVertical?: react_native.DimensionValue | undefined;
|
|
280
|
+
height?: react_native.DimensionValue | undefined;
|
|
281
|
+
maxHeight?: react_native.DimensionValue | undefined;
|
|
282
|
+
maxWidth?: react_native.DimensionValue | undefined;
|
|
283
|
+
minHeight?: react_native.DimensionValue | undefined;
|
|
284
|
+
minWidth?: react_native.DimensionValue | undefined;
|
|
285
|
+
width?: react_native.DimensionValue | undefined;
|
|
286
|
+
borderBlockColor?: react_native.ColorValue | undefined;
|
|
287
|
+
borderBlockEndColor?: react_native.ColorValue | undefined;
|
|
288
|
+
borderBlockStartColor?: react_native.ColorValue | undefined;
|
|
289
|
+
borderBottomColor?: react_native.ColorValue | undefined;
|
|
290
|
+
borderBottomEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
291
|
+
borderBottomStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
292
|
+
borderBottomWidth?: number | undefined | undefined;
|
|
293
|
+
borderColor?: react_native.ColorValue | undefined;
|
|
294
|
+
borderCurve?: "circular" | "continuous" | undefined | undefined;
|
|
295
|
+
borderEndColor?: react_native.ColorValue | undefined;
|
|
296
|
+
borderEndEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
297
|
+
borderEndStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
298
|
+
borderEndWidth?: number | undefined | undefined;
|
|
299
|
+
borderRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
300
|
+
borderStartColor?: react_native.ColorValue | undefined;
|
|
301
|
+
borderStartEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
302
|
+
borderStartStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
303
|
+
borderStartWidth?: number | undefined | undefined;
|
|
304
|
+
borderStyle?: "solid" | "dotted" | "dashed" | undefined | undefined;
|
|
305
|
+
borderTopColor?: react_native.ColorValue | undefined;
|
|
306
|
+
borderTopEndRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
307
|
+
borderTopStartRadius?: string | react_native.AnimatableNumericValue | undefined;
|
|
308
|
+
borderTopWidth?: number | undefined | undefined;
|
|
309
|
+
backfaceVisibility?: "visible" | "hidden" | undefined | undefined;
|
|
310
|
+
backgroundColor?: react_native.ColorValue | undefined;
|
|
311
|
+
boxShadow?: string | readonly react_native.BoxShadowValue[] | undefined;
|
|
312
|
+
cursor?: react_native.CursorValue | undefined;
|
|
313
|
+
elevation?: number | undefined | undefined;
|
|
314
|
+
experimental_backgroundImage?: string | readonly react_native.GradientValue[] | undefined;
|
|
315
|
+
isolation?: "auto" | "isolate" | undefined | undefined;
|
|
316
|
+
mixBlendMode?: react_native.BlendMode | undefined;
|
|
317
|
+
outlineColor?: react_native.ColorValue | undefined;
|
|
318
|
+
outlineOffset?: react_native.AnimatableNumericValue | undefined;
|
|
319
|
+
outlineStyle?: "solid" | "dotted" | "dashed" | undefined | undefined;
|
|
320
|
+
outlineWidth?: react_native.AnimatableNumericValue | undefined;
|
|
426
321
|
shadowColor?: react_native.ColorValue | undefined;
|
|
427
322
|
shadowOffset?: Readonly<{
|
|
428
323
|
width: number;
|
|
@@ -430,6 +325,9 @@ declare const Button: react.ForwardRefExoticComponent<{
|
|
|
430
325
|
}> | undefined;
|
|
431
326
|
shadowOpacity?: react_native.AnimatableNumericValue | undefined;
|
|
432
327
|
shadowRadius?: number | undefined | undefined;
|
|
328
|
+
rotation?: react_native.AnimatableNumericValue | undefined;
|
|
329
|
+
scaleX?: react_native.AnimatableNumericValue | undefined;
|
|
330
|
+
scaleY?: react_native.AnimatableNumericValue | undefined;
|
|
433
331
|
transform?: string | readonly (({
|
|
434
332
|
scaleX: react_native.AnimatableNumericValue;
|
|
435
333
|
} & {
|
|
@@ -626,13 +524,116 @@ declare const Button: react.ForwardRefExoticComponent<{
|
|
|
626
524
|
skewX?: undefined;
|
|
627
525
|
skewY?: undefined;
|
|
628
526
|
}))[] | undefined;
|
|
629
|
-
transformOrigin?: string | (string | number)[] | undefined;
|
|
630
527
|
transformMatrix?: number[] | undefined;
|
|
631
|
-
|
|
632
|
-
scaleX?: react_native.AnimatableNumericValue | undefined;
|
|
633
|
-
scaleY?: react_native.AnimatableNumericValue | undefined;
|
|
528
|
+
transformOrigin?: string | (string | number)[] | undefined;
|
|
634
529
|
translateX?: react_native.AnimatableNumericValue | undefined;
|
|
635
530
|
translateY?: react_native.AnimatableNumericValue | undefined;
|
|
531
|
+
pointerEvents?: "box-none" | "none" | "box-only" | "auto" | undefined | undefined;
|
|
532
|
+
id?: string | undefined | undefined;
|
|
533
|
+
onLayout?: ((event: react_native.LayoutChangeEvent) => void) | undefined | undefined;
|
|
534
|
+
testID?: string | undefined | undefined;
|
|
535
|
+
nativeID?: string | undefined | undefined;
|
|
536
|
+
accessible?: boolean | undefined | undefined;
|
|
537
|
+
accessibilityActions?: readonly Readonly<{
|
|
538
|
+
name: react_native.AccessibilityActionName | string;
|
|
539
|
+
label?: string | undefined;
|
|
540
|
+
}>[] | undefined;
|
|
541
|
+
accessibilityLabel?: string | undefined | undefined;
|
|
542
|
+
'aria-label'?: string | undefined | undefined;
|
|
543
|
+
accessibilityRole?: react_native.AccessibilityRole | undefined;
|
|
544
|
+
accessibilityState?: react_native.AccessibilityState | undefined;
|
|
545
|
+
'aria-busy'?: boolean | undefined | undefined;
|
|
546
|
+
'aria-checked'?: boolean | "mixed" | undefined | undefined;
|
|
547
|
+
'aria-disabled'?: boolean | undefined | undefined;
|
|
548
|
+
'aria-expanded'?: boolean | undefined | undefined;
|
|
549
|
+
'aria-selected'?: boolean | undefined | undefined;
|
|
550
|
+
accessibilityHint?: string | undefined | undefined;
|
|
551
|
+
accessibilityValue?: react_native.AccessibilityValue | undefined;
|
|
552
|
+
'aria-valuemax'?: number | undefined;
|
|
553
|
+
'aria-valuemin'?: number | undefined;
|
|
554
|
+
'aria-valuenow'?: number | undefined;
|
|
555
|
+
'aria-valuetext'?: string | undefined;
|
|
556
|
+
onAccessibilityAction?: ((event: react_native.AccessibilityActionEvent) => void) | undefined | undefined;
|
|
557
|
+
importantForAccessibility?: ("auto" | "yes" | "no" | "no-hide-descendants") | undefined | undefined;
|
|
558
|
+
'aria-hidden'?: boolean | undefined | undefined;
|
|
559
|
+
'aria-modal'?: boolean | undefined | undefined;
|
|
560
|
+
role?: react_native.Role | undefined;
|
|
561
|
+
accessibilityLabelledBy?: string | string[] | undefined | undefined;
|
|
562
|
+
'aria-labelledby'?: string | undefined | undefined;
|
|
563
|
+
accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined | undefined;
|
|
564
|
+
'aria-live'?: ("polite" | "assertive" | "off") | undefined | undefined;
|
|
565
|
+
screenReaderFocusable?: boolean | undefined | undefined;
|
|
566
|
+
accessibilityElementsHidden?: boolean | undefined | undefined;
|
|
567
|
+
accessibilityViewIsModal?: boolean | undefined | undefined;
|
|
568
|
+
onAccessibilityEscape?: (() => void) | undefined | undefined;
|
|
569
|
+
onAccessibilityTap?: (() => void) | undefined | undefined;
|
|
570
|
+
onMagicTap?: (() => void) | undefined | undefined;
|
|
571
|
+
accessibilityIgnoresInvertColors?: boolean | undefined | undefined;
|
|
572
|
+
accessibilityLanguage?: string | undefined | undefined;
|
|
573
|
+
accessibilityShowsLargeContentViewer?: boolean | undefined | undefined;
|
|
574
|
+
accessibilityLargeContentTitle?: string | undefined | undefined;
|
|
575
|
+
accessibilityRespondsToUserInteraction?: boolean | undefined | undefined;
|
|
576
|
+
hitSlop?: number | react_native.Insets | null | undefined;
|
|
577
|
+
needsOffscreenAlphaCompositing?: boolean | undefined | undefined;
|
|
578
|
+
removeClippedSubviews?: boolean | undefined | undefined;
|
|
579
|
+
collapsable?: boolean | undefined | undefined;
|
|
580
|
+
collapsableChildren?: boolean | undefined | undefined;
|
|
581
|
+
onBlur?: null | ((event: react_native.NativeSyntheticEvent<react_native.TargetedEvent>) => void) | undefined | undefined;
|
|
582
|
+
onFocus?: null | ((event: react_native.NativeSyntheticEvent<react_native.TargetedEvent>) => void) | undefined | undefined;
|
|
583
|
+
renderToHardwareTextureAndroid?: boolean | undefined | undefined;
|
|
584
|
+
focusable?: boolean | undefined | undefined;
|
|
585
|
+
tabIndex?: 0 | -1 | undefined | undefined;
|
|
586
|
+
shouldRasterizeIOS?: boolean | undefined | undefined;
|
|
587
|
+
isTVSelectable?: boolean | undefined | undefined;
|
|
588
|
+
hasTVPreferredFocus?: boolean | undefined | undefined;
|
|
589
|
+
tvParallaxShiftDistanceX?: number | undefined | undefined;
|
|
590
|
+
tvParallaxShiftDistanceY?: number | undefined | undefined;
|
|
591
|
+
tvParallaxTiltAngle?: number | undefined | undefined;
|
|
592
|
+
tvParallaxMagnification?: number | undefined | undefined;
|
|
593
|
+
onStartShouldSetResponder?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
594
|
+
onMoveShouldSetResponder?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
595
|
+
onResponderEnd?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
596
|
+
onResponderGrant?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
597
|
+
onResponderReject?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
598
|
+
onResponderMove?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
599
|
+
onResponderRelease?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
600
|
+
onResponderStart?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
601
|
+
onResponderTerminationRequest?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
602
|
+
onResponderTerminate?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
603
|
+
onStartShouldSetResponderCapture?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
604
|
+
onMoveShouldSetResponderCapture?: ((event: react_native.GestureResponderEvent) => boolean) | undefined | undefined;
|
|
605
|
+
onTouchStart?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
606
|
+
onTouchMove?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
607
|
+
onTouchEnd?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
608
|
+
onTouchCancel?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
609
|
+
onTouchEndCapture?: ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
610
|
+
onPointerEnter?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
611
|
+
onPointerEnterCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
612
|
+
onPointerLeave?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
613
|
+
onPointerLeaveCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
614
|
+
onPointerMove?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
615
|
+
onPointerMoveCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
616
|
+
onPointerCancel?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
617
|
+
onPointerCancelCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
618
|
+
onPointerDown?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
619
|
+
onPointerDownCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
620
|
+
onPointerUp?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
621
|
+
onPointerUpCapture?: ((event: react_native.PointerEvent) => void) | undefined | undefined;
|
|
622
|
+
onHoverIn?: null | ((event: react_native.MouseEvent) => void) | undefined | undefined;
|
|
623
|
+
onHoverOut?: null | ((event: react_native.MouseEvent) => void) | undefined | undefined;
|
|
624
|
+
onPress?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
625
|
+
onPressIn?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
626
|
+
onPressOut?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
627
|
+
onLongPress?: null | ((event: react_native.GestureResponderEvent) => void) | undefined | undefined;
|
|
628
|
+
cancelable?: null | boolean | undefined | undefined;
|
|
629
|
+
delayHoverIn?: number | null | undefined | undefined;
|
|
630
|
+
delayHoverOut?: number | null | undefined | undefined;
|
|
631
|
+
delayLongPress?: null | number | undefined | undefined;
|
|
632
|
+
pressRetentionOffset?: number | react_native.Insets | null | undefined;
|
|
633
|
+
android_disableSound?: null | boolean | undefined | undefined;
|
|
634
|
+
android_ripple?: react_native.PressableAndroidRippleConfig | null | undefined;
|
|
635
|
+
testOnly_pressed?: null | boolean | undefined | undefined;
|
|
636
|
+
unstable_pressDelay?: number | undefined | undefined;
|
|
636
637
|
asChild?: boolean | undefined;
|
|
637
638
|
animation?: AnimationProp | undefined;
|
|
638
639
|
} & Omit<ViewStyleProps, keyof {
|
|
@@ -2,8 +2,9 @@ import {
|
|
|
2
2
|
Button,
|
|
3
3
|
buttonRecipe,
|
|
4
4
|
useButton
|
|
5
|
-
} from "../../chunk-
|
|
6
|
-
import "../../chunk-
|
|
5
|
+
} from "../../chunk-MBLPPOSO.js";
|
|
6
|
+
import "../../chunk-VQPP6FCB.js";
|
|
7
|
+
import "../../chunk-4K3LZS7M.js";
|
|
7
8
|
import "../../chunk-XJARE6SC.js";
|
|
8
9
|
export {
|
|
9
10
|
Button,
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
var _chunk6VTBGBPPcjs = require('../../chunk-6VTBGBPP.cjs');
|
|
6
|
+
require('../../chunk-5SU7FXWH.cjs');
|
|
7
|
+
require('../../chunk-6N5JXRUZ.cjs');
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
exports.TextSpan = _chunk6VTBGBPPcjs.TextSpan; exports.Typography = _chunk6VTBGBPPcjs.Typography; exports.typographyRecipe = _chunk6VTBGBPPcjs.typographyRecipe;
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import * as react_native from 'react-native';
|
|
4
|
+
import { TextProps, StyleProp, TextStyle, Text } from 'react-native';
|
|
5
|
+
import { o as TextStyleProps, R as Recipe } from '../../create-recipe-3_ElpCYt.cjs';
|
|
6
|
+
import { X as XAUITheme } from '../../theme.type-C2gNHpEx.cjs';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* The ten roles, aligned with HeroUI Native's `text` — six headings, three body steps and
|
|
10
|
+
* inline code. Each one fixes **size, line height, weight and family together**, which is
|
|
11
|
+
* what removes the separate `size` and `weight` props the legacy component carried, and
|
|
12
|
+
* with them the illegal combinations they allowed: a heading in `weight="light"`, a
|
|
13
|
+
* caption in `lg`.
|
|
14
|
+
*
|
|
15
|
+
* `h1`–`h6` name a level, not an HTML tag — React Native has no document outline, so the
|
|
16
|
+
* number is the step on the scale and nothing more. Announcing a heading to a screen
|
|
17
|
+
* reader stays explicit: `accessibilityRole="header"`.
|
|
18
|
+
*/
|
|
19
|
+
type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'body' | 'body-sm' | 'body-xs' | 'code';
|
|
20
|
+
type TypographySlot = 'root';
|
|
21
|
+
type TypographyOwnProps = {
|
|
22
|
+
/** The role. It fixes size, line height, weight and family at once. */
|
|
23
|
+
variant?: TypographyVariant;
|
|
24
|
+
/**
|
|
25
|
+
* A raw tint (`'#7c3aed'`), never a token (R7). In a text component there is only one
|
|
26
|
+
* thing to tint, so it lands on the text itself.
|
|
27
|
+
*/
|
|
28
|
+
color?: string;
|
|
29
|
+
/** R12 — the child element becomes the text node, keeping this variant's style. */
|
|
30
|
+
asChild?: boolean;
|
|
31
|
+
style?: StyleProp<TextStyle>;
|
|
32
|
+
children?: ReactNode;
|
|
33
|
+
};
|
|
34
|
+
/**
|
|
35
|
+
* R14 — the role's own vocabulary, then every `TextStyle` key it does not already claim.
|
|
36
|
+
* `color` is the component's, so it keeps its R7 meaning here rather than becoming the
|
|
37
|
+
* style key of the same name; `fontSize` and `fontWeight` stay available, which is how a
|
|
38
|
+
* one-off deviation is written without inventing a prop for it.
|
|
39
|
+
*/
|
|
40
|
+
type TypographyProps = Omit<TextProps, 'style'> & TypographyOwnProps & Omit<TextStyleProps, keyof TypographyOwnProps | keyof TextProps>;
|
|
41
|
+
type TextSpanOwnProps = {
|
|
42
|
+
/** R12 — the child element becomes the span. */
|
|
43
|
+
asChild?: boolean;
|
|
44
|
+
style?: StyleProp<TextStyle>;
|
|
45
|
+
children?: ReactNode;
|
|
46
|
+
};
|
|
47
|
+
type TextSpanProps = Omit<TextProps, 'style'> & TextSpanOwnProps & Omit<TextStyleProps, keyof TextSpanOwnProps | keyof TextProps>;
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* Text, by the role it plays.
|
|
51
|
+
*
|
|
52
|
+
* ```tsx
|
|
53
|
+
* <Typography variant="heading-lg">Projets</Typography>
|
|
54
|
+
* <Typography>Trois en cours, un archivé.</Typography>
|
|
55
|
+
* <Typography variant="caption">Mis à jour il y a deux minutes</Typography>
|
|
56
|
+
* ```
|
|
57
|
+
*
|
|
58
|
+
* **One node, and no slots.** A paragraph is a `Text`; there is nothing inside it for the
|
|
59
|
+
* component to publish. Styling a fragment of it is `TextSpan`'s job, not a slot of this
|
|
60
|
+
* one — React Native already makes a nested `Text` inherit from its parent, so a span
|
|
61
|
+
* needs no context, no resolved style and nothing from here. This component would only be
|
|
62
|
+
* duplicating a mechanism the platform ships.
|
|
63
|
+
*
|
|
64
|
+
* **The role fixes size, line height, weight and family together**, which is why there is
|
|
65
|
+
* no `size` and no `weight` prop: those axes are not free to combine. A one-off deviation
|
|
66
|
+
* is a style prop — `fontSize={17}` — said plainly rather than dressed as vocabulary.
|
|
67
|
+
*
|
|
68
|
+
* Alignment likewise has no prop of its own: `textAlign` is a `TextStyle` key, so R14
|
|
69
|
+
* already exposes it, and the caller writes the value React Native understands instead of
|
|
70
|
+
* a translation layer this component would have to keep honest.
|
|
71
|
+
*/
|
|
72
|
+
declare const Typography: react.ForwardRefExoticComponent<Omit<react_native.TextProps, "style"> & {
|
|
73
|
+
variant?: TypographyVariant;
|
|
74
|
+
color?: string;
|
|
75
|
+
asChild?: boolean;
|
|
76
|
+
style?: react_native.StyleProp<react_native.TextStyle>;
|
|
77
|
+
children?: react.ReactNode;
|
|
78
|
+
} & Omit<TextStyleProps, "color" | "pointerEvents" | "style" | "children" | "id" | "onLayout" | "testID" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onAccessibilityAction" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "disabled" | "onPress" | "onPressIn" | "onPressOut" | "onLongPress" | "pressRetentionOffset" | "asChild" | "variant" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onTextLayout" | "maxFontSizeMultiplier" | "minimumFontScale" | "adjustsFontSizeToFit" | "dynamicTypeRamp" | "suppressHighlighting" | "lineBreakStrategyIOS" | "selectable" | "selectionColor" | "textBreakStrategy" | "dataDetectorType" | "android_hyphenationFrequency"> & react.RefAttributes<Text>>;
|
|
79
|
+
|
|
80
|
+
/**
|
|
81
|
+
* A fragment of text, styled apart from the text around it.
|
|
82
|
+
*
|
|
83
|
+
* ```tsx
|
|
84
|
+
* <Typography>
|
|
85
|
+
* Supprimer <TextSpan fontWeight="600">trois projets</TextSpan> définitivement.
|
|
86
|
+
* </Typography>
|
|
87
|
+
* ```
|
|
88
|
+
*
|
|
89
|
+
* **It is a bare React Native `Text`, and that is the whole design.** Nesting a `Text`
|
|
90
|
+
* inside a `Text` already inherits the parent's font, size, weight and colour on both
|
|
91
|
+
* platforms — so a span needs no context to read, no role to resolve and no provider
|
|
92
|
+
* above it. The legacy component published a `TextSpanContext` to carry that inheritance
|
|
93
|
+
* by hand; it was reimplementing the platform, and it is gone.
|
|
94
|
+
*
|
|
95
|
+
* What is left is R14 and nothing else: every `TextStyle` key as a prop, and `style` after
|
|
96
|
+
* them. There is no `variant` here on purpose — a span that names a role would be a
|
|
97
|
+
* `Typography`, and nesting one of those is how you change role mid-sentence.
|
|
98
|
+
*/
|
|
99
|
+
declare const TextSpan: react.ForwardRefExoticComponent<Omit<react_native.TextProps, "style"> & {
|
|
100
|
+
asChild?: boolean;
|
|
101
|
+
style?: react_native.StyleProp<react_native.TextStyle>;
|
|
102
|
+
children?: react.ReactNode;
|
|
103
|
+
} & Omit<TextStyleProps, "pointerEvents" | "style" | "children" | "id" | "onLayout" | "testID" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onAccessibilityAction" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "disabled" | "onPress" | "onPressIn" | "onPressOut" | "onLongPress" | "pressRetentionOffset" | "asChild" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onTextLayout" | "maxFontSizeMultiplier" | "minimumFontScale" | "adjustsFontSizeToFit" | "dynamicTypeRamp" | "suppressHighlighting" | "lineBreakStrategyIOS" | "selectable" | "selectionColor" | "textBreakStrategy" | "dataDetectorType" | "android_hyphenationFrequency"> & react.RefAttributes<Text>>;
|
|
104
|
+
|
|
105
|
+
/** Every role produces the same one slot, so the recipe's style functions share a shape. */
|
|
106
|
+
type StyleFn = (theme: XAUITheme) => Record<TypographySlot, TextStyle>;
|
|
107
|
+
/**
|
|
108
|
+
* There is no `base`. A text node's defaults are React Native's own, and restating them
|
|
109
|
+
* here would only give them a second place to drift from.
|
|
110
|
+
*/
|
|
111
|
+
declare const typographyRecipe: Recipe<"root", TypographyVariant, {
|
|
112
|
+
readonly variant: Record<TypographyVariant, StyleFn>;
|
|
113
|
+
}>;
|
|
114
|
+
|
|
115
|
+
export { TextSpan, type TextSpanProps, Typography, type TypographyProps, type TypographySlot, type TypographyVariant, typographyRecipe };
|