@design.estate/wcctools 6.0.0 → 6.2.0

package/ts/standards/rules/index.ts

@@ -0,0 +1,87 @@
+import type { IStandardRule } from '../rule.js';
+import { barrelElementIndexRule } from './barrel.element-index.js';
+import { barrelNoDemoExportRule } from './barrel.no-demo-export.js';
+import { demoFixtureNotExportedRule } from './demo.fixture-not-exported.js';
+import { demoGroupsRule } from './demo.groups.js';
+import { demoRequiredRule } from './demo.required.js';
+import { demoSeparateFileRule } from './demo.separate-file.js';
+import { demoShapeRule } from './demo.shape.js';
+import { docsComponentIndexRule } from './docs.component-index.js';
+import { elementExportedRule } from './element.exported.js';
+import { elementLiteralTagRule } from './element.literal-tag.js';
+import { elementReachableRule } from './element.reachable.js';
+import { elementTagMapRule } from './element.tag-map.js';
+import { i18nLiteralsRule } from './i18n.literals.js';
+import { layoutElementFolderRule } from './layout.element-folder.js';
+import { layoutEntryFileNameRule } from './layout.entry-file-name.js';
+import { layoutEntryRule } from './layout.entry.js';
+import { layoutGroupFolderRule } from './layout.group-folder.js';
+import { layoutShared00Rule } from './layout.shared-00.js';
+import { namingClassMatchesTagRule } from './naming.class-matches-tag.js';
+import { namingLowercaseFilesRule } from './naming.lowercase-files.js';
+import { namingTagPrefixRule } from './naming.tag-prefix.js';
+import { propsAccessorRule } from './props.accessor.js';
+import { propsObjectNoAttributeRule } from './props.object-no-attribute.js';
+import { propsReflectPrimitiveRule } from './props.reflect-primitive.js';
+import { propsTypedRule } from './props.typed.js';
+import { styleBdThemeRule } from './style.bdtheme.js';
+
+export { reflectExemptNames } from './props.reflect-primitive.js';
+export { renderComponentIndex } from './docs.component-index.js';
+
+/** Every rule of docs/standard.md, in the order of the document. */
+export const standardRules: readonly IStandardRule[] = [
+  layoutEntryRule,
+  layoutElementFolderRule,
+  layoutEntryFileNameRule,
+  layoutGroupFolderRule,
+  layoutShared00Rule,
+  namingLowercaseFilesRule,
+  namingTagPrefixRule,
+  namingClassMatchesTagRule,
+  elementLiteralTagRule,
+  elementExportedRule,
+  elementTagMapRule,
+  elementReachableRule,
+  barrelElementIndexRule,
+  barrelNoDemoExportRule,
+  demoShapeRule,
+  demoRequiredRule,
+  demoSeparateFileRule,
+  demoGroupsRule,
+  demoFixtureNotExportedRule,
+  propsAccessorRule,
+  propsTypedRule,
+  propsReflectPrimitiveRule,
+  propsObjectNoAttributeRule,
+  styleBdThemeRule,
+  i18nLiteralsRule,
+  docsComponentIndexRule,
+];
+
+/**
+ * The order `wcctools fix` applies rules in: content edits first, then file moves (which rewrite imports),
+ * then barrels and reachability on the final layout, then the generated docs.
+ */
+export const fixOrder: readonly string[] = [
+  'element/exported',
+  'element/tag-map',
+  'props/accessor',
+  'props/typed',
+  'props/object-no-attribute',
+  'props/reflect-primitive',
+  'demo/groups',
+  'demo/required',
+  'barrel/no-demo-export',
+  'demo/fixture-not-exported',
+  'naming/lowercase-files',
+  'layout/shared-00',
+  'layout/entry-file-name',
+  'layout/element-folder',
+  'barrel/element-index',
+  'element/reachable',
+  'docs/component-index',
+];
+
+/** Findings the checker itself produces for the allowlist. */
+export const allowlistStaleRuleId = 'allowlist/stale';

package/ts/standards/rules/layout.element-folder.ts

