rnwind 0.0.1 → 0.0.3

package/lib/cjs/core/parser/haptics.cjs

@@ -0,0 +1,73 @@
+'use strict';
+
+var tokens = require('./tokens.cjs');
+
+/**
+ * Haptic-atom extractor.
+ *
+ * rnwind's haptic utilities are declared in preset.css as `@utility`
+ * rules that write a single `--rnwind-haptic: <kind>[-<value>]` custom
+ * property. Lightningcss surfaces those custom-property writes on the
+ * style rule's declaration list; this module converts the raw marker
+ * text into a structured {@link HapticRequest} the transformer can
+ * hoist into JSX.
+ *
+ * Marker vocabulary:
+ *
+ *   --rnwind-haptic: impact-Light | impact-Medium | impact-Heavy | impact-Soft | impact-Rigid;
+ *   --rnwind-haptic: notification-Success | notification-Warning | notification-Error;
+ *   --rnwind-haptic: selection;
+ *
+ * Everything else is returned as `null` so unknown markers don't leak
+ * into the transformer's map.
+ */
+const IMPACT_STYLES = new Set(['Light', 'Medium', 'Heavy', 'Soft', 'Rigid']);
+const NOTIFICATION_TYPES = new Set(['Success', 'Warning', 'Error']);
+/**
+ * Parse the raw marker text (post-serialization) into a
+ * {@link HapticRequest}, or `null` when the token is unrecognised.
+ * Shape: `impact-<Style>`, `notification-<Type>`, or bare `selection`.
+ * @param text Trimmed marker text.
+ * @returns Haptic request, or null.
+ */
+function parseMarker(text) {
+    if (text === 'selection')
+        return { kind: 'selection' };
+    if (text.startsWith('impact-')) {
+        const style = text.slice('impact-'.length);
+        if (IMPACT_STYLES.has(style))
+            return { kind: 'impact', style: style };
+        return null;
+    }
+    if (text.startsWith('notification-')) {
+        const typeText = text.slice('notification-'.length);
+        if (NOTIFICATION_TYPES.has(typeText)) {
+            return { kind: 'notification', type: typeText };
+        }
+        return null;
+    }
+    return null;
+}
+/**
+ * Inspect a rule's declaration list for a `--rnwind-haptic: <marker>`
+ * custom property and return the structured request. Returns `null`
+ * for rules that don't carry the marker.
+ * @param declarations Declarations from one lightningcss style rule.
+ * @returns Parsed haptic request, or null.
+ */
+function detectHapticAtom(declarations) {
+    for (const decl of declarations) {
+        if (decl.property !== 'custom')
+            continue;
+        const custom = decl.value;
+        const name = typeof custom.name === 'string' ? custom.name : custom.name.name;
+        if (name !== '--rnwind-haptic')
+            continue;
+        const text = tokens.serializeTokens(custom.value ?? []).trim();
+        return parseMarker(text);
+    }
+    return null;
+}
+
+exports.detectHapticAtom = detectHapticAtom;
+//# sourceMappingURL=haptics.cjs.map

package/lib/cjs/core/parser/haptics.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"haptics.cjs","sources":["../../../../../src/core/parser/haptics.ts"],"sourcesContent":["/**\n * Haptic-atom extractor.\n *\n * rnwind's haptic utilities are declared in preset.css as `@utility`\n * rules that write a single `--rnwind-haptic: <kind>[-<value>]` custom\n * property. Lightningcss surfaces those custom-property writes on the\n * style rule's declaration list; this module converts the raw marker\n * text into a structured {@link HapticRequest} the transformer can\n * hoist into JSX.\n *\n * Marker vocabulary:\n *\n *   --rnwind-haptic: impact-Light | impact-Medium | impact-Heavy | impact-Soft | impact-Rigid;\n *   --rnwind-haptic: notification-Success | notification-Warning | notification-Error;\n *   --rnwind-haptic: selection;\n *\n * Everything else is returned as `null` so unknown markers don't leak\n * into the transformer's map.\n */\n\nimport type { Declaration as LcDeclaration, TokenOrValue } from 'lightningcss'\nimport { serializeTokens } from './tokens'\n\n/**\n * Structured haptic request the `onHaptics` callback receives. Union\n * members mirror `expo-haptics`'s three entry points 1:1 so consumers\n * can index directly into the enum (`Haptics.ImpactFeedbackStyle[req.style]`).\n */\nexport type HapticRequest =\n  | { readonly kind: 'impact'; readonly style: 'Light' | 'Medium' | 'Heavy' | 'Soft' | 'Rigid' }\n  | { readonly kind: 'notification'; readonly type: 'Success' | 'Warning' | 'Error' }\n  | { readonly kind: 'selection' }\n\n/** When during a component's lifecycle the haptic was triggered. */\nexport type HapticTrigger = 'mount' | 'pressIn' | 'pressOut' | 'focus' | 'hover'\n\n/** User-provided callback fired by rnwind when a haptic atom resolves. */\nexport type OnHaptics = (request: HapticRequest, trigger: HapticTrigger) => void\n\nconst IMPACT_STYLES = new Set(['Light', 'Medium', 'Heavy', 'Soft', 'Rigid'] as const)\ntype ImpactStyle = 'Light' | 'Medium' | 'Heavy' | 'Soft' | 'Rigid'\nconst NOTIFICATION_TYPES = new Set(['Success', 'Warning', 'Error'] as const)\ntype NotificationType = 'Success' | 'Warning' | 'Error'\n\n/**\n * Parse the raw marker text (post-serialization) into a\n * {@link HapticRequest}, or `null` when the token is unrecognised.\n * Shape: `impact-<Style>`, `notification-<Type>`, or bare `selection`.\n * @param text Trimmed marker text.\n * @returns Haptic request, or null.\n */\nfunction parseMarker(text: string): HapticRequest | null {\n  if (text === 'selection') return { kind: 'selection' }\n  if (text.startsWith('impact-')) {\n    const style = text.slice('impact-'.length)\n    if (IMPACT_STYLES.has(style as ImpactStyle)) return { kind: 'impact', style: style as ImpactStyle }\n    return null\n  }\n  if (text.startsWith('notification-')) {\n    const typeText = text.slice('notification-'.length)\n    if (NOTIFICATION_TYPES.has(typeText as NotificationType)) {\n      return { kind: 'notification', type: typeText as NotificationType }\n    }\n    return null\n  }\n  return null\n}\n\n/**\n * Inspect a rule's declaration list for a `--rnwind-haptic: <marker>`\n * custom property and return the structured request. Returns `null`\n * for rules that don't carry the marker.\n * @param declarations Declarations from one lightningcss style rule.\n * @returns Parsed haptic request, or null.\n */\nfunction detectHapticAtom(declarations: readonly LcDeclaration[]): HapticRequest | null {\n  for (const decl of declarations) {\n    if (decl.property !== 'custom') continue\n    const custom = decl.value as { name: { name: string } | string; value?: readonly TokenOrValue[] }\n    const name = typeof custom.name === 'string' ? custom.name : custom.name.name\n    if (name !== '--rnwind-haptic') continue\n    const text = serializeTokens(custom.value ?? []).trim()\n    return parseMarker(text)\n  }\n  return null\n}\n\nexport { detectHapticAtom }\n"],"names":["serializeTokens"],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAqBH,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,CAAU,CAAC;AAErF,MAAM,kBAAkB,GAAG,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAU,CAAC;AAG5E;;;;;;AAMG;AACH,SAAS,WAAW,CAAC,IAAY,EAAA;IAC/B,IAAI,IAAI,KAAK,WAAW;AAAE,QAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE;AACtD,IAAA,IAAI,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,EAAE;QAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC;AAC1C,QAAA,IAAI,aAAa,CAAC,GAAG,CAAC,KAAoB,CAAC;YAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAoB,EAAE;AACnG,QAAA,OAAO,IAAI;IACb;AACA,IAAA,IAAI,IAAI,CAAC,UAAU,CAAC,eAAe,CAAC,EAAE;QACpC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC;AACnD,QAAA,IAAI,kBAAkB,CAAC,GAAG,CAAC,QAA4B,CAAC,EAAE;YACxD,OAAO,EAAE,IAAI,EAAE,cAAc,EAAE,IAAI,EAAE,QAA4B,EAAE;QACrE;AACA,QAAA,OAAO,IAAI;IACb;AACA,IAAA,OAAO,IAAI;AACb;AAEA;;;;;;AAMG;AACH,SAAS,gBAAgB,CAAC,YAAsC,EAAA;AAC9D,IAAA,KAAK,MAAM,IAAI,IAAI,YAAY,EAAE;AAC/B,QAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ;YAAE;AAChC,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,KAA6E;QACjG,MAAM,IAAI,GAAG,OAAO,MAAM,CAAC,IAAI,KAAK,QAAQ,GAAG,MAAM,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI;QAC7E,IAAI,IAAI,KAAK,iBAAiB;YAAE;AAChC,QAAA,MAAM,IAAI,GAAGA,sBAAe,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE;AACvD,QAAA,OAAO,WAAW,CAAC,IAAI,CAAC;IAC1B;AACA,IAAA,OAAO,IAAI;AACb;;;;"}

