@kbach/react-native 1.0.0-beta.44 → 1.0.0-beta.46

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 (3) hide show
  1. package/dist/index.d.ts +86 -0
  2. package/dist/index.web.d.ts +86 -0
  3. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -14,3 +14,89 @@ interface StyleObject {
14
14
  declare function resolveStyle(classString: string, pressed?: boolean): StyleObject;
15
15
 
16
16
  export { type StyleObject, resolveStyle };
17
+
18
+ /**
19
+ * Ambient module augmentation adding `className?: string` to React
20
+ * Native's own component prop types — without this, `<View
21
+ * className="...">` type-checks fine at RUNTIME (the babel plugin/
22
+ * jsx-runtime accept `className` on ANY host element regardless of its
23
+ * declared prop type — see jsxRuntimeCore.ts's own `processElement` doc
24
+ * comment) but fails `tsc`/editor type-checking, since `ViewProps`/
25
+ * `TextProps`/etc. (react-native's own types) have no `className` field at
26
+ * all. Confirmed as a real, reported gap: nothing in this package shipped
27
+ * this augmentation before, so a React Native CLI project running `tsc`
28
+ * (or just seeing red squiggles in-editor) hit "Property 'className' does
29
+ * not exist on type ... ViewProps ..." on every styled element.
30
+ *
31
+ * A plain `.d.ts` file has no effect on its own unless something actually
32
+ * pulls it into a consumer's type-checking. A side-effect `import
33
+ * './rnClassNameTypes'` from index.ts was the first thing tried here, but
34
+ * tsup's dts rollup (rollup-plugin-dts) tree-shakes a side-effect-only
35
+ * import with nothing it can trace a type reference through — confirmed by
36
+ * hand that this wasn't even consistent (survived one build, silently
37
+ * vanished from an immediately-following clean rebuild of the identical
38
+ * source). `scripts/append-classname-types.mjs` appends this file's own
39
+ * text onto the end of the built `dist/index.d.ts`/`dist/index.web.d.ts`
40
+ * directly as a deterministic post-build step instead — see that script's
41
+ * own doc comment. Anyone who imports ANYTHING from '@kbach/react-native'
42
+ * gets it with no extra tsconfig step needed either way. Same underlying
43
+ * problem (and the interface-merge half of this fix) nativewind — a React
44
+ * Native styling library solving this identical className-typing problem —
45
+ * also has to solve.
46
+ *
47
+ * Every interface below is `export interface XProps extends Readonly<...>
48
+ * {}` in react-native's own generated types (RN >= ~0.81's Flow-to-TS
49
+ * generation, `types_generated/`) — an otherwise-empty body, so merging a
50
+ * member in is exactly as safe as against a hand-written interface.
51
+ * Deliberately NOT listed here: `ImageProps`, `TouchableOpacityProps`,
52
+ * `ModalProps` — these are `export type X = Readonly<...>` TYPE ALIASES in
53
+ * the same generated types, which TypeScript cannot declaration-merge into
54
+ * at all (confirmed by hand: attempting it is a flat "Duplicate identifier"
55
+ * compile error, not a silent no-op). They don't need an entry anyway —
56
+ * confirmed against a real `tsc` run (RN 0.87) that `className` on
57
+ * `Image`/`TouchableOpacity`/`TouchableHighlight`/`Modal`/`SafeAreaView`
58
+ * ALL already type-check cleanly once `ViewProps` and
59
+ * `TouchableWithoutFeedbackProps` below are augmented — each of those
60
+ * components' real prop type composes one or the other somewhere in its
61
+ * own `Omit<...> & ...` chain (`SafeAreaView` in particular turned out to
62
+ * reuse `ViewProps` directly, with no separate props type of its own at
63
+ * all), so the merged `className` field flows through without needing its
64
+ * own dedicated entry.
65
+ */
66
+ export {};
67
+
68
+ declare module 'react-native' {
69
+ interface ViewProps {
70
+ className?: string;
71
+ }
72
+ interface TextProps {
73
+ className?: string;
74
+ }
75
+ interface ScrollViewProps {
76
+ className?: string;
77
+ }
78
+ interface PressableProps {
79
+ className?: string;
80
+ }
81
+ interface TextInputProps {
82
+ className?: string;
83
+ }
84
+ interface TouchableHighlightProps {
85
+ className?: string;
86
+ }
87
+ interface TouchableWithoutFeedbackProps {
88
+ className?: string;
89
+ }
90
+ interface SwitchProps {
91
+ className?: string;
92
+ }
93
+ interface KeyboardAvoidingViewProps {
94
+ className?: string;
95
+ }
96
+ interface FlatListProps<ItemT> {
97
+ className?: string;
98
+ }
99
+ interface SectionListProps<ItemT, SectionT> {
100
+ className?: string;
101
+ }
102
+ }
package/dist/index.web.d.ts CHANGED
@@ -16,3 +16,89 @@ import 'react';
16
16
  declare function resolveClassName(classString: string): string;
17
17
 
18
18
  export { resolveClassName };
19
+
20
+ /**
21
+ * Ambient module augmentation adding `className?: string` to React
22
+ * Native's own component prop types — without this, `<View
23
+ * className="...">` type-checks fine at RUNTIME (the babel plugin/
24
+ * jsx-runtime accept `className` on ANY host element regardless of its
25
+ * declared prop type — see jsxRuntimeCore.ts's own `processElement` doc
26
+ * comment) but fails `tsc`/editor type-checking, since `ViewProps`/
27
+ * `TextProps`/etc. (react-native's own types) have no `className` field at
28
+ * all. Confirmed as a real, reported gap: nothing in this package shipped
29
+ * this augmentation before, so a React Native CLI project running `tsc`
30
+ * (or just seeing red squiggles in-editor) hit "Property 'className' does
31
+ * not exist on type ... ViewProps ..." on every styled element.
32
+ *
33
+ * A plain `.d.ts` file has no effect on its own unless something actually
34
+ * pulls it into a consumer's type-checking. A side-effect `import
35
+ * './rnClassNameTypes'` from index.ts was the first thing tried here, but
36
+ * tsup's dts rollup (rollup-plugin-dts) tree-shakes a side-effect-only
37
+ * import with nothing it can trace a type reference through — confirmed by
38
+ * hand that this wasn't even consistent (survived one build, silently
39
+ * vanished from an immediately-following clean rebuild of the identical
40
+ * source). `scripts/append-classname-types.mjs` appends this file's own
41
+ * text onto the end of the built `dist/index.d.ts`/`dist/index.web.d.ts`
42
+ * directly as a deterministic post-build step instead — see that script's
43
+ * own doc comment. Anyone who imports ANYTHING from '@kbach/react-native'
44
+ * gets it with no extra tsconfig step needed either way. Same underlying
45
+ * problem (and the interface-merge half of this fix) nativewind — a React
46
+ * Native styling library solving this identical className-typing problem —
47
+ * also has to solve.
48
+ *
49
+ * Every interface below is `export interface XProps extends Readonly<...>
50
+ * {}` in react-native's own generated types (RN >= ~0.81's Flow-to-TS
51
+ * generation, `types_generated/`) — an otherwise-empty body, so merging a
52
+ * member in is exactly as safe as against a hand-written interface.
53
+ * Deliberately NOT listed here: `ImageProps`, `TouchableOpacityProps`,
54
+ * `ModalProps` — these are `export type X = Readonly<...>` TYPE ALIASES in
55
+ * the same generated types, which TypeScript cannot declaration-merge into
56
+ * at all (confirmed by hand: attempting it is a flat "Duplicate identifier"
57
+ * compile error, not a silent no-op). They don't need an entry anyway —
58
+ * confirmed against a real `tsc` run (RN 0.87) that `className` on
59
+ * `Image`/`TouchableOpacity`/`TouchableHighlight`/`Modal`/`SafeAreaView`
60
+ * ALL already type-check cleanly once `ViewProps` and
61
+ * `TouchableWithoutFeedbackProps` below are augmented — each of those
62
+ * components' real prop type composes one or the other somewhere in its
63
+ * own `Omit<...> & ...` chain (`SafeAreaView` in particular turned out to
64
+ * reuse `ViewProps` directly, with no separate props type of its own at
65
+ * all), so the merged `className` field flows through without needing its
66
+ * own dedicated entry.
67
+ */
68
+ export {};
69
+
70
+ declare module 'react-native' {
71
+ interface ViewProps {
72
+ className?: string;
73
+ }
74
+ interface TextProps {
75
+ className?: string;
76
+ }
77
+ interface ScrollViewProps {
78
+ className?: string;
79
+ }
80
+ interface PressableProps {
81
+ className?: string;
82
+ }
83
+ interface TextInputProps {
84
+ className?: string;
85
+ }
86
+ interface TouchableHighlightProps {
87
+ className?: string;
88
+ }
89
+ interface TouchableWithoutFeedbackProps {
90
+ className?: string;
91
+ }
92
+ interface SwitchProps {
93
+ className?: string;
94
+ }
95
+ interface KeyboardAvoidingViewProps {
96
+ className?: string;
97
+ }
98
+ interface FlatListProps<ItemT> {
99
+ className?: string;
100
+ }
101
+ interface SectionListProps<ItemT, SectionT> {
102
+ className?: string;
103
+ }
104
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kbach/react-native",
3
- "version": "1.0.0-beta.44",
3
+ "version": "1.0.0-beta.46",
4
4
  "description": "Kbach's utility-class styling engine for React Native — the same class names as @kbach/react, resolved to a StyleSheet-ready style object via a Kotlin/JNI TurboModule (native), the same WASM engine @kbach/react uses (Expo Web / react-native-web), or a pure-JS fallback engine (Expo Go). Ships its own native Android module — one npm install, no separate native package. Beta. Native is Android-only (no iOS bridge yet); works with the React Native CLI, an Expo dev client, AND Expo Go (a reduced-coverage pure-JS fallback, since Expo Go can't load any custom native module).",
5
5
  "keywords": [
6
6
  "css",
@@ -84,7 +84,7 @@
84
84
  "./babel-plugin": "./src/babel-plugin.js"
85
85
  },
86
86
  "scripts": {
87
- "build": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\" && tsup",
87
+ "build": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\" && tsup && node scripts/append-classname-types.mjs",
88
88
  "dev": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\" && tsup --watch",
89
89
  "test": "vitest run --passWithNoTests",
90
90
  "test:coverage": "vitest run --coverage --passWithNoTests",