@castui/cast-ui 4.2.0 → 4.2.2

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 (186) hide show
  1. package/README.md +45 -1
  2. package/dist/components/Alert/Alert.d.ts +0 -1
  3. package/dist/components/Alert/Alert.js +22 -20
  4. package/dist/components/Alert/index.d.ts +0 -1
  5. package/dist/components/Alert/index.js +5 -2
  6. package/dist/components/Avatar/Avatar.d.ts +0 -1
  7. package/dist/components/Avatar/Avatar.js +15 -13
  8. package/dist/components/Avatar/index.d.ts +0 -1
  9. package/dist/components/Avatar/index.js +5 -2
  10. package/dist/components/Badge/Badge.d.ts +0 -1
  11. package/dist/components/Badge/Badge.js +20 -18
  12. package/dist/components/Badge/index.d.ts +0 -1
  13. package/dist/components/Badge/index.js +5 -2
  14. package/dist/components/Button/Button.d.ts +0 -1
  15. package/dist/components/Button/Button.js +21 -19
  16. package/dist/components/Button/index.d.ts +0 -1
  17. package/dist/components/Button/index.js +5 -2
  18. package/dist/components/Card/Card.d.ts +0 -1
  19. package/dist/components/Card/Card.js +27 -25
  20. package/dist/components/Card/index.d.ts +0 -1
  21. package/dist/components/Card/index.js +5 -2
  22. package/dist/components/Checkbox/Checkbox.d.ts +0 -1
  23. package/dist/components/Checkbox/Checkbox.js +23 -21
  24. package/dist/components/Checkbox/index.d.ts +0 -1
  25. package/dist/components/Checkbox/index.js +5 -2
  26. package/dist/components/Chip/Chip.d.ts +0 -1
  27. package/dist/components/Chip/Chip.js +22 -20
  28. package/dist/components/Chip/index.d.ts +0 -1
  29. package/dist/components/Chip/index.js +5 -2
  30. package/dist/components/Dialog/Dialog.d.ts +0 -1
  31. package/dist/components/Dialog/Dialog.js +30 -27
  32. package/dist/components/Dialog/index.d.ts +0 -1
  33. package/dist/components/Dialog/index.js +6 -2
  34. package/dist/components/Divider/Divider.d.ts +0 -1
  35. package/dist/components/Divider/Divider.js +12 -10
  36. package/dist/components/Divider/index.d.ts +0 -1
  37. package/dist/components/Divider/index.js +5 -2
  38. package/dist/components/Icon/Icon.d.ts +5 -3
  39. package/dist/components/Icon/Icon.js +14 -8
  40. package/dist/components/Icon/index.d.ts +0 -1
  41. package/dist/components/Icon/index.js +5 -2
  42. package/dist/components/Input/Input.d.ts +0 -1
  43. package/dist/components/Input/Input.js +37 -35
  44. package/dist/components/Input/index.d.ts +0 -1
  45. package/dist/components/Input/index.js +5 -2
  46. package/dist/components/List/List.d.ts +0 -1
  47. package/dist/components/List/List.js +46 -41
  48. package/dist/components/List/index.d.ts +0 -1
  49. package/dist/components/List/index.js +8 -2
  50. package/dist/components/Popover/Popover.d.ts +0 -1
  51. package/dist/components/Popover/Popover.js +11 -9
  52. package/dist/components/Popover/index.d.ts +0 -1
  53. package/dist/components/Popover/index.js +5 -2
  54. package/dist/components/Radio/Radio.d.ts +0 -1
  55. package/dist/components/Radio/Radio.js +29 -26
  56. package/dist/components/Radio/index.d.ts +0 -1
  57. package/dist/components/Radio/index.js +6 -2
  58. package/dist/components/Select/Select.d.ts +0 -1
  59. package/dist/components/Select/Select.js +102 -95
  60. package/dist/components/Select/index.d.ts +0 -1
  61. package/dist/components/Select/index.js +10 -2
  62. package/dist/components/Skeleton/Skeleton.d.ts +0 -1
  63. package/dist/components/Skeleton/Skeleton.js +22 -15
  64. package/dist/components/Skeleton/index.d.ts +0 -1
  65. package/dist/components/Skeleton/index.js +5 -2
  66. package/dist/components/Toast/Toast.d.ts +0 -1
  67. package/dist/components/Toast/Toast.js +23 -21
  68. package/dist/components/Toast/index.d.ts +0 -1
  69. package/dist/components/Toast/index.js +5 -2
  70. package/dist/components/Toggle/Toggle.d.ts +0 -1
  71. package/dist/components/Toggle/Toggle.js +20 -18
  72. package/dist/components/Toggle/index.d.ts +0 -1
  73. package/dist/components/Toggle/index.js +5 -2
  74. package/dist/components/Tooltip/Tooltip.d.ts +0 -1
  75. package/dist/components/Tooltip/Tooltip.js +14 -12
  76. package/dist/components/Tooltip/index.d.ts +0 -1
  77. package/dist/components/Tooltip/index.js +5 -2
  78. package/dist/index.d.ts +0 -1
  79. package/dist/index.js +81 -22
  80. package/dist/theme/ThemeContext.d.ts +0 -1
  81. package/dist/theme/ThemeContext.js +20 -17
  82. package/dist/theme/index.d.ts +0 -1
  83. package/dist/theme/index.js +8 -3
  84. package/dist/theme/themes.d.ts +0 -1
  85. package/dist/theme/themes.js +4 -2
  86. package/dist/theme/types.d.ts +0 -1
  87. package/dist/theme/types.js +2 -2
  88. package/dist/tokens/colors.d.ts +0 -1
  89. package/dist/tokens/colors.js +25 -23
  90. package/dist/tokens/index.d.ts +0 -1
  91. package/dist/tokens/index.js +29 -3
  92. package/dist/tokens/typography.d.ts +0 -1
  93. package/dist/tokens/typography.js +13 -11
  94. package/package.json +13 -2
  95. package/dist/components/Alert/Alert.d.ts.map +0 -1
  96. package/dist/components/Alert/Alert.js.map +0 -1
  97. package/dist/components/Alert/index.d.ts.map +0 -1
  98. package/dist/components/Alert/index.js.map +0 -1
  99. package/dist/components/Avatar/Avatar.d.ts.map +0 -1
  100. package/dist/components/Avatar/Avatar.js.map +0 -1
  101. package/dist/components/Avatar/index.d.ts.map +0 -1
  102. package/dist/components/Avatar/index.js.map +0 -1
  103. package/dist/components/Badge/Badge.d.ts.map +0 -1
  104. package/dist/components/Badge/Badge.js.map +0 -1
  105. package/dist/components/Badge/index.d.ts.map +0 -1
  106. package/dist/components/Badge/index.js.map +0 -1
  107. package/dist/components/Button/Button.d.ts.map +0 -1
  108. package/dist/components/Button/Button.js.map +0 -1
  109. package/dist/components/Button/index.d.ts.map +0 -1
  110. package/dist/components/Button/index.js.map +0 -1
  111. package/dist/components/Card/Card.d.ts.map +0 -1
  112. package/dist/components/Card/Card.js.map +0 -1
  113. package/dist/components/Card/index.d.ts.map +0 -1
  114. package/dist/components/Card/index.js.map +0 -1
  115. package/dist/components/Checkbox/Checkbox.d.ts.map +0 -1
  116. package/dist/components/Checkbox/Checkbox.js.map +0 -1
  117. package/dist/components/Checkbox/index.d.ts.map +0 -1
  118. package/dist/components/Checkbox/index.js.map +0 -1
  119. package/dist/components/Chip/Chip.d.ts.map +0 -1
  120. package/dist/components/Chip/Chip.js.map +0 -1
  121. package/dist/components/Chip/index.d.ts.map +0 -1
  122. package/dist/components/Chip/index.js.map +0 -1
  123. package/dist/components/Dialog/Dialog.d.ts.map +0 -1
  124. package/dist/components/Dialog/Dialog.js.map +0 -1
  125. package/dist/components/Dialog/index.d.ts.map +0 -1
  126. package/dist/components/Dialog/index.js.map +0 -1
  127. package/dist/components/Divider/Divider.d.ts.map +0 -1
  128. package/dist/components/Divider/Divider.js.map +0 -1
  129. package/dist/components/Divider/index.d.ts.map +0 -1
  130. package/dist/components/Divider/index.js.map +0 -1
  131. package/dist/components/Icon/Icon.d.ts.map +0 -1
  132. package/dist/components/Icon/Icon.js.map +0 -1
  133. package/dist/components/Icon/index.d.ts.map +0 -1
  134. package/dist/components/Icon/index.js.map +0 -1
  135. package/dist/components/Input/Input.d.ts.map +0 -1
  136. package/dist/components/Input/Input.js.map +0 -1
  137. package/dist/components/Input/index.d.ts.map +0 -1
  138. package/dist/components/Input/index.js.map +0 -1
  139. package/dist/components/List/List.d.ts.map +0 -1
  140. package/dist/components/List/List.js.map +0 -1
  141. package/dist/components/List/index.d.ts.map +0 -1
  142. package/dist/components/List/index.js.map +0 -1
  143. package/dist/components/Popover/Popover.d.ts.map +0 -1
  144. package/dist/components/Popover/Popover.js.map +0 -1
  145. package/dist/components/Popover/index.d.ts.map +0 -1
  146. package/dist/components/Popover/index.js.map +0 -1
  147. package/dist/components/Radio/Radio.d.ts.map +0 -1
  148. package/dist/components/Radio/Radio.js.map +0 -1
  149. package/dist/components/Radio/index.d.ts.map +0 -1
  150. package/dist/components/Radio/index.js.map +0 -1
  151. package/dist/components/Select/Select.d.ts.map +0 -1
  152. package/dist/components/Select/Select.js.map +0 -1
  153. package/dist/components/Select/index.d.ts.map +0 -1
  154. package/dist/components/Select/index.js.map +0 -1
  155. package/dist/components/Skeleton/Skeleton.d.ts.map +0 -1
  156. package/dist/components/Skeleton/Skeleton.js.map +0 -1
  157. package/dist/components/Skeleton/index.d.ts.map +0 -1
  158. package/dist/components/Skeleton/index.js.map +0 -1
  159. package/dist/components/Toast/Toast.d.ts.map +0 -1
  160. package/dist/components/Toast/Toast.js.map +0 -1
  161. package/dist/components/Toast/index.d.ts.map +0 -1
  162. package/dist/components/Toast/index.js.map +0 -1
  163. package/dist/components/Toggle/Toggle.d.ts.map +0 -1
  164. package/dist/components/Toggle/Toggle.js.map +0 -1
  165. package/dist/components/Toggle/index.d.ts.map +0 -1
  166. package/dist/components/Toggle/index.js.map +0 -1
  167. package/dist/components/Tooltip/Tooltip.d.ts.map +0 -1
  168. package/dist/components/Tooltip/Tooltip.js.map +0 -1
  169. package/dist/components/Tooltip/index.d.ts.map +0 -1
  170. package/dist/components/Tooltip/index.js.map +0 -1
  171. package/dist/index.d.ts.map +0 -1
  172. package/dist/index.js.map +0 -1
  173. package/dist/theme/ThemeContext.d.ts.map +0 -1
  174. package/dist/theme/ThemeContext.js.map +0 -1
  175. package/dist/theme/index.d.ts.map +0 -1
  176. package/dist/theme/index.js.map +0 -1
  177. package/dist/theme/themes.d.ts.map +0 -1
  178. package/dist/theme/themes.js.map +0 -1
  179. package/dist/theme/types.d.ts.map +0 -1
  180. package/dist/theme/types.js.map +0 -1
  181. package/dist/tokens/colors.d.ts.map +0 -1
  182. package/dist/tokens/colors.js.map +0 -1
  183. package/dist/tokens/index.d.ts.map +0 -1
  184. package/dist/tokens/index.js.map +0 -1
  185. package/dist/tokens/typography.d.ts.map +0 -1
  186. package/dist/tokens/typography.js.map +0 -1
