@wix/origami-lint 0.0.0-stage → 1.34.2

package/dist/rules-adapter/utils.js

@@ -0,0 +1,20 @@
+/** The report a rule gets on a file: a violation found from both sides (parent and child) is reported once. Neither oxlint nor ESLint does that. */
+export function createReport(send) {
+    const reported = new Set();
+    return (problem) => {
+        const { start, end } = problem.loc;
+        const key = `${start.line}:${start.column}-${end.line}:${end.column} ${problem.message}`;
+        if (reported.has(key))
+            return;
+        reported.add(key);
+        send(problem);
+    };
+}
+/** A rule's callbacks as the tool calls them, with the node only: every entry of rule.callbacks, so there's no list of names to keep. */
+export function createToolCallbacks(rule, { rulesApi, report, context }) {
+    return Object.fromEntries(Object.entries(rule.callbacks).map(([name, callback]) => {
+        // The tool calls each callback with the node its name is for, as Callbacks types it.
+        const check = callback;
+        return [name, (node) => check({ node, get rulesApi() { return rulesApi(); }, report, context })];
+    }));
+}

package/dist/rules-api/index.js

@@ -0,0 +1,5 @@
+// Part 3 — rules API: one linted file's page and the functions over it, and how a rule reports.
+export { createRulesApi, getOrCreateRulesApi } from "./rules-api.js";
+export { createCssFileReporter, describeAtRule, reportCssProblem } from "./report.js";
+export { BUILDERS, DATA_KEY, GLOBAL_SECTIONS, INSTANCE_PROPS, LAYER_ATTRIBUTES, RESERVED_ATTRIBUTES, RESERVED_ENTRY_KEYS, RUNTIME_ONLY_BUILDERS, RUNTIME_PACKAGE, SECTIONS, SHARED_COMP_ID, STRUCTURE, WRAPPERS, bare, getAttribute, getExpression, getKey, getName, getProperties, getProperty, isOneEditAway, isStructure, ownerOf, } from "../shared/utils.js";
+export { BREAKPOINT_AT_RULES, CONTENT_TARGET, getCssChildren, getDashedId, getSegmentClass, getSelectorSegments, isCssIdentifier, isPresetProperty, isSafeCssIdentifier, ORIGAMI_TARGETS, OVERFLOW_TARGET, PREAMBLE_LAYER } from "../shared/css.js";

package/dist/rules-api/report.js

@@ -0,0 +1,13 @@
+import { FILE_START } from "../page-model/index.js";
+/** Reports a problem on a line of a CSS file: at the page's start (CSS isn't a file the lint tool lints), the message led by `file:line: `. */
+export function reportCssProblem(report, file, line, message) {
+    report({ loc: FILE_START, message: `${file}:${line}: ${message}` });
+}
+/** A reporter for one CSS file: each problem at the page's start, led by `file:line: ` with the node's line (reportCssProblem). */
+export function createCssFileReporter(file, report) {
+    return (node, message) => reportCssProblem(report, file, node.source?.start?.line ?? 1, message);
+}
+/** An at-rule as a message writes it: '@media (max-width: 1px)', or '@media' with no params. */
+export function describeAtRule({ name, params }) {
+    return params.trim() ? `@${name} ${params.trim()}` : `@${name}`;
+}

package/dist/rules-api/rules-api.js

