@xaui/native 0.9.1-beta.96 → 0.9.1-beta.98

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/chunk-C6JO2RTV.cjs +752 -0
  2. package/dist/chunk-SVS726BW.js +822 -0
  3. package/dist/{chunk-QT7KLGO3.js → chunk-V5FYHQKQ.js} +102 -87
  4. package/dist/{chunk-SIOSYITD.cjs → chunk-ZBFBF7S4.cjs} +60 -45
  5. package/dist/components/agenda-calendar/agenda-calendar-today-button.d.cts +4 -0
  6. package/dist/components/agenda-calendar/agenda-calendar-today-button.d.ts +4 -0
  7. package/dist/components/agenda-calendar/agenda-calendar.recipe.d.cts +1 -1
  8. package/dist/components/agenda-calendar/agenda-calendar.recipe.d.ts +1 -1
  9. package/dist/components/agenda-calendar/agenda-calendar.type.d.cts +4 -1
  10. package/dist/components/agenda-calendar/agenda-calendar.type.d.ts +4 -1
  11. package/dist/components/agenda-calendar/index.cjs +2 -2
  12. package/dist/components/agenda-calendar/index.js +1 -1
  13. package/dist/components/index.d.cts +1 -0
  14. package/dist/components/index.d.ts +1 -0
  15. package/dist/components/phone-number-field/index.cjs +16 -9
  16. package/dist/components/phone-number-field/index.js +9 -2
  17. package/dist/components/slide-button/index.cjs +30 -0
  18. package/dist/components/slide-button/index.d.cts +44 -0
  19. package/dist/components/slide-button/index.d.ts +44 -0
  20. package/dist/components/slide-button/index.js +30 -0
  21. package/dist/components/slide-button/slide-button-fill.d.cts +29 -0
  22. package/dist/components/slide-button/slide-button-fill.d.ts +29 -0
  23. package/dist/components/slide-button/slide-button-icon.d.cts +10 -0
  24. package/dist/components/slide-button/slide-button-icon.d.ts +10 -0
  25. package/dist/components/slide-button/slide-button-label.d.cts +20 -0
  26. package/dist/components/slide-button/slide-button-label.d.ts +20 -0
  27. package/dist/components/slide-button/slide-button-thumb.d.cts +20 -0
  28. package/dist/components/slide-button/slide-button-thumb.d.ts +20 -0
  29. package/dist/components/slide-button/slide-button.animation.d.cts +33 -0
  30. package/dist/components/slide-button/slide-button.animation.d.ts +33 -0
  31. package/dist/components/slide-button/slide-button.context.d.cts +7 -0
  32. package/dist/components/slide-button/slide-button.context.d.ts +7 -0
  33. package/dist/components/slide-button/slide-button.d.cts +56 -0
  34. package/dist/components/slide-button/slide-button.d.ts +56 -0
  35. package/dist/components/slide-button/slide-button.recipe.d.cts +31 -0
  36. package/dist/components/slide-button/slide-button.recipe.d.ts +31 -0
  37. package/dist/components/slide-button/slide-button.type.d.cts +79 -0
  38. package/dist/components/slide-button/slide-button.type.d.ts +79 -0
  39. package/dist/index.cjs +31 -13
  40. package/dist/index.js +35 -17
  41. package/package.json +11 -1
@@ -14,7 +14,7 @@ import {
14
14
  AgendaCalendarYearPicker,
15
15
  agendaCalendarRecipe,
16
16
  useAgendaCalendar
17
- } from "../../chunk-QT7KLGO3.js";
17
+ } from "../../chunk-V5FYHQKQ.js";
18
18
  import "../../chunk-6NAZ2IHL.js";
19
19
  import "../../chunk-SHFUQVLX.js";
20
20
  import "../../chunk-NCTOTTVW.js";
@@ -50,6 +50,7 @@ export * from './scaffold';
50
50
  export * from './search-field';
51
51
  export * from './select';
52
52
  export * from './skeleton';
53
+ export * from './slide-button';
53
54
  export * from './slider';
54
55
  export * from './spinner';
55
56
  export * from './surface';
@@ -50,6 +50,7 @@ export * from './scaffold';
50
50
  export * from './search-field';
51
51
  export * from './select';
52
52
  export * from './skeleton';
53
+ export * from './slide-button';
53
54
  export * from './slider';
54
55
  export * from './spinner';
55
56
  export * from './surface';
@@ -59,11 +59,18 @@ var _react = require('react');
59
59
 
60
60
 
61
61
  var _min = require('libphonenumber-js/min');