@@ -1,4 +1,7 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Input = Input;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
2
5
  /**
3
6
  * Input — single-line text field with label and helper/error text.
4
7
  *
@@ -15,11 +18,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
15
18
  * Label uses the label scale, the value/placeholder the body scale (both
16
19
  * matched to size); helper text uses the caption scale.
17
20
  */
18
- import { useState } from 'react';
19
- import { View, Text, TextInput, Platform, } from 'react-native';
20
- import { useTheme } from '../../theme';
21
- import { Icon } from '../Icon';
22
- import { fontFamily, fontWeight, label, body, caption, controlTokens, } from '../../tokens';
21
+ const react_1 = require("react");
22
+ const react_native_1 = require("react-native");
23
+ const theme_1 = require("../../theme");
24
+ const Icon_1 = require("../Icon");
25
+ const tokens_1 = require("../../tokens");
23
26
  // ---------------------------------------------------------------------------
24
27
  // Constants
25
28
  // ---------------------------------------------------------------------------
@@ -39,13 +42,13 @@ const BODY_SCALE = {
39
42
  // ---------------------------------------------------------------------------
40
43
  // Component
41
44
  // ---------------------------------------------------------------------------
42
- export function Input({ label: formLabel, helperText, placeholder, value, defaultValue, onChangeText, size = 'default', error = false, disabled = false, leadingIcon, trailingIcon, secureTextEntry, keyboardType, autoCapitalize, returnKeyType, onSubmitEditing, onFocus, onBlur, style, accessibilityLabel, }) {
43
- const { components, scheme } = useTheme();
45
+ function Input({ label: formLabel, helperText, placeholder, value, defaultValue, onChangeText, size = 'default', error = false, disabled = false, leadingIcon, trailingIcon, secureTextEntry, keyboardType, autoCapitalize, returnKeyType, onSubmitEditing, onFocus, onBlur, style, accessibilityLabel, }) {
46
+ const { components, scheme } = (0, theme_1.useTheme)();
44
47
  const sizeTokens = components.input[size];
45
- const labelTypo = label[LABEL_SCALE[size]];
46
- const bodyTypo = body[BODY_SCALE[size]];
47
- const [isHovered, setIsHovered] = useState(false);
48
- const [isFocused, setIsFocused] = useState(false);
48
+ const labelTypo = tokens_1.label[LABEL_SCALE[size]];
49
+ const bodyTypo = tokens_1.body[BODY_SCALE[size]];
50
+ const [isHovered, setIsHovered] = (0, react_1.useState)(false);
51
+ const [isFocused, setIsFocused] = (0, react_1.useState)(false);
49
52
  const disabledColors = scheme.disabled;
50
53
  const errorTokens = scheme.error;
51
54
  const textTokens = scheme.text;
@@ -57,27 +60,27 @@ export function Input({ label: formLabel, helperText, placeholder, value, defaul
57
60
  if (disabled) {
58
61
  bg = disabledColors.bg;
59
62
  borderColor = disabledColors.border;
60
- borderWidth = controlTokens.borderWidth;
63
+ borderWidth = tokens_1.controlTokens.borderWidth;
61
64
  }
62
65
  else if (isFocused) {
63
66
  bg = neutral.default.bg;
64
67
  borderColor = scheme.focusRing.color;
65
- borderWidth = controlTokens.focusRingWidth;
68
+ borderWidth = tokens_1.controlTokens.focusRingWidth;
66
69
  }
67
70
  else if (error) {
68
71
  bg = neutral.default.bg;
69
72
  borderColor = errorTokens.border;
70
- borderWidth = controlTokens.borderWidth;
73
+ borderWidth = tokens_1.controlTokens.borderWidth;
71
74
  }
72
75
  else if (isHovered) {
73
76
  bg = neutral.hover.bg;
74
77
  borderColor = neutral.hover.border;
75
- borderWidth = controlTokens.borderWidth;
78
+ borderWidth = tokens_1.controlTokens.borderWidth;
76
79
  }
77
80
  else {
78
81
  bg = neutral.default.bg;
79
82
  borderColor = neutral.default.border;
80
- borderWidth = controlTokens.borderWidth;
83
+ borderWidth = tokens_1.controlTokens.borderWidth;
81
84
  }
82
85
  const textColor = disabled ? disabledColors.fg : neutral.default.fg;
83
86
  const labelColor = disabled ? disabledColors.fg : neutral.default.fg;
@@ -87,19 +90,19 @@ export function Input({ label: formLabel, helperText, placeholder, value, defaul
87
90
  ? errorTokens.fg
88
91
  : textTokens.description;
89
92
  const iconColor = disabled ? disabledColors.fg : neutral.default.fg;
90
- const resolvedLeading = typeof leadingIcon === 'string' ? (_jsx(Icon, { name: leadingIcon, size: ICON_SIZE, color: iconColor })) : (leadingIcon);
91
- const resolvedTrailing = typeof trailingIcon === 'string' ? (_jsx(Icon, { name: trailingIcon, size: ICON_SIZE, color: iconColor })) : (trailingIcon);
92
- return (_jsxs(View, { style: [
93
+ const resolvedLeading = typeof leadingIcon === 'string' ? ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: leadingIcon, size: ICON_SIZE, color: iconColor })) : (leadingIcon);
94
+ const resolvedTrailing = typeof trailingIcon === 'string' ? ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: trailingIcon, size: ICON_SIZE, color: iconColor })) : (trailingIcon);
95
+ return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
93
96
  { alignSelf: 'stretch', gap: components.input.fieldGap },
94
97
  style,
95
- ], children: [formLabel ? (_jsx(Text, { style: {
96
- fontFamily: fontFamily.sans,
97
- fontWeight: fontWeight.medium,
98
+ ], children: [formLabel ? ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
99
+ fontFamily: tokens_1.fontFamily.sans,
100
+ fontWeight: tokens_1.fontWeight.medium,
98
101
  fontSize: labelTypo.fontSize,
99
102
  lineHeight: labelTypo.lineHeight,
100
103
  letterSpacing: labelTypo.letterSpacing,
101
104
  color: labelColor,
102
- }, selectable: false, children: formLabel })) : null, _jsxs(View, { onPointerEnter: disabled ? undefined : () => setIsHovered(true), onPointerLeave: disabled ? undefined : () => setIsHovered(false), style: {
105
+ }, selectable: false, children: formLabel })) : null, (0, jsx_runtime_1.jsxs)(react_native_1.View, { onPointerEnter: disabled ? undefined : () => setIsHovered(true), onPointerLeave: disabled ? undefined : () => setIsHovered(false), style: {
103
106
  flexDirection: 'row',
104
107
  alignItems: 'center',
105
108
  gap: sizeTokens.gap,
@@ -109,7 +112,7 @@ export function Input({ label: formLabel, helperText, placeholder, value, defaul
109
112
  borderWidth,
110
113
  borderColor,
111
114
  backgroundColor: bg,
112
- }, children: [resolvedLeading ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: ICON_SIZE, height: ICON_SIZE }, children: resolvedLeading })) : null, _jsx(TextInput, { value: value, defaultValue: defaultValue, onChangeText: onChangeText, placeholder: placeholder, placeholderTextColor: textTokens.placeholder, editable: !disabled, secureTextEntry: secureTextEntry, keyboardType: keyboardType, autoCapitalize: autoCapitalize, returnKeyType: returnKeyType, onSubmitEditing: onSubmitEditing, onFocus: () => {
115
+ }, children: [resolvedLeading ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: ICON_SIZE, height: ICON_SIZE }, children: resolvedLeading })) : null, (0, jsx_runtime_1.jsx)(react_native_1.TextInput, { value: value, defaultValue: defaultValue, onChangeText: onChangeText, placeholder: placeholder, placeholderTextColor: textTokens.placeholder, editable: !disabled, secureTextEntry: secureTextEntry, keyboardType: keyboardType, autoCapitalize: autoCapitalize, returnKeyType: returnKeyType, onSubmitEditing: onSubmitEditing, onFocus: () => {
113
116
  setIsFocused(true);
114
117
  onFocus?.();
115
118
  }, onBlur: () => {
@@ -117,23 +120,22 @@ export function Input({ label: formLabel, helperText, placeholder, value, defaul
117
120
  onBlur?.();
118
121
  }, accessibilityLabel: accessibilityLabel || formLabel, style: {
119
122
  flex: 1,
120
- fontFamily: fontFamily.sans,
121
- fontWeight: fontWeight.regular,
123
+ fontFamily: tokens_1.fontFamily.sans,
124
+ fontWeight: tokens_1.fontWeight.regular,
122
125
  fontSize: bodyTypo.fontSize,
123
126
  lineHeight: bodyTypo.lineHeight,
124
127
  letterSpacing: bodyTypo.letterSpacing,
125
128
  color: textColor,
126
129
  padding: 0,
127
- ...(Platform.OS === 'web'
130
+ ...(react_native_1.Platform.OS === 'web'
128
131
  ? { outlineWidth: 0 }
129
132
  : {}),
130
- } }), resolvedTrailing ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: ICON_SIZE, height: ICON_SIZE }, children: resolvedTrailing })) : null] }), helperText ? (_jsx(Text, { style: {
131
- fontFamily: fontFamily.sans,
132
- fontWeight: fontWeight.regular,
133
- fontSize: caption.fontSize,
134
- lineHeight: caption.lineHeight,
135
- letterSpacing: caption.letterSpacing,
133
+ } }), resolvedTrailing ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: ICON_SIZE, height: ICON_SIZE }, children: resolvedTrailing })) : null] }), helperText ? ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
134
+ fontFamily: tokens_1.fontFamily.sans,
135
+ fontWeight: tokens_1.fontWeight.regular,
136
+ fontSize: tokens_1.caption.fontSize,
137
+ lineHeight: tokens_1.caption.lineHeight,
138
+ letterSpacing: tokens_1.caption.letterSpacing,
136
139
  color: helperColor,
