@symbiote-native/css-parser 0.5.0 → 0.5.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/README.md CHANGED
@@ -19,7 +19,8 @@ CSS Modules all work identically regardless of source language.
19
19
  Not installed directly by an app — every adapter package (`@symbiote-native/react`,
20
20
  `@symbiote-native/vue`, `@symbiote-native/svelte`, `@symbiote-native/solid`,
21
21
  `@symbiote-native/angular`) already depends on it and re-exports it via its own
22
- `./metro-css-parser` subpath. Writing a Metro transformer for a new adapter yourself:
22
+ `./metro-css-parser` subpath, so any app scaffolded by `npx @symbiote-native/cli new` already has
23
+ it wired, no separate flag needed. Writing a Metro transformer for a new adapter yourself:
23
24
 
24
25
  ```bash
25
26
  npm install @symbiote-native/css-parser
@@ -52,7 +53,7 @@ import './theme.css'; // plain CSS — registers classes globally, no export
52
53
  ```
53
54
 
54
55
  ```tsx
55
- <View className="card" style={styles.highlight} /> // React
56
+ <view className="card" style={styles.highlight} /> // React
56
57
  ```
57
58
 
58
59
  ```html
@@ -135,6 +136,10 @@ import {
135
136
  - It does not implement Tailwind CSS — that needs whole-project class scanning and JIT utility
136
137
  generation, a fundamentally different shape than "one source file reduces to CSS text", and is
137
138
  being designed as a separate, future package.
139
+ - It drops a `:active`/`:hover`/`:focus` rule the same as any other pseudo-class — there is no
140
+ CSS-class route to a pressed look. `Pressable`'s functional `style={({ pressed }) => ...}` prop
141
+ is the supported way to style a pressed state; the engine resolves it into a separate style slot
142
+ outside this pipeline.
138
143
  - It supports `scoped` / `:global()` / CSS Modules and SCSS/Sass/Less/Stylus preprocessing —
139
144
  including Svelte's own `<style>` block (its preprocessor calls this package's
140
145
  `compileScopedCss`, the same compile every Vue `<style scoped>` block goes through) — and it does
@@ -61,10 +61,9 @@ const DROP_EXPLANATION = {
61
61
  // back on.
62
62
  //
63
63
  // WHY. The pressed look has a second, better route that did not exist when `:active` landed: a
64
- // functional `style={({pressed}) => …}`, which every lowering transform specialises into
65
- // `style` + `activeStyle` at build time (2026-08-23). It reaches the same slot with no pseudo-class
66
- // machinery, it is what the ecosystem already writes, and it lowers — so the reason `:active`
67
- // existed, keeping a Pressable lowerable without a state-reading callback, is gone.
64
+ // functional `style={({pressed}) => …}`, which the engine resolves into `style` + `activeStyle`
65
+ // (`routeProp`, 2026-08-23). It reaches the same slot with no pseudo-class machinery and it is what
66
+ // the ecosystem already writes — so the reason `:active` existed is gone.
68
67
  //
69
68
  // Keeping BOTH live is what argues against it: they occupy different cascade slots (`activeStyle`
70
69
  // replaces the authored style, an `:active` class rule replaces the class style), so an adapter has
@@ -452,7 +451,7 @@ export function selectorsToMatches(selectors, filename) {
452
451
  // and that is FALSE here — the pressed look is fully supported, by a different route. A
453
452
  // warning that misdescribes the cause is worse than none: it sends the reader to the engine.
454
453
  if (problem.reason === 'state-pseudo-class') {
455
- console.warn(`[@symbiote-native/css-parser] ${filename}: dropped \`:${problem.detail}\` — pseudo-class state is currently disabled in this parser. Use a functional style instead: style={({ pressed }) => ({ opacity: pressed ? 0.6 : 1 })}, which every lowering transform compiles to style + activeStyle.`);
454
+ console.warn(`[@symbiote-native/css-parser] ${filename}: dropped \`:${problem.detail}\` — pseudo-class state is currently disabled in this parser. Use a functional style instead: style={({ pressed }) => ({ opacity: pressed ? 0.6 : 1 })}, which the engine resolves to style + activeStyle.`);
456
455
  continue;
457
456
  }
458
457
  console.warn(`[@symbiote-native/css-parser] ${filename}: dropped a rule on \`${problem.detail}\` — ${DROP_EXPLANATION[problem.reason]}, so it can never match in React Native.`);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@symbiote-native/css-parser",
3
- "version": "0.5.0",
3
+ "version": "0.5.1",
4
4
  "description": "Build-time CSS/SCSS/Less/Stylus compiler for SymbioteNative — compiles stylesheets to React Native style objects, resolved at runtime via a cross-adapter class-name registry.",
5
5
  "license": "MIT",
6
6
  "repository": {