package/lib/cjs/core/parser/haptics.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Haptic-atom extractor.
+ *
+ * rnwind's haptic utilities are declared in preset.css as `@utility`
+ * rules that write a single `--rnwind-haptic: <kind>[-<value>]` custom
+ * property. Lightningcss surfaces those custom-property writes on the
+ * style rule's declaration list; this module converts the raw marker
+ * text into a structured {@link HapticRequest} the transformer can
+ * hoist into JSX.
+ *
+ * Marker vocabulary:
+ *
+ *   --rnwind-haptic: impact-Light | impact-Medium | impact-Heavy | impact-Soft | impact-Rigid;
+ *   --rnwind-haptic: notification-Success | notification-Warning | notification-Error;
+ *   --rnwind-haptic: selection;
+ *
+ * Everything else is returned as `null` so unknown markers don't leak
+ * into the transformer's map.
+ */
+import type { Declaration as LcDeclaration } from 'lightningcss';
+/**
+ * Structured haptic request the `onHaptics` callback receives. Union
+ * members mirror `expo-haptics`'s three entry points 1:1 so consumers
+ * can index directly into the enum (`Haptics.ImpactFeedbackStyle[req.style]`).
+ */
+export type HapticRequest = {
+    readonly kind: 'impact';
+    readonly style: 'Light' | 'Medium' | 'Heavy' | 'Soft' | 'Rigid';
+} | {
+    readonly kind: 'notification';
+    readonly type: 'Success' | 'Warning' | 'Error';
+} | {
+    readonly kind: 'selection';
+};
+/** When during a component's lifecycle the haptic was triggered. */
+export type HapticTrigger = 'mount' | 'pressIn' | 'pressOut' | 'focus' | 'hover';
+/** User-provided callback fired by rnwind when a haptic atom resolves. */
+export type OnHaptics = (request: HapticRequest, trigger: HapticTrigger) => void;
+/**
+ * Inspect a rule's declaration list for a `--rnwind-haptic: <marker>`
+ * custom property and return the structured request. Returns `null`
+ * for rules that don't carry the marker.
+ * @param declarations Declarations from one lightningcss style rule.
+ * @returns Parsed haptic request, or null.
+ */
+declare function detectHapticAtom(declarations: readonly LcDeclaration[]): HapticRequest | null;
+export { detectHapticAtom };

package/lib/cjs/core/parser/index.d.ts

@@ -0,0 +1,8 @@
+export { TailwindParser } from './tw-parser';
+export type { TailwindParserConfig, ParseOptions, ParsedOutput, SchemedStyle, KeyframeBlock, KeyframeStep } from './tw-parser';
+export type { SourceEntry } from '@tailwindcss/oxide';
+export type { RNStyle, RNStyleValue, RNEntry, SafeAreaMarker } from './types';
+export type { GradientAtomInfo, GradientDirection } from './gradient';
+export type { TextTruncateInfo } from './text-truncate';
+export type { HapticRequest, HapticTrigger, OnHaptics } from './haptics';
+export { BASE_SCHEME } from './theme-vars';

package/lib/cjs/core/parser/keyframes.cjs