@@ -0,0 +1,70 @@
+// The rules API of one linted file: its page, and the functions over it that the lint tool can't provide (mostly CSS),
+// and reading the file's own code that more than one rule needs (what type a tag is, its name, its id, its slot, its children, the elements in its attributes, where a name is imported from, the name an import is exported under, what is TypeScript, the props an arrow destructures).
+// One per file, shared by every rule on it. Only building its page reads from disk, once per file.
+import path from 'node:path';
+import { readPage } from "../page-model/index.js";
+import { getAttributeElements as getHeldElements, getChildren, getId, getImport, getImportKind, getImportedName, getPropNames, getSlot, getTagName, getType, isTypeScript, WRAPPERS } from "../shared/utils.js";
+import { readBreakpointName, readCustomMedia, readThemeTokens } from "../shared/css.js";
+import { getEnclosingAtRules, isBaseDeclaration } from "./utils.js";
+/** Theme lines come from @apply inside style.css, so style.css's own lines usually come after them. */
+const CASCADE_ORDER = ['layout', 'theme', 'style'];
+/** The rules API over a page already built. */
+export function createRulesApi(page) {
+    const componentsBySourceStart = new Map(Object.values(page.components).map((component) => [component.sourceStart, component]));
+    const getParent = (component) => (component.parentKey ? (page.components[component.parentKey] ?? null) : null);
+    const getCss = (component, property) => CASCADE_ORDER.flatMap((kind) => component.css[kind][property] ?? []);
+    const isWrapper = (element) => {
+        const type = getType(element, getProgram(element));
+        return type !== null && WRAPPERS.includes(type);
+    };
+    const getChildElements = (node) => getChildren(node).flatMap((child) => {
+        if (child.type !== 'JSXElement')
+            return [];
+        return isWrapper(child) ? getChildElements(child) : [child];
+    });
+    const getAttributeElements = (node) => getHeldElements(node).flatMap(({ element, attribute }) => (isWrapper(element) ? getChildElements(element).map((inner) => ({ element: inner, attribute })) : [{ element, attribute }]));
+    return {
+        page,
+        // A JSX element starts where its component starts.
+        getComponent: (node) => componentsBySourceStart.get(node.range[0]) ?? null,
+        getParent,
+        getRoot: () => Object.values(page.components).find((component) => !getParent(component)) ?? null,
+        getCss,
+        getBaseCss: (component, property) => getCss(component, property).filter(isBaseDeclaration).at(-1),
+        getThemeTokens: () => readThemeTokens(page.css.files.theme),
+        getCustomMedia: (kind) => readCustomMedia(page.css.files[kind]),
+        getBreakpointName: readBreakpointName,
+        getEnclosingAtRules,
+        getType: (node) => getType(node, getProgram(node)),
+        getTagName,
+        getId,
+        getChildren,
+        getChildElements,
+        getAttributeElements,
+        getSlot,
+        getImport: (node) => getImport(node.type === 'JSXElement' ? getTagName(node).split('.')[0] : node.name, getProgram(node)),
+        getImportKind,
+        getImportedName,
+        isTypeScript,
+        getPropNames,
+    };
+}
+const rulesApis = new Map();
+/** This file's rules API: its page is built on the first call for the file (CSS and theme from disk), then shared by every rule. */
+export function getOrCreateRulesApi(file) {
+    let rulesApi = rulesApis.get(file.filename);
+    if (!rulesApi)
+        rulesApis.set(file.filename, (rulesApi = createRulesApi(readPage(file.cwd, { jsxFile: getRelativeJsxPath(file), text: file.text, program: file.program }))));
+    return rulesApi;
+}
+/** The tool gives an absolute path; pages are keyed by the path from the site root. */
+function getRelativeJsxPath({ cwd, filename }) {
+    return path.relative(cwd, filename).split(path.sep).join('/');
+}
+/** The file a node is in: the top of its parents. */
+function getProgram(node) {
+    let top = node.parent;
+    while (top.type !== 'Program')
+        top = top.parent;
+    return top;
+}

package/dist/rules-api/utils.js

@@ -0,0 +1,11 @@
+/** On the component itself, outside any @media and @origami-target: applies by default. */
+export const isBaseDeclaration = (decl) => !decl.media && decl.selector === '&';
+/** The at-rules around a CSS node, outer to inner (`@media`, `@scope`, `@layer`, `@mixin`…); [] at the file's top level. */
+export function getEnclosingAtRules(node) {
+    const atRules = [];
+    for (let parent = node.parent; parent && parent.type !== 'root'; parent = parent.parent) {
+        if (parent.type === 'atrule')
+            atRules.unshift(parent);
+    }
+    return atRules;
+}

package/dist/shared/css.js

