@wix/origami-lint 1.34.27 → 1.34.29

package/dist/rules/site-app/bindings.js

@@ -119,28 +119,29 @@ function checkSvgArguments({ node, rulesApi, report }) {
                 return;
         }
     }
+    // tracker CONV-vectorArtExpression.ts:44
     report({ check: 'invalid_svg_expression',
         loc: node.loc,
-        message: tracked("An SVG media expression must be `svg(media.getShapeUrl('wix:image://v1/<uri>').url, '<uri>')`, with matching URI strings, svg imported from '@wix/origami-runtime' and media from '@wix/sdk'.", 'CONV-vectorArtExpression.ts:44'),
+        message: "An SVG media expression must be `svg(media.getShapeUrl('wix:image://v1/<uri>').url, '<uri>')`, with matching URI strings, svg imported from '@wix/origami-runtime' and media from '@wix/sdk'.",
     });
 }
-/** Each builder's own row: the shape of its call, a key written twice in it. */
-const ROW_OF_BUILDER = { all: 'CONV-decode.ts:196', callback: 'CONV-astValue.ts:287', ctx: 'CONV-astValue.ts:276', fn: 'CONV-astValue.ts:287', is: 'CONV-decode.ts:172', raw: 'CONV-decode.ts:28' };
-const tracked = (message, row) => `${message.slice(0, -1)} (tracker ${row}).`;
-const say = ({ input }, node, check, message, row) => input.report({ check, loc: node.loc, message: tracked(message, row) });
+// ── the steps ──
+const say = ({ input }, node, check, message) => input.report({ check, loc: node.loc, message });
 const textOf = ({ input }, node) => input.context.sourceCode.getText(node);
 const describeIn = (at, node) => describe(node, (part) => textOf(at, part));
 function removeWhen(at) {
     const { node } = at.input;
     const when = getAttribute(node, 'when');
     if (!when) {
-        say(at, node.openingElement.name, 'missing_remove_condition', `${at.owner} needs \`when={…}\`: the condition that removes the component it wraps.`, 'CONV-parseJsx.ts:1113');
+        // tracker CONV-parseJsx.ts:1113
+        say(at, node.openingElement.name, 'missing_remove_condition', `${at.owner} needs \`when={…}\`: the condition that removes the component it wraps.`);
         return null;
     }
     const value = getExpression(when);
     const what = when.value ? `\`${at.input.context.sourceCode.getText(when.value)}\`` : 'empty';
+    // tracker CONV-parseJsx.ts:1113
     if (!value)
-        say(at, when, 'invalid_remove_condition', `\`when\` on ${at.owner} is ${what}. Write the condition in braces: \`when={…}\`.`, 'CONV-parseJsx.ts:1113');
+        say(at, when, 'invalid_remove_condition', `\`when\` on ${at.owner} is ${what}. Write the condition in braces: \`when={…}\`.`);
     return value;
 }
 function removeTarget(at) {
@@ -153,30 +154,48 @@ function removeTarget(at) {
         const item = getObject(value.arguments[0]);
         // An item of another type is the bindings' own line (checkRawBindingsType).
         if (item && stringValue(getProperty(item, 'type')?.value) === BINDINGS_LIST && setsRemoved(item)) {
-            say(at, value, 'duplicate_remove_condition', `${at.owner} wraps ${ownerOf(component)}, whose \`bindings\` are \`raw()\` of an item that already sets \`features.visibility.${REMOVED}\`. Keep only one of them.`, 'CONV-decode.ts:280');
+            // tracker CONV-decode.ts:280
+            say(at, value, 'duplicate_remove_condition', `${at.owner} wraps ${ownerOf(component)}, whose \`bindings\` are \`raw()\` of an item that already sets \`features.visibility.${REMOVED}\`. Keep only one of them.`);
         }
     }
 }
 function builderInPlace(at) {
     const { node, rulesApi } = at.input;
     for (const [call, where] of misplacedBuilders(node, rulesApi)) {
-        say(at, call, 'nested_binding_builder', `\`${builderOf(call, rulesApi)}()\` on ${at.owner} is inside ${where}, where the import reads only plain values. Write a builder as the whole value of a data attribute (\`label={ctx(…)}\`) or of an elementProps entry key (\`navbar: { label: ctx(…) }\`), or in \`bindings\`.`, 'CONV-astValue.ts:98');
+        // tracker CONV-astValue.ts:98
+        say(at, call, 'nested_binding_builder', `\`${builderOf(call, rulesApi)}()\` on ${at.owner} is inside ${where}, where the import reads only plain values. Write a builder as the whole value of a data attribute (\`label={ctx(…)}\`) or of an elementProps entry key (\`navbar: { label: ctx(…) }\`), or in \`bindings\`.`);
     }
 }