62
+ function regionNames(locale) {
63
+ try {
64
+ return new Intl.DisplayNames([locale], { type: "region" });
65
+ } catch (e) {
66
+ return void 0;
67
+ }
68
+ }
62
69
  function phoneCountries(locale, codes = _min.getCountries.call(void 0, )) {
63
- const names = new Intl.DisplayNames([locale], { type: "region" });
70
+ const names = regionNames(locale);
64
71
  return [...new Set(codes)].map((code) => ({
65
72
  code,
66
- name: _nullishCoalesce(names.of(code), () => ( code)),
73
+ name: _nullishCoalesce(_optionalChain([names, 'optionalAccess', _ => _.of, 'call', _2 => _2(code)]), () => ( code)),
67
74
  callingCode: _min.getCountryCallingCode.call(void 0, code),
68
75
  flag: String.fromCodePoint(
69
76
  ...[...code].map((letter) => letter.charCodeAt(0) + 127397)
@@ -83,7 +90,7 @@ function filterPhoneCountries(countries, query) {
83
90
  }
84
91
  function readPhoneNumber(value) {
85
92
  const parsed = _min.parsePhoneNumberFromString.call(void 0, value.nationalNumber, value.country);
86
- return _optionalChain([parsed, 'optionalAccess', _ => _.isPossible, 'call', _2 => _2()]) ? parsed : null;
93
+ return _optionalChain([parsed, 'optionalAccess', _3 => _3.isPossible, 'call', _4 => _4()]) ? parsed : null;
87
94
  }
88
95
  function editPhoneNumber(text, current, allowed) {
89
96
  const normalized = _min.parseIncompletePhoneNumber.call(void 0, text);
@@ -91,7 +98,7 @@ function editPhoneNumber(text, current, allowed) {
91
98
  return { country: current.country, nationalNumber: normalized.slice(0, 17) };
92
99
  }
93
100
  const parsed = _min.parsePhoneNumberFromString.call(void 0, normalized);
94
- if (!_optionalChain([parsed, 'optionalAccess', _3 => _3.country])) {
101
+ if (!_optionalChain([parsed, 'optionalAccess', _5 => _5.country])) {
95
102
  return { country: current.country, nationalNumber: normalized.slice(0, 16) };
96
103
  }
97
104
  if (allowed && !allowed.includes(parsed.country)) return current;
@@ -117,7 +124,7 @@ var PhoneNumberFieldRoot = _react.forwardRef.call(void 0,
117
124
  const [value, setValue] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
118
125
  value: controlled,
119
126
  defaultValue: _nullishCoalesce(defaultValue, () => ( {
120
- country: _nullishCoalesce(_optionalChain([countryCodes, 'optionalAccess', _4 => _4[0]]), () => ( "US")),
127
+ country: _nullishCoalesce(_optionalChain([countryCodes, 'optionalAccess', _6 => _6[0]]), () => ( "US")),
121
128
  nationalNumber: ""
122
129
  })),
123
130
  onChange: onValueChange
@@ -165,7 +172,7 @@ var PhoneNumberFieldRoot = _react.forwardRef.call(void 0,
165
172
  value,
166
173
  country,
167
174
  countries,
168
- phoneNumber: _nullishCoalesce(_optionalChain([phoneNumber, 'optionalAccess', _5 => _5.number]), () => ( null)),
175
+ phoneNumber: _nullishCoalesce(_optionalChain([phoneNumber, 'optionalAccess', _7 => _7.number]), () => ( null)),
169
176
  setNumber,
170
177
  selectCountry,
171
178
  formatNumber,
@@ -217,8 +224,8 @@ var PhoneNumberFieldField = _react.forwardRef.call(void 0, function PhoneNumberF
217
224
  const { value, setNumber, formatNumber } = usePhoneNumberField();
218
225
  const group = _chunkNRU5APUEcjs.useOptionalFieldGroup.call(void 0, );
219
226
  const padding = _react.useMemo.call(void 0,
220
- () => _chunkNRU5APUEcjs.decoratorPadding.call(void 0, _nullishCoalesce(_optionalChain([group, 'optionalAccess', _6 => _6.prefixWidth]), () => ( 0)), _nullishCoalesce(_optionalChain([group, 'optionalAccess', _7 => _7.suffixWidth]), () => ( 0))),
221
- [_optionalChain([group, 'optionalAccess', _8 => _8.prefixWidth]), _optionalChain([group, 'optionalAccess', _9 => _9.suffixWidth])]
227
+ () => _chunkNRU5APUEcjs.decoratorPadding.call(void 0, _nullishCoalesce(_optionalChain([group, 'optionalAccess', _8 => _8.prefixWidth]), () => ( 0)), _nullishCoalesce(_optionalChain([group, 'optionalAccess', _9 => _9.suffixWidth]), () => ( 0))),
228
+ [_optionalChain([group, 'optionalAccess', _10 => _10.prefixWidth]), _optionalChain([group, 'optionalAccess', _11 => _11.suffixWidth])]
222
229
  );
223
230
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
224
231
  _chunk2IOL3VDPcjs.TextFieldField,
@@ -231,7 +238,7 @@ var PhoneNumberFieldField = _react.forwardRef.call(void 0, function PhoneNumberF
231
238
  onChangeText: setNumber,
232
239
  onBlur: (event) => {
233
240
  formatNumber();
234
- _optionalChain([onBlur, 'optionalCall', _10 => _10(event)]);
241
+ _optionalChain([onBlur, 'optionalCall', _12 => _12(event)]);
235
242
  },
236
243
  style: [padding, style]
237
244
  }
@@ -59,11 +59,18 @@ import {
59
59
  parsePhoneNumberFromString,
60
60
  parseIncompletePhoneNumber
61
61
  } from "libphonenumber-js/min";
62
+ function regionNames(locale) {
63
+ try {
64
+ return new Intl.DisplayNames([locale], { type: "region" });
65
+ } catch {
66
+ return void 0;
67
+ }
68
+ }
62
69
  function phoneCountries(locale, codes = getCountries()) {
63
- const names = new Intl.DisplayNames([locale], { type: "region" });
70
+ const names = regionNames(locale);
64
71
  return [...new Set(codes)].map((code) => ({
65
72
  code,
66
- name: names.of(code) ?? code,
73
+ name: names?.of(code) ?? code,
67
74
  callingCode: getCountryCallingCode(code),
68
75
  flag: String.fromCodePoint(
69
76
  ...[...code].map((letter) => letter.charCodeAt(0) + 127397)
@@ -0,0 +1,30 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+ var _chunkC6JO2RTVcjs = require('../../chunk-C6JO2RTV.cjs');
11
+ require('../../chunk-7EIHHOHP.cjs');
12
+ require('../../chunk-GSZDN6EZ.cjs');
13
+ require('../../chunk-FHNIGHN5.cjs');
14
+ require('../../chunk-SL3V7R2Y.cjs');
15
+ require('../../chunk-TVJXC4HY.cjs');
16
+ require('../../chunk-CDRGTUYF.cjs');
17
+ require('../../chunk-H4E4HDEP.cjs');
18
+ require('../../chunk-EJQCQPET.cjs');
19
+ require('../../chunk-IIAQISBG.cjs');
20
+ require('../../chunk-TK44VBIE.cjs');
21
+
22
+
23
+
24
+
25
+
26
+
27
+
28
+
29
+
30
+ exports.SlideButton = _chunkC6JO2RTVcjs.SlideButton; exports.SlideButtonFill = _chunkC6JO2RTVcjs.SlideButtonFill; exports.SlideButtonIcon = _chunkC6JO2RTVcjs.SlideButtonIcon; exports.SlideButtonLabel = _chunkC6JO2RTVcjs.SlideButtonLabel; exports.SlideButtonRoot = _chunkC6JO2RTVcjs.SlideButtonRoot; exports.SlideButtonThumb = _chunkC6JO2RTVcjs.SlideButtonThumb; exports.slideButtonRecipe = _chunkC6JO2RTVcjs.slideButtonRecipe; exports.useSlideButton = _chunkC6JO2RTVcjs.useSlideButton;
@@ -0,0 +1,44 @@
1
+ import { SlideButtonIcon } from './slide-button-icon';
2
+ import { SlideButtonThumb } from './slide-button-thumb';
3
+ export declare const SlideButton: import("react").ForwardRefExoticComponent<{
4
+ children?: import("react").ReactNode;
5
+ variant?: import("./slide-button.type").SlideButtonVariant;
6
+ size?: import("./slide-button.type").SlideButtonSize;
7
+ radius?: import("../..").RadiusKey;
8
+ color?: string;
9
+ threshold?: number;
10
+ isConfirmed?: boolean;
11
+ defaultConfirmed?: boolean;
12
+ onConfirm?: () => void;
13
+ isDisabled?: boolean;
14
+ style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
15
+ } & Omit<import("react-native").ViewProps, keyof {
16
+ children?: import("react").ReactNode;
17
+ variant?: import("./slide-button.type").SlideButtonVariant;
18
+ size?: import("./slide-button.type").SlideButtonSize;
19
+ radius?: import("../..").RadiusKey;
20
+ color?: string;
21
+ threshold?: number;
22
+ isConfirmed?: boolean;
23
+ defaultConfirmed?: boolean;
24
+ onConfirm?: () => void;
25
+ isDisabled?: boolean;
26
+ style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
27
+ }> & Omit<import("../..").ViewStyleProps, "color" | "pointerEvents" | "style" | "children" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "onLayout" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "collapsableChildren" | "onBlur" | "onFocus" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "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" | "isDisabled" | "radius" | "size" | "variant" | "threshold" | "isConfirmed" | "defaultConfirmed" | "onConfirm"> & import("react").RefAttributes<import("react-native").View>> & {
28
+ Fill: import("react").ForwardRefExoticComponent<{
29
+ children?: never;
30
+ } & Omit<import("react-native").ViewProps, "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & import("react").RefAttributes<import("react-native").View>>;
31
+ Label: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
32
+ children?: import("react").ReactNode;
33
+ } & import("react").RefAttributes<import("react-native").Text>>;
34
+ Thumb: typeof SlideButtonThumb;
35
+ Icon: typeof SlideButtonIcon;
36
+ };
37
+ export { SlideButtonRoot } from './slide-button';
38
+ export { SlideButtonFill } from './slide-button-fill';
39
+ export { SlideButtonLabel } from './slide-button-label';
40
+ export { SlideButtonThumb } from './slide-button-thumb';
41
+ export { SlideButtonIcon } from './slide-button-icon';
42
+ export { useSlideButton } from './slide-button.context';
43
+ export { slideButtonRecipe } from './slide-button.recipe';
44
+ export type { SlideButtonContextValue, SlideButtonFillProps, SlideButtonIconProps, SlideButtonLabelProps, SlideButtonProps, SlideButtonSize, SlideButtonSlot, SlideButtonThumbProps, SlideButtonVariant, } from './slide-button.type';
@@ -0,0 +1,44 @@
1
+ import { SlideButtonIcon } from './slide-button-icon';
2
+ import { SlideButtonThumb } from './slide-button-thumb';
3
+ export declare const SlideButton: import("react").ForwardRefExoticComponent<{
4
+ children?: import("react").ReactNode;
5
+ variant?: import("./slide-button.type").SlideButtonVariant;
6
+ size?: import("./slide-button.type").SlideButtonSize;
7
+ radius?: import("../..").RadiusKey;
8
+ color?: string;
9
+ threshold?: number;
10
+ isConfirmed?: boolean;
11
+ defaultConfirmed?: boolean;
12
+ onConfirm?: () => void;
13
+ isDisabled?: boolean;
14
+ style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
15
+ } & Omit<import("react-native").ViewProps, keyof {
16
+ children?: import("react").ReactNode;
17
+ variant?: import("./slide-button.type").SlideButtonVariant;
18
+ size?: import("./slide-button.type").SlideButtonSize;
19
+ radius?: import("../..").RadiusKey;
20
+ color?: string;
21
+ threshold?: number;
22
+ isConfirmed?: boolean;
23
+ defaultConfirmed?: boolean;
24
+ onConfirm?: () => void;
25
+ isDisabled?: boolean;
26
+ style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
27
+ }> & Omit<import("../..").ViewStyleProps, "color" | "pointerEvents" | "style" | "children" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "onLayout" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "collapsableChildren" | "onBlur" | "onFocus" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "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" | "isDisabled" | "radius" | "size" | "variant" | "threshold" | "isConfirmed" | "defaultConfirmed" | "onConfirm"> & import("react").RefAttributes<import("react-native").View>> & {
28
+ Fill: import("react").ForwardRefExoticComponent<{
29
+ children?: never;
30
+ } & Omit<import("react-native").ViewProps, "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & import("react").RefAttributes<import("react-native").View>>;
31
+ Label: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
32
+ children?: import("react").ReactNode;
33
+ } & import("react").RefAttributes<import("react-native").Text>>;
34
+ Thumb: typeof SlideButtonThumb;
35
+ Icon: typeof SlideButtonIcon;
36
+ };
37
+ export { SlideButtonRoot } from './slide-button';
38
+ export { SlideButtonFill } from './slide-button-fill';
39
+ export { SlideButtonLabel } from './slide-button-label';
40
+ export { SlideButtonThumb } from './slide-button-thumb';
41
+ export { SlideButtonIcon } from './slide-button-icon';
42
+ export { useSlideButton } from './slide-button.context';
43
+ export { slideButtonRecipe } from './slide-button.recipe';
44
+ export type { SlideButtonContextValue, SlideButtonFillProps, SlideButtonIconProps, SlideButtonLabelProps, SlideButtonProps, SlideButtonSize, SlideButtonSlot, SlideButtonThumbProps, SlideButtonVariant, } from './slide-button.type';
@@ -0,0 +1,30 @@
1
+ import {
2
+ SlideButton,
3
+ SlideButtonFill,
4
+ SlideButtonIcon,
5
+ SlideButtonLabel,
6
+ SlideButtonRoot,
7
+ SlideButtonThumb,
8
+ slideButtonRecipe,
9
+ useSlideButton
10
+ } from "../../chunk-SVS726BW.js";
11
+ import "../../chunk-F6W3JQ7K.js";
12
+ import "../../chunk-JN6IRT2M.js";
13
+ import "../../chunk-WFZDAXDI.js";
14
+ import "../../chunk-DKVXTMIJ.js";
15
+ import "../../chunk-3Q42X6EQ.js";
16
+ import "../../chunk-TTZOIXKE.js";
17
+ import "../../chunk-36PRYGAM.js";
18
+ import "../../chunk-EGLLDKN6.js";
19
+ import "../../chunk-Z6JBWRPL.js";
20
+ import "../../chunk-M63GFNKV.js";
21
+ export {
22
+ SlideButton,
23
+ SlideButtonFill,
24
+ SlideButtonIcon,
25
+ SlideButtonLabel,
26
+ SlideButtonRoot,
27
+ SlideButtonThumb,
28
+ slideButtonRecipe,
29
+ useSlideButton
30
+ };
@@ -0,0 +1,29 @@
1
+ import { View } from 'react-native';
2
+ /**
3
+ * The trail behind the handle — how far the slide has come, not a state.
4
+ *
5
+ * Optional: compose it for the affordance, leave it out for a bare pill.
6
+ *
7
+ * **Its width is the fraction of the travel the handle has covered, laid over the whole
8
+ * pill — not the handle's raw offset.** The two agree at rest, where both are nothing.
9
+ * They part at the end, and that is the point: the handle comes to rest a handle's width
10
+ * short of the trailing cap, because that is where the handle physically *is*, and a trail
11
+ * that stopped with it left a confirmed slide showing sixty-odd points of unswept pill —
12
+ * reading as almost done at the moment it is done. Spread over the pill, the trail lands
13
+ * full.
14
+ *
15
+ * In between, the trail's leading edge sits under the handle for all but the first and last
16
+ * few points of the drag, so there is no seam to see while the finger is down.
17
+ *
18
+ * It is drawn inside a window cut to the pill's shape, because its own corner cannot be:
19
+ * `radius.full` is clamped to half the shorter side, so while the trail is narrower than
20
+ * the pill is tall it draws a squarer corner than the pill's and shows outside it. The
21
+ * window is here rather than on the root so that the cut lands on the trail alone and not
22
+ * on the handle's shadow.
23
+ *
24
+ * Driven on the UI thread; a spring here would let the trail and the handle come apart
25
+ * under the finger.
26
+ */
27
+ export declare const SlideButtonFill: import("react").ForwardRefExoticComponent<{
28
+ children?: never;
29
+ } & Omit<import("react-native").ViewProps, "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & import("react").RefAttributes<View>>;
@@ -0,0 +1,29 @@
1
+ import { View } from 'react-native';
2
+ /**
3
+ * The trail behind the handle — how far the slide has come, not a state.
4
+ *
5
+ * Optional: compose it for the affordance, leave it out for a bare pill.
6
+ *
7
+ * **Its width is the fraction of the travel the handle has covered, laid over the whole
8
+ * pill — not the handle's raw offset.** The two agree at rest, where both are nothing.
9
+ * They part at the end, and that is the point: the handle comes to rest a handle's width
10
+ * short of the trailing cap, because that is where the handle physically *is*, and a trail
11
+ * that stopped with it left a confirmed slide showing sixty-odd points of unswept pill —
12
+ * reading as almost done at the moment it is done. Spread over the pill, the trail lands
13
+ * full.
14
+ *
15
+ * In between, the trail's leading edge sits under the handle for all but the first and last
16
+ * few points of the drag, so there is no seam to see while the finger is down.
17
+ *
18
+ * It is drawn inside a window cut to the pill's shape, because its own corner cannot be:
19
+ * `radius.full` is clamped to half the shorter side, so while the trail is narrower than
20
+ * the pill is tall it draws a squarer corner than the pill's and shows outside it. The
21
+ * window is here rather than on the root so that the cut lands on the trail alone and not
22
+ * on the handle's shadow.
23
+ *
24
+ * Driven on the UI thread; a spring here would let the trail and the handle come apart
25
+ * under the finger.
26
+ */
27
+ export declare const SlideButtonFill: import("react").ForwardRefExoticComponent<{
28
+ children?: never;
29
+ } & Omit<import("react-native").ViewProps, "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & import("react").RefAttributes<View>>;
@@ -0,0 +1,10 @@
1
+ import type { SlideButtonIconProps } from './slide-button.type';
2
+ /**
3
+ * The mark in the thumb. Written inside `SlideButton.Thumb`, it inherits the handle's glyph
4
+ * size and — because the handle is the surface colour whatever the pill does — the theme's
5
+ * foreground. `size` and `color` override both.
6
+ */
7
+ export declare function SlideButtonIcon({ size, color, ...rest }: SlideButtonIconProps): import("react").JSX.Element;
8
+ export declare namespace SlideButtonIcon {
9
+ var displayName: string;
10
+ }
@@ -0,0 +1,10 @@
1
+ import type { SlideButtonIconProps } from './slide-button.type';
2
+ /**
3
+ * The mark in the thumb. Written inside `SlideButton.Thumb`, it inherits the handle's glyph
4
+ * size and — because the handle is the surface colour whatever the pill does — the theme's
5
+ * foreground. `size` and `color` override both.
6
+ */
7
+ export declare function SlideButtonIcon({ size, color, ...rest }: SlideButtonIconProps): import("react").JSX.Element;
8
+ export declare namespace SlideButtonIcon {
9
+ var displayName: string;
10
+ }
@@ -0,0 +1,20 @@
1
+ import { Text } from 'react-native';
2
+ /**
3
+ * The instruction, centred across the whole pill. The thumb slides over it rather than
4
+ * beside it — there is no gap to keep, because they are not laid out together.
5
+ *
6
+ * **It is drawn twice.** On the four intent variants the pill sweeps from its soft slice
7
+ * to the vivid one, and no single text colour survives that: painted for the soft pill a
8
+ * label reads about 1.3:1 against the vivid trail, painted for the trail it is invisible
9
+ * at rest. So the second copy is painted for the swept ground and clipped to exactly the
10
+ * trail's width — a word the trail is halfway through is dark on the half that is still
11
+ * soft and light on the half that is not. Where a variant names no `fgSelected` both
12
+ * copies resolve to the same colour and the second one costs a `Text` that changes
13
+ * nothing.
14
+ *
15
+ * The clip's width is driven on the UI thread off the same shared offset the trail reads,
16
+ * so the two edges are the same edge and never separate under the finger.
17
+ */
18
+ export declare const SlideButtonLabel: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
19
+ children?: import("react").ReactNode;
20
+ } & import("react").RefAttributes<Text>>;
@@ -0,0 +1,20 @@
1
+ import { Text } from 'react-native';
2
+ /**
3
+ * The instruction, centred across the whole pill. The thumb slides over it rather than
4
+ * beside it — there is no gap to keep, because they are not laid out together.
5
+ *
6
+ * **It is drawn twice.** On the four intent variants the pill sweeps from its soft slice
7
+ * to the vivid one, and no single text colour survives that: painted for the soft pill a
8
+ * label reads about 1.3:1 against the vivid trail, painted for the trail it is invisible
9
+ * at rest. So the second copy is painted for the swept ground and clipped to exactly the
10
+ * trail's width — a word the trail is halfway through is dark on the half that is still
11
+ * soft and light on the half that is not. Where a variant names no `fgSelected` both
12
+ * copies resolve to the same colour and the second one costs a `Text` that changes
13
+ * nothing.
14
+ *
15
+ * The clip's width is driven on the UI thread off the same shared offset the trail reads,
16
+ * so the two edges are the same edge and never separate under the finger.
17
+ */
18
+ export declare const SlideButtonLabel: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
19
+ children?: import("react").ReactNode;
20
+ } & import("react").RefAttributes<Text>>;
@@ -0,0 +1,20 @@
1
+ import type { SlideButtonThumbProps } from './slide-button.type';
2
+ /**
3
+ * The handle the finger drags.
4
+ *
5
+ * The pan runs on `react-native-gesture-handler`, the same **optional** peer the `Slider`
6
+ * reaches for and imported here and nowhere else — an app that never touches
7
+ * `@xaui/native/slide-button` does not pay for it.
8
+ *
9
+ * Everything the finger does stays on the UI thread: the offset is a shared value the pan
10
+ * writes and the fill and the handle both read. The one hop to JS is `runOnJS` on release,
11
+ * once, when the slide has reached the threshold — the confirm is React state and a
12
+ * callback, and neither belongs on the worklet.
13
+ *
14
+ * With no children it draws the built-in chevron, mirrored under RTL so it always points
15
+ * the way the handle travels. Pass an `Icon` — or anything — to replace it.
16
+ */
17
+ export declare function SlideButtonThumb({ children, style, ...props }: SlideButtonThumbProps): import("react").JSX.Element;
18
+ export declare namespace SlideButtonThumb {
19
+ var displayName: string;
20
+ }
@@ -0,0 +1,20 @@
1
+ import type { SlideButtonThumbProps } from './slide-button.type';
2
+ /**
3
+ * The handle the finger drags.
4
+ *
5
+ * The pan runs on `react-native-gesture-handler`, the same **optional** peer the `Slider`
6
+ * reaches for and imported here and nowhere else — an app that never touches
7
+ * `@xaui/native/slide-button` does not pay for it.
8
+ *
9
+ * Everything the finger does stays on the UI thread: the offset is a shared value the pan
10
+ * writes and the fill and the handle both read. The one hop to JS is `runOnJS` on release,
11
+ * once, when the slide has reached the threshold — the confirm is React state and a
12
+ * callback, and neither belongs on the worklet.
13
+ *
14
+ * With no children it draws the built-in chevron, mirrored under RTL so it always points
15
+ * the way the handle travels. Pass an `Icon` — or anything — to replace it.
16
+ */
17
+ export declare function SlideButtonThumb({ children, style, ...props }: SlideButtonThumbProps): import("react").JSX.Element;
18
+ export declare namespace SlideButtonThumb {
19
+ var displayName: string;
20
+ }
@@ -0,0 +1,33 @@
1
+ /**
2
+ * The thumb's motion.
3
+ *
4
+ * It grows a little under the finger, the only confirmation the control can give that the
5
+ * drag has taken — the finger is already over the handle, so the scale is what shows in the
6
+ * ring of pill around it. The `Slider`'s knob does the same.
7
+ */
8
+ export declare const THUMB_PRESSED_SCALE = 1.06;
9
+ /**
10
+ * How the thumb settles when the finger lifts — springing home if the slide fell short,
11
+ * or on to the end if it did not. Stiff and well damped: a confirmation arrives, it does
12
+ * not wobble.
13
+ */
14
+ export declare const THUMB_SPRING: {
15
+ readonly damping: 20;
16
+ readonly stiffness: 260;
17
+ readonly mass: 0.7;
18
+ };
19
+ /** How far along the track the thumb must reach for the slide to count, from 0 to 1. */
20
+ export declare const DEFAULT_THRESHOLD = 0.9;
21
+ /**
22
+ * How much of the pill the slide has swept, in points — the trail's width, and the width
23
+ * of the clip the swept label is read through.
24
+ *
25
+ * It is the fraction of the travel laid over the **whole** pill rather than the handle's
26
+ * raw offset, because the handle stops a handle's width short of the trailing cap and a
27
+ * trail that stopped with it would leave a confirmed slide showing unswept pill.
28
+ *
29
+ * The two callers have to agree to the point: the trail paints the swept ground and the
30
+ * clip decides which half of a straddling word is painted for it. Two expressions of the
31
+ * same edge would eventually drift, so there is one.
32
+ */
33
+ export declare function sweptWidth(offset: number, travel: number, trackLength: number): number;
@@ -0,0 +1,33 @@
1
+ /**
2
+ * The thumb's motion.
3
+ *
4
+ * It grows a little under the finger, the only confirmation the control can give that the
5
+ * drag has taken — the finger is already over the handle, so the scale is what shows in the
6
+ * ring of pill around it. The `Slider`'s knob does the same.
7
+ */
8
+ export declare const THUMB_PRESSED_SCALE = 1.06;
9
+ /**
10
+ * How the thumb settles when the finger lifts — springing home if the slide fell short,
11
+ * or on to the end if it did not. Stiff and well damped: a confirmation arrives, it does
12
+ * not wobble.
13
+ */
14
+ export declare const THUMB_SPRING: {
15
+ readonly damping: 20;
16
+ readonly stiffness: 260;
17
+ readonly mass: 0.7;
18
+ };
19
+ /** How far along the track the thumb must reach for the slide to count, from 0 to 1. */
20
+ export declare const DEFAULT_THRESHOLD = 0.9;
21
+ /**
22
+ * How much of the pill the slide has swept, in points — the trail's width, and the width
23
+ * of the clip the swept label is read through.
24
+ *
25
+ * It is the fraction of the travel laid over the **whole** pill rather than the handle's
26
+ * raw offset, because the handle stops a handle's width short of the trailing cap and a
27
+ * trail that stopped with it would leave a confirmed slide showing unswept pill.
28
+ *
29
+ * The two callers have to agree to the point: the trail paints the swept ground and the
30
+ * clip decides which half of a straddling word is painted for it. Two expressions of the
31
+ * same edge would eventually drift, so there is one.
32
+ */
33
+ export declare function sweptWidth(offset: number, travel: number, trackLength: number): number;
@@ -0,0 +1,7 @@
1
+ import type { SlideButtonContextValue } from './slide-button.type';
2
+ /**
3
+ * R10 — `useSlideButton` is exported so a third party can write its own slot (a second
4
+ * mark, a progress readout) against the same resolved styles and the same shared offset
5
+ * the built-in ones read. Outside a `<SlideButton>` it throws by name.
6
+ */
7
+ export declare const SlideButtonProvider: import("react").Provider<SlideButtonContextValue | null>, useSlideButton: () => SlideButtonContextValue;
@@ -0,0 +1,7 @@
1
+ import type { SlideButtonContextValue } from './slide-button.type';
2
+ /**
3
+ * R10 — `useSlideButton` is exported so a third party can write its own slot (a second
4
+ * mark, a progress readout) against the same resolved styles and the same shared offset
5
+ * the built-in ones read. Outside a `<SlideButton>` it throws by name.
6
+ */
7
+ export declare const SlideButtonProvider: import("react").Provider<SlideButtonContextValue | null>, useSlideButton: () => SlideButtonContextValue;
@@ -0,0 +1,56 @@
1
+ import { View } from 'react-native';
2
+ import type { ViewStyle } from 'react-native';
3
+ /**
4
+ * A button you drag rather than tap, for the action that should not happen by accident:
5
+ * slide the thumb to the far end and it fires once. Below the threshold it springs home.
6
+ *
7
+ * ```tsx
8
+ * <SlideButton onConfirm={unlock}>Slide to confirm</SlideButton>
9
+ *
10
+ * <SlideButton variant="danger" onConfirm={wipe}>
11
+ * <SlideButton.Fill />
12
+ * <SlideButton.Label>Slide to delete</SlideButton.Label>
13
+ * <SlideButton.Thumb>
14
+ * <SlideButton.Icon as={TrashIcon} />
15
+ * </SlideButton.Thumb>
16
+ * </SlideButton>
17
+ * ```
18
+ *
19
+ * **It is the `Slider`'s gesture without the value.** The thumb runs the same pan on the
20
+ * same optional `react-native-gesture-handler` peer, the track measures its own length
21
+ * the same way, and the travel is inset by the thumb at each end for the same reason —
22
+ * but there is no `min`, `max` or `step`, because the only positions that mean anything
23
+ * are "not yet" and "done".
24
+ *
25
+ * **Once confirmed it stays confirmed.** Uncontrolled, a slide is a one-shot. Pass
26
+ * `isConfirmed` to drive it — set it back to `false` and the thumb springs home, re-armed.
27
+ *
28
+ * **A bare string is the whole component.** `<SlideButton>Slide</SlideButton>` composes
29
+ * the fill, the label and the thumb for you; write the slots out to put a mark in the
30
+ * thumb or leave the fill off.
31
+ */
32
+ export declare const SlideButtonRoot: import("react").ForwardRefExoticComponent<{
33
+ children?: import("react").ReactNode;
34
+ variant?: import("./slide-button.type").SlideButtonVariant;
35
+ size?: import("./slide-button.type").SlideButtonSize;
36
+ radius?: import("../..").RadiusKey;
37
+ color?: string;
38
+ threshold?: number;
39
+ isConfirmed?: boolean;
40
+ defaultConfirmed?: boolean;
41
+ onConfirm?: () => void;
42
+ isDisabled?: boolean;
43
+ style?: import("react-native").StyleProp<ViewStyle>;
44
+ } & Omit<import("react-native").ViewProps, keyof {
45
+ children?: import("react").ReactNode;
46
+ variant?: import("./slide-button.type").SlideButtonVariant;
47
+ size?: import("./slide-button.type").SlideButtonSize;
48
+ radius?: import("../..").RadiusKey;
49
+ color?: string;
50
+ threshold?: number;
51
+ isConfirmed?: boolean;
52
+ defaultConfirmed?: boolean;
53
+ onConfirm?: () => void;
54
+ isDisabled?: boolean;
55
+ style?: import("react-native").StyleProp<ViewStyle>;
56
+ }> & Omit<import("../..").ViewStyleProps, "color" | "pointerEvents" | "style" | "children" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "onLayout" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "collapsableChildren" | "onBlur" | "onFocus" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "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" | "isDisabled" | "radius" | "size" | "variant" | "threshold" | "isConfirmed" | "defaultConfirmed" | "onConfirm"> & import("react").RefAttributes<View>>;