@codemirror/lang-html - npm Package Compare versions

Comparing version 6.0.0 to 6.1.0

CHANGELOG.md

@@ -0,1 +1,7 @@
+## 6.1.0 (2022-06-22)
+
+### New features
+
+It is now possible to pass in options to extend the set of tags and attributes provided by autocompletion.
+
 ## 6.0.0 (2022-06-08)
@@ -2,0 +8,0 @@

dist/index.d.ts

@@ -6,2 +6,18 @@ import * as _codemirror_state from '@codemirror/state';
 /**
+Type used to specify tags to complete.
+*/
+interface TagSpec {
+    /**
+    Define tag-specific attributes. Property names are attribute
+    names, and property values can be null to indicate free-form
+    attributes, or a list of strings for suggested attribute values.
+    */
+    attrs?: Record<string, null | readonly string[]>;
+    /**
+    Can be used to specify a list of child tags that are valid
+    inside this tag. The default is to allow any tag.
+    */
+    children?: readonly string[];
+}
+/**
 HTML tag completion. Opens and closes tags and attributes in a
@@ -11,2 +27,16 @@ context-aware way.
 declare function htmlCompletionSource(context: CompletionContext): CompletionResult | null;
+/**
+Create a completion source for HTML extended with additional tags
+or attributes.
+*/
+declare function htmlCompletionSourceWith(config: {
+    /**
+    Define extra tag names to complete.
+    */
+    extraTags?: Record<string, TagSpec>;
+    /**
+    Add global attributes that are available on all tags.
+    */
+    extraGlobalAttributes?: Record<string, null | readonly string[]>;
+}): (context: CompletionContext) => CompletionResult | null;
 
@@ -38,2 +68,10 @@ /**
     autoCloseTags?: boolean;
+    /**
+    Add additional tags that can be completed.
+    */
+    extraTags?: Record<string, TagSpec>;
+    /**
+    Add additional completable attributes to all tags.
+    */
+    extraGlobalAttributes?: Record<string, null | readonly string[]>;
 }): LanguageSupport;
@@ -46,2 +84,2 @@ /**
 
-export { autoCloseTags, html, htmlCompletionSource, htmlLanguage };
+export { TagSpec, autoCloseTags, html, htmlCompletionSource, htmlCompletionSourceWith, htmlLanguage };

dist/index.js

@@ -359,4 +359,11 @@ import { parser, configureNesting } from '@lezer/html';
 };
-const AllTags = /*@__PURE__*/Object.keys(Tags);
-const GlobalAttrNames = /*@__PURE__*/Object.keys(GlobalAttrs);
+class Schema {
+    constructor(extraTags, extraAttrs) {
+        this.tags = Object.assign(Object.assign({}, Tags), extraTags);
+        this.globalAttrs = Object.assign(Object.assign({}, GlobalAttrs), extraAttrs);
+        this.allTags = Object.keys(this.tags);
+        this.globalAttrNames = Object.keys(this.globalAttrs);
+    }
+}
+Schema.default = /*@__PURE__*/new Schema;
 function elementName(doc, tree, max = doc.length) {
@@ -379,5 +386,5 @@ if (!tree)
 }
