@jackens/nnn 2026.9.28 → 2026.9.29

package/README.md

@@ -1,6 +1,6 @@
 # nnn
 
-A collection of Jackens’ JavaScript helper utilities (version: `2026.9.28`).
+A collection of Jackens’ JavaScript helper utilities (version: `2026.9.29`).
 
 ## Installation
 
@@ -21,10 +21,10 @@ import {
   CNode,
   HArgs,
   HArgs1,
-  TokenizerSpec,
-  TokenizerSpecOptions,
+  LexerSpec,
+  LexerSpecOptions,
   c,
-  createTokenizer,
+  createLexer,
   h,
   monokai,
   nanolightTs,
@@ -42,26 +42,26 @@ import {
   Tuple argument type for the [`h`](#h) and [`s`](#s) helpers.
 - [`HArgs1`](#HArgs1):
   Single argument type for the [`h`](#h) and [`s`](#s) helpers.
-- [`TokenizerSpec`](#TokenizerSpec):
-  A [`createTokenizer`](#createTokenizer) spec: a `[metadata, pattern, options?]` tuple.
-- [`TokenizerSpecOptions`](#TokenizerSpecOptions):
-  Options of a [`createTokenizer`](#createTokenizer) spec controlling the tokenizer state stack.
+- [`LexerSpec`](#LexerSpec):
+  A [`createLexer`](#createLexer) spec: a `[metadata, pattern, options?]` tuple.
+- [`LexerSpecOptions`](#LexerSpecOptions):
+  Options of a [`createLexer`](#createLexer) spec controlling the lexer state stack.
 - [`c`](#c):
   A minimal CSS-in-JS helper that converts a JavaScript object hierarchy into a CSS string.
-- [`createTokenizer`](#createTokenizer):
-  A helper for building simple stateful tokenizers (see also [`nanolightTs`](#nanolightTs)).
+- [`createLexer`](#createLexer):
+  A helper for building simple stateful lexers (see also [`nanolightTs`](#nanolightTs)).
 - [`h`](#h):
   A lightweight _HyperScript_-style helper for creating and modifying `HTMLElement`s (see also [`s`](#s)).
 - [`monokai`](#monokai):
-  A Monokai-inspired color scheme for use with the [`c`](#c) helper and [`nanolightTs`](#nanolightTs) tokenizer.
+  A Monokai-inspired color scheme for use with the [`c`](#c) helper and [`nanolightTs`](#nanolightTs) lexer.
 - [`nanolightTs`](#nanolightTs):
-  A TypeScript/JavaScript syntax highlighting tokenizer built using [`createTokenizer`](#createTokenizer).
+  A TypeScript/JavaScript syntax highlighting lexer built using [`createLexer`](#createLexer).
 - [`rwd`](#rwd):
-  A responsive web design helper that generates CSS rules for a grid-like layout.
+  A responsive web design helper that generates CSS rules for a grid-like layout of floating elements.
 - [`s`](#s):
   A lightweight _HyperScript_-style helper for creating and modifying `SVGElement`s (see also [`h`](#h)).
 - [`svgUse`](#svgUse):
-  Shorthand for creating an SVG element with a `<use>` child referencing an icon by ID.
+  Shorthand for creating an `<svg>` element with a `<use>` child referencing a symbol (e.g. an icon) by ID.
 
 ### CNode
 
@@ -89,25 +89,25 @@ type HArgs1 = Record<PropertyKey, unknown> | null | undefined | Node | string |
 
 Single argument type for the [`h`](#h) and [`s`](#s) helpers.
 
-### TokenizerSpec
+### LexerSpec
 
 ```ts
-type TokenizerSpec<M> = [metadata: M, pattern: string | RegExp, options?: TokenizerSpecOptions]
+type LexerSpec<M> = [metadata: M, pattern: string | RegExp, options?: LexerSpecOptions]
 ```
 
-A [`createTokenizer`](#createTokenizer) spec: a `[metadata, pattern, options?]` tuple.
+A [`createLexer`](#createLexer) spec: a `[metadata, pattern, options?]` tuple.
 
-### TokenizerSpecOptions
+### LexerSpecOptions
 
 ```ts
-type TokenizerSpecOptions = {
+type LexerSpecOptions = {
   in?: string | string[]
   pop?: boolean
   push?: string
 }
 ```
 
-Options of a [`createTokenizer`](#createTokenizer) spec controlling the tokenizer state stack.
+Options of a [`createLexer`](#createLexer) spec controlling the lexer state stack.
 
 #### in
 
@@ -133,12 +133,15 @@ A minimal CSS-in-JS helper that converts a JavaScript object hierarchy into a CS
 
 An object describing CSS rules.
 Keys are selectors or at-rules; values are either CSS property values or nested rule objects.
+Nested selectors are appended to the parent selector as is (e.g. `'.c'` inside `a` → `a.c`), so a leading space is needed for a descendant combinator (e.g. `' .c'` → `a .c`).
 A selector key may contain comma-separated alternatives (e.g. `'.b,.c'`); when nested, each alternative is combined with each parent alternative (cartesian product), producing a comma-joined selector list (e.g. `'a.b,a.c'`).
+Top-level at-rules (e.g. `'@media …'`) wrap their nested rules; inside a top-level `:root` rule nested keys are concatenated into property names (e.g. `{ ':root': { '--': { bg: 'red' } } }` → `:root{--bg:red}`).
+`null`/`undefined` values are skipped.
 
 #### splitter
 
 A delimiter used to create unique keys (default: `'$$'`).
-The substring from `splitter` to the end of a key is ignored (e.g., `src$$1` → `src`).
+The substring from `splitter` to the end of a key is ignored (e.g. `src$$1` → `src`).
 
 #### Returns
 
@@ -435,16 +438,16 @@ const expected = `
 expect(actual).toBe(expected)
 ```
 
-### createTokenizer
+### createLexer
 
 ```ts
-const createTokenizer: <M, T>(
+const createLexer: <M, T>(
   decorator: (chunk: string, metadata?: M) => T,
-  ...specs: TokenizerSpec<M>[]
+  ...specs: LexerSpec<M>[]
 ) => (code: string) => T[]
 ```
 
-A helper for building simple stateful tokenizers (see also [`nanolightTs`](#nanolightTs)).
+A helper for building simple stateful lexers (see also [`nanolightTs`](#nanolightTs)).
 
 #### Remarks
 
@@ -457,32 +460,32 @@ A helper for building simple stateful tokenizers (see also [`nanolightTs`](#nano
 
 #### decorator
 
-A function that wraps each matched chunk.
-It receives the matched text (`chunk`) and optionally the `metadata` associated with the pattern that produced the match.
-For unmatched text between patterns, `metadata` is `undefined`.
+A function that wraps each chunk of the input.
+It receives the matched text (`chunk`) and the `metadata` of the spec whose pattern produced the match.
+For unmatched text between matches, `metadata` is `undefined`.
 
 #### specs
 
 An array of tuples `[metadata, pattern, options?]` where:
 
 - `metadata`: arbitrary data (e.g., a CSS class name) passed to `decorator` when the pattern matches.
-- `pattern`: a `string` or `RegExp` to match against the input.
-- `options`: optional [`TokenizerSpecOptions`](#TokenizerSpecOptions) (states in which the spec is active and state transitions).
+- `pattern`: a `string` (matched literally) or `RegExp` to match against the input.
+- `options`: optional [`LexerSpecOptions`](#LexerSpecOptions) (states in which the spec is active and state transitions).
 
 #### Returns
 
-A tokenizer function that accepts a code string and returns an array of decorated tokens.
+A lexer function that accepts an input string and returns an array of decorated chunks covering the whole input (in order).
 
 #### Usage Examples
 
 ```ts
-const tokenizer = createTokenizer(
+const lexer = createLexer(
   (chunk, metadata) => ({ chunk, metadata }),
   ['keyword', /\b(if|else|for)\b/],
   ['string', /"[^"]*"/]
 )
 
-const result = tokenizer('if "hello" else "world"')
+const result = lexer('if "hello" else "world"')
 
 expect(result).toEqual([
   { chunk: 'if', metadata: 'keyword' },
@@ -496,25 +499,25 @@ expect(result).toEqual([
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => `${metadata}:${chunk}`, ['tag', 'BEGIN'], ['end', 'END'])
+const lexer = createLexer((chunk, metadata) => `${metadata}:${chunk}`, ['tag', 'BEGIN'], ['end', 'END'])
 
-const result = tokenizer('aBEGINbENDc')
+const result = lexer('aBEGINbENDc')
 
 expect(result).toEqual(['undefined:a', 'tag:BEGIN', 'undefined:b', 'end:END', 'undefined:c'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(chunk => chunk, ['test', /test/])
+const lexer = createLexer(chunk => chunk, ['test', /test/])
 
-const result = tokenizer('')
+const result = lexer('')
 
 expect(result).toEqual([])
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => ({ chunk, metadata }), ['start', /^test/])
+const lexer = createLexer((chunk, metadata) => ({ chunk, metadata }), ['start', /^test/])
 
-const result = tokenizer('test here')
+const result = lexer('test here')
 
 expect(result).toEqual([
   { chunk: 'test', metadata: 'start' },
@@ -523,90 +526,90 @@ expect(result).toEqual([
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => metadata, ['later', /x/], ['earlier', /y/])
+const lexer = createLexer((chunk, metadata) => metadata, ['later', /x/], ['earlier', /y/])
 
-const result = tokenizer('yx')
+const result = lexer('yx')
 
 expect(result).toEqual(['earlier', 'later'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(chunk => chunk, ['short', 'a'], ['long', 'abc'])
+const lexer = createLexer(chunk => chunk, ['short', 'a'], ['long', 'abc'])
 
-const result = tokenizer('abc')
+const result = lexer('abc')
 
 expect(result).toEqual(['abc'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(chunk => chunk, ['empty', ''], ['word', /\w+/])
+const lexer = createLexer(chunk => chunk, ['empty', ''], ['word', /\w+/])
 
-const result = tokenizer('hello')
+const result = lexer('hello')
 
 expect(result).toEqual(['hello'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(chunk => chunk, ['test', /xyz/])
+const lexer = createLexer(chunk => chunk, ['test', /xyz/])
 
-const result = tokenizer('abc')
+const result = lexer('abc')
 
 expect(result).toEqual(['abc'])
 ```
 
 ```ts
-const tokenizer = createTokenizer((_chunk, metadata) => metadata, ['a', 'a'], ['b', 'b'])
+const lexer = createLexer((_chunk, metadata) => metadata, ['a', 'a'], ['b', 'b'])
 
-const result = tokenizer('aabb')
+const result = lexer('aabb')
 
 expect(result).toEqual(['a', 'a', 'b', 'b'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(
+const lexer = createLexer(
   (chunk, metadata) => `${metadata}:${chunk}`,
   ['open', '(', { push: 'inner' }],
   ['word', /\w+/, { in: 'inner' }],
   ['close', ')', { in: 'inner', pop: true }]
 )
 
-const result = tokenizer('a(b)c)')
+const result = lexer('a(b)c)')
 
 expect(result).toEqual(['undefined:a', 'open:(', 'word:b', 'close:)', 'undefined:c)'])
 ```
 
 ```ts
-const tokenizer = createTokenizer(
+const lexer = createLexer(
   (chunk, metadata) => `${metadata}:${chunk}`,
   ['open', '{', { in: ['root', 'nested'], push: 'nested' }],
   ['close', '}', { in: 'nested', pop: true }]
 )
 
-const result = tokenizer('{{}}}')
+const result = lexer('{{}}}')
 
 expect(result).toEqual(['open:{', 'open:{', 'close:}', 'close:}', 'undefined:}'])
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => `${metadata}:${chunk}`, ['a', 'a'], ['b', /(?<=a)b/])
+const lexer = createLexer((chunk, metadata) => `${metadata}:${chunk}`, ['a', 'a'], ['b', /(?<=a)b/])
 
-const result = tokenizer('abcb')
+const result = lexer('abcb')
 
 expect(result).toEqual(['a:a', 'b:b', 'undefined:cb'])
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => `${metadata}:${chunk}`, ['x', /x/y], ['y', 'y'])
+const lexer = createLexer((chunk, metadata) => `${metadata}:${chunk}`, ['x', /x/y], ['y', 'y'])
 
-const result = tokenizer('xyx.x')
+const result = lexer('xyx.x')
 
 expect(result).toEqual(['x:x', 'y:y', 'x:x', 'undefined:.x'])
 ```
 
 ```ts
-const tokenizer = createTokenizer((chunk, metadata) => `${metadata}:${chunk}`, ['digits', /\d*/])
+const lexer = createLexer((chunk, metadata) => `${metadata}:${chunk}`, ['digits', /\d*/])
 
-const result = tokenizer('ab12')
+const result = lexer('ab12')
 
 expect(result).toEqual(['undefined:ab', 'digits:12'])
 ```
@@ -615,9 +618,9 @@ expect(result).toEqual(['undefined:ab', 'digits:12'])
 
 ```ts
 const h: {
-  <T extends keyof HTMLElementTagNameMap>(tag: T, ...args1: HArgs1[]): HTMLElementTagNameMap[T]
-  <N extends Node>(node: N, ...args1: HArgs1[]): N
-  (tagOrNode: string | Node, ...args1: HArgs1[]): Node
+  <T extends keyof HTMLElementTagNameMap>(tag: T, ...args: HArgs1[]): HTMLElementTagNameMap[T]
+  <N extends Node>(node: N, ...args: HArgs1[]): N
+  (tagOrNode: string | Node, ...args: HArgs1[]): Node
 }
 ```
 
@@ -633,17 +636,17 @@ If a `Node`, that node is modified in place.
 Additional arguments processed as follows:
 
 - `Object`: maps attributes/properties.
-  Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it (useful e.g. for `$style`).
-  Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
-  A value of `false` removes the attribute.
+  - Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it (useful e.g. for `$style`).
+  - Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
+    A value of `true` sets an empty attribute (e.g. `checked=""`), a value of `false` removes the attribute.
 - `null`/`undefined`: ignored.
 - `Node`: appended as a child.
 - `string`/`number`: converted to a `Text` node and appended.
-- [`HArgs`](#HArgs) array: processed recursively.
+- [`HArgs`](#HArgs) array: processed recursively (creates or modifies a child node and appends it).
 
 #### Returns
 
-The created or modified `HTMLElement`.
+The created `HTMLElement` or the modified node.
 
 #### Usage Examples
 
@@ -753,7 +756,26 @@ expect(elemWithNested.outerHTML).toBe('<div><span>hello</span><b>world</b></div>
 const monokai: CNode
 ```
 
-A Monokai-inspired color scheme for use with the [`c`](#c) helper and [`nanolightTs`](#nanolightTs) tokenizer.
+A Monokai-inspired color scheme for use with the [`c`](#c) helper and [`nanolightTs`](#nanolightTs) lexer.
+It styles `pre` and `code>span` elements with the class names produced by [`nanolightTs`](#nanolightTs) (with light, dark and print variants).
+
+#### Usage Examples
+
+```ts
+const style = h('style', c(monokai))
+const pre = h('pre', ['code', ...nanolightTs('const x = 42')])
+
+expect(style.textContent).toContain('code>span.keyword1{color:var(--keyword1)}')
+expect(style.textContent).toContain('@media only screen and (prefers-color-scheme: dark){:root{--bg:#2d2a2e;')
+expect(pre.outerHTML).toBe(
+  '<pre><code>' +
+    '<span class="keyword1">const</span> ' +
+    '<span class="identifier4">x</span> ' +
+    '<span class="operator">=</span> ' +
+    '<span class="number">42</span>' +
+    '</code></pre>'
+)
+```
 
 ### nanolightTs
 
@@ -761,7 +783,7 @@ A Monokai-inspired color scheme for use with the [`c`](#c) helper and [`nanoligh
 const nanolightTs: (code: string) => HArgs1[]
 ```
 
-A TypeScript/JavaScript syntax highlighting tokenizer built using [`createTokenizer`](#createTokenizer).
+A TypeScript/JavaScript syntax highlighting lexer built using [`createLexer`](#createLexer).
 
 #### code
 
@@ -769,7 +791,7 @@ The source code string to tokenize.
 
 #### Returns
 
-An array of [`HArgs1`](#HArgs1) elements suitable for rendering with [`h`](#h).
+An array of [`HArgs1`](#HArgs1) elements suitable for rendering with [`h`](#h): plain `string`s for unrecognized text (e.g. whitespace) and `['span', { class }, chunk]` tuples for recognized tokens (class names are styled by [`monokai`](#monokai)).
 
 #### Usage Examples
 
@@ -800,77 +822,184 @@ expect(nanolightTs(codeJs)).toEqual([
 ```
 
 ```ts
-expect(classes('x = /a\\/b[/]c/gi.test(y) / 2')).toEqual([
-  'identifier4:x',
+const codeJs = 'const x = 42 // answer'
+
+expect(nanolightTs(codeJs)).toEqual([
+  ['span', { class: 'keyword1' }, 'const'],
   ' ',
-  'operator:=',
+  ['span', { class: 'identifier4' }, 'x'],
   ' ',
-  'string:/a\\/b[/]c/gi',
-  'punctuation:.',
-  'identifier2:test',
-  'punctuation:(',
-  'identifier4:y',
-  'punctuation:)',
+  ['span', { class: 'operator' }, '='],
   ' ',
-  'operator:/',
+  ['span', { class: 'number' }, '42'],
   ' ',
-  'number:2',
+  ['span', { class: 'comment' }, '// answer'],
 ])
+```
 
-expect(classes('a / b / c')).toEqual([
-  'identifier4:a',
+```ts
+expect(nanolightTs('x = /a\\/b[/]c/gi.test(y) / 2')).toEqual([
+  ['span', { class: 'identifier4' }, 'x'],
+  ' ',
+  ['span', { class: 'operator' }, '='],
+  ' ',
+  ['span', { class: 'string' }, '/a\\/b[/]c/gi'],
+  ['span', { class: 'punctuation' }, '.'],
+  ['span', { class: 'identifier2' }, 'test'],
+  ['span', { class: 'punctuation' }, '('],
+  ['span', { class: 'identifier4' }, 'y'],
+  ['span', { class: 'punctuation' }, ')'],
+  ' ',
+  ['span', { class: 'operator' }, '/'],
+  ' ',
+  ['span', { class: 'number' }, '2'],
+])
+
+expect(nanolightTs('a / b / c')).toEqual([
+  ['span', { class: 'identifier4' }, 'a'],
+  ' ',
+  ['span', { class: 'operator' }, '/'],
+  ' ',
+  ['span', { class: 'identifier4' }, 'b'],
+  ' ',
+  ['span', { class: 'operator' }, '/'],
+  ' ',
+  ['span', { class: 'identifier4' }, 'c'],
+])
+
+expect(nanolightTs('return / x /')).toEqual([
+  ['span', { class: 'keyword1' }, 'return'],
+  ' ',
+  ['span', { class: 'string' }, '/ x /'],
+])
+```
+
+```ts
+expect(nanolightTs('`a ${b + `c ${ {d}.d }`} \\${e} $f`')).toEqual([
+  ['span', { class: 'string' }, '`a '],
+  ['span', { class: 'punctuation' }, '${'],
+  ['span', { class: 'identifier4' }, 'b'],
+  ' ',
+  ['span', { class: 'operator' }, '+'],
+  ' ',
+  ['span', { class: 'string' }, '`c '],
+  ['span', { class: 'punctuation' }, '${'],
+  ' ',
+  ['span', { class: 'punctuation' }, '{'],
+  ['span', { class: 'identifier4' }, 'd'],
+  ['span', { class: 'punctuation' }, '}'],
+  ['span', { class: 'punctuation' }, '.'],
+  ['span', { class: 'identifier4' }, 'd'],
   ' ',
-  'operator:/',
+  ['span', { class: 'punctuation' }, '}'],
+  ['span', { class: 'string' }, '`'],
+  ['span', { class: 'punctuation' }, '}'],
+  ['span', { class: 'string' }, ' \\${e} $f`'],
+])
+
+expect(nanolightTs('`${x}` / 2')).toEqual([
+  ['span', { class: 'string' }, '`'],
+  ['span', { class: 'punctuation' }, '${'],
+  ['span', { class: 'identifier4' }, 'x'],
+  ['span', { class: 'punctuation' }, '}'],
+  ['span', { class: 'string' }, '`'],
   ' ',
-  'identifier4:b',
+  ['span', { class: 'operator' }, '/'],
   ' ',
-  'operator:/',
+  ['span', { class: 'number' }, '2'],
+])
+```
+
+```ts
+expect(nanolightTs('"a // b" // c')).toEqual([
+  ['span', { class: 'string' }, '"a // b"'],
   ' ',
-  'identifier4:c',
+  ['span', { class: 'comment' }, '// c'],
 ])
 
-expect(classes('return / x /')).toEqual(['keyword1:return', ' ', 'string:/ x /'])
+expect(nanolightTs("'it\\'s' /* x")).toEqual([
+  ['span', { class: 'string' }, "'it\\'s'"],
+  ' ',
+  ['span', { class: 'comment' }, '/* x'],
+])
 ```
 
 ```ts
-expect(classes('`a ${b + `c ${ {d}.d }`} \\${e} $f`')).toEqual([
-  'string:`a ',
-  'punctuation:${',
-  'identifier4:b',
+expect(nanolightTs('0xFF + 1_000n + .5e-3')).toEqual([
+  ['span', { class: 'number' }, '0xFF'],
   ' ',
-  'operator:+',
+  ['span', { class: 'operator' }, '+'],
   ' ',
-  'string:`c ',
-  'punctuation:${',
+  ['span', { class: 'number' }, '1_000n'],
   ' ',
-  'punctuation:{',
-  'identifier4:d',
-  'punctuation:}',
-  'punctuation:.',
-  'identifier4:d',
+  ['span', { class: 'operator' }, '+'],
   ' ',
-  'punctuation:}',
-  'string:`',
-  'punctuation:}',
-  'string: \\${e} $f`',
+  ['span', { class: 'number' }, '.5e-3'],
 ])
+```
 
-expect(classes('`${x}` / 2')).toEqual([
-  'string:`',
-  'punctuation:${',
-  'identifier4:x',
-  'punctuation:}',
-  'string:`',
+```ts
+expect(nanolightTs('a++ / 2 / b')).toEqual([
+  ['span', { class: 'identifier4' }, 'a'],
+  ['span', { class: 'operator' }, '++'],
   ' ',
-  'operator:/',
+  ['span', { class: 'operator' }, '/'],
   ' ',
-  'number:2',
+  ['span', { class: 'number' }, '2'],
+  ' ',
+  ['span', { class: 'operator' }, '/'],
+  ' ',
+  ['span', { class: 'identifier4' }, 'b'],
+])
+
+expect(nanolightTs('x?.5:a?.b')).toEqual([
+  ['span', { class: 'identifier4' }, 'x'],
+  ['span', { class: 'operator' }, '?'],
+  ['span', { class: 'number' }, '.5'],
+  ['span', { class: 'operator' }, ':'],
+  ['span', { class: 'identifier4' }, 'a'],
+  ['span', { class: 'punctuation' }, '?.'],
+  ['span', { class: 'identifier4' }, 'b'],
 ])
 ```
 
 ```ts
-expect(classes('"a // b" // c')).toEqual(['string:"a // b"', ' ', 'comment:// c'])
-expect(classes("'it\\'s' /* x")).toEqual(["string:'it\\'s'", ' ', 'comment:/* x'])
+expect(nanolightTs('p.catch(obj.in, ...this)')).toEqual([
+  ['span', { class: 'identifier4' }, 'p'],
+  ['span', { class: 'punctuation' }, '.'],
+  ['span', { class: 'identifier2' }, 'catch'],
+  ['span', { class: 'punctuation' }, '('],
+  ['span', { class: 'identifier4' }, 'obj'],
+  ['span', { class: 'punctuation' }, '.'],
+  ['span', { class: 'identifier4' }, 'in'],
+  ['span', { class: 'punctuation' }, ','],
+  ' ',
+  ['span', { class: 'operator' }, '...'],
+  ['span', { class: 'keyword1' }, 'this'],
+  ['span', { class: 'punctuation' }, ')'],
+])
+```
+
+```ts
+expect(nanolightTs('#!/usr/bin/env bun\n@sealed class A { #x = 1 }')).toEqual([
+  ['span', { class: 'comment' }, '#!/usr/bin/env bun'],
+  '\n',
+  ['span', { class: 'identifier2' }, '@sealed'],
+  ' ',
+  ['span', { class: 'keyword1' }, 'class'],
+  ' ',
+  ['span', { class: 'identifier1' }, 'A'],
+  ' ',
+  ['span', { class: 'punctuation' }, '{'],
+  ' ',
+  ['span', { class: 'identifier4' }, '#x'],
+  ' ',
+  ['span', { class: 'operator' }, '='],
+  ' ',
+  ['span', { class: 'number' }, '1'],
+  ' ',
+  ['span', { class: 'punctuation' }, '}'],
+])
 ```
 
 ### rwd
@@ -885,7 +1014,8 @@ const rwd: (
 ) => void
 ```
 
-A responsive web design helper that generates CSS rules for a grid-like layout.
+A responsive web design helper that generates CSS rules for a grid-like layout of floating elements.
+It modifies `root` in place: it sets base styles for `selector` and adds a `@media(min-width:…px)` rule for each breakpoint.
 
 #### root
 
@@ -907,7 +1037,7 @@ The base cell height in pixels.
 
 An array of breakpoint specifications, each a tuple of:
 
-- `maxWidth`: maximum number of cells per row (defines the viewport breakpoint).
+- `maxWidth`: number of cells per row; the breakpoint is `min-width: cellWidthPx * maxWidth` (`1` modifies the base rule).
 - `width` (optional, default `1`): number of horizontal cells the element spans.
 - `height` (optional, default `1`): number of vertical cells the element spans.
 
@@ -937,7 +1067,7 @@ expect(style).toEqual({
     '.no-border': {
       border: 'none',
     },
-    boxSizing: 'border-box',
+    'box-sizing': 'border-box',
     display: 'block',
     float: 'left',
     width: '100%',
@@ -962,9 +1092,9 @@ expect(style).toEqual({
 
 ```ts
 const s: {
-  <T extends keyof SVGElementTagNameMap>(tag: T, ...args1: HArgs1[]): SVGElementTagNameMap[T]
-  <N extends Node>(node: N, ...args1: HArgs1[]): N
-  (tagOrNode: string | Node, ...args1: HArgs1[]): Node
+  <T extends keyof SVGElementTagNameMap>(tag: T, ...args: HArgs1[]): SVGElementTagNameMap[T]
+  <N extends Node>(node: N, ...args: HArgs1[]): N
+  (tagOrNode: string | Node, ...args: HArgs1[]): Node
 }
 ```
 
@@ -980,17 +1110,17 @@ If a `Node`, that node is modified in place.
 Additional arguments processed as follows:
 
 - `Object`: maps attributes/properties.
-  Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it.
-  Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
-  A value of `false` removes the attribute.
+  - Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it.
+  - Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
+    A value of `true` sets an empty attribute (e.g. `checked=""`), a value of `false` removes the attribute.
 - `null`/`undefined`: ignored.
 - `Node`: appended as a child.
 - `string`/`number`: converted to a `Text` node and appended.
-- [`HArgs`](#HArgs) array: processed recursively.
+- [`HArgs`](#HArgs) array: processed recursively (creates or modifies a child node and appends it).
 
 #### Returns
 
-The created or modified `SVGElement`.
+The created `SVGElement` or the modified node.
 
 #### Usage Examples
 
@@ -1024,7 +1154,7 @@ expect(svg.getAttributeNS('http://www.w3.org/1999/xlink', 'title')).toBe('42')
 const svgUse: (id: string, ...args: HArgs1[]) => SVGSVGElement
 ```
 
-Shorthand for creating an SVG element with a `<use>` child referencing an icon by ID.
+Shorthand for creating an `<svg>` element with a `<use>` child referencing a symbol (e.g. an icon) by ID.
 
 Equivalent to:
 

package/nnn.d.ts

@@ -9,12 +9,15 @@ export type CNode = {
  *
  * An object describing CSS rules.
  * Keys are selectors or at-rules; values are either CSS property values or nested rule objects.
+ * Nested selectors are appended to the parent selector as is (e.g. `'.c'` inside `a` → `a.c`), so a leading space is needed for a descendant combinator (e.g. `' .c'` → `a .c`).
  * A selector key may contain comma-separated alternatives (e.g. `'.b,.c'`); when nested, each alternative is combined with each parent alternative (cartesian product), producing a comma-joined selector list (e.g. `'a.b,a.c'`).
+ * Top-level at-rules (e.g. `'@media …'`) wrap their nested rules; inside a top-level `:root` rule nested keys are concatenated into property names (e.g. `{ ':root': { '--': { bg: 'red' } } }` → `:root{--bg:red}`).
+ * `null`/`undefined` values are skipped.
  *
  * @param splitter
  *
  * A delimiter used to create unique keys (default: `'$$'`).
- * The substring from `splitter` to the end of a key is ignored (e.g., `src$$1` → `src`).
+ * The substring from `splitter` to the end of a key is ignored (e.g. `src$$1` → `src`).
  *
  * @returns
  *
@@ -22,7 +25,7 @@ export type CNode = {
  */
 export declare const c: (node: CNode, splitter?: string) => string
 /**
- * Options of a {@link createTokenizer} spec controlling the tokenizer state stack.
+ * Options of a {@link createLexer} spec controlling the lexer state stack.
  *
  * @property in
  *
@@ -36,15 +39,15 @@ export declare const c: (node: CNode, splitter?: string) => string
  *
  * State to push onto the stack after a match (applied after `pop`).
  */
-export type TokenizerSpecOptions = {
+export type LexerSpecOptions = {
   in?: string | string[]
   pop?: boolean
   push?: string
 }
-/** A {@link createTokenizer} spec: a `[metadata, pattern, options?]` tuple. */
-export type TokenizerSpec<M> = [metadata: M, pattern: string | RegExp, options?: TokenizerSpecOptions]
+/** A {@link createLexer} spec: a `[metadata, pattern, options?]` tuple. */
+export type LexerSpec<M> = [metadata: M, pattern: string | RegExp, options?: LexerSpecOptions]
 /**
- * A helper for building simple stateful tokenizers (see also {@link nanolightTs}).
+ * A helper for building simple stateful lexers (see also {@link nanolightTs}).
  *
  * @remarks
  *
@@ -57,25 +60,25 @@ export type TokenizerSpec<M> = [metadata: M, pattern: string | RegExp, options?:
  *
  * @param decorator
  *
- * A function that wraps each matched chunk.
- * It receives the matched text (`chunk`) and optionally the `metadata` associated with the pattern that produced the match.
- * For unmatched text between patterns, `metadata` is `undefined`.
+ * A function that wraps each chunk of the input.
+ * It receives the matched text (`chunk`) and the `metadata` of the spec whose pattern produced the match.
+ * For unmatched text between matches, `metadata` is `undefined`.
  *
  * @param specs
  *
  * An array of tuples `[metadata, pattern, options?]` where:
  *
  * - `metadata`: arbitrary data (e.g., a CSS class name) passed to `decorator` when the pattern matches.
- * - `pattern`: a `string` or `RegExp` to match against the input.
- * - `options`: optional {@link TokenizerSpecOptions} (states in which the spec is active and state transitions).
+ * - `pattern`: a `string` (matched literally) or `RegExp` to match against the input.
+ * - `options`: optional {@link LexerSpecOptions} (states in which the spec is active and state transitions).
  *
  * @returns
  *
- * A tokenizer function that accepts a code string and returns an array of decorated tokens.
+ * A lexer function that accepts an input string and returns an array of decorated chunks covering the whole input (in order).
  */
-export declare const createTokenizer: <M, T>(
+export declare const createLexer: <M, T>(
   decorator: (chunk: string, metadata?: M) => T,
-  ...specs: TokenizerSpec<M>[]
+  ...specs: LexerSpec<M>[]
 ) => (code: string) => T[]
 /** Single argument type for the {@link h} and {@link s} helpers. */
 export type HArgs1 = Record<PropertyKey, unknown> | null | undefined | Node | string | number | HArgs
@@ -94,22 +97,22 @@ export type HArgs = [string | Node, ...HArgs1[]]
  * Additional arguments processed as follows:
  *
  * - `Object`: maps attributes/properties.
- *   Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it (useful e.g. for `$style`).
- *   Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
- *   A value of `false` removes the attribute.
+ *   - Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it (useful e.g. for `$style`).
+ *   - Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
+ *     A value of `true` sets an empty attribute (e.g. `checked=""`), a value of `false` removes the attribute.
  * - `null`/`undefined`: ignored.
  * - `Node`: appended as a child.
  * - `string`/`number`: converted to a `Text` node and appended.
- * - {@link HArgs} array: processed recursively.
+ * - {@link HArgs} array: processed recursively (creates or modifies a child node and appends it).
  *
  * @returns
  *
- * The created or modified `HTMLElement`.
+ * The created `HTMLElement` or the modified node.
  */
 export declare const h: {
-  <T extends keyof HTMLElementTagNameMap>(tag: T, ...args1: HArgs1[]): HTMLElementTagNameMap[T]
-  <N extends Node>(node: N, ...args1: HArgs1[]): N
-  (tagOrNode: string | Node, ...args1: HArgs1[]): Node
+  <T extends keyof HTMLElementTagNameMap>(tag: T, ...args: HArgs1[]): HTMLElementTagNameMap[T]
+  <N extends Node>(node: N, ...args: HArgs1[]): N
+  (tagOrNode: string | Node, ...args: HArgs1[]): Node
 }
 /**
  * A lightweight _HyperScript_-style helper for creating and modifying `SVGElement`s (see also {@link h}).
@@ -124,25 +127,25 @@ export declare const h: {
  * Additional arguments processed as follows:
  *
  * - `Object`: maps attributes/properties.
- *   Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it.
- *   Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
- *   A value of `false` removes the attribute.
+ *   - Keys starting with `$` set element properties (without the `$` prefix); if the value is a plain object, it is shallow-merged into the existing property instead of replacing it.
+ *   - Other keys set attributes: a key prefixed with `xlink:` sets the attribute via `setAttributeNS` in the XLink namespace; any other key (without a colon) sets it via `setAttribute`.
+ *     A value of `true` sets an empty attribute (e.g. `checked=""`), a value of `false` removes the attribute.
  * - `null`/`undefined`: ignored.
  * - `Node`: appended as a child.
  * - `string`/`number`: converted to a `Text` node and appended.
- * - {@link HArgs} array: processed recursively.
+ * - {@link HArgs} array: processed recursively (creates or modifies a child node and appends it).
  *
  * @returns
  *
- * The created or modified `SVGElement`.
+ * The created `SVGElement` or the modified node.
  */
 export declare const s: {
-  <T extends keyof SVGElementTagNameMap>(tag: T, ...args1: HArgs1[]): SVGElementTagNameMap[T]
-  <N extends Node>(node: N, ...args1: HArgs1[]): N
-  (tagOrNode: string | Node, ...args1: HArgs1[]): Node
+  <T extends keyof SVGElementTagNameMap>(tag: T, ...args: HArgs1[]): SVGElementTagNameMap[T]
+  <N extends Node>(node: N, ...args: HArgs1[]): N
+  (tagOrNode: string | Node, ...args: HArgs1[]): Node
 }
 /**
- * Shorthand for creating an SVG element with a `<use>` child referencing an icon by ID.
+ * Shorthand for creating an `<svg>` element with a `<use>` child referencing a symbol (e.g. an icon) by ID.
  *
  * Equivalent to:
  *
@@ -164,11 +167,12 @@ export declare const s: {
  */
 export declare const svgUse: (id: string, ...args: HArgs1[]) => SVGSVGElement
 /**
- * A Monokai-inspired color scheme for use with the {@link c} helper and {@link nanolightTs} tokenizer.
+ * A Monokai-inspired color scheme for use with the {@link c} helper and {@link nanolightTs} lexer.
+ * It styles `pre` and `code>span` elements with the class names produced by {@link nanolightTs} (with light, dark and print variants).
  */
 export declare const monokai: CNode
 /**
- * A TypeScript/JavaScript syntax highlighting tokenizer built using {@link createTokenizer}.
+ * A TypeScript/JavaScript syntax highlighting lexer built using {@link createLexer}.
  *
  * @param code
  *
@@ -176,11 +180,12 @@ export declare const monokai: CNode
  *
  * @returns
  *
- * An array of {@link HArgs1} elements suitable for rendering with {@link h}.
+ * An array of {@link HArgs1} elements suitable for rendering with {@link h}: plain `string`s for unrecognized text (e.g. whitespace) and `['span', { class }, chunk]` tuples for recognized tokens (class names are styled by {@link monokai}).
  */
 export declare const nanolightTs: (code: string) => HArgs1[]
 /**
- * A responsive web design helper that generates CSS rules for a grid-like layout.
+ * A responsive web design helper that generates CSS rules for a grid-like layout of floating elements.
+ * It modifies `root` in place: it sets base styles for `selector` and adds a `@media(min-width:…px)` rule for each breakpoint.
  *
  * @param root
  *
@@ -202,7 +207,7 @@ export declare const nanolightTs: (code: string) => HArgs1[]
  *
  * An array of breakpoint specifications, each a tuple of:
  *
- * - `maxWidth`: maximum number of cells per row (defines the viewport breakpoint).
+ * - `maxWidth`: number of cells per row; the breakpoint is `min-width: cellWidthPx * maxWidth` (`1` modifies the base rule).
  * - `width` (optional, default `1`): number of horizontal cells the element spans.
  * - `height` (optional, default `1`): number of vertical cells the element spans.
  */

package/nnn.js

@@ -50,9 +50,9 @@ var _c = (node, splitter = DEFAULT_SPLITTER, prefix = "", flatten = false) => {
   return out.join(flatten ? ";" : "");
 };
 var c = (node, splitter = DEFAULT_SPLITTER) => _c(node, splitter);
-// src/nnn/createTokenizer.ts
+// src/nnn/createLexer.ts
 var ROOT = "root";
-var createTokenizer = (decorator, ...specs) => {
+var createLexer = (decorator, ...specs) => {
   const compiled = specs.map(([metadata, pattern, options]) => ({
     metadata,
     pattern: pattern instanceof RegExp ? new RegExp(pattern.source, pattern.sticky ? pattern.flags : pattern.flags.replace("g", "") + "g") : pattern,
@@ -283,14 +283,14 @@ var PUNCTUATION = "punctuation";
 var STRING = "string";
 var ROOT2 = "root";
 var TEMPLATE = "template";
-var nanolightTs = /* @__PURE__ */ createTokenizer((chunk, name) => name != null ? ["span", { class: name }, chunk] : chunk, [COMMENT, /\/\*[\s\S]*?(?:\*\/|$)/], [COMMENT, /\/\/.*/], [STRING, /"(?:[^"\\\n]|\\[\s\S])*"?/], [STRING, /'(?:[^'\\\n]|\\[\s\S])*'?/], [STRING, /`(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?:`|$)/], [STRING, /`(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?=\$\{)/, { push: TEMPLATE }], [STRING, /(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?:`|$)/y, { in: TEMPLATE, pop: true }], [STRING, /(?:[^`\\$]|\\[\s\S]|\$(?!\{))+(?=\$\{)/y, { in: TEMPLATE }], [PUNCTUATION, "${", { in: TEMPLATE, push: ROOT2 }], [
+var nanolightTs = /* @__PURE__ */ createLexer((chunk, name) => name != null ? ["span", { class: name }, chunk] : chunk, [COMMENT, /^#!.*/], [COMMENT, /\/\*[\s\S]*?(?:\*\/|$)/], [COMMENT, /\/\/.*/], [STRING, /"(?:[^"\\\n]|\\[\s\S])*"?/], [STRING, /'(?:[^'\\\n]|\\[\s\S])*'?/], [STRING, /`(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?:`|$)/], [STRING, /`(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?=\$\{)/, { push: TEMPLATE }], [STRING, /(?:[^`\\$]|\\[\s\S]|\$(?!\{))*(?:`|$)/y, { in: TEMPLATE, pop: true }], [STRING, /(?:[^`\\$]|\\[\s\S]|\$(?!\{))+(?=\$\{)/y, { in: TEMPLATE }], [PUNCTUATION, "${", { in: TEMPLATE, push: ROOT2 }], [
   STRING,
-  /(?<=(?:^|[!%&(*+,\-:;<=>?[^{|}~]|\b(?:await|case|delete|do|else|in|instanceof|new|of|return|throw|typeof|void|yield))\s*)\/(?![*/])(?:[^\\/[\n]|\\.|\[(?:[^\\\]\n]|\\.)*\]?)+\/[dgimsuvy]*/
-], [NUMBER, /0b[01_]+/], [NUMBER, /0o[01234567_]+/], [NUMBER, /0x[\dabcdef_]+/], [NUMBER, /\d[\d_]*(\.[\d_]+)?(e[+-]?[\d_]+)?/], [OPERATOR, "!"], [OPERATOR, "!="], [OPERATOR, "!=="], [OPERATOR, "%"], [OPERATOR, "%="], [OPERATOR, "&&"], [OPERATOR, "&&="], [OPERATOR, "&"], [OPERATOR, "&="], [OPERATOR, "*"], [OPERATOR, "**"], [OPERATOR, "**="], [OPERATOR, "*="], [OPERATOR, "+"], [OPERATOR, "++"], [OPERATOR, "+="], [OPERATOR, "-"], [OPERATOR, "--"], [OPERATOR, "-="], [OPERATOR, "..."], [OPERATOR, "/"], [OPERATOR, "/="], [OPERATOR, ":"], [OPERATOR, "<"], [OPERATOR, "<<"], [OPERATOR, "<<="], [OPERATOR, "<="], [OPERATOR, "="], [OPERATOR, "=="], [OPERATOR, "==="], [OPERATOR, "=>"], [OPERATOR, ">"], [OPERATOR, ">="], [OPERATOR, ">>"], [OPERATOR, ">>="], [OPERATOR, ">>>"], [OPERATOR, ">>>="], [OPERATOR, "?"], [OPERATOR, "??"], [OPERATOR, "??="], [OPERATOR, "^"], [OPERATOR, "^="], [OPERATOR, "|"], [OPERATOR, "|="], [OPERATOR, "||"], [OPERATOR, "||="], [OPERATOR, "~"], [OPERATOR, "~="], [OPERATOR, /(?<=\s):/], [PUNCTUATION, "("], [PUNCTUATION, ")"], [PUNCTUATION, ","], [PUNCTUATION, "."], [PUNCTUATION, ":"], [PUNCTUATION, ";"], [PUNCTUATION, "?."], [PUNCTUATION, "["], [PUNCTUATION, "]"], [PUNCTUATION, "{", { push: ROOT2 }], [PUNCTUATION, "}", { pop: true }], [KEYWORD1, "as"], [KEYWORD1, "async"], [KEYWORD1, "await"], [KEYWORD1, "break"], [KEYWORD1, "case"], [KEYWORD1, "catch"], [KEYWORD1, "class"], [KEYWORD1, "const"], [KEYWORD1, "continue"], [KEYWORD1, "debugger"], [KEYWORD1, "default"], [KEYWORD1, "delete"], [KEYWORD1, "do"], [KEYWORD1, "else"], [KEYWORD1, "export"], [KEYWORD1, "extends"], [KEYWORD1, "finally"], [KEYWORD1, "for"], [KEYWORD1, "from"], [KEYWORD1, "function"], [KEYWORD1, "function*"], [KEYWORD1, "goto"], [KEYWORD1, "if"], [KEYWORD1, "import"], [KEYWORD1, "in"], [KEYWORD1, "instanceof"], [KEYWORD1, "is"], [KEYWORD1, "keyof"], [KEYWORD1, "let"], [KEYWORD1, "new"], [KEYWORD1, "of"], [KEYWORD1, "package"], [KEYWORD1, "return"], [KEYWORD1, "super"], [KEYWORD1, "switch"], [KEYWORD1, "this"], [KEYWORD1, "throw"], [KEYWORD1, "try"], [KEYWORD1, "type"], [KEYWORD1, "typeof"], [KEYWORD1, "var"], [KEYWORD1, "void"], [KEYWORD1, "while"], [KEYWORD1, "with"], [KEYWORD1, "yield"], [KEYWORD1, "yield*"], [KEYWORD2, "false"], [KEYWORD2, "Infinity"], [KEYWORD2, "NaN"], [KEYWORD2, "null"], [KEYWORD2, "true"], [KEYWORD2, "undefined"], [KEYWORD3, "any"], [KEYWORD3, "bigint"], [KEYWORD3, "boolean"], [KEYWORD3, "eval"], [KEYWORD3, "number"], [KEYWORD3, "string"], [KEYWORD3, "symbol"], [KEYWORD3, "unknown"], [IDENTIFIER1, /[\p{Lu}_$][\p{Lu}\d_$]*/u], [IDENTIFIER2, /[\p{L}_$][\p{L}\d_$]*(?=[(`])/u], [IDENTIFIER3, /\p{Lu}[\p{L}\d_$]*/u], [IDENTIFIER4, /[\p{L}_$][\p{L}\d_$]*/u]);
+  /(?<=(?:^|[!%&(*,:;<=>?[^{|}~]|(?<!\+)\+|(?<!-)-|(?<!\.)\b(?:await|case|delete|do|else|in|instanceof|new|of|return|throw|typeof|void|yield))\s*)\/(?![*/])(?:[^\\/[\n]|\\.|\[(?:[^\\\]\n]|\\.)*\]?)+\/[dgimsuvy]*/
+], [NUMBER, /0b[01_]+n?/i], [NUMBER, /0o[0-7_]+n?/i], [NUMBER, /0x[\da-f_]+n?/i], [NUMBER, /(?:\d[\d_]*(?:\.[\d_]+)?|\.\d[\d_]*)(?:e[+-]?\d[\d_]*)?n?/i], [OPERATOR, "!"], [OPERATOR, "!="], [OPERATOR, "!=="], [OPERATOR, "%"], [OPERATOR, "%="], [OPERATOR, "&&"], [OPERATOR, "&&="], [OPERATOR, "&"], [OPERATOR, "&="], [OPERATOR, "*"], [OPERATOR, "**"], [OPERATOR, "**="], [OPERATOR, "*="], [OPERATOR, "+"], [OPERATOR, "++"], [OPERATOR, "+="], [OPERATOR, "-"], [OPERATOR, "--"], [OPERATOR, "-="], [OPERATOR, "..."], [OPERATOR, "/"], [OPERATOR, "/="], [OPERATOR, ":"], [OPERATOR, "<"], [OPERATOR, "<<"], [OPERATOR, "<<="], [OPERATOR, "<="], [OPERATOR, "="], [OPERATOR, "=="], [OPERATOR, "==="], [OPERATOR, "=>"], [OPERATOR, ">"], [OPERATOR, ">="], [OPERATOR, ">>"], [OPERATOR, ">>="], [OPERATOR, ">>>"], [OPERATOR, ">>>="], [OPERATOR, "?"], [OPERATOR, "??"], [OPERATOR, "??="], [OPERATOR, "^"], [OPERATOR, "^="], [OPERATOR, "|"], [OPERATOR, "|="], [OPERATOR, "||"], [OPERATOR, "||="], [OPERATOR, "~"], [OPERATOR, "~="], [OPERATOR, /(?<=\s):/], [PUNCTUATION, "("], [PUNCTUATION, ")"], [PUNCTUATION, ","], [PUNCTUATION, "."], [PUNCTUATION, ":"], [PUNCTUATION, ";"], [PUNCTUATION, /\?\.(?!\d)/], [PUNCTUATION, "["], [PUNCTUATION, "]"], [PUNCTUATION, "{", { push: ROOT2 }], [PUNCTUATION, "}", { pop: true }], [IDENTIFIER2, /(?<=(?<!\.)\.)\p{Ll}[\p{L}\d_$]*(?=[(`])/u], [IDENTIFIER4, /(?<=(?<!\.)\.)\p{Ll}[\p{L}\d_$]*/u], [KEYWORD1, "as"], [KEYWORD1, "async"], [KEYWORD1, "await"], [KEYWORD1, "break"], [KEYWORD1, "case"], [KEYWORD1, "catch"], [KEYWORD1, "class"], [KEYWORD1, "const"], [KEYWORD1, "continue"], [KEYWORD1, "debugger"], [KEYWORD1, "default"], [KEYWORD1, "delete"], [KEYWORD1, "do"], [KEYWORD1, "else"], [KEYWORD1, "export"], [KEYWORD1, "extends"], [KEYWORD1, "finally"], [KEYWORD1, "for"], [KEYWORD1, "from"], [KEYWORD1, "function"], [KEYWORD1, "function*"], [KEYWORD1, "goto"], [KEYWORD1, "if"], [KEYWORD1, "import"], [KEYWORD1, "in"], [KEYWORD1, "instanceof"], [KEYWORD1, "is"], [KEYWORD1, "keyof"], [KEYWORD1, "let"], [KEYWORD1, "new"], [KEYWORD1, "of"], [KEYWORD1, "package"], [KEYWORD1, "return"], [KEYWORD1, "super"], [KEYWORD1, "switch"], [KEYWORD1, "this"], [KEYWORD1, "throw"], [KEYWORD1, "try"], [KEYWORD1, "type"], [KEYWORD1, "typeof"], [KEYWORD1, "var"], [KEYWORD1, "void"], [KEYWORD1, "while"], [KEYWORD1, "with"], [KEYWORD1, "yield"], [KEYWORD1, "yield*"], [KEYWORD2, "false"], [KEYWORD2, "Infinity"], [KEYWORD2, "NaN"], [KEYWORD2, "null"], [KEYWORD2, "true"], [KEYWORD2, "undefined"], [KEYWORD3, "any"], [KEYWORD3, "bigint"], [KEYWORD3, "boolean"], [KEYWORD3, "eval"], [KEYWORD3, "number"], [KEYWORD3, "string"], [KEYWORD3, "symbol"], [KEYWORD3, "unknown"], [IDENTIFIER2, /@[\p{L}_$][\p{L}\d_$]*/u], [IDENTIFIER1, /#?[\p{Lu}_$][\p{Lu}\d_$]*/u], [IDENTIFIER2, /#?[\p{L}_$][\p{L}\d_$]*(?=[(`])/u], [IDENTIFIER3, /#?\p{Lu}[\p{L}\d_$]*/u], [IDENTIFIER4, /#?[\p{L}_$][\p{L}\d_$]*/u]);
 // src/nnn/rwd.ts
 var rwd = (root, selector, cellWidthPx, cellHeightPx, ...specs) => {
   const main = root[selector] ??= {};
-  main.boxSizing = "border-box";
+  main["box-sizing"] = "border-box";
   main.display = "block";
   main.float = "left";
   main.width = "100%";
@@ -313,7 +313,7 @@ var rwd = (root, selector, cellWidthPx, cellHeightPx, ...specs) => {
 };
 export {
   c,
-  createTokenizer,
+  createLexer,
   h,
   monokai,
   nanolightTs,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jackens/nnn",
-  "version": "2026.9.28",
+  "version": "2026.9.29",
   "description": "Jackens’ JavaScript helpers.",
   "keywords": [
     "CSS-in-JS",
@@ -11,10 +11,10 @@
     "Responsive Web Design",
     "SVG",
     "highlight",
+    "lexer",
     "nanolight",
     "nnn",
-    "tokenize",
-    "tokenizer"
+    "tokenize"
   ],
   "license": "MIT",
   "author": "Jackens",