@@ -0,0 +1,95 @@
+'use strict';
+
+/**
+ * Pull the first keyframe name out of a typed `animation` shorthand.
+ * @param animations Parsed animation shorthand entries.
+ * @returns First ident name, or `null`.
+ */
+function firstAnimationName(animations) {
+    for (const animation of animations) {
+        if (animation.name.type === 'ident' || animation.name.type === 'string')
+            return animation.name.value;
+    }
+    return null;
+}
+/**
+ * Pull the first ident name from a typed `animation-name` longhand.
+ * @param names Animation-name list.
+ * @returns First name, or `null`.
+ */
+function firstNameFromAnimationNames(names) {
+    for (const name of names) {
+        if ((name.type === 'ident' || name.type === 'string') && typeof name.value === 'string')
+            return name.value;
+    }
+    return null;
+}
+/**
+ * Extract the animation name of an `@keyframes` rule. lightningcss models
+ * the name as a discriminated union (`ident` / `custom`); both variants
+ * carry the same downstream string.
+ * @param raw lightningcss `KeyframesName`.
+ * @returns Animation name, or `null` when empty.
+ */
+function keyframesName(raw) {
+    if (typeof raw.value !== 'string' || raw.value.length === 0)
+        return null;
+    return raw.value;
+}
+/**
+ * Render a keyframe step's selector list back to CSS-text (`'from'`,
+ * `'to'`, or `'50%'`). Timeline-range keyframe selectors (CSS Scroll /
+ * View Timelines) can't run in React Native — those steps are skipped.
+ * @param selectors Step selectors.
+ * @returns Step offset, or `null` when unrepresentable in RN.
+ */
+function keyframeSelectorOffset(selectors) {
+    const [head] = selectors;
+    if (!head)
+        return null;
+    switch (head.type) {
+        case 'from': {
+            return 'from';
+        }
+        case 'to': {
+            return 'to';
+        }
+        case 'percentage': {
+            return `${head.value * 100}%`;
+        }
+        default: {
+            return null;
+        }
+    }
+}
+/**
+ * Extract the referenced `@keyframes` name from a declaration whose
+ * property is `animation-name` or a shorthand `animation` that names one.
+ * Returns the first ident found inside the value — Tailwind's animate-*
+ * utilities emit exactly one animation-name per rule.
+ * @param decl One declaration from a style rule.
+ * @returns Keyframe name, or `null` when the declaration doesn't reference one.
+ */
+function pickAnimationName(decl) {
+    if (decl.property === 'animation')
+        return firstAnimationName(decl.value);
+    if (decl.property === 'animation-name')
+        return firstNameFromAnimationNames(decl.value);
+    if (decl.property !== 'unparsed')
+        return null;
+    const targetProperty = decl.value.propertyId.property;
+    if (targetProperty !== 'animation-name' && targetProperty !== 'animation')
+        return null;
+    for (const token of decl.value.value) {
+        if (token.type === 'token' && token.value.type === 'ident')
+            return token.value.value;
+        if (token.type === 'dashed-ident')
+            return token.value;
+    }
+    return null;
+}
+
+exports.keyframeSelectorOffset = keyframeSelectorOffset;
+exports.keyframesName = keyframesName;
+exports.pickAnimationName = pickAnimationName;
+//# sourceMappingURL=keyframes.cjs.map

