@medway-ui/native 1.1.1 → 1.2.0
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/README.md +238 -105
- package/lib/commonjs/components/Alert.js +5 -4
- package/lib/commonjs/components/Alert.js.map +1 -1
- package/lib/commonjs/components/Avatar.js +2 -1
- package/lib/commonjs/components/Avatar.js.map +1 -1
- package/lib/commonjs/components/Badge.js +2 -1
- package/lib/commonjs/components/Badge.js.map +1 -1
- package/lib/commonjs/components/Button.js +3 -2
- package/lib/commonjs/components/Button.js.map +1 -1
- package/lib/commonjs/components/CardNews.js +7 -6
- package/lib/commonjs/components/CardNews.js.map +1 -1
- package/lib/commonjs/components/Carousel.js +122 -0
- package/lib/commonjs/components/Carousel.js.map +1 -0
- package/lib/commonjs/components/Checkbox.js +11 -2
- package/lib/commonjs/components/Checkbox.js.map +1 -1
- package/lib/commonjs/components/DropdownMenu.js +225 -0
- package/lib/commonjs/components/DropdownMenu.js.map +1 -0
- package/lib/commonjs/components/EmptyState.js +19 -20
- package/lib/commonjs/components/EmptyState.js.map +1 -1
- package/lib/commonjs/components/Feed.js +82 -0
- package/lib/commonjs/components/Feed.js.map +1 -0
- package/lib/commonjs/components/FeedNotice.js +76 -0
- package/lib/commonjs/components/FeedNotice.js.map +1 -0
- package/lib/commonjs/components/Input.js +21 -9
- package/lib/commonjs/components/Input.js.map +1 -1
- package/lib/commonjs/components/InvitePopover.js +196 -0
- package/lib/commonjs/components/InvitePopover.js.map +1 -0
- package/lib/commonjs/components/Label.js +2 -1
- package/lib/commonjs/components/Label.js.map +1 -1
- package/lib/commonjs/components/LeaderboardCard.js +58 -0
- package/lib/commonjs/components/LeaderboardCard.js.map +1 -0
- package/lib/commonjs/components/MemberRow.js +131 -0
- package/lib/commonjs/components/MemberRow.js.map +1 -0
- package/lib/commonjs/components/PageHeader.js +3 -2
- package/lib/commonjs/components/PageHeader.js.map +1 -1
- package/lib/commonjs/components/PostForm.js +182 -0
- package/lib/commonjs/components/PostForm.js.map +1 -0
- package/lib/commonjs/components/PrizeCollection.js +135 -0
- package/lib/commonjs/components/PrizeCollection.js.map +1 -0
- package/lib/commonjs/components/RadioGroup.js +22 -0
- package/lib/commonjs/components/RadioGroup.js.map +1 -1
- package/lib/commonjs/components/SectionHeader.js +36 -0
- package/lib/commonjs/components/SectionHeader.js.map +1 -0
- package/lib/commonjs/components/Switch.js +33 -19
- package/lib/commonjs/components/Switch.js.map +1 -1
- package/lib/commonjs/components/Tabs.js +156 -0
- package/lib/commonjs/components/Tabs.js.map +1 -0
- package/lib/commonjs/components/Tag.js +2 -1
- package/lib/commonjs/components/Tag.js.map +1 -1
- package/lib/commonjs/components/Text.js +60 -0
- package/lib/commonjs/components/Text.js.map +1 -0
- package/lib/commonjs/components/Toast.js +3 -2
- package/lib/commonjs/components/Toast.js.map +1 -1
- package/lib/commonjs/components/Tooltip.js +2 -2
- package/lib/commonjs/components/Tooltip.js.map +1 -1
- package/lib/commonjs/hooks/useThemeColor.js +66 -29
- package/lib/commonjs/hooks/useThemeColor.js.map +1 -1
- package/lib/commonjs/index.js +319 -1
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/lib/overlay-host.js +101 -0
- package/lib/commonjs/lib/overlay-host.js.map +1 -0
- package/lib/commonjs/lib/typography.js +26 -0
- package/lib/commonjs/lib/typography.js.map +1 -0
- package/lib/commonjs/nativewind-env.d.js +0 -1
- package/lib/commonjs/nativewind-env.d.js.map +1 -1
- package/lib/module/components/Alert.js +3 -2
- package/lib/module/components/Alert.js.map +1 -1
- package/lib/module/components/Avatar.js +2 -1
- package/lib/module/components/Avatar.js.map +1 -1
- package/lib/module/components/Badge.js +2 -1
- package/lib/module/components/Badge.js.map +1 -1
- package/lib/module/components/Button.js +2 -1
- package/lib/module/components/Button.js.map +1 -1
- package/lib/module/components/CardNews.js +2 -1
- package/lib/module/components/CardNews.js.map +1 -1
- package/lib/module/components/Carousel.js +117 -0
- package/lib/module/components/Carousel.js.map +1 -0
- package/lib/module/components/Checkbox.js +12 -2
- package/lib/module/components/Checkbox.js.map +1 -1
- package/lib/module/components/DropdownMenu.js +216 -0
- package/lib/module/components/DropdownMenu.js.map +1 -0
- package/lib/module/components/EmptyState.js +19 -20
- package/lib/module/components/EmptyState.js.map +1 -1
- package/lib/module/components/Feed.js +77 -0
- package/lib/module/components/Feed.js.map +1 -0
- package/lib/module/components/FeedNotice.js +73 -0
- package/lib/module/components/FeedNotice.js.map +1 -0
- package/lib/module/components/Input.js +21 -9
- package/lib/module/components/Input.js.map +1 -1
- package/lib/module/components/InvitePopover.js +183 -0
- package/lib/module/components/InvitePopover.js.map +1 -0
- package/lib/module/components/Label.js +2 -1
- package/lib/module/components/Label.js.map +1 -1
- package/lib/module/components/LeaderboardCard.js +53 -0
- package/lib/module/components/LeaderboardCard.js.map +1 -0
- package/lib/module/components/MemberRow.js +127 -0
- package/lib/module/components/MemberRow.js.map +1 -0
- package/lib/module/components/PageHeader.js +2 -1
- package/lib/module/components/PageHeader.js.map +1 -1
- package/lib/module/components/PostForm.js +174 -0
- package/lib/module/components/PostForm.js.map +1 -0
- package/lib/module/components/PrizeCollection.js +127 -0
- package/lib/module/components/PrizeCollection.js.map +1 -0
- package/lib/module/components/RadioGroup.js +21 -1
- package/lib/module/components/RadioGroup.js.map +1 -1
- package/lib/module/components/SectionHeader.js +33 -0
- package/lib/module/components/SectionHeader.js.map +1 -0
- package/lib/module/components/Switch.js +34 -20
- package/lib/module/components/Switch.js.map +1 -1
- package/lib/module/components/Tabs.js +148 -0
- package/lib/module/components/Tabs.js.map +1 -0
- package/lib/module/components/Tag.js +2 -1
- package/lib/module/components/Tag.js.map +1 -1
- package/lib/module/components/Text.js +58 -0
- package/lib/module/components/Text.js.map +1 -0
- package/lib/module/components/Toast.js +2 -1
- package/lib/module/components/Toast.js.map +1 -1
- package/lib/module/components/Tooltip.js +1 -1
- package/lib/module/components/Tooltip.js.map +1 -1
- package/lib/module/hooks/useThemeColor.js +66 -31
- package/lib/module/hooks/useThemeColor.js.map +1 -1
- package/lib/module/index.js +27 -3
- package/lib/module/index.js.map +1 -1
- package/lib/module/lib/overlay-host.js +96 -0
- package/lib/module/lib/overlay-host.js.map +1 -0
- package/lib/module/lib/typography.js +22 -0
- package/lib/module/lib/typography.js.map +1 -0
- package/lib/module/nativewind-env.d.js +0 -1
- package/lib/module/nativewind-env.d.js.map +1 -1
- package/lib/typescript/components/Alert.d.ts.map +1 -1
- package/lib/typescript/components/Avatar.d.ts.map +1 -1
- package/lib/typescript/components/Badge.d.ts.map +1 -1
- package/lib/typescript/components/Button.d.ts.map +1 -1
- package/lib/typescript/components/CardNews.d.ts.map +1 -1
- package/lib/typescript/components/Carousel.d.ts +29 -0
- package/lib/typescript/components/Carousel.d.ts.map +1 -0
- package/lib/typescript/components/Checkbox.d.ts.map +1 -1
- package/lib/typescript/components/DropdownMenu.d.ts +39 -0
- package/lib/typescript/components/DropdownMenu.d.ts.map +1 -0
- package/lib/typescript/components/EmptyState.d.ts +1 -1
- package/lib/typescript/components/EmptyState.d.ts.map +1 -1
- package/lib/typescript/components/Feed.d.ts +22 -0
- package/lib/typescript/components/Feed.d.ts.map +1 -0
- package/lib/typescript/components/FeedNotice.d.ts +17 -0
- package/lib/typescript/components/FeedNotice.d.ts.map +1 -0
- package/lib/typescript/components/Input.d.ts +3 -2
- package/lib/typescript/components/Input.d.ts.map +1 -1
- package/lib/typescript/components/InvitePopover.d.ts +46 -0
- package/lib/typescript/components/InvitePopover.d.ts.map +1 -0
- package/lib/typescript/components/Label.d.ts.map +1 -1
- package/lib/typescript/components/LeaderboardCard.d.ts +16 -0
- package/lib/typescript/components/LeaderboardCard.d.ts.map +1 -0
- package/lib/typescript/components/MemberRow.d.ts +40 -0
- package/lib/typescript/components/MemberRow.d.ts.map +1 -0
- package/lib/typescript/components/PageHeader.d.ts.map +1 -1
- package/lib/typescript/components/PostForm.d.ts +50 -0
- package/lib/typescript/components/PostForm.d.ts.map +1 -0
- package/lib/typescript/components/PrizeCollection.d.ts +35 -0
- package/lib/typescript/components/PrizeCollection.d.ts.map +1 -0
- package/lib/typescript/components/RadioGroup.d.ts +10 -2
- package/lib/typescript/components/RadioGroup.d.ts.map +1 -1
- package/lib/typescript/components/SectionHeader.d.ts +12 -0
- package/lib/typescript/components/SectionHeader.d.ts.map +1 -0
- package/lib/typescript/components/Switch.d.ts.map +1 -1
- package/lib/typescript/components/Tabs.d.ts +32 -0
- package/lib/typescript/components/Tabs.d.ts.map +1 -0
- package/lib/typescript/components/Tag.d.ts.map +1 -1
- package/lib/typescript/components/Text.d.ts +23 -0
- package/lib/typescript/components/Text.d.ts.map +1 -0
- package/lib/typescript/components/Toast.d.ts +1 -1
- package/lib/typescript/components/Toast.d.ts.map +1 -1
- package/lib/typescript/components/Tooltip.d.ts.map +1 -1
- package/lib/typescript/hooks/useThemeColor.d.ts +4 -2
- package/lib/typescript/hooks/useThemeColor.d.ts.map +1 -1
- package/lib/typescript/index.d.ts +28 -4
- package/lib/typescript/index.d.ts.map +1 -1
- package/lib/typescript/lib/overlay-host.d.ts +23 -0
- package/lib/typescript/lib/overlay-host.d.ts.map +1 -0
- package/lib/typescript/lib/typography.d.ts +12 -0
- package/lib/typescript/lib/typography.d.ts.map +1 -0
- package/package.json +13 -3
- package/setup/MedwayUiProvider.tsx +15 -4
- package/setup/babel-brownfield.js +70 -0
- package/setup/metro.js +95 -24
- package/setup/tailwind.js +76 -8
- package/setup/tokens.native.css +8 -3
- package/src/components/Alert.tsx +4 -2
- package/src/components/Avatar.tsx +3 -1
- package/src/components/Badge.tsx +3 -1
- package/src/components/Button.tsx +3 -7
- package/src/components/CardNews.tsx +2 -1
- package/src/components/Carousel.tsx +152 -0
- package/src/components/Checkbox.tsx +14 -4
- package/src/components/DropdownMenu.tsx +312 -0
- package/src/components/EmptyState.tsx +21 -23
- package/src/components/Feed.tsx +96 -0
- package/src/components/FeedNotice.tsx +112 -0
- package/src/components/Input.tsx +11 -6
- package/src/components/InvitePopover.tsx +240 -0
- package/src/components/Label.tsx +3 -1
- package/src/components/LeaderboardCard.tsx +70 -0
- package/src/components/MemberRow.tsx +157 -0
- package/src/components/PageHeader.tsx +3 -1
- package/src/components/PostForm.tsx +250 -0
- package/src/components/PrizeCollection.tsx +190 -0
- package/src/components/RadioGroup.tsx +32 -3
- package/src/components/SectionHeader.tsx +45 -0
- package/src/components/Switch.tsx +65 -59
- package/src/components/Tabs.tsx +182 -0
- package/src/components/Tag.tsx +3 -1
- package/src/components/Text.tsx +66 -0
- package/src/components/Toast.tsx +3 -1
- package/src/components/Tooltip.tsx +2 -1
- package/src/hooks/useThemeColor.ts +77 -32
- package/src/index.ts +147 -6
- package/src/lib/overlay-host.tsx +102 -0
- package/src/lib/typography.ts +21 -0
- package/src/nativewind-env.d.ts +2 -0
package/README.md
CHANGED
|
@@ -1,25 +1,35 @@
|
|
|
1
1
|
# @medway-ui/native
|
|
2
2
|
|
|
3
|
-
React Native components for iOS and Android. Same API as `@medway-ui/core`, built on
|
|
3
|
+
React Native components for iOS and Android (Expo). Same visual API as `@medway-ui/core`, built on NativeWind + `@rn-primitives`.
|
|
4
|
+
|
|
5
|
+
**Minimum recommended version for npm brownfield setup:** `1.1.2+`
|
|
6
|
+
|
|
7
|
+
---
|
|
4
8
|
|
|
5
9
|
## Installation
|
|
6
10
|
|
|
7
11
|
```bash
|
|
8
|
-
|
|
9
|
-
|
|
12
|
+
npm install @medway-ui/native @medway-ui/core @medway-ui/icons \
|
|
13
|
+
class-variance-authority clsx tailwind-merge nativewind \
|
|
14
|
+
react-native-reanimated react-native-svg
|
|
10
15
|
|
|
11
|
-
|
|
16
|
+
# Expo (aligns versions with your SDK)
|
|
17
|
+
npx expo install react-native-reanimated react-native-svg
|
|
18
|
+
```
|
|
12
19
|
|
|
13
|
-
|
|
20
|
+
Brownfield apps that already use `babel-plugin-module-resolver` with `@/` aliases pointing at the app `src/` also need:
|
|
14
21
|
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
["babel-preset-expo", { jsxImportSource: "nativewind" }], "nativewind/babel"
|
|
22
|
+
```bash
|
|
23
|
+
npm install -D babel-plugin-module-resolver
|
|
18
24
|
```
|
|
19
25
|
|
|
20
|
-
|
|
26
|
+
---
|
|
27
|
+
|
|
28
|
+
## Brownfield setup (Expo + legacy UI / Restyle)
|
|
21
29
|
|
|
22
|
-
|
|
30
|
+
NativeWind applies **only** to `@medway-ui/native` + screens/components that use the library (e.g. `src/pages/medway-ui/`, partially migrated features).
|
|
31
|
+
|
|
32
|
+
Reference implementation: **test-prep-app** (`metro.config.js`, `babel.config.js`, `tailwind.config.js`, `src/pages/medway-ui/`).
|
|
23
33
|
|
|
24
34
|
### 1. `metro.config.js`
|
|
25
35
|
|
|
@@ -29,10 +39,18 @@ const { withMedwayUi } = require("@medway-ui/native/metro");
|
|
|
29
39
|
|
|
30
40
|
module.exports = withMedwayUi(getDefaultConfig(__dirname), {
|
|
31
41
|
projectRoot: __dirname,
|
|
32
|
-
linkedMedwayUiRoot:
|
|
42
|
+
// linkedMedwayUiRoot: auto-detected (npm or monorepo)
|
|
33
43
|
});
|
|
34
44
|
```
|
|
35
45
|
|
|
46
|
+
| Scenario | `linkedMedwayUiRoot` |
|
|
47
|
+
| --- | --- |
|
|
48
|
+
| npm packages (`npm install`) | **Omit** — auto-detects `node_modules/@medway-ui` |
|
|
49
|
+
| Monorepo with local clone | `"../medway-ui"` (optional; also auto-detected) |
|
|
50
|
+
| Symlink `file:../medway-ui/native` | Auto-detected as monorepo |
|
|
51
|
+
|
|
52
|
+
> Do **not** set `resolveNativeSource: false` — the compiled lib still references internal `@/` aliases. The default (`true`) resolves to `native/src` and works with npm.
|
|
53
|
+
|
|
36
54
|
### 2. `tailwind.config.js`
|
|
37
55
|
|
|
38
56
|
```js
|
|
@@ -40,77 +58,193 @@ const { createMedwayUiTailwindConfig } = require("@medway-ui/native/tailwind");
|
|
|
40
58
|
|
|
41
59
|
module.exports = createMedwayUiTailwindConfig({
|
|
42
60
|
projectRoot: __dirname,
|
|
43
|
-
content: [
|
|
61
|
+
content: [
|
|
62
|
+
"./src/pages/medway-ui/**/*.{ts,tsx}",
|
|
63
|
+
// add extra folders that use className + @medway-ui/native:
|
|
64
|
+
// "./src/pages/MyFeature/**/*.{ts,tsx}",
|
|
65
|
+
],
|
|
44
66
|
});
|
|
45
67
|
```
|
|
46
68
|
|
|
69
|
+
`createMedwayUiTailwindConfig` already includes globs for `node_modules/@medway-ui/native/src` and loads tokens from `@medway-ui/core` (Node 22+ compatible).
|
|
70
|
+
|
|
47
71
|
### 3. `babel.config.js`
|
|
48
72
|
|
|
73
|
+
The app default preset must **not** enable NativeWind globally. Use `createBrownfieldOverride` to scope NativeWind to the library + migrated screens folder.
|
|
74
|
+
|
|
75
|
+
If the app defines `@/` aliases for `./src/*` via `babel-plugin-module-resolver`, you **must** redirect `@/` imports from `@medway-ui/native` files to the library source — otherwise imports like `@/components/Badge` resolve to the app `src/` and break the bundle.
|
|
76
|
+
|
|
49
77
|
```js
|
|
50
|
-
const {
|
|
78
|
+
const {
|
|
79
|
+
createBrownfieldOverride,
|
|
80
|
+
createMedwayUiAliasResolver,
|
|
81
|
+
} = require("@medway-ui/native/babel-brownfield");
|
|
82
|
+
|
|
83
|
+
const resolveMedwayUiAlias = createMedwayUiAliasResolver(__dirname);
|
|
51
84
|
|
|
52
85
|
module.exports = function (api) {
|
|
53
86
|
api.cache(true);
|
|
87
|
+
|
|
88
|
+
const appPlugins = [
|
|
89
|
+
[
|
|
90
|
+
"module-resolver",
|
|
91
|
+
{
|
|
92
|
+
root: ["."],
|
|
93
|
+
extensions: [".ios.ts", ".android.ts", ".ts", ".tsx", ".js", ".jsx", ".json"],
|
|
94
|
+
alias: {
|
|
95
|
+
"@/components": "./src/components",
|
|
96
|
+
"@/pages": "./src/pages",
|
|
97
|
+
// ... other app aliases
|
|
98
|
+
},
|
|
99
|
+
resolvePath(sourcePath, currentFile) {
|
|
100
|
+
return resolveMedwayUiAlias(sourcePath, currentFile);
|
|
101
|
+
},
|
|
102
|
+
},
|
|
103
|
+
],
|
|
104
|
+
// other app plugins (no reanimated here)
|
|
105
|
+
];
|
|
106
|
+
|
|
54
107
|
return {
|
|
55
108
|
presets: ["babel-preset-expo"],
|
|
56
|
-
plugins:
|
|
57
|
-
overrides: [
|
|
109
|
+
plugins: appPlugins,
|
|
110
|
+
overrides: [
|
|
111
|
+
createBrownfieldOverride({
|
|
112
|
+
projectRoot: __dirname,
|
|
113
|
+
appPagesDir: "medway-ui", // src/pages subfolder with NativeWind screens
|
|
114
|
+
plugins: [
|
|
115
|
+
// repeat any plugins needed in the medway-ui scope
|
|
116
|
+
"react-native-reanimated/plugin", // always last
|
|
117
|
+
],
|
|
118
|
+
}),
|
|
119
|
+
],
|
|
58
120
|
};
|
|
59
121
|
};
|
|
60
122
|
```
|
|
61
123
|
|
|
62
|
-
|
|
124
|
+
Apps **without** `@/` Babel aliases do not need `createMedwayUiAliasResolver`.
|
|
63
125
|
|
|
64
|
-
|
|
126
|
+
### 4. Provider + CSS
|
|
127
|
+
|
|
128
|
+
Wrap the subtree that uses `@medway-ui/native` with `MedwayUiProvider` and import CSS once:
|
|
65
129
|
|
|
66
130
|
```tsx
|
|
67
|
-
import {
|
|
131
|
+
import { MedwayUiProvider } from "@medway-ui/native/setup";
|
|
132
|
+
import "@medway-ui/native/setup/global.css";
|
|
133
|
+
|
|
134
|
+
function MyScreen() {
|
|
135
|
+
return (
|
|
136
|
+
<MedwayUiProvider theme="system">
|
|
137
|
+
{/* Button, CardNews, etc. */}
|
|
138
|
+
</MedwayUiProvider>
|
|
139
|
+
);
|
|
140
|
+
}
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
**Dark mode:** pass `colorScheme="light" | "dark"` when the app already resolves theme (Redux, Zustand, etc.):
|
|
144
|
+
|
|
145
|
+
```tsx
|
|
146
|
+
<MedwayUiProvider colorScheme={appColorScheme}>
|
|
147
|
+
{children}
|
|
148
|
+
</MedwayUiProvider>
|
|
149
|
+
```
|
|
150
|
+
|
|
151
|
+
`MedwayUiProvider` includes `PortalHost` (required for Select, Dialog, Popover, Tooltip).
|
|
68
152
|
|
|
69
|
-
|
|
153
|
+
> Do **not** import `@medway-ui/core/tokens.css` directly — incompatible with NativeWind v4. Tokens come from `setup/global.css` + `setup/tokens.native.css`.
|
|
154
|
+
|
|
155
|
+
### 5. Auto navigator (catalog / isolated screens)
|
|
156
|
+
|
|
157
|
+
Create once `src/pages/medway-ui/navigator.tsx`:
|
|
158
|
+
|
|
159
|
+
```tsx
|
|
160
|
+
import { createMedwayUiNavigator, MedwayUiProvider } from "@medway-ui/native/setup";
|
|
161
|
+
import "@medway-ui/native/setup/global.css";
|
|
162
|
+
|
|
163
|
+
const { MedwayUiNavigator } = createMedwayUiNavigator(
|
|
70
164
|
require.context(".", true, /^\.\/[^/]+\/index\.tsx$/),
|
|
71
165
|
);
|
|
166
|
+
|
|
167
|
+
function MedwayUiRoot() {
|
|
168
|
+
return (
|
|
169
|
+
<MedwayUiProvider theme="system">
|
|
170
|
+
<MedwayUiNavigator />
|
|
171
|
+
</MedwayUiProvider>
|
|
172
|
+
);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
export { MedwayUiRoot, MedwayUiNavigator };
|
|
72
176
|
```
|
|
73
177
|
|
|
74
|
-
|
|
178
|
+
Register in the app stack:
|
|
75
179
|
|
|
76
|
-
|
|
180
|
+
```tsx
|
|
181
|
+
<Stack.Screen name="MedwayUi" component={MedwayUiRoot} options={{ headerShown: false }} />
|
|
182
|
+
```
|
|
183
|
+
|
|
184
|
+
New screen = new folder `src/pages/medway-ui/MyScreen/index.tsx` — no manual route registration.
|
|
77
185
|
|
|
78
|
-
|
|
186
|
+
### 6. Using components in existing screens (Restyle + Medway UI mix)
|
|
187
|
+
|
|
188
|
+
Pattern used in Content Hub and partially migrated features:
|
|
189
|
+
|
|
190
|
+
```tsx
|
|
191
|
+
import { Button, CardNews } from "@medway-ui/native";
|
|
192
|
+
import { MedwayUiProvider } from "@medway-ui/native/setup";
|
|
193
|
+
import "@medway-ui/native/setup/global.css";
|
|
194
|
+
|
|
195
|
+
function ContentHubScreen() {
|
|
196
|
+
return (
|
|
197
|
+
<Box> {/* Restyle */}
|
|
198
|
+
<MedwayUiProvider colorScheme={colorScheme}>
|
|
199
|
+
<CardNews>{/* ... */}</CardNews>
|
|
200
|
+
</MedwayUiProvider>
|
|
201
|
+
</Box>
|
|
202
|
+
);
|
|
203
|
+
}
|
|
204
|
+
```
|
|
205
|
+
|
|
206
|
+
Add the feature folder to `content` in `tailwind.config.js`.
|
|
79
207
|
|
|
80
208
|
---
|
|
81
209
|
|
|
82
|
-
##
|
|
210
|
+
## Monorepo development (`file:../medway-ui/native`)
|
|
83
211
|
|
|
84
|
-
|
|
212
|
+
```json
|
|
213
|
+
{
|
|
214
|
+
"@medway-ui/core": "file:../medway-ui",
|
|
215
|
+
"@medway-ui/native": "file:../medway-ui/native"
|
|
216
|
+
}
|
|
217
|
+
```
|
|
85
218
|
|
|
86
|
-
|
|
87
|
-
const { colors, fontFamily, fontSize, fontWeight, lineHeight, borderRadius, boxShadow } =
|
|
88
|
-
require("@medway-ui/core/tokens");
|
|
219
|
+
Metro and Babel auto-detect the local clone. After library changes:
|
|
89
220
|
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
"./app/**/*.{ts,tsx}",
|
|
93
|
-
"./components/**/*.{ts,tsx}",
|
|
94
|
-
"./node_modules/@medway-ui/native/src/**/*.{ts,tsx}",
|
|
95
|
-
],
|
|
96
|
-
presets: [require("nativewind/preset")],
|
|
97
|
-
theme: {
|
|
98
|
-
extend: {
|
|
99
|
-
colors,
|
|
100
|
-
fontFamily,
|
|
101
|
-
fontSize,
|
|
102
|
-
fontWeight,
|
|
103
|
-
lineHeight,
|
|
104
|
-
borderRadius,
|
|
105
|
-
boxShadow,
|
|
106
|
-
},
|
|
107
|
-
},
|
|
108
|
-
};
|
|
221
|
+
```bash
|
|
222
|
+
cd ../medway-ui/native && npm run build:lib # if testing the compiled lib
|
|
109
223
|
```
|
|
110
224
|
|
|
111
|
-
|
|
225
|
+
Restart Metro with a clean cache: `npx expo start --clear`.
|
|
226
|
+
|
|
227
|
+
---
|
|
228
|
+
|
|
229
|
+
## Troubleshooting
|
|
230
|
+
|
|
231
|
+
| Error | Cause | Fix |
|
|
232
|
+
| --- | --- | --- |
|
|
233
|
+
| `Unable to resolve .../src/components/Badge` | App `@/` alias overrides lib `@/` | Add `createMedwayUiAliasResolver` in Babel |
|
|
234
|
+
| `Unable to resolve @/lib/medwayIcons` | Bug in `@medway-ui/native@1.1.1` | Upgrade to `1.1.2+` |
|
|
235
|
+
| `Unable to resolve ../../../../../src/...` from `lib/module/` | `resolveNativeSource: false` | Remove the option (use default `true`) |
|
|
236
|
+
| Tokens / tailwind fail to load (Node 22+) | `require` of `.ts` inside `node_modules` | Use `@medway-ui/native@1.1.2+` (`createMedwayUiTailwindConfig` uses jiti fallback) |
|
|
237
|
+
| NativeWind styles not applied | File outside brownfield scope | Move to `src/pages/medway-ui/` or add a tailwind glob |
|
|
238
|
+
| Select/Dialog not opening | Missing `PortalHost` | Use `MedwayUiProvider` |
|
|
239
|
+
|
|
240
|
+
---
|
|
241
|
+
|
|
242
|
+
## Greenfield setup (100% NativeWind app)
|
|
243
|
+
|
|
244
|
+
For new apps without legacy UI:
|
|
112
245
|
|
|
113
246
|
```js
|
|
247
|
+
// babel.config.js
|
|
114
248
|
module.exports = function (api) {
|
|
115
249
|
api.cache(true);
|
|
116
250
|
return {
|
|
@@ -118,42 +252,38 @@ module.exports = function (api) {
|
|
|
118
252
|
["babel-preset-expo", { jsxImportSource: "nativewind" }],
|
|
119
253
|
"nativewind/babel",
|
|
120
254
|
],
|
|
255
|
+
plugins: ["react-native-reanimated/plugin"],
|
|
121
256
|
};
|
|
122
257
|
};
|
|
123
258
|
```
|
|
124
259
|
|
|
125
|
-
### 3. `metro.config.js`
|
|
126
|
-
|
|
127
260
|
```js
|
|
261
|
+
// metro.config.js
|
|
128
262
|
const { getDefaultConfig } = require("expo/metro-config");
|
|
129
|
-
const {
|
|
130
|
-
|
|
131
|
-
const config = getDefaultConfig(__dirname);
|
|
132
|
-
|
|
133
|
-
module.exports = withNativeWind(config, { input: "./global.css" });
|
|
134
|
-
```
|
|
135
|
-
|
|
136
|
-
### 4. `global.css`
|
|
263
|
+
const { withMedwayUi } = require("@medway-ui/native/metro");
|
|
137
264
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
@tailwind utilities;
|
|
265
|
+
module.exports = withMedwayUi(getDefaultConfig(__dirname), {
|
|
266
|
+
projectRoot: __dirname,
|
|
267
|
+
});
|
|
142
268
|
```
|
|
143
269
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
In your root `_layout.tsx`:
|
|
270
|
+
Import `@medway-ui/native/setup/global.css` in the root layout.
|
|
147
271
|
|
|
148
|
-
|
|
149
|
-
import "@medway-ui/core/tokens.css";
|
|
150
|
-
import "./global.css";
|
|
151
|
-
```
|
|
272
|
+
---
|
|
152
273
|
|
|
153
274
|
## Usage
|
|
154
275
|
|
|
155
276
|
```tsx
|
|
156
|
-
import {
|
|
277
|
+
import {
|
|
278
|
+
Alert,
|
|
279
|
+
AlertContainer,
|
|
280
|
+
AlertContent,
|
|
281
|
+
AlertTitle,
|
|
282
|
+
AlertDescription,
|
|
283
|
+
Badge,
|
|
284
|
+
Button,
|
|
285
|
+
Input,
|
|
286
|
+
} from "@medway-ui/native";
|
|
157
287
|
|
|
158
288
|
export default function Screen() {
|
|
159
289
|
return (
|
|
@@ -168,15 +298,16 @@ export default function Screen() {
|
|
|
168
298
|
size="lg"
|
|
169
299
|
value={email}
|
|
170
300
|
onChangeText={setEmail}
|
|
301
|
+
placeholder="email@example.com"
|
|
171
302
|
/>
|
|
172
303
|
|
|
173
304
|
<Alert variant="success" onClose={() => {}}>
|
|
174
|
-
<
|
|
175
|
-
<
|
|
176
|
-
<
|
|
177
|
-
<
|
|
178
|
-
</
|
|
179
|
-
</
|
|
305
|
+
<AlertContainer>
|
|
306
|
+
<AlertContent>
|
|
307
|
+
<AlertTitle>Done</AlertTitle>
|
|
308
|
+
<AlertDescription>Operation completed successfully.</AlertDescription>
|
|
309
|
+
</AlertContent>
|
|
310
|
+
</AlertContainer>
|
|
180
311
|
</Alert>
|
|
181
312
|
|
|
182
313
|
<Badge variant="regular" size="md">9+</Badge>
|
|
@@ -187,40 +318,42 @@ export default function Screen() {
|
|
|
187
318
|
|
|
188
319
|
## Icons
|
|
189
320
|
|
|
190
|
-
The `@medway-ui/icons` package
|
|
321
|
+
The `@medway-ui/icons` package includes a native entry point:
|
|
191
322
|
|
|
192
323
|
```tsx
|
|
193
324
|
import { Check, CloseMd } from "@medway-ui/icons/native";
|
|
194
325
|
```
|
|
195
326
|
|
|
196
|
-
|
|
327
|
+
---
|
|
328
|
+
|
|
329
|
+
## Components — status
|
|
197
330
|
|
|
198
331
|
| Component | Status | Notes |
|
|
199
|
-
|
|
200
|
-
| Button | ✅
|
|
201
|
-
| Input | ✅
|
|
202
|
-
| Alert | ✅
|
|
203
|
-
| Badge | ✅
|
|
204
|
-
| Loading | ✅
|
|
205
|
-
| Checkbox | ✅
|
|
206
|
-
| RadioGroup | ✅
|
|
207
|
-
| Switch | ✅
|
|
208
|
-
| Select | ✅
|
|
209
|
-
| Label | ✅
|
|
210
|
-
| Separator | ✅
|
|
211
|
-
| Dialog | ✅
|
|
212
|
-
| AlertDialog | ✅
|
|
213
|
-
| Sheet | ✅
|
|
214
|
-
| Tag | ✅
|
|
215
|
-
| Toast | ✅
|
|
216
|
-
| Tooltip | ✅
|
|
217
|
-
| Popover | ✅
|
|
218
|
-
|
|
|
219
|
-
|
|
|
220
|
-
|
|
|
221
|
-
|
|
|
222
|
-
|
|
|
223
|
-
|
|
|
224
|
-
|
|
|
225
|
-
| Cards | 🔜
|
|
226
|
-
| DatePicker | 🔜
|
|
332
|
+
| --- | --- | --- |
|
|
333
|
+
| Button | ✅ | Variants, loading, badge, alert dot |
|
|
334
|
+
| Input | ✅ | text, email, password, numeric |
|
|
335
|
+
| Alert | ✅ | Sub-components, all variants |
|
|
336
|
+
| Badge | ✅ | Variants, icon-only |
|
|
337
|
+
| Loading | ✅ | Reanimated spin |
|
|
338
|
+
| Checkbox | ✅ | @rn-primitives/checkbox |
|
|
339
|
+
| RadioGroup | ✅ | @rn-primitives/radio-group |
|
|
340
|
+
| Switch | ✅ | @rn-primitives/switch |
|
|
341
|
+
| Select | ✅ | @rn-primitives/select |
|
|
342
|
+
| Label | ✅ | Pressable + Text |
|
|
343
|
+
| Separator | ✅ | View 1px |
|
|
344
|
+
| Dialog | ✅ | @rn-primitives/dialog |
|
|
345
|
+
| AlertDialog | ✅ | @rn-primitives/alert-dialog |
|
|
346
|
+
| Sheet | ✅ | @rn-primitives/dialog (side-aware) |
|
|
347
|
+
| Tag | ✅ | 16+ variants |
|
|
348
|
+
| Toast | ✅ | useToast + toast() |
|
|
349
|
+
| Tooltip | ✅ | @rn-primitives/tooltip |
|
|
350
|
+
| Popover | ✅ | @rn-primitives/popover |
|
|
351
|
+
| Skeleton | ✅ | Shimmer |
|
|
352
|
+
| Avatar | ✅ | @rn-primitives/avatar |
|
|
353
|
+
| FallbackImage | ✅ | react-native-svg |
|
|
354
|
+
| CardNews | ✅ | Composable card (Content Hub) |
|
|
355
|
+
| Tabs | 🔜 | @rn-primitives/tabs |
|
|
356
|
+
| Progress | 🔜 | @rn-primitives/progress |
|
|
357
|
+
| ProgressCircle | 🔜 | react-native-svg |
|
|
358
|
+
| Cards | 🔜 | CardModule, CardLesson, etc. |
|
|
359
|
+
| DatePicker | 🔜 | @react-native-community/datetimepicker |
|
|
@@ -14,6 +14,7 @@ exports.AlertTitle = AlertTitle;
|
|
|
14
14
|
exports.alertVariants = exports.alertButtonVariants = void 0;
|
|
15
15
|
var _react = require("react");
|
|
16
16
|
var _reactNative = require("react-native");
|
|
17
|
+
var _Text = require("@/components/Text");
|
|
17
18
|
var _classVarianceAuthority = require("class-variance-authority");
|
|
18
19
|
var _native = require("@medway-ui/icons/native");
|
|
19
20
|
var _useThemeColor = require("@/hooks/useThemeColor");
|
|
@@ -145,7 +146,7 @@ function AlertTitle({
|
|
|
145
146
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
146
147
|
className: (0, _utils.cn)("", className),
|
|
147
148
|
...props,
|
|
148
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
149
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
149
150
|
numberOfLines: 1,
|
|
150
151
|
className: (0, _utils.cn)("text-md font-medium", alertTextColorVariants({
|
|
151
152
|
variant
|
|
@@ -165,9 +166,9 @@ function AlertDescription({
|
|
|
165
166
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
166
167
|
className: (0, _utils.cn)("", className),
|
|
167
168
|
...props,
|
|
168
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
169
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
169
170
|
numberOfLines: 3,
|
|
170
|
-
className: (0, _utils.cn)("text-sm leading-5", alertTextColorVariants({
|
|
171
|
+
className: (0, _utils.cn)("text-sm font-medium leading-5", alertTextColorVariants({
|
|
171
172
|
variant
|
|
172
173
|
})),
|
|
173
174
|
children: children
|
|
@@ -198,7 +199,7 @@ function AlertButton({
|
|
|
198
199
|
}), className),
|
|
199
200
|
accessibilityRole: "button",
|
|
200
201
|
...props,
|
|
201
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
202
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
202
203
|
className: (0, _utils.cn)("text-sm font-semibold", alertTextColorVariants({
|
|
203
204
|
variant: alertVariant
|
|
204
205
|
})),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_classVarianceAuthority","_native","_useThemeColor","_utils","_jsxRuntime","AlertContext","createContext","alertVariants","exports","cva","variants","variant","regular","emphasis","success","warning","error","defaultVariants","alertTextColorVariants","alertButtonVariants","basic","alertVariant","useAlertContext","context","useContext","Error","Alert","className","onClose","children","props","ctx","useMemo","closeIconColor","useThemeColor","jsx","Provider","value","jsxs","View","accessibilityRole","cn","Pressable","onPress","accessibilityLabel","CloseMd","width","height","color","AlertContainer","AlertContent","AlertIcon","icon","AlertTitle","Text","numberOfLines","AlertDescription","AlertActions","AlertButton"],"sourceRoot":"../../../src","sources":["components/Alert.tsx"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAMA,IAAAC,YAAA,GAAAD,OAAA;
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_Text","_classVarianceAuthority","_native","_useThemeColor","_utils","_jsxRuntime","AlertContext","createContext","alertVariants","exports","cva","variants","variant","regular","emphasis","success","warning","error","defaultVariants","alertTextColorVariants","alertButtonVariants","basic","alertVariant","useAlertContext","context","useContext","Error","Alert","className","onClose","children","props","ctx","useMemo","closeIconColor","useThemeColor","jsx","Provider","value","jsxs","View","accessibilityRole","cn","Pressable","onPress","accessibilityLabel","CloseMd","width","height","color","AlertContainer","AlertContent","AlertIcon","icon","AlertTitle","Text","numberOfLines","AlertDescription","AlertActions","AlertButton"],"sourceRoot":"../../../src","sources":["components/Alert.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,6 +8,7 @@ exports.AvatarFallback = AvatarFallback;
|
|
|
8
8
|
exports.AvatarImage = AvatarImage;
|
|
9
9
|
exports.avatarVariants = void 0;
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
|
+
var _Text = require("@/components/Text");
|
|
11
12
|
var AvatarPrimitive = _interopRequireWildcard(require("@rn-primitives/avatar"));
|
|
12
13
|
var _classVarianceAuthority = require("class-variance-authority");
|
|
13
14
|
var _native = require("@medway-ui/icons/native");
|
|
@@ -88,7 +89,7 @@ function AvatarFallback({
|
|
|
88
89
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(AvatarPrimitive.Fallback, {
|
|
89
90
|
className: (0, _utils.cn)("flex size-full items-center justify-center rounded-full bg-gray-background-soft", className),
|
|
90
91
|
...props,
|
|
91
|
-
children: children ? typeof children === "string" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
92
|
+
children: children ? typeof children === "string" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
92
93
|
className: "text-sm font-semibold text-primary-foreground",
|
|
93
94
|
children: children
|
|
94
95
|
}) : children : iconColor ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_native.User, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","AvatarPrimitive","_interopRequireWildcard","_classVarianceAuthority","_native","_Badge","_useThemeColor","_utils","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","badgeSizeMap","sm","md","lg","xl","avatarVariants","exports","cva","variants","size","defaultVariants","Avatar","className","badge","children","alt","fallback","props","content","jsx","AvatarFallback","jsxs","View","Badge","String","Root","cn","AvatarImage","src","source","resolvedSource","uri","undefined","Image","iconColor","useThemeColor","Fallback","Text","User","width","height","color"],"sourceRoot":"../../../src","sources":["components/Avatar.tsx"],"mappings":";;;;;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_Text","AvatarPrimitive","_interopRequireWildcard","_classVarianceAuthority","_native","_Badge","_useThemeColor","_utils","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","badgeSizeMap","sm","md","lg","xl","avatarVariants","exports","cva","variants","size","defaultVariants","Avatar","className","badge","children","alt","fallback","props","content","jsx","AvatarFallback","jsxs","View","Badge","String","Root","cn","AvatarImage","src","source","resolvedSource","uri","undefined","Image","iconColor","useThemeColor","Fallback","Text","User","width","height","color"],"sourceRoot":"../../../src","sources":["components/Avatar.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.Badge = Badge;
|
|
7
7
|
exports.badgeVariants = void 0;
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
|
+
var _Text = require("@/components/Text");
|
|
9
10
|
var _classVarianceAuthority = require("class-variance-authority");
|
|
10
11
|
var _utils = require("@/lib/utils");
|
|
11
12
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
@@ -82,7 +83,7 @@ function Badge({
|
|
|
82
83
|
size
|
|
83
84
|
}), (isIconOnly || isSingleAlphaNum) && ICON_ONLY_SIZES[size ?? "md"], !isIconOnly && isShortUpTo3 && CHAR_PADDING[size ?? "md"], className),
|
|
84
85
|
...props,
|
|
85
|
-
children: [icon, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
86
|
+
children: [icon, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
86
87
|
className: (0, _utils.cn)(badgeTextVariants({
|
|
87
88
|
variant,
|
|
88
89
|
size
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_classVarianceAuthority","_utils","_jsxRuntime","ICON_ONLY_SIZES","sm","md","lg","xl","CHAR_PADDING","badgeVariants","exports","cva","variants","variant","regular","error","warning","freemium","size","defaultVariants","badgeTextVariants","Badge","className","icon","animation","_animation","children","props","childText","String","trim","isSingleAlphaNum","test","isShortAlnumUpTo3","isDigitsWithSuffix","isIconOnly","isShortUpTo3","jsxs","View","cn","jsx","Text"],"sourceRoot":"../../../src","sources":["components/Badge.tsx"],"mappings":";;;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_Text","_classVarianceAuthority","_utils","_jsxRuntime","ICON_ONLY_SIZES","sm","md","lg","xl","CHAR_PADDING","badgeVariants","exports","cva","variants","variant","regular","error","warning","freemium","size","defaultVariants","badgeTextVariants","Badge","className","icon","animation","_animation","children","props","childText","String","trim","isSingleAlphaNum","test","isShortAlnumUpTo3","isDigitsWithSuffix","isIconOnly","isShortUpTo3","jsxs","View","cn","jsx","Text"],"sourceRoot":"../../../src","sources":["components/Badge.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.Button = Button;
|
|
7
7
|
exports.buttonVariants = exports.buttonTextVariants = void 0;
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
|
+
var _Text = require("@/components/Text");
|
|
9
10
|
var _classVarianceAuthority = require("class-variance-authority");
|
|
10
11
|
var _utils = require("@/lib/utils");
|
|
11
12
|
var _Loading = require("@/components/Loading");
|
|
@@ -148,7 +149,7 @@ function Button({
|
|
|
148
149
|
})
|
|
149
150
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
150
151
|
className: "opacity-0 flex-row items-center gap-2",
|
|
151
|
-
children: [iconLeft, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
152
|
+
children: [iconLeft, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
152
153
|
className: (0, _utils.cn)(buttonTextVariants({
|
|
153
154
|
variant: resolvedVariant,
|
|
154
155
|
size
|
|
@@ -167,7 +168,7 @@ function Button({
|
|
|
167
168
|
backgroundColor: alert
|
|
168
169
|
}
|
|
169
170
|
})
|
|
170
|
-
}) : iconLeft, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
171
|
+
}) : iconLeft, children != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
171
172
|
className: (0, _utils.cn)(buttonTextVariants({
|
|
172
173
|
variant: resolvedVariant,
|
|
173
174
|
size
|