@@ -0,0 +1,124 @@
+/** The `@layer` the export writes at the top of every CSS file (the spx preamble); the import skips it. */
+export const PREAMBLE_LAYER = 'spx-preamble';
+/** The at-rules the import reads as a breakpoint block: `@media`, and `@scope (.owner) { @media … }`. */
+export const BREAKPOINT_AT_RULES = ['media', 'scope'];
+/** The `@origami-target` blocks a layout rule can hold, an InternalContainer's inner wrappers (the converter's LAYOUT_TARGETS): its
+ * content wrapper (the container's layout) and its overflow wrapper (its scrolling). */
+export const CONTENT_TARGET = 'internal-container-content-wrapper';
+export const OVERFLOW_TARGET = 'internal-container-overflow-wrapper';
+export const ORIGAMI_TARGETS = [CONTENT_TARGET, OVERFLOW_TARGET];
+/** The import's mixin id and `@apply` target: `--` and no space (astParser.ts `MIXIN_ID_PATTERN`). */
+const DASHED_ID = /^--(\S+)$/;
+/** The import's identifier (cssSelectors.ts `SAFE_CSS_IDENT`: `^-?[_a-zA-Z]+[_a-zA-Z0-9-]*$`), written so it can't backtrack: the same strings. */
+const CSS_IDENT = /^-?[_a-zA-Z][_a-zA-Z0-9-]*$/;
+/** Names the import refuses as an identifier: they'd be an object's own keys (cssSelectors.ts `RESERVED_OBJECT_KEYS`). */
+const RESERVED_IDENTIFIERS = new Set(['__proto__', 'constructor', 'prototype']);
+// cssSelectors.ts parseSegment's patterns
+const BASE_CLASS = /^\.[^:[\]"]+/;
+const FUNCTIONAL_PSEUDO = /^:[A-Za-z-]+\([^)]*\)/;
+/** A class after the first: a state (`&.onSale`). */
+const STATE_CLASS = /^\.[^.:[\]"]+/;
+const PSEUDO_CLASS = /^:[A-Za-z-]+/;
+const ATTRIBUTE = /^\[[^\]]*\]/;
+/** Every `--name: value` in a file, wherever it's declared, in order. No file → none. */
+export function readThemeTokens(file) {
+    const tokens = [];
+    file?.walkDecls(/^--/, ({ prop, value, source }) => {
+        tokens.push({ name: prop, value: value.trim(), line: source?.start?.line ?? 1 });
+    });
+    return tokens;
+}
+/** Every `@custom-media --name (query)` at a file's top level, in order, as the import reads them; theme.css's are the site's breakpoints. No file → none. */
+export function readCustomMedia(file) {
+    if (file === undefined)
+        return [];
+    return file.nodes.flatMap((node) => (node.type === 'atrule' && node.name === 'custom-media' ? [{ ...parseCustomMedia(node.params), line: node.source?.start?.line ?? 1 }] : []));
+}
+/** A named breakpoint, `(--tablet)`: one dashed name in parentheses, spaces aside. */
+const NAMED_QUERY = /^\(\s*(--[\w-]+)\s*\)$/;
+/** A `@media` query's params → the breakpoint name it uses: '(--tablet)' → '--tablet'; null for a range or anything that isn't one name. */
+export const readBreakpointName = (query) => NAMED_QUERY.exec(query.trim())?.[1] ?? null;
+/** `--tablet (max-width: 1023px)` → its name and its query, as written (the import compares the text). A malformed declaration keeps what it has: `mobile (…)` → name 'mobile'; `--phone` → query ''. */
+function parseCustomMedia(params) {
+    const [, name = '', query = ''] = /^(\S*)\s*([\s\S]*)$/.exec(params.trim()) ?? [];
+    return { name, query };
+}
+/** A container's children, comments aside; none for a node with no block. */
+export const getCssChildren = (node) => (node.nodes ?? []).filter((child) => child.type !== 'comment');
+/** Whether a property picks a preset (css/utils.ts `isPresetProperty`): `--preset` (the rule's own element) or `--preset-<part path>`. */
+export const isPresetProperty = (prop) => prop === '--preset' || prop.startsWith('--preset-');
+/** The id a `@mixin` or `@apply` names: '--btn' → 'btn' (spaces around aside); undefined when its params aren't `--` and one word. */
+export const getDashedId = (params) => DASHED_ID.exec(params.trim())?.[1];
+/** Whether the import reads this as an identifier (cssSelectors.ts `isCssIdentifier`): letters, digits, - and _, not starting with a digit. */
+export const isCssIdentifier = (id) => CSS_IDENT.test(id);
+/** Whether the import takes this as a name (a mixin id, a preset path's part; cssSelectors.ts `isSafeCssIdentifier`): an identifier, not a reserved name. */
+export const isSafeCssIdentifier = (id) => !RESERVED_IDENTIFIERS.has(id) && isCssIdentifier(id);
+/** The selector's parts, split on spaces outside brackets and quotes, a combinator kept with its sides (cssSelectors.ts splitSegments); null for a list or an unbalanced bracket: the selectors rows'. */
+export function getSelectorSegments(selector) {
+    const segments = [];
+    let current = '';
+    let depth = 0;
+    let inQuotes = false;
+    for (const char of selector) {
+        if (inQuotes)
+            inQuotes = char !== '"';
+        else if (char === '"')
+            inQuotes = true;
+        else if (char === '[' || char === '(')
+            depth += 1;
+        else if (char === ']' || char === ')')
+            depth -= 1;
+        else if (char === ',' && depth === 0)
+            return null;
+        if (depth < 0)
+            return null;
+        if (/\s/.test(char) && depth === 0 && !inQuotes) {
+            if (current)
+                segments.push(current);
+            current = '';
+        }
+        else
+            current += char;
+    }
+    if (inQuotes || depth > 0)
+        return null;
+    if (current)
+        segments.push(current);
+    return segments.reduce((merged, segment) => {
+        const previous = merged.at(-1);
+        if (previous !== undefined && (/[>+~]$/.test(previous) || /^[>+~]/.test(segment)))
+            merged[merged.length - 1] = `${previous} ${segment}`;
+        else
+            merged.push(segment);
+        return merged;
+    }, []);
+}
+/**
+ * A segment's class, its states taken out, read as cssSelectors.ts parseSegment reads it (0.83.0): `&:hover` → `&` (the mixin's own
+ * element); `.label:hover` → `.label`; `.label.open` → `.label`. A functional pseudo-class (`:not(:hover)`) or an attribute
+ * (`[data-state~="open"]`) right after the class is part of the class, its brackets whole. Null for a segment the import can't parse:
+ * a part that isn't a class (`[data-ie-name="x"]`, `:hover` alone, `:root`), or `&` followed by anything but a state (`&[x]`, `&:not(…)`).
+ */
+export function getSegmentClass(segment) {
+    const base = segment.startsWith('&') ? '&' : BASE_CLASS.exec(segment)?.[0];
+    if (base === undefined)
+        return null;
+    const isClass = base !== '&';
+    let kept = base;
+    let rest = segment.slice(base.length);
+    let seenState = false;
+    while (rest) {
+        const functional = isClass && !seenState ? FUNCTIONAL_PSEUDO.exec(rest) : null;
+        const state = functional ? null : (STATE_CLASS.exec(rest) ?? PSEUDO_CLASS.exec(rest));
+        const attribute = functional || state || seenState || !isClass ? null : ATTRIBUTE.exec(rest);
+        const token = functional ?? state ?? attribute;
+        if (!token)
+            return null;
+        if (state)
+            seenState = true;
+        else
+            kept += token[0];
+        rest = rest.slice(token[0].length);
+    }
+    return kept;
+}