package/lib/cjs/core/parser/keyframes.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyframes.cjs","sources":["../../../../../src/core/parser/keyframes.ts"],"sourcesContent":["import type { Animation, Declaration as LcDeclaration, KeyframeSelector, KeyframesName } from 'lightningcss'\n\n/**\n * Pull the first keyframe name out of a typed `animation` shorthand.\n * @param animations Parsed animation shorthand entries.\n * @returns First ident name, or `null`.\n */\nfunction firstAnimationName(animations: readonly Animation[]): string | null {\n  for (const animation of animations) {\n    if (animation.name.type === 'ident' || animation.name.type === 'string') return animation.name.value\n  }\n  return null\n}\n\n/**\n * Pull the first ident name from a typed `animation-name` longhand.\n * @param names Animation-name list.\n * @returns First name, or `null`.\n */\nfunction firstNameFromAnimationNames(names: readonly { type: string; value?: string }[]): string | null {\n  for (const name of names) {\n    if ((name.type === 'ident' || name.type === 'string') && typeof name.value === 'string') return name.value\n  }\n  return null\n}\n\n/**\n * Extract the animation name of an `@keyframes` rule. lightningcss models\n * the name as a discriminated union (`ident` / `custom`); both variants\n * carry the same downstream string.\n * @param raw lightningcss `KeyframesName`.\n * @returns Animation name, or `null` when empty.\n */\nexport function keyframesName(raw: KeyframesName): string | null {\n  if (typeof raw.value !== 'string' || raw.value.length === 0) return null\n  return raw.value\n}\n\n/**\n * Render a keyframe step's selector list back to CSS-text (`'from'`,\n * `'to'`, or `'50%'`). Timeline-range keyframe selectors (CSS Scroll /\n * View Timelines) can't run in React Native — those steps are skipped.\n * @param selectors Step selectors.\n * @returns Step offset, or `null` when unrepresentable in RN.\n */\nexport function keyframeSelectorOffset(selectors: readonly KeyframeSelector[]): string | null {\n  const [head] = selectors\n  if (!head) return null\n  switch (head.type) {\n    case 'from': {\n      return 'from'\n    }\n    case 'to': {\n      return 'to'\n    }\n    case 'percentage': {\n      return `${head.value * 100}%`\n    }\n    default: {\n      return null\n    }\n  }\n}\n\n/**\n * Extract the referenced `@keyframes` name from a declaration whose\n * property is `animation-name` or a shorthand `animation` that names one.\n * Returns the first ident found inside the value — Tailwind's animate-*\n * utilities emit exactly one animation-name per rule.\n * @param decl One declaration from a style rule.\n * @returns Keyframe name, or `null` when the declaration doesn't reference one.\n */\nexport function pickAnimationName(decl: LcDeclaration): string | null {\n  if (decl.property === 'animation') return firstAnimationName(decl.value)\n  if (decl.property === 'animation-name') return firstNameFromAnimationNames(decl.value)\n  if (decl.property !== 'unparsed') return null\n  const targetProperty = decl.value.propertyId.property\n  if (targetProperty !== 'animation-name' && targetProperty !== 'animation') return null\n  for (const token of decl.value.value) {\n    if (token.type === 'token' && token.value.type === 'ident') return token.value.value\n    if (token.type === 'dashed-ident') return token.value\n  }\n  return null\n}\n"],"names":[],"mappings":";;AAEA;;;;AAIG;AACH,SAAS,kBAAkB,CAAC,UAAgC,EAAA;AAC1D,IAAA,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE;AAClC,QAAA,IAAI,SAAS,CAAC,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,SAAS,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ;AAAE,YAAA,OAAO,SAAS,CAAC,IAAI,CAAC,KAAK;IACtG;AACA,IAAA,OAAO,IAAI;AACb;AAEA;;;;AAIG;AACH,SAAS,2BAA2B,CAAC,KAAkD,EAAA;AACrF,IAAA,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;AACxB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,KAAK,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;YAAE,OAAO,IAAI,CAAC,KAAK;IAC5G;AACA,IAAA,OAAO,IAAI;AACb;AAEA;;;;;;AAMG;AACG,SAAU,aAAa,CAAC,GAAkB,EAAA;AAC9C,IAAA,IAAI,OAAO,GAAG,CAAC,KAAK,KAAK,QAAQ,IAAI,GAAG,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;IACxE,OAAO,GAAG,CAAC,KAAK;AAClB;AAEA;;;;;;AAMG;AACG,SAAU,sBAAsB,CAAC,SAAsC,EAAA;AAC3E,IAAA,MAAM,CAAC,IAAI,CAAC,GAAG,SAAS;AACxB,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,IAAI;AACtB,IAAA,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,MAAM,EAAE;AACX,YAAA,OAAO,MAAM;QACf;QACA,KAAK,IAAI,EAAE;AACT,YAAA,OAAO,IAAI;QACb;QACA,KAAK,YAAY,EAAE;AACjB,YAAA,OAAO,GAAG,IAAI,CAAC,KAAK,GAAG,GAAG,GAAG;QAC/B;QACA,SAAS;AACP,YAAA,OAAO,IAAI;QACb;;AAEJ;AAEA;;;;;;;AAOG;AACG,SAAU,iBAAiB,CAAC,IAAmB,EAAA;AACnD,IAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,WAAW;AAAE,QAAA,OAAO,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;AACxE,IAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,gBAAgB;AAAE,QAAA,OAAO,2BAA2B,CAAC,IAAI,CAAC,KAAK,CAAC;AACtF,IAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,UAAU;AAAE,QAAA,OAAO,IAAI;IAC7C,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,QAAQ;AACrD,IAAA,IAAI,cAAc,KAAK,gBAAgB,IAAI,cAAc,KAAK,WAAW;AAAE,QAAA,OAAO,IAAI;IACtF,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;AACpC,QAAA,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,OAAO;AAAE,YAAA,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK;AACpF,QAAA,IAAI,KAAK,CAAC,IAAI,KAAK,cAAc;YAAE,OAAO,KAAK,CAAC,KAAK;IACvD;AACA,IAAA,OAAO,IAAI;AACb;;;;;;"}

package/lib/cjs/core/parser/keyframes.d.ts

@@ -0,0 +1,26 @@
+import type { Declaration as LcDeclaration, KeyframeSelector, KeyframesName } from 'lightningcss';
+/**
+ * Extract the animation name of an `@keyframes` rule. lightningcss models
+ * the name as a discriminated union (`ident` / `custom`); both variants
+ * carry the same downstream string.
+ * @param raw lightningcss `KeyframesName`.
+ * @returns Animation name, or `null` when empty.
+ */
+export declare function keyframesName(raw: KeyframesName): string | null;
+/**
+ * Render a keyframe step's selector list back to CSS-text (`'from'`,
+ * `'to'`, or `'50%'`). Timeline-range keyframe selectors (CSS Scroll /
+ * View Timelines) can't run in React Native — those steps are skipped.
+ * @param selectors Step selectors.
+ * @returns Step offset, or `null` when unrepresentable in RN.
+ */
+export declare function keyframeSelectorOffset(selectors: readonly KeyframeSelector[]): string | null;
+/**
+ * Extract the referenced `@keyframes` name from a declaration whose
+ * property is `animation-name` or a shorthand `animation` that names one.
+ * Returns the first ident found inside the value — Tailwind's animate-*
+ * utilities emit exactly one animation-name per rule.
+ * @param decl One declaration from a style rule.
+ * @returns Keyframe name, or `null` when the declaration doesn't reference one.
+ */
+export declare function pickAnimationName(decl: LcDeclaration): string | null;

package/lib/cjs/core/parser/layout-dispatcher.cjs

