@drupal-canvas/eslint-config 0.3.0 → 0.4.0

package/README.md

@@ -33,12 +33,13 @@ export default defineConfig([
 The following custom rules are part of the `required` config and validate Drupal
 Canvas Code Components:
 
-| Rule                           | Description                                                                                             |
-| ------------------------------ | ------------------------------------------------------------------------------------------------------- |
-| `component-dir-name`           | Validates that `machineName` matches the directory name (index-style) or filename prefix (named-style). |
-| `component-exports`            | Validates that component has a default export.                                                          |
-| `component-image-example-urls` | Validates that `canvas.module/image` prop examples use fully qualified image URLs.                      |
-| `component-prop-names`         | Validates that component prop IDs match the camelCase version of their titles.                          |
+| Rule                                           | Description                                                                                             |
+| ---------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
+| `component-dir-name`                           | Validates that `machineName` matches the directory name (index-style) or filename prefix (named-style). |
+| `component-exports`                            | Validates that component has a default export.                                                          |
+| `component-prop-example-value-image-url`       | Validates that `canvas.module/image` prop examples use fully qualified image URLs.                      |
+| `component-prop-example-value-no-empty-string` | Validates that string prop examples do not contain empty string values.                                 |
+| `component-prop-names`                         | Validates that component prop IDs match the camelCase version of their titles.                          |
 
 ### Deprecated rules
 

package/dist/index.js

@@ -320,9 +320,9 @@ var require_ignore = __commonJS({
           };
         }
         if (checkPattern(pattern.pattern)) {
-          const rule9 = createRule(pattern, this._ignoreCase);
+          const rule10 = createRule(pattern, this._ignoreCase);
           this._added = true;
-          this._rules.push(rule9);
+          this._rules.push(rule10);
         }
       }
       // @param {Array<string> | string | Ignore} pattern
@@ -344,18 +344,18 @@ var require_ignore = __commonJS({
         let ignored = false;
         let unignored = false;
         let matchedRule;
-        this._rules.forEach((rule9) => {
-          const { negative } = rule9;
+        this._rules.forEach((rule10) => {
+          const { negative } = rule10;
           if (unignored === negative && ignored !== unignored || negative && !ignored && !unignored && !checkUnignored) {
             return;
           }
-          const matched = rule9[mode].test(path2);
+          const matched = rule10[mode].test(path2);
           if (!matched) {
             return;
           }
           ignored = !negative;
           unignored = negative;
-          matchedRule = negative ? UNDEFINED : rule9;
+          matchedRule = negative ? UNDEFINED : rule10;
         });
         const ret = {
           ignored,
@@ -577,6 +577,15 @@ function getYAMLStringValue(node) {
   }
   return null;
 }
+function isYAMLMapping(node) {
+  return node?.type === "YAMLMapping";
+}
+function isYAMLSequence(node) {
+  return node?.type === "YAMLSequence";
+}
+function getYAMLMappingPair(mapping, key) {
+  return mapping.pairs.find((pair) => getYAMLStringValue(pair.key) === key);
+}
 
 // src/rules/component-dir-name.ts
 var NAMED_SUFFIX2 = ".component.yml";
@@ -668,104 +677,6 @@ var rule2 = {
   }
 };
 var component_exports_default = rule2;
-
-// src/rules/component-image-example-urls.ts
-var IMAGE_REF = "json-schema-definitions://canvas.module/image";
-function getMappingPair(mapping, key) {
-  return mapping.pairs.find((pair) => getYAMLStringValue(pair.key) === key);
-}
-function isYamlMapping(node) {
-  return node?.type === "YAMLMapping";
-}
-function isYamlSequence(node) {
-  return node?.type === "YAMLSequence";
-}
-function hasImageRef(propMapping) {
-  const ref = getYAMLStringValue(
-    getMappingPair(propMapping, "$ref")?.value ?? null
-  );
-  if (ref === IMAGE_REF) {
-    return true;
-  }
-  const itemsValue = getMappingPair(propMapping, "items")?.value;
-  if (!isYamlMapping(itemsValue)) {
-    return false;
-  }
-  return getYAMLStringValue(getMappingPair(itemsValue, "$ref")?.value ?? null) === IMAGE_REF;
-}
-function isFullyQualifiedUrl(value) {
-  try {
-    const parsed = new URL(value);
-    return parsed.protocol.length > 0 && parsed.hostname.length > 0;
-  } catch {
-    return false;
-  }
-}
-function getInvalidImageExampleNodes(examplesValue) {
-  if (!isYamlSequence(examplesValue)) {
-    return [];
-  }
-  const invalidNodes = [];
-  for (const example of examplesValue.entries) {
-    const imageEntries = isYamlSequence(example) ? example.entries : [example];
-    for (const imageEntry of imageEntries) {
-      if (!isYamlMapping(imageEntry)) {
-        continue;
-      }
-      const srcNode = getMappingPair(imageEntry, "src")?.value;
-      if (srcNode?.type === "YAMLScalar" && typeof srcNode.value === "string" && !isFullyQualifiedUrl(srcNode.value)) {
-        invalidNodes.push(srcNode);
-      }
-    }
-  }
-  return invalidNodes;
-}
-var rule3 = {
-  meta: {
-    type: "problem",
-    docs: {
-      description: "Validates that default examples for image props use fully-qualified URLs"
-    }
-  },
-  create(context) {
-    if (!isComponentYmlFile(context.filename)) {
-      return {};
-    }
-    return {
-      YAMLPair(node) {
-        const keyName = getYAMLStringValue(node.key);
-        if (keyName !== "props" || !isYamlMapping(node.value)) {
-          return;
-        }
-        const propertiesValue = getMappingPair(node.value, "properties")?.value;
-        if (!isYamlMapping(propertiesValue)) {
-          return;
-        }
-        for (const propPair of propertiesValue.pairs) {
-          const propId = getYAMLStringValue(propPair.key);
-          if (!propId || !isYamlMapping(propPair.value)) {
-            continue;
-          }
-          if (!hasImageRef(propPair.value)) {
-            continue;
-          }
-          const examplesValue = getMappingPair(
-            propPair.value,
-            "examples"
-          )?.value;
-          const invalidNodes = getInvalidImageExampleNodes(examplesValue);
-          for (const invalidNode of invalidNodes) {
-            context.report({
-              node: invalidNode,
-              message: `Image prop "${propId}" example src must be a fully-qualified URL with both scheme and host. Use a placeholder URL such as https://placehold.co/600x400.`
-            });
-          }
-        }
-      }
-    };
-  }
-};
-var component_image_example_urls_default = rule3;
 var Gt = (n7, t, e) => {
   let s = n7 instanceof RegExp ? ce(n7, e) : n7, i = t instanceof RegExp ? ce(t, e) : t, r = s !== null && i != null && ss(s, i, e);
   return r && { start: r[0], end: r[1], pre: e.slice(0, r[0]), body: e.slice(r[0] + s.length, r[1]), post: e.slice(r[1] + i.length) };
@@ -4670,7 +4581,7 @@ function checkImportSource(context, node, source) {
     return;
   }
 }
-var rule4 = {
+var rule3 = {
   meta: {
     type: "problem",
     docs: {
@@ -4696,32 +4607,218 @@ var rule4 = {
     };
   }
 };
-var component_imports_default = rule4;
-function extractProps(propsNode) {
-  if (!propsNode.value || propsNode.value.type !== "YAMLMapping") {
+var component_imports_default = rule3;
+
+// src/rules/component-prop-example-value-image-url.ts
+var IMAGE_REF = "json-schema-definitions://canvas.module/image";
+function hasImageRef(propMapping) {
+  const ref = getYAMLStringValue(
+    getYAMLMappingPair(propMapping, "$ref")?.value ?? null
+  );
+  if (ref === IMAGE_REF) {
+    return true;
+  }
+  const itemsValue = getYAMLMappingPair(propMapping, "items")?.value;
+  if (!isYAMLMapping(itemsValue)) {
+    return false;
+  }
+  return getYAMLStringValue(
+    getYAMLMappingPair(itemsValue, "$ref")?.value ?? null
+  ) === IMAGE_REF;
+}
+function isFullyQualifiedUrl(value) {
+  try {
+    const parsed = new URL(value);
+    return parsed.protocol.length > 0 && parsed.hostname.length > 0;
+  } catch {
+    return false;
+  }
+}
+function getInvalidImageExampleNodes(examplesValue) {
+  if (!isYAMLSequence(examplesValue)) {
     return [];
   }
-  const propsMapping = propsNode.value;
-  const propertiesPair = propsMapping.pairs.find(
-    (p) => getYAMLStringValue(p.key) === "properties"
+  const invalidNodes = [];
+  for (const example of examplesValue.entries) {
+    const imageEntries = isYAMLSequence(example) ? example.entries : [example];
+    for (const imageEntry of imageEntries) {
+      if (!isYAMLMapping(imageEntry)) {
+        continue;
+      }
+      const srcNode = getYAMLMappingPair(imageEntry, "src")?.value;
+      if (srcNode?.type === "YAMLScalar" && typeof srcNode.value === "string" && !isFullyQualifiedUrl(srcNode.value)) {
+        invalidNodes.push(srcNode);
+      }
+    }
+  }
+  return invalidNodes;
+}
+var rule4 = {
+  meta: {
+    type: "problem",
+    docs: {
+      description: "Validates that default examples for image props use fully-qualified URLs"
+    }
+  },
+  create(context) {
+    if (!isComponentYmlFile(context.filename)) {
+      return {};
+    }
+    return {
+      YAMLPair(node) {
+        const keyName = getYAMLStringValue(node.key);
+        if (keyName !== "props" || !isYAMLMapping(node.value)) {
+          return;
+        }
+        const propertiesValue = getYAMLMappingPair(
+          node.value,
+          "properties"
+        )?.value;
+        if (!isYAMLMapping(propertiesValue)) {
+          return;
+        }
+        for (const propPair of propertiesValue.pairs) {
+          const propId = getYAMLStringValue(propPair.key);
+          if (!propId || !isYAMLMapping(propPair.value)) {
+            continue;
+          }
+          if (!hasImageRef(propPair.value)) {
+            continue;
+          }
+          const examplesValue = getYAMLMappingPair(
+            propPair.value,
+            "examples"
+          )?.value;
+          const invalidNodes = getInvalidImageExampleNodes(examplesValue);
+          for (const invalidNode of invalidNodes) {
+            context.report({
+              node: invalidNode,
+              message: `Image prop "${propId}" example src must be a fully-qualified URL with both scheme and host. Use a placeholder URL such as https://placehold.co/600x400.`
+            });
+          }
+        }
+      }
+    };
+  }
+};
+var component_prop_example_value_image_url_default = rule4;
+
+// src/rules/component-prop-example-value-no-empty-string.ts
+function isEmptyStringScalar(node) {
+  return node?.type === "YAMLScalar" && node.value === "";
+}
+function getStringExampleMode(propMapping) {
+  const type2 = getYAMLStringValue(
+    getYAMLMappingPair(propMapping, "type")?.value ?? null
   );
-  if (!propertiesPair || !propertiesPair.value || propertiesPair.value.type !== "YAMLMapping") {
+  if (type2 === "string") {
+    return "string";
+  }
+  if (type2 !== "array") {
+    return null;
+  }
+  const itemsValue = getYAMLMappingPair(propMapping, "items")?.value;
+  if (!isYAMLMapping(itemsValue)) {
+    return null;
+  }
+  return getYAMLStringValue(
+    getYAMLMappingPair(itemsValue, "type")?.value ?? null
+  ) === "string" ? "string-array" : null;
+}
+function getInvalidExampleNodes(examplesValue, mode) {
+  if (!isYAMLSequence(examplesValue)) {
+    return [];
+  }
+  if (mode === "string") {
+    const invalidNodes2 = [];
+    for (const example of examplesValue.entries) {
+      if (isEmptyStringScalar(example)) {
+        invalidNodes2.push(example);
+      }
+    }
+    return invalidNodes2;
+  }
+  const invalidNodes = [];
+  for (const example of examplesValue.entries) {
+    if (!isYAMLSequence(example)) {
+      continue;
+    }
+    for (const item of example.entries) {
+      if (isEmptyStringScalar(item)) {
+        invalidNodes.push(item);
+      }
+    }
+  }
+  return invalidNodes;
+}
+var rule5 = {
+  meta: {
+    type: "problem",
+    docs: {
+      description: "Validates that string prop examples do not contain empty string values"
+    }
+  },
+  create(context) {
+    if (!isComponentYmlFile(context.filename)) {
+      return {};
+    }
+    return {
+      YAMLPair(node) {
+        const keyName = getYAMLStringValue(node.key);
+        if (keyName !== "props" || !isYAMLMapping(node.value)) {
+          return;
+        }
+        const propertiesValue = getYAMLMappingPair(
+          node.value,
+          "properties"
+        )?.value;
+        if (!isYAMLMapping(propertiesValue)) {
+          return;
+        }
+        for (const propPair of propertiesValue.pairs) {
+          const propId = getYAMLStringValue(propPair.key);
+          if (!propId || !isYAMLMapping(propPair.value)) {
+            continue;
+          }
+          const mode = getStringExampleMode(propPair.value);
+          if (!mode) {
+            continue;
+          }
+          const examplesValue = getYAMLMappingPair(
+            propPair.value,
+            "examples"
+          )?.value;
+          const invalidNodes = getInvalidExampleNodes(examplesValue, mode);
+          for (const invalidNode of invalidNodes) {
+            context.report({
+              node: invalidNode,
+              message: `Prop "${propId}" example values must not be empty strings. Remove the empty example or use a non-empty placeholder value.`
+            });
+          }
+        }
+      }
+    };
+  }
+};
+var component_prop_example_value_no_empty_string_default = rule5;
+function extractProps(propsNode) {
+  if (!isYAMLMapping(propsNode.value)) {
+    return [];
+  }
+  const propertiesValue = getYAMLMappingPair(
+    propsNode.value,
+    "properties"
+  )?.value;
+  if (!isYAMLMapping(propertiesValue)) {
     return [];
   }
-  const propertiesMapping = propertiesPair.value;
   const props = [];
-  for (const pair of propertiesMapping.pairs) {
+  for (const pair of propertiesValue.pairs) {
     const propId = getYAMLStringValue(pair.key);
     if (!propId) continue;
-    if (!pair.value || pair.value.type !== "YAMLMapping") continue;
-    const propMapping = pair.value;
-    const titlePair = propMapping.pairs.find(
-      (p) => getYAMLStringValue(p.key) === "title"
-    );
+    if (!isYAMLMapping(pair.value)) continue;
     let title = null;
-    if (titlePair) {
-      title = getYAMLStringValue(titlePair.value);
-    }
+    title = getYAMLStringValue(getYAMLMappingPair(pair.value, "title")?.value);
     props.push({
       id: propId,
       title,
@@ -4730,7 +4827,7 @@ function extractProps(propsNode) {
   }
   return props;
 }
-var rule5 = {
+var rule6 = {
   meta: {
     type: "problem",
     docs: {
@@ -4771,7 +4868,7 @@ var rule5 = {
     };
   }
 };
-var component_prop_names_default = rule5;
+var component_prop_names_default = rule6;
 
 // src/configs/required.ts
 var required = defineConfig([
@@ -4795,18 +4892,20 @@ var required = defineConfig([
     plugins: {
       "drupal-canvas": {
         rules: {
+          "component-prop-example-value-image-url": component_prop_example_value_image_url_default,
+          "component-prop-example-value-no-empty-string": component_prop_example_value_no_empty_string_default,
           "component-dir-name": component_dir_name_default,
           "component-exports": component_exports_default,
-          "component-image-example-urls": component_image_example_urls_default,
           "component-imports": component_imports_default,
           "component-prop-names": component_prop_names_default
         }
       }
     },
     rules: {
+      "drupal-canvas/component-prop-example-value-image-url": "error",
+      "drupal-canvas/component-prop-example-value-no-empty-string": "error",
       "drupal-canvas/component-dir-name": "error",
       "drupal-canvas/component-exports": "error",
-      "drupal-canvas/component-image-example-urls": "error",
       "drupal-canvas/component-imports": "error",
       "drupal-canvas/component-prop-names": "error"
     }
@@ -4854,7 +4953,7 @@ var IGNORED_FILES = [
 function isFileAllowed(fileName, allowedFiles) {
   return allowedFiles.some((allowedFile) => allowedFile === fileName);
 }
-var rule6 = {
+var rule7 = {
   meta: {
     type: "problem",
     docs: {
@@ -4893,7 +4992,7 @@ var rule6 = {
     };
   }
 };
-var component_files_default = rule6;
+var component_files_default = rule7;
 function checkImportSource2(context, node, source) {
   if (source.startsWith("./") || source.startsWith("../")) {
     context.report({
@@ -5022,7 +5121,7 @@ function checkImportSource2(context, node, source) {
     message: `Importing "${source}" is not supported. If this is a local import via a path alias, use the "@/components/" alias instead. If you are importing a third-party package, see the list of supported packages at https://project.pages.drupalcode.org/canvas/code-components/packages. (The status of supporting any third-party package can be tracked at https://drupal.org/i/3560197.)`
   });
 }
-var rule7 = {
+var rule8 = {
   meta: {
     type: "problem",
     docs: {
@@ -5049,7 +5148,7 @@ var rule7 = {
     };
   }
 };
-var component_imports_deprecated_default = rule7;
+var component_imports_deprecated_default = rule8;
 function findTopmostComponentsParentDir(currentParentDir, rootDir) {
   if (currentParentDir === rootDir) {
     return currentParentDir;
@@ -5070,7 +5169,7 @@ function hasComponentSubdirectories(dirPath) {
   }
   return false;
 }
-var rule8 = {
+var rule9 = {
   meta: {
     type: "problem",
     docs: {
@@ -5105,7 +5204,7 @@ var rule8 = {
     };
   }
 };
-var component_no_hierarchy_default = rule8;
+var component_no_hierarchy_default = rule9;
 
 // src/configs/requiredDeprecated.ts
 var required2 = defineConfig([

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drupal-canvas/eslint-config",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "ESLint config for validating Drupal Canvas Code Components",
   "license": "MIT",
   "repository": {