-function allowedChildren(doc, tree) {
-    let parentInfo = Tags[elementName(doc, findParentElement(tree, true))];
-    return (parentInfo === null || parentInfo === void 0 ? void 0 : parentInfo.children) || AllTags;
+function allowedChildren(doc, tree, schema) {
+    let parentInfo = schema.tags[elementName(doc, findParentElement(tree, true))];
+    return (parentInfo === null || parentInfo === void 0 ? void 0 : parentInfo.children) || schema.allTags;
 }
@@ -396,6 +403,7 @@ function openTags(doc, tree) {
 const identifier = /^[:\-\.\w\u00b7-\uffff]*$/;
-function completeTag(state, tree, from, to) {
+function completeTag(state, schema, tree, from, to) {
     let end = /\s*>/.test(state.sliceDoc(to, to + 5)) ? "" : ">";
     return { from, to,
-        options: allowedChildren(state.doc, tree).map(tagName => ({ label: tagName, type: "type" })).concat(openTags(state.doc, tree).map((tag, i) => ({ label: "/" + tag, apply: "/" + tag + end, type: "type", boost: 99 - i }))),
+        options: allowedChildren(state.doc, tree, schema).map(tagName => ({ label: tagName, type: "type" })).concat(openTags(state.doc, tree).map((tag, i) => ({ label: "/" + tag, apply: "/" + tag + end,
+            type: "type", boost: 99 - i }))),
         validFor: /^\/?[:\-\.\w\u00b7-\uffff]*$/ };
@@ -409,5 +417,5 @@ }
 }
-function completeStartTag(state, tree, pos) {
+function completeStartTag(state, schema, tree, pos) {
     let options = [], level = 0;
-    for (let tagName of allowedChildren(state.doc, tree))
+    for (let tagName of allowedChildren(state.doc, tree, schema))
         options.push({ label: "<" + tagName, type: "type" });
@@ -418,5 +426,5 @@ for (let open of openTags(state.doc, tree))
 }
-function completeAttrName(state, tree, from, to) {
-    let elt = findParentElement(tree), info = elt ? Tags[elementName(state.doc, elt)] : null;
-    let names = (info && info.attrs ? Object.keys(info.attrs).concat(GlobalAttrNames) : GlobalAttrNames);
+function completeAttrName(state, schema, tree, from, to) {
+    let elt = findParentElement(tree), info = elt ? schema.tags[elementName(state.doc, elt)] : null;
+    let names = (info && info.attrs ? Object.keys(info.attrs).concat(schema.globalAttrNames) : schema.globalAttrNames);
     return { from, to,
@@ -426,3 +434,3 @@ options: names.map(attrName => ({ label: attrName, type: "property" })),
 }
-function completeAttrValue(state, tree, from, to) {
+function completeAttrValue(state, schema, tree, from, to) {
     var _a;
@@ -433,5 +441,5 @@ let nameNode = (_a = tree.parent) === null || _a === void 0 ? void 0 : _a.getChild("AttributeName");
         let attrName = state.sliceDoc(nameNode.from, nameNode.to);
-        let attrs = GlobalAttrs[attrName];
+        let attrs = schema.globalAttrs[attrName];
         if (!attrs) {
-            let elt = findParentElement(tree), info = elt ? Tags[elementName(state.doc, elt)] : null;
+            let elt = findParentElement(tree), info = elt ? schema.tags[elementName(state.doc, elt)] : null;
             attrs = (info === null || info === void 0 ? void 0 : info.attrs) && info.attrs[attrName];
@@ -457,7 +465,3 @@ }
 }
-/**
-HTML tag completion. Opens and closes tags and attributes in a
-context-aware way.
-*/
-function htmlCompletionSource(context) {
+function htmlCompletionFor(schema, context) {
     let { state, pos } = context, around = syntaxTree(state).resolveInner(pos), tree = around.resolve(pos, -1);
@@ -473,6 +477,6 @@ for (let scan = pos, before; around == tree && (before = tree.childBefore(scan));) {
         return tree.parent && /CloseTag$/.test(tree.parent.name) ? completeCloseTag(state, tree, tree.from, pos)
-            : completeTag(state, tree, tree.from, pos);
+            : completeTag(state, schema, tree, tree.from, pos);
     }
     else if (tree.name == "StartTag") {
-        return completeTag(state, tree, pos, pos);
+        return completeTag(state, schema, tree, pos, pos);
     }
@@ -483,9 +487,9 @@ else if (tree.name == "StartCloseTag" || tree.name == "IncompleteCloseTag") {
     else if (context.explicit && (tree.name == "OpenTag" || tree.name == "SelfClosingTag") || tree.name == "AttributeName") {
-        return completeAttrName(state, tree, tree.name == "AttributeName" ? tree.from : pos, pos);
+        return completeAttrName(state, schema, tree, tree.name == "AttributeName" ? tree.from : pos, pos);
     }
     else if (tree.name == "Is" || tree.name == "AttributeValue" || tree.name == "UnquotedAttributeValue") {
-        return completeAttrValue(state, tree, tree.name == "Is" ? pos : tree.from, pos);
+        return completeAttrValue(state, schema, tree, tree.name == "Is" ? pos : tree.from, pos);
     }
     else if (context.explicit && (around.name == "Element" || around.name == "Text" || around.name == "Document")) {
-        return completeStartTag(state, tree, pos);
+        return completeStartTag(state, schema, tree, pos);
     }
@@ -496,2 +500,18 @@ else {
 }
+/**
+HTML tag completion. Opens and closes tags and attributes in a
+context-aware way.
+*/
+function htmlCompletionSource(context) {
+    return htmlCompletionFor(Schema.default, context);
+}
+/**
+Create a completion source for HTML extended with additional tags
+or attributes.
+*/
+function htmlCompletionSourceWith(config) {
+    let { extraTags, extraGlobalAttributes: extraAttrs } = config;
+    let schema = extraAttrs || extraTags ? new Schema(extraTags, extraAttrs) : Schema.default;
+    return (context) => htmlCompletionFor(schema, context);
+}
 
@@ -570,3 +590,3 @@ /**
     return new LanguageSupport(lang, [
-        htmlLanguage.data.of({ autocomplete: htmlCompletionSource }),
+        htmlLanguage.data.of({ autocomplete: htmlCompletionSourceWith(config) }),
         config.autoCloseTags !== false ? autoCloseTags : [],
@@ -610,2 +630,2 @@ javascript().support,
 
-export { autoCloseTags, html, htmlCompletionSource, htmlLanguage };
+export { autoCloseTags, html, htmlCompletionSource, htmlCompletionSourceWith, htmlLanguage };

package.json

 {
   "name": "@codemirror/lang-html",
-  "version": "6.0.0",
+  "version": "6.1.0",
   "description": "HTML language support for the CodeMirror code editor",
@@ -5,0 +5,0 @@ "scripts": {

README.md

@@ -5,10 +5,10 @@ <!-- NOTE: README.md is generated from src/README.md -->
 
-[ [**WEBSITE**](https://codemirror.net/6/) | [**ISSUES**](https://github.com/codemirror/codemirror.next/issues) | [**FORUM**](https://discuss.codemirror.net/c/next/) | [**CHANGELOG**](https://github.com/codemirror/lang-html/blob/main/CHANGELOG.md) ]
+[ [**WEBSITE**](https://codemirror.net/) | [**ISSUES**](https://github.com/codemirror/dev/issues) | [**FORUM**](https://discuss.codemirror.net/c/next/) | [**CHANGELOG**](https://github.com/codemirror/lang-html/blob/main/CHANGELOG.md) ]
 
 This package implements HTML language support for the
-[CodeMirror](https://codemirror.net/6/) code editor.
+[CodeMirror](https://codemirror.net/) code editor.
 
-The [project page](https://codemirror.net/6/) has more information, a
-number of [examples](https://codemirror.net/6/examples/) and the
-[documentation](https://codemirror.net/6/docs/).
+The [project page](https://codemirror.net/) has more information, a
+number of [examples](https://codemirror.net/examples/) and the
+[documentation](https://codemirror.net/docs/).
 
@@ -27,3 +27,3 @@ This code is released under an
 <dt id="user-content-html">
-  <code><strong><a href="#user-content-html">html</a></strong>(<a id="user-content-html^config" href="#user-content-html^config">config</a>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a> = {}) → <a href="https://codemirror.net/6/docs/ref#language.LanguageSupport">LanguageSupport</a></code></dt>
+  <code><strong><a href="#user-content-html">html</a></strong>(<a id="user-content-html^config" href="#user-content-html^config">config</a>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a> = {}) → <a href="https://codemirror.net/docs/ref#language.LanguageSupport">LanguageSupport</a></code></dt>
 
@@ -50,3 +50,3 @@ <dd><p>Language support for HTML, including
 <dt id="user-content-htmllanguage">
-  <code><strong><a href="#user-content-htmllanguage">htmlLanguage</a></strong>: <a href="https://codemirror.net/6/docs/ref#language.LRLanguage">LRLanguage</a></code></dt>
+  <code><strong><a href="#user-content-htmllanguage">htmlLanguage</a></strong>: <a href="https://codemirror.net/docs/ref#language.LRLanguage">LRLanguage</a></code></dt>
 
@@ -59,3 +59,3 @@ <dd><p>A language provider based on the <a href="https://github.com/lezer-parser/html">Lezer HTML
 <dt id="user-content-htmlcompletion">
-  <code><strong><a href="#user-content-htmlcompletion">htmlCompletion</a></strong>: <a href="https://codemirror.net/6/docs/ref#state.Extension">Extension</a></code></dt>
+  <code><strong><a href="#user-content-htmlcompletion">htmlCompletion</a></strong>: <a href="https://codemirror.net/docs/ref#state.Extension">Extension</a></code></dt>
 
@@ -66,3 +66,3 @@ <dd><p>HTML tag completion. Opens and closes tags and attributes in a
 <dt id="user-content-autoclosetags">
-  <code><strong><a href="#user-content-autoclosetags">autoCloseTags</a></strong>: <a href="https://codemirror.net/6/docs/ref#state.Extension">Extension</a></code></dt>
+  <code><strong><a href="#user-content-autoclosetags">autoCloseTags</a></strong>: <a href="https://codemirror.net/docs/ref#state.Extension">Extension</a></code></dt>
 
@@ -69,0 +69,0 @@ <dd><p>Extension that will automatically insert close tags when a <code>&gt;</code> or

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

57802

increased by5.87%

Lines of code

1314

increased by6.4%

No dependency changes