zyzz 0.0.21 → 0.0.23

package/src/compiler/internal/Contract.ts

@@ -26,7 +26,7 @@ export function read(
   if (
     ![
       1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21,
-      22, 23, 24, 25, 26, 27, 28, 29, 30, 31,
+      22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33,
     ].includes(data.version as number)
   )
     throw new Error('Unsupported Zyzz contract version.')
@@ -58,26 +58,11 @@ export function read(
     for (const entry of Object.values(record(data.exports))) collect(entry)
   }
 
-  function variableNaming(
-    entry: Record<string, unknown>,
-    identity: string,
-  ): 'legacy' | 'hashed' | undefined {
-    if (entry.variableNaming !== undefined) {
-      if ((data.version as number) >= 30 && entry.variableNaming === 'legacy')
-        return 'legacy'
-      if ((data.version as number) >= 31 && entry.variableNaming === 'hashed')
-        return 'hashed'
-      throw new Error('Invalid packed variable naming scheme.')
-    }
-    if ((data.version as number) <= 30) {
-      if (
-        identity.startsWith('src-') ||
-        (data.version === 30 && identity.startsWith('id-'))
+  function validateVariables(entry: Record<string, unknown>) {
+    if ((data.version as number) < 31 || entry.variableNaming !== undefined)
+      throw new Error(
+        'Legacy packed variable names are unsupported. Rebuild the library with the current version of Zyzz.',
       )
-        return 'hashed'
-      return 'legacy'
-    }
-    return undefined
   }
 
   function decode(value: unknown): unknown {
@@ -114,19 +99,14 @@ export function read(
     if (Object.hasOwn(fields, '$variable')) {
       const reference = record(fields.$variable)
       const identity = string(reference.identity)
-      const naming = variableNaming(reference, identity)
+      validateVariables(reference)
       let contract = identities.get(identity)
       if (contract && !contract.variableSet)
         throw new Error(
           'Conflicting packed variable-set modes for one identity.',
         )
-      if (contract && contract.variableNaming !== naming)
-        throw new Error(
-          'Conflicting packed variable naming schemes for one identity.',
-        )
       if (!contract) {
         contract = Object.freeze({
-          ...(naming ? { variableNaming: naming } : {}),
           variableSet: true,
           [Token.identity]: identity,
         })
@@ -150,7 +130,11 @@ export function read(
   for (const [name, value] of Object.entries(record(data.themes))) {
     const entry = record(value)
     const identity = string(entry.identity)
-    const naming = variableNaming(entry, identity)
+    if (
+      Object.keys(record(entry.tokens)).length ||
+      entry.variableNaming !== undefined
+    )
+      validateVariables(entry)
     if (entry.variableSet === true && (data.version as number) < 28)
       throw new Error('Vars contracts require contract version 28 or later.')
     const mappings = VariableSets.mappings(entry.mappings)
@@ -209,13 +193,8 @@ export function read(
         'Conflicting packed default layers for one theme identity.',
       )
 
-    if (contract && contract.variableNaming !== naming)
-      throw new Error(
-        'Conflicting packed variable naming schemes for one identity.',
-      )
     if (!contract) {
       contract = Object.freeze({
-        ...(naming ? { variableNaming: naming } : {}),
         ...(entry.variableSet === true
           ? {
               variableSet: true,
@@ -267,6 +246,8 @@ export function read(
 
   function link(value: unknown): Themes.Link {
     const raw = record(value)
+    if (raw.nativeProvider !== undefined && (data.version as number) < 32)
+      throw new Error('Native providers require contract version 32 or later.')
     // Contracts before version 19 record style authoring exports as `css`.
     const entry =
       raw.kind === 'css' && (data.version as number) < 19
@@ -352,7 +333,7 @@ export function read(
       if (
         ![
           9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26,
-          27, 28, 29, 30, 31,
+          27, 28, 29, 30, 31, 32, 33,
         ].includes(data.version as number) ||
         ![
           'cssFunction',
@@ -421,6 +402,34 @@ export function read(
                 return [key, member]
               }),
             )
+      const nativeContext = (() => {
+        if (entry.nativeContext === undefined) return undefined
+        if ((data.version as number) < 33)
+          throw new Error(
+            'Native style catalogs require contract version 33 or later.',
+          )
+        if (entry.style === undefined)
+          throw new Error('Native style catalogs require a packed style.')
+        const context = record(entry.nativeContext)
+        const vars = Object.fromEntries(
+          Object.entries(record(context.vars)).map((entry) => {
+            const [name, value] = entry
+            const theme = themes[string(value)]
+            if (!name || !theme)
+              throw new Error('Unknown packed native style catalog.')
+            return [name, theme]
+          }),
+        )
+        const defaultVars = string(context.defaultVars)
+        if (!Object.hasOwn(vars, defaultVars))
+          throw new Error('Invalid packed native style default.')
+        const identities = new Set(
+          Object.values(vars).map((theme) => theme[Token.definition].contract),
+        )
+        if (identities.size !== 1)
+          throw new Error('Incompatible packed native style catalog.')
+        return { defaultVars, vars }
+      })()
       return {
         binding,
         call: {
@@ -434,11 +443,14 @@ export function read(
         ...(entry.style === undefined
           ? {}
           : {
-              style: PackedStyles.read(
-                entry.style,
-                themes,
-                data.version as number,
-              ),
+              style: {
+                ...PackedStyles.read(
+                  entry.style,
+                  themes,
+                  data.version as number,
+                ),
+                ...(nativeContext ? { nativeContext } : {}),
+              },
             }),
         ...(members ? { members } : {}),
       }
@@ -523,9 +535,11 @@ export function read(
       !!options?.themes &&
       ((data.version as number) < 4 || entry.catalogOnly === true)
     const fullConfigType = options
-      ? entry.variableConfig === true
-        ? `import('zyzz').Config.VariableConfig<${Configurations.type(variableOptions(options, entry.variableMappings as Vars.Mappings | false | undefined))}>`
-        : `import('zyzz').Config.create.ReturnType<${Configurations.type(options)}>`
+      ? entry.nativeProvider === true
+        ? `import('zyzz/react-native/react').defineConfig.ReturnType<${Configurations.type(entry.variableConfig === true ? variableOptions(options, entry.variableMappings as Vars.Mappings | false | undefined) : options)}>`
+        : entry.variableConfig === true
+          ? `import('zyzz').Config.VariableConfig<${Configurations.type(variableOptions(options, entry.variableMappings as Vars.Mappings | false | undefined))}>`
+          : `import('zyzz').Config.create.ReturnType<${Configurations.type(options)}>`
       : ''
     // Helpers a legacy library did not compile are hidden from its consumers' types.
     const hidden = [
@@ -544,6 +558,7 @@ export function read(
     return {
       binding: string(entry.binding),
       call: {
+        ...(entry.nativeProvider === true ? { nativeProvider: true } : {}),
         ...(entry.variableSet === true
           ? {
               variableSet: true,
@@ -718,6 +733,28 @@ export function write(
       return {
         binding: link.binding,
         kind: link.kind,
+        ...(link.style?.nativeContext
+          ? {
+              nativeContext: {
+                defaultVars: link.style.nativeContext.defaultVars,
+                vars: Object.fromEntries(
+                  Object.entries(link.style.nativeContext.vars).map((entry) => {
+                    const [name, definition] = entry
+                    const theme = Object.entries(themes).find(
+                      (candidate) =>
+                        candidate[1][Token.definition].contract ===
+                          definition[Token.definition].contract &&
+                        JSON.stringify(input(candidate[1])) ===
+                          JSON.stringify(input(definition)),
+                    )
+                    if (!theme)
+                      throw new Error('Missing packed native style catalog.')
+                    return [name, theme[0]]
+                  }),
+                ),
+              },
+            }
+          : {}),
         ...(link.style ? { style: PackedStyles.write(link.style) } : {}),
         ...(link.members
           ? {
@@ -733,6 +770,7 @@ export function write(
 
     return {
       ...(link.call.variableSet ? { variableSet: true } : {}),
+      ...(link.call.nativeProvider ? { nativeProvider: true } : {}),
       ...(link.call.directVariables ? { directVariables: true } : {}),
       ...(link.call.variableConfig
         ? { variableConfig: true, variableMappings: link.call.variableMappings }
@@ -800,18 +838,31 @@ export function write(
                 mappings: theme[Token.definition].contract.mappings,
               }
             : {}),
-          ...(theme[Token.definition].contract.variableNaming
-            ? {
-                variableNaming: theme[Token.definition].contract.variableNaming,
-              }
-            : {}),
           identity: theme[Token.definition].contract[Token.identity],
           tokens: encode(input(theme)),
         },
       ]),
     ),
-    version: 31,
+    version: Object.values(links).some(nativeCatalog)
+      ? 33
+      : Object.values(links).some(nativeProvider)
+        ? 32
+        : 31,
   })
+
+  function nativeProvider(link: Themes.Link): boolean {
+    return (
+      link.call.nativeProvider === true ||
+      Object.values(link.members ?? {}).some(nativeProvider)
+    )
+  }
+
+  function nativeCatalog(link: Themes.Link): boolean {
+    return (
+      Boolean(link.style?.nativeContext) ||
+      Object.values(link.members ?? {}).some(nativeCatalog)
+    )
+  }
 }
 
 /** Contract writer contracts. */
@@ -894,9 +945,6 @@ function encode(value: unknown): unknown {
   if (Token.is(value))
     return {
       $variable: {
-        ...(value.contract.variableNaming
-          ? { variableNaming: value.contract.variableNaming }
-          : {}),
         identity: value.contract[Token.identity],
         path: value.path,
         value: encode(value.value),

package/src/compiler/internal/Contributions.ts

@@ -1025,7 +1025,13 @@ export function extract(
                   ]
                 if (
                   !margin &&
-                  ['bleed', 'marks', 'pageOrientation', 'size'].includes(key)
+                  [
+                    'bleed',
+                    'marks',
+                    'pageMarginSafety',
+                    'pageOrientation',
+                    'size',
+                  ].includes(key)
                 ) {
                   if (typeof value !== 'string' && typeof value !== 'number')
                     throw new Error('Expected a scalar page descriptor.')

package/src/compiler/internal/Descriptors.ts

@@ -8,11 +8,11 @@ export function check(options: check.Options): void {
     /[A-Z]/g,
     (letter) => `-${letter.toLowerCase()}`,
   )
-  const result = Tree.lexer.matchAtruleDescriptor(
-    options.rule,
-    name,
-    options.value,
-  )
+  // The pinned parser predates this page descriptor.
+  const result =
+    options.rule === 'page' && name === 'page-margin-safety'
+      ? Tree.lexer.match('none | clamp | add', options.value)
+      : Tree.lexer.matchAtruleDescriptor(options.rule, name, options.value)
   if (result.error)
     throw new Error(`Invalid @${options.rule} ${name}: ${result.error.message}`)
   if (
@@ -102,9 +102,13 @@ export function validate(source: string): void {
         rule.block.children.forEach((declaration) => {
           if (declaration.type !== 'Declaration') return
           if (
-            ['bleed', 'marks', 'page-orientation', 'size'].includes(
-              declaration.property,
-            )
+            [
+              'bleed',
+              'marks',
+              'page-margin-safety',
+              'page-orientation',
+              'size',
+            ].includes(declaration.property)
           )
             check({
               rule: 'page',

package/src/compiler/internal/Dynamic.ts

@@ -154,6 +154,10 @@ export function read(
           (value) => Number.isSafeInteger(value) && value !== 0,
         )
 
+      // Native conversion rejects degenerate and negative ratios.
+      if (rule.kind === 'ratio')
+        return values.every((value) => Number.isFinite(value) && value > 0)
+
       if (rule.kind !== 'number') return false
 
       return values.every(

package/src/compiler/internal/Expression.ts

@@ -21,7 +21,7 @@ export function acceptsColor(
       return 'var(--zyzz-reference)'
     })
     .join('')
-    .replace(/ !important$/, '')
+    .replace(/(?: !custom)?(?: !important)?$/, '')
 
   try {
     return (
@@ -61,7 +61,7 @@ export function acceptsVariables(
       (value) =>
         Tree.lexer.matchProperty(
           Literal.name(property),
-          value.replace(/ !important$/, ''),
+          value.replace(/(?: !custom)?(?: !important)?$/, ''),
         ).error === null,
     )
   } catch {

package/src/compiler/internal/NativeBindings.ts

@@ -1,13 +1,32 @@
 /** Lowers target-neutral callback declarations to ordered native binding data. @module */
-import type * as Recipe from '../../internal/Recipe.js'
 import * as Binding from '../../internal/Binding.js'
-import * as Token from '../../internal/Token.js'
-import type * as Style from '../../Style.js'
-import * as StyleSheet from '../../react-native/StyleSheet.js'
-import * as Scalar from '../../react-native/internal/Scalar.js'
-import type * as Runtime from '../../runtime/NativeDynamic.js'
 import type * as Native from '../Native.js'
+import type * as Recipe from '../../internal/Recipe.js'
+import type * as Runtime from '../../runtime/NativeDynamic.js'
+import * as Scalar from '../../react-native/internal/Scalar.js'
 import type * as Source from '../Source.js'
+import type * as Static from '../../runtime/NativeStatic.js'
+import type * as Style from '../../Style.js'
+import * as StyleSheet from '../../react-native/StyleSheet.js'
+import * as Token from '../../internal/Token.js'
+import * as Tokens from '../../react-native/internal/Tokens.js'
+
+type Step = Runtime.Program['rules'][number]['steps'][number]
+type PreparedStep =
+  | Extract<Step, { readonly style: string }>
+  | {
+      readonly property: keyof typeof Scalar.properties
+      readonly parts: readonly (
+        | string
+        | number
+        | Token.Reference
+        | { readonly slot: string; readonly number?: true }
+      )[]
+    }
+type PreparedRule = {
+  readonly matches: Runtime.Program['rules'][number]['matches']
+  readonly steps: readonly PreparedStep[]
+}
 
 /** Compiles static fragments and retains scalar assignments in authored order. */
 export function compile(
@@ -16,8 +35,36 @@ export function compile(
   options: Native.compile.Options,
   prepared = prepare(recipe, call, options),
 ): Runtime.create.Options {
+  const selected = options.vars?.[options.set ?? 'default']
+  const metadata =
+    selected &&
+    (Object.getOwnPropertyDescriptor(selected, Token.definition)?.value as
+      | Token.Metadata
+      | undefined)
   return {
     ...prepared,
+    program: {
+      slots: prepared.program.slots,
+      rules: prepared.program.rules.map((rule) => ({
+        ...rule,
+        steps: rule.steps.map((step) =>
+          'style' in step
+            ? step
+            : {
+                ...step,
+                parts: step.parts.map((part) =>
+                  Token.is(part)
+                    ? Tokens.resolve(part, {
+                        ...options,
+                        metadata,
+                        resolution: { schemeIndependent: true },
+                      })
+                    : part,
+                ),
+              },
+        ),
+      })),
+    },
     styles: StyleSheet.select(prepared.styles, {
       set: options.set ?? 'default',
       colorScheme: options.colorScheme,
@@ -25,6 +72,39 @@ export function compile(
   }
 }
 
+/** Removes dynamic instructions and resolves absolute line heights before publication. */
+export function finite(options: Runtime.create.Options): Static.create.Options {
+  const styles = { ...options.styles }
+  return {
+    axes: options.axes,
+    defaults: options.defaults,
+    rules: options.program.rules.map((rule) => ({
+      matches: rule.matches,
+      steps: rule.steps.map((step) => {
+        if ('style' in step) return step.style
+        if (
+          step.property !== 'lineHeight' ||
+          !step.parts.length ||
+          step.parts.some((part) => typeof part === 'object')
+        )
+          throw new Error(
+            'Static native recipes cannot contain runtime bindings.',
+          )
+        const value = (
+          step.parts.length === 1 ? step.parts[0]! : step.parts.join('')
+        ) as string | number
+        if (typeof value === 'number') return value
+        const name = String(Object.keys(styles).length)
+        styles[name] = {
+          lineHeight: Scalar.length(value, options, false, ['lineHeight']),
+        }
+        return name
+      }),
+    })),
+    styles,
+  }
+}
+
 /** Prepares immutable programs and all set/scheme tables before selection. */
 export function prepare(
   recipe: Recipe.Definition,
@@ -41,15 +121,10 @@ export function prepare(
     ),
   ])
   const fragments: Style.NamedStyle[] = []
-  const rules: Runtime.Program['rules'][number][] = []
-  let count = 1
-  for (const choices of Object.values(recipe.axes)) count *= choices.length + 1
-  if (count > 256)
-    throw new Error(
-      'Native recipes support at most 256 selections, including null choices.',
-    )
+  const rules: PreparedRule[] = []
+
   for (const rule of recipe.rules) {
-    const steps: Runtime.Program['rules'][number]['steps'][number][] = []
+    const steps: PreparedStep[] = []
     function fragment(style: Style.NamedStyle) {
       const name = String(fragments.length)
       fragments.push({ ...style, name })
@@ -82,6 +157,7 @@ export function prepare(
         if (
           !Object.hasOwn(Scalar.properties, property) ||
           [
+            'flex',
             'transform',
             'origin',
             'shadow',
@@ -94,14 +170,22 @@ export function prepare(
           )
         const values = parts.map((part) => {
           if (typeof part === 'string' || typeof part === 'number') return part
+          if (Token.is(part)) return part
           if (!Binding.is(part) || !available.has(part.name))
             throw new Error(
               'Native bindings require declared runtime scalar fields.',
             )
-          return { slot: part.name }
+          return {
+            slot: part.name,
+            ...(part.type === 'number' ? { number: true as const } : {}),
+          }
         })
+        const calculation = values.some(
+          (value) => typeof value === 'string' && /(?:^|\s)calc\(/i.test(value),
+        )
         if (
           values.length > 1 &&
+          !calculation &&
           !(
             values.length === 2 &&
             typeof values[0] === 'object' &&