@@ -0,0 +1,49 @@
+import { baseOf, dirOf } from '../helpers.paths.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { catalogElements, elementKey, elementsDir, isCustomElementName, isElementParentDir, isInElementFolder } from './shared.js';
+
+/** Every element's entry file lives in its own element folder `ts_web/elements/[00group-<area>/]<tag>/<tag>.ts`. */
+export const layoutElementFolderRule: IStandardRule = {
+  id: 'layout/element-folder',
+  severity: { base: 'warn' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    const elements = catalogElements(project);
+    for (const element of elements) {
+      if (!element.tag || isInElementFolder(element)) {
+        continue;
+      }
+      const currentDir = dirOf(element.file);
+      const group = /^ts_web\/elements\/(00group-[^/]+)(\/|$)/.exec(currentDir)?.[1];
+      const folder = `${elementsDir}/${group ? `${group}/` : ''}${element.tag}`;
+      const finding: IRuleFinding = {
+        file: element.file,
+        position: element.decoratorCall.getStart(),
+        key: elementKey(element),
+        message: `<${element.tag}> is declared in ${element.file}; its element folder is ${folder}/`,
+      };
+      const elementsInFile = elements.filter((otherArg) => otherArg.file === element.file);
+      const folderTaken = [...project.files.keys()].some((fileArg) => fileArg.startsWith(`${folder}/`)) || project.exists(folder);
+      // Only flat files move mechanically: a misnamed folder holds more than this element. The folder
+      // is named after the tag, so only a valid custom element name is usable.
+      if (isCustomElementName(element.tag) && elementsInFile.length === 1 && isElementParentDir(currentDir) && !folderTaken) {
+        const tag = element.tag;
+        const companions = [...project.files.keys()].filter((fileArg) =>
+          fileArg !== element.file && dirOf(fileArg) === currentDir && baseOf(fileArg).startsWith(`${tag}.`) && baseOf(fileArg) !== 'index.ts');
+        finding.fix = (builderArg) => {
+          const entry = `${folder}/${tag}.ts`;
+          const index = `${folder}/index.ts`;
+          builderArg.create(index, `export * from './${tag}.js';\n`);
+          builderArg.move(element.file, entry);
+          for (const companion of companions) {
+            builderArg.move(companion, `${folder}/${baseOf(companion)}`);
+          }
+          builderArg.redirectBarrelExports(element.file, index);
+        };
+      }
+      findings.push(finding);
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/layout.entry-file-name.ts

@@ -0,0 +1,73 @@
+import * as plugins from '../../plugins.js';
+import * as ast from '../helpers.ast.js';
+import { baseOf, dirOf, isDemoFile, resolveSpecifier } from '../helpers.paths.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { catalogElements, elementKey, isCustomElementName, isInElementFolder, rootIdentifier } from './shared.js';
+
+const ts = plugins.typescript;
+
+/** Inside an element folder the entry file is `<tag>.ts` and the demo file is `<tag>.demo.ts`. */
+export const layoutEntryFileNameRule: IStandardRule = {
+  id: 'layout/entry-file-name',
+  severity: { base: 'warn' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    const elements = catalogElements(project);
+    for (const element of elements) {
+      if (!element.tag || !isInElementFolder(element)) {
+        continue;
+      }
+      const tag = element.tag;
+      // The expected file names come from the tag: only a valid custom element name is usable for a move.
+      const usableTag = isCustomElementName(tag);
+      const folder = dirOf(element.file);
+      const entry = `${folder}/${tag}.ts`;
+      if (element.file !== entry) {
+        const finding: IRuleFinding = {
+          file: element.file,
+          position: element.decoratorCall.getStart(),
+          key: elementKey(element),
+          message: `the entry file of <${tag}> is ${baseOf(element.file)}; expected ${tag}.ts`,
+        };
+        if (usableTag && elements.filter((otherArg) => otherArg.file === element.file).length === 1 && !project.exists(entry)) {
+          finding.fix = (builderArg) => builderArg.move(element.file, entry);
+        }
+        findings.push(finding);
+      }
+      // The demo file the static demo is imported from.
+      const demoMember = ast.findStaticProperty(element.classNode, 'demo');
+      const initializer = demoMember?.initializer;
+      if (!initializer) {
+        continue;
+      }
+      const references = ts.isArrayLiteralExpression(initializer) ? [...initializer.elements] : [initializer];
+      const demoFiles = new Set<string>();
+      for (const reference of references) {
+        const identifier = rootIdentifier(reference);
+        const source = identifier ? ast.importSourceOf(element.sourceFile, identifier) : null;
+        const resolved = source ? resolveSpecifier(element.file, source, (fileArg) => project.files.has(fileArg)) : null;
+        if (resolved && isDemoFile(resolved.target) && dirOf(resolved.target) === folder) {
+          demoFiles.add(resolved.target);
+        }
+      }
+      const expectedDemo = `${folder}/${tag}.demo.ts`;
+      for (const demoFile of demoFiles) {
+        if (demoFile === expectedDemo) {
+          continue;
+        }
+        const finding: IRuleFinding = {
+          file: element.file,
+          position: demoMember!.getStart(),
+          key: elementKey(element),
+          message: `the demo file of <${tag}> is ${baseOf(demoFile)}; expected ${tag}.demo.ts`,
+        };
+        if (usableTag && demoFiles.size === 1 && !project.exists(expectedDemo)) {
+          finding.fix = (builderArg) => builderArg.move(demoFile, expectedDemo);
+        }
+        findings.push(finding);
+      }
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/layout.entry.ts

@@ -0,0 +1,40 @@
+import * as plugins from '../../plugins.js';
+import * as ast from '../helpers.ast.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+
+const ts = plugins.typescript;
+
+/** `html/index.ts` exists and calls `setupWccTools({ sections })`; `html/index.html` exists. */
+export const layoutEntryRule: IStandardRule = {
+  id: 'layout/entry',
+  severity: { base: 'error' },
+  fixMode: 'none',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    const entry = 'html/index.ts';
+    if (!project.files.has(entry)) {
+      findings.push({ file: entry, position: 0, key: entry, message: 'html/index.ts is missing' });
+    } else {
+      let found = false;
+      const visit = (nodeArg: ast.TNode): void => {
+        if (ts.isCallExpression(nodeArg) && ast.calleeName(nodeArg.expression) === 'setupWccTools') {
+          const config = nodeArg.arguments[0];
+          if (config && ts.isObjectLiteralExpression(config) && config.properties.some((propertyArg) =>
+            (ts.isPropertyAssignment(propertyArg) || ts.isShorthandPropertyAssignment(propertyArg))
+            && ts.isIdentifier(propertyArg.name) && propertyArg.name.text === 'sections')) {
+            found = true;
+          }
+        }
+        ts.forEachChild(nodeArg, visit);
+      };
+      visit(project.sourceFile(entry));
+      if (!found) {
+        findings.push({ file: entry, position: 0, key: entry, message: 'html/index.ts does not call setupWccTools({ sections })' });
+      }
+    }
+    if (!project.files.has('html/index.html')) {
+      findings.push({ file: 'html/index.html', position: 0, key: 'html/index.html', message: 'html/index.html is missing' });
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/layout.group-folder.ts

@@ -0,0 +1,23 @@
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { catalogElements, elementKey } from './shared.js';
+
+/** dees: element folders sit under `ts_web/elements/00group-<area>/`. */
+export const layoutGroupFolderRule: IStandardRule = {
+  id: 'layout/group-folder',
+  severity: { dees: 'warn' },
+  fixMode: 'none',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    for (const element of catalogElements(project)) {
+      if (element.file.startsWith('ts_web/elements/') && !/^ts_web\/elements\/00group-[^/]+\//.test(element.file)) {
+        findings.push({
+          file: element.file,
+          position: element.decoratorCall.getStart(),
+          key: elementKey(element),
+          message: `<${element.tag ?? '?'}> is not inside a ts_web/elements/00group-<area>/ folder`,
+        });
+      }
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/layout.shared-00.ts

@@ -0,0 +1,37 @@
+import { baseOf, dirOf, isDemoFile } from '../helpers.paths.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { elementsDir } from './shared.js';
+
+/** A module at the root of `ts_web/elements/` that declares no element is named `00<name>.ts`. */
+export const layoutShared00Rule: IStandardRule = {
+  id: 'layout/shared-00',
+  severity: { base: 'info' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    const rootElements = project.elements.filter((elementArg) => dirOf(elementArg.file) === elementsDir);
+    const elementFiles = new Set(project.elements.map((elementArg) => elementArg.file));
+    for (const file of project.webFiles) {
+      const name = baseOf(file);
+      if (dirOf(file) !== elementsDir || name === 'index.ts' || name.startsWith('00') || isDemoFile(file) || elementFiles.has(file)) {
+        continue;
+      }
+      // Companion files of a flat element (`<tag>.styles.ts`) move with the element instead.
+      if (rootElements.some((elementArg) => elementArg.tag && name.startsWith(`${elementArg.tag}.`))) {
+        continue;
+      }
+      const target = `${elementsDir}/00${name}`;
+      const finding: IRuleFinding = {
+        file,
+        position: 0,
+        key: file,
+        message: `${name} declares no element; shared modules at the root of ts_web/elements are named 00${name}`,
+      };
+      if (!project.exists(target)) {
+        finding.fix = (builderArg) => builderArg.move(file, target);
+      }
+      findings.push(finding);
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/naming.class-matches-tag.ts

@@ -0,0 +1,27 @@
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { catalogElements, elementKey } from './shared.js';
+
+/** The class name, lowercased, equals the tag with hyphens removed. */
+export const namingClassMatchesTagRule: IStandardRule = {
+  id: 'naming/class-matches-tag',
+  severity: { base: 'warn' },
+  fixMode: 'none',
+  allowlistCategories: ['published'],
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    for (const element of catalogElements(project)) {
+      if (!element.tag || !element.className) {
+        continue;
+      }
+      if (element.className.toLowerCase() !== element.tag.replace(/-/g, '')) {
+        findings.push({
+          file: element.file,
+          position: element.classNode.name!.getStart(),
+          key: elementKey(element),
+          message: `class ${element.className} does not match <${element.tag}>`,
+        });
+      }
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/naming.lowercase-files.ts

@@ -0,0 +1,27 @@
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+
+/** File and folder names under `ts_web/` are lowercase. */
+export const namingLowercaseFilesRule: IStandardRule = {
+  id: 'naming/lowercase-files',
+  severity: { base: 'error' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    const lowered = new Map<string, number>();
+    for (const file of project.files.keys()) {
+      lowered.set(file.toLowerCase(), (lowered.get(file.toLowerCase()) ?? 0) + 1);
+    }
+    for (const file of project.webFiles) {
+      if (!/[A-Z]/.test(file)) {
+        continue;
+      }
+      const target = file.toLowerCase();
+      const finding: IRuleFinding = { file, position: 0, key: file, message: `${file} is not lowercase; expected ${target}` };
+      if (lowered.get(target) === 1 && !project.exists(target)) {
+        finding.fix = (builderArg) => builderArg.move(file, target);
+      }
+      findings.push(finding);
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/naming.tag-prefix.ts

@@ -0,0 +1,24 @@
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { elementKey } from './shared.js';
+
+/** Every tag starts with `<tagPrefix>-`. Applies to fixture elements in demo files too: they share the page. */
+export const namingTagPrefixRule: IStandardRule = {
+  id: 'naming/tag-prefix',
+  severity: { base: 'error' },
+  fixMode: 'none',
+  allowlistCategories: ['published'],
+  detect: ({ project, config }) => {
+    const findings: IRuleFinding[] = [];
+    for (const element of project.elements) {
+      if (element.tag && !element.tag.startsWith(`${config.tagPrefix}-`)) {
+        findings.push({
+          file: element.file,
+          position: element.decoratorCall.getStart(),
+          key: elementKey(element),
+          message: `<${element.tag}> does not start with the tag prefix '${config.tagPrefix}-'`,
+        });
+      }
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/props.accessor.ts

@@ -0,0 +1,37 @@
+import * as plugins from '../../plugins.js';
+import * as ast from '../helpers.ast.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { propertyKey } from './shared.js';
+
+const ts = plugins.typescript;
+
+/** Members decorated with `@property` or `@state` use the `accessor` keyword (standard decorators). */
+export const propsAccessorRule: IStandardRule = {
+  id: 'props/accessor',
+  severity: { base: 'error' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    if (project.experimentalDecorators) {
+      return findings;
+    }
+    for (const property of project.properties) {
+      const member = property.member;
+      if (!ts.isPropertyDeclaration(member) || ast.hasModifier(member, ts.SyntaxKind.AccessorKeyword)) {
+        continue;
+      }
+      const finding: IRuleFinding = {
+        file: property.file,
+        position: member.name.getStart(),
+        key: propertyKey(property),
+        message: `@${property.decorator} ${property.name} is a field; standard decorators need 'accessor ${property.name}'`,
+      };
+      if (!ast.hasModifier(member, ts.SyntaxKind.DeclareKeyword)) {
+        const at = member.name.getStart();
+        finding.fix = (builderArg) => builderArg.edit(property.file, at, at, 'accessor ');
+      }
+      findings.push(finding);
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/props.object-no-attribute.ts

@@ -0,0 +1,45 @@
+import * as plugins from '../../plugins.js';
+import * as ast from '../helpers.ast.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { addOptionFix } from './props.typed.js';
+import { coreTypeOf, isArrayTypeNode, propertyKey, publicProperties } from './shared.js';
+
+const ts = plugins.typescript;
+
+/** An array, object literal type or `I`-prefixed interface annotation. */
+const isObjectAnnotation = (typeArg: ast.TTypeNode | null): boolean => {
+  if (!typeArg) {
+    return false;
+  }
+  return isArrayTypeNode(typeArg)
+    || ts.isTypeLiteralNode(typeArg)
+    || (ts.isTypeReferenceNode(typeArg) && ts.isIdentifier(typeArg.typeName) && /^I[A-Z]/.test(typeArg.typeName.text));
+};
+
+/** A public property holding an object or array declares `type: Object`/`type: Array` or `attribute: false`. */
+export const propsObjectNoAttributeRule: IStandardRule = {
+  id: 'props/object-no-attribute',
+  severity: { base: 'warn' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    for (const property of publicProperties(project)) {
+      if (property.dynamicOptions || !isObjectAnnotation(coreTypeOf(property))) {
+        continue;
+      }
+      const options = property.options;
+      const type = options ? ast.objectPropertyText(options, 'type') : null;
+      if (type === 'Object' || type === 'Array' || (options && ast.objectPropertyText(options, 'attribute') === 'false')) {
+        continue;
+      }
+      findings.push({
+        file: property.file,
+        position: property.call.getStart(),
+        key: propertyKey(property),
+        message: `@property ${property.name} holds an object or array but declares neither type: Object/Array nor attribute: false`,
+        fix: addOptionFix(property, 'attribute: false', 'last'),
+      });
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/props.reflect-primitive.ts

@@ -0,0 +1,44 @@
+import * as ast from '../helpers.ast.js';
+import type { IRuleFinding, IStandardRule } from '../rule.js';
+import { addOptionFix } from './props.typed.js';
+import { propertyKey, publicProperties } from './shared.js';
+
+/** Global attributes with native behaviour that stay unreflected without an allowlist entry. */
+export const reflectExemptNames: readonly string[] = ['title', 'hidden', 'dir', 'lang', 'role', 'inert', 'draggable'];
+
+const primitiveTypes = ['String', 'Number', 'Boolean'];
+
+/** A primitive public property declares `reflect: true` or `attribute: false`. */
+export const propsReflectPrimitiveRule: IStandardRule = {
+  id: 'props/reflect-primitive',
+  severity: { base: 'error' },
+  fixMode: 'opt-in',
+  allowlistCategories: ['user-data', 'object', 'large-text', 'global-attribute'],
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    for (const property of publicProperties(project)) {
+      if (property.dynamicOptions || reflectExemptNames.includes(property.name)) {
+        continue;
+      }
+      const options = property.options;
+      const type = options ? ast.objectPropertyText(options, 'type') : null;
+      if (type !== null && !primitiveTypes.includes(type)) {
+        continue;
+      }
+      if (options && (ast.objectPropertyText(options, 'attribute') === 'false' || ast.objectPropertyText(options, 'reflect') === 'true')) {
+        continue;
+      }
+      const explicitReflect = options ? ast.objectProperty(options, 'reflect') : null;
+      findings.push({
+        file: property.file,
+        position: property.call.getStart(),
+        key: propertyKey(property),
+        message: `public primitive @property ${property.name} declares neither reflect: true nor attribute: false`,
+        fix: explicitReflect
+          ? (builderArg) => builderArg.edit(property.file, explicitReflect.initializer.getStart(), explicitReflect.initializer.end, 'true')
+          : addOptionFix(property, 'reflect: true', 'last'),
+      });
+    }
+    return findings;
+  },
+};

package/ts/standards/rules/props.typed.ts

@@ -0,0 +1,70 @@
+import * as plugins from '../../plugins.js';
+import * as ast from '../helpers.ast.js';
+import type { IStandardProperty } from '../classes.standardproject.js';
+import type { IRuleFinding, IStandardRule, TFixAction } from '../rule.js';
+import { coreTypeOf, isArrayTypeNode, propertyKey, publicProperties } from './shared.js';
+
+const ts = plugins.typescript;
+
+/** The Lit `type` that the property's annotation maps to, or null when the annotation does not decide it. */
+const litTypeFor = (propertyArg: IStandardProperty): string | null => {
+  const typeNode = coreTypeOf(propertyArg);
+  if (!typeNode) {
+    return null;
+  }
+  switch (typeNode.kind) {
+    case ts.SyntaxKind.StringKeyword:
+      return 'String';
+    case ts.SyntaxKind.NumberKeyword:
+      return 'Number';
+    case ts.SyntaxKind.BooleanKeyword:
+      return 'Boolean';
+  }
+  if (ts.isUnionTypeNode(typeNode) && typeNode.types.every((typeArg) =>
+    (ts.isLiteralTypeNode(typeArg) && ts.isStringLiteral(typeArg.literal))
+    || typeArg.kind === ts.SyntaxKind.UndefinedKeyword
+    || (ts.isLiteralTypeNode(typeArg) && typeArg.literal.kind === ts.SyntaxKind.NullKeyword))) {
+    return 'String';
+  }
+  if (ts.isLiteralTypeNode(typeNode) && ts.isStringLiteral(typeNode.literal)) {
+    return 'String';
+  }
+  return isArrayTypeNode(typeNode) ? 'Array' : null;
+};
+
+/** The edit that adds `propertyTextArg` to a property decorator's options, creating the options literal when absent. */
+export const addOptionFix = (propertyArg: IStandardProperty, propertyTextArg: string, placementArg: 'first' | 'last'): TFixAction => (builderArg) => {
+  if (propertyArg.options) {
+    const edit = placementArg === 'first'
+      ? ast.prependObjectPropertyEdit(propertyArg.options, propertyTextArg)
+      : ast.appendObjectPropertyEdit(propertyArg.options, propertyTextArg);
+    builderArg.edit(propertyArg.file, edit.start, edit.end, edit.text);
+    return;
+  }
+  const at = propertyArg.call.arguments.pos;
+  builderArg.edit(propertyArg.file, at, at, `{ ${propertyTextArg} }`);
+};
+
+/** A public property declares `type`. */
+export const propsTypedRule: IStandardRule = {
+  id: 'props/typed',
+  severity: { base: 'warn' },
+  fixMode: 'auto',
+  detect: ({ project }) => {
+    const findings: IRuleFinding[] = [];
+    for (const property of publicProperties(project)) {
+      if (property.dynamicOptions || (property.options && ast.objectProperty(property.options, 'type'))) {
+        continue;
+      }
+      const litType = litTypeFor(property);
+      findings.push({
+        file: property.file,
+        position: property.call.getStart(),
+        key: propertyKey(property),
+        message: `@property ${property.name} declares no type`,
+        fix: litType ? addOptionFix(property, `type: ${litType}`, 'first') : undefined,
+      });
+    }
+    return findings;
+  },
+};