@@ -0,0 +1,120 @@
+'use strict';
+
+/**
+ * Lower CSS alignment keywords to the strings RN accepts. CSS uses
+ * `start`/`end` while RN sticks with the legacy `flex-start`/`flex-end`.
+ * Shared between `align-items`, `align-self`, `align-content`, and
+ * `justify-content` — the lowering rule is identical for all four.
+ * @param css CSS keyword (`center` / `start` / `end` / `baseline` / `stretch`).
+ * @returns RN-compatible keyword.
+ */
+function cssToRnAlignment(css) {
+    if (css === 'start')
+        return 'flex-start';
+    if (css === 'end')
+        return 'flex-end';
+    return css;
+}
+/** Alias kept for clarity at the call site. Identical lowering rule. */
+const cssToRnJustify = cssToRnAlignment;
+/**
+ * Map lightningcss's `align-items` / `align-self` / `align-content`
+ * value (typed as `{type: 'self-position' | 'baseline-position', value: …}`)
+ * to the RN keyword RN expects.
+ * @param value Typed alignment value.
+ * @returns RN alignment string, or `null` when unmappable.
+ */
+function mapAlignKeyword(value) {
+    if (typeof value === 'string')
+        return cssToRnAlignment(value);
+    if (typeof value !== 'object' || value === null)
+        return null;
+    const tagged = value;
+    if (tagged.type === 'baseline-position')
+        return 'baseline';
+    if (typeof tagged.value === 'string')
+        return cssToRnAlignment(tagged.value);
+    // Bare-keyword variants like `{type: 'stretch'}` carry the keyword
+    // in the `type` field with no separate `value`.
+    if (tagged.type === 'stretch' || tagged.type === 'normal')
+        return cssToRnAlignment(tagged.type);
+    return null;
+}
+/**
+ * Map lightningcss's `justify-content` value to the RN keyword.
+ * @param value Typed justify value.
+ * @returns RN justify string, or `null` when unmappable.
+ */
+function mapJustifyKeyword(value) {
+    if (typeof value === 'string')
+        return cssToRnJustify(value);
+    if (typeof value !== 'object' || value === null)
+        return null;
+    const tagged = value;
+    if (typeof tagged.value === 'string')
+        return cssToRnJustify(tagged.value);
+    return null;
+}
+/**
+ * Dispatch flexbox-layout declarations (flex-direction, flex-wrap,
+ * align-items, align-self, align-content, justify-content). Returns
+ * `null` for any property the dispatcher doesn't handle so the caller
+ * can fall through to its main switch.
+ *
+ * RN expects keyword-mapped strings: `flex-start` / `flex-end` instead
+ * of CSS's `start` / `end`. We do the lowering here.
+ * @param decl One lightningcss declaration.
+ * @returns RN entries when the property matched, else `null`.
+ */
+function dispatchLayoutDeclaration(decl) {
+    switch (decl.property) {
+        case 'flex-direction': {
+            return [['flexDirection', String(decl.value)]];
+        }
+        case 'flex-wrap': {
+            return [['flexWrap', String(decl.value)]];
+        }
+        case 'align-items': {
+            const v = mapAlignKeyword(decl.value);
+            return v === null ? [] : [['alignItems', v]];
+        }
+        case 'align-self': {
+            const v = mapAlignKeyword(decl.value);
+            return v === null ? [] : [['alignSelf', v]];
+        }
+        case 'align-content': {
+            const v = mapAlignKeyword(decl.value);
+            return v === null ? [] : [['alignContent', v]];
+        }
+        case 'justify-content': {
+            const v = mapJustifyKeyword(decl.value);
+            return v === null ? [] : [['justifyContent', v]];
+        }
+        case 'overflow': {
+            // Lightningcss splits CSS `overflow` into `{x, y}` axes; RN only
+            // supports a single `overflow` keyword (and only `'hidden' |
+            // 'visible' | 'scroll'` on iOS, `'hidden' | 'visible'` on
+            // Android — RN ignores unsupported keywords at runtime). Take
+            // the `x` axis when the user wrote shorthand; per-axis Tailwind
+            // utilities both emit shorthand here so axis splitting is rare.
+            const value = decl.value;
+            if (typeof value.x !== 'string')
+                return [];
+            return [['overflow', value.x]];
+        }
+        case 'overflow-x':
+        case 'overflow-y': {
+            // Tailwind's `overflow-x-*` / `overflow-y-*` emit these longhands,
+            // not the `overflow` shorthand. RN has only a single `overflow`,
+            // so collapse both axes onto it (last one declared wins via the
+            // normal entry-merge order).
+            return typeof decl.value === 'string' ? [['overflow', decl.value]] : [];
+        }
+        default: {
+            return null;
+        }
+    }
+}
+
+exports.dispatchLayoutDeclaration = dispatchLayoutDeclaration;
+//# sourceMappingURL=layout-dispatcher.cjs.map

