xmlui 0.9.31 → 0.9.32

package/dist/lib/index.css

@@ -12,7 +12,7 @@
  */
 @scope (#_ui-engine-theme-root) {
   :scope {
-    line-height: 1.5;
+    line-height: 1.7;
     font-feature-settings: var(--xmlui-font-feature-settings);
     font-variation-settings: normal;
     -webkit-font-smoothing: antialiased;
@@ -190,7 +190,7 @@
   html {
     -webkit-text-size-adjust: 100%;
     tab-size: 4;
-    line-height: 1.5;
+    line-height: 1.7;
   }
   body {
     line-height: inherit;

package/dist/lib/language-server-web-worker.mjs

@@ -1,4 +1,4 @@
-import { m as main, s as start } from "./server-common-Cucl1Ik4.mjs";
+import { m as main, s as start } from "./server-common-1aXZ-B7H.mjs";
 var browser = main;
 const messageReader = new browser.BrowserMessageReader(self);
 messageReader.listen((message) => {

package/dist/lib/language-server.mjs

@@ -1,4 +1,4 @@
-import { m as main, s as start$1 } from "./server-common-Cucl1Ik4.mjs";
+import { m as main, s as start$1 } from "./server-common-1aXZ-B7H.mjs";
 var node = main;
 function start() {
   const connection = node.createConnection(node.ProposedFeatures.all);

package/dist/lib/lint-B5OU130e.mjs

@@ -0,0 +1,659 @@
+import { w as COMPOUND_COMP_ID, y as CORE_NAMESPACE_VALUE } from "./transform-B-MhfH46.mjs";
+const attrBreakRegex = /[\r\n<>'"&]/;
+class XmlUiHelper {
+  /**
+   * Serialize the specified XML fragment into a string
+   * @param xml XML fragment to serialize
+   * @param options Formatting options to use
+   */
+  serialize(xml, options) {
+    const fragment = Array.isArray(xml) ? xml : [xml];
+    return serializeFragment(fragment, 0);
+    function serializeFragment(nodes, depth) {
+      return nodes.map((n) => serializeNode(n, depth)).join((options == null ? void 0 : options.prettify) ? "\n" + getIndent(depth) : "");
+    }
+    function serializeNode(node, depth) {
+      switch (node.type) {
+        case "XmlUiComment":
+          return serializeXmlComment(node, depth);
+        case "XmlUiElement":
+          return serializeXmlElement(node, depth);
+        default:
+          return "";
+      }
+    }
+    function getIndent(depth) {
+      return (options == null ? void 0 : options.prettify) ? "".padEnd(((options == null ? void 0 : options.indents) ?? 2) * depth, " ") : "";
+    }
+    function serializeXmlComment(node, depth) {
+      return `${getIndent(depth)}<!--${node.text}-->`;
+    }
+    function serializeXmlElement(node, depth) {
+      var _a, _b;
+      let elementStr = `${getIndent(depth)}<${nodeName()}`;
+      const hasAttrs = (((_a = node.attributes) == null ? void 0 : _a.length) ?? 0) > 0;
+      const hasChildren = (((_b = node.childNodes) == null ? void 0 : _b.length) ?? 0) > 0;
+      if (node.text || hasAttrs || hasChildren) {
+        if (hasAttrs) {
+          const attrTexts = node.attributes.map((a) => serializeXmlAttribute(a));
+          if (!(options == null ? void 0 : options.prettify)) {
+            elementStr += " " + attrTexts.join(" ");
+          } else {
+            const nodeLength = elementStr.length + 1 + // --- Space after
+            attrTexts.join(" ").length + // --- Attributes total length
+            (hasChildren ? 1 : (options == null ? void 0 : options.useSpaceBeforeClose) ?? false ? 3 : 2);
+            if (nodeLength > ((options == null ? void 0 : options.lineLength) ?? 80)) {
+              attrTexts.forEach((text) => {
+                elementStr += "\n" + getIndent(depth + 1) + text;
+              });
+              if ((options == null ? void 0 : options.breakClosingTag) ?? false) {
+                elementStr += "\n" + getIndent(depth);
+              }
+            } else {
+              elementStr += " " + attrTexts.join(" ");
+            }
+          }
+        }
+        if (node.text || hasChildren) {
+          elementStr += ">";
+          if (node.text) {
+            const textContents = node.preserveSpaces ? serializeQuotedText(node.text) : serializeText(node.text);
+            if ((options == null ? void 0 : options.prettify) && elementStr.length + textContents.length + node.name.length + 3 > ((options == null ? void 0 : options.lineLength) ?? 80)) {
+              elementStr += "\n" + getIndent(depth + 1) + textContents + "\n";
+            } else {
+              elementStr += textContents;
+            }
+          }
+          if (hasChildren) {
+            const childrenTexts = node.childNodes.map((c) => serializeNode(c, depth + 1));
+            if (!(options == null ? void 0 : options.prettify)) {
+              elementStr += childrenTexts.join("");
+            } else {
+              childrenTexts.forEach((text) => {
+                elementStr += "\n" + text;
+              });
+              elementStr += "\n";
+            }
+          }
+          elementStr += `${getIndent(depth)}</${node.name}>`;
+        } else {
+          elementStr += ((options == null ? void 0 : options.useSpaceBeforeClose) ?? false ? " " : "") + "/>";
+        }
+      } else {
+        elementStr += ((options == null ? void 0 : options.useSpaceBeforeClose) ?? false ? " " : "") + "/>";
+        if (node.text === "") {
+          elementStr += `""</${nodeName()}>`;
+        }
+      }
+      return elementStr;
+      function nodeName() {
+        return node.namespace ? `${node.namespace}:${node.name}` : node.name;
+      }
+    }
+    function serializeXmlAttribute(node) {
+      if (node.value === void 0 || node.value === null) {
+        return `${nodeName()}`;
+      }
+      if (node.preserveSpaces) {
+        return `${nodeName()}=${serializeQuotedText(node.value)}`;
+      }
+      const value = node.value ?? "";
+      return `${nodeName()}=${serializeQuotedText(value)}`;
+      function nodeName() {
+        return node.namespace ? `${node.namespace}:${node.name}` : node.name;
+      }
+    }
+    function serializeText(text) {
+      return (options == null ? void 0 : options.useQuotes) || attrBreakRegex.test(text) ? serializeQuotedText(text) : text;
+    }
+    function serializeQuotedText(text) {
+      const containsQuote = text.indexOf("'") >= 0;
+      const containsDQuote = text.indexOf('"') >= 0;
+      if (!containsQuote && !containsDQuote || containsQuote && !containsDQuote) {
+        return `"${text.replaceAll("`", "\\`")}"`;
+      }
+      if (containsDQuote && !containsQuote) {
+        return `'${text.replaceAll("`", "\\`")}'`;
+      }
+      return `\`${text.replaceAll("`", "\\`")}\``;
+    }
+  }
+  /**
+   * Transform the specified component definition into an XMLUI node
+   * @param def Component definitions
+   * @param options Transformation options
+   */
+  transformComponentDefinition(def, options) {
+    return def.type ? this.transformSimpleComponentDefinition(def, options) : this.transformCompoundComponentDefinition(def, options);
+  }
+  /**
+   * Transform the specified object into an XMLUI nodes
+   * @param def Object definition
+   * @param options Transformation options
+   */
+  transformObject(def, options) {
+    const transformed = this.transformValue("Object", "", def, options);
+    if (!transformed) {
+      return null;
+    }
+    return transformed.childNodes ?? [];
+  }
+  /**
+   * Transforms the specified simple component definition into an XMLUI node
+   * @param def Component definition
+   * @param options Transformation options
+   */
+  transformSimpleComponentDefinition(def, options) {
+    const componentNode = {
+      type: "XmlUiElement",
+      name: def.type
+    };
+    if (def.uid !== void 0) {
+      this.addProperty(componentNode, "id", def.uid, options);
+    }
+    if (def.testId !== void 0) {
+      this.addProperty(componentNode, "testId", def.testId, options);
+    }
+    if (def.when !== void 0) {
+      this.addProperty(componentNode, "when", def.when, options);
+    }
+    if (def.vars) {
+      Object.keys(def.vars).forEach((key) => {
+        const varElement = this.transformValue("var", key, def.vars[key], options);
+        if (varElement === null) return;
+        componentNode.childNodes ?? (componentNode.childNodes = []);
+        componentNode.childNodes.push(varElement);
+      });
+    }
+    if (def.props) {
+      Object.keys(def.props).forEach((key) => {
+        const propValue = def.props[key];
+        if (key.endsWith("Template") && propValue.type) {
+          componentNode.childNodes ?? (componentNode.childNodes = []);
+          const propWrapper = {
+            type: "XmlUiElement",
+            name: "property",
+            attributes: [
+              {
+                type: "XmlUiAttribute",
+                name: "name",
+                value: key
+              }
+            ]
+          };
+          this.addComponentElement(propWrapper, propValue);
+          componentNode.childNodes.push(propWrapper);
+        } else {
+          if (propValue === void 0) {
+            return;
+          }
+          if (propValue === null) {
+            const nullPropElement = {
+              type: "XmlUiElement",
+              name: "property",
+              attributes: [
+                {
+                  type: "XmlUiAttribute",
+                  name: "name",
+                  value: key
+                }
+              ]
+            };
+            componentNode.childNodes ?? (componentNode.childNodes = []);
+            componentNode.childNodes.push(nullPropElement);
+            return;
+          }
+          if (key === "id" || key === "when" || key === "testId" || (options == null ? void 0 : options.extractProps)) {
+            const idPropElement = {
+              type: "XmlUiElement",
+              name: "property"
+            };
+            this.addProperty(idPropElement, key, propValue, options);
+            componentNode.childNodes ?? (componentNode.childNodes = []);
+            componentNode.childNodes.push(idPropElement);
+            return;
+          }
+          this.addProperty(componentNode, key, propValue, options);
+        }
+      });
+    }
+    if (def.events) {
+      Object.keys(def.events).forEach((key) => {
+        const eventElement = this.transformValue("event", key, def.events[key], options);
+        if (eventElement === null) return;
+        componentNode.childNodes ?? (componentNode.childNodes = []);
+        componentNode.childNodes.push(eventElement);
+      });
+    }
+    if (def.loaders) {
+      this.addComponentList(componentNode, "loaders", def.loaders);
+    }
+    if (def.api) {
+      Object.keys(def.api).forEach((key) => {
+        const apiElement = this.transformValue("api", key, def.api[key], options);
+        if (apiElement === null) return;
+        componentNode.childNodes ?? (componentNode.childNodes = []);
+        componentNode.childNodes.push(apiElement);
+      });
+    }
+    if (def.uses) {
+      this.addList(componentNode, "uses", "", def.uses, options);
+    }
+    if (def.children) {
+      if (typeof def.children === "string") {
+        this.addProperty(componentNode, "children", def.children, options);
+      } else {
+        def.children.forEach((ch) => {
+          this.addComponentElement(componentNode, ch);
+        });
+      }
+    }
+    return componentNode;
+  }
+  /**
+   * Transforms the specified simple component definition into an Xml node
+   * @param def Compound component definition
+   * @param options Transformation options
+   */
+  transformCompoundComponentDefinition(def, options) {
+    if (typeof def === "string") {
+      return {
+        type: "XmlUiElement",
+        name: def
+      };
+    }
+    const nested = this.transformSimpleComponentDefinition(
+      def.component,
+      options
+    );
+    const componentNode = {
+      type: "XmlUiElement",
+      name: COMPOUND_COMP_ID,
+      attributes: [
+        {
+          type: "XmlUiAttribute",
+          name: "name",
+          value: def.name
+        }
+      ],
+      childNodes: Array.isArray(nested) ? [...nested] : [nested]
+    };
+    if (def.api) {
+      Object.keys(def.api).forEach((key) => {
+        const apiElement = this.transformValue("api", key, def.api[key], options);
+        if (apiElement === null) return;
+        componentNode.childNodes ?? (componentNode.childNodes = []);
+        componentNode.childNodes.push(apiElement);
+      });
+    }
+    return componentNode;
+  }
+  /**
+   * Transforms a value into an XMLUI element
+   * @param nodeName Name of the value node
+   * @param name Optional (property) name
+   * @param value Value to transform
+   * @param options Transformation options
+   */
+  transformValue(nodeName, name, value, options) {
+    if (value === void 0) return null;
+    const valueNode = {
+      type: "XmlUiElement",
+      name: nodeName
+    };
+    if (name) {
+      valueNode.attributes = [
+        {
+          type: "XmlUiAttribute",
+          name: "name",
+          value: name
+        }
+      ];
+    }
+    if (value === null) {
+      return valueNode;
+    }
+    if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+      const strValue = typeof value === "string" ? value.toString() : `{${value.toString()}}`;
+      const preserveSpaces = attrBreakRegex.test(strValue) || strValue.trim().length != strValue.length;
+      if (options == null ? void 0 : options.preferTextToValue) {
+        valueNode.text = strValue;
+        valueNode.preserveSpaces = preserveSpaces;
+      } else {
+        valueNode.attributes ?? (valueNode.attributes = []);
+        valueNode.attributes.push({
+          type: "XmlUiAttribute",
+          name: "value",
+          value: strValue,
+          preserveSpaces
+        });
+      }
+      return valueNode;
+    }
+    if (Array.isArray(value)) {
+      if (value.length === 0) {
+        valueNode.attributes ?? (valueNode.attributes = []);
+        valueNode.attributes.push({
+          type: "XmlUiAttribute",
+          name: "value",
+          value: "{[]}"
+        });
+      } else {
+        value.forEach((item) => {
+          const itemElement = this.transformValue("item", void 0, item, options);
+          if (!itemElement) return;
+          valueNode.childNodes ?? (valueNode.childNodes = []);
+          valueNode.childNodes.push(itemElement);
+        });
+      }
+    } else if (typeof value === "object") {
+      const keys = Object.keys(value);
+      if (keys.length === 0) {
+        valueNode.attributes ?? (valueNode.attributes = []);
+        valueNode.attributes.push({
+          type: "XmlUiAttribute",
+          name: "value",
+          value: "{{}}"
+        });
+      } else {
+        keys.forEach((key) => {
+          const fieldElement = this.transformValue("field", key, value[key], options);
+          if (!fieldElement) return;
+          valueNode.childNodes ?? (valueNode.childNodes = []);
+          valueNode.childNodes.push(fieldElement);
+        });
+      }
+    } else {
+      throw new Error(`Cannot serialize '${typeof value}' value`);
+    }
+    return valueNode;
+  }
+  /**
+   * Transforms the specified simple component definition into an Xml node
+   * @param name Element name
+   * @param value Value to transform
+   * @param options Transformation options
+   */
+  transformObjectValue(name, value, options) {
+    const componentNode = {
+      type: "XmlUiElement",
+      name
+    };
+    if (value) {
+      Object.keys(value).forEach(
+        (key) => this.addProperty(componentNode, key, value[key], options)
+      );
+    }
+    return componentNode;
+  }
+  /**
+   * Add a property to the specified XMLUI element
+   * @param element XML element
+   * @param name Element name
+   * @param value Element value
+   * @param options Transformation options
+   */
+  addProperty(element, name, value, options) {
+    switch (typeof value) {
+      case "undefined":
+        break;
+      case "string":
+        element.attributes ?? (element.attributes = []);
+        element.attributes.push({
+          type: "XmlUiAttribute",
+          name,
+          value: value == null ? void 0 : value.toString(),
+          preserveQuotes: (options == null ? void 0 : options.removeQuotes) ?? false,
+          preserveSpaces: attrBreakRegex.test(value.toString())
+        });
+        break;
+      case "boolean":
+      case "number":
+      case "object":
+        const objElement = this.transformValue("property", name, value, options);
+        if (objElement) {
+          element.childNodes ?? (element.childNodes = []);
+          element.childNodes.push(objElement);
+        }
+        break;
+      default:
+        throw new Error(`'${typeof value}' transformation is not implemented yet`);
+    }
+  }
+  addComponentElement(element, component) {
+    element.childNodes ?? (element.childNodes = []);
+    const childDef = this.transformComponentDefinition(component);
+    if (Array.isArray(childDef)) {
+      element.childNodes.push(...childDef);
+    } else {
+      element.childNodes.push(childDef);
+    }
+  }
+  /**
+   * Adds a list to the specified XML element
+   * @param element XML element
+   * @param name Name of the list (child in `element`)
+   * @param prefix Prefix to use for the list
+   * @param list List with items
+   * @param options Transformation options
+   */
+  addList(element, name, prefix, list, options) {
+    const nodeName = `${prefix ? prefix + "." : ""}${name}`;
+    element.childNodes ?? (element.childNodes = []);
+    list.forEach((item) => {
+      if (typeof item === "string") {
+        element.childNodes.push({
+          type: "XmlUiElement",
+          name: nodeName,
+          text: item,
+          preserveSpaces: attrBreakRegex.test(item) || item !== item.trim() || item === ""
+        });
+      } else if (item === null) {
+        element.childNodes.push({
+          type: "XmlUiElement",
+          name: nodeName
+        });
+      } else {
+        const transformed = this.transformObjectValue(nodeName, item, options);
+        if (Array.isArray(transformed)) {
+          element.childNodes.push(...transformed);
+        } else {
+          element.childNodes.push(transformed);
+        }
+      }
+    });
+  }
+  /**
+   * Adds a component list to the specified element
+   * @param element XML element
+   * @param name Name to use for the wrapper element
+   * @param list List with component items
+   * @private
+   */
+  addComponentList(element, name, list) {
+    const children = [];
+    list.forEach((item) => {
+      const fragment = this.transformSimpleComponentDefinition(item);
+      if (Array.isArray(fragment)) {
+        children.push(...fragment);
+      } else {
+        children.push(fragment);
+      }
+    });
+    const listElement = {
+      type: "XmlUiElement",
+      name,
+      childNodes: children
+    };
+    element.childNodes ?? (element.childNodes = []);
+    element.childNodes.push(listElement);
+  }
+}
+const componentFileExtension = "xmlui";
+const codeBehindFileExtension = "xmlui.xs";
+const moduleFileExtension = "xs";
+var LintSeverity = /* @__PURE__ */ ((LintSeverity2) => {
+  LintSeverity2[LintSeverity2["Skip"] = 0] = "Skip";
+  LintSeverity2[LintSeverity2["Warning"] = 1] = "Warning";
+  LintSeverity2[LintSeverity2["Error"] = 2] = "Error";
+  return LintSeverity2;
+})(LintSeverity || {});
+var LintDiagKind = /* @__PURE__ */ ((LintDiagKind2) => {
+  LintDiagKind2[LintDiagKind2["UnrecognisedProp"] = 0] = "UnrecognisedProp";
+  return LintDiagKind2;
+})(LintDiagKind || {});
+function getLintSeverity(lintSeverityOption) {
+  if (!lintSeverityOption) {
+    return 1;
+  }
+  switch (lintSeverityOption.toLowerCase()) {
+    case "warning":
+      return 1;
+    case "error":
+      return 2;
+    case "skip":
+      return 0;
+    default:
+      console.warn(`Invalid lint severity option '${lintSeverityOption}'. Must be one of: 'warning', 'error', 'skip'. Defaulting to 'warning'.`);
+      return 1;
+  }
+}
+function lintApp({
+  appDef,
+  metadataProvider
+}) {
+  const entryPointLints = {
+    componentName: "Main",
+    lints: lint({
+      component: appDef.entryPoint,
+      metadataProvider
+    })
+  };
+  const compoundCompLints = (appDef.components ?? []).map((c) => {
+    const lints = lint({
+      component: c,
+      metadataProvider
+    });
+    return { lints, componentName: c.name };
+  });
+  return [entryPointLints, ...compoundCompLints].filter((diags) => diags.lints.length > 0);
+}
+function printComponentLints(lintDiags) {
+  console.group(`Validation on '${lintDiags.componentName}':`);
+  lintDiags.lints.forEach(({ message }) => {
+    console.warn(message);
+  });
+  console.groupEnd();
+}
+function lintErrorsComponent(lints) {
+  function makeComponent() {
+    const errList = lints.map((lint2, idx) => {
+      return {
+        type: "VStack",
+        props: { gap: "0px" },
+        children: [
+          {
+            type: "VStack",
+            props: { "backgroundColor": "lightgrey", padding: "10px" },
+            children: [
+              {
+                type: "H2",
+                props: {
+                  value: `#${idx + 1}: In component '${lint2.componentName}':`,
+                  color: "$color-info"
+                }
+              },
+              {
+                type: "VStack",
+                children: lint2.lints.map(({ message }, msgIdx) => {
+                  return {
+                    type: "Text",
+                    props: { value: `${idx + 1}.${msgIdx + 1}: ${message}`, fontWeight: "bold" }
+                  };
+                })
+              }
+            ]
+          }
+        ]
+      };
+    });
+    const comp = {
+      type: "VStack",
+      props: { padding: "$padding-normal", gap: 0 },
+      children: [
+        {
+          type: "H1",
+          props: {
+            value: `Errors found while checking Xmlui markup`,
+            padding: "$padding-normal",
+            backgroundColor: "$color-error",
+            color: "white"
+          }
+        },
+        {
+          type: "VStack",
+          props: {
+            gap: "$gap-tight",
+            padding: "$padding-normal"
+          },
+          children: errList
+        }
+      ]
+    };
+    return comp;
+  }
+  return makeComponent();
+}
+function lint({
+  component,
+  metadataProvider
+}) {
+  if ("component" in component) {
+    return lintHelp(component.component, metadataProvider, []);
+  }
+  return lintHelp(component, metadataProvider, []);
+}
+function lintHelp(component, metadataProvider, acc) {
+  const componentName = component.type.startsWith(CORE_NAMESPACE_VALUE) ? component.type.slice(CORE_NAMESPACE_VALUE.length + 1) : component.type;
+  const componentMdProvider = metadataProvider.getComponent(componentName);
+  if (componentMdProvider !== null && !componentMdProvider.allowArbitraryProps) {
+    lintAttrs(component, componentMdProvider, acc);
+  }
+  if (!component.children) {
+    return acc;
+  }
+  for (const child of component.children) {
+    lintHelp(child, metadataProvider, acc);
+  }
+  return acc;
+}
+function lintAttrs(component, metadataForCurrentComponent, diags) {
+  const invalidAttrNames = Object.keys(component.props ?? {}).filter((name) => !metadataForCurrentComponent.getAttr(name));
+  const invalidEvents = Object.keys(component.events ?? {}).filter((event) => !metadataForCurrentComponent.getEvent(event));
+  const invalidApis = Object.keys(component.api ?? {}).filter((api) => !metadataForCurrentComponent.getApi(api));
+  invalidAttrNames.push(...invalidEvents);
+  invalidAttrNames.push(...invalidApis);
+  for (const invalidAttrName of invalidAttrNames) {
+    diags.push(toUnrecognisedAttrDiag(component, invalidAttrName));
+  }
+}
+function toUnrecognisedAttrDiag(component, attr) {
+  return {
+    message: `Unrecognised property '${attr}' on component '${component.type}'.`,
+    kind: 0
+    /* UnrecognisedProp */
+  };
+}
+export {
+  LintSeverity as L,
+  XmlUiHelper as X,
+  codeBehindFileExtension as a,
+  LintDiagKind as b,
+  componentFileExtension as c,
+  lintErrorsComponent as d,
+  lint as e,
+  getLintSeverity as g,
+  lintApp as l,
+  moduleFileExtension as m,
+  printComponentLints as p
+};