137
140
  }, selectable: false, children: helperText })) : null] }));
138
141
  }
139
- //# sourceMappingURL=Input.js.map
@@ -1,2 +1 @@
1
1
  export { Input, type InputProps, type InputSize } from './Input';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1,2 +1,5 @@
1
- export { Input } from './Input';
2
- //# sourceMappingURL=index.js.map
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Input = void 0;
4
+ var Input_1 = require("./Input");
5
+ Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return Input_1.Input; } });
@@ -56,4 +56,3 @@ export type ListItemProps = {
56
56
  accessibilityLabel?: string;
57
57
  };
58
58
  export declare function ListItem({ children, description, icon, trailingIcon, selected, disabled, onPress, style, accessibilityLabel, }: ListItemProps): import("react/jsx-runtime").JSX.Element;
59
- //# sourceMappingURL=List.d.ts.map
@@ -1,4 +1,10 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.List = List;
4
+ exports.ListSubheader = ListSubheader;
5
+ exports.ListDivider = ListDivider;
6
+ exports.ListItem = ListItem;
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
2
8
  /**
3
9
  * List — vertical collection of items with optional section subheaders.
4
10
  *
@@ -13,16 +19,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
19
  * icon size via the theme's `list` tokens. Colours come from the theme's
14
20
  * colour scheme (`scheme.list`, constant across densities).
15
21
  */
