@vvedantb/native-ui 0.17.2 → 0.18.0

package/dist/floating.js

@@ -0,0 +1,62 @@
+import { Platform } from "react-native";
+import { tokens } from "./tokens";
+export const FLOATING_INSET = tokens.spacing.unit;
+export const FLOATING_TAB_BAR_HEIGHT = 64;
+export const FLOATING_TAB_BAR_HEIGHT_LARGE = 72;
+export const FLOATING_RADIUS = tokens.radius.card;
+/**
+ * List rows: 20, the field radius before 0.3.3 (web fields are 10). Toasts
+ * used it until 0.3.12 and the upgrade card until 0.3.8; both are 16 now.
+ */
+export const FLOATING_ROW_RADIUS = 20;
+export const FLOATING_PILL_RADIUS = tokens.radius.pill;
+const FLOATING_BOX_SHADOW = "0px 8px 24px rgba(10, 10, 10, 0.12)";
+
+/**
+ * Only the shadow keys, not `ViewStyle`: an Expo-widened `ViewStyle`
+ * (`position: "fixed"`, `backgroundImage`) is not assignable to a React
+ * Native 0.88 View `style`. A plain inferred type would be `{}` and lose
+ * `floatingShadow.shadowColor` and the rest for callers.
+ */
+
+export const floatingShadow = Platform.select({
+  ios: {
+    shadowColor: "#0a0a0a",
+    shadowOffset: {
+      width: 0,
+      height: 8
+    },
+    shadowOpacity: 0.12,
+    shadowRadius: 20
+  },
+  default: {
+    boxShadow: FLOATING_BOX_SHADOW
+  }
+}) ?? {};
+export const floatingHairline = tokens.color.hairline;
+export const floatingFill = tokens.color.fill;
+
+/** The `tokens.color.surface` pair itself, so `configureTheme` reaches it. */
+export const floatingSolidFill = tokens.color.surface;
+
+/**
+ * Where `FloatingTabBar` sits: `FLOATING_INSET` in from the screen sides (and,
+ * in landscape, the notch) and above the home indicator. `BulkActionBar` with
+ * `placement="tabBar"` takes the same slot while the tab bar hides.
+ */
+export function tabBarSlotStyle(insets) {
+  return {
+    position: "absolute",
+    left: insets.left + FLOATING_INSET,
+    right: insets.right + FLOATING_INSET,
+    bottom: FLOATING_INSET + Math.max(insets.bottom, 8)
+  };
+}
+
+/** The height of `FloatingTabBar`, and of `BulkActionBar` in its slot. */
+export function tabBarHeight(largerText) {
+  return largerText ? FLOATING_TAB_BAR_HEIGHT_LARGE : FLOATING_TAB_BAR_HEIGHT;
+}
+export function tabBarReserve(largerText, bottomInset) {
+  return tabBarHeight(largerText) + FLOATING_INSET + Math.max(bottomInset, 8) + 28;
+}

package/dist/glassBlur.jsx

