xmlui 0.9.56 → 0.9.58

package/dist/scripts/src/components/Switch/Switch.js

@@ -13,9 +13,7 @@ const metadata_helpers_1 = require("../metadata-helpers");
 const Toggle_1 = require("../Toggle/Toggle");
 const COMP = "Switch";
 exports.SwitchMd = (0, ComponentDefs_1.createMetadata)({
-    description: `The \`${COMP}\` component is a user interface element that allows users to toggle between two states: ` +
-        `on and off. It consists of a small rectangular or circular button that can be moved left or right to ` +
-        `change its state.`,
+    description: "`Switch` enables users to toggle between two states: on and off.",
     props: {
         indeterminate: (0, metadata_helpers_1.dIndeterminate)(Toggle_1.defaultProps.indeterminate),
         label: (0, metadata_helpers_1.dLabel)(),

package/dist/scripts/src/components/Table/Table.js

@@ -19,8 +19,7 @@ const SelectionStoreNative_1 = require("../SelectionStore/SelectionStoreNative")
 const TableNative_1 = require("./TableNative");
 const COMP = "Table";
 exports.TableMd = (0, ComponentDefs_1.createMetadata)({
-    description: `\`${COMP}\` is a component that displays cells organized into rows and columns. The \`${COMP}\` ` +
-        `component is virtualized so it only renders visible cells.`,
+    description: "`Table` presents structured data for viewing, sorting, selection, and interaction.",
     props: {
         items: (0, metadata_helpers_1.dInternal)(`You can use \`items\` as an alias for the \`data\` property. ` +
             `When you bind the table to a data source (e.g. an API endpoint), ` +

package/dist/scripts/src/components/TableOfContents/TableOfContents.js

@@ -15,9 +15,8 @@ const COMP = "TableOfContents";
 const COMP_CHILD = "TableOfContentsItem";
 exports.TableOfContentsMd = (0, ComponentDefs_1.createMetadata)({
     status: "experimental",
-    description: `The \`${COMP}\` component collects headings and bookmarks within the current page ` +
-        `and displays them in a tree representing their hierarchy. When you select an item ` +
-        `in this tree, the component navigates the page to the selected position.`,
+    description: "`TableOfContents` component collects [Heading](/components/Heading) and " +
+        "[Bookmark](/components/Bookmark) within the current page and displays them in a navigable tree.",
     props: {
         smoothScrolling: {
             description: `This property indicates that smooth scrolling is used while scrolling the selected table ` +

package/dist/scripts/src/components/Tabs/TabItem.js

@@ -8,8 +8,11 @@ const TabItemNative_1 = require("./TabItemNative");
 const metadata_helpers_1 = require("../metadata-helpers");
 const COMP = "TabItem";
 exports.TabItemMd = (0, ComponentDefs_1.createMetadata)({
-    description: `\`${COMP}\` is a non-visual component describing a tab. Tabs component may use nested ` +
-        `${COMP} instances from which the user can select.`,
+    description: "`TabItem` defines individual tabs within a [Tabs](/components/Tabs) component, " +
+        "providing both the tab header label and the content that displays when the tab " +
+        "is selected. As a non-visual structural component, it serves as a container that " +
+        "organizes content into distinct, switchable sections.",
+    docFolder: "Tabs",
     props: {
         label: (0, metadata_helpers_1.dLabel)(),
     },

package/dist/scripts/src/components/Tabs/Tabs.js

@@ -10,12 +10,14 @@ const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
 const themeVars_1 = require("../../components-core/theming/themeVars");
 const renderers_1 = require("../../components-core/renderers");
 const container_helpers_1 = require("../container-helpers");
-const metadata_helpers_1 = require("../metadata-helpers");
 const TabsNative_1 = require("./TabsNative");
 const COMP = "Tabs";
 exports.TabsMd = (0, ComponentDefs_1.createMetadata)({
     status: "experimental",
-    description: `The \`${COMP}\` component provides a tabbed layout where each tab has a clickable label and content.`,
+    description: "`Tabs` enables users to switch among content panels using clickable tab headers. " +
+        "It provides an efficient way to present multiple related sections in a single " +
+        "interface area, with each tab containing distinct content defined by " +
+        "[TabItem](/components/TabItem) components.",
     props: {
         activeTab: (0, ComponentDefs_1.d)(`This property indicates the index of the active tab. The indexing starts from 0, ` +
             `representing the starting (leftmost) tab. If not set, the first tab is selected by default.`),
@@ -27,7 +29,11 @@ exports.TabsMd = (0, ComponentDefs_1.createMetadata)({
             defaultValue: TabsNative_1.defaultProps.orientation,
             valueType: "string",
         },
-        tabTemplate: (0, metadata_helpers_1.dComponent)(`This property declares the template for the clickable tab area.`),
+        tabTemplate: {
+            description: `This property declares the template for the clickable tab area.`,
+            valueType: "ComponentDef",
+            isInternal: true,
+        },
     },
     apis: {
         next: (0, ComponentDefs_1.d)(`This method selects the next tab.`),

package/dist/scripts/src/components/Text/Text.js

@@ -83,9 +83,9 @@ exports.TextMd = (0, ComponentDefs_1.createMetadata)({
         [`fontFamily-${COMP}-sample`]: "$fontFamily-monospace",
         [`fontSize-${COMP}-sample`]: "$fontSize-small",
         [`fontSize-${COMP}-sup`]: "$fontSize-smaller",
-        [`verticalAlign-${COMP}-sup`]: "super",
+        [`verticalAlignment-${COMP}-sup`]: "super",
         [`fontSize-${COMP}-sub`]: "$fontSize-smaller",
-        [`verticalAlign-${COMP}-sub`]: "sub",
+        [`verticalAlignment-${COMP}-sub`]: "sub",
         [`fontStyle-${COMP}-var`]: "italic",
         [`fontStyle-${COMP}-em`]: "italic",
         [`fontFamily-${COMP}-mono`]: "$fontFamily-monospace",

package/dist/scripts/src/components/TextArea/TextArea.js

@@ -19,8 +19,8 @@ exports.resizeOptionsMd = [
     { value: "both", description: "Can resize in both dimensions" },
 ];
 exports.TextAreaMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
-    description: `\`${COMP}\` is a component that provides a multiline text input area.`,
+    status: "stable",
+    description: "`TextArea` provides a multiline text input area.",
     props: {
         enterSubmits: {
             description: "This optional boolean property indicates whether pressing the \`Enter\` key on the " +

package/dist/scripts/src/components/TextBox/TextBox.js

@@ -13,8 +13,9 @@ const metadata_helpers_1 = require("../metadata-helpers");
 const TextBoxNative_1 = require("./TextBoxNative");
 const COMP = "TextBox";
 exports.TextBoxMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
-    description: `The \`${COMP}\` is an input component that allows users to input and edit textual data.`,
+    status: "stable",
+    description: "`TextBox` captures user text input for forms, search fields, and data entry " +
+        "with support for validation, icons, and formatting hints.",
     props: {
         placeholder: (0, metadata_helpers_1.dPlaceholder)(),
         initialValue: Object.assign(Object.assign({}, (0, metadata_helpers_1.dInitialValue)()), { defaultValue: TextBoxNative_1.defaultProps.initialValue }),
@@ -84,8 +85,8 @@ function renderTextBox(layoutCss, state, updateState, extractValue, node, lookup
 exports.textBoxComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.TextBoxMd, ({ node, state, updateState, lookupEventHandler, extractValue, layoutCss, registerComponentApi, }) => {
     return renderTextBox(layoutCss, state, updateState, extractValue, node, lookupEventHandler, registerComponentApi);
 });
-exports.PasswordMd = (0, ComponentDefs_1.createMetadata)(Object.assign(Object.assign({}, exports.TextBoxMd), { description: "The \`Password\` component is a specialized version of the \`TextBox\` component that " +
-        "allows users to input and edit passwords." }));
+exports.PasswordMd = (0, ComponentDefs_1.createMetadata)(Object.assign(Object.assign({}, exports.TextBoxMd), { description: "`Password` is a specialized [TextBox](/components/TextBox) that enables users " +
+        "to input and edit passwords." }));
 exports.passwordInputComponentRenderer = (0, renderers_1.createComponentRenderer)("PasswordInput", exports.PasswordMd, ({ node, state, updateState, lookupEventHandler, extractValue, layoutCss, registerComponentApi, }) => {
     return renderTextBox(layoutCss, state, updateState, extractValue, node, lookupEventHandler, registerComponentApi, "password");
 });

package/dist/scripts/src/components/Theme/NotificationToast.js

@@ -35,6 +35,7 @@ var __importStar = (this && this.__importStar) || (function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NotificationToast = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const react_hot_toast_1 = __importStar(require("react-hot-toast"));
 const TOASTER_CONTAINER_STYLE = {
     top: 40,
@@ -44,7 +45,17 @@ const TOASTER_CONTAINER_STYLE = {
     position: "absolute",
     overflowY: "hidden",
 };
+let toasterMounted = false;
 const NotificationToast = ({ toastDuration }) => {
+    const [shouldRender, setShouldRender] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (!toasterMounted) {
+            toasterMounted = true;
+            setShouldRender(true);
+        }
+    }, []);
+    if (!shouldRender)
+        return null;
     return ((0, jsx_runtime_1.jsx)(react_hot_toast_1.Toaster, { position: "top-right", containerStyle: TOASTER_CONTAINER_STYLE, toastOptions: { style: { padding: "12px 16px" }, duration: toastDuration }, children: (t) => ((0, jsx_runtime_1.jsx)("div", { onClick: () => react_hot_toast_1.default.dismiss(t.id), children: (0, jsx_runtime_1.jsx)(react_hot_toast_1.ToastBar, { position: t.position, toast: t, style: { wordBreak: "break-word" }, children: ({ icon, message }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon, message] })) }) })) }));
 };
 exports.NotificationToast = NotificationToast;

package/dist/scripts/src/components/Theme/Theme.js

@@ -18,10 +18,8 @@ const renderers_1 = require("../../components-core/renderers");
 const ThemeNative_1 = require("./ThemeNative");
 const COMP = "Theme";
 exports.ThemeMd = (0, ComponentDefs_1.createMetadata)({
-    description: `The \`${COMP}\` component provides a way to define a particular theming context for ` +
-        `its nested components. The XMLUI framework uses \`${COMP}\` to define the default ` +
-        `theming context for all of its child components. Theme variables and theme settings ` +
-        `only work in this context.`,
+    description: "`Theme` creates styling contexts to customize the appearance of nested " +
+        "components without using CSS.",
     allowArbitraryProps: true,
     props: {
         themeId: (0, ComponentDefs_1.d)(`This property specifies which theme to use by setting the theme's id.`),

package/dist/scripts/src/components/Theme/ThemeNative.js

@@ -46,7 +46,7 @@ function Theme({ id, isRoot = exports.defaultProps.isRoot, renderChild, node, to
         var _a, _b, _c;
         const themeToExtend = id ? themes.find((theme) => theme.id === id) : activeTheme;
         if (!themeToExtend) {
-            throw new Error("Theme not found");
+            throw new Error(`Theme not found: requested="${id}", available=[${themes.map((t) => t.id).join(", ")}]`);
         }
         const foundTheme = Object.assign(Object.assign({}, themeToExtend), { id: generatedId, tones: Object.assign(Object.assign({}, themeToExtend.tones), { [themeTone]: Object.assign(Object.assign({}, (_a = themeToExtend.tones) === null || _a === void 0 ? void 0 : _a[themeTone]), { themeVars: Object.assign(Object.assign({}, (_c = (_b = themeToExtend.tones) === null || _b === void 0 ? void 0 : _b[themeTone]) === null || _c === void 0 ? void 0 : _c.themeVars), themeVars) }) }) });
         return foundTheme;
@@ -75,15 +75,15 @@ function Theme({ id, isRoot = exports.defaultProps.isRoot, renderChild, node, to
       @media (min-width: calc(${maxWidthLandscapePhone} + 1px)) {
           --screenSize: 2;
       }
-  
+
       @media (min-width: calc(${maxWidthTablet} + 1px)) {
           --screenSize: 3;
       }
-  
+
       @media (min-width: calc(${maxWidthDesktop} + 1px)) {
           --screenSize: 4;
       }
-  
+
       @media (min-width: calc(${maxWidthLargeDesktop} + 1px)) {
           --screenSize: 5;
       }

package/dist/scripts/src/components/ToneChangerButton/ToneChangerButton.js

@@ -13,11 +13,11 @@ const LIGHT_TO_DARK_ICON = "lightToDark:ToneChangerButton";
 const DARK_TO_LIGHT_ICON = "darkToLight:ToneChangerButton";
 exports.defaultProps = {
     lightToDarkIcon: LIGHT_TO_DARK_ICON,
-    darkToLightIcon: DARK_TO_LIGHT_ICON
+    darkToLightIcon: DARK_TO_LIGHT_ICON,
 };
 exports.ToneChangerButtonMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
-    description: `The \`${COMP}\` component is a component that allows the user to change the tone of the app.`,
+    status: "stable",
+    description: "`ToneChangerButton` enables the user to switch between light and dark modes.",
     props: {
         lightToDarkIcon: {
             description: `The icon displayed when the theme is in light mode and will switch to dark. You can change ` +
@@ -33,7 +33,7 @@ exports.ToneChangerButtonMd = (0, ComponentDefs_1.createMetadata)({
         },
     },
 });
-function ToneChangerButton({ lightToDarkIcon = exports.defaultProps.lightToDarkIcon, darkToLightIcon = exports.defaultProps.darkToLightIcon }) {
+function ToneChangerButton({ lightToDarkIcon = exports.defaultProps.lightToDarkIcon, darkToLightIcon = exports.defaultProps.darkToLightIcon, }) {
     const { activeThemeTone, setActiveThemeTone } = (0, ThemeContext_1.useThemes)();
     // Use the direct icon name as both the main icon and the fallback
     // This ensures we always have a working icon
@@ -45,5 +45,5 @@ function ToneChangerButton({ lightToDarkIcon = exports.defaultProps.lightToDarkI
  * Define the renderer for the ToneChangerButton component
  */
 exports.toneChangerButtonComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.ToneChangerButtonMd, ({ node, extractValue }) => {
-    return (0, jsx_runtime_1.jsx)(ToneChangerButton, { lightToDarkIcon: extractValue.asOptionalString(node.props.lightToDarkIcon), darkToLightIcon: extractValue.asOptionalString(node.props.darkToLightIcon) });
+    return ((0, jsx_runtime_1.jsx)(ToneChangerButton, { lightToDarkIcon: extractValue.asOptionalString(node.props.lightToDarkIcon), darkToLightIcon: extractValue.asOptionalString(node.props.darkToLightIcon) }));
 });

package/dist/scripts/src/components-core/Fragment.js

@@ -7,7 +7,8 @@ const ComponentDefs_1 = require("../abstractions/ComponentDefs");
 const renderers_1 = require("./renderers");
 const COMP = "Fragment";
 exports.FragmentMd = (0, ComponentDefs_1.createMetadata)({
-    description: `The \`${COMP}\` component encloses multiple child components into a single root component, so it can be used where only a single component definition is allowed.`,
+    description: "`Fragment` provides conditional rendering. You can use `when=` on any " +
+        "component to render it conditionally, use `Fragment` to apply `when` to a group of components.",
     opaque: true,
 });
 exports.fragmentComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.FragmentMd, ({ node, extractValue, renderChild, layoutContext }) => {

package/dist/scripts/src/components-core/RestApiProxy.js

@@ -51,8 +51,8 @@ const process_statement_sync_1 = require("./script-runner/process-statement-sync
 function isAxiosResponse(response) {
     return "data" in response;
 }
-function parseResponseJson(response) {
-    return __awaiter(this, void 0, void 0, function* () {
+function parseResponseJson(response_1) {
+    return __awaiter(this, arguments, void 0, function* (response, logError = false) {
         let resp;
         if (isAxiosResponse(response)) {
             resp = response.data;
@@ -66,7 +66,9 @@ function parseResponseJson(response) {
                     resp = yield response.clone().text();
                 }
                 catch (e) {
-                    console.error("Failed to parse response as text or JSON", response.body);
+                    if (logError) {
+                        console.error("Failed to parse response as text or JSON", response.body);
+                    }
                 }
             }
         }
@@ -230,6 +232,7 @@ class RestApiProxy {
             return value;
         };
         this.executeOperation = (_a) => __awaiter(this, [_a], void 0, function* ({ operation, contextParams, abortSignal, resolveBindingExpressions, relativePath = this.extractParam(resolveBindingExpressions, operation.url, contextParams), method = this.extractParam(resolveBindingExpressions, operation.method, contextParams), queryParams = this.extractParam(resolveBindingExpressions, operation.queryParams, contextParams), body = this.extractParam(resolveBindingExpressions, operation.body, contextParams, true), rawBody = this.extractParam(resolveBindingExpressions, operation.rawBody, contextParams), headers = this.extractParam(resolveBindingExpressions, operation.headers, contextParams), payloadType = this.extractParam(resolveBindingExpressions, operation.payloadType, contextParams) || "json", onUploadProgress, parseResponse = this.tryParseResponse, transactionId, }) {
+            var _b, _c, _d, _e, _f, _g;
             const includeClientTxId = method && method !== "get" && !!transactionId;
             const headersWithoutContentType = Object.assign(Object.assign({}, this.getHeaders()), { ["Content-Type"]: undefined });
             const aggregatedHeaders = (0, lodash_es_1.omitBy)(Object.assign(Object.assign({}, (body ? this.getHeaders() : headersWithoutContentType)), headers), lodash_es_1.isUndefined);
@@ -278,7 +281,7 @@ class RestApiProxy {
                         data: options.body,
                         onUploadProgress,
                     });
-                    return yield parseResponse(response);
+                    return yield parseResponse(response, (_d = (_c = (_b = this.appContext) === null || _b === void 0 ? void 0 : _b.appGlobals) === null || _c === void 0 ? void 0 : _c.logRestApiErrors) !== null && _d !== void 0 ? _d : false);
                 }
                 catch (error) {
                     if (axios.isAxiosError(error) && error.response) {
@@ -294,12 +297,12 @@ class RestApiProxy {
                 if (!response.clone().ok) {
                     throw yield this.raiseError(response);
                 }
-                const parsedResponse = yield parseResponse(response.clone());
+                const parsedResponse = yield parseResponse(response.clone(), (_g = (_f = (_e = this.appContext) === null || _e === void 0 ? void 0 : _e.appGlobals) === null || _f === void 0 ? void 0 : _f.logRestApiErrors) !== null && _g !== void 0 ? _g : false);
                 return parsedResponse;
             }
         });
-        this.tryParseResponse = (response) => __awaiter(this, void 0, void 0, function* () {
-            return yield parseResponseJson(response);
+        this.tryParseResponse = (response_1, ...args_1) => __awaiter(this, [response_1, ...args_1], void 0, function* (response, logError = false) {
+            return yield parseResponseJson(response, logError);
         });
         this.raiseError = (response) => __awaiter(this, void 0, void 0, function* () {
             if ("config" in response) {

package/dist/scripts/src/components-core/descriptorHelper.js

@@ -83,4 +83,13 @@ exports.layoutOptionKeys = [
     "outlineColor",
     "outlineStyle",
     "outlineOffset",
+    "fontVariant",
+    "lineBreak",
+    "textIndent",
+    "textShadow",
+    "wordBreak",
+    "wordSpacing",
+    "wordWrap",
+    "writingMode",
+    "transition",
 ];

package/dist/scripts/src/components-core/rendering/AppContent.js

@@ -130,8 +130,8 @@ function AppContent({ rootContainer, routerBaseName, globalProps, standalone, tr
     const isViewportTablet = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthLandscapePhone}) and (max-width: ${maxWidthTabletLower})`);
     const isViewportDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthTablet}) and (max-width: ${maxWidthDesktopLower})`);
     const isViewportLargeDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthDesktop}) and (max-width: ${maxWidthLargeDesktopLower})`);
-    let vpSize = "xs";
-    let vpSizeIndex = 0;
+    let vpSize;
+    let vpSizeIndex;
     const isViewportXlDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthLargeDesktop})`);
     if (isViewportXlDesktop) {
         vpSize = "xxl";
@@ -153,6 +153,10 @@ function AppContent({ rootContainer, routerBaseName, globalProps, standalone, tr
         vpSize = "sm";
         vpSizeIndex = 1;
     }
+    else if (isViewportPhone) {
+        vpSize = "xs";
+        vpSizeIndex = 0;
+    }
     // --- Collect information about the current environment
     const isInIFrame = (0, hooks_1.useIsInIFrame)();
     const isWindowFocused = (0, hooks_1.useIsWindowFocused)();

package/dist/scripts/src/components-core/theming/layout-resolver.js

@@ -111,11 +111,15 @@ function resolveLayoutProps(layoutProps = constants_1.EMPTY_OBJECT, layoutContex
     collectCss("fontSize");
     collectCss("fontWeight");
     collectCss("fontStyle");
+    collectCss("fontVariant");
+    collectCss("lineBreak");
     collectCss("textDecoration");
     collectCss("textDecorationLine");
     collectCss("textDecorationColor");
     collectCss("textDecorationStyle");
     collectCss("textDecorationThickness");
+    collectCss("textIndent");
+    collectCss("textShadow");
     collectCss("textUnderlineOffset");
     collectCss("userSelect");
     collectCss("letterSpacing");
@@ -124,6 +128,10 @@ function resolveLayoutProps(layoutProps = constants_1.EMPTY_OBJECT, layoutContex
     collectCss("textAlign");
     collectCss("textAlignLast");
     collectCss("textWrap");
+    collectCss("wordBreak");
+    collectCss("wordSpacing");
+    collectCss("wordWrap");
+    collectCss("writingMode");
     // --- Other
     collectCss("backgroundColor");
     collectCss("background");
@@ -339,6 +347,8 @@ const layoutPatterns = {
     fontSize: [],
     fontWeight: [],
     fontStyle: [booleanRegex],
+    fontVariant: [],
+    lineBreak: [],
     textDecoration: [],
     userSelect: [],
     letterSpacing: [],
@@ -347,6 +357,12 @@ const layoutPatterns = {
     textAlign: [],
     textWrap: [],
     textAlignLast: [],
+    textIndent: [],
+    textShadow: [],
+    wordBreak: [],
+    wordSpacing: [],
+    wordWrap: [],
+    writingMode: [],
     // --- Content rendering
     wrapContent: [],
     canShrink: [],
@@ -365,4 +381,6 @@ const layoutPatterns = {
     outlineColor: [],
     outlineStyle: [],
     outlineOffset: [],
+    // --- Animation
+    transition: [],
 };

package/dist/scripts/src/parsers/xmlui-parser/parser.js

@@ -2,16 +2,37 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createXmlUiParser = createXmlUiParser;
 exports.parseXmlUiMarkup = parseXmlUiMarkup;
+const syntax_node_1 = require("./syntax-node");
 const CharacterCodes_1 = require("./CharacterCodes");
 const scanner_1 = require("./scanner");
 const syntax_kind_1 = require("./syntax-kind");
 const utils_1 = require("./utils");
 const diagnostics_1 = require("./diagnostics");
 const RECOVER_FILE = [syntax_kind_1.SyntaxKind.CData, syntax_kind_1.SyntaxKind.Script, syntax_kind_1.SyntaxKind.OpenNodeStart];
-const RECOVER_OPEN_TAG = [syntax_kind_1.SyntaxKind.OpenNodeStart, syntax_kind_1.SyntaxKind.NodeEnd, syntax_kind_1.SyntaxKind.NodeClose, syntax_kind_1.SyntaxKind.CloseNodeStart, syntax_kind_1.SyntaxKind.CData, syntax_kind_1.SyntaxKind.Script];
+const RECOVER_OPEN_TAG = [
+    syntax_kind_1.SyntaxKind.OpenNodeStart,
+    syntax_kind_1.SyntaxKind.NodeEnd,
+    syntax_kind_1.SyntaxKind.NodeClose,
+    syntax_kind_1.SyntaxKind.CloseNodeStart,
+    syntax_kind_1.SyntaxKind.CData,
+    syntax_kind_1.SyntaxKind.Script,
+];
 const RECOVER_ATTR = [syntax_kind_1.SyntaxKind.Identifier, ...RECOVER_OPEN_TAG];
-const RECOVER_CONTENT_LIST = [syntax_kind_1.SyntaxKind.TextNode, syntax_kind_1.SyntaxKind.StringLiteral, syntax_kind_1.SyntaxKind.CData, syntax_kind_1.SyntaxKind.Script, syntax_kind_1.SyntaxKind.OpenNodeStart, syntax_kind_1.SyntaxKind.CloseNodeStart];
-const RECOVER_CLOSE_TAG = [syntax_kind_1.SyntaxKind.NodeEnd, syntax_kind_1.SyntaxKind.OpenNodeStart, syntax_kind_1.SyntaxKind.CloseNodeStart, syntax_kind_1.SyntaxKind.CData, syntax_kind_1.SyntaxKind.Script];
+const RECOVER_CONTENT_LIST = [
+    syntax_kind_1.SyntaxKind.TextNode,
+    syntax_kind_1.SyntaxKind.StringLiteral,
+    syntax_kind_1.SyntaxKind.CData,
+    syntax_kind_1.SyntaxKind.Script,
+    syntax_kind_1.SyntaxKind.OpenNodeStart,
+    syntax_kind_1.SyntaxKind.CloseNodeStart,
+];
+const RECOVER_CLOSE_TAG = [
+    syntax_kind_1.SyntaxKind.NodeEnd,
+    syntax_kind_1.SyntaxKind.OpenNodeStart,
+    syntax_kind_1.SyntaxKind.CloseNodeStart,
+    syntax_kind_1.SyntaxKind.CData,
+    syntax_kind_1.SyntaxKind.Script,
+];
 function createXmlUiParser(source) {
     return {
         parse: () => parseXmlUiMarkup(source),
@@ -208,7 +229,11 @@ function parseXmlUiMarkup(text) {
                 nameIdent = bump(syntax_kind_1.SyntaxKind.Identifier);
             }
             else {
-                const errNode = errNodeUntil([syntax_kind_1.SyntaxKind.Equal, syntax_kind_1.SyntaxKind.Identifier, ...RECOVER_OPEN_TAG]);
+                const errNode = errNodeUntil([
+                    syntax_kind_1.SyntaxKind.Equal,
+                    syntax_kind_1.SyntaxKind.Identifier,
+                    ...RECOVER_OPEN_TAG,
+                ]);
                 if (errNode) {
                     errorAt(diagnostics_1.DIAGS.expAttrNameAfterNamespace, errNode.pos, errNode.end);
                 }
@@ -225,7 +250,8 @@ function parseXmlUiMarkup(text) {
             if (at(syntax_kind_1.SyntaxKind.Identifier)) {
                 const closeTagName = parseClosingTagName();
                 if (!skipNameMatching) {
-                    const namesMismatch = openTagName !== null && !(0, utils_1.tagNameNodesWithoutErrorsMatch)(openTagName, closeTagName, getText);
+                    const namesMismatch = openTagName !== null &&
+                        !(0, utils_1.tagNameNodesWithoutErrorsMatch)(openTagName, closeTagName, getText);
                     if (namesMismatch) {
                         const msg = diagnostics_1.DIAGS.tagNameMismatch(getText(openTagName), getText(closeTagName));
                         errorAt(msg, closeTagName.pos, closeTagName.end);
@@ -306,10 +332,10 @@ function parseXmlUiMarkup(text) {
         });
     }
     /**
-    *
-    * @param tokens that won't be consumed
-    * @returns the error node with the consumed tokens, or null if there were no tokens consumed
-    */
+     *
+     * @param tokens that won't be consumed
+     * @returns the error node with the consumed tokens, or null if there were no tokens consumed
+     */
     function errNodeUntil(tokens) {
         startNode();
         advance(tokens);
@@ -422,7 +448,7 @@ function parseXmlUiMarkup(text) {
             }
             end = scanner.getTokenEnd();
         }
-        peekedToken = { kind, start, pos, end, triviaBefore };
+        peekedToken = new syntax_node_1.Node(kind, pos, end, triviaBefore);
         return peekedToken;
     }
     /** Same as bumpAny, but with an assertion of the token that was bumped over.
@@ -479,20 +505,14 @@ function parseXmlUiMarkup(text) {
                     err = errFromScanner.message;
                 }
                 const pos = scanner.getTokenStart();
-                const token = {
-                    kind,
-                    start,
-                    pos,
-                    end: scanner.getTokenEnd(),
-                    triviaBefore: triviaCollected.length > 0 ? triviaCollected : undefined,
-                };
+                const triviaBefore = triviaCollected.length > 0 ? triviaCollected : undefined;
                 triviaCollected = [];
                 if (inContent && err.code === diagnostics_1.ErrCodes.invalidChar) {
                     errFromScanner = undefined;
-                    return token;
+                    return new syntax_node_1.Node(kind, pos, scanner.getTokenEnd(), triviaBefore);
                 }
                 const badPrefixEnd = pos + errFromScanner.prefixLength;
-                token.end = badPrefixEnd;
+                const token = new syntax_node_1.Node(kind, pos, badPrefixEnd, triviaBefore);
                 scanner.resetTokenState(badPrefixEnd);
                 startNode();
                 node.children.push(token);
@@ -505,21 +525,10 @@ function parseXmlUiMarkup(text) {
                 case syntax_kind_1.SyntaxKind.CommentTrivia:
                 case syntax_kind_1.SyntaxKind.NewLineTrivia:
                 case syntax_kind_1.SyntaxKind.WhitespaceTrivia:
-                    triviaCollected.push({
-                        kind,
-                        start,
-                        pos: scanner.getTokenStart(),
-                        end: scanner.getTokenEnd(),
-                    });
+                    triviaCollected.push(new syntax_node_1.Node(kind, scanner.getTokenStart(), scanner.getTokenEnd()));
                     break;
                 default:
-                    return {
-                        kind,
-                        start,
-                        pos: scanner.getTokenStart(),
-                        end: scanner.getTokenEnd(),
-                        triviaBefore: triviaCollected.length > 0 ? triviaCollected : undefined,
-                    };
+                    return new syntax_node_1.Node(kind, scanner.getTokenStart(), scanner.getTokenEnd(), triviaCollected.length > 0 ? triviaCollected : undefined);
             }
         }
     }
@@ -533,11 +542,5 @@ function parseXmlUiMarkup(text) {
 function createNode(kind, children) {
     const firstChild = children[0];
     const lastChild = children[children.length - 1];
-    return {
-        kind,
-        start: firstChild.start,
-        pos: firstChild.pos,
-        end: lastChild.end,
-        children,
-    };
+    return new syntax_node_1.Node(kind, firstChild.pos, lastChild.end, undefined, children);
 }

package/dist/scripts/src/parsers/xmlui-parser/syntax-node.js

@@ -1,2 +1,67 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.TagNameNode = exports.AttributeListNode = exports.ContentListNode = exports.AttributeKeyNode = exports.AttributeNode = exports.ElementNode = exports.Node = void 0;
+const syntax_kind_1 = require("./syntax-kind");
+const utils_1 = require("./utils");
+class Node {
+    constructor(kind, pos, end, triviaBefore, children) {
+        var _a, _b, _c, _d;
+        this.kind = kind;
+        this.pos = pos;
+        this.end = end;
+        this.triviaBefore = triviaBefore;
+        this.children = children;
+        if (triviaBefore) {
+            this.start = (_b = (_a = triviaBefore[0]) === null || _a === void 0 ? void 0 : _a.start) !== null && _b !== void 0 ? _b : pos;
+        }
+        else if (children) {
+            this.start = (_d = (_c = children[0]) === null || _c === void 0 ? void 0 : _c.start) !== null && _d !== void 0 ? _d : pos;
+        }
+        else {
+            this.start = pos;
+        }
+    }
+    isElementNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.ElementNode;
+    }
+    isAttributeNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.AttributeNode;
+    }
+    isAttributeKeyNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.AttributeKeyNode;
+    }
+    isContentListNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.ContentListNode;
+    }
+    isAttributeListNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.AttributeListNode;
+    }
+    isTagNameNode() {
+        return this.kind === syntax_kind_1.SyntaxKind.TagNameNode;
+    }
+    findTokenAtPos(position) {
+        return (0, utils_1.findTokenAtPos)(this, position);
+    }
+}
+exports.Node = Node;
+class ElementNode extends Node {
+    getAttributeListNode() {
+        return this.children.find((c) => c.isContentListNode());
+    }
+}
+exports.ElementNode = ElementNode;
+class AttributeNode extends Node {
+}
+exports.AttributeNode = AttributeNode;
+class AttributeKeyNode extends Node {
+}
+exports.AttributeKeyNode = AttributeKeyNode;
+class ContentListNode extends Node {
+}
+exports.ContentListNode = ContentListNode;
+class AttributeListNode extends Node {
+}
+exports.AttributeListNode = AttributeListNode;
+class TagNameNode extends Node {
+}
+exports.TagNameNode = TagNameNode;