16
- import { useState } from 'react';
17
- import { Pressable, View, Text, } from 'react-native';
18
- import { useTheme } from '../../theme';
19
- import { Icon } from '../Icon';
20
- import { fontFamily, fontWeight, label, body, caption, } from '../../tokens';
21
- export function List({ children, style, accessibilityLabel }) {
22
- const { components, scheme } = useTheme();
22
+ const react_1 = require("react");
23
+ const react_native_1 = require("react-native");
24
+ const theme_1 = require("../../theme");
25
+ const Icon_1 = require("../Icon");
26
+ const tokens_1 = require("../../tokens");
27
+ function List({ children, style, accessibilityLabel }) {
28
+ const { components, scheme } = (0, theme_1.useTheme)();
23
29
  const listColors = scheme.list;
24
30
  const tokens = components.list;
25
- return (_jsx(View, { accessibilityRole: "list", accessibilityLabel: accessibilityLabel, style: [
31
+ return ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityRole: "list", accessibilityLabel: accessibilityLabel, style: [
26
32
  {
27
33
  backgroundColor: listColors.containerBg,
28
34
  gap: tokens.sectionGap,
@@ -31,29 +37,29 @@ export function List({ children, style, accessibilityLabel }) {
31
37
  style,
32
38
  ], children: children }));
33
39
  }
34
- export function ListSubheader({ children, style }) {
35
- const { components, scheme } = useTheme();
40
+ function ListSubheader({ children, style }) {
41
+ const { components, scheme } = (0, theme_1.useTheme)();
36
42
  const listColors = scheme.list;
37
43
  const tokens = components.list.subheader;
38
- return (_jsx(View, { style: [
44
+ return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [
39
45
  {
40
46
  paddingHorizontal: tokens.paddingX,
41
47
  paddingVertical: tokens.paddingY,
42
48
  },
43
49
  style,
44
- ], children: _jsx(Text, { style: {
45
- fontFamily: fontFamily.sans,
46
- fontWeight: fontWeight.regular,
47
- fontSize: caption.fontSize,
48
- lineHeight: caption.lineHeight,
49
- letterSpacing: caption.letterSpacing,
50
+ ], children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
51
+ fontFamily: tokens_1.fontFamily.sans,
52
+ fontWeight: tokens_1.fontWeight.regular,
53
+ fontSize: tokens_1.caption.fontSize,
54
+ lineHeight: tokens_1.caption.lineHeight,
55
+ letterSpacing: tokens_1.caption.letterSpacing,
50
56
  color: listColors.subheaderFg,
51
57
  }, selectable: false, children: children }) }));
52
58
  }
53
- export function ListDivider({ style }) {
54
- const { scheme } = useTheme();
59
+ function ListDivider({ style }) {
60
+ const { scheme } = (0, theme_1.useTheme)();
55
61
  const listColors = scheme.list;
56
- return (_jsx(View, { accessibilityRole: "none", style: [
62
+ return ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityRole: "none", style: [
57
63
  {
58
64
  height: 1,
59
65
  backgroundColor: listColors.separator,
@@ -61,11 +67,11 @@ export function ListDivider({ style }) {
61
67
  style,
62
68
  ] }));
63
69
  }
64
- export function ListItem({ children, description, icon, trailingIcon, selected = false, disabled = false, onPress, style, accessibilityLabel, }) {
65
- const { components, scheme } = useTheme();
70
+ function ListItem({ children, description, icon, trailingIcon, selected = false, disabled = false, onPress, style, accessibilityLabel, }) {
71
+ const { components, scheme } = (0, theme_1.useTheme)();
66
72
  const listColors = scheme.list;
67
73
  const tokens = components.list.item;
68
- const [isHovered, setIsHovered] = useState(false);
74
+ const [isHovered, setIsHovered] = (0, react_1.useState)(false);
69
75
  // State priority: disabled > selected+hover > selected > hover > default
70
76
  const colors = disabled
71
77
  ? listColors.item.disabled
@@ -76,9 +82,9 @@ export function ListItem({ children, description, icon, trailingIcon, selected =
76
82
  : isHovered
77
83
  ? listColors.item.hover
78
84
  : listColors.item.default;
79
- const resolvedIcon = typeof icon === 'string' ? (_jsx(Icon, { name: icon, size: tokens.iconSize, color: colors.fg })) : (icon);
80
- const resolvedTrailing = typeof trailingIcon === 'string' ? (_jsx(Icon, { name: trailingIcon, size: tokens.iconSize, color: colors.fg })) : (trailingIcon);
81
- return (_jsxs(Pressable, { onPress: (e) => {
85
+ const resolvedIcon = typeof icon === 'string' ? ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: icon, size: tokens.iconSize, color: colors.fg })) : (icon);
86
+ const resolvedTrailing = typeof trailingIcon === 'string' ? ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: trailingIcon, size: tokens.iconSize, color: colors.fg })) : (trailingIcon);
87
+ return ((0, jsx_runtime_1.jsxs)(react_native_1.Pressable, { onPress: (e) => {
82
88
  if (!disabled)
83
89
  onPress?.(e);
84
90
  }, onHoverIn: () => setIsHovered(true), onHoverOut: () => setIsHovered(false), disabled: disabled || !onPress, accessibilityRole: "menuitem", accessibilityLabel: accessibilityLabel || children, accessibilityState: { selected, disabled }, style: [
@@ -92,20 +98,19 @@ export function ListItem({ children, description, icon, trailingIcon, selected =
92
98
  backgroundColor: colors.bg,
93
99
  },
94
100
  style,
95
- ], children: [resolvedIcon ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: tokens.iconSize, height: tokens.iconSize }, children: resolvedIcon })) : null, _jsxs(View, { style: { flex: 1, justifyContent: 'center' }, children: [_jsx(Text, { style: {
96
- fontFamily: fontFamily.sans,
97
- fontWeight: fontWeight.medium,
98
- fontSize: label.md.fontSize,
99
- lineHeight: label.md.lineHeight,
100
- letterSpacing: label.md.letterSpacing,
101
+ ], children: [resolvedIcon ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: tokens.iconSize, height: tokens.iconSize }, children: resolvedIcon })) : null, (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: { flex: 1, justifyContent: 'center' }, children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
102
+ fontFamily: tokens_1.fontFamily.sans,
103
+ fontWeight: tokens_1.fontWeight.medium,
104
+ fontSize: tokens_1.label.md.fontSize,
105
+ lineHeight: tokens_1.label.md.lineHeight,
106
+ letterSpacing: tokens_1.label.md.letterSpacing,
101
107
  color: colors.fg,
102
- }, selectable: false, children: children }), description ? (_jsx(Text, { style: {
103
- fontFamily: fontFamily.sans,
104
- fontWeight: fontWeight.regular,
105
- fontSize: body.md.fontSize,
106
- lineHeight: body.md.lineHeight,
107
- letterSpacing: body.md.letterSpacing,
108
+ }, selectable: false, children: children }), description ? ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
109
+ fontFamily: tokens_1.fontFamily.sans,
110
+ fontWeight: tokens_1.fontWeight.regular,
111
+ fontSize: tokens_1.body.md.fontSize,
112
+ lineHeight: tokens_1.body.md.lineHeight,
113
+ letterSpacing: tokens_1.body.md.letterSpacing,
108
114
  color: disabled ? colors.fg : listColors.descriptionFg,
109
- }, selectable: false, children: description })) : null] }), resolvedTrailing ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: tokens.iconSize, height: tokens.iconSize }, children: resolvedTrailing })) : null] }));
115
+ }, selectable: false, children: description })) : null] }), resolvedTrailing ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: { width: tokens.iconSize, height: tokens.iconSize }, children: resolvedTrailing })) : null] }));
110
116
  }