package/lib/cjs/core/parser/layout-dispatcher.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout-dispatcher.cjs","sources":["../../../../../src/core/parser/layout-dispatcher.ts"],"sourcesContent":["import type { Declaration as LcDeclaration } from 'lightningcss'\nimport type { RNEntry } from './types'\n\n/**\n * Lower CSS alignment keywords to the strings RN accepts. CSS uses\n * `start`/`end` while RN sticks with the legacy `flex-start`/`flex-end`.\n * Shared between `align-items`, `align-self`, `align-content`, and\n * `justify-content` — the lowering rule is identical for all four.\n * @param css CSS keyword (`center` / `start` / `end` / `baseline` / `stretch`).\n * @returns RN-compatible keyword.\n */\nfunction cssToRnAlignment(css: string): string {\n  if (css === 'start') return 'flex-start'\n  if (css === 'end') return 'flex-end'\n  return css\n}\n\n/** Alias kept for clarity at the call site. Identical lowering rule. */\nconst cssToRnJustify = cssToRnAlignment\n\n/**\n * Map lightningcss's `align-items` / `align-self` / `align-content`\n * value (typed as `{type: 'self-position' | 'baseline-position', value: …}`)\n * to the RN keyword RN expects.\n * @param value Typed alignment value.\n * @returns RN alignment string, or `null` when unmappable.\n */\nfunction mapAlignKeyword(value: unknown): string | null {\n  if (typeof value === 'string') return cssToRnAlignment(value)\n  if (typeof value !== 'object' || value === null) return null\n  const tagged = value as { type?: string; value?: string }\n  if (tagged.type === 'baseline-position') return 'baseline'\n  if (typeof tagged.value === 'string') return cssToRnAlignment(tagged.value)\n  // Bare-keyword variants like `{type: 'stretch'}` carry the keyword\n  // in the `type` field with no separate `value`.\n  if (tagged.type === 'stretch' || tagged.type === 'normal') return cssToRnAlignment(tagged.type)\n  return null\n}\n\n/**\n * Map lightningcss's `justify-content` value to the RN keyword.\n * @param value Typed justify value.\n * @returns RN justify string, or `null` when unmappable.\n */\nfunction mapJustifyKeyword(value: unknown): string | null {\n  if (typeof value === 'string') return cssToRnJustify(value)\n  if (typeof value !== 'object' || value === null) return null\n  const tagged = value as { type?: string; value?: string }\n  if (typeof tagged.value === 'string') return cssToRnJustify(tagged.value)\n  return null\n}\n\n/**\n * Dispatch flexbox-layout declarations (flex-direction, flex-wrap,\n * align-items, align-self, align-content, justify-content). Returns\n * `null` for any property the dispatcher doesn't handle so the caller\n * can fall through to its main switch.\n *\n * RN expects keyword-mapped strings: `flex-start` / `flex-end` instead\n * of CSS's `start` / `end`. We do the lowering here.\n * @param decl One lightningcss declaration.\n * @returns RN entries when the property matched, else `null`.\n */\nexport function dispatchLayoutDeclaration(decl: LcDeclaration): readonly RNEntry[] | null {\n  switch (decl.property) {\n    case 'flex-direction': {\n      return [['flexDirection', String(decl.value)]]\n    }\n    case 'flex-wrap': {\n      return [['flexWrap', String(decl.value)]]\n    }\n    case 'align-items': {\n      const v = mapAlignKeyword(decl.value)\n      return v === null ? [] : [['alignItems', v]]\n    }\n    case 'align-self': {\n      const v = mapAlignKeyword(decl.value)\n      return v === null ? [] : [['alignSelf', v]]\n    }\n    case 'align-content': {\n      const v = mapAlignKeyword(decl.value)\n      return v === null ? [] : [['alignContent', v]]\n    }\n    case 'justify-content': {\n      const v = mapJustifyKeyword(decl.value)\n      return v === null ? [] : [['justifyContent', v]]\n    }\n    case 'overflow': {\n      // Lightningcss splits CSS `overflow` into `{x, y}` axes; RN only\n      // supports a single `overflow` keyword (and only `'hidden' |\n      // 'visible' | 'scroll'` on iOS, `'hidden' | 'visible'` on\n      // Android — RN ignores unsupported keywords at runtime). Take\n      // the `x` axis when the user wrote shorthand; per-axis Tailwind\n      // utilities both emit shorthand here so axis splitting is rare.\n      const value = decl.value as { x?: unknown; y?: unknown }\n      if (typeof value.x !== 'string') return []\n      return [['overflow', value.x]]\n    }\n    case 'overflow-x':\n    case 'overflow-y': {\n      // Tailwind's `overflow-x-*` / `overflow-y-*` emit these longhands,\n      // not the `overflow` shorthand. RN has only a single `overflow`,\n      // so collapse both axes onto it (last one declared wins via the\n      // normal entry-merge order).\n      return typeof decl.value === 'string' ? [['overflow', decl.value]] : []\n    }\n    default: {\n      return null\n    }\n  }\n}\n"],"names":[],"mappings":"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"}

package/lib/cjs/core/parser/layout-dispatcher.d.ts

@@ -0,0 +1,14 @@
+import type { Declaration as LcDeclaration } from 'lightningcss';
+import type { RNEntry } from './types';
+/**
+ * Dispatch flexbox-layout declarations (flex-direction, flex-wrap,
+ * align-items, align-self, align-content, justify-content). Returns
+ * `null` for any property the dispatcher doesn't handle so the caller
+ * can fall through to its main switch.
+ *
+ * RN expects keyword-mapped strings: `flex-start` / `flex-end` instead
+ * of CSS's `start` / `end`. We do the lowering here.
+ * @param decl One lightningcss declaration.
+ * @returns RN entries when the property matched, else `null`.
+ */
+export declare function dispatchLayoutDeclaration(decl: LcDeclaration): readonly RNEntry[] | null;

package/lib/cjs/core/parser/length.cjs

@@ -0,0 +1,110 @@
+'use strict';
+
+var constants = require('./constants.cjs');
+
+/**
+ * Round a percentage / length float to 4 decimal places so lightningcss's
+ * IEEE-754 noise (`0.237 → 0.23700000345…`) doesn't leak into RN style
+ * strings. 4 decimals is well below CSS subpixel precision.
+ * @param n Raw float.
+ * @returns Rounded float with trailing zeros trimmed.
+ */
+function roundFloat(n) {
+    return Math.round(n * 10_000) / 10_000;
+}
+/**
+ * "Fully rounded" sentinel — emitted for Tailwind's `rounded-full` (and
+ * any other utility expanding to `calc(infinity * 1px)`). RN can't
+ * render `Infinity` as a style value (the StyleSheet validator silently
+ * drops it), but it accepts a finite large pixel count and renders the
+ * same pill / circle shape. 9999 covers every realistic phone screen.
+ */
+const FULLY_ROUNDED_PX = 9999;
+/**
+ * Convert a lightningcss `LengthValue` to a pixel number. Handles the
+ * units Tailwind emits: px, rem, em. Tailwind v4's "fully rounded"
+ * expansion (`calc(infinity * 1px)`) lands here as `value === Infinity`
+ * — we clamp to a finite sentinel so RN can render it. Other non-finite
+ * values (NaN from a malformed expression) are clamped to 0 rather
+ * than leaking through as `null` in the serialized RN style.
+ * @param length Typed length value.
+ * @returns Finite pixel number.
+ */
+function lengthToPx(length) {
+    const raw = length.value;
+    if (!Number.isFinite(raw))
+        return raw === Number.POSITIVE_INFINITY ? FULLY_ROUNDED_PX : 0;
+    switch (length.unit) {
+        case 'px': {
+            return raw;
+        }
+        case 'rem':
+        case 'em': {
+            return raw * constants.REM_TO_PX;
+        }
+        default: {
+            return raw;
+        }
+    }
+}
+/**
+ * Collapse a `DimensionPercentageFor_LengthValue` to a number (pixel) or
+ * `'N%'` string. `calc()` variants are not evaluated here — they fall
+ * through to `null` so the caller can skip or serialize via tokens.
+ * @param value Typed dimension-or-percentage.
+ * @returns Number, percent string, or `null` when unrepresentable.
+ */
+function dimensionPercentageToNumber(value) {
+    if (value.type === 'dimension')
+        return lengthToPx(value.value);
+    if (value.type === 'percentage')
+        return `${roundFloat(value.value * 100)}%`;
+    return null;
+}
+/**
+ * Convert `LengthPercentageOrAuto` (per-side value type for padding /
+ * margin / inset) to an RN scalar. `auto` maps to the string `'auto'`,
+ * which RN's margin accepts for centering; non-margin callers can filter
+ * it out if they need a number.
+ * @param value Typed length-percentage-or-auto.
+ * @returns RN scalar or `null` for unrepresentable shapes.
+ */
+function lengthPercentageOrAutoToValue(value) {
+    if (value.type === 'auto')
+        return 'auto';
+    return dimensionPercentageToNumber(value.value);
+}
+/**
+ * Convert a lightningcss `Size` (used by width/height) or `MaxSize` (used
+ * by max-width/max-height) to an RN scalar. Sizing keywords with no RN
+ * analog (`min-content`, `fit-content`, `stretch`, …) fall through to
+ * `null` so the caller drops them.
+ * @param value Typed size value.
+ * @returns RN scalar or `null` when unrepresentable.
+ */
+function sizeLikeToValue(value) {
+    if (value.type === 'auto' || value.type === 'none')
+        return value.type === 'auto' ? 'auto' : null;
+    if (value.type === 'length-percentage')
+        return dimensionPercentageToNumber(value.value);
+    return null;
+}
+/**
+ * Convert a lightningcss `GapValue` (per-axis gap, used by `row-gap` /
+ * `column-gap`) to an RN scalar. The `normal` keyword has no RN analog
+ * and falls through to `null`.
+ * @param value Typed gap value.
+ * @returns Number, percent string, or `null`.
+ */
+function gapValueToValue(value) {
+    if (value.type === 'normal')
+        return null;
+    return dimensionPercentageToNumber(value.value);
+}
+
+exports.dimensionPercentageToNumber = dimensionPercentageToNumber;
+exports.gapValueToValue = gapValueToValue;
+exports.lengthPercentageOrAutoToValue = lengthPercentageOrAutoToValue;
+exports.lengthToPx = lengthToPx;
+exports.sizeLikeToValue = sizeLikeToValue;
+//# sourceMappingURL=length.cjs.map

package/lib/cjs/core/parser/length.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"length.cjs","sources":["../../../../../src/core/parser/length.ts"],"sourcesContent":["import type {\n  DimensionPercentageFor_LengthValue as LcDimensionPercentage,\n  GapValue,\n  LengthPercentageOrAuto,\n  LengthValue,\n  MaxSize,\n  Size,\n} from 'lightningcss'\nimport { REM_TO_PX } from './constants'\n\n/** Alias for lightningcss's snake_case dimension-or-percentage type. */\ntype DimensionPercentage = LcDimensionPercentage\n\n/** RN-compatible length/percent result, or `null` when unrepresentable. */\ntype LengthResult = number | string | null\n\n/**\n * Round a percentage / length float to 4 decimal places so lightningcss's\n * IEEE-754 noise (`0.237 → 0.23700000345…`) doesn't leak into RN style\n * strings. 4 decimals is well below CSS subpixel precision.\n * @param n Raw float.\n * @returns Rounded float with trailing zeros trimmed.\n */\nfunction roundFloat(n: number): number {\n  return Math.round(n * 10_000) / 10_000\n}\n\n/**\n * \"Fully rounded\" sentinel — emitted for Tailwind's `rounded-full` (and\n * any other utility expanding to `calc(infinity * 1px)`). RN can't\n * render `Infinity` as a style value (the StyleSheet validator silently\n * drops it), but it accepts a finite large pixel count and renders the\n * same pill / circle shape. 9999 covers every realistic phone screen.\n */\nconst FULLY_ROUNDED_PX = 9999\n\n/**\n * Convert a lightningcss `LengthValue` to a pixel number. Handles the\n * units Tailwind emits: px, rem, em. Tailwind v4's \"fully rounded\"\n * expansion (`calc(infinity * 1px)`) lands here as `value === Infinity`\n * — we clamp to a finite sentinel so RN can render it. Other non-finite\n * values (NaN from a malformed expression) are clamped to 0 rather\n * than leaking through as `null` in the serialized RN style.\n * @param length Typed length value.\n * @returns Finite pixel number.\n */\nexport function lengthToPx(length: LengthValue): number {\n  const raw = length.value\n  if (!Number.isFinite(raw)) return raw === Number.POSITIVE_INFINITY ? FULLY_ROUNDED_PX : 0\n  switch (length.unit) {\n    case 'px': {\n      return raw\n    }\n    case 'rem':\n    case 'em': {\n      return raw * REM_TO_PX\n    }\n    default: {\n      return raw\n    }\n  }\n}\n\n/**\n * Collapse a `DimensionPercentageFor_LengthValue` to a number (pixel) or\n * `'N%'` string. `calc()` variants are not evaluated here — they fall\n * through to `null` so the caller can skip or serialize via tokens.\n * @param value Typed dimension-or-percentage.\n * @returns Number, percent string, or `null` when unrepresentable.\n */\nexport function dimensionPercentageToNumber(value: DimensionPercentage): LengthResult {\n  if (value.type === 'dimension') return lengthToPx(value.value)\n  if (value.type === 'percentage') return `${roundFloat(value.value * 100)}%`\n  return null\n}\n\n/**\n * Convert `LengthPercentageOrAuto` (per-side value type for padding /\n * margin / inset) to an RN scalar. `auto` maps to the string `'auto'`,\n * which RN's margin accepts for centering; non-margin callers can filter\n * it out if they need a number.\n * @param value Typed length-percentage-or-auto.\n * @returns RN scalar or `null` for unrepresentable shapes.\n */\nexport function lengthPercentageOrAutoToValue(value: LengthPercentageOrAuto): LengthResult {\n  if (value.type === 'auto') return 'auto'\n  return dimensionPercentageToNumber(value.value)\n}\n\n/**\n * Convert a lightningcss `Size` (used by width/height) or `MaxSize` (used\n * by max-width/max-height) to an RN scalar. Sizing keywords with no RN\n * analog (`min-content`, `fit-content`, `stretch`, …) fall through to\n * `null` so the caller drops them.\n * @param value Typed size value.\n * @returns RN scalar or `null` when unrepresentable.\n */\nexport function sizeLikeToValue(value: Size | MaxSize): LengthResult {\n  if (value.type === 'auto' || value.type === 'none') return value.type === 'auto' ? 'auto' : null\n  if (value.type === 'length-percentage') return dimensionPercentageToNumber(value.value)\n  return null\n}\n\n/**\n * Convert a lightningcss `GapValue` (per-axis gap, used by `row-gap` /\n * `column-gap`) to an RN scalar. The `normal` keyword has no RN analog\n * and falls through to `null`.\n * @param value Typed gap value.\n * @returns Number, percent string, or `null`.\n */\nexport function gapValueToValue(value: GapValue): LengthResult {\n  if (value.type === 'normal') return null\n  return dimensionPercentageToNumber(value.value)\n}\n"],"names":["REM_TO_PX"],"mappings":";;;;AAgBA;;;;;;AAMG;AACH,SAAS,UAAU,CAAC,CAAS,EAAA;IAC3B,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC,GAAG,MAAM;AACxC;AAEA;;;;;;AAMG;AACH,MAAM,gBAAgB,GAAG,IAAI;AAE7B;;;;;;;;;AASG;AACG,SAAU,UAAU,CAAC,MAAmB,EAAA;AAC5C,IAAA,MAAM,GAAG,GAAG,MAAM,CAAC,KAAK;AACxB,IAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC;AAAE,QAAA,OAAO,GAAG,KAAK,MAAM,CAAC,iBAAiB,GAAG,gBAAgB,GAAG,CAAC;AACzF,IAAA,QAAQ,MAAM,CAAC,IAAI;QACjB,KAAK,IAAI,EAAE;AACT,YAAA,OAAO,GAAG;QACZ;AACA,QAAA,KAAK,KAAK;QACV,KAAK,IAAI,EAAE;YACT,OAAO,GAAG,GAAGA,mBAAS;QACxB;QACA,SAAS;AACP,YAAA,OAAO,GAAG;QACZ;;AAEJ;AAEA;;;;;;AAMG;AACG,SAAU,2BAA2B,CAAC,KAA0B,EAAA;AACpE,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW;AAAE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC;AAC9D,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,YAAY;QAAE,OAAO,CAAA,EAAG,UAAU,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,CAAA,CAAA,CAAG;AAC3E,IAAA,OAAO,IAAI;AACb;AAEA;;;;;;;AAOG;AACG,SAAU,6BAA6B,CAAC,KAA6B,EAAA;AACzE,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM;AAAE,QAAA,OAAO,MAAM;AACxC,IAAA,OAAO,2BAA2B,CAAC,KAAK,CAAC,KAAK,CAAC;AACjD;AAEA;;;;;;;AAOG;AACG,SAAU,eAAe,CAAC,KAAqB,EAAA;IACnD,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM;AAAE,QAAA,OAAO,KAAK,CAAC,IAAI,KAAK,MAAM,GAAG,MAAM,GAAG,IAAI;AAChG,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,mBAAmB;AAAE,QAAA,OAAO,2BAA2B,CAAC,KAAK,CAAC,KAAK,CAAC;AACvF,IAAA,OAAO,IAAI;AACb;AAEA;;;;;;AAMG;AACG,SAAU,eAAe,CAAC,KAAe,EAAA;AAC7C,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ;AAAE,QAAA,OAAO,IAAI;AACxC,IAAA,OAAO,2BAA2B,CAAC,KAAK,CAAC,KAAK,CAAC;AACjD;;;;;;;;"}