package/dist/shared/log.js

@@ -0,0 +1,4 @@
+// Console output of the lint run. Each line shows the time since the start, so step durations need no timers.
+export function log(message) {
+    console.log(`origami-lint [${Math.round(performance.now())} ms]: ${message}`);
+}

package/dist/shared/paths.js

@@ -0,0 +1,28 @@
+import { existsSync, readFileSync } from 'node:fs';
+import path from 'node:path';
+/** The site: the folder the lint was started from (`yarn lint` at the site's root). */
+export const ROOT = process.cwd();
+export const LINT_DIR = path.join(ROOT, '.lint');
+/** The lint's own package.json: the same two levels up from lint/ (source) and dist/ (published). */
+export const LINT_PACKAGE_FILE = path.resolve(import.meta.dirname, '../../package.json');
+const LINT_PACKAGE = 'origami-lint';
+const LINT_PACKAGE_NAME = `@wix/${LINT_PACKAGE}`;
+/** The lint runs only from the folder whose package.json adds it, which holds the site's git repository. */
+export function checkStartedAtSiteRoot() {
+    const problem = siteRootProblem();
+    if (!problem)
+        return;
+    console.error(`${LINT_PACKAGE}: ${problem}`);
+    process.exit(1);
+}
+function siteRootProblem() {
+    const packageFile = path.join(ROOT, 'package.json');
+    if (!existsSync(packageFile) || !addsTheLint(JSON.parse(readFileSync(packageFile, 'utf8')))) {
+        return `run it from the site's root, the folder whose package.json has ${LINT_PACKAGE_NAME} (started in ${ROOT})`;
+    }
+    if (!existsSync(path.join(ROOT, '.git'))) {
+        return `no git repository in ${ROOT}. The lint keeps the last passing version in the site's repository: run git init here.`;
+    }
+    return null;
+}
+const addsTheLint = ({ dependencies, devDependencies }) => LINT_PACKAGE_NAME in { ...dependencies, ...devDependencies };