111
- //# sourceMappingURL=List.js.map
@@ -1,2 +1 @@
1
1
  export { List, ListItem, ListSubheader, ListDivider, type ListProps, type ListItemProps, type ListSubheaderProps, type ListDividerProps, } from './List';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1,2 +1,8 @@
1
- export { List, ListItem, ListSubheader, ListDivider, } from './List';
2
- //# sourceMappingURL=index.js.map
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ListDivider = exports.ListSubheader = exports.ListItem = exports.List = void 0;
4
+ var List_1 = require("./List");
5
+ Object.defineProperty(exports, "List", { enumerable: true, get: function () { return List_1.List; } });
6
+ Object.defineProperty(exports, "ListItem", { enumerable: true, get: function () { return List_1.ListItem; } });
7
+ Object.defineProperty(exports, "ListSubheader", { enumerable: true, get: function () { return List_1.ListSubheader; } });
8
+ Object.defineProperty(exports, "ListDivider", { enumerable: true, get: function () { return List_1.ListDivider; } });
@@ -32,4 +32,3 @@ export type PopoverProps = {
32
32
  accessibilityLabel?: string;
33
33
  };
34
34
  export declare function Popover({ children, direction, size, hideArrow, style, accessibilityLabel, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
35
- //# sourceMappingURL=Popover.d.ts.map
@@ -1,6 +1,9 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { View, Platform, } from 'react-native';
3
- import { useTheme } from '../../theme';
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Popover = Popover;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_native_1 = require("react-native");
6
+ const theme_1 = require("../../theme");
4
7
  // ---------------------------------------------------------------------------
5
8
  // Constants
6
9
  // ---------------------------------------------------------------------------
@@ -15,7 +18,7 @@ const SHADOW_NATIVE = {
15
18
  shadowRadius: 6,
16
19
  elevation: 4,
17
20
  };
18
- const SHADOW = Platform.OS === 'web' ? SHADOW_WEB : SHADOW_NATIVE;
21
+ const SHADOW = react_native_1.Platform.OS === 'web' ? SHADOW_WEB : SHADOW_NATIVE;
19
22
  // ---------------------------------------------------------------------------
20
23
  // Component
21
24
  // ---------------------------------------------------------------------------
@@ -41,12 +44,12 @@ function arrowStyle(direction, arrowSize, backgroundColor) {
41
44
  return { ...base, bottom: -half, left: '50%', marginLeft: -half };
42
45
  }
43
46
  }
44
- export function Popover({ children, direction = 'bottom', size = 'default', hideArrow = false, style, accessibilityLabel, }) {
45
- const { components, scheme } = useTheme();
47
+ function Popover({ children, direction = 'bottom', size = 'default', hideArrow = false, style, accessibilityLabel, }) {
48
+ const { components, scheme } = (0, theme_1.useTheme)();
46
49
  const surfaceTokens = scheme.surface;
47
50
  const tokens = components.popover;
48
51
  const sizeTokens = tokens[size];
49
- return (_jsxs(View, { accessibilityLabel: accessibilityLabel, style: [
52
+ return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { accessibilityLabel: accessibilityLabel, style: [
50
53
  {
51
54
  alignSelf: 'flex-start',
52
55
  backgroundColor: surfaceTokens.overlay.bg,
@@ -55,6 +58,5 @@ export function Popover({ children, direction = 'bottom', size = 'default', hide
55
58
  ...SHADOW,
56
59
  },
57
60
  style,
58
- ], children: [!hideArrow ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: arrowStyle(direction, tokens.arrowSize, surfaceTokens.overlay.bg) })) : null, children] }));
61
+ ], children: [!hideArrow ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityElementsHidden: true, importantForAccessibility: "no", style: arrowStyle(direction, tokens.arrowSize, surfaceTokens.overlay.bg) })) : null, children] }));
59
62
  }
