react-native-terra-ui 0.10.2 → 0.11.1
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/CHANGELOG.md +28 -0
- package/README.md +8 -4
- package/lib/module/components/badge/Badge.js +174 -0
- package/lib/module/components/badge/Badge.js.map +1 -0
- package/lib/module/components/badge/index.js +4 -0
- package/lib/module/components/badge/index.js.map +1 -0
- package/lib/module/components/badge/parts/BadgeIndicator.js +191 -0
- package/lib/module/components/badge/parts/BadgeIndicator.js.map +1 -0
- package/lib/module/components/badge/types.js +4 -0
- package/lib/module/components/badge/types.js.map +1 -0
- package/lib/module/components/badge/utils.js +25 -0
- package/lib/module/components/badge/utils.js.map +1 -0
- package/lib/module/components/index.js +1 -0
- package/lib/module/components/index.js.map +1 -1
- package/lib/module/context/ThemeProvider.js +5 -5
- package/lib/module/context/ThemeProvider.js.map +1 -1
- package/lib/module/theme/define-config.js +5 -5
- package/lib/module/theme/define-config.js.map +1 -1
- package/lib/module/theme/errors.js +1 -1
- package/lib/module/theme/index.js +2 -2
- package/lib/module/theme/index.js.map +1 -1
- package/lib/module/theme/registry.js +15 -21
- package/lib/module/theme/registry.js.map +1 -1
- package/lib/module/theme/resolve-config.js +68 -68
- package/lib/module/theme/resolve-config.js.map +1 -1
- package/lib/module/theme/runtime.js +11 -11
- package/lib/module/theme/runtime.js.map +1 -1
- package/lib/module/theme/selection-store.js +7 -7
- package/lib/module/theme/selection-store.js.map +1 -1
- package/lib/module/theme/unistyles-adapter.js +1 -1
- package/lib/module/utils/accent-utils.js +24 -24
- package/lib/module/utils/accent-utils.js.map +1 -1
- package/lib/typescript/src/components/badge/Badge.d.ts +16 -0
- package/lib/typescript/src/components/badge/Badge.d.ts.map +1 -0
- package/lib/typescript/src/components/badge/index.d.ts +3 -0
- package/lib/typescript/src/components/badge/index.d.ts.map +1 -0
- package/lib/typescript/src/components/badge/parts/BadgeIndicator.d.ts +19 -0
- package/lib/typescript/src/components/badge/parts/BadgeIndicator.d.ts.map +1 -0
- package/lib/typescript/src/components/badge/types.d.ts +48 -0
- package/lib/typescript/src/components/badge/types.d.ts.map +1 -0
- package/lib/typescript/src/components/badge/utils.d.ts +13 -0
- package/lib/typescript/src/components/badge/utils.d.ts.map +1 -0
- package/lib/typescript/src/components/index.d.ts +1 -0
- package/lib/typescript/src/components/index.d.ts.map +1 -1
- package/lib/typescript/src/context/ThemeProvider.d.ts +7 -7
- package/lib/typescript/src/context/ThemeProvider.d.ts.map +1 -1
- package/lib/typescript/src/theme/define-config.d.ts +11 -8
- package/lib/typescript/src/theme/define-config.d.ts.map +1 -1
- package/lib/typescript/src/theme/errors.d.ts +1 -1
- package/lib/typescript/src/theme/index.d.ts +3 -3
- package/lib/typescript/src/theme/index.d.ts.map +1 -1
- package/lib/typescript/src/theme/registry.d.ts +5 -5
- package/lib/typescript/src/theme/registry.d.ts.map +1 -1
- package/lib/typescript/src/theme/resolve-config.d.ts +25 -25
- package/lib/typescript/src/theme/resolve-config.d.ts.map +1 -1
- package/lib/typescript/src/theme/runtime.d.ts +5 -5
- package/lib/typescript/src/theme/runtime.d.ts.map +1 -1
- package/lib/typescript/src/theme/selection-store.d.ts +5 -5
- package/lib/typescript/src/theme/selection-store.d.ts.map +1 -1
- package/lib/typescript/src/theme/types.d.ts +20 -47
- package/lib/typescript/src/theme/types.d.ts.map +1 -1
- package/lib/typescript/src/theme/unistyles-adapter.d.ts +1 -1
- package/lib/typescript/src/utils/accent-utils.d.ts +6 -7
- package/lib/typescript/src/utils/accent-utils.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/badge/Badge.tsx +111 -0
- package/src/components/badge/index.ts +2 -0
- package/src/components/badge/parts/BadgeIndicator.tsx +166 -0
- package/src/components/badge/types.ts +58 -0
- package/src/components/badge/utils.ts +24 -0
- package/src/components/index.ts +1 -0
- package/src/context/ThemeProvider.tsx +10 -10
- package/src/theme/define-config.ts +12 -7
- package/src/theme/errors.ts +1 -1
- package/src/theme/index.ts +6 -8
- package/src/theme/registry.ts +15 -23
- package/src/theme/resolve-config.ts +88 -95
- package/src/theme/runtime.ts +11 -11
- package/src/theme/selection-store.ts +9 -9
- package/src/theme/types.ts +21 -47
- package/src/theme/unistyles-adapter.ts +1 -1
- package/src/utils/accent-utils.ts +25 -25
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,33 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [0.11.1](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.0...v0.11.1) (2026-09-12)
|
|
4
|
+
|
|
5
|
+
### Features
|
|
6
|
+
|
|
7
|
+
* **ui:** [badge] add Badge wrapper component ([4c3f49c](https://github.com/earthlin9/react-native-terra-ui/commit/4c3f49c9725f77bf4cbd479094335d710190d978))
|
|
8
|
+
|
|
9
|
+
## [0.11.0](https://github.com/earthlin9/react-native-terra-ui/compare/v0.10.2...v0.11.0) (2026-09-12)
|
|
10
|
+
|
|
11
|
+
### ⚠ BREAKING CHANGES
|
|
12
|
+
|
|
13
|
+
* **theme:** `accents` is now `themes`, `defaultAccent` is now
|
|
14
|
+
`defaultTheme`, and `schemes.light/dark` is removed — move those tokens
|
|
15
|
+
into each named theme's `light`/`dark` entry. The `{ seed, overrides }`
|
|
16
|
+
form is now `{ seed, color }`. `applyAccent`/`getCurrentAccent`/
|
|
17
|
+
`getAccentNames` become `setTheme`/`getCurrentTheme`/`getThemeNames`,
|
|
18
|
+
`useTheme().accent`/`setAccent` become `themeName`/`setTheme`,
|
|
19
|
+
`createTerraThemes(config, { accent })` takes `{ theme }`, and
|
|
20
|
+
`ThemeSelection.accent` is `ThemeSelection.themeName`.
|
|
21
|
+
See docs/named-theme-migration.md.
|
|
22
|
+
|
|
23
|
+
### Features
|
|
24
|
+
|
|
25
|
+
* **theme:** replace schemes and accents with named themes ([#25](https://github.com/earthlin9/react-native-terra-ui/issues/25))
|
|
26
|
+
|
|
27
|
+
### Documentation
|
|
28
|
+
|
|
29
|
+
* scaffold the component API reference ([#24](https://github.com/earthlin9/react-native-terra-ui/issues/24)) ([3204657](https://github.com/earthlin9/react-native-terra-ui/commit/3204657868ec2c008d628ec9a06307227d0587cc))
|
|
30
|
+
|
|
3
31
|
## [0.10.2](https://github.com/earthlin9/react-native-terra-ui/compare/v0.10.1...v0.10.2) (2026-09-11)
|
|
4
32
|
|
|
5
33
|
### Features
|
package/README.md
CHANGED
|
@@ -9,7 +9,7 @@ Themeable React Native UI components built on react-native-unistyles.
|
|
|
9
9
|
| `react-native-terra-ui` | Components, `TerraUIProvider`, `useTheme` |
|
|
10
10
|
| `react-native-terra-ui/theme` | `configureTerraUI`, theme types, color utilities (no import-time side effects) |
|
|
11
11
|
|
|
12
|
-
Use the `/theme` entry for `configureTerraUI()` in your app entry file. See [docs/getting-started.md](../../docs/getting-started.md); upgrading an existing configuration is covered in [docs/theme-
|
|
12
|
+
Use the `/theme` entry for `configureTerraUI()` in your app entry file. See [docs/getting-started.md](../../docs/getting-started.md); upgrading an existing configuration is covered in [docs/named-theme-migration.md](../../docs/named-theme-migration.md).
|
|
13
13
|
|
|
14
14
|
## Components
|
|
15
15
|
|
|
@@ -51,15 +51,19 @@ toast.show({ label: 'Saved', variant: 'success' });
|
|
|
51
51
|
| Export | Description |
|
|
52
52
|
|--------|-------------|
|
|
53
53
|
| `TerraUIProvider` | Root provider — wrap your app once |
|
|
54
|
-
| `useTheme` |
|
|
54
|
+
| `useTheme` | Resolved tokens, named theme selection, and appearance mode |
|
|
55
55
|
| `ToastProvider`, `useToast` | Toast stack provider and manager hook |
|
|
56
56
|
|
|
57
57
|
## Theme API (`react-native-terra-ui/theme`)
|
|
58
58
|
|
|
59
|
-
- `configureTerraUI` — register themes,
|
|
59
|
+
- `configureTerraUI` — register named light/dark themes, icons, and component defaults
|
|
60
|
+
- `defineTerraConfig` — author config with typed `defaultTheme` names
|
|
61
|
+
- `createTerraThemes` — resolve named themes for previews and tests
|
|
62
|
+
- `setTheme`, `getCurrentTheme`, `getThemeNames` — select and inspect named themes
|
|
63
|
+
- `setThemeMode`, `getThemeMode` — control system/light/dark appearance
|
|
60
64
|
- `defaultLightTheme`, `defaultDarkTheme` — built-in theme objects
|
|
61
65
|
- `resolveThemeColor`, `deepMerge`, `shade`, `withAlpha`, `readableOn` — color utilities
|
|
62
|
-
- Types: `TerraTheme`, `TerraConfig`, `
|
|
66
|
+
- Types: `TerraTheme`, `TerraConfig`, `NamedTheme`, `ThemeSchemeInput`, `ThemeSeed`, `ThemeMode`, `Scheme`, `ColorToken`, etc.
|
|
63
67
|
|
|
64
68
|
## Showcase
|
|
65
69
|
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { View } from "react-native-unistyles/components/native/View";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
import { StyleSheet } from "react-native-unistyles";
|
|
6
|
+
import { BadgeIndicator } from "./parts/BadgeIndicator.js";
|
|
7
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
+
/**
|
|
9
|
+
* Overlays a count or status indicator on one corner of the element it wraps.
|
|
10
|
+
*
|
|
11
|
+
* ```tsx
|
|
12
|
+
* <Badge placement="top-right" color="danger" label={3}>
|
|
13
|
+
* <Toolbar.Button icon="bell" accessibilityLabel="Notifications" />
|
|
14
|
+
* </Badge>
|
|
15
|
+
* ```
|
|
16
|
+
*
|
|
17
|
+
* The child renders untouched — `Badge` contributes the positioning context and
|
|
18
|
+
* the overlay, nothing else.
|
|
19
|
+
*/
|
|
20
|
+
const Badge = /*#__PURE__*/forwardRef(function Badge({
|
|
21
|
+
children,
|
|
22
|
+
placement = "top-right",
|
|
23
|
+
label,
|
|
24
|
+
color = "danger",
|
|
25
|
+
size = "md",
|
|
26
|
+
isVisible = true,
|
|
27
|
+
fullWidth = false,
|
|
28
|
+
accessibilityLabel,
|
|
29
|
+
style,
|
|
30
|
+
...rest
|
|
31
|
+
}, ref) {
|
|
32
|
+
const _styles = styles;
|
|
33
|
+
{
|
|
34
|
+
const styles = _styles.useVariants({
|
|
35
|
+
placement,
|
|
36
|
+
size,
|
|
37
|
+
fullWidth
|
|
38
|
+
});
|
|
39
|
+
return (
|
|
40
|
+
/*#__PURE__*/
|
|
41
|
+
// `style` last so an explicit `alignSelf` beats `fullWidth`.
|
|
42
|
+
_jsxs(View, {
|
|
43
|
+
ref: ref,
|
|
44
|
+
style: [styles.wrapper, style],
|
|
45
|
+
...rest,
|
|
46
|
+
children: [children, isVisible ? /*#__PURE__*/_jsx(View, {
|
|
47
|
+
pointerEvents: "box-none",
|
|
48
|
+
style: styles.anchor,
|
|
49
|
+
children: /*#__PURE__*/_jsx(BadgeIndicator, {
|
|
50
|
+
label: label,
|
|
51
|
+
color: color,
|
|
52
|
+
size: size,
|
|
53
|
+
accessibilityLabel: accessibilityLabel
|
|
54
|
+
})
|
|
55
|
+
}) : null]
|
|
56
|
+
})
|
|
57
|
+
);
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
export { Badge };
|
|
61
|
+
|
|
62
|
+
// ─── Styles ───────────────────────────────────────────────────────────────────
|
|
63
|
+
//
|
|
64
|
+
// The indicator is positioned by absolute insets picked from `size`, never by
|
|
65
|
+
// measuring the child — its overhang is a function of its own size, not the
|
|
66
|
+
// child's. Which edges those insets land on is `placement`, and the magnitude
|
|
67
|
+
// is `size`, so the two interact and the offsets are compound variants.
|
|
68
|
+
//
|
|
69
|
+
// The inset equals the dot's radius, which puts a dot's centre exactly on the
|
|
70
|
+
// child's corner. A pill keeps the same anchored edges and grows inward from
|
|
71
|
+
// them, so a longer label extends across the child rather than away from it.
|
|
72
|
+
const styles = StyleSheet.create(() => ({
|
|
73
|
+
wrapper: {
|
|
74
|
+
position: "relative",
|
|
75
|
+
variants: {
|
|
76
|
+
// `alignSelf: 'flex-start'` hugs the child, so the indicator anchors to
|
|
77
|
+
// the child's bounds rather than the surrounding container's. A child
|
|
78
|
+
// that was stretching needs `fullWidth` to go on doing so.
|
|
79
|
+
fullWidth: {
|
|
80
|
+
true: {
|
|
81
|
+
alignSelf: "stretch"
|
|
82
|
+
},
|
|
83
|
+
false: {
|
|
84
|
+
alignSelf: "flex-start"
|
|
85
|
+
}
|
|
86
|
+
},
|
|
87
|
+
placement: {
|
|
88
|
+
"top-right": {},
|
|
89
|
+
"top-left": {},
|
|
90
|
+
"bottom-right": {},
|
|
91
|
+
"bottom-left": {}
|
|
92
|
+
},
|
|
93
|
+
size: {
|
|
94
|
+
sm: {},
|
|
95
|
+
md: {}
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
uni__dependencies: [4]
|
|
99
|
+
},
|
|
100
|
+
anchor: {
|
|
101
|
+
position: "absolute",
|
|
102
|
+
variants: {
|
|
103
|
+
placement: {
|
|
104
|
+
"top-right": {},
|
|
105
|
+
"top-left": {},
|
|
106
|
+
"bottom-right": {},
|
|
107
|
+
"bottom-left": {}
|
|
108
|
+
},
|
|
109
|
+
size: {
|
|
110
|
+
sm: {},
|
|
111
|
+
md: {}
|
|
112
|
+
}
|
|
113
|
+
},
|
|
114
|
+
compoundVariants: [{
|
|
115
|
+
placement: "top-right",
|
|
116
|
+
size: "sm",
|
|
117
|
+
styles: {
|
|
118
|
+
top: -5,
|
|
119
|
+
right: -5
|
|
120
|
+
}
|
|
121
|
+
}, {
|
|
122
|
+
placement: "top-right",
|
|
123
|
+
size: "md",
|
|
124
|
+
styles: {
|
|
125
|
+
top: -6,
|
|
126
|
+
right: -6
|
|
127
|
+
}
|
|
128
|
+
}, {
|
|
129
|
+
placement: "top-left",
|
|
130
|
+
size: "sm",
|
|
131
|
+
styles: {
|
|
132
|
+
top: -5,
|
|
133
|
+
left: -5
|
|
134
|
+
}
|
|
135
|
+
}, {
|
|
136
|
+
placement: "top-left",
|
|
137
|
+
size: "md",
|
|
138
|
+
styles: {
|
|
139
|
+
top: -6,
|
|
140
|
+
left: -6
|
|
141
|
+
}
|
|
142
|
+
}, {
|
|
143
|
+
placement: "bottom-right",
|
|
144
|
+
size: "sm",
|
|
145
|
+
styles: {
|
|
146
|
+
bottom: -5,
|
|
147
|
+
right: -5
|
|
148
|
+
}
|
|
149
|
+
}, {
|
|
150
|
+
placement: "bottom-right",
|
|
151
|
+
size: "md",
|
|
152
|
+
styles: {
|
|
153
|
+
bottom: -6,
|
|
154
|
+
right: -6
|
|
155
|
+
}
|
|
156
|
+
}, {
|
|
157
|
+
placement: "bottom-left",
|
|
158
|
+
size: "sm",
|
|
159
|
+
styles: {
|
|
160
|
+
bottom: -5,
|
|
161
|
+
left: -5
|
|
162
|
+
}
|
|
163
|
+
}, {
|
|
164
|
+
placement: "bottom-left",
|
|
165
|
+
size: "md",
|
|
166
|
+
styles: {
|
|
167
|
+
bottom: -6,
|
|
168
|
+
left: -6
|
|
169
|
+
}
|
|
170
|
+
}],
|
|
171
|
+
uni__dependencies: [4]
|
|
172
|
+
}
|
|
173
|
+
}));
|
|
174
|
+
//# sourceMappingURL=Badge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","StyleSheet","BadgeIndicator","jsx","_jsx","jsxs","_jsxs","Badge","children","placement","label","color","size","isVisible","fullWidth","accessibilityLabel","style","rest","ref","_styles","styles","useVariants","View","wrapper","pointerEvents","anchor","create","position","variants","true","alignSelf","false","sm","md","uni__dependencies","compoundVariants","top","right","left","bottom"],"sourceRoot":"../../../../src","sources":["components/badge/Badge.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Badge"],"sourceRoot":"../../../../src","sources":["components/badge/index.ts"],"mappings":";;AAAA,SAASA,KAAK","ignoreList":[]}
|
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { View } from "react-native-unistyles/components/native/View";
|
|
4
|
+
import { Text as RNText } from "react-native-unistyles/components/native/Text";
|
|
5
|
+
import { StyleSheet, useUnistyles } from "react-native-unistyles";
|
|
6
|
+
import { resolveThemeColor } from "../../../utils/resolve-theme-color.js";
|
|
7
|
+
import { FONT_WEIGHT_VALUE, SYSTEM_FONT } from "../../../utils/typography.js";
|
|
8
|
+
import { getCustomBadgeColors, hasLabel } from "../utils.js";
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
const SCHEME_NAMES = new Set(["primary", "secondary", "success", "warning", "danger"]);
|
|
11
|
+
/** Label foreground per scheme — mirrors the spec's token table. */
|
|
12
|
+
const FG_TOKEN = {
|
|
13
|
+
primary: "accent.solid.fg",
|
|
14
|
+
secondary: "neutral.solid.fg",
|
|
15
|
+
success: "success.solid.fg",
|
|
16
|
+
warning: "warning.solid.fg",
|
|
17
|
+
danger: "danger.solid.fg"
|
|
18
|
+
};
|
|
19
|
+
const LABEL_VARIANT = {
|
|
20
|
+
sm: "label-sm",
|
|
21
|
+
md: "label-md"
|
|
22
|
+
};
|
|
23
|
+
/**
|
|
24
|
+
* The overlay itself: a dot, or a pill carrying the label. Owns the paint, the
|
|
25
|
+
* legibility ring, and the accessibility node — the wrapper owns only position.
|
|
26
|
+
*
|
|
27
|
+
* `useUnistyles` is called unconditionally, which is what subscribes this
|
|
28
|
+
* component to theme changes. The background below comes from a variant, which
|
|
29
|
+
* unistyles applies straight to the native node on a theme switch; without a
|
|
30
|
+
* re-render React would go on believing the node holds the previous theme's
|
|
31
|
+
* value. `Chip` documents the same hazard on its root.
|
|
32
|
+
*/
|
|
33
|
+
export const BadgeIndicator = ({
|
|
34
|
+
label,
|
|
35
|
+
color,
|
|
36
|
+
size,
|
|
37
|
+
accessibilityLabel
|
|
38
|
+
}) => {
|
|
39
|
+
const {
|
|
40
|
+
theme
|
|
41
|
+
} = useUnistyles();
|
|
42
|
+
// A literal never matches one of the five variant options, so it's cast to
|
|
43
|
+
// satisfy `useVariants`'s literal-union type while still being compared
|
|
44
|
+
// against the real value below.
|
|
45
|
+
const _styles = styles;
|
|
46
|
+
{
|
|
47
|
+
const styles = _styles.useVariants({
|
|
48
|
+
color: color,
|
|
49
|
+
size
|
|
50
|
+
});
|
|
51
|
+
const custom = SCHEME_NAMES.has(color) ? null : getCustomBadgeColors(color);
|
|
52
|
+
const labelled = hasLabel(label);
|
|
53
|
+
const foreground = custom ? custom.fg : FG_TOKEN[color];
|
|
54
|
+
|
|
55
|
+
// An explicit label wins even on a dot; a dot with nothing to announce is
|
|
56
|
+
// decorative and hidden rather than read out as an unlabelled element.
|
|
57
|
+
const announced = accessibilityLabel ?? (labelled ? String(label) : undefined);
|
|
58
|
+
const accessibility = announced ? {
|
|
59
|
+
accessible: true,
|
|
60
|
+
accessibilityLabel: announced
|
|
61
|
+
} : {
|
|
62
|
+
accessibilityElementsHidden: true,
|
|
63
|
+
importantForAccessibility: "no-hide-descendants",
|
|
64
|
+
"aria-hidden": true
|
|
65
|
+
};
|
|
66
|
+
return /*#__PURE__*/_jsx(View, {
|
|
67
|
+
style: [styles.indicator, labelled ? styles.pill : styles.dot, custom ? {
|
|
68
|
+
backgroundColor: custom.bg
|
|
69
|
+
} : null],
|
|
70
|
+
...accessibility,
|
|
71
|
+
children: labelled ? /*#__PURE__*/_jsx(RNText, {
|
|
72
|
+
style: [styles.label, {
|
|
73
|
+
color: resolveThemeColor(foreground, theme)
|
|
74
|
+
}],
|
|
75
|
+
maxFontSizeMultiplier: theme.typography.variants[LABEL_VARIANT[size]].maxFontSizeMultiplier,
|
|
76
|
+
numberOfLines: 1,
|
|
77
|
+
children: label
|
|
78
|
+
}) : null
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
// ─── Styles ───────────────────────────────────────────────────────────────────
|
|
84
|
+
//
|
|
85
|
+
// `color` is a plain variant rather than a compound one: `Badge` renders solid
|
|
86
|
+
// only, so there is no second paint axis for it to interact with.
|
|
87
|
+
//
|
|
88
|
+
// React Native's box model is border-box, so the ring below eats into the
|
|
89
|
+
// indicator rather than growing it — the dot's outer diameter stays exactly
|
|
90
|
+
// what `size` declares, with no compensation arithmetic.
|
|
91
|
+
const styles = StyleSheet.create(theme => {
|
|
92
|
+
const c = theme.color;
|
|
93
|
+
// A custom font encodes its weight in the family name, so only the system
|
|
94
|
+
// font takes a numeric `fontWeight` — the same branch `Chip` makes. Inlined
|
|
95
|
+
// rather than extracted: the unistyles Babel plugin rewrites this factory,
|
|
96
|
+
// and an imported function called from inside it is not in scope at runtime.
|
|
97
|
+
const labelFont = theme.typography.fonts.semibold;
|
|
98
|
+
const isSystemLabelFont = labelFont === SYSTEM_FONT;
|
|
99
|
+
return {
|
|
100
|
+
indicator: {
|
|
101
|
+
alignItems: "center",
|
|
102
|
+
justifyContent: "center",
|
|
103
|
+
borderRadius: theme.radius.full,
|
|
104
|
+
borderColor: c["surface.canvas"],
|
|
105
|
+
variants: {
|
|
106
|
+
size: {
|
|
107
|
+
sm: {
|
|
108
|
+
borderWidth: 1.5
|
|
109
|
+
},
|
|
110
|
+
md: {
|
|
111
|
+
borderWidth: 2
|
|
112
|
+
}
|
|
113
|
+
},
|
|
114
|
+
color: {
|
|
115
|
+
primary: {
|
|
116
|
+
backgroundColor: c["accent.solid.bg"]
|
|
117
|
+
},
|
|
118
|
+
secondary: {
|
|
119
|
+
backgroundColor: c["neutral.solid.bg"]
|
|
120
|
+
},
|
|
121
|
+
success: {
|
|
122
|
+
backgroundColor: c["success.solid.bg"]
|
|
123
|
+
},
|
|
124
|
+
warning: {
|
|
125
|
+
backgroundColor: c["warning.solid.bg"]
|
|
126
|
+
},
|
|
127
|
+
danger: {
|
|
128
|
+
backgroundColor: c["danger.solid.bg"]
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
},
|
|
132
|
+
uni__dependencies: [0, 4]
|
|
133
|
+
},
|
|
134
|
+
dot: {
|
|
135
|
+
variants: {
|
|
136
|
+
size: {
|
|
137
|
+
sm: {
|
|
138
|
+
width: 10,
|
|
139
|
+
height: 10
|
|
140
|
+
},
|
|
141
|
+
md: {
|
|
142
|
+
width: 12,
|
|
143
|
+
height: 12
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
},
|
|
147
|
+
uni__dependencies: [4]
|
|
148
|
+
},
|
|
149
|
+
pill: {
|
|
150
|
+
variants: {
|
|
151
|
+
size: {
|
|
152
|
+
sm: {
|
|
153
|
+
height: 16,
|
|
154
|
+
minWidth: 16,
|
|
155
|
+
paddingHorizontal: 4
|
|
156
|
+
},
|
|
157
|
+
md: {
|
|
158
|
+
height: 20,
|
|
159
|
+
minWidth: 20,
|
|
160
|
+
paddingHorizontal: 6
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
},
|
|
164
|
+
uni__dependencies: [4]
|
|
165
|
+
},
|
|
166
|
+
// Spelled out rather than derived from `LABEL_VARIANT`: the unistyles Babel
|
|
167
|
+
// plugin reads this object statically, so computed variant keys are not
|
|
168
|
+
// safe here even though they would resolve correctly under test.
|
|
169
|
+
label: {
|
|
170
|
+
textAlign: "center",
|
|
171
|
+
fontFamily: isSystemLabelFont ? undefined : labelFont,
|
|
172
|
+
fontWeight: isSystemLabelFont ? FONT_WEIGHT_VALUE.semibold : undefined,
|
|
173
|
+
variants: {
|
|
174
|
+
size: {
|
|
175
|
+
sm: {
|
|
176
|
+
fontSize: theme.typography.variants["label-sm"].fontSize,
|
|
177
|
+
lineHeight: theme.typography.variants["label-sm"].lineHeight,
|
|
178
|
+
letterSpacing: theme.typography.variants["label-sm"].letterSpacing
|
|
179
|
+
},
|
|
180
|
+
md: {
|
|
181
|
+
fontSize: theme.typography.variants["label-md"].fontSize,
|
|
182
|
+
lineHeight: theme.typography.variants["label-md"].lineHeight,
|
|
183
|
+
letterSpacing: theme.typography.variants["label-md"].letterSpacing
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
},
|
|
187
|
+
uni__dependencies: [0, 4]
|
|
188
|
+
}
|
|
189
|
+
};
|
|
190
|
+
});
|
|
191
|
+
//# sourceMappingURL=BadgeIndicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["StyleSheet","useUnistyles","resolveThemeColor","FONT_WEIGHT_VALUE","SYSTEM_FONT","getCustomBadgeColors","hasLabel","jsx","_jsx","SCHEME_NAMES","Set","FG_TOKEN","primary","secondary","success","warning","danger","LABEL_VARIANT","sm","md","BadgeIndicator","label","color","size","accessibilityLabel","theme","_styles","styles","useVariants","custom","has","labelled","foreground","fg","announced","String","undefined","accessibility","accessible","accessibilityElementsHidden","importantForAccessibility","View","style","indicator","pill","dot","backgroundColor","bg","children","RNText","maxFontSizeMultiplier","typography","variants","numberOfLines","create","c","labelFont","fonts","semibold","isSystemLabelFont","alignItems","justifyContent","borderRadius","radius","full","borderColor","borderWidth","uni__dependencies","width","height","minWidth","paddingHorizontal","textAlign","fontFamily","fontWeight","fontSize","lineHeight","letterSpacing"],"sourceRoot":"../../../../../src","sources":["components/badge/parts/BadgeIndicator.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/badge/types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { readableOn } from "../../utils/color-utils.js";
|
|
4
|
+
|
|
5
|
+
// A custom color literal (hex/rgb/hsl) isn't a bounded set of options, so it
|
|
6
|
+
// can't be a unistyles variant condition — it's derived here instead, the same
|
|
7
|
+
// way `chip/utils.ts` handles the equivalent case on `Chip`.
|
|
8
|
+
|
|
9
|
+
/** The indicator's paint for a raw literal: the literal itself, plus a readable label. */
|
|
10
|
+
export function getCustomBadgeColors(literal) {
|
|
11
|
+
return {
|
|
12
|
+
bg: literal,
|
|
13
|
+
fg: readableOn(literal)
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* `true` when `label` should render as a pill. An empty string and `undefined`
|
|
19
|
+
* are a dot; `0` is a label, since a caller suppressing a zero count uses
|
|
20
|
+
* `isVisible` rather than relying on falsiness.
|
|
21
|
+
*/
|
|
22
|
+
export function hasLabel(label) {
|
|
23
|
+
return label !== undefined && label !== "";
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["readableOn","getCustomBadgeColors","literal","bg","fg","hasLabel","label","undefined"],"sourceRoot":"../../../../src","sources":["components/badge/utils.ts"],"mappings":";;AAAA,SAASA,UAAU;;AAEnB;AACA;AACA;;AAOA;AACA,OAAO,SAASC,oBAAoBA,CAACC,OAAe,EAAqB;EACvE,OAAO;IAAEC,EAAE,EAAED,OAAO;IAAEE,EAAE,EAAEJ,UAAU,CAACE,OAAO;EAAE,CAAC;AACjD;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,QAAQA,CAACC,KAAkC,EAA4B;EACrF,OAAOA,KAAK,KAAKC,SAAS,IAAID,KAAK,KAAK,EAAE;AAC5C","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}
|
|
@@ -4,7 +4,7 @@ import { useSyncExternalStore } from "react";
|
|
|
4
4
|
import { SafeAreaProvider } from "react-native-safe-area-context";
|
|
5
5
|
import { useUnistyles } from "react-native-unistyles";
|
|
6
6
|
import { bootstrapTerraUI } from "../theme/registry.js";
|
|
7
|
-
import {
|
|
7
|
+
import { applyScheme, getThemeSelection, setTheme, setThemeMode, subscribeThemeSelection } from "../theme/runtime.js";
|
|
8
8
|
import { resolveScreenPadding } from "../theme/screen-padding.js";
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
10
|
// Ensure the default theme is registered on first import. An app that calls
|
|
@@ -26,8 +26,8 @@ export const TerraUIProvider = ({
|
|
|
26
26
|
children: children
|
|
27
27
|
});
|
|
28
28
|
/**
|
|
29
|
-
* Access the active theme and switch scheme / mode /
|
|
30
|
-
* comes from the runtime store, so changes made imperatively (`
|
|
29
|
+
* Access the active theme and switch scheme / mode / theme. Selection state
|
|
30
|
+
* comes from the runtime store, so changes made imperatively (`setTheme`,
|
|
31
31
|
* `setThemeMode`) and through this hook are observed by every consumer.
|
|
32
32
|
*/
|
|
33
33
|
export function useTheme() {
|
|
@@ -40,8 +40,8 @@ export function useTheme() {
|
|
|
40
40
|
theme,
|
|
41
41
|
scheme: rt.themeName ?? "light",
|
|
42
42
|
setScheme: applyScheme,
|
|
43
|
-
|
|
44
|
-
|
|
43
|
+
themeName: selection.themeName,
|
|
44
|
+
setTheme,
|
|
45
45
|
mode: selection.mode,
|
|
46
46
|
setMode: setThemeMode
|
|
47
47
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useSyncExternalStore","SafeAreaProvider","useUnistyles","bootstrapTerraUI","
|
|
1
|
+
{"version":3,"names":["useSyncExternalStore","SafeAreaProvider","useUnistyles","bootstrapTerraUI","applyScheme","getThemeSelection","setTheme","setThemeMode","subscribeThemeSelection","resolveScreenPadding","jsx","_jsx","TerraUIProvider","children","useTheme","theme","rt","selection","scheme","themeName","setScheme","mode","setMode","useScreenPadding","breakpoint","useScreenMargin"],"sourceRoot":"../../../src","sources":["context/ThemeProvider.tsx"],"mappings":";;AAAA,SAAiCA,oBAAoB,QAAQ,OAAO;AAEpE,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,SAASC,YAAY,QAAQ,wBAAwB;AAErD,SAASC,gBAAgB;AACzB,SACEC,WAAW,EACXC,iBAAiB,EACjBC,QAAQ,EACRC,YAAY,EACZC,uBAAuB;AAEzB,SAAqCC,oBAAoB;AAAkC,SAAAC,GAAA,IAAAC,IAAA;AAG3F;AACA;AACA;AACAR,gBAAgB,CAAC,CAAC;;AAElB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMS,eAAe,GAAGA,CAAC;EAAEC;AAA4B,CAAC,kBAC7DF,IAAA,CAACV,gBAAgB;EAAAY,QAAA,EAAEA;AAAQ,CAAmB,CAC/C;AA6BD;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,QAAQA,CAAA,EAAmB;EACzC,MAAM;IAAEC,KAAK;IAAEC;EAAG,CAAC,GAAGd,YAAY,CAAC,CAAC;EACpC,MAAMe,SAAS,GAAGjB,oBAAoB,CAACQ,uBAAuB,EAAEH,iBAAiB,EAAEA,iBAAiB,CAAC;EAErG,OAAO;IACLU,KAAK;IACLG,MAAM,EAAGF,EAAE,CAACG,SAAS,IAAI,OAAkB;IAC3CC,SAAS,EAAEhB,WAAW;IACtBe,SAAS,EAAEF,SAAS,CAACE,SAAS;IAC9Bb,QAAQ;IACRe,IAAI,EAAEJ,SAAS,CAACI,IAAI;IACpBC,OAAO,EAAEf;EACX,CAAC;AACH;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASgB,gBAAgBA,CAAA,EAA0B;EACxD,MAAM;IAAER,KAAK;IAAEC;EAAG,CAAC,GAAGd,YAAY,CAAC,CAAC;EACpC,OAAOO,oBAAoB,CAACM,KAAK,EAAEC,EAAE,CAACQ,UAAU,CAAC;AACnD;;AAEA;AACA,OAAO,MAAMC,eAAe,GAAGF,gBAAgB","ignoreList":[]}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
/** The literal
|
|
3
|
+
/** The literal theme names declared in `T.themes`, or `never` when none are declared. */
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Identity helper for authoring a {@link TerraConfig} with contextual typing.
|
|
7
|
-
* Has no side effects. With literal `
|
|
8
|
-
* them; a dynamic `Record<string,
|
|
7
|
+
* Has no side effects. With literal `themes`, `defaultTheme` must name one of
|
|
8
|
+
* them; a dynamic `Record<string, NamedTheme>` keeps `defaultTheme` as `string`
|
|
9
9
|
* and defers to runtime validation.
|
|
10
10
|
*
|
|
11
11
|
* @example
|
|
12
12
|
* const config = defineTerraConfig({
|
|
13
|
-
*
|
|
14
|
-
*
|
|
13
|
+
* themes: { indigo: { light: "#4f46e5", dark: "#818cf8" } },
|
|
14
|
+
* defaultTheme: "indigo",
|
|
15
15
|
* });
|
|
16
16
|
* configureTerraUI(config);
|
|
17
17
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defineTerraConfig","config"],"sourceRoot":"../../../src","sources":["theme/define-config.ts"],"mappings":";;AAEA;;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,iBAAiBA,CAC/BC,
|
|
1
|
+
{"version":3,"names":["defineTerraConfig","config"],"sourceRoot":"../../../src","sources":["theme/define-config.ts"],"mappings":";;AAEA;;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,iBAAiBA,CAC/BC,MAKC,EACE;EACH,OAAOA,MAAM;AACf","ignoreList":[]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
/**
|
|
4
4
|
* Thrown for invalid pure configuration input — before any registry, selection,
|
|
5
5
|
* or native state is touched. `path` points at the offending config entry, e.g.
|
|
6
|
-
* `
|
|
6
|
+
* `themes.indigo.dark.seed` or `defaultTheme`.
|
|
7
7
|
*/
|
|
8
8
|
export class TerraConfigError extends Error {
|
|
9
9
|
constructor(path, message) {
|
|
@@ -21,9 +21,9 @@ export { breakpoints, resolveBreakpointValue } from "./breakpoints.js";
|
|
|
21
21
|
// ─── Config + runtime ───────────────────────────────────────────────────────
|
|
22
22
|
export { defineTerraConfig } from "./define-config.js";
|
|
23
23
|
export { TerraConfigError } from "./errors.js";
|
|
24
|
-
export { configureTerraUI,
|
|
24
|
+
export { configureTerraUI, getDefaultRadius, getIcon, getImageComponent, getIsConfigured, getRequiredIcon, getSurfaceElevation, getThemeNames, resolveTheme } from "./registry.js";
|
|
25
25
|
export { createTerraThemes } from "./resolve-config.js";
|
|
26
|
-
export {
|
|
26
|
+
export { applyScheme, getCurrentTheme, getThemeMode, getThemeSelection, setTheme, setThemeMode } from "./runtime.js";
|
|
27
27
|
export { resolveScreenMargin } from "./screen-margin.js";
|
|
28
28
|
export { resolveScreenPadding } from "./screen-padding.js";
|
|
29
29
|
// ─── Default themes ───────────────────────────────────────────────────────────
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["checkAccentContrast","generateAccentColors","isSupportedAccentSeed","normalizeAccent","readableOn","shade","withAlpha","deepMerge","resolveThemeColor","FONT_WEIGHT_VALUE","SYSTEM_FONT","breakpoints","resolveBreakpointValue","defineTerraConfig","TerraConfigError","configureTerraUI","
|
|
1
|
+
{"version":3,"names":["checkAccentContrast","generateAccentColors","isSupportedAccentSeed","normalizeAccent","readableOn","shade","withAlpha","deepMerge","resolveThemeColor","FONT_WEIGHT_VALUE","SYSTEM_FONT","breakpoints","resolveBreakpointValue","defineTerraConfig","TerraConfigError","configureTerraUI","getDefaultRadius","getIcon","getImageComponent","getIsConfigured","getRequiredIcon","getSurfaceElevation","getThemeNames","resolveTheme","createTerraThemes","applyScheme","getCurrentTheme","getThemeMode","getThemeSelection","setTheme","setThemeMode","resolveScreenMargin","resolveScreenPadding","defaultDarkTheme","defaultLightTheme"],"sourceRoot":"../../../src","sources":["theme/index.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AASA,SACEA,mBAAmB,EACnBC,oBAAoB,EACpBC,qBAAqB;AAEvB,SAASC,eAAe;AACxB,SAASC,UAAU,EAAEC,KAAK,EAAEC,SAAS;AAErC,SAASC,SAAS;AAClB,SAASC,iBAAiB;AAC1B,SAASC,iBAAiB,EAAEC,WAAW;AACvC;;AAEA,SAASC,WAAW,EAAEC,sBAAsB;AAC5C;AACA,SAASC,iBAAiB;AAC1B,SAASC,gBAAgB;AACzB,SACEC,gBAAgB,EAChBC,gBAAgB,EAChBC,OAAO,EACPC,iBAAiB,EACjBC,eAAe,EACfC,eAAe,EACfC,mBAAmB,EACnBC,aAAa,EACbC,YAAY;AAEd,SAASC,iBAAiB;AAE1B,SACEC,WAAW,EACXC,eAAe,EACfC,YAAY,EACZC,iBAAiB,EACjBC,QAAQ,EACRC,YAAY;AAGd,SAASC,mBAAmB;AAE5B,SAASC,oBAAoB;AAC7B;AACA,SAASC,gBAAgB,EAAEC,iBAAiB;AAC5C","ignoreList":[]}
|