@@ -0,0 +1,145 @@
+import { c as _c } from "react/compiler-runtime";
+import { createContext, useContext, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
+import { StyleSheet, View } from "react-native";
+import { loadBlur } from "./blur";
+
+/**
+ * The current blur target, outside React state. A target change (each tab
+ * switch hands it from one tab to the next) then re-renders only the glass
+ * that subscribes, not the whole tab tree under the provider: as a context
+ * value it walked every mounted tab twice per switch.
+ */
+
+function createBlurTargetStore() {
+  let current = null;
+  const listeners = new Set();
+  return {
+    get: () => current,
+    set: next => {
+      if (next === current) return;
+      current = next;
+      for (const listener of listeners) listener();
+    },
+    subscribe: listener => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+
+// `null` outside a provider and inside a target (a blur view must not sit
+// inside its own target). The value is the provider's one store, so it never
+// changes.
+const BlurTargetStoreContext = createContext(null);
+const noSubscribe = () => () => {};
+const noTarget = () => null;
+
+/**
+ * The mounted `GlassBlurTarget` that floating glass blurs on Android, or
+ * `null` outside a `GlassBlurProvider` and inside the target itself.
+ */
+export function useGlassBlurTarget() {
+  const store = useContext(BlurTargetStoreContext);
+  return useSyncExternalStore(store?.subscribe ?? noSubscribe, store?.get ?? noTarget, noTarget);
+}
+export function GlassBlurProvider(t0) {
+  const $ = _c(3);
+  const {
+    children
+  } = t0;
+  const [store] = useState(createBlurTargetStore);
+  let t1;
+  if ($[0] !== children || $[1] !== store) {
+    t1 = <BlurTargetStoreContext.Provider value={store}>{children}</BlurTargetStoreContext.Provider>;
+    $[0] = children;
+    $[1] = store;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+}
+/**
+ * Content that floating glass blurs on Android (an expo-blur
+ * `BlurTargetView`). Render the floating chrome outside it, inside the same
+ * `GlassBlurProvider`: a blur view must not sit inside its own target, so
+ * surfaces in here get no target. The last active target wins.
+ */
+export function GlassBlurTarget(t0) {
+  const $ = _c(15);
+  let children;
+  let props;
+  let style;
+  let t1;
+  if ($[0] !== t0) {
+    ({
+      active: t1,
+      style,
+      children,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = props;
+    $[3] = style;
+    $[4] = t1;
+  } else {
+    children = $[1];
+    props = $[2];
+    style = $[3];
+    t1 = $[4];
+  }
+  const active = t1 === undefined ? true : t1;
+  const store = useContext(BlurTargetStoreContext);
+  const ref = useRef(null);
+  const BlurTargetView = loadBlur()?.BlurTargetView;
+  let t2;
+  let t3;
+  if ($[5] !== active || $[6] !== store) {
+    t2 = () => {
+      if (!store || !active) {
+        return;
+      }
+      store.set(ref);
+      return () => {
+        if (store.get() === ref) {
+          store.set(null);
+        }
+      };
+    };
+    t3 = [store, active];
+    $[5] = active;
+    $[6] = store;
+    $[7] = t2;
+    $[8] = t3;
+  } else {
+    t2 = $[7];
+    t3 = $[8];
+  }
+  useLayoutEffect(t2, t3);
+  let t4;
+  if ($[9] !== children) {
+    t4 = <BlurTargetStoreContext.Provider value={null}>{children}</BlurTargetStoreContext.Provider>;
+    $[9] = children;
+    $[10] = t4;
+  } else {
+    t4 = $[10];
+  }
+  const content = t4;
+  let t5;
+  if ($[11] !== content || $[12] !== props || $[13] !== style) {
+    t5 = BlurTargetView ? <BlurTargetView ref={ref} style={[styles.fill, style]} {...props}>{content}</BlurTargetView> : <View ref={ref} style={[styles.fill, style]} {...props}>{content}</View>;
+    $[11] = content;
+    $[12] = props;
+    $[13] = style;
+    $[14] = t5;
+  } else {
+    t5 = $[14];
+  }
+  return t5;
+}
+const styles = StyleSheet.create({
+  fill: {
+    flex: 1
+  }
+});

package/dist/gradient.js

@@ -0,0 +1,17 @@
+let expoLinearGradient;
+
+/**
+ * `expo-linear-gradient`, or `null` when the optional peer is not installed.
+ * Metro bundles a `require` placed directly in a `try` block as an optional
+ * dependency, so a missing peer does not break the bundle.
+ */
+export function loadLinearGradient() {
+  if (expoLinearGradient === undefined) {
+    try {
+      expoLinearGradient = require("expo-linear-gradient");
+    } catch {
+      expoLinearGradient = null;
+    }
+  }
+  return expoLinearGradient;
+}

package/dist/haptics.js

@@ -0,0 +1,44 @@
+import { Platform } from "react-native";
+let expoHaptics;
+
+/**
+ * `expo-haptics`, or `null` when the optional peer is not installed. Metro
+ * bundles a `require` placed directly in a `try` block as an optional
+ * dependency, so a missing peer does not break the bundle.
+ */
+export function loadHaptics() {
+  if (expoHaptics === undefined) {
+    try {
+      expoHaptics = require("expo-haptics");
+    } catch {
+      expoHaptics = null;
+    }
+  }
+  return expoHaptics;
+}
+function native() {
+  return Platform.OS === "web" ? null : loadHaptics();
+}
+
+/** A value ticks past a step: a tab, a segment, a checkbox. */
+export function selectionHaptic() {
+  void native()?.selectionAsync();
+}
+
+/**
+ * A physical moment: `"light"` when something snaps home (a dragged sheet
+ * springing back), `"medium"` when a destructive action fires. Fire it in the
+ * same frame as the visual, once per user action.
+ */
+export function impactHaptic(weight) {
+  const haptics = native();
+  if (!haptics) return;
+  void haptics.impactAsync(weight === "light" ? haptics.ImpactFeedbackStyle.Light : haptics.ImpactFeedbackStyle.Medium);
+}
+
+/** An operation the user started succeeded or failed (the success and error toasts). */
+export function notificationHaptic(outcome) {
+  const haptics = native();
+  if (!haptics) return;
+  void haptics.notificationAsync(outcome === "success" ? haptics.NotificationFeedbackType.Success : haptics.NotificationFeedbackType.Error);
+}

package/dist/highlight.js

@@ -0,0 +1,382 @@
+let prismReactRenderer;
+
+/**
+ * `prism-react-renderer`, or `null` when the optional peer is not installed.
+ * `CodeBlock` highlights with it. Metro bundles a `require` placed directly in
+ * a `try` block as an optional dependency, so a missing peer does not break
+ * the bundle.
+ */
+export function loadPrismReactRenderer() {
+  if (prismReactRenderer === undefined) {
+    try {
+      prismReactRenderer = require("prism-react-renderer");
+    } catch {
+      prismReactRenderer = null;
+    }
+  }
+  // `?? null`: with the real peer types installed, TypeScript keeps `undefined`
+  // in the type after the `try` (the package typecheck only sees a stub).
+  return prismReactRenderer ?? null;
+}
+/**
+ * The shiki `github-light` and `github-dark` colours the web `CodeBlock`
+ * uses, by role. Plain text is the theme foreground.
+ */
+export const GITHUB_CODE_COLORS = {
+  light: {
+    plain: "#24292e",
+    comment: "#6a737d",
+    keyword: "#d73a49",
+    string: "#032f62",
+    constant: "#005cc5",
+    function: "#6f42c1",
+    tag: "#22863a",
+    variable: "#e36209",
+    inserted: "#22863a",
+    deleted: "#b31d28"
+  },
+  dark: {
+    plain: "#e1e4e8",
+    comment: "#6a737d",
+    keyword: "#f97583",
+    string: "#9ecbff",
+    constant: "#79b8ff",
+    function: "#b392f0",
+    tag: "#85e89d",
+    variable: "#ffab70",
+    inserted: "#85e89d",
+    deleted: "#fdaeb7"
+  }
+};
+
+/** Prism token types to their GitHub role. Types not listed are plain. */
+const PRISM_ROLE = {
+  comment: "comment",
+  prolog: "comment",
+  doctype: "comment",
+  cdata: "comment",
+  keyword: "keyword",
+  operator: "keyword",
+  atrule: "keyword",
+  important: "keyword",
+  rule: "keyword",
+  string: "string",
+  char: "string",
+  "attr-value": "string",
+  regex: "string",
+  url: "string",
+  "template-string": "string",
+  number: "constant",
+  boolean: "constant",
+  constant: "constant",
+  property: "constant",
+  "attr-name": "constant",
+  symbol: "constant",
+  builtin: "constant",
+  entity: "constant",
+  function: "function",
+  "function-variable": "function",
+  "class-name": "function",
+  maybe_class_name: "function",
+  tag: "tag",
+  selector: "tag",
+  variable: "variable",
+  parameter: "variable",
+  inserted: "inserted",
+  deleted: "deleted",
+  punctuation: "plain",
+  plain: "plain"
+};
+
+/**
+ * The colour of a Prism token from its types. Later types win, as in
+ * `prism-react-renderer`'s theme lookup: the `<` of a tag (`["tag",
+ * "punctuation"]`) is plain.
+ */
+export function codeTokenColor(types, scheme) {
+  return GITHUB_CODE_COLORS[scheme][prismRole(types)];
+}
+function prismRole(types) {
+  let role = "plain";
+  for (const type of types) role = PRISM_ROLE[type] ?? role;
+  return role;
+}
+
+/** One coloured run of code. */
+
+/** A Prism token as `prism-react-renderer` hands it over: its types, outermost first. */
+
+/** Languages `scriptTokens` refines: the JavaScript family, as Shiki's grammars. */
+export const SCRIPT_LANGUAGES = new Set(["js", "jsx", "javascript", "mjs", "cjs", "ts", "tsx", "typescript", "mts", "cts"]);
+
+/** Languages `shellTokens` colours. `prism-react-renderer` bundles no shell grammar. */
+export const SHELL_LANGUAGES = new Set(["bash", "sh", "shell", "zsh", "shellscript", "console"]);
+
+/** Keywords Shiki colours as constants (`constant.language`, `variable.language`, a `void` type). */
+const SCRIPT_CONSTANT_KEYWORDS = new Set(["null", "undefined", "this", "super", "void"]);
+const IDENTIFIER = /^[A-Za-z_$][\w$]*$/;
+
+/** A token's role before context: what Prism's types say, with the Shiki differences that need no context. */
+function scriptBaseRole({
+  types,
+  content
+}) {
+  // Inside `${…}` Shiki keeps the punctuation in the string colour and the code in its own.
+  const interpolation = types.lastIndexOf("interpolation");
+  if (interpolation >= 0) {
+    const inner = types.slice(interpolation + 1);
+    return inner.includes("punctuation") || inner.includes("interpolation-punctuation") ? "string" : prismRole(inner);
+  }
+  // A regex character class, brackets and escapes too.
+  if (types.includes("char-class")) return "constant";
+  const role = prismRole(types);
+  if (role === "keyword" && SCRIPT_CONSTANT_KEYWORDS.has(content)) return "constant";
+  if (types.includes("builtin") && content === "console") return "plain";
+  if (types.includes("function") && content === "constructor") return "keyword";
+  return role;
+}
+/** Splits a token so escapes in strings and each word of plain text get a role of their own. */
+function splitPiece(piece) {
+  const parts = piece.role === "string" && !piece.types.includes("regex") ? piece.content.split(/(\\.)/) : piece.role === "plain" ? piece.content.split(/([A-Za-z_$][\w$]*)/) : [piece.content];
+  return parts.filter(part => part !== "").map(part => ({
+    ...piece,
+    content: part,
+    role: piece.role === "string" && /^\\./.test(part) ? "constant" : piece.role
+  }));
+}
+const isWord = (piece, word) => piece?.content === word;
+
+/**
+ * Prism tokens for the JavaScript family, recoloured where Prism and the
+ * web's Shiki grammars disagree, so the phone draws the web colours:
+ * `null`, `undefined` and `this` as constants; escapes in strings; a regex
+ * character class; `${…}` punctuation in the string colour; a `const` name
+ * as a constant; parameters in the variable colour; type and class names
+ * (a capitalised word not followed by `.`) as functions; ALL_CAPS words as
+ * constants. Returns lines of runs, adjacent runs of one role merged.
+ */
+export function scriptTokens(lines) {
+  const pieces = lines.flatMap((tokens, line) => tokens.filter(token => !token.empty && token.content !== "").flatMap(token => splitPiece({
+    content: token.content,
+    types: token.types,
+    role: scriptBaseRole(token),
+    line
+  })));
+  // Indices of the pieces that are not whitespace.
+  const sig = pieces.flatMap((piece, index) => piece.content.trim() === "" ? [] : [index]);
+  const at = position => {
+    const index = sig[position];
+    return index === undefined ? undefined : pieces[index];
+  };
+  const isIdentifier = piece => piece !== undefined && piece.role === "plain" && IDENTIFIER.test(piece.content);
+  const closing = open => {
+    let depth = 0;
+    for (let position = open; position < sig.length; position += 1) {
+      const content = at(position)?.content;
+      if (content === "(") depth += 1;else if (content === ")") {
+        depth -= 1;
+        if (depth === 0) return position;
+      }
+    }
+    return undefined;
+  };
+  // An arrow function's parameters, or a declared function's or method's.
+  const isParameterList = (open, close) => {
+    const before = at(open - 1);
+    if (isWord(before, "function") || isWord(before, "constructor")) return true;
+    if (before?.role === "function" && isWord(at(open - 2), "function")) return true;
+    let depth = 0;
+    for (let position = close + 1; position < Math.min(sig.length, close + 40); position += 1) {
+      const content = at(position)?.content;
+      if (position === close + 1 && content !== ":") return content === "=>" || content === "{" && before?.role === "function";
+      if (content === "(" || content === "<" || content === "[") depth += 1;else if (content === ")" || content === ">" || content === "]") depth -= 1;else if (depth === 0 && content === "=>") return true;else if (depth === 0 && content === "{") return before?.role === "function";else if (depth === 0 && (content === ";" || content === "=")) return false;
+    }
+    return false;
+  };
+  for (let position = 0; position < sig.length; position += 1) {
+    if (!isWord(at(position), "(")) continue;
+    const close = closing(position);
+    if (close === undefined || !isParameterList(position, close)) continue;
+    let depth = 0;
+    let expectName = true;
+    for (let inner = position + 1; inner < close; inner += 1) {
+      const piece = at(inner);
+      const content = piece?.content;
+      if (content === "(" || content === "[" || content === "{" || content === "<") depth += 1;else if (content === ")" || content === "]" || content === "}" || content === ">") depth -= 1;else if (depth === 0 && content === ",") expectName = true;else if (depth === 0 && (content === ":" || content === "=" || content === "?")) expectName = false;else if (depth === 0 && expectName && isIdentifier(piece)) {
+        piece.role = "variable";
+        expectName = false;
+      }
+    }
+  }
+  let inImport = false;
+  let constPattern = 0;
+  // `Map<string, number>`: Shiki draws type-argument brackets plain, Prism as operators.
+  let generic = 0;
+  for (let position = 0; position < sig.length; position += 1) {
+    const piece = at(position);
+    if (!piece) continue;
+    const previous = at(position - 1);
+    if (piece.role === "keyword" && piece.content === "import") inImport = true;
+    if (piece.role === "keyword" && piece.content === "from") inImport = false;
+    // `const { a, b } = …`: every name in the pattern.
+    if (isWord(previous, "const") && (piece.content === "{" || piece.content === "[")) constPattern = 1;else if (constPattern > 0 && (piece.content === "{" || piece.content === "[")) constPattern += 1;else if (constPattern > 0 && (piece.content === "}" || piece.content === "]")) constPattern -= 1;
+    if (piece.role === "keyword" && piece.content === "<" && pieces[(sig[position] ?? 0) - 1]?.role === "function") {
+      piece.role = "plain";
+      generic += 1;
+    } else if (generic > 0 && piece.role === "keyword" && piece.content === ">") {
+      piece.role = "plain";
+      generic -= 1;
+    }
+    if (!isIdentifier(piece) || inImport) continue;
+    const next = at(position + 1);
+    if (previous?.role === "keyword" && previous.content === "const" || constPattern > 0) piece.role = "constant";else if (isWord(next, "=>")) piece.role = "variable";else if (/^[A-Z][A-Z0-9_]+$/.test(piece.content)) piece.role = "constant";else if (/^[A-Z]/.test(piece.content) && /[a-z]/.test(piece.content) && !isWord(next, ".")) piece.role = "function";
+  }
+  return mergeLines(pieces, lines.length);
+}
+function mergeLines(pieces, count) {
+  const out = Array.from({
+    length: count
+  }, () => []);
+  for (const {
+    content,
+    role,
+    line
+  } of pieces) {
+    const runs = out[line];
+    if (!runs) continue;
+    const last = runs.at(-1);
+    if (last && last.role === role) last.content += content;else runs.push({
+      content,
+      role
+    });
+  }
+  return out;
+}
+
+/** Shell words Shiki colours as keywords. */
+const SHELL_KEYWORDS = new Set(["if", "then", "else", "elif", "fi", "for", "while", "until", "do", "done", "case", "esac", "in", "function", "select", "break", "continue", "return", "export", "local", "readonly", "declare"]);
+
+/** After these a new command starts. */
+const SHELL_COMMAND_KEYWORDS = new Set(["then", "else", "do", "if", "while", "until", "elif"]);
+
+/** Shell builtins Shiki colours as constants (`support.function.builtin`). */
+const SHELL_BUILTINS = new Set(["echo", "cd", "printf", "source", "set", "unset", "exit", "pwd", "read", "eval", "exec", "shift", "trap", "wait", "type", "alias", "unalias", "true", "false", "test", "ulimit", "umask", "kill"]);
+
+/**
+ * Shell code in the roles of the web's Shiki `bash` grammar, for `bash`, `sh`,
+ * `shell` and `zsh` blocks: a command name as a function, its arguments as
+ * strings, `-x` and `--flag` options and numbers as constants, builtins
+ * (`echo`, `cd`) as constants, keywords, `|`, `||` and redirects as
+ * keywords, `$VAR` plain (also inside a double-quoted string), comments.
+ * `prism-react-renderer` bundles no shell grammar, so this needs no peer.
+ */
+export function shellTokens(code) {
+  return code.split("\n").map(source => {
+    const runs = [];
+    const push = (content, role) => {
+      if (content === "") return;
+      const last = runs.at(-1);
+      if (last && last.role === role) last.content += content;else runs.push({
+        content,
+        role
+      });
+    };
+    let index = 0;
+    let command = true;
+    // `for NAME in`: the name is plain, then `in` is a keyword.
+    let forState = "none";
+    // Inside `[ … ]` Shiki draws test operators (`-f`) as keywords and words plain.
+    let inTest = false;
+    while (index < source.length) {
+      const rest = source.slice(index);
+      const space = /^\s+/.exec(rest);
+      if (space) {
+        push(space[0], "plain");
+        index += space[0].length;
+        continue;
+      }
+      if (rest.startsWith("#")) {
+        push(rest, "comment");
+        break;
+      }
+      if (rest.startsWith('"')) {
+        // Double quotes: the string colour, with `$VAR` and `${VAR}` names plain.
+        const end = rest.slice(1).search(/(?<!\\)"/);
+        const text = end < 0 ? rest : rest.slice(0, end + 2);
+        for (const part of text.split(/(\$\{[^}]*\}|\$[A-Za-z_]\w*)/)) {
+          const braced = /^\$\{([^}]*)\}$/.exec(part);
+          if (braced) {
+            push("${", "string");
+            push(braced[1] ?? "", "plain");
+            push("}", "string");
+          } else push(part, /^\$[A-Za-z_]/.test(part) ? "plain" : "string");
+        }
+        index += text.length;
+        command = false;
+        continue;
+      }
+      if (rest.startsWith("'")) {
+        const end = rest.indexOf("'", 1);
+        const text = end < 0 ? rest : rest.slice(0, end + 1);
+        push(text, "string");
+        index += text.length;
+        command = false;
+        continue;
+      }
+      const operator = /^(?:\d?>>?&?\d?|<|\|\||\||&&|;|&|\$\(|\(|\)|`)/.exec(rest);
+      if (operator) {
+        const text = operator[0];
+        // Shiki: `|`, `||` and redirects in the keyword colour, `&&` and `;` plain.
+        push(text, text === "&&" || text === ";" || text === "$(" || text === "(" || text === ")" || text === "`" ? "plain" : "keyword");
+        index += text.length;
+        command = text !== ")" && !/^\d?>/.test(text) && text !== "<";
+        continue;
+      }
+      const variable = /^\$(?:\{[^}]*\}|[A-Za-z_]\w*|[0-9@#?$!*-])/.exec(rest);
+      if (variable) {
+        push(variable[0], "plain");
+        index += variable[0].length;
+        command = false;
+        continue;
+      }
+      const word = /^[^\s|&;<>()$"'`]+/.exec(rest)?.[0] ?? rest.charAt(0);
+      index += word.length;
+      const assignment = /^([A-Za-z_]\w*)=(.*)$/.exec(word);
+      if (SHELL_KEYWORDS.has(word) && (command || word === "in" && forState === "in")) {
+        push(word, "keyword");
+        command = SHELL_COMMAND_KEYWORDS.has(word);
+        forState = word === "for" ? "name" : "none";
+        continue;
+      }
+      // A test's brackets are plain, and what follows them is not a command.
+      if (word === "[" || word === "[[" || word === "]" || word === "]]") {
+        push(word, "plain");
+        command = false;
+        inTest = word.startsWith("[");
+        continue;
+      }
+      if (inTest) {
+        push(word, /^-[a-z]+$/.test(word) ? "keyword" : "plain");
+        continue;
+      }
+      if (assignment && (command || runs.at(-2)?.content === "export")) {
+        push(assignment[1] ?? "", "plain");
+        push("=", "keyword");
+        push(assignment[2] ?? "", "plain");
+        continue;
+      }
+      if (forState === "name") {
+        push(word, "plain");
+        forState = "in";
+        continue;
+      }
+      if (command) {
+        push(word, SHELL_BUILTINS.has(word) ? "constant" : "function");
+        command = false;
+        continue;
+      }
+      push(word, /^-/.test(word) || /^\d+$/.test(word) ? "constant" : "string");
+    }
+    return runs;
+  });
+}