60
- //# sourceMappingURL=Popover.js.map
@@ -1,2 +1 @@
1
1
  export { Popover, type PopoverProps, type PopoverSize, type PopoverDirection, } from './Popover';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1,2 +1,5 @@
1
- export { Popover, } from './Popover';
2
- //# sourceMappingURL=index.js.map
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Popover = void 0;
4
+ var Popover_1 = require("./Popover");
5
+ Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return Popover_1.Popover; } });
@@ -50,4 +50,3 @@ export type RadioGroupProps = {
50
50
  };
51
51
  export declare function RadioGroup({ value, onValueChange, size, disabled, children, style, }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
52
52
  export declare function Radio({ value, checked, onChange, children, size, disabled, style, accessibilityLabel, }: RadioProps): import("react/jsx-runtime").JSX.Element;
53
- //# sourceMappingURL=Radio.d.ts.map
@@ -1,4 +1,8 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.RadioGroup = RadioGroup;
4
+ exports.Radio = Radio;
5
+ const jsx_runtime_1 = require("react/jsx-runtime");
2
6
  /**
3
7
  * Radio — single-choice control, used individually or within a RadioGroup.
4
8
  *
@@ -14,11 +18,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
14
18
  * RadioGroup provides single-selection semantics: each child Radio with a
15
19
  * `value` reflects `group.value === value` and reports selection upward.
16
20
  */
17
- import { createContext, useContext, useState, useCallback, } from 'react';
18
- import { Pressable, View, Text, } from 'react-native';
19
- import { useTheme } from '../../theme';
20
- import { fontFamily, fontWeight, label, controlTokens } from '../../tokens';
21
- const RadioGroupCtx = createContext(null);
21
+ const react_1 = require("react");
22
+ const react_native_1 = require("react-native");
23
+ const theme_1 = require("../../theme");
24
+ const tokens_1 = require("../../tokens");
25
+ const RadioGroupCtx = (0, react_1.createContext)(null);
22
26
  /** Maps radio size → label typography scale */
23
27
  const LABEL_SCALE = {
24
28
  small: 'sm',
@@ -28,26 +32,26 @@ const LABEL_SCALE = {
28
32
  // ---------------------------------------------------------------------------
29
33
  // RadioGroup
30
34
  // ---------------------------------------------------------------------------
31
- export function RadioGroup({ value, onValueChange, size = 'default', disabled = false, children, style, }) {
32
- const { components } = useTheme();
33
- return (_jsx(RadioGroupCtx.Provider, { value: { value, onValueChange, size, disabled }, children: _jsx(View, { accessibilityRole: "radiogroup", style: [{ gap: components.radio.gap }, style], children: children }) }));
35
+ function RadioGroup({ value, onValueChange, size = 'default', disabled = false, children, style, }) {
36
+ const { components } = (0, theme_1.useTheme)();
37
+ return ((0, jsx_runtime_1.jsx)(RadioGroupCtx.Provider, { value: { value, onValueChange, size, disabled }, children: (0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityRole: "radiogroup", style: [{ gap: components.radio.gap }, style], children: children }) }));
34
38
  }
35
39
  // ---------------------------------------------------------------------------
36
40
  // Radio
37
41
  // ---------------------------------------------------------------------------
38
- export function Radio({ value, checked, onChange, children, size, disabled, style, accessibilityLabel, }) {
39
- const { components, scheme } = useTheme();
42
+ function Radio({ value, checked, onChange, children, size, disabled, style, accessibilityLabel, }) {
43
+ const { components, scheme } = (0, theme_1.useTheme)();
40
44
  const radioColors = scheme.radio;
41
- const group = useContext(RadioGroupCtx);
45
+ const group = (0, react_1.useContext)(RadioGroupCtx);
42
46
  const resolvedSize = size ?? group?.size ?? 'default';
43
47
  const resolvedDisabled = disabled ?? group?.disabled ?? false;
44
48
  const isChecked = group != null && value != null ? group.value === value : checked === true;
45
49
  const tokens = components.radio;
46
50
  const sizeTokens = tokens[resolvedSize];
47
- const labelTokens = label[LABEL_SCALE[resolvedSize]];
48
- const [isHovered, setIsHovered] = useState(false);
49
- const [isFocused, setIsFocused] = useState(false);
50
- const handlePress = useCallback(() => {
51
+ const labelTokens = tokens_1.label[LABEL_SCALE[resolvedSize]];
52
+ const [isHovered, setIsHovered] = (0, react_1.useState)(false);
53
+ const [isFocused, setIsFocused] = (0, react_1.useState)(false);
54
+ const handlePress = (0, react_1.useCallback)(() => {
51
55
  if (resolvedDisabled)
52
56
  return;
53
57
  if (group != null && value != null) {
@@ -64,7 +68,7 @@ export function Radio({ value, checked, onChange, children, size, disabled, styl
64
68
  if (resolvedDisabled) {
65
69
  ringBg = radioColors.indicator.disabled.bg;
66
70
  ringBorderColor = radioColors.indicator.disabled.border;
67
- ringBorderWidth = controlTokens.borderWidth;
71
+ ringBorderWidth = tokens_1.controlTokens.borderWidth;
68
72
  }
69
73
  else if (isChecked) {
70
74
  ringBg = isHovered
@@ -83,20 +87,20 @@ export function Radio({ value, checked, onChange, children, size, disabled, styl
83
87
  }
84
88
  else if (isHovered) {
85
89
  ringBorderColor = radioColors.indicator.uncheckedHover.border;
86
- ringBorderWidth = controlTokens.borderWidth;
90
+ ringBorderWidth = tokens_1.controlTokens.borderWidth;
87
91
  }
88
92
  else {
89
93
  ringBorderColor = radioColors.indicator.uncheckedDefault.border;
90
- ringBorderWidth = controlTokens.borderWidth;
94
+ ringBorderWidth = tokens_1.controlTokens.borderWidth;
91
95
  }
92
96
  }
93
97
  const dotColor = resolvedDisabled
94
98
  ? radioColors.dot.disabled
95
99
  : radioColors.dot.default;
96
- return (_jsxs(Pressable, { onPress: handlePress, disabled: resolvedDisabled, onHoverIn: () => setIsHovered(true), onHoverOut: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), accessibilityRole: "radio", accessibilityLabel: accessibilityLabel || children, accessibilityState: { checked: isChecked, disabled: resolvedDisabled }, style: [
100
+ return ((0, jsx_runtime_1.jsxs)(react_native_1.Pressable, { onPress: handlePress, disabled: resolvedDisabled, onHoverIn: () => setIsHovered(true), onHoverOut: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), accessibilityRole: "radio", accessibilityLabel: accessibilityLabel || children, accessibilityState: { checked: isChecked, disabled: resolvedDisabled }, style: [
97
101
  { flexDirection: 'row', alignItems: 'flex-start', gap: tokens.gap },
98
102
  style,
99
- ], children: [_jsx(View, { style: {
103
+ ], children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: {
100
104
  width: sizeTokens.indicatorSize,
101
105
  height: sizeTokens.indicatorSize,
102
106
  borderRadius: tokens.borderRadius,
@@ -105,14 +109,14 @@ export function Radio({ value, checked, onChange, children, size, disabled, styl
105
109
  borderColor: ringBorderColor,
106
110
  alignItems: 'center',
107
111
  justifyContent: 'center',
108
- }, children: isChecked ? (_jsx(View, { style: {
112
+ }, children: isChecked ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: {
109
113
  width: sizeTokens.dotSize,
110
114
  height: sizeTokens.dotSize,
111
115
  borderRadius: sizeTokens.dotSize / 2,
112
116
  backgroundColor: dotColor,
113
- } })) : null }), children ? (_jsx(Text, { style: {
114
- fontFamily: fontFamily.sans,
115
- fontWeight: fontWeight.medium,
117
+ } })) : null }), children ? ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: {
118
+ fontFamily: tokens_1.fontFamily.sans,
119
+ fontWeight: tokens_1.fontWeight.medium,
116
120
  fontSize: labelTokens.fontSize,
117
121
  lineHeight: labelTokens.lineHeight,
118
122
  letterSpacing: labelTokens.letterSpacing,
@@ -121,4 +125,3 @@ export function Radio({ value, checked, onChange, children, size, disabled, styl
121
125
  : radioColors.label.default,
122
126
  }, selectable: false, children: children })) : null] }));
123
127
  }
124
- //# sourceMappingURL=Radio.js.map
@@ -1,2 +1 @@
1
1
  export { Radio, RadioGroup, type RadioProps, type RadioGroupProps, type RadioSize, } from './Radio';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1,2 +1,6 @@
1
- export { Radio, RadioGroup, } from './Radio';
2
- //# sourceMappingURL=index.js.map
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.RadioGroup = exports.Radio = void 0;
4
+ var Radio_1 = require("./Radio");
5
+ Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return Radio_1.Radio; } });
6
+ Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return Radio_1.RadioGroup; } });
@@ -93,4 +93,3 @@ export type SelectContentProps = {
93
93
  };
94
94
  export declare function SelectContent({ children, style }: SelectContentProps): import("react/jsx-runtime").JSX.Element;
95
95
  export declare function Select({ type, size, label: formLabel, helperText, placeholder, leadingIcon, disabled, error, value, onValueChange, values, onValuesChange, searchValue, onSearchChange, children, style, accessibilityLabel, }: SelectProps): import("react/jsx-runtime").JSX.Element;
96
- //# sourceMappingURL=Select.d.ts.map