package/dist/shared/site-files-tree-mapping.js

@@ -0,0 +1,12 @@
+// Where things sit in the exported site, from the site's root. The one place that knows its folders (docs/export-site-tree.md).
+export const SITE_SRC = 'packages/site-app/src';
+/** One page per folder; routes can be nested (about-us/team). */
+export const PAGES_FOLDER = `${SITE_SRC}/pages`;
+/** What every page shares: the global components, the menus, the theme. */
+export const GLOBAL_FOLDER = `${SITE_SRC}/global`;
+/** Inside src/: one global component per folder (the header, the footer, any other shared section). A page imports one from here. */
+export const GLOBAL_COMPONENTS = 'global/components';
+export const GLOBAL_COMPONENTS_FOLDER = `${SITE_SRC}/${GLOBAL_COMPONENTS}`;
+/** Inside src/: one file per menu. A page imports a menu from here (`global/menus/<menu id>`). */
+export const GLOBAL_MENUS = 'global/menus';
+export const THEME_FILE = `${GLOBAL_FOLDER}/themes/theme.css`;

package/dist/shared/utils.js

@@ -0,0 +1,208 @@
+import { GLOBAL_COMPONENTS, GLOBAL_MENUS } from "./site-files-tree-mapping.js";
+/** Any section: rules that don't care which one. */
+export const SECTIONS = ['section', 'header', 'footer'];
+/** A page's reference to a global component (`<HeaderSection_x sharedCompId="…" />`). */
+export const GLOBAL_SECTIONS = ['globalHeader', 'globalFooter', 'globalSection'];
+/** A tag that wraps one component and isn't one itself: `<Remove when={…}>`, `<Interaction interactKey="…">`. */
+export const WRAPPERS = ['remove', 'interaction'];
+/** The name a structure file exports its tree under: `export const Structure = () => (…)`. */
+export const STRUCTURE = 'Structure';
+/** The props a global component's Structure may take: its instance identity, `({ id, className })` (#300). */
+export const INSTANCE_PROPS = ['id', 'className'];
+const SYSTEM = '@wix/origami-system-components';
+/** The runtime package: the builders (`ctx`, `fn`…) and the `<Remove>` wrapper. */
+export const RUNTIME_PACKAGE = '@wix/origami-runtime';
+/** The runtime's builders: the converter's BINDINGS_BUILDER_ORDER without `Remove`, which is a tag (reservedAttributes.ts). */
+export const BUILDERS = [
+    'all', 'ctx', 'fn', 'is', 'raw', 'state',
+    'textEnum', 'phone', 'email', 'webUrl', 'hostname', 'regex', 'guid', 'direction', 'localDate', 'localTime', 'localDateTime', 'dateTime',
+];
+/** The six builders no other package exports under these names; `email`, `regex`… may well come from a library for fn(). */
+export const RUNTIME_ONLY_BUILDERS = ['all', 'ctx', 'fn', 'is', 'raw', 'state'];
+/** The attributes the converter reads on any component as something other than its data (reservedAttributes.ts RESERVED_ATTRIBUTES, converter 0.81: `type` is data since). */
+export const RESERVED_ATTRIBUTES = [
+    'id', '_id', 'data', 'props', 'skin', 'styleId', 'className', 'documentType', 'style', 'slot', 'bindings', 'elementProps',
+];
+/** The attribute of a page's reference to a global component (SHARED_COMP_ID_ATTR); on any other tag it's data. */
+export const SHARED_COMP_ID = 'sharedCompId';
+/** The keys of an elementProps entry the converter reads as something other than the part's data (RESERVED_INNER_ELEMENT_ENTRY_KEYS, converter 0.80). */
+export const RESERVED_ENTRY_KEYS = ['data', 'slots', 'elementProps', 'bindings', 'className'];
+/** A data key is a JavaScript name (dataKeys.ts). */
+export const DATA_KEY = /^[A-Za-z_$][A-Za-z0-9_$]*$/;
+/** By import source; the wrappers also by the imported name, since their packages export other things (`Show`, `Interact`). */
+const TYPE_BY_IMPORT_SOURCE = [
+    [new RegExp(`^${SYSTEM}/(?:layout/)?Page$`), 'page'],
+    [new RegExp(`^${SYSTEM}/layout/Header$`), 'headerLandmark'],
+    [new RegExp(`^${SYSTEM}/layout/Footer$`), 'footerLandmark'],
+    [new RegExp(`^${SYSTEM}/(?:layout/)?Section$`), 'section'],
+    [new RegExp(`^${SYSTEM}/(?:layout/)?HeaderSection$`), 'header'],
+    [new RegExp(`^${SYSTEM}/(?:layout/)?FooterSection$`), 'footer'],
+    [new RegExp(`^${SYSTEM}/InternalContainer$`), 'innerElement'],
+    // A global component's folder is `<Type>_<id>`: HeaderSection_mb7ogqqn.
+    [new RegExp(`/${GLOBAL_COMPONENTS}/(?:HeaderSection|Header)_[^/]+$`), 'globalHeader'],
+    [new RegExp(`/${GLOBAL_COMPONENTS}/(?:FooterSection|Footer)_[^/]+$`), 'globalFooter'],
+    [new RegExp(`/${GLOBAL_COMPONENTS}/[^/]+$`), 'globalSection'],
+    [new RegExp(`^${RUNTIME_PACKAGE}$`), 'remove', 'Remove'],
+    [/^@wix\/interact\/react$/, 'interaction', 'Interaction'],
+];
+const KIND_BY_IMPORT_SOURCE = [
+    [new RegExp(`^${RUNTIME_PACKAGE}$`), 'runtime'],
+    [/^@wix\/sdk$/, 'sdk'],
+    [/^@wix\/interact\/react$/, 'interactReact'],
+    [/^@wix\/interact(\/|$)/, 'interact'],
+    [/^@wix\/motion-presets$/, 'motionPresets'],
+    [new RegExp(`^(\\.\\.?/)*${GLOBAL_MENUS}(/|$)`), 'menu'],
+    [/^document$/, 'core'],
+    [/^document\//, 'document'],
+];
+/** <Band> with `import { Section as Band } from '@wix/origami-system-components/Section'` → 'section'. `<Band.Item>` is Band's. A wrapper is the named export: `<Show>` from the runtime is null. */
+export function getType(element, program) {
+    const found = getImport(getTagName(element).split('.')[0], program);
+    const entry = found && TYPE_BY_IMPORT_SOURCE.find(([pattern]) => pattern.test(found.source));
+    if (!entry)
+        return null;
+    const [, type, imported] = entry;
+    return imported === undefined || found.imported === imported ? type : null;
+}
+/** What an import's source is: 'runtime' for @wix/origami-runtime, 'interact' for @wix/interact/…; null for anything else. */
+export const getImportKind = (source) => KIND_BY_IMPORT_SOURCE.find(([pattern]) => pattern.test(source))?.[1] ?? null;
+/** Where a name of the file comes from; null when no import brings it in. */
+export function getImport(name, program) {
+    for (const { source, specifiers } of program.body.filter(isImport)) {
+        const specifier = specifiers.find(({ local }) => local.name === name);
+        if (!specifier)
+            continue;
+        return { imported: getImportedName(specifier), source: source.value, kind: getImportKind(source.value) };
+    }
+    return null;
+}
+/** The name a specifier is exported under: `import X` → 'default', `import * as X` → '*', `import { Remove as Hide }` → 'Remove', `import { 'a-b' as ab }` → 'a-b'. */
+export function getImportedName({ type, imported }) {
+    if (type === 'ImportDefaultSpecifier')
+        return 'default';
+    if (type === 'ImportNamespaceSpecifier')
+        return '*';
+    return typeof imported?.name === 'string' ? imported.name : String(imported?.value);
+}
+/** 'Section', 'Band.Item', 'svg:rect'. */
+export function getTagName(element) {
+    const text = (name) => {
+        if (name.type === 'JSXIdentifier')
+            return name.name;
+        if (name.type === 'JSXNamespacedName')
+            return `${name.namespace.name}:${name.name.name}`;
+        return `${text(name.object)}.${name.property.name}`;
+    };
+    return text(element.openingElement.name);
+}
+/** An attribute's value as a string: x="a" and x={'a'} → 'a'; no value, or any other expression → null. */
+export function getLiteralString(value) {
+    const literal = value?.type === 'JSXExpressionContainer' ? value.expression : value;
+    return literal?.type === 'Literal' && typeof literal.value === 'string' ? literal.value : null;
+}
+/** id="sec" and id={'sec'} → 'sec'; no id, or id={variable} → null. */
+export function getId(element) {
+    return getLiteralString(element.openingElement.attributes.find(isIdAttribute)?.value);
+}
+/** slot="footer" or slot={'footer'} → 'footer'; no slot, or slot={variable} → null. */
+export function getSlot(element) {
+    return getLiteralString(element.openingElement.attributes.find(isSlotAttribute)?.value);
+}
+/** The attributes that hold an element's layers: drawn behind it, and pinned to it. */
+export const LAYER_ATTRIBUTES = ['backgroundLayer', 'pinnedLayer'];
+/** The elements this one holds in its attributes (`content={<X />}`, or inside the attribute's object or array, `elementProps` too), each with the attribute it is in. Not its children, and not the elements inside those elements. */
+export function getAttributeElements(owner) {
+    const elementsIn = (value) => {
+        switch (value?.type) {
+            case 'JSXElement': return [value];
+            case 'JSXExpressionContainer': return elementsIn(value.expression);
+            case 'ObjectExpression': return value.properties.flatMap((property) => (property.type === 'Property' ? elementsIn(property.value) : []));
+            case 'ArrayExpression': return value.elements.flatMap(elementsIn);
+            default: return [];
+        }
+    };
+    return owner.openingElement.attributes.filter(isAttribute).flatMap((attribute) => elementsIn(attribute.value).map((element) => ({ element, attribute: attribute })));
+}
+/** Elements, text and {expressions}, in order. Whitespace and JSX comments are skipped. */
+export function getChildren(element) {
+    return element.children.filter((child) => {
+        if (child.type === 'JSXText')
+            return String(child.value).trim() !== '';
+        return !(child.type === 'JSXExpressionContainer' && child.expression?.type === 'JSXEmptyExpression');
+    });
+}
+/** The element's attribute with this name (`a:b` for a namespaced one); undefined without one. */
+export const getAttribute = (element, name) => element.openingElement.attributes.find((attribute) => attribute.type === 'JSXAttribute' && getName(attribute) === name);
+/** The attribute's name: `type`, or `a:b` for a namespaced one. */
+export const getName = (attribute) => (attribute.name.type === 'JSXIdentifier' ? attribute.name.name : `${attribute.name.namespace.name}:${attribute.name.name.name}`);
+/** What the attribute's {…} holds, without parentheses; null for a string value, no value, or `{}`. */
+export function getExpression(attribute) {
+    const value = attribute?.value;
+    if (value?.type !== 'JSXExpressionContainer' || value.expression.type === 'JSXEmptyExpression')
+        return null;
+    return bare(value.expression);
+}
+/** The node inside its parentheses: `((x))` → `x`. */
+export function bare(node) {
+    return node.type === 'ParenthesizedExpression' ? bare(node.expression) : node;
+}
+/** An object's `key: value` entries: no spread, no computed key. */
+export const getProperties = (object) => object.properties.filter((property) => property.type === 'Property' && !property.computed);
+/** The object's entry with this key; undefined without one. */
+export const getProperty = (object, key) => getProperties(object).find((property) => getKey(property) === key);
+/** null for a number key: the import reads only name and string keys, and fails on any other. */
+export function getKey(property) {
+    if (property.key.type === 'Identifier')
+        return property.key.name;
+    return property.key.type === 'Literal' && typeof property.key.value === 'string' ? property.key.value : null;
+}
+/** The function `export const Structure = () => …` at the top of the file. Any `Structure` declarator counts, as the page model reads it; no-free-code reports a wrong form. */
+export function isStructure(node) {
+    const declarator = node.parent;
+    return declarator?.type === 'VariableDeclarator' && declarator.id?.type === 'Identifier' && declarator.id.name === STRUCTURE
+        && declarator.parent?.parent?.type === 'ExportNamedDeclaration' && declarator.parent.parent.parent?.type === 'Program';
+}
+/** A component in a message: `<Image>` img, or `<Image>` when it has no id. */
+export function ownerOf(element) {
+    const id = getId(element);
+    return `\`<${getTagName(element)}>\`${id ? ` ${id}` : ''}`;
+}
+/** One letter added, removed or changed, as the converter counts it (dataKeys.ts, reservedAttrNearMiss). */
+export function isOneEditAway(name, target) {
+    const delta = name.length - target.length;
+    if (name === target || Math.abs(delta) > 1)
+        return false;
+    let edits = 0;
+    for (let i = 0, j = 0; i < name.length || j < target.length;) {
+        if (name[i] === target[j]) {
+            i++;
+            j++;
+            continue;
+        }
+        if (edits === 1)
+            return false;
+        edits = 1;
+        if (delta >= 0)
+            i++;
+        if (delta <= 0)
+            j++;
+    }
+    return true;
+}
+/** A TypeScript node (`TSTypeAnnotation`, `TSAsExpression`…), an `import type` / `export type` / `{ type Y }`, or a `declare` / `abstract` declaration. JavaScript, null and undefined: false. */
+export function isTypeScript(node) {
+    return !!node && (node.type.startsWith('TS') || node.importKind === 'type' || node.exportKind === 'type' || node.declare === true || node.abstract === true);
+}
+/** The names a function destructures from its one parameter: `({ id, className })` → ['id', 'className']. A property with a default, a new name, a computed key or `...rest` is null. `()` and `({})` → []; any other parameters → null. */
+export function getPropNames(fn) {
+    if (fn.params.length === 0)
+        return [];
+    const [param] = fn.params;
+    if (fn.params.length > 1 || param.type !== 'ObjectPattern')
+        return null;
+    return (param.properties ?? []).map(({ type, computed, key, value }) => type === 'Property' && !computed && key?.type === 'Identifier' && value?.type === 'Identifier' && value.name === key.name ? String(key.name) : null);
+}
+const isImport = (statement) => statement.type === 'ImportDeclaration';
+const isAttribute = (attribute) => attribute.type === 'JSXAttribute';
+const isIdAttribute = (attribute) => isAttribute(attribute) && attribute.name.type === 'JSXIdentifier' && attribute.name.name === 'id';
+const isSlotAttribute = (attribute) => isAttribute(attribute) && attribute.name.type === 'JSXIdentifier' && attribute.name.name === 'slot';

package/package.json

@@ -1,6 +1,55 @@
 {
   "name": "@wix/origami-lint",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "1.34.2",
+  "description": "Offline lint for an exported Origami site: lints the pages that changed since the last passing run",
+  "type": "module",
+  "bin": {
+    "origami-lint": "dist/lint.js"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "!**/*.tsbuildinfo"
+  ],
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "scripts": {
+    "build": "rm -rf dist && tsc -p . && tsc -p tsconfig.build.json",
+    "lint": "oxlint .",
+    "typecheck": "tsc -p .",
+    "test": "node --test 'test/*.test.ts'"
+  },
+  "dependencies": {
+    "@wix/origami-fonts": "1.0.1",
+    "oxc-parser": "^0.151.0",
+    "oxlint": "^1.39.0",
+    "postcss": "^8.5.3"
+  },
+  "devDependencies": {
+    "@types/node": "^22.0.0",
+    "typescript": "^6.0.3"
+  },
+  "publishUnscoped": false,
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "wix": {
+    "artifact": {
+      "groupId": "com.wixpress.npm",
+      "artifactId": "origami-lint",
+      "targets": {
+        "docker": false
+      }
+    },
+    "validations": {
+      "postBuild": [
+        "typecheck",
+        "test",
+        "lint"
+      ]
+    }
+  },
+  "falconPackageHash": "b4530d28f7fd3cf6e883a2f9ab79852ec1f94c67e1fa6b2ae68ace9a"
 }