package/lib/cjs/core/parser/length.d.ts

@@ -0,0 +1,51 @@
+import type { DimensionPercentageFor_LengthValue as LcDimensionPercentage, GapValue, LengthPercentageOrAuto, LengthValue, MaxSize, Size } from 'lightningcss';
+/** Alias for lightningcss's snake_case dimension-or-percentage type. */
+type DimensionPercentage = LcDimensionPercentage;
+/** RN-compatible length/percent result, or `null` when unrepresentable. */
+type LengthResult = number | string | null;
+/**
+ * Convert a lightningcss `LengthValue` to a pixel number. Handles the
+ * units Tailwind emits: px, rem, em. Tailwind v4's "fully rounded"
+ * expansion (`calc(infinity * 1px)`) lands here as `value === Infinity`
+ * — we clamp to a finite sentinel so RN can render it. Other non-finite
+ * values (NaN from a malformed expression) are clamped to 0 rather
+ * than leaking through as `null` in the serialized RN style.
+ * @param length Typed length value.
+ * @returns Finite pixel number.
+ */
+export declare function lengthToPx(length: LengthValue): number;
+/**
+ * Collapse a `DimensionPercentageFor_LengthValue` to a number (pixel) or
+ * `'N%'` string. `calc()` variants are not evaluated here — they fall
+ * through to `null` so the caller can skip or serialize via tokens.
+ * @param value Typed dimension-or-percentage.
+ * @returns Number, percent string, or `null` when unrepresentable.
+ */
+export declare function dimensionPercentageToNumber(value: DimensionPercentage): LengthResult;
+/**
+ * Convert `LengthPercentageOrAuto` (per-side value type for padding /
+ * margin / inset) to an RN scalar. `auto` maps to the string `'auto'`,
+ * which RN's margin accepts for centering; non-margin callers can filter
+ * it out if they need a number.
+ * @param value Typed length-percentage-or-auto.
+ * @returns RN scalar or `null` for unrepresentable shapes.
+ */
+export declare function lengthPercentageOrAutoToValue(value: LengthPercentageOrAuto): LengthResult;
+/**
+ * Convert a lightningcss `Size` (used by width/height) or `MaxSize` (used
+ * by max-width/max-height) to an RN scalar. Sizing keywords with no RN
+ * analog (`min-content`, `fit-content`, `stretch`, …) fall through to
+ * `null` so the caller drops them.
+ * @param value Typed size value.
+ * @returns RN scalar or `null` when unrepresentable.
+ */
+export declare function sizeLikeToValue(value: Size | MaxSize): LengthResult;
+/**
+ * Convert a lightningcss `GapValue` (per-axis gap, used by `row-gap` /
+ * `column-gap`) to an RN scalar. The `normal` keyword has no RN analog
+ * and falls through to `null`.
+ * @param value Typed gap value.
+ * @returns Number, percent string, or `null`.
+ */
+export declare function gapValueToValue(value: GapValue): LengthResult;
+export {};