-/** A callback prop takes a function: the import reads it only in `bindings.props`, and there the site's runtime throws on anything but `callback()` (withOrigami). */
+/**
+ * A callback prop takes a function: on a component that takes data, the import reads a `callback()` attribute as a binding (parseJsx.ts
+ * isCallbackAttr), and refuses an `on…` attribute with any other call. In `bindings.props` the site's runtime throws on anything but `callback()`
+ * (withOrigami).
+ */
 function checkCallbackProps(at) {
     const { node, rulesApi } = at.input;
-    for (const [name, attribute] of getCallbackAttributes(node)) {
-        say(at, attribute, 'callback_attribute', `\`${name}\` on ${at.owner} is an attribute, which the import doesn't read for a callback prop. Bind it in \`bindings\` with \`callback()\`: \`bindings={{ props: { ${name}: callback(goHome) } }}\`.`, 'OUR-031');
+    const takesData = rulesApi.hasDataAttributes(node);
+    for (const [name, attribute, value] of getCallbackAttributes(node)) {
+        const isCallback = builderOf(value, rulesApi) === 'callback';
+        // tracker OUR-031
+        if (!takesData)
+            say(at, attribute, 'callback_attribute', `\`${name}\` on ${at.owner} is an attribute, which the import doesn't read on this component. ${CALLBACK_FIX(`bindings={{ props: { ${name}: callback(…) } }}`)}`);
+        else if (!isCallback)
+            say(at, attribute, 'callback_attribute', `\`${name}\` on ${at.owner} is ${describeCall(at, value)}, which the import doesn't read for a callback prop. ${CALLBACK_FIX(`${name}={callback(…)}`)}`);
     }
     if (!isWrappedByRuntime(node, rulesApi))
         return;
     for (const [name, value] of getBoundCallbacks(getAttribute(node, 'bindings'))) {
         const what = runsAtRender(at, value);
+        // tracker OUR-031
         if (what)
-            say(at, value, 'non_function_callback', `\`bindings.props.${name}\` on ${at.owner} is ${what}, which runs at render and gives a value, not a function: the site's runtime throws on it. Write \`${name}: callback(goHome)\`.`, 'OUR-031');
+            say(at, value, 'non_function_callback', `\`bindings.props.${name}\` on ${at.owner} is ${what}, which gives a value, not a function: the site's runtime throws on it. ${CALLBACK_FIX(`${name}: callback(…)`)}`);
     }
 }
+const CALLBACK_FIX = (form) => `Write \`${form}\`, its first argument an imported function, a \`ctx()\` or a member of the renderItem row.`;
+const describeCall = (at, node) => {
+    const builder = builderOf(node, at.input.rulesApi);
+    return builder ? `\`${builder}()\`` : describeIn(at, node);
+};
 function boundPropOnce(at) {
     const { node, rulesApi } = at.input;
     const bindings = getAttribute(node, 'bindings');
@@ -185,8 +204,9 @@ function boundPropOnce(at) {
         return;
     for (const [name, attribute] of boundAttributes(node, rulesApi)) {
         const where = props.raw ? `bindings={raw({ properties: { ${name} } })}` : `bindings={{ props: { ${name} } }}`;
+        // tracker CONV-parseJsx.ts:753
         if (props.names.has(name))
-            say(at, attribute, 'duplicate_binding', `${at.owner} binds \`${name}\` twice: in \`${name}={…}\` and in \`${where}\`. Keep one.`, 'CONV-parseJsx.ts:753');
+            say(at, attribute, 'duplicate_binding', `${at.owner} binds \`${name}\` twice: in \`${name}={…}\` and in \`${where}\`. Keep one.`);
     }
 }
 function entryPropBoundOnce(at, entry) {
@@ -195,8 +215,9 @@ function entryPropBoundOnce(at, entry) {
         return;
     for (const [key, property] of boundEntryKeys(entry, at.input.rulesApi)) {
         const where = props.raw ? `bindings: raw({ properties: { ${key} } })` : `bindings.props.${key}`;
+        // tracker CONV-parseJsx.ts:753
         if (props.names.has(key))
-            say(at, property, 'duplicate_binding', `${at.owner} binds \`${key}\` twice: in \`${key}: …\` and in its \`${where}\`. Keep one.`, 'CONV-parseJsx.ts:753');
+            say(at, property, 'duplicate_binding', `${at.owner} binds \`${key}\` twice: in \`${key}: …\` and in its \`${where}\`. Keep one.`);
     }
 }
 function bindingsAttribute(at, attribute) {
@@ -204,9 +225,9 @@ function bindingsAttribute(at, attribute) {
         return;
     const value = getExpression(attribute);
     if (value)
-        bindingsValue(at, value);
-    else
-        say(at, attribute, 'invalid_bindings_object', notBindings(at, attribute.value ? `\`${at.input.context.sourceCode.getText(attribute.value)}\`` : 'empty'), 'CONV-parseJsx.ts:700');
+        return bindingsValue(at, value);
+    // tracker CONV-parseJsx.ts:700
+    say(at, attribute, 'invalid_bindings_object', notBindings(at, attribute.value ? `\`${at.input.context.sourceCode.getText(attribute.value)}\`` : 'empty'));
 }
 const notBindings = (at, what) => `\`bindings\` on ${at.owner} is ${what}. Write an object in place, \`bindings={{ props: {…} }}\`, or \`raw({…})\`.`;
 function bindingsValue(at, node, isEntry = false) {
@@ -221,22 +242,27 @@ function bindingsValue(at, node, isEntry = false) {
         const object = bare(item);
         if (!isEntry)
             checkRawBindingsType(at, value, object);
+        // tracker CONV-decode.ts:280
         if (!isEntry && setsRemoved(object))
-            say(at, value, 'removed_in_raw_bindings', `${at.owner} sets \`features.visibility.${REMOVED}\` in its \`raw()\` bindings. Move the condition out, and wrap the component in \`<Remove when={…}>\`.`, 'CONV-decode.ts:280');
+            say(at, value, 'removed_in_raw_bindings', `${at.owner} sets \`features.visibility.${REMOVED}\` in its \`raw()\` bindings. Move the condition out, and wrap the component in \`<Remove when={…}>\`.`);
         const propertyMap = getProperty(object, 'properties');
         const properties = getObject(propertyMap?.value);
+        // tracker CONV-decode.ts:252
         if (propertyMap && !properties)
-            say(at, propertyMap.value, 'invalid_raw_properties', `The \`properties\` in \`raw()\` bindings on ${at.owner} isn't an object. Write a prop map of typed bindings: \`properties: { label: { type: 'ContextBinding', … } }\`.`, 'CONV-decode.ts:252');
+            say(at, propertyMap.value, 'invalid_raw_properties', `The \`properties\` in \`raw()\` bindings on ${at.owner} isn't an object. Write a prop map of typed bindings: \`properties: { label: { type: 'ContextBinding', … } }\`.`);
         for (const property of properties ? getProperties(properties) : []) {
+            // tracker CONV-decode.ts:252
             if (isStaticItem(property.value))
-                say(at, property.value, 'static_binding_value', fixedValue(at, getKey(property)), 'CONV-decode.ts:252');
+                say(at, property.value, 'static_binding_value', fixedValue(at, getKey(property)));
         }
     }
     else if (builder) {
-        say(at, value, 'builder_as_bindings', `\`bindings\` on ${at.owner} is a \`${builder}()\` call. Write an object and put the call under props, or use \`raw({…})\`.`, 'CONV-decode.ts:263');
+        // tracker CONV-decode.ts:263
+        say(at, value, 'builder_as_bindings', `\`bindings\` on ${at.owner} is a \`${builder}()\` call. Write an object and put the call under props, or use \`raw({…})\`.`);
     }
     else if (!isCallByName(value)) {
-        say(at, value, 'invalid_bindings_object', notBindings(at, describeIn(at, value)), 'CONV-parseJsx.ts:700');
+        // tracker CONV-parseJsx.ts:700; an elementProps entry's: CONV-innerElements.ts:221
+        say(at, value, 'invalid_bindings_object', notBindings(at, describeIn(at, value)));
     }
 }
 function bindingsObject(at, bindings, isEntry) {
@@ -247,8 +273,9 @@ function bindingsObject(at, bindings, isEntry) {
                     : property.key.type !== 'Identifier' ? `the key \`${textOf(at, property.key)}\``
                         : property.key.name === BINDINGS_KEY || CLASS_NAME_SECTIONS.includes(property.key.name) ? null
                             : `the key \`${property.key.name}\``;
+        // tracker CONV-parseJsx.ts:708
         if (what)
-            say(at, property, 'invalid_bindings_key', `\`bindings\` on ${at.owner} has ${what}. Use only the key props, written as a plain name.`, 'CONV-parseJsx.ts:708');
+            say(at, property, 'invalid_bindings_key', `\`bindings\` on ${at.owner} has ${what}. Use only the key props, written as a plain name.`);
         else if (getKey(property) === BINDINGS_KEY)
             section(at, BINDINGS_KEY, property.value);
         else
@@ -259,17 +286,20 @@ function bindingsObject(at, bindings, isEntry) {
 function classNameSection(at, property, isEntry) {
     const key = getKey(property);
     const removed = key === 'visibility' && !isEntry && getObject(property.value) && getProperty(getObject(property.value), REMOVED);
+    // tracker CONV-decode.ts:280
     if (removed)
-        return say(at, removed, 'removed_in_bindings', `${at.owner} sets \`visibility.${REMOVED}\` in its \`bindings\`. Move the condition out, and wrap the component in \`<Remove when={…}>\`.`, 'CONV-decode.ts:280');
+        return say(at, removed, 'removed_in_bindings', `${at.owner} sets \`visibility.${REMOVED}\` in its \`bindings\`. Move the condition out, and wrap the component in \`<Remove when={…}>\`.`);
     const term = key === 'states' ? '{ hover: is(…) }' : "{ 'wix-visibility-hidden': is(…) }";
     const fix = isEntry ? `in the entry's \`className: ${term}\`` : `as a \`className\` term: \`className={['comp-x', ${term}]}\``;
-    say(at, property, 'state_in_bindings', `\`bindings.${key}\` on ${at.owner} isn't read: the import reads states and visibility in \`className\`. Write each condition ${fix}.`, 'CONV-parseJsx.ts:708');
+    // tracker CONV-parseJsx.ts:708
+    say(at, property, 'state_in_bindings', `\`bindings.${key}\` on ${at.owner} isn't read: the import reads states and visibility in \`className\`. Write each condition ${fix}.`);
 }
 function section(at, name, node) {
     const fix = `Write an object of \`key: value\` entries: \`${name}: { label: … }\`.`;
     const value = bare(node);
+    // tracker CONV-parseJsx.ts:669
     if (value.type !== 'ObjectExpression')
-        return say(at, value, 'invalid_binding_map', `\`bindings.${name}\` on ${at.owner} isn't an object. ${fix}`, 'CONV-parseJsx.ts:669');
+        return say(at, value, 'invalid_binding_map', `\`bindings.${name}\` on ${at.owner} isn't an object. ${fix}`);
     for (const property of value.properties) {
         const problem = property.type === 'SpreadElement' ? 'has a spread'
             : property.computed ? 'has a computed key'
@@ -279,7 +309,8 @@ function section(at, name, node) {
                             : getKey(property) === null ? `has the key \`${textOf(at, property.key)}\``
                                 : null;
         if (problem) {
-            say(at, property, 'invalid_binding_map_entry', `\`bindings.${name}\` on ${at.owner} ${problem}. ${fix}`, 'CONV-parseJsx.ts:669');
+            // tracker CONV-parseJsx.ts:669
+            say(at, property, 'invalid_binding_map_entry', `\`bindings.${name}\` on ${at.owner} ${problem}. ${fix}`);
             continue;
         }
         prop(at, getKey(property), property.value, false);
@@ -301,7 +332,8 @@ function classNameConditions(at, terms, where) {
         if (key === null)
             continue;
         if (key.startsWith(VISIBILITY_PREFIX) && !VISIBILITY_KEYS.includes(key.slice(VISIBILITY_PREFIX.length))) {
-            say(at, property, 'unknown_visibility', `${where} on ${at.owner} has the term \`${key}\`, which isn't a visibility. Use \`${VISIBILITY_PREFIX}hidden\` or \`${VISIBILITY_PREFIX}collapsed\`.`, 'CONV-decode.ts:221');
+            // tracker CONV-decode.ts:221
+            say(at, property, 'unknown_visibility', `${where} on ${at.owner} has the term \`${key}\`, which isn't a visibility. Use \`${VISIBILITY_PREFIX}hidden\` or \`${VISIBILITY_PREFIX}collapsed\`.`);
         }
         else
             condition(at, property.value, `${where} term \`${key}\``);
@@ -309,10 +341,12 @@ function classNameConditions(at, terms, where) {
 }
 function prop(at, name, node, placeholderAllowed) {
     const value = bare(node);
+    // tracker CONV-decode.ts:209
     if (value.type === 'ArrayExpression')
-        return say(at, value, 'array_binding_value', `\`bindings.props.${name}\` on ${at.owner} is an array. Bind the prop to one value: \`ctx()\`, \`fn()\` or \`raw()\`.`, 'CONV-decode.ts:209');
+        return say(at, value, 'array_binding_value', `\`bindings.props.${name}\` on ${at.owner} is an array. Bind the prop to one value: \`ctx()\`, \`fn()\` or \`raw()\`.`);
+    // tracker CONV-decode.ts:252
     if (isPlain(value) || rawOnly(value) || isStaticRaw(at, value) || isTyped(value, at.input.rulesApi))
-        return say(at, value, 'static_binding_value', fixedValue(at, name), 'CONV-decode.ts:252');
+        return say(at, value, 'static_binding_value', fixedValue(at, name));
     binding(at, value, 'prop', placeholderAllowed);
 }
 const fixedValue = (at, name) => `\`${name}\` on ${at.owner} is bound to a fixed value. Write it as the attribute \`${name}=…\`, or as an \`fn()\` argument.`;
@@ -328,7 +362,8 @@ function condition(at, node, where, inRemove = false) {
         return binding(at, value, 'condition');
     if (inRemove || value.elements.length > 0) {
         const spread = hasHoleOrSpread(value);
-        say(at, value, 'array_condition', `${where} on ${at.owner} is ${spread ? 'a list with a spread or an empty place' : 'a list'}. Write one condition, or \`all(a, b, …)\`.`, spread ? 'CONV-parseJsx.ts:655' : 'CONV-decode.ts:190');
+        // tracker CONV-decode.ts:190; a list with a spread or a hole: CONV-parseJsx.ts:655
+        say(at, value, 'array_condition', `${where} on ${at.owner} is ${spread ? 'a list with a spread or an empty place' : 'a list'}. Write one condition, or \`all(a, b, …)\`.`);
     }
 }
 function binding(at, node, place, placeholderAllowed = false) {
@@ -357,30 +392,35 @@ function binding(at, node, place, placeholderAllowed = false) {
     const raw = rawOnly(value);
     if (raw === 'an object' && place === 'fnArg' && isDataItem(value))
         return;
+    // tracker CONV-decode.ts:86
     if (raw === 'an object' && place === 'fnArg')
-        return say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is an object that isn't a data item. Write ${PLAIN}, a link (\`{ href: … }\`) or a typed item (\`{ type: 'Builder.Image', … }\`), or wrap it in \`raw()\`.`, 'CONV-decode.ts:86');
+        return say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is an object that isn't a data item. Write ${PLAIN}, a link (\`{ href: … }\`) or a typed item (\`{ type: 'Builder.Image', … }\`), or wrap it in \`raw()\`.`);
     if (raw)
-        return say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is ${raw}. Write ${PLAIN}, or wrap it in \`raw()\`.`, 'CONV-decode.ts:86');
-    say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is ${describeIn(at, value)}. Write it out. ${hintFor(place)}`, 'CONV-decode.ts:86');
+        return say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is ${raw}. Write ${PLAIN}, or wrap it in \`raw()\`.`);
+    say(at, value, 'invalid_binding_value', `${capitalize(name)} on ${at.owner} is ${describeIn(at, value)}. Write it out. ${hintFor(place)}`);
 }
-const wrongPlace = (at, node, what, place) => say(at, node, 'invalid_binding_placement', `${capitalize(what)} can't be ${PLACES[place].name} on ${at.owner}. ${hintFor(place)}`, 'CONV-decode.ts:126');
+// tracker CONV-decode.ts:126
+const wrongPlace = (at, node, what, place) => say(at, node, 'invalid_binding_placement', `${capitalize(what)} can't be ${PLACES[place].name} on ${at.owner}. ${hintFor(place)}`);
 /** A called ctx() or row member: `ctx('cart.add', { from: useCart })(item.id)`, `item.actions.select('quick')` (decode.ts decodeInvoke). */
 function invoke(at, node) {
     const { callee } = node;
+    // tracker CONV-decode.ts:86
     if (!isMethodTarget(callee, at.input.rulesApi))
-        return say(at, node, 'invalid_method_target', `${capitalize(describeIn(at, node))} on ${at.owner} calls what isn't a context or the renderItem row. Call only \`ctx(…)\` or a member of the row: \`ctx('cart.add', { from: useCart })(item.id)\`.`, 'CONV-decode.ts:86');
+        return say(at, node, 'invalid_method_target', `${capitalize(describeIn(at, node))} on ${at.owner} calls what isn't a context or the renderItem row. Call only \`ctx(…)\` or a member of the row: \`ctx('cart.add', { from: useCart })(item.id)\`.`);
     if (callee.type === 'CallExpression')
         ctxCall(at, callee, false);
+    // tracker CONV-astValue.ts:310
     if (node.arguments.some((argument) => argument.type === 'SpreadElement'))
-        return say(at, node, 'spread_builder_arguments', `A called \`ctx()\` or row member on ${at.owner} spreads its arguments. Write each argument out.`, 'CONV-astValue.ts:310');
+        return say(at, node, 'spread_builder_arguments', `A called \`ctx()\` or row member on ${at.owner} spreads its arguments. Write each argument out.`);
     for (const argument of node.arguments)
         binding(at, argument, 'fnArg');
 }
 function call(at, node, builder, place, placeholderAllowed) {
     if (node.arguments.some((argument) => argument.type === 'SpreadElement')) {
-        return say(at, node, 'spread_builder_arguments', `\`${builder}()\` on ${at.owner} spreads its arguments. Write each argument out.`, 'CONV-astValue.ts:310');
+        // tracker CONV-astValue.ts:310
+        return say(at, node, 'spread_builder_arguments', `\`${builder}()\` on ${at.owner} spreads its arguments. Write each argument out.`);
     }
-    // map() and shape() hold a callback, read in its own scope: no tracker row checks its shape yet.
+    // map() and shape() hold a callback, read in its own scope: nothing checks its shape yet.
     if (builder === 'map' || builder === 'shape' || hasDuplicateKey(at, node, builder))
         return;
     if (builder === 'ctx')
@@ -398,8 +438,9 @@ function call(at, node, builder, place, placeholderAllowed) {
 }
 function hasDuplicateKey(at, node, builder) {
     const twice = node.arguments.map(duplicateKeyIn).find(Boolean);
+    // tracker, by builder: all CONV-decode.ts:196, callback and fn CONV-astValue.ts:287, ctx CONV-astValue.ts:276, is CONV-decode.ts:172, raw CONV-decode.ts:28
     if (twice)
-        say(at, twice, 'duplicate_builder_key', `\`${builder}()\` on ${at.owner} has the key \`${getKey(twice)}\` twice. Keep one.`, ROW_OF_BUILDER[builder]);
+        say(at, twice, 'duplicate_builder_key', `\`${builder}()\` on ${at.owner} has the key \`${getKey(twice)}\` twice. Keep one.`);
     return Boolean(twice);
 }
 function ctxCall(at, node, placeholderAllowed) {
@@ -415,16 +456,18 @@ function ctxCall(at, node, placeholderAllowed) {
                         : !keys.includes('from') ? 'has no `from`'
                             : keys.includes('placeholder') && !placeholderAllowed ? 'has a placeholder: only a whole attribute value, or an elementProps entry value, has one'
                                 : null;
+    // tracker CONV-astValue.ts:276
     if (problem)
-        return say(at, node, 'invalid_context_arguments', `\`ctx()\` on ${at.owner} ${problem}. Write \`ctx('item.path', { from: useX })\`.`, 'CONV-astValue.ts:276');
+        return say(at, node, 'invalid_context_arguments', `\`ctx()\` on ${at.owner} ${problem}. Write \`ctx('item.path', { from: useX })\`.`);
     const placeholder = object && getProperty(object, 'placeholder');
     if (placeholder)
         placeholderValue(at, placeholder.value);
 }
 function fnCall(at, node, placeholderAllowed) {
     const [, ...rest] = node.arguments;
+    // tracker CONV-astValue.ts:287
     if (node.arguments.length === 0)
-        return say(at, node, 'missing_function_argument', `\`fn()\` on ${at.owner} has no arguments. Write the imported function first: \`fn(numberToText, …)\`.`, 'CONV-astValue.ts:287');
+        return say(at, node, 'missing_function_argument', `\`fn()\` on ${at.owner} has no arguments. Write the imported function first: \`fn(numberToText, …)\`.`);
     const last = rest.at(-1);
     const options = placeholderAllowed && last ? getObject(last) : null;
     const placeholder = options && options.properties.length === 1 ? getProperty(options, 'placeholder') : undefined;
@@ -438,35 +481,44 @@ function fnCall(at, node, placeholderAllowed) {
 /** `callback(goHome, 2)`: the function (an imported one, a `ctx()` or a member of the row), then its bound arguments (decode.ts decodeCallback). */
 function callbackCall(at, node) {
     const [first, ...bound] = node.arguments;
+    // tracker CONV-astValue.ts:287
     if (!first)
-        return say(at, node, 'missing_function_argument', `\`callback()\` on ${at.owner} has no arguments. Write the function first: \`callback(goHome, …)\`.`, 'CONV-astValue.ts:287');
+        return say(at, node, 'missing_function_argument', `\`callback()\` on ${at.owner} has no arguments. Write the function first: \`callback(<function>, …)\`.`);
     const target = bare(first);
     // A name that isn't a parameter is the imported function: bindingNameImported checks its import.
     const isFunctionName = target.type === 'Identifier' && !getParamReadKind(target);
+    // tracker CONV-decode.ts:86
     if (!isFunctionName && !isMethodTarget(target, at.input.rulesApi))
-        return say(at, target, 'invalid_callback_target', `\`callback()\`'s function on ${at.owner} is ${describeIn(at, target)}. Write an imported function, a \`ctx()\` or a member of the renderItem row: \`callback(goHome, …)\`.`, 'CONV-decode.ts:86');
+        return say(at, target, 'invalid_callback_target', `\`callback()\`'s function on ${at.owner} is ${describeIn(at, target)}. Write an imported function, a \`ctx()\` or a member of the renderItem row: \`callback(<function>, …)\`.`);
     if (target.type === 'CallExpression')
         ctxCall(at, target, false);
     for (const argument of bound)
         binding(at, argument, 'fnArg');
 }
+/** The import stores any JSON value but null as the prop's data (boundProps.ts isPlaceholderValue): the entries of a list, a rich text item. */
 function placeholderValue(at, node) {
     const value = bare(node);
-    if (!isPlain(value))
-        say(at, value, 'invalid_placeholder', `The placeholder on ${at.owner} is ${rawOnly(value) ?? describeIn(at, value)}. Write ${PLAIN}.`, 'CONV-parseJsx.ts:729');
+    const isNull = rawOnly(value) === 'null';
+    const found = isNull ? value : nonLiteralIn(value);
+    // tracker CONV-parseJsx.ts:729
+    if (found)
+        say(at, found, 'invalid_placeholder', `The placeholder on ${at.owner} ${found === value ? 'is' : 'holds'} ${isNull ? 'null' : describeIn(at, found)}. Write ${PLAIN}, or an object or array of them.`);
 }
 function isCall(at, node) {
     const fix = 'Write `is(<ctx() or fn()>, <string or true / false>)`.';
+    // tracker CONV-decode.ts:172
     if (node.arguments.length !== 2)
-        return say(at, node, 'invalid_comparison_arguments', `\`is()\` on ${at.owner} has ${node.arguments.length} argument${node.arguments.length === 1 ? '' : 's'}. ${fix}`, 'CONV-decode.ts:172');
+        return say(at, node, 'invalid_comparison_arguments', `\`is()\` on ${at.owner} has ${node.arguments.length} argument${node.arguments.length === 1 ? '' : 's'}. ${fix}`);
     const [binded, compared] = node.arguments.map((argument) => bare(argument));
+    // tracker CONV-decode.ts:172
     if (isPlain(binded) || rawOnly(binded) || builderOf(binded, at.input.rulesApi) === 'raw' || isTyped(binded, at.input.rulesApi))
-        say(at, binded, 'literal_comparison_binding', `\`is()\` on ${at.owner} compares ${isCallByName(binded) ? `\`${builderOf(binded, at.input.rulesApi)}()\`` : 'a literal'}, not a binding. ${fix}`, 'CONV-decode.ts:172');
+        say(at, binded, 'literal_comparison_binding', `\`is()\` on ${at.owner} compares ${isCallByName(binded) ? `\`${builderOf(binded, at.input.rulesApi)}()\`` : 'a literal'}, not a binding. ${fix}`);
     else
         binding(at, binded, 'isBinding');
     const isStringOrBoolean = compared.type === 'Literal' && ['string', 'boolean'].includes(typeof compared.value);
+    // tracker CONV-decode.ts:172
     if (!isStringOrBoolean)
-        say(at, compared, 'invalid_comparison_value', `\`is()\` on ${at.owner} compares to ${rawOnly(compared) ?? describeIn(at, compared)}. ${fix}`, 'CONV-decode.ts:172');
+        say(at, compared, 'invalid_comparison_value', `\`is()\` on ${at.owner} compares to ${rawOnly(compared) ?? describeIn(at, compared)}. ${fix}`);
 }
 /**
  * A component's `raw()` bindings are one item of the bindings namespace, and its one schema is BindingsList (reservedAttributes.ts
@@ -478,33 +530,39 @@ function checkRawBindingsType(at, node, item) {
     if (stringValue(type?.value) === BINDINGS_LIST)
         return;
     const has = type ? `has the type \`${textOf(at, type.value)}\`` : 'has no `type`';
-    say(at, type?.value ?? node, 'invalid_raw_bindings_type', `The \`raw()\` bindings item on ${at.owner} ${has}. Write \`raw({ type: '${BINDINGS_LIST}', … })\`: the import stores no other bindings item.`, 'CONV-decode.ts:28');
+    // tracker CONV-decode.ts:28; under a <Remove>, also CONV-decode.ts:296
+    say(at, type?.value ?? node, 'invalid_raw_bindings_type', `The \`raw()\` bindings item on ${at.owner} ${has}. Write \`raw({ type: '${BINDINGS_LIST}', … })\`: the import stores no other bindings item.`);
 }
 function allCall(at, node, place) {
     const count = node.arguments.length;
+    // tracker CONV-decode.ts:196
     if (place === 'condition' && count < 2)
-        say(at, node, 'insufficient_conditions', `\`all()\` on ${at.owner} has ${count} condition${count === 1 ? '' : 's'}. Give it two or more, or write the one condition without \`all()\`.`, 'CONV-decode.ts:196');
+        say(at, node, 'insufficient_conditions', `\`all()\` on ${at.owner} has ${count} condition${count === 1 ? '' : 's'}. Give it two or more, or write the one condition without \`all()\`.`);
     for (const argument of node.arguments)
         binding(at, argument, 'allItem');
 }
 function isRawWrittenOut(at, node) {
     const [item, ...extra] = node.arguments;
     if (!item || extra.length > 0) {
-        say(at, node, 'invalid_raw_arguments', `\`raw()\` on ${at.owner} has ${node.arguments.length} arguments. Write one item: \`raw({ type: …, … })\`.`, 'CONV-decode.ts:28');
+        // tracker CONV-decode.ts:28
+        say(at, node, 'invalid_raw_arguments', `\`raw()\` on ${at.owner} has ${node.arguments.length} arguments. Write one item: \`raw({ type: …, … })\`.`);
         return false;
     }
     const value = bare(item);
     if (value.type === 'CallExpression') {
-        say(at, value, 'call_in_raw', `\`raw()\` on ${at.owner} wraps a call (\`${textOf(at, value)}\`). Write the item out as an object, or use the builder without \`raw()\`.`, 'CONV-decode.ts:28');
+        // tracker CONV-decode.ts:28
+        say(at, value, 'call_in_raw', `\`raw()\` on ${at.owner} wraps a call (\`${textOf(at, value)}\`). Write the item out as an object, or use the builder without \`raw()\`.`);
         return false;
     }
     if (value.type !== 'ObjectExpression') {
-        say(at, value, 'non_object_raw', `\`raw()\` on ${at.owner} wraps ${rawOnly(value) ?? describeIn(at, value)}, not an object. Write one item: \`raw({ type: …, … })\`.`, 'CONV-decode.ts:28');
+        // tracker CONV-decode.ts:28
+        say(at, value, 'non_object_raw', `\`raw()\` on ${at.owner} wraps ${rawOnly(value) ?? describeIn(at, value)}, not an object. Write one item: \`raw({ type: …, … })\`.`);
         return false;
     }
     const found = nonLiteralIn(value);
+    // tracker CONV-decode.ts:28
     if (found)
-        say(at, found, 'non_literal_raw', `\`raw()\` on ${at.owner} holds ${describeIn(at, found)}. Write its item out with literal values.`, 'CONV-decode.ts:28');
+        say(at, found, 'non_literal_raw', `\`raw()\` on ${at.owner} holds ${describeIn(at, found)}. Write its item out with literal values.`);
     return !found;
 }
 /** Only BUILDERS: other runtime names (`Remove(…)`) pass the converter's parse, then its decode has no case for them. */
@@ -513,11 +571,12 @@ function isBuilderImported({ rulesApi, report }, callee) {
     if (found?.kind === 'runtime' && found.imported === callee.name && BUILDERS.includes(callee.name))
         return true;
     const builder = found?.kind === 'runtime' ? found.imported : callee.name;
+    // tracker CONV-astValue.ts:296
     report({ check: 'invalid_builder_import',
         loc: callee.loc,
-        message: tracked(BUILDERS.includes(builder)
+        message: BUILDERS.includes(builder)
             ? `\`${callee.name}(…)\` isn't the builder \`${builder}\` from ${RUNTIME_PACKAGE}. Import it under its own name, \`import { ${builder} } from '${RUNTIME_PACKAGE}'\`, and call it as \`${builder}(…)\`.`
-            : `\`${callee.name}(…)\` isn't a builder. In an attribute, only the builders of ${RUNTIME_PACKAGE} are called (${BUILDERS.join(', ')}); write a literal value, or one of them.`, 'CONV-astValue.ts:296'),
+            : `\`${callee.name}(…)\` isn't a builder. In an attribute, only the builders of ${RUNTIME_PACKAGE} are called (${BUILDERS.join(', ')}); write a literal value, or one of them.`,
     });
     return false;
 }
@@ -532,25 +591,28 @@ function bindingNameImported({ node, rulesApi, report, context }, builder) {
     const value = bare(named);
     const what = builder === 'fn' ? "fn()'s function" : builder === 'callback' ? "callback()'s function" : "ctx()'s `from` hook";
     if (value.type !== 'Identifier') {
-        report({ check: 'non_identifier_binding_name', loc: value.loc, message: tracked(`${what} is \`${context.sourceCode.getText(value)}\`. Write an imported name: \`fn(numberToText, …)\`, \`{ from: useProduct }\`.`, 'CONV-astValue.ts:227') });
+        // tracker CONV-astValue.ts:227
+        report({ check: 'non_identifier_binding_name', loc: value.loc, message: `${what} is \`${context.sourceCode.getText(value)}\`. Write an imported name: \`fn(numberToText, …)\`, \`{ from: useProduct }\`.` });
         return null;
     }
     const found = rulesApi.getImport(value);
     const problem = !found
-        ? [`${what} \`${value.name}\` isn't imported. Import it by name from its library: the function's library, or the context's app.`, 'CONV-astValue.ts:227']
+        ? `${what} \`${value.name}\` isn't imported. Import it by name from its library: the function's library, or the context's app.`
         : found.kind && RESERVED_FOR_BINDINGS.includes(found.kind)
-            ? [`${what} \`${value.name}\` comes from ${found.source}, which holds no functions or contexts. Import it from its own library: the function's library, or the context's app.`, 'CONV-astValue.ts:230']
+            ? `${what} \`${value.name}\` comes from ${found.source}, which holds no functions or contexts. Import it from its own library: the function's library, or the context's app.`
             : found.imported === '*'
-                ? [`${what} \`${value.name}\` is a namespace (\`import * as ${value.name}\`). Import the ${builder === 'fn' ? 'function' : 'hook'} itself by name: \`import { name } from '${found.source}'\`.`, 'CONV-astValue.ts:227']
+                ? `${what} \`${value.name}\` is a namespace (\`import * as ${value.name}\`). Import the ${builder === 'fn' ? 'function' : 'hook'} itself by name: \`import { name } from '${found.source}'\`.`
                 : null;
+    // tracker CONV-astValue.ts:227; from a library that holds no functions or contexts: CONV-astValue.ts:230
     if (problem)
-        report({ check: 'invalid_binding_import', loc: value.loc, message: tracked(...problem) });
+        report({ check: 'invalid_binding_import', loc: value.loc, message: problem });
     return found && !problem && builder === 'ctx' ? { hook: value, source: found.source } : null;
 }
 function ctxSourceHasName({ report }, { hook, source }) {
     if (source.indexOf('/') !== source.length - 1)
         return;
-    report({ check: 'missing_context_name', loc: hook.loc, message: tracked(`ctx()'s \`from\` hook \`${hook.name}\` is imported from '${source}', which has no context name after the \`/\`. Write '<componentType>/<contextName>'.`, 'CONV-decode.ts:100') });
+    // tracker CONV-decode.ts:100
+    report({ check: 'missing_context_name', loc: hook.loc, message: `ctx()'s \`from\` hook \`${hook.name}\` is imported from '${source}', which has no context name after the \`/\`. Write '<componentType>/<contextName>'.` });
 }
 // ── reading the code ──
 function getElementPropsEntries(element) {
@@ -656,9 +718,12 @@ function isWrappedByRuntime(element, rulesApi) {
     const kind = rulesApi.getImport(element)?.kind;
     return kind === 'wrapper' || kind === 'siteCode';
 }
-/** A callback prop written as an attribute with a call: `onClick={fn(goHome)}`. */
+/** A callback prop written as an attribute with a call: `onClick={callback(goHome)}`, `onClick={fn(goHome)}`. */
 function getCallbackAttributes(element) {
-    return element.openingElement.attributes.flatMap((attribute) => attribute.type === 'JSXAttribute' && CALLBACK_PROP.test(getName(attribute)) && getExpression(attribute)?.type === 'CallExpression' ? [[getName(attribute), attribute]] : []);
+    return element.openingElement.attributes.flatMap((attribute) => {
+        const value = attribute.type === 'JSXAttribute' && CALLBACK_PROP.test(getName(attribute)) ? getExpression(attribute) : null;
+        return value?.type === 'CallExpression' ? [[getName(attribute), attribute, value]] : [];
+    });
 }
 /** The callback props in `bindings={{ props: { onClick: … } }}`. */
 function getBoundCallbacks(attribute) {
@@ -676,12 +741,14 @@ function runsAtRender(at, node) {
         return RENDER_BUILDERS.includes(builder) ? `\`${builder}()\`` : null;
     return isInvoke(node) || getParamReadKind(node) ? describeIn(at, node) : null;
 }
-/** The data attributes bound to a value the import reads as a binding; not an `on…` attribute, which it doesn't read at all (OUR-031 reports it). */
+/** The data attributes bound to a value the import reads as a binding; an `on…` attribute only with `callback()` (checkCallbackProps reports the rest). */
 function boundAttributes(element, rulesApi) {
     return element.openingElement.attributes.flatMap((attribute) => {
-        if (attribute.type !== 'JSXAttribute' || isReservedAttribute(getName(attribute)) || EVENT_ATTRIBUTE.test(getName(attribute)))
+        if (attribute.type !== 'JSXAttribute' || isReservedAttribute(getName(attribute)))
             return [];
         const value = getExpression(attribute);
+        if (EVENT_ATTRIBUTE.test(getName(attribute)) && !(value && builderOf(value, rulesApi) === 'callback'))
+            return [];
         return isBound(value) && !(value.type === 'CallExpression' && isSvgCall(value, rulesApi)) ? [[getName(attribute), attribute, value]] : [];
     });
 }

package/dist/rules/site-app/breakpoints.js

@@ -36,7 +36,7 @@ function isWellFormed(file, declaration, report) {
     if (hasShape(declaration))
         return true;
     const params = `${declaration.name} ${declaration.query}`.trim();
-    reportCssProblem(report, file.name, declaration.line, 'malformed_custom_media', `\`@custom-media ${params}\` isn't \`--<name> <media query>\`; write it like \`@custom-media --mobile (max-width: 750px);\` (tracker CONV-astParser.ts:328).`);
+    reportCssProblem(report, file.name, declaration.line, 'malformed_custom_media', `\`@custom-media ${params}\` isn't \`--<name> <media query>\`; write it like \`@custom-media --mobile (max-width: 750px);\`.`);
     return false;
 }
 /** Reports a second `@custom-media` of a name the file already declares: the import can't tell two ranges with one name apart (CONV-breakpoints.ts:197). */
@@ -44,7 +44,7 @@ function isFirstOfName(file, declaration, first, report) {
     const earlier = first.get(declaration.name);
     if (!earlier)
         return first.set(declaration.name, declaration), true;
-    reportCssProblem(report, file.name, declaration.line, 'duplicate_breakpoint', `\`@custom-media ${declaration.name}\` is declared again (first at ${file.name}:${earlier.line}). The import can't tell two ranges with one name apart: keep one (tracker CONV-breakpoints.ts:197).`);
+    reportCssProblem(report, file.name, declaration.line, 'duplicate_breakpoint', `\`@custom-media ${declaration.name}\` is declared again (first at ${file.name}:${earlier.line}). The import can't tell two ranges with one name apart: keep one.`);
     return false;
 }
 /** Reports a page file's declaration whose name isn't one of the site's (CONV-astParser.ts:335). */
@@ -52,7 +52,7 @@ function isSiteName(file, declaration, site, report) {
     const names = site.breakpoints.map(({ name }) => name);
     if (names.includes(declaration.name))
         return true;
-    reportCssProblem(report, file.name, declaration.line, 'unknown_breakpoint_name', `\`@custom-media ${declaration.name}\` isn't one of the site's named breakpoints (the theme has ${names.join(', ') || 'none'}). Use a range the site declares; breakpoints are added in the editor, not in CSS (tracker CONV-astParser.ts:335).`);
+    reportCssProblem(report, file.name, declaration.line, 'unknown_breakpoint_name', `\`@custom-media ${declaration.name}\` isn't one of the site's named breakpoints (the theme has ${names.join(', ') || 'none'}). Use a range the site declares; breakpoints are added in the editor, not in CSS.`);
     return false;
 }
 /** Reports a page file's declaration whose range isn't the site's for that name, to the letter: the import compares the text (CONV-astParser.ts:339). */
@@ -60,7 +60,7 @@ function keepsSiteRange(file, declaration, site, report) {
     const exported = getSiteRange(declaration.name, site);
     if (exported.trim() === declaration.query.trim())
         return true;
-    reportCssProblem(report, file.name, declaration.line, 'changed_breakpoint_range', `\`@custom-media ${declaration.name} ${declaration.query}\` changes the site's range for ${declaration.name}, which is \`${exported}\`. Restore it; a breakpoint's width is changed in the editor, not in CSS (tracker CONV-astParser.ts:339).`);
+    reportCssProblem(report, file.name, declaration.line, 'changed_breakpoint_range', `\`@custom-media ${declaration.name} ${declaration.query}\` changes the site's range for ${declaration.name}, which is \`${exported}\`. Restore it; a breakpoint's width is changed in the editor, not in CSS.`);
     return false;
 }
 /** Reports a `@media (--name)` with no declaration of that name in the same file (CONV-breakpoints.ts:57). A malformed declaration of the name (its own line) counts as the declaration, so the use gets no second line. */
@@ -73,7 +73,7 @@ function checkNamedUses(file, site, report) {
         const fix = range
             ? `add \`@custom-media ${name} ${range};\` at the top of ${file.name}, or write the range itself, \`@media ${range}\``
             : `add \`@custom-media ${name} (<its range>);\` at the top of ${file.name} (the range the site gives it), or write the range itself`;
-        reportCssProblem(report, file.name, line, 'undeclared_breakpoint', `\`@media (${name})\` uses a name the file doesn't declare: ${fix} (tracker CONV-breakpoints.ts:57).`);
+        reportCssProblem(report, file.name, line, 'undeclared_breakpoint', `\`@media (${name})\` uses a name the file doesn't declare: ${fix}.`);
     }
 }
 /** Reports each `@media` of a file whose range is none of the site's (P4-R01, CONV-breakpoints.ts:75); nothing without a theme to compare with. A name is read through the file's declaration when that declaration is the site's; otherwise the steps above report it. A component's own breakpoint (inside `@scope`) is compared once unmapped.json is read. */
@@ -86,7 +86,7 @@ function checkRanges(file, site, report) {
         const query = resolve(media, file.declared, site);
         if (query === null || site.breakpoints.some((breakpoint) => canonical(breakpoint.query) === canonical(query)))
             continue;
-        reportCssProblem(report, file.name, media.line, 'unknown_breakpoint_range', `\`${describeAtRule({ name: 'media', params: media.query })}\` is a breakpoint the site doesn't have. Write one of the theme's breakpoints: ${describe(site.breakpoints)} (rule P4-R01; tracker CONV-breakpoints.ts:75). The import refuses a value for a breakpoint the site doesn't have.`);
+        reportCssProblem(report, file.name, media.line, 'unknown_breakpoint_range', `\`${describeAtRule({ name: 'media', params: media.query })}\` is a breakpoint the site doesn't have. Write one of the theme's breakpoints: ${describe(site.breakpoints)}. The import refuses a value for a breakpoint the site doesn't have.`);
     }
 }
 // ── reading the files ──