This is page 139 of 175. Use http://codebase.md/xmlui-org/xmlui?lines=true&page={x} to view the full context. # Directory Structure ``` ├── .changeset │ ├── cold-items-taste.md │ ├── config.json │ ├── empty-spiders-dress.md │ ├── shy-windows-allow.md │ ├── sour-coins-read.md │ ├── tame-zebras-invite.md │ ├── twenty-jeans-watch.md │ └── warm-spies-melt.md ├── .eslintrc.cjs ├── .github │ ├── build-checklist.png │ ├── ISSUE_TEMPLATE │ │ ├── bug_report.md │ │ └── feature_request.md │ └── workflows │ ├── deploy-docs-optimized.yml │ ├── deploy-docs.yml │ ├── prepare-versions.yml │ ├── release-packages.yml │ ├── run-all-tests.yml │ └── run-smoke-tests.yml ├── .gitignore ├── .prettierrc.js ├── .vscode │ ├── launch.json │ └── settings.json ├── blog │ ├── .gitignore │ ├── .gitkeep │ ├── CHANGELOG.md │ ├── extensions.ts │ ├── index.html │ ├── index.ts │ ├── package.json │ ├── public │ │ ├── blog │ │ │ ├── images │ │ │ │ ├── blog-page-component.png │ │ │ │ ├── blog-scrabble.png │ │ │ │ ├── integrated-blog-search.png │ │ │ │ └── lorem-ipsum.png │ │ │ ├── lorem-ipsum.md │ │ │ ├── newest-post.md │ │ │ ├── older-post.md │ │ │ └── welcome-to-the-xmlui-blog.md │ │ ├── mockServiceWorker.js │ │ ├── resources │ │ │ ├── favicon.ico │ │ │ ├── files │ │ │ │ └── for-download │ │ │ │ └── xmlui │ │ │ │ └── xmlui-standalone.umd.js │ │ │ ├── github.svg │ │ │ ├── llms.txt │ │ │ ├── logo-dark.svg │ │ │ ├── logo.svg │ │ │ ├── pg-popout.svg │ │ │ └── xmlui-logo.svg │ │ ├── serve.json │ │ └── web.config │ ├── scripts │ │ ├── download-latest-xmlui.js │ │ ├── generate-rss.js │ │ ├── get-releases.js │ │ └── utils.js │ ├── src │ │ ├── components │ │ │ ├── BlogOverview.xmlui │ │ │ ├── BlogPage.xmlui │ │ │ └── PageNotFound.xmlui │ │ ├── config.ts │ │ ├── Main.xmlui │ │ └── themes │ │ ├── docs-theme.ts │ │ ├── earthtone.ts │ │ ├── xmlui-gray-on-default.ts │ │ ├── xmlui-green-on-default.ts │ │ └── xmlui-orange-on-default.ts │ └── tsconfig.json ├── CONTRIBUTING.md ├── docs │ ├── .gitignore │ ├── CHANGELOG.md │ ├── ComponentRefLinks.txt │ ├── content │ │ ├── _meta.json │ │ ├── components │ │ │ ├── _meta.json │ │ │ ├── _overview.md │ │ │ ├── APICall.md │ │ │ ├── App.md │ │ │ ├── AppHeader.md │ │ │ ├── AppState.md │ │ │ ├── AutoComplete.md │ │ │ ├── Avatar.md │ │ │ ├── Backdrop.md │ │ │ ├── Badge.md │ │ │ ├── BarChart.md │ │ │ ├── Bookmark.md │ │ │ ├── Breakout.md │ │ │ ├── Button.md │ │ │ ├── Card.md │ │ │ ├── Carousel.md │ │ │ ├── ChangeListener.md │ │ │ ├── Checkbox.md │ │ │ ├── CHStack.md │ │ │ ├── ColorPicker.md │ │ │ ├── Column.md │ │ │ ├── ContentSeparator.md │ │ │ ├── CVStack.md │ │ │ ├── DataSource.md │ │ │ ├── DateInput.md │ │ │ ├── DatePicker.md │ │ │ ├── DonutChart.md │ │ │ ├── DropdownMenu.md │ │ │ ├── EmojiSelector.md │ │ │ ├── ExpandableItem.md │ │ │ ├── FileInput.md │ │ │ ├── FileUploadDropZone.md │ │ │ ├── FlowLayout.md │ │ │ ├── Footer.md │ │ │ ├── Form.md │ │ │ ├── FormItem.md │ │ │ ├── FormSection.md │ │ │ ├── Fragment.md │ │ │ ├── H1.md │ │ │ ├── H2.md │ │ │ ├── H3.md │ │ │ ├── H4.md │ │ │ ├── H5.md │ │ │ ├── H6.md │ │ │ ├── Heading.md │ │ │ ├── HSplitter.md │ │ │ ├── HStack.md │ │ │ ├── Icon.md │ │ │ ├── IFrame.md │ │ │ ├── Image.md │ │ │ ├── Items.md │ │ │ ├── LabelList.md │ │ │ ├── Legend.md │ │ │ ├── LineChart.md │ │ │ ├── Link.md │ │ │ ├── List.md │ │ │ ├── Logo.md │ │ │ ├── Markdown.md │ │ │ ├── MenuItem.md │ │ │ ├── MenuSeparator.md │ │ │ ├── ModalDialog.md │ │ │ ├── NavGroup.md │ │ │ ├── NavLink.md │ │ │ ├── NavPanel.md │ │ │ ├── NoResult.md │ │ │ ├── NumberBox.md │ │ │ ├── Option.md │ │ │ ├── Page.md │ │ │ ├── PageMetaTitle.md │ │ │ ├── Pages.md │ │ │ ├── Pagination.md │ │ │ ├── PasswordInput.md │ │ │ ├── PieChart.md │ │ │ ├── ProgressBar.md │ │ │ ├── Queue.md │ │ │ ├── RadioGroup.md │ │ │ ├── RealTimeAdapter.md │ │ │ ├── Redirect.md │ │ │ ├── Select.md │ │ │ ├── Slider.md │ │ │ ├── Slot.md │ │ │ ├── SpaceFiller.md │ │ │ ├── Spinner.md │ │ │ ├── Splitter.md │ │ │ ├── Stack.md │ │ │ ├── StickyBox.md │ │ │ ├── SubMenuItem.md │ │ │ ├── Switch.md │ │ │ ├── TabItem.md │ │ │ ├── Table.md │ │ │ ├── TableOfContents.md │ │ │ ├── Tabs.md │ │ │ ├── Text.md │ │ │ ├── TextArea.md │ │ │ ├── TextBox.md │ │ │ ├── Theme.md │ │ │ ├── TimeInput.md │ │ │ ├── Timer.md │ │ │ ├── ToneChangerButton.md │ │ │ ├── ToneSwitch.md │ │ │ ├── Tooltip.md │ │ │ ├── Tree.md │ │ │ ├── VSplitter.md │ │ │ ├── VStack.md │ │ │ ├── xmlui-animations │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ ├── Animation.md │ │ │ │ ├── FadeAnimation.md │ │ │ │ ├── FadeInAnimation.md │ │ │ │ ├── FadeOutAnimation.md │ │ │ │ ├── ScaleAnimation.md │ │ │ │ └── SlideInAnimation.md │ │ │ ├── xmlui-pdf │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ └── Pdf.md │ │ │ ├── xmlui-spreadsheet │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ └── Spreadsheet.md │ │ │ └── xmlui-website-blocks │ │ │ ├── _meta.json │ │ │ ├── _overview.md │ │ │ ├── Carousel.md │ │ │ ├── HelloMd.md │ │ │ ├── HeroSection.md │ │ │ └── ScrollToTop.md │ │ └── extensions │ │ ├── _meta.json │ │ ├── xmlui-animations │ │ │ ├── _meta.json │ │ │ ├── _overview.md │ │ │ ├── Animation.md │ │ │ ├── FadeAnimation.md │ │ │ ├── FadeInAnimation.md │ │ │ ├── FadeOutAnimation.md │ │ │ ├── ScaleAnimation.md │ │ │ └── SlideInAnimation.md │ │ └── xmlui-website-blocks │ │ ├── _meta.json │ │ ├── _overview.md │ │ ├── Carousel.md │ │ ├── HelloMd.md │ │ ├── HeroSection.md │ │ └── ScrollToTop.md │ ├── extensions.ts │ ├── index.html │ ├── index.ts │ ├── package.json │ ├── public │ │ ├── feed.rss │ │ ├── mockServiceWorker.js │ │ ├── pages │ │ │ ├── _meta.json │ │ │ ├── app-structure.md │ │ │ ├── build-editor-component.md │ │ │ ├── build-hello-world-component.md │ │ │ ├── components-intro.md │ │ │ ├── context-variables.md │ │ │ ├── forms.md │ │ │ ├── globals.md │ │ │ ├── glossary.md │ │ │ ├── helper-tags.md │ │ │ ├── hosted-deployment.md │ │ │ ├── howto │ │ │ │ ├── assign-a-complex-json-literal-to-a-component-variable.md │ │ │ │ ├── chain-a-refetch.md │ │ │ │ ├── debug-a-component.md │ │ │ │ ├── delay-a-datasource-until-another-datasource-is-ready.md │ │ │ │ ├── delegate-a-method.md │ │ │ │ ├── do-custom-form-validation.md │ │ │ │ ├── expose-a-method-from-a-component.md │ │ │ │ ├── filter-and-transform-data-from-an-api.md │ │ │ │ ├── group-items-in-list-by-a-property.md │ │ │ │ ├── handle-background-operations.md │ │ │ │ ├── hide-an-element-until-its-datasource-is-ready.md │ │ │ │ ├── make-a-set-of-equal-width-cards.md │ │ │ │ ├── make-a-table-responsive.md │ │ │ │ ├── modify-a-value-reported-in-a-column.md │ │ │ │ ├── paginate-a-list.md │ │ │ │ ├── pass-data-to-a-modal-dialog.md │ │ │ │ ├── react-to-button-click-not-keystrokes.md │ │ │ │ ├── set-the-initial-value-of-a-select-from-fetched-data.md │ │ │ │ ├── share-a-modaldialog-across-components.md │ │ │ │ ├── sync-selections-between-table-and-list-views.md │ │ │ │ ├── update-ui-optimistically.md │ │ │ │ ├── use-built-in-form-validation.md │ │ │ │ └── use-the-same-modaldialog-to-add-or-edit.md │ │ │ ├── howto.md │ │ │ ├── intro.md │ │ │ ├── layout.md │ │ │ ├── markup.md │ │ │ ├── mcp.md │ │ │ ├── modal-dialogs.md │ │ │ ├── news-and-reviews.md │ │ │ ├── reactive-intro.md │ │ │ ├── refactoring.md │ │ │ ├── routing-and-links.md │ │ │ ├── samples │ │ │ │ ├── color-palette.xmlui │ │ │ │ ├── color-values.xmlui │ │ │ │ ├── shadow-sizes.xmlui │ │ │ │ ├── spacing-sizes.xmlui │ │ │ │ ├── swatch.xmlui │ │ │ │ ├── theme-gallery-brief.xmlui │ │ │ │ └── theme-gallery.xmlui │ │ │ ├── scoping.md │ │ │ ├── scripting.md │ │ │ ├── styles-and-themes │ │ │ │ ├── common-units.md │ │ │ │ ├── layout-props.md │ │ │ │ ├── theme-variable-defaults.md │ │ │ │ ├── theme-variables.md │ │ │ │ └── themes.md │ │ │ ├── template-properties.md │ │ │ ├── test.md │ │ │ ├── tutorial-01.md │ │ │ ├── tutorial-02.md │ │ │ ├── tutorial-03.md │ │ │ ├── tutorial-04.md │ │ │ ├── tutorial-05.md │ │ │ ├── tutorial-06.md │ │ │ ├── tutorial-07.md │ │ │ ├── tutorial-08.md │ │ │ ├── tutorial-09.md │ │ │ ├── tutorial-10.md │ │ │ ├── tutorial-11.md │ │ │ ├── tutorial-12.md │ │ │ ├── universal-properties.md │ │ │ ├── user-defined-components.md │ │ │ ├── vscode.md │ │ │ ├── working-with-markdown.md │ │ │ ├── working-with-text.md │ │ │ ├── xmlui-animations │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ ├── Animation.md │ │ │ │ ├── FadeAnimation.md │ │ │ │ ├── FadeInAnimation.md │ │ │ │ ├── FadeOutAnimation.md │ │ │ │ ├── ScaleAnimation.md │ │ │ │ └── SlideInAnimation.md │ │ │ ├── xmlui-charts │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ ├── BarChart.md │ │ │ │ ├── DonutChart.md │ │ │ │ ├── LabelList.md │ │ │ │ ├── Legend.md │ │ │ │ ├── LineChart.md │ │ │ │ └── PieChart.md │ │ │ ├── xmlui-pdf │ │ │ │ ├── _meta.json │ │ │ │ ├── _overview.md │ │ │ │ └── Pdf.md │ │ │ └── xmlui-spreadsheet │ │ │ ├── _meta.json │ │ │ ├── _overview.md │ │ │ └── Spreadsheet.md │ │ ├── resources │ │ │ ├── devdocs │ │ │ │ ├── debug-proxy-object-2.png │ │ │ │ ├── debug-proxy-object.png │ │ │ │ ├── table_editor_01.png │ │ │ │ ├── table_editor_02.png │ │ │ │ ├── table_editor_03.png │ │ │ │ ├── table_editor_04.png │ │ │ │ ├── table_editor_05.png │ │ │ │ ├── table_editor_06.png │ │ │ │ ├── table_editor_07.png │ │ │ │ ├── table_editor_08.png │ │ │ │ ├── table_editor_09.png │ │ │ │ ├── table_editor_10.png │ │ │ │ ├── table_editor_11.png │ │ │ │ ├── table-editor-01.png │ │ │ │ ├── table-editor-02.png │ │ │ │ ├── table-editor-03.png │ │ │ │ ├── table-editor-04.png │ │ │ │ ├── table-editor-06.png │ │ │ │ ├── table-editor-07.png │ │ │ │ ├── table-editor-08.png │ │ │ │ ├── table-editor-09.png │ │ │ │ └── xmlui-rendering-of-tiptap-markdown.png │ │ │ ├── favicon.ico │ │ │ ├── files │ │ │ │ ├── clients.json │ │ │ │ ├── daily-revenue.json │ │ │ │ ├── dashboard-stats.json │ │ │ │ ├── demo.xmlui │ │ │ │ ├── demo.xmlui.xs │ │ │ │ ├── downloads │ │ │ │ │ └── downloads.json │ │ │ │ ├── for-download │ │ │ │ │ ├── index-with-api.html │ │ │ │ │ ├── index.html │ │ │ │ │ ├── mockApi.js │ │ │ │ │ ├── start-darwin.sh │ │ │ │ │ ├── start-linux.sh │ │ │ │ │ ├── start.bat │ │ │ │ │ └── xmlui │ │ │ │ │ └── xmlui-standalone.umd.js │ │ │ │ ├── getting-started │ │ │ │ │ ├── cl-tutorial-final.zip │ │ │ │ │ ├── cl-tutorial.zip │ │ │ │ │ ├── cl-tutorial2.zip │ │ │ │ │ ├── cl-tutorial3.zip │ │ │ │ │ ├── cl-tutorial4.zip │ │ │ │ │ ├── cl-tutorial5.zip │ │ │ │ │ ├── cl-tutorial6.zip │ │ │ │ │ ├── getting-started.zip │ │ │ │ │ ├── hello-xmlui.zip │ │ │ │ │ ├── xmlui-empty.zip │ │ │ │ │ └── xmlui-starter.zip │ │ │ │ ├── howto │ │ │ │ │ └── component-icons │ │ │ │ │ └── up-arrow.svg │ │ │ │ ├── invoices.json │ │ │ │ ├── monthly-status.json │ │ │ │ ├── news-and-reviews.json │ │ │ │ ├── products.json │ │ │ │ ├── releases.json │ │ │ │ ├── tutorials │ │ │ │ │ ├── datasource │ │ │ │ │ │ └── api.ts │ │ │ │ │ └── p2do │ │ │ │ │ ├── api.ts │ │ │ │ │ └── todo-logo.svg │ │ │ │ └── xmlui.json │ │ │ ├── github.svg │ │ │ ├── images │ │ │ │ ├── apiaction-tutorial │ │ │ │ │ ├── add-success.png │ │ │ │ │ ├── apiaction-param.png │ │ │ │ │ ├── change-completed.png │ │ │ │ │ ├── change-in-progress.png │ │ │ │ │ ├── confirm-delete.png │ │ │ │ │ ├── data-error.png │ │ │ │ │ ├── data-progress.png │ │ │ │ │ ├── data-success.png │ │ │ │ │ ├── display-1.png │ │ │ │ │ ├── item-deleted.png │ │ │ │ │ ├── item-updated.png │ │ │ │ │ ├── missing-api-key.png │ │ │ │ │ ├── new-item-added.png │ │ │ │ │ └── test-message.png │ │ │ │ ├── chat-api │ │ │ │ │ └── domain-model.svg │ │ │ │ ├── components │ │ │ │ │ ├── image │ │ │ │ │ │ └── breakfast.jpg │ │ │ │ │ ├── markdown │ │ │ │ │ │ └── colors.png │ │ │ │ │ └── modal │ │ │ │ │ ├── deep_link_dialog_1.jpg │ │ │ │ │ └── deep_link_dialog_2.jpg │ │ │ │ ├── create-apps │ │ │ │ │ ├── collapsed-vertical.png │ │ │ │ │ ├── using-forms-warning-dialog.png │ │ │ │ │ └── using-forms.png │ │ │ │ ├── datasource-tutorial │ │ │ │ │ ├── data-with-header.png │ │ │ │ │ ├── filtered-data.png │ │ │ │ │ ├── filtered-items.png │ │ │ │ │ ├── initial-page-items.png │ │ │ │ │ ├── list-items.png │ │ │ │ │ ├── next-page-items.png │ │ │ │ │ ├── no-data.png │ │ │ │ │ ├── pagination-1.jpg │ │ │ │ │ ├── pagination-1.png │ │ │ │ │ ├── polling-1.png │ │ │ │ │ ├── refetch-data.png │ │ │ │ │ ├── slow-loading.png │ │ │ │ │ ├── test-message.png │ │ │ │ │ ├── Thumbs.db │ │ │ │ │ ├── unconventional-data.png │ │ │ │ │ └── unfiltered-items.png │ │ │ │ ├── flower.jpg │ │ │ │ ├── get-started │ │ │ │ │ ├── add-new-contact.png │ │ │ │ │ ├── app-modified.png │ │ │ │ │ ├── app-start.png │ │ │ │ │ ├── app-with-boxes.png │ │ │ │ │ ├── app-with-toast.png │ │ │ │ │ ├── boilerplate-structure.png │ │ │ │ │ ├── cl-initial.png │ │ │ │ │ ├── cl-start.png │ │ │ │ │ ├── contact-counts.png │ │ │ │ │ ├── contact-dialog-title.png │ │ │ │ │ ├── contact-dialog.png │ │ │ │ │ ├── contact-menus.png │ │ │ │ │ ├── contact-predicates.png │ │ │ │ │ ├── context-menu.png │ │ │ │ │ ├── dashboard-numbers.png │ │ │ │ │ ├── default-contact-list.png │ │ │ │ │ ├── delete-contact.png │ │ │ │ │ ├── delete-task.png │ │ │ │ │ ├── detailed-template.png │ │ │ │ │ ├── edit-contact-details.png │ │ │ │ │ ├── edited-contact-saved.png │ │ │ │ │ ├── empty-sections.png │ │ │ │ │ ├── filter-completed.png │ │ │ │ │ ├── fullwidth-desktop.png │ │ │ │ │ ├── fullwidth-mobile.png │ │ │ │ │ ├── initial-table.png │ │ │ │ │ ├── items-and-badges.png │ │ │ │ │ ├── loading-message.png │ │ │ │ │ ├── new-contact-button.png │ │ │ │ │ ├── new-contact-saved.png │ │ │ │ │ ├── no-empty-sections.png │ │ │ │ │ ├── personal-todo-initial.png │ │ │ │ │ ├── piechart.png │ │ │ │ │ ├── review-today.png │ │ │ │ │ ├── rudimentary-dashboard.png │ │ │ │ │ ├── section-collapsed.png │ │ │ │ │ ├── sectioned-items.png │ │ │ │ │ ├── sections-ordered.png │ │ │ │ │ ├── spacex-list-with-links.png │ │ │ │ │ ├── spacex-list.png │ │ │ │ │ ├── start-personal-todo-1.png │ │ │ │ │ ├── submit-new-contact.png │ │ │ │ │ ├── submit-new-task.png │ │ │ │ │ ├── syntax-highlighting.png │ │ │ │ │ ├── table-with-badge.png │ │ │ │ │ ├── template-with-card.png │ │ │ │ │ ├── test-emulated-api.png │ │ │ │ │ ├── Thumbs.db │ │ │ │ │ ├── todo-logo.png │ │ │ │ │ └── xmlui-tools.png │ │ │ │ ├── HelloApp.png │ │ │ │ ├── HelloApp2.png │ │ │ │ ├── logos │ │ │ │ │ ├── xmlui1.svg │ │ │ │ │ ├── xmlui2.svg │ │ │ │ │ ├── xmlui3.svg │ │ │ │ │ ├── xmlui4.svg │ │ │ │ │ ├── xmlui5.svg │ │ │ │ │ ├── xmlui6.svg │ │ │ │ │ └── xmlui7.svg │ │ │ │ ├── pdf │ │ │ │ │ └── dummy-pdf.jpg │ │ │ │ ├── rendering-engine │ │ │ │ │ ├── AppEngine-flow.svg │ │ │ │ │ ├── Component.svg │ │ │ │ │ ├── CompoundComponent.svg │ │ │ │ │ ├── RootComponent.svg │ │ │ │ │ └── tree-with-containers.svg │ │ │ │ ├── reviewers-guide │ │ │ │ │ ├── AppEngine-flow.svg │ │ │ │ │ └── incbutton-in-action.png │ │ │ │ ├── tools │ │ │ │ │ └── boilerplate-structure.png │ │ │ │ ├── try.svg │ │ │ │ ├── tutorial │ │ │ │ │ ├── app-chat-history.png │ │ │ │ │ ├── app-content-placeholder.png │ │ │ │ │ ├── app-header-and-content.png │ │ │ │ │ ├── app-links-channel-selected.png │ │ │ │ │ ├── app-links-click.png │ │ │ │ │ ├── app-navigation.png │ │ │ │ │ ├── finished-ex01.png │ │ │ │ │ ├── finished-ex02.png │ │ │ │ │ ├── hello.png │ │ │ │ │ ├── splash-screen-advanced.png │ │ │ │ │ ├── splash-screen-after-click.png │ │ │ │ │ ├── splash-screen-centered.png │ │ │ │ │ ├── splash-screen-events.png │ │ │ │ │ ├── splash-screen-expression.png │ │ │ │ │ ├── splash-screen-reuse-after.png │ │ │ │ │ ├── splash-screen-reuse-before.png │ │ │ │ │ └── splash-screen.png │ │ │ │ └── tutorial-01.png │ │ │ ├── llms.txt │ │ │ ├── logo-dark.svg │ │ │ ├── logo.svg │ │ │ ├── pg-popout.svg │ │ │ └── xmlui-logo.svg │ │ ├── serve.json │ │ └── web.config │ ├── scripts │ │ ├── download-latest-xmlui.js │ │ ├── generate-rss.js │ │ ├── get-releases.js │ │ └── utils.js │ ├── src │ │ ├── components │ │ │ ├── BlogOverview.xmlui │ │ │ ├── BlogPage.xmlui │ │ │ ├── Boxes.xmlui │ │ │ ├── Breadcrumb.xmlui │ │ │ ├── ChangeLog.xmlui │ │ │ ├── ColorPalette.xmlui │ │ │ ├── DocumentLinks.xmlui │ │ │ ├── DocumentPage.xmlui │ │ │ ├── DocumentPageNoTOC.xmlui │ │ │ ├── Icons.xmlui │ │ │ ├── IncButton.xmlui │ │ │ ├── IncButton2.xmlui │ │ │ ├── NameValue.xmlui │ │ │ ├── PageNotFound.xmlui │ │ │ ├── PaletteItem.xmlui │ │ │ ├── Palettes.xmlui │ │ │ ├── SectionHeader.xmlui │ │ │ ├── TBD.xmlui │ │ │ ├── Test.xmlui │ │ │ ├── ThemesIntro.xmlui │ │ │ ├── ThousandThemes.xmlui │ │ │ ├── TubeStops.xmlui │ │ │ ├── TubeStops.xmlui.xs │ │ │ └── TwoColumnCode.xmlui │ │ ├── config.ts │ │ ├── Main.xmlui │ │ └── themes │ │ ├── docs-theme.ts │ │ ├── earthtone.ts │ │ ├── xmlui-gray-on-default.ts │ │ ├── xmlui-green-on-default.ts │ │ └── xmlui-orange-on-default.ts │ └── tsconfig.json ├── LICENSE ├── package-lock.json ├── package.json ├── packages │ ├── xmlui-animations │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── Animation.tsx │ │ │ ├── AnimationNative.tsx │ │ │ ├── FadeAnimation.tsx │ │ │ ├── FadeInAnimation.tsx │ │ │ ├── FadeOutAnimation.tsx │ │ │ ├── index.tsx │ │ │ ├── ScaleAnimation.tsx │ │ │ └── SlideInAnimation.tsx │ │ └── tsconfig.json │ ├── xmlui-devtools │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── devtools │ │ │ │ ├── DevTools.tsx │ │ │ │ ├── DevToolsNative.module.scss │ │ │ │ ├── DevToolsNative.tsx │ │ │ │ ├── ModalDialog.module.scss │ │ │ │ ├── ModalDialog.tsx │ │ │ │ ├── ModalVisibilityContext.tsx │ │ │ │ ├── Tooltip.module.scss │ │ │ │ ├── Tooltip.tsx │ │ │ │ └── utils.ts │ │ │ ├── editor │ │ │ │ └── Editor.tsx │ │ │ └── index.tsx │ │ ├── tsconfig.json │ │ └── vite.config-overrides.ts │ ├── xmlui-hello-world │ │ ├── .gitignore │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── HelloWorld.module.scss │ │ │ ├── HelloWorld.tsx │ │ │ ├── HelloWorldNative.tsx │ │ │ └── index.tsx │ │ └── tsconfig.json │ ├── xmlui-os-frames │ │ ├── .gitignore │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── index.tsx │ │ │ ├── IPhoneFrame.module.scss │ │ │ ├── IPhoneFrame.tsx │ │ │ ├── MacOSAppFrame.module.scss │ │ │ ├── MacOSAppFrame.tsx │ │ │ ├── WindowsAppFrame.module.scss │ │ │ └── WindowsAppFrame.tsx │ │ └── tsconfig.json │ ├── xmlui-pdf │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── demo │ │ │ ├── components │ │ │ │ └── Pdf.xmlui │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── index.tsx │ │ │ ├── LazyPdfNative.tsx │ │ │ ├── Pdf.module.scss │ │ │ └── Pdf.tsx │ │ └── tsconfig.json │ ├── xmlui-playground │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── hooks │ │ │ │ ├── usePlayground.ts │ │ │ │ └── useToast.ts │ │ │ ├── index.tsx │ │ │ ├── playground │ │ │ │ ├── Box.module.scss │ │ │ │ ├── Box.tsx │ │ │ │ ├── CodeSelector.tsx │ │ │ │ ├── ConfirmationDialog.module.scss │ │ │ │ ├── ConfirmationDialog.tsx │ │ │ │ ├── Editor.tsx │ │ │ │ ├── Header.module.scss │ │ │ │ ├── Header.tsx │ │ │ │ ├── Playground.tsx │ │ │ │ ├── PlaygroundContent.module.scss │ │ │ │ ├── PlaygroundContent.tsx │ │ │ │ ├── PlaygroundNative.module.scss │ │ │ │ ├── PlaygroundNative.tsx │ │ │ │ ├── Preview.module.scss │ │ │ │ ├── Preview.tsx │ │ │ │ ├── Select.module.scss │ │ │ │ ├── StandalonePlayground.tsx │ │ │ │ ├── StandalonePlaygroundNative.module.scss │ │ │ │ ├── StandalonePlaygroundNative.tsx │ │ │ │ ├── ThemeSwitcher.module.scss │ │ │ │ ├── ThemeSwitcher.tsx │ │ │ │ ├── ToneSwitcher.tsx │ │ │ │ ├── Tooltip.module.scss │ │ │ │ ├── Tooltip.tsx │ │ │ │ └── utils.ts │ │ │ ├── providers │ │ │ │ ├── Toast.module.scss │ │ │ │ └── ToastProvider.tsx │ │ │ ├── state │ │ │ │ └── store.ts │ │ │ ├── themes │ │ │ │ └── theme.ts │ │ │ └── utils │ │ │ └── helpers.ts │ │ └── tsconfig.json │ ├── xmlui-search │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── index.tsx │ │ │ ├── Search.module.scss │ │ │ └── Search.tsx │ │ └── tsconfig.json │ ├── xmlui-spreadsheet │ │ ├── .gitignore │ │ ├── demo │ │ │ └── Main.xmlui │ │ ├── index.html │ │ ├── index.ts │ │ ├── meta │ │ │ └── componentsMetadata.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── index.tsx │ │ │ ├── Spreadsheet.tsx │ │ │ └── SpreadsheetNative.tsx │ │ └── tsconfig.json │ └── xmlui-website-blocks │ ├── .gitignore │ ├── CHANGELOG.md │ ├── demo │ │ ├── components │ │ │ ├── HeroBackgroundBreakoutPage.xmlui │ │ │ ├── HeroBackgroundsPage.xmlui │ │ │ ├── HeroContentsPage.xmlui │ │ │ ├── HeroTextAlignPage.xmlui │ │ │ ├── HeroTextPage.xmlui │ │ │ └── HeroTonesPage.xmlui │ │ ├── Main.xmlui │ │ └── themes │ │ └── default.ts │ ├── index.html │ ├── index.ts │ ├── meta │ │ └── componentsMetadata.ts │ ├── package.json │ ├── public │ │ └── resources │ │ ├── building.jpg │ │ └── xmlui-logo.svg │ ├── src │ │ ├── Carousel │ │ │ ├── Carousel.module.scss │ │ │ ├── Carousel.tsx │ │ │ ├── CarouselContext.tsx │ │ │ └── CarouselNative.tsx │ │ ├── FancyButton │ │ │ ├── FancyButton.module.scss │ │ │ ├── FancyButton.tsx │ │ │ └── FancyButton.xmlui │ │ ├── Hello │ │ │ ├── Hello.tsx │ │ │ ├── Hello.xmlui │ │ │ └── Hello.xmlui.xs │ │ ├── HeroSection │ │ │ ├── HeroSection.module.scss │ │ │ ├── HeroSection.tsx │ │ │ └── HeroSectionNative.tsx │ │ ├── index.tsx │ │ ├── ScrollToTop │ │ │ ├── ScrollToTop.module.scss │ │ │ ├── ScrollToTop.tsx │ │ │ └── ScrollToTopNative.tsx │ │ └── vite-env.d.ts │ └── tsconfig.json ├── README.md ├── tools │ ├── codefence │ │ └── xmlui-code-fence-docs.md │ ├── create-app │ │ ├── .gitignore │ │ ├── CHANGELOG.md │ │ ├── create-app.ts │ │ ├── helpers │ │ │ ├── copy.ts │ │ │ ├── get-pkg-manager.ts │ │ │ ├── git.ts │ │ │ ├── install.ts │ │ │ ├── is-folder-empty.ts │ │ │ ├── is-writeable.ts │ │ │ ├── make-dir.ts │ │ │ └── validate-pkg.ts │ │ ├── index.ts │ │ ├── package.json │ │ ├── templates │ │ │ ├── default │ │ │ │ └── ts │ │ │ │ ├── gitignore │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── public │ │ │ │ │ ├── mockServiceWorker.js │ │ │ │ │ ├── resources │ │ │ │ │ │ ├── favicon.ico │ │ │ │ │ │ └── xmlui-logo.svg │ │ │ │ │ └── serve.json │ │ │ │ └── src │ │ │ │ ├── components │ │ │ │ │ ├── ApiAware.xmlui │ │ │ │ │ ├── Home.xmlui │ │ │ │ │ ├── IncButton.xmlui │ │ │ │ │ └── PagePanel.xmlui │ │ │ │ ├── config.ts │ │ │ │ └── Main.xmlui │ │ │ ├── index.ts │ │ │ └── types.ts │ │ └── tsconfig.json │ ├── create-xmlui-hello-world │ │ ├── index.js │ │ └── package.json │ └── vscode │ ├── .gitignore │ ├── .vscode │ │ ├── launch.json │ │ └── tasks.json │ ├── .vscodeignore │ ├── build.sh │ ├── CHANGELOG.md │ ├── esbuild.js │ ├── eslint.config.mjs │ ├── formatter-docs.md │ ├── generate-test-sample.sh │ ├── LICENSE.md │ ├── package-lock.json │ ├── package.json │ ├── README.md │ ├── resources │ │ ├── xmlui-logo.png │ │ └── xmlui-markup-syntax-highlighting.png │ ├── src │ │ ├── extension.ts │ │ └── server.ts │ ├── syntaxes │ │ └── xmlui.tmLanguage.json │ ├── test-samples │ │ └── sample.xmlui │ ├── tsconfig.json │ └── tsconfig.tsbuildinfo ├── turbo.json └── xmlui ├── .gitignore ├── bin │ ├── bootstrap.js │ ├── build-lib.ts │ ├── build.ts │ ├── index.ts │ ├── preview.ts │ ├── start.ts │ ├── vite-xmlui-plugin.ts │ └── viteConfig.ts ├── CHANGELOG.md ├── conventions │ ├── component-qa-checklist.md │ ├── copilot-conventions.md │ ├── create-xmlui-components.md │ └── testing-conventions.md ├── dev-docs │ ├── accessibility.md │ ├── actions.md │ ├── AppRoot.md │ ├── component-apis.md │ ├── component-rendering.md │ ├── component-review-checklist.md │ ├── data-sources.md │ ├── e2e-summary.md │ ├── expression-evaluation.md │ ├── glossary.md │ ├── helper-components.md │ ├── index.md │ ├── loaders.md │ ├── next │ │ ├── component-dev-guide.md │ │ ├── configuration-management-enhancement-summary.md │ │ ├── documentation-scripts-refactoring-complete-summary.md │ │ ├── documentation-scripts-refactoring-plan.md │ │ ├── duplicate-pattern-extraction-summary.md │ │ ├── error-handling-standardization-summary.md │ │ ├── generating-component-reference.md │ │ ├── index.md │ │ ├── logging-consistency-implementation-summary.md │ │ ├── project-build.md │ │ ├── project-structure.md │ │ ├── theme-context.md │ │ ├── tiptap-design-considerations.md │ │ ├── working-with-code.md │ │ ├── xmlui-runtime-architecture │ │ └── xmlui-wcag-accessibility-report.md │ ├── react-fundamentals.md │ ├── release-method.md │ ├── rendering-fundamentals.md │ ├── reusable-components.md │ ├── standalone-apps.md │ ├── state-management.md │ └── xmlui-extensibility.xlsx ├── package.json ├── playwright.config.ts ├── scripts │ ├── coverage-only.js │ ├── e2e-test-summary.js │ ├── generate-docs │ │ ├── build-downloads-map.mjs │ │ ├── build-pages-map.mjs │ │ ├── components-config.json │ │ ├── configuration-management.mjs │ │ ├── constants.mjs │ │ ├── create-theme-files.mjs │ │ ├── DocsGenerator.mjs │ │ ├── error-handling.mjs │ │ ├── extensions-config.json │ │ ├── folders.mjs │ │ ├── generate-summary-files.mjs │ │ ├── get-docs.mjs │ │ ├── input-handler.mjs │ │ ├── logger.mjs │ │ ├── logging-standards.mjs │ │ ├── MetadataProcessor.mjs │ │ ├── pattern-utilities.mjs │ │ └── utils.mjs │ ├── get-langserver-metadata.mjs │ ├── inline-links.mjs │ └── README-e2e-summary.md ├── src │ ├── abstractions │ │ ├── _conventions.md │ │ ├── ActionDefs.ts │ │ ├── AppContextDefs.ts │ │ ├── ComponentDefs.ts │ │ ├── ContainerDefs.ts │ │ ├── ExtensionDefs.ts │ │ ├── FunctionDefs.ts │ │ ├── RendererDefs.ts │ │ ├── scripting │ │ │ ├── BlockScope.ts │ │ │ ├── Compilation.ts │ │ │ ├── LogicalThread.ts │ │ │ ├── LoopScope.ts │ │ │ ├── modules.ts │ │ │ ├── ScriptParserError.ts │ │ │ ├── Token.ts │ │ │ ├── TryScope.ts │ │ │ └── TryScopeExp.ts │ │ └── ThemingDefs.ts │ ├── components │ │ ├── _conventions.md │ │ ├── abstractions.ts │ │ ├── Accordion │ │ │ ├── Accordion.md │ │ │ ├── Accordion.module.scss │ │ │ ├── Accordion.spec.ts │ │ │ ├── Accordion.tsx │ │ │ ├── AccordionContext.tsx │ │ │ ├── AccordionItem.tsx │ │ │ ├── AccordionItemNative.tsx │ │ │ └── AccordionNative.tsx │ │ ├── Animation │ │ │ └── AnimationNative.tsx │ │ ├── APICall │ │ │ ├── APICall.md │ │ │ ├── APICall.spec.ts │ │ │ ├── APICall.tsx │ │ │ └── APICallNative.tsx │ │ ├── App │ │ │ ├── App.md │ │ │ ├── App.module.scss │ │ │ ├── App.spec.ts │ │ │ ├── App.tsx │ │ │ ├── AppLayoutContext.ts │ │ │ ├── AppNative.tsx │ │ │ ├── AppStateContext.ts │ │ │ ├── doc-resources │ │ │ │ ├── condensed-sticky.xmlui │ │ │ │ ├── condensed.xmlui │ │ │ │ ├── horizontal-sticky.xmlui │ │ │ │ ├── horizontal.xmlui │ │ │ │ ├── vertical-full-header.xmlui │ │ │ │ ├── vertical-sticky.xmlui │ │ │ │ └── vertical.xmlui │ │ │ ├── IndexerContext.ts │ │ │ ├── LinkInfoContext.ts │ │ │ ├── SearchContext.tsx │ │ │ ├── Sheet.module.scss │ │ │ └── Sheet.tsx │ │ ├── AppHeader │ │ │ ├── AppHeader.md │ │ │ ├── AppHeader.module.scss │ │ │ ├── AppHeader.spec.ts │ │ │ ├── AppHeader.tsx │ │ │ └── AppHeaderNative.tsx │ │ ├── AppState │ │ │ ├── AppState.md │ │ │ ├── AppState.spec.ts │ │ │ ├── AppState.tsx │ │ │ └── AppStateNative.tsx │ │ ├── AutoComplete │ │ │ ├── AutoComplete.md │ │ │ ├── AutoComplete.module.scss │ │ │ ├── AutoComplete.spec.ts │ │ │ ├── AutoComplete.tsx │ │ │ ├── AutoCompleteContext.tsx │ │ │ └── AutoCompleteNative.tsx │ │ ├── Avatar │ │ │ ├── Avatar.md │ │ │ ├── Avatar.module.scss │ │ │ ├── Avatar.spec.ts │ │ │ ├── Avatar.tsx │ │ │ └── AvatarNative.tsx │ │ ├── Backdrop │ │ │ ├── Backdrop.md │ │ │ ├── Backdrop.module.scss │ │ │ ├── Backdrop.spec.ts │ │ │ ├── Backdrop.tsx │ │ │ └── BackdropNative.tsx │ │ ├── Badge │ │ │ ├── Badge.md │ │ │ ├── Badge.module.scss │ │ │ ├── Badge.spec.ts │ │ │ ├── Badge.tsx │ │ │ └── BadgeNative.tsx │ │ ├── Bookmark │ │ │ ├── Bookmark.md │ │ │ ├── Bookmark.module.scss │ │ │ ├── Bookmark.spec.ts │ │ │ ├── Bookmark.tsx │ │ │ └── BookmarkNative.tsx │ │ ├── Breakout │ │ │ ├── Breakout.module.scss │ │ │ ├── Breakout.spec.ts │ │ │ ├── Breakout.tsx │ │ │ └── BreakoutNative.tsx │ │ ├── Button │ │ │ ├── Button-style.spec.ts │ │ │ ├── Button.md │ │ │ ├── Button.module.scss │ │ │ ├── Button.spec.ts │ │ │ ├── Button.tsx │ │ │ └── ButtonNative.tsx │ │ ├── Card │ │ │ ├── Card.md │ │ │ ├── Card.module.scss │ │ │ ├── Card.spec.ts │ │ │ ├── Card.tsx │ │ │ └── CardNative.tsx │ │ ├── Carousel │ │ │ ├── Carousel.md │ │ │ ├── Carousel.module.scss │ │ │ ├── Carousel.spec.ts │ │ │ ├── Carousel.tsx │ │ │ ├── CarouselContext.tsx │ │ │ ├── CarouselItem.tsx │ │ │ ├── CarouselItemNative.tsx │ │ │ └── CarouselNative.tsx │ │ ├── ChangeListener │ │ │ ├── ChangeListener.md │ │ │ ├── ChangeListener.spec.ts │ │ │ ├── ChangeListener.tsx │ │ │ └── ChangeListenerNative.tsx │ │ ├── chart-color-schemes.ts │ │ ├── Charts │ │ │ ├── AreaChart │ │ │ │ ├── AreaChart.md │ │ │ │ ├── AreaChart.spec.ts │ │ │ │ ├── AreaChart.tsx │ │ │ │ └── AreaChartNative.tsx │ │ │ ├── BarChart │ │ │ │ ├── BarChart.md │ │ │ │ ├── BarChart.module.scss │ │ │ │ ├── BarChart.spec.ts │ │ │ │ ├── BarChart.tsx │ │ │ │ └── BarChartNative.tsx │ │ │ ├── DonutChart │ │ │ │ ├── DonutChart.spec.ts │ │ │ │ └── DonutChart.tsx │ │ │ ├── LabelList │ │ │ │ ├── LabelList.spec.ts │ │ │ │ ├── LabelList.tsx │ │ │ │ ├── LabelListNative.module.scss │ │ │ │ └── LabelListNative.tsx │ │ │ ├── Legend │ │ │ │ ├── Legend.spec.ts │ │ │ │ ├── Legend.tsx │ │ │ │ └── LegendNative.tsx │ │ │ ├── LineChart │ │ │ │ ├── LineChart.md │ │ │ │ ├── LineChart.module.scss │ │ │ │ ├── LineChart.spec.ts │ │ │ │ ├── LineChart.tsx │ │ │ │ └── LineChartNative.tsx │ │ │ ├── PieChart │ │ │ │ ├── PieChart.md │ │ │ │ ├── PieChart.spec.ts │ │ │ │ ├── PieChart.tsx │ │ │ │ ├── PieChartNative.module.scss │ │ │ │ └── PieChartNative.tsx │ │ │ ├── RadarChart │ │ │ │ ├── RadarChart.md │ │ │ │ ├── RadarChart.spec.ts │ │ │ │ ├── RadarChart.tsx │ │ │ │ └── RadarChartNative.tsx │ │ │ ├── Tooltip │ │ │ │ ├── TooltipContent.module.scss │ │ │ │ ├── TooltipContent.spec.ts │ │ │ │ └── TooltipContent.tsx │ │ │ └── utils │ │ │ ├── abstractions.ts │ │ │ └── ChartProvider.tsx │ │ ├── Checkbox │ │ │ ├── Checkbox.md │ │ │ ├── Checkbox.spec.ts │ │ │ └── Checkbox.tsx │ │ ├── CodeBlock │ │ │ ├── CodeBlock.module.scss │ │ │ ├── CodeBlock.spec.ts │ │ │ ├── CodeBlock.tsx │ │ │ ├── CodeBlockNative.tsx │ │ │ └── highlight-code.ts │ │ ├── collectedComponentMetadata.ts │ │ ├── ColorPicker │ │ │ ├── ColorPicker.md │ │ │ ├── ColorPicker.module.scss │ │ │ ├── ColorPicker.spec.ts │ │ │ ├── ColorPicker.tsx │ │ │ └── ColorPickerNative.tsx │ │ ├── Column │ │ │ ├── Column.md │ │ │ ├── Column.tsx │ │ │ ├── ColumnNative.tsx │ │ │ ├── doc-resources │ │ │ │ └── list-component-data.js │ │ │ └── TableContext.tsx │ │ ├── component-utils.ts │ │ ├── ComponentProvider.tsx │ │ ├── ComponentRegistryContext.tsx │ │ ├── container-helpers.tsx │ │ ├── ContentSeparator │ │ │ ├── ContentSeparator.md │ │ │ ├── ContentSeparator.module.scss │ │ │ ├── ContentSeparator.spec.ts │ │ │ ├── ContentSeparator.tsx │ │ │ └── ContentSeparatorNative.tsx │ │ ├── DataSource │ │ │ ├── DataSource.md │ │ │ └── DataSource.tsx │ │ ├── DateInput │ │ │ ├── DateInput.md │ │ │ ├── DateInput.module.scss │ │ │ ├── DateInput.spec.ts │ │ │ ├── DateInput.tsx │ │ │ └── DateInputNative.tsx │ │ ├── DatePicker │ │ │ ├── DatePicker.md │ │ │ ├── DatePicker.module.scss │ │ │ ├── DatePicker.spec.ts │ │ │ ├── DatePicker.tsx │ │ │ └── DatePickerNative.tsx │ │ ├── DropdownMenu │ │ │ ├── DropdownMenu.md │ │ │ ├── DropdownMenu.module.scss │ │ │ ├── DropdownMenu.spec.ts │ │ │ ├── DropdownMenu.tsx │ │ │ ├── DropdownMenuNative.tsx │ │ │ ├── MenuItem.md │ │ │ └── SubMenuItem.md │ │ ├── EmojiSelector │ │ │ ├── EmojiSelector.md │ │ │ ├── EmojiSelector.spec.ts │ │ │ ├── EmojiSelector.tsx │ │ │ └── EmojiSelectorNative.tsx │ │ ├── ExpandableItem │ │ │ ├── ExpandableItem.module.scss │ │ │ ├── ExpandableItem.spec.ts │ │ │ ├── ExpandableItem.tsx │ │ │ └── ExpandableItemNative.tsx │ │ ├── FileInput │ │ │ ├── FileInput.md │ │ │ ├── FileInput.module.scss │ │ │ ├── FileInput.spec.ts │ │ │ ├── FileInput.tsx │ │ │ └── FileInputNative.tsx │ │ ├── FileUploadDropZone │ │ │ ├── FileUploadDropZone.md │ │ │ ├── FileUploadDropZone.module.scss │ │ │ ├── FileUploadDropZone.spec.ts │ │ │ ├── FileUploadDropZone.tsx │ │ │ └── FileUploadDropZoneNative.tsx │ │ ├── FlowLayout │ │ │ ├── FlowLayout.md │ │ │ ├── FlowLayout.module.scss │ │ │ ├── FlowLayout.spec.ts │ │ │ ├── FlowLayout.spec.ts-snapshots │ │ │ │ └── Edge-cases-boxShadow-is-not-clipped-1-non-smoke-darwin.png │ │ │ ├── FlowLayout.tsx │ │ │ └── FlowLayoutNative.tsx │ │ ├── Footer │ │ │ ├── Footer.md │ │ │ ├── Footer.module.scss │ │ │ ├── Footer.spec.ts │ │ │ ├── Footer.tsx │ │ │ └── FooterNative.tsx │ │ ├── Form │ │ │ ├── Form.md │ │ │ ├── Form.module.scss │ │ │ ├── Form.spec.ts │ │ │ ├── Form.tsx │ │ │ ├── formActions.ts │ │ │ ├── FormContext.ts │ │ │ └── FormNative.tsx │ │ ├── FormItem │ │ │ ├── FormItem.md │ │ │ ├── FormItem.module.scss │ │ │ ├── FormItem.spec.ts │ │ │ ├── FormItem.tsx │ │ │ ├── FormItemNative.tsx │ │ │ ├── HelperText.module.scss │ │ │ ├── HelperText.tsx │ │ │ ├── ItemWithLabel.tsx │ │ │ └── Validations.ts │ │ ├── FormSection │ │ │ ├── FormSection.md │ │ │ ├── FormSection.ts │ │ │ └── FormSection.xmlui │ │ ├── Fragment │ │ │ ├── Fragment.spec.ts │ │ │ └── Fragment.tsx │ │ ├── Heading │ │ │ ├── abstractions.ts │ │ │ ├── H1.md │ │ │ ├── H1.spec.ts │ │ │ ├── H2.md │ │ │ ├── H2.spec.ts │ │ │ ├── H3.md │ │ │ ├── H3.spec.ts │ │ │ ├── H4.md │ │ │ ├── H4.spec.ts │ │ │ ├── H5.md │ │ │ ├── H5.spec.ts │ │ │ ├── H6.md │ │ │ ├── H6.spec.ts │ │ │ ├── Heading.md │ │ │ ├── Heading.module.scss │ │ │ ├── Heading.spec.ts │ │ │ ├── Heading.tsx │ │ │ └── HeadingNative.tsx │ │ ├── HoverCard │ │ │ ├── HoverCard.tsx │ │ │ └── HovercardNative.tsx │ │ ├── HtmlTags │ │ │ ├── HtmlTags.module.scss │ │ │ ├── HtmlTags.spec.ts │ │ │ └── HtmlTags.tsx │ │ ├── Icon │ │ │ ├── AdmonitionDanger.tsx │ │ │ ├── AdmonitionInfo.tsx │ │ │ ├── AdmonitionNote.tsx │ │ │ ├── AdmonitionTip.tsx │ │ │ ├── AdmonitionWarning.tsx │ │ │ ├── ApiIcon.tsx │ │ │ ├── ArrowDropDown.module.scss │ │ │ ├── ArrowDropDown.tsx │ │ │ ├── ArrowDropUp.module.scss │ │ │ ├── ArrowDropUp.tsx │ │ │ ├── ArrowLeft.module.scss │ │ │ ├── ArrowLeft.tsx │ │ │ ├── ArrowRight.module.scss │ │ │ ├── ArrowRight.tsx │ │ │ ├── Attach.tsx │ │ │ ├── Binding.module.scss │ │ │ ├── Binding.tsx │ │ │ ├── BoardIcon.tsx │ │ │ ├── BoxIcon.tsx │ │ │ ├── CheckIcon.tsx │ │ │ ├── ChevronDownIcon.tsx │ │ │ ├── ChevronLeft.tsx │ │ │ ├── ChevronRight.tsx │ │ │ ├── ChevronUpIcon.tsx │ │ │ ├── CodeFileIcon.tsx │ │ │ ├── CodeSandbox.tsx │ │ │ ├── CompactListIcon.tsx │ │ │ ├── ContentCopyIcon.tsx │ │ │ ├── DarkToLightIcon.tsx │ │ │ ├── DatabaseIcon.module.scss │ │ │ ├── DatabaseIcon.tsx │ │ │ ├── DocFileIcon.tsx │ │ │ ├── DocIcon.tsx │ │ │ ├── DotMenuHorizontalIcon.tsx │ │ │ ├── DotMenuIcon.tsx │ │ │ ├── EmailIcon.tsx │ │ │ ├── EmptyFolderIcon.tsx │ │ │ ├── ErrorIcon.tsx │ │ │ ├── ExpressionIcon.tsx │ │ │ ├── FillPlusCricleIcon.tsx │ │ │ ├── FilterIcon.tsx │ │ │ ├── FolderIcon.tsx │ │ │ ├── GlobeIcon.tsx │ │ │ ├── HomeIcon.tsx │ │ │ ├── HyperLinkIcon.tsx │ │ │ ├── Icon.md │ │ │ ├── Icon.module.scss │ │ │ ├── Icon.spec.ts │ │ │ ├── Icon.tsx │ │ │ ├── IconNative.tsx │ │ │ ├── ImageFileIcon.tsx │ │ │ ├── Inspect.tsx │ │ │ ├── LightToDark.tsx │ │ │ ├── LinkIcon.tsx │ │ │ ├── ListIcon.tsx │ │ │ ├── LooseListIcon.tsx │ │ │ ├── MoonIcon.tsx │ │ │ ├── MoreOptionsIcon.tsx │ │ │ ├── NoSortIcon.tsx │ │ │ ├── PDFIcon.tsx │ │ │ ├── PenIcon.tsx │ │ │ ├── PhoneIcon.tsx │ │ │ ├── PhotoIcon.tsx │ │ │ ├── PlusIcon.tsx │ │ │ ├── SearchIcon.tsx │ │ │ ├── ShareIcon.tsx │ │ │ ├── SortAscendingIcon.tsx │ │ │ ├── SortDescendingIcon.tsx │ │ │ ├── StarsIcon.tsx │ │ │ ├── SunIcon.tsx │ │ │ ├── svg │ │ │ │ ├── admonition_danger.svg │ │ │ │ ├── admonition_info.svg │ │ │ │ ├── admonition_note.svg │ │ │ │ ├── admonition_tip.svg │ │ │ │ ├── admonition_warning.svg │ │ │ │ ├── api.svg │ │ │ │ ├── arrow-dropdown.svg │ │ │ │ ├── arrow-left.svg │ │ │ │ ├── arrow-right.svg │ │ │ │ ├── arrow-up.svg │ │ │ │ ├── attach.svg │ │ │ │ ├── binding.svg │ │ │ │ ├── box.svg │ │ │ │ ├── bulb.svg │ │ │ │ ├── code-file.svg │ │ │ │ ├── code-sandbox.svg │ │ │ │ ├── dark_to_light.svg │ │ │ │ ├── database.svg │ │ │ │ ├── doc.svg │ │ │ │ ├── empty-folder.svg │ │ │ │ ├── expression.svg │ │ │ │ ├── eye-closed.svg │ │ │ │ ├── eye-dark.svg │ │ │ │ ├── eye.svg │ │ │ │ ├── file-text.svg │ │ │ │ ├── filter.svg │ │ │ │ ├── folder.svg │ │ │ │ ├── img.svg │ │ │ │ ├── inspect.svg │ │ │ │ ├── light_to_dark.svg │ │ │ │ ├── moon.svg │ │ │ │ ├── pdf.svg │ │ │ │ ├── photo.svg │ │ │ │ ├── share.svg │ │ │ │ ├── stars.svg │ │ │ │ ├── sun.svg │ │ │ │ ├── trending-down.svg │ │ │ │ ├── trending-level.svg │ │ │ │ ├── trending-up.svg │ │ │ │ ├── txt.svg │ │ │ │ ├── unknown-file.svg │ │ │ │ ├── unlink.svg │ │ │ │ └── xls.svg │ │ │ ├── TableDeleteColumnIcon.tsx │ │ │ ├── TableDeleteRowIcon.tsx │ │ │ ├── TableInsertColumnIcon.tsx │ │ │ ├── TableInsertRowIcon.tsx │ │ │ ├── TrashIcon.tsx │ │ │ ├── TrendingDownIcon.tsx │ │ │ ├── TrendingLevelIcon.tsx │ │ │ ├── TrendingUpIcon.tsx │ │ │ ├── TxtIcon.tsx │ │ │ ├── UnknownFileIcon.tsx │ │ │ ├── UnlinkIcon.tsx │ │ │ ├── UserIcon.tsx │ │ │ ├── WarningIcon.tsx │ │ │ └── XlsIcon.tsx │ │ ├── IconProvider.tsx │ │ ├── IconRegistryContext.tsx │ │ ├── IFrame │ │ │ ├── IFrame.md │ │ │ ├── IFrame.module.scss │ │ │ ├── IFrame.spec.ts │ │ │ ├── IFrame.tsx │ │ │ └── IFrameNative.tsx │ │ ├── Image │ │ │ ├── Image.md │ │ │ ├── Image.module.scss │ │ │ ├── Image.spec.ts │ │ │ ├── Image.tsx │ │ │ └── ImageNative.tsx │ │ ├── Input │ │ │ ├── index.ts │ │ │ ├── InputAdornment.module.scss │ │ │ ├── InputAdornment.tsx │ │ │ ├── InputDivider.module.scss │ │ │ ├── InputDivider.tsx │ │ │ ├── InputLabel.module.scss │ │ │ ├── InputLabel.tsx │ │ │ ├── PartialInput.module.scss │ │ │ └── PartialInput.tsx │ │ ├── InspectButton │ │ │ ├── InspectButton.module.scss │ │ │ └── InspectButton.tsx │ │ ├── Items │ │ │ ├── Items.md │ │ │ ├── Items.spec.ts │ │ │ ├── Items.tsx │ │ │ └── ItemsNative.tsx │ │ ├── Link │ │ │ ├── Link.md │ │ │ ├── Link.module.scss │ │ │ ├── Link.spec.ts │ │ │ ├── Link.tsx │ │ │ └── LinkNative.tsx │ │ ├── List │ │ │ ├── doc-resources │ │ │ │ └── list-component-data.js │ │ │ ├── List.md │ │ │ ├── List.module.scss │ │ │ ├── List.spec.ts │ │ │ ├── List.tsx │ │ │ └── ListNative.tsx │ │ ├── Logo │ │ │ ├── doc-resources │ │ │ │ └── xmlui-logo.svg │ │ │ ├── Logo.md │ │ │ ├── Logo.tsx │ │ │ └── LogoNative.tsx │ │ ├── Markdown │ │ │ ├── CodeText.module.scss │ │ │ ├── CodeText.tsx │ │ │ ├── Markdown.md │ │ │ ├── Markdown.module.scss │ │ │ ├── Markdown.spec.ts │ │ │ ├── Markdown.tsx │ │ │ ├── MarkdownNative.tsx │ │ │ ├── parse-binding-expr.ts │ │ │ └── utils.ts │ │ ├── metadata-helpers.ts │ │ ├── ModalDialog │ │ │ ├── ConfirmationModalContextProvider.tsx │ │ │ ├── Dialog.module.scss │ │ │ ├── Dialog.tsx │ │ │ ├── ModalDialog.md │ │ │ ├── ModalDialog.module.scss │ │ │ ├── ModalDialog.spec.ts │ │ │ ├── ModalDialog.tsx │ │ │ ├── ModalDialogNative.tsx │ │ │ └── ModalVisibilityContext.tsx │ │ ├── NavGroup │ │ │ ├── NavGroup.md │ │ │ ├── NavGroup.module.scss │ │ │ ├── NavGroup.spec.ts │ │ │ ├── NavGroup.tsx │ │ │ ├── NavGroupContext.ts │ │ │ └── NavGroupNative.tsx │ │ ├── NavLink │ │ │ ├── NavLink.md │ │ │ ├── NavLink.module.scss │ │ │ ├── NavLink.spec.ts │ │ │ ├── NavLink.tsx │ │ │ └── NavLinkNative.tsx │ │ ├── NavPanel │ │ │ ├── NavPanel.md │ │ │ ├── NavPanel.module.scss │ │ │ ├── NavPanel.spec.ts │ │ │ ├── NavPanel.tsx │ │ │ └── NavPanelNative.tsx │ │ ├── NestedApp │ │ │ ├── AppWithCodeView.module.scss │ │ │ ├── AppWithCodeView.tsx │ │ │ ├── AppWithCodeViewNative.tsx │ │ │ ├── defaultProps.tsx │ │ │ ├── logo.svg │ │ │ ├── NestedApp.module.scss │ │ │ ├── NestedApp.tsx │ │ │ ├── NestedAppNative.tsx │ │ │ ├── Tooltip.module.scss │ │ │ ├── Tooltip.tsx │ │ │ └── utils.ts │ │ ├── NoResult │ │ │ ├── NoResult.md │ │ │ ├── NoResult.module.scss │ │ │ ├── NoResult.spec.ts │ │ │ ├── NoResult.tsx │ │ │ └── NoResultNative.tsx │ │ ├── NumberBox │ │ │ ├── numberbox-abstractions.ts │ │ │ ├── NumberBox.md │ │ │ ├── NumberBox.module.scss │ │ │ ├── NumberBox.spec.ts │ │ │ ├── NumberBox.tsx │ │ │ └── NumberBoxNative.tsx │ │ ├── Option │ │ │ ├── Option.md │ │ │ ├── Option.spec.ts │ │ │ ├── Option.tsx │ │ │ ├── OptionNative.tsx │ │ │ └── OptionTypeProvider.tsx │ │ ├── PageMetaTitle │ │ │ ├── PageMetaTilteNative.tsx │ │ │ ├── PageMetaTitle.md │ │ │ ├── PageMetaTitle.spec.ts │ │ │ └── PageMetaTitle.tsx │ │ ├── Pages │ │ │ ├── Page.md │ │ │ ├── Pages.md │ │ │ ├── Pages.module.scss │ │ │ ├── Pages.tsx │ │ │ └── PagesNative.tsx │ │ ├── Pagination │ │ │ ├── Pagination.md │ │ │ ├── Pagination.module.scss │ │ │ ├── Pagination.spec.ts │ │ │ ├── Pagination.tsx │ │ │ └── PaginationNative.tsx │ │ ├── PositionedContainer │ │ │ ├── PositionedContainer.module.scss │ │ │ ├── PositionedContainer.tsx │ │ │ └── PositionedContainerNative.tsx │ │ ├── ProfileMenu │ │ │ ├── ProfileMenu.module.scss │ │ │ └── ProfileMenu.tsx │ │ ├── ProgressBar │ │ │ ├── ProgressBar.md │ │ │ ├── ProgressBar.module.scss │ │ │ ├── ProgressBar.spec.ts │ │ │ ├── ProgressBar.tsx │ │ │ └── ProgressBarNative.tsx │ │ ├── Queue │ │ │ ├── Queue.md │ │ │ ├── Queue.spec.ts │ │ │ ├── Queue.tsx │ │ │ ├── queueActions.ts │ │ │ └── QueueNative.tsx │ │ ├── RadioGroup │ │ │ ├── RadioGroup.md │ │ │ ├── RadioGroup.module.scss │ │ │ ├── RadioGroup.spec.ts │ │ │ ├── RadioGroup.tsx │ │ │ ├── RadioGroupNative.tsx │ │ │ ├── RadioItem.tsx │ │ │ └── RadioItemNative.tsx │ │ ├── RealTimeAdapter │ │ │ ├── RealTimeAdapter.tsx │ │ │ └── RealTimeAdapterNative.tsx │ │ ├── Redirect │ │ │ ├── Redirect.md │ │ │ ├── Redirect.spec.ts │ │ │ └── Redirect.tsx │ │ ├── ResponsiveBar │ │ │ ├── README.md │ │ │ ├── ResponsiveBar.md │ │ │ ├── ResponsiveBar.module.scss │ │ │ ├── ResponsiveBar.spec.ts │ │ │ ├── ResponsiveBar.tsx │ │ │ └── ResponsiveBarNative.tsx │ │ ├── Select │ │ │ ├── HiddenOption.tsx │ │ │ ├── OptionContext.ts │ │ │ ├── Select.md │ │ │ ├── Select.module.scss │ │ │ ├── Select.spec.ts │ │ │ ├── Select.tsx │ │ │ ├── SelectContext.tsx │ │ │ └── SelectNative.tsx │ │ ├── SelectionStore │ │ │ ├── SelectionStore.md │ │ │ ├── SelectionStore.tsx │ │ │ └── SelectionStoreNative.tsx │ │ ├── Slider │ │ │ ├── Slider.md │ │ │ ├── Slider.module.scss │ │ │ ├── Slider.spec.ts │ │ │ ├── Slider.tsx │ │ │ └── SliderNative.tsx │ │ ├── Slot │ │ │ ├── Slot.md │ │ │ ├── Slot.spec.ts │ │ │ └── Slot.ts │ │ ├── SlotItem.tsx │ │ ├── SpaceFiller │ │ │ ├── SpaceFiller.md │ │ │ ├── SpaceFiller.module.scss │ │ │ ├── SpaceFiller.spec.ts │ │ │ ├── SpaceFiller.tsx │ │ │ └── SpaceFillerNative.tsx │ │ ├── Spinner │ │ │ ├── Spinner.md │ │ │ ├── Spinner.module.scss │ │ │ ├── Spinner.spec.ts │ │ │ ├── Spinner.tsx │ │ │ └── SpinnerNative.tsx │ │ ├── Splitter │ │ │ ├── HSplitter.md │ │ │ ├── HSplitter.spec.ts │ │ │ ├── Splitter.md │ │ │ ├── Splitter.module.scss │ │ │ ├── Splitter.spec.ts │ │ │ ├── Splitter.tsx │ │ │ ├── SplitterNative.tsx │ │ │ ├── utils.ts │ │ │ ├── VSplitter.md │ │ │ └── VSplitter.spec.ts │ │ ├── Stack │ │ │ ├── CHStack.md │ │ │ ├── CHStack.spec.ts │ │ │ ├── CVStack.md │ │ │ ├── CVStack.spec.ts │ │ │ ├── HStack.md │ │ │ ├── HStack.spec.ts │ │ │ ├── Stack.md │ │ │ ├── Stack.module.scss │ │ │ ├── Stack.spec.ts │ │ │ ├── Stack.tsx │ │ │ ├── StackNative.tsx │ │ │ ├── VStack.md │ │ │ └── VStack.spec.ts │ │ ├── StickyBox │ │ │ ├── StickyBox.md │ │ │ ├── StickyBox.module.scss │ │ │ ├── StickyBox.tsx │ │ │ └── StickyBoxNative.tsx │ │ ├── Switch │ │ │ ├── Switch.md │ │ │ ├── Switch.spec.ts │ │ │ └── Switch.tsx │ │ ├── Table │ │ │ ├── doc-resources │ │ │ │ └── list-component-data.js │ │ │ ├── react-table-config.d.ts │ │ │ ├── Table.md │ │ │ ├── Table.module.scss │ │ │ ├── Table.spec.ts │ │ │ ├── Table.tsx │ │ │ ├── TableNative.tsx │ │ │ └── useRowSelection.tsx │ │ ├── TableOfContents │ │ │ ├── TableOfContents.module.scss │ │ │ ├── TableOfContents.spec.ts │ │ │ ├── TableOfContents.tsx │ │ │ └── TableOfContentsNative.tsx │ │ ├── Tabs │ │ │ ├── TabContext.tsx │ │ │ ├── TabItem.md │ │ │ ├── TabItem.tsx │ │ │ ├── TabItemNative.tsx │ │ │ ├── Tabs.md │ │ │ ├── Tabs.module.scss │ │ │ ├── Tabs.spec.ts │ │ │ ├── Tabs.tsx │ │ │ └── TabsNative.tsx │ │ ├── Text │ │ │ ├── Text.md │ │ │ ├── Text.module.scss │ │ │ ├── Text.spec.ts │ │ │ ├── Text.tsx │ │ │ └── TextNative.tsx │ │ ├── TextArea │ │ │ ├── TextArea.md │ │ │ ├── TextArea.module.scss │ │ │ ├── TextArea.spec.ts │ │ │ ├── TextArea.tsx │ │ │ ├── TextAreaNative.tsx │ │ │ ├── TextAreaResizable.tsx │ │ │ └── useComposedRef.ts │ │ ├── TextBox │ │ │ ├── TextBox.md │ │ │ ├── TextBox.module.scss │ │ │ ├── TextBox.spec.ts │ │ │ ├── TextBox.tsx │ │ │ └── TextBoxNative.tsx │ │ ├── Theme │ │ │ ├── NotificationToast.tsx │ │ │ ├── Theme.md │ │ │ ├── Theme.module.scss │ │ │ ├── Theme.spec.ts │ │ │ ├── Theme.tsx │ │ │ └── ThemeNative.tsx │ │ ├── TimeInput │ │ │ ├── TimeInput.md │ │ │ ├── TimeInput.module.scss │ │ │ ├── TimeInput.spec.ts │ │ │ ├── TimeInput.tsx │ │ │ ├── TimeInputNative.tsx │ │ │ └── utils.ts │ │ ├── Timer │ │ │ ├── Timer.md │ │ │ ├── Timer.spec.ts │ │ │ ├── Timer.tsx │ │ │ └── TimerNative.tsx │ │ ├── Toggle │ │ │ ├── Toggle.module.scss │ │ │ └── Toggle.tsx │ │ ├── ToneChangerButton │ │ │ ├── ToneChangerButton.md │ │ │ ├── ToneChangerButton.spec.ts │ │ │ └── ToneChangerButton.tsx │ │ ├── ToneSwitch │ │ │ ├── ToneSwitch.md │ │ │ ├── ToneSwitch.module.scss │ │ │ ├── ToneSwitch.spec.ts │ │ │ ├── ToneSwitch.tsx │ │ │ └── ToneSwitchNative.tsx │ │ ├── Tooltip │ │ │ ├── Tooltip.md │ │ │ ├── Tooltip.module.scss │ │ │ ├── Tooltip.spec.ts │ │ │ ├── Tooltip.tsx │ │ │ └── TooltipNative.tsx │ │ ├── Tree │ │ │ ├── testData.ts │ │ │ ├── Tree-dynamic.spec.ts │ │ │ ├── Tree-icons.spec.ts │ │ │ ├── Tree.md │ │ │ ├── Tree.spec.ts │ │ │ ├── TreeComponent.module.scss │ │ │ ├── TreeComponent.tsx │ │ │ └── TreeNative.tsx │ │ ├── TreeDisplay │ │ │ ├── TreeDisplay.md │ │ │ ├── TreeDisplay.module.scss │ │ │ ├── TreeDisplay.tsx │ │ │ └── TreeDisplayNative.tsx │ │ ├── ValidationSummary │ │ │ ├── ValidationSummary.module.scss │ │ │ └── ValidationSummary.tsx │ │ └── VisuallyHidden.tsx │ ├── components-core │ │ ├── abstractions │ │ │ ├── ComponentRenderer.ts │ │ │ ├── LoaderRenderer.ts │ │ │ ├── standalone.ts │ │ │ └── treeAbstractions.ts │ │ ├── action │ │ │ ├── actions.ts │ │ │ ├── APICall.tsx │ │ │ ├── FileDownloadAction.tsx │ │ │ ├── FileUploadAction.tsx │ │ │ ├── NavigateAction.tsx │ │ │ └── TimedAction.tsx │ │ ├── ApiBoundComponent.tsx │ │ ├── appContext │ │ │ ├── date-functions.ts │ │ │ ├── math-function.ts │ │ │ └── misc-utils.ts │ │ ├── AppContext.tsx │ │ ├── behaviors │ │ │ ├── Behavior.tsx │ │ │ ├── BehaviorContext.tsx │ │ │ └── CoreBehaviors.tsx │ │ ├── component-hooks.ts │ │ ├── ComponentDecorator.tsx │ │ ├── ComponentViewer.tsx │ │ ├── CompoundComponent.tsx │ │ ├── constants.ts │ │ ├── DebugViewProvider.tsx │ │ ├── descriptorHelper.ts │ │ ├── devtools │ │ │ ├── InspectorDialog.module.scss │ │ │ ├── InspectorDialog.tsx │ │ │ └── InspectorDialogVisibilityContext.tsx │ │ ├── EngineError.ts │ │ ├── event-handlers.ts │ │ ├── InspectorButton.module.scss │ │ ├── InspectorContext.tsx │ │ ├── interception │ │ │ ├── abstractions.ts │ │ │ ├── ApiInterceptor.ts │ │ │ ├── ApiInterceptorProvider.tsx │ │ │ ├── apiInterceptorWorker.ts │ │ │ ├── Backend.ts │ │ │ ├── Errors.ts │ │ │ ├── IndexedDb.ts │ │ │ ├── initMock.ts │ │ │ ├── InMemoryDb.ts │ │ │ ├── ReadonlyCollection.ts │ │ │ └── useApiInterceptorContext.tsx │ │ ├── loader │ │ │ ├── ApiLoader.tsx │ │ │ ├── DataLoader.tsx │ │ │ ├── ExternalDataLoader.tsx │ │ │ ├── Loader.tsx │ │ │ ├── MockLoaderRenderer.tsx │ │ │ └── PageableLoader.tsx │ │ ├── LoaderComponent.tsx │ │ ├── markup-check.ts │ │ ├── parts.ts │ │ ├── renderers.ts │ │ ├── rendering │ │ │ ├── AppContent.tsx │ │ │ ├── AppRoot.tsx │ │ │ ├── AppWrapper.tsx │ │ │ ├── buildProxy.ts │ │ │ ├── collectFnVarDeps.ts │ │ │ ├── ComponentAdapter.tsx │ │ │ ├── ComponentWrapper.tsx │ │ │ ├── Container.tsx │ │ │ ├── containers.ts │ │ │ ├── ContainerWrapper.tsx │ │ │ ├── ErrorBoundary.module.scss │ │ │ ├── ErrorBoundary.tsx │ │ │ ├── InvalidComponent.module.scss │ │ │ ├── InvalidComponent.tsx │ │ │ ├── nodeUtils.ts │ │ │ ├── reducer.ts │ │ │ ├── renderChild.tsx │ │ │ ├── StandaloneComponent.tsx │ │ │ ├── StateContainer.tsx │ │ │ ├── UnknownComponent.module.scss │ │ │ ├── UnknownComponent.tsx │ │ │ └── valueExtractor.ts │ │ ├── reportEngineError.ts │ │ ├── RestApiProxy.ts │ │ ├── script-runner │ │ │ ├── asyncProxy.ts │ │ │ ├── AttributeValueParser.ts │ │ │ ├── bannedFunctions.ts │ │ │ ├── BindingTreeEvaluationContext.ts │ │ │ ├── eval-tree-async.ts │ │ │ ├── eval-tree-common.ts │ │ │ ├── eval-tree-sync.ts │ │ │ ├── ParameterParser.ts │ │ │ ├── process-statement-async.ts │ │ │ ├── process-statement-common.ts │ │ │ ├── process-statement-sync.ts │ │ │ ├── ScriptingSourceTree.ts │ │ │ ├── simplify-expression.ts │ │ │ ├── statement-queue.ts │ │ │ └── visitors.ts │ │ ├── StandaloneApp.tsx │ │ ├── StandaloneExtensionManager.ts │ │ ├── TableOfContentsContext.tsx │ │ ├── theming │ │ │ ├── _themes.scss │ │ │ ├── component-layout-resolver.ts │ │ │ ├── extendThemeUtils.ts │ │ │ ├── hvar.ts │ │ │ ├── layout-resolver.ts │ │ │ ├── parse-layout-props.ts │ │ │ ├── StyleContext.tsx │ │ │ ├── StyleRegistry.ts │ │ │ ├── ThemeContext.tsx │ │ │ ├── ThemeProvider.tsx │ │ │ ├── themes │ │ │ │ ├── base-utils.ts │ │ │ │ ├── palette.ts │ │ │ │ ├── root.ts │ │ │ │ ├── solid.ts │ │ │ │ ├── theme-colors.ts │ │ │ │ └── xmlui.ts │ │ │ ├── themeVars.module.scss │ │ │ ├── themeVars.ts │ │ │ ├── transformThemeVars.ts │ │ │ └── utils.ts │ │ ├── utils │ │ │ ├── actionUtils.ts │ │ │ ├── audio-utils.ts │ │ │ ├── compound-utils.ts │ │ │ ├── css-utils.ts │ │ │ ├── DataLoaderQueryKeyGenerator.ts │ │ │ ├── date-utils.ts │ │ │ ├── extractParam.ts │ │ │ ├── hooks.tsx │ │ │ ├── LruCache.ts │ │ │ ├── mergeProps.ts │ │ │ ├── misc.ts │ │ │ ├── request-params.ts │ │ │ ├── statementUtils.ts │ │ │ └── treeUtils.ts │ │ └── xmlui-parser.ts │ ├── index-standalone.ts │ ├── index.scss │ ├── index.ts │ ├── language-server │ │ ├── server-common.ts │ │ ├── server-web-worker.ts │ │ ├── server.ts │ │ ├── services │ │ │ ├── common │ │ │ │ ├── docs-generation.ts │ │ │ │ ├── lsp-utils.ts │ │ │ │ ├── metadata-utils.ts │ │ │ │ └── syntax-node-utilities.ts │ │ │ ├── completion.ts │ │ │ ├── diagnostic.ts │ │ │ ├── format.ts │ │ │ └── hover.ts │ │ └── xmlui-metadata-generated.mjs │ ├── logging │ │ ├── LoggerContext.tsx │ │ ├── LoggerInitializer.tsx │ │ ├── LoggerService.ts │ │ └── xmlui.ts │ ├── logo.svg │ ├── parsers │ │ ├── common │ │ │ ├── GenericToken.ts │ │ │ ├── InputStream.ts │ │ │ └── utils.ts │ │ ├── scripting │ │ │ ├── code-behind-collect.ts │ │ │ ├── Lexer.ts │ │ │ ├── modules.ts │ │ │ ├── Parser.ts │ │ │ ├── ParserError.ts │ │ │ ├── ScriptingNodeTypes.ts │ │ │ ├── TokenTrait.ts │ │ │ ├── TokenType.ts │ │ │ └── tree-visitor.ts │ │ ├── style-parser │ │ │ ├── errors.ts │ │ │ ├── source-tree.ts │ │ │ ├── StyleInputStream.ts │ │ │ ├── StyleLexer.ts │ │ │ ├── StyleParser.ts │ │ │ └── tokens.ts │ │ └── xmlui-parser │ │ ├── CharacterCodes.ts │ │ ├── diagnostics.ts │ │ ├── fileExtensions.ts │ │ ├── index.ts │ │ ├── lint.ts │ │ ├── parser.ts │ │ ├── ParserError.ts │ │ ├── scanner.ts │ │ ├── syntax-kind.ts │ │ ├── syntax-node.ts │ │ ├── transform.ts │ │ ├── utils.ts │ │ ├── xmlui-serializer.ts │ │ └── xmlui-tree.ts │ ├── react-app-env.d.ts │ ├── syntax │ │ ├── monaco │ │ │ ├── grammar.monacoLanguage.ts │ │ │ ├── index.ts │ │ │ ├── xmlui-dark.ts │ │ │ ├── xmlui-light.ts │ │ │ └── xmluiscript.monacoLanguage.ts │ │ └── textMate │ │ ├── index.ts │ │ ├── xmlui-dark.json │ │ ├── xmlui-light.json │ │ ├── xmlui.json │ │ └── xmlui.tmLanguage.json │ ├── testing │ │ ├── assertions.ts │ │ ├── component-test-helpers.ts │ │ ├── ComponentDrivers.ts │ │ ├── drivers │ │ │ ├── DateInputDriver.ts │ │ │ ├── ModalDialogDriver.ts │ │ │ ├── NumberBoxDriver.ts │ │ │ ├── TextBoxDriver.ts │ │ │ ├── TimeInputDriver.ts │ │ │ ├── TimerDriver.ts │ │ │ └── TreeDriver.ts │ │ ├── fixtures.ts │ │ ├── infrastructure │ │ │ ├── index.html │ │ │ ├── main.tsx │ │ │ ├── public │ │ │ │ ├── mockServiceWorker.js │ │ │ │ ├── resources │ │ │ │ │ ├── bell.svg │ │ │ │ │ ├── box.svg │ │ │ │ │ ├── doc.svg │ │ │ │ │ ├── eye.svg │ │ │ │ │ ├── flower-640x480.jpg │ │ │ │ │ ├── sun.svg │ │ │ │ │ ├── test-image-100x100.jpg │ │ │ │ │ └── txt.svg │ │ │ │ └── serve.json │ │ │ └── TestBed.tsx │ │ └── themed-app-test-helpers.ts │ └── vite-env.d.ts ├── tests │ ├── components │ │ ├── CodeBlock │ │ │ └── hightlight-code.test.ts │ │ ├── playground-pattern.test.ts │ │ └── Tree │ │ └── Tree-states.test.ts │ ├── components-core │ │ ├── abstractions │ │ │ └── treeAbstractions.test.ts │ │ ├── container │ │ │ └── buildProxy.test.ts │ │ ├── interception │ │ │ ├── orderBy.test.ts │ │ │ ├── ReadOnlyCollection.test.ts │ │ │ └── request-param-converter.test.ts │ │ ├── scripts-runner │ │ │ ├── AttributeValueParser.test.ts │ │ │ ├── eval-tree-arrow-async.test.ts │ │ │ ├── eval-tree-arrow.test.ts │ │ │ ├── eval-tree-func-decl-async.test.ts │ │ │ ├── eval-tree-func-decl.test.ts │ │ │ ├── eval-tree-pre-post.test.ts │ │ │ ├── eval-tree-regression.test.ts │ │ │ ├── eval-tree.test.ts │ │ │ ├── function-proxy.test.ts │ │ │ ├── parser-regression.test.ts │ │ │ ├── process-event.test.ts │ │ │ ├── process-function.test.ts │ │ │ ├── process-implicit-context.test.ts │ │ │ ├── process-statement-asgn.test.ts │ │ │ ├── process-statement-destruct.test.ts │ │ │ ├── process-statement-regs.test.ts │ │ │ ├── process-statement-sync.test.ts │ │ │ ├── process-statement.test.ts │ │ │ ├── process-switch-sync.test.ts │ │ │ ├── process-switch.test.ts │ │ │ ├── process-try-sync.test.ts │ │ │ ├── process-try.test.ts │ │ │ └── test-helpers.ts │ │ ├── test-metadata-handler.ts │ │ ├── theming │ │ │ ├── border-segments.test.ts │ │ │ ├── component-layout.resolver.test.ts │ │ │ ├── layout-property-parser.test.ts │ │ │ ├── layout-resolver.test.ts │ │ │ ├── layout-resolver2.test.ts │ │ │ ├── layout-vp-override.test.ts │ │ │ └── padding-segments.test.ts │ │ └── utils │ │ ├── date-utils.test.ts │ │ ├── format-human-elapsed-time.test.ts │ │ └── LruCache.test.ts │ ├── language-server │ │ ├── completion.test.ts │ │ ├── format.test.ts │ │ ├── hover.test.ts │ │ └── mockData.ts │ └── parsers │ ├── common │ │ └── input-stream.test.ts │ ├── markdown │ │ └── parse-binding-expression.test.ts │ ├── parameter-parser.test.ts │ ├── paremeter-parser.test.ts │ ├── scripting │ │ ├── eval-tree-arrow.test.ts │ │ ├── eval-tree-pre-post.test.ts │ │ ├── eval-tree.test.ts │ │ ├── function-proxy.test.ts │ │ ├── lexer-literals.test.ts │ │ ├── lexer-misc.test.ts │ │ ├── module-parse.test.ts │ │ ├── parser-arrow.test.ts │ │ ├── parser-assignments.test.ts │ │ ├── parser-binary.test.ts │ │ ├── parser-destructuring.test.ts │ │ ├── parser-errors.test.ts │ │ ├── parser-expressions.test.ts │ │ ├── parser-function.test.ts │ │ ├── parser-literals.test.ts │ │ ├── parser-primary.test.ts │ │ ├── parser-regex.test.ts │ │ ├── parser-statements.test.ts │ │ ├── parser-unary.test.ts │ │ ├── process-event.test.ts │ │ ├── process-implicit-context.test.ts │ │ ├── process-statement-asgn.test.ts │ │ ├── process-statement-destruct.test.ts │ │ ├── process-statement-regs.test.ts │ │ ├── process-statement-sync.test.ts │ │ ├── process-statement.test.ts │ │ ├── process-switch-sync.test.ts │ │ ├── process-switch.test.ts │ │ ├── process-try-sync.test.ts │ │ ├── process-try.test.ts │ │ ├── simplify-expression.test.ts │ │ ├── statement-hooks.test.ts │ │ └── test-helpers.ts │ ├── style-parser │ │ ├── generateHvarChain.test.ts │ │ ├── parseHVar.test.ts │ │ ├── parser.test.ts │ │ └── tokens.test.ts │ └── xmlui │ ├── lint.test.ts │ ├── parser.test.ts │ ├── scanner.test.ts │ ├── transform.attr.test.ts │ ├── transform.circular.test.ts │ ├── transform.element.test.ts │ ├── transform.errors.test.ts │ ├── transform.escape.test.ts │ ├── transform.regression.test.ts │ ├── transform.script.test.ts │ ├── transform.test.ts │ └── xmlui.ts ├── tests-e2e │ ├── api-bound-component-regression.spec.ts │ ├── api-call-as-extracted-component.spec.ts │ ├── assign-to-object-or-array-regression.spec.ts │ ├── binding-regression.spec.ts │ ├── children-as-template-context-vars.spec.ts │ ├── compound-component.spec.ts │ ├── context-vars-regression.spec.ts │ ├── data-bindings.spec.ts │ ├── datasource-and-api-usage-in-var.spec.ts │ ├── datasource-direct-binding.spec.ts │ ├── datasource-onLoaded-regression.spec.ts │ ├── modify-array-item-regression.spec.ts │ ├── namespaces.spec.ts │ ├── push-to-array-regression.spec.ts │ ├── screen-breakpoints.spec.ts │ ├── scripting.spec.ts │ ├── state-scope-in-pages.spec.ts │ └── state-var-scopes.spec.ts ├── tsconfig.bin.json ├── tsconfig.json ├── tsconfig.node.json ├── vite.config.ts └── vitest.config.ts ``` # Files -------------------------------------------------------------------------------- /xmlui/tests/parsers/scripting/parser-statements.test.ts: -------------------------------------------------------------------------------- ```typescript 1 | import { assert, describe, expect, it } from "vitest"; 2 | 3 | import { Parser } from "../../../src/parsers/scripting/Parser"; 4 | import { 5 | BlockStatement, 6 | ConstStatement, 7 | DoWhileStatement, 8 | ExpressionStatement, 9 | ForInStatement, 10 | ForOfStatement, 11 | ForStatement, 12 | IfStatement, 13 | LetStatement, 14 | ReturnStatement, 15 | SwitchStatement, 16 | T_ARRAY_LITERAL, 17 | T_BINARY_EXPRESSION, 18 | T_BLOCK_STATEMENT, 19 | T_BREAK_STATEMENT, 20 | T_CONST_STATEMENT, 21 | T_CONTINUE_STATEMENT, 22 | T_DO_WHILE_STATEMENT, 23 | T_EMPTY_STATEMENT, 24 | T_EXPRESSION_STATEMENT, 25 | T_FOR_IN_STATEMENT, 26 | T_FOR_OF_STATEMENT, 27 | T_FOR_STATEMENT, 28 | T_IDENTIFIER, 29 | T_IF_STATEMENT, 30 | T_LET_STATEMENT, 31 | T_LITERAL, 32 | T_POSTFIX_OP_EXPRESSION, 33 | T_RETURN_STATEMENT, 34 | T_SPREAD_EXPRESSION, 35 | T_SWITCH_STATEMENT, 36 | T_THROW_STATEMENT, 37 | T_TRY_STATEMENT, 38 | T_UNARY_EXPRESSION, 39 | T_VAR_STATEMENT, 40 | T_WHILE_STATEMENT, 41 | ThrowStatement, 42 | TryStatement, 43 | VarStatement, 44 | WhileStatement, 45 | } from "../../../src/components-core/script-runner/ScriptingSourceTree"; 46 | 47 | describe("Parser - statements", () => { 48 | it("Empty source", () => { 49 | // --- Arrange 50 | const wParser = new Parser(""); 51 | 52 | // --- Act 53 | const stmts = wParser.parseStatements(); 54 | 55 | // --- Assert 56 | expect(stmts?.length).equal(0); 57 | }); 58 | 59 | it("Empty statement", () => { 60 | // --- Arrange 61 | const wParser = new Parser(";"); 62 | 63 | // --- Act 64 | const stmts = wParser.parseStatements()!; 65 | 66 | // --- Assert 67 | expect(stmts.length).equal(1); 68 | expect(stmts[0].type).equal(T_EMPTY_STATEMENT); 69 | }); 70 | 71 | it("Multiple empty statement", () => { 72 | // --- Arrange 73 | const wParser = new Parser(";;"); 74 | 75 | // --- Act 76 | const stmts = wParser.parseStatements()!; 77 | 78 | // --- Assert 79 | expect(stmts.length).equal(2); 80 | expect(stmts[0].type).equal(T_EMPTY_STATEMENT); 81 | expect(stmts[1].type).equal(T_EMPTY_STATEMENT); 82 | }); 83 | 84 | const exprStmts = [ 85 | { expr: "(a + b)", top: T_BINARY_EXPRESSION }, 86 | { expr: "myId", top: T_IDENTIFIER }, 87 | { expr: "+myId", top: T_UNARY_EXPRESSION }, 88 | { expr: "-myId", top: T_UNARY_EXPRESSION }, 89 | { expr: "~myId", top: T_UNARY_EXPRESSION }, 90 | { expr: "[1, 2, 3]", top: T_ARRAY_LITERAL }, 91 | { expr: "!myId", top: T_UNARY_EXPRESSION }, 92 | { expr: "...[1, 2, 3]", top: T_SPREAD_EXPRESSION }, 93 | { expr: "123", top: T_LITERAL }, 94 | { expr: "0x123", top: T_LITERAL }, 95 | { expr: "0b00_11", top: T_LITERAL }, 96 | { expr: "true", top: T_LITERAL }, 97 | { expr: "false", top: T_LITERAL }, 98 | { expr: "Infinity", top: T_LITERAL }, 99 | { expr: "typeof a", top: T_UNARY_EXPRESSION }, 100 | { expr: "$item", top: T_IDENTIFIER }, 101 | { expr: "null", top: T_LITERAL }, 102 | { expr: "undefined", top: T_LITERAL }, 103 | ]; 104 | exprStmts.forEach((st, idx) => { 105 | it(`Statement #${idx + 1}: ${st.expr}`, () => { 106 | // --- Arrange 107 | const wParser = new Parser(st.expr); 108 | 109 | // --- Act 110 | const stmts = wParser.parseStatements(); 111 | 112 | // --- Assert 113 | expect(stmts?.length).equal(1); 114 | expect(stmts?.[0].type).equal(T_EXPRESSION_STATEMENT); 115 | const exprStmt = stmts?.[0] as ExpressionStatement; 116 | expect(exprStmt.expr.type).equal(st.top); 117 | }); 118 | }); 119 | 120 | it("Let statement - no init", () => { 121 | // --- Arrange 122 | const wParser = new Parser("let x"); 123 | 124 | // --- Act 125 | const stmts = wParser.parseStatements()!; 126 | 127 | // --- Assert 128 | expect(stmts.length).equal(1); 129 | expect(stmts[0].type).equal(T_LET_STATEMENT); 130 | const letStmt = stmts[0] as LetStatement; 131 | expect(letStmt.decls.length).equal(1); 132 | expect(letStmt.decls[0].id).equal("x"); 133 | expect(letStmt.decls[0].expr).equal(undefined); 134 | }); 135 | 136 | it("Let statement - with init", () => { 137 | // --- Arrange 138 | const wParser = new Parser("let x = 3"); 139 | 140 | // --- Act 141 | const stmts = wParser.parseStatements()!; 142 | 143 | // --- Assert 144 | expect(stmts.length).equal(1); 145 | expect(stmts[0].type).equal(T_LET_STATEMENT); 146 | const letStmt = stmts[0] as LetStatement; 147 | expect(letStmt.decls.length).equal(1); 148 | expect(letStmt.decls[0].id).equal("x"); 149 | expect(letStmt.decls[0].expr).not.equal(null); 150 | expect(letStmt.decls[0].expr!.type).equal(T_LITERAL); 151 | }); 152 | 153 | it("Let statement - with '$'", () => { 154 | // --- Arrange 155 | const wParser = new Parser("let $x = 3"); 156 | 157 | // --- Act 158 | try { 159 | wParser.parseStatements()!; 160 | } catch (err) { 161 | expect(wParser.errors[0].code).equal("W031"); 162 | return; 163 | } 164 | assert.fail("Exception expected"); 165 | }); 166 | 167 | it("Const statement #1", () => { 168 | // --- Arrange 169 | const wParser = new Parser("const x = 3"); 170 | 171 | // --- Act 172 | const stmts = wParser.parseStatements()!; 173 | 174 | // --- Assert 175 | expect(stmts.length).equal(1); 176 | expect(stmts[0].type).equal(T_CONST_STATEMENT); 177 | const constStmt = stmts[0] as ConstStatement; 178 | expect(constStmt.decls.length).equal(1); 179 | expect(constStmt.decls[0].id).equal("x"); 180 | expect(constStmt.decls[0].expr).not.equal(null); 181 | expect(constStmt.decls[0].expr!.type).equal(T_LITERAL); 182 | }); 183 | 184 | it("Const statement with '$'", () => { 185 | // --- Arrange 186 | const wParser = new Parser("const $x = 3"); 187 | 188 | // --- Act 189 | try { 190 | wParser.parseStatements()!; 191 | } catch (err) { 192 | expect(wParser.errors[0].code).equal("W031"); 193 | return; 194 | } 195 | assert.fail("Exception expected"); 196 | }); 197 | 198 | it("Const statement #2", () => { 199 | // --- Arrange 200 | const wParser = new Parser("const x = 3, y = 4"); 201 | 202 | // --- Act 203 | const stmts = wParser.parseStatements()!; 204 | 205 | // --- Assert 206 | expect(stmts.length).equal(1); 207 | expect(stmts[0].type).equal(T_CONST_STATEMENT); 208 | const constStmt = stmts[0] as ConstStatement; 209 | expect(constStmt.decls.length).equal(2); 210 | expect(constStmt.decls[0].id).equal("x"); 211 | expect(constStmt.decls[0].expr).not.equal(null); 212 | expect(constStmt.decls[0].expr!.type).equal(T_LITERAL); 213 | expect(constStmt.decls[1].id).equal("y"); 214 | expect(constStmt.decls[1].expr).not.equal(null); 215 | expect(constStmt.decls[1].expr!.type).equal(T_LITERAL); 216 | }); 217 | 218 | it("Var statement with '$'", () => { 219 | // --- Arrange 220 | const wParser = new Parser("var $x = 3"); 221 | 222 | // --- Act 223 | try { 224 | wParser.parseStatements()!; 225 | } catch (err) { 226 | expect(wParser.errors[0].code).equal("W031"); 227 | return; 228 | } 229 | assert.fail("Exception expected"); 230 | }); 231 | 232 | it("Var statement #1", () => { 233 | // --- Arrange 234 | const wParser = new Parser("var x = 3"); 235 | 236 | // --- Act 237 | const stmts = wParser.parseStatements()!; 238 | 239 | // --- Assert 240 | expect(stmts.length).equal(1); 241 | expect(stmts[0].type).equal(T_VAR_STATEMENT); 242 | const constStmt = stmts[0] as VarStatement; 243 | expect(constStmt.decls.length).equal(1); 244 | expect(constStmt.decls[0].id.name).equal("x"); 245 | expect(constStmt.decls[0].expr).not.equal(null); 246 | expect(constStmt.decls[0].expr!.type).equal(T_LITERAL); 247 | }); 248 | 249 | it("Var statement #2", () => { 250 | // --- Arrange 251 | const wParser = new Parser("var x = 3, y = 4"); 252 | 253 | // --- Act 254 | const stmts = wParser.parseStatements()!; 255 | 256 | // --- Assert 257 | expect(stmts.length).equal(1); 258 | expect(stmts[0].type).equal(T_VAR_STATEMENT); 259 | const constStmt = stmts[0] as VarStatement; 260 | expect(constStmt.decls.length).equal(2); 261 | expect(constStmt.decls[0].id.name).equal("x"); 262 | expect(constStmt.decls[0].expr).not.equal(null); 263 | expect(constStmt.decls[0].expr!.type).equal(T_LITERAL); 264 | expect(constStmt.decls[1].id.name).equal("y"); 265 | expect(constStmt.decls[1].expr).not.equal(null); 266 | expect(constStmt.decls[1].expr!.type).equal(T_LITERAL); 267 | }); 268 | 269 | it("Block statement - empty", () => { 270 | // --- Arrange 271 | const wParser = new Parser("{}"); 272 | 273 | // --- Act 274 | const stmts = wParser.parseStatements()!; 275 | 276 | // --- Assert 277 | expect(stmts.length).equal(1); 278 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 279 | const blockStmt = stmts[0] as BlockStatement; 280 | expect(blockStmt.stmts.length).equal(0); 281 | }); 282 | 283 | it("Block statement - single #1", () => { 284 | // --- Arrange 285 | const wParser = new Parser("{;}"); 286 | 287 | // --- Act 288 | const stmts = wParser.parseStatements()!; 289 | 290 | // --- Assert 291 | expect(stmts.length).equal(1); 292 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 293 | const blockStmt = stmts[0] as BlockStatement; 294 | expect(blockStmt.stmts.length).equal(1); 295 | expect(blockStmt.stmts[0].type).equal(T_EMPTY_STATEMENT); 296 | }); 297 | 298 | it("Block statement - single #1", () => { 299 | // --- Arrange 300 | const wParser = new Parser("{ x; }"); 301 | 302 | // --- Act 303 | const stmts = wParser.parseStatements()!; 304 | 305 | // --- Assert 306 | expect(stmts.length).equal(1); 307 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 308 | const blockStmt = stmts[0] as BlockStatement; 309 | expect(blockStmt.stmts.length).equal(1); 310 | expect(blockStmt.stmts[0].type).equal(T_EXPRESSION_STATEMENT); 311 | }); 312 | 313 | it("Block statement - single #2", () => { 314 | // --- Arrange 315 | const wParser = new Parser("{ let x }"); 316 | 317 | // --- Act 318 | const stmts = wParser.parseStatements()!; 319 | 320 | // --- Assert 321 | expect(stmts.length).equal(1); 322 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 323 | const blockStmt = stmts[0] as BlockStatement; 324 | expect(blockStmt.stmts.length).equal(1); 325 | expect(blockStmt.stmts[0].type).equal(T_LET_STATEMENT); 326 | }); 327 | 328 | it("Block statement - multiple #1", () => { 329 | // --- Arrange 330 | const wParser = new Parser("{ x; let y; }"); 331 | 332 | // --- Act 333 | const stmts = wParser.parseStatements()!; 334 | 335 | // --- Assert 336 | expect(stmts.length).equal(1); 337 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 338 | const blockStmt = stmts[0] as BlockStatement; 339 | expect(blockStmt.stmts.length).equal(2); 340 | expect(blockStmt.stmts[0].type).equal(T_EXPRESSION_STATEMENT); 341 | expect(blockStmt.stmts[1].type).equal(T_LET_STATEMENT); 342 | }); 343 | 344 | it("Block statement - multiple #2", () => { 345 | // --- Arrange 346 | const wParser = new Parser("{ x; { let y; z} }"); 347 | 348 | // --- Act 349 | const stmts = wParser.parseStatements()!; 350 | 351 | // --- Assert 352 | expect(stmts.length).equal(1); 353 | expect(stmts[0].type).equal(T_BLOCK_STATEMENT); 354 | const blockStmt = stmts[0] as BlockStatement; 355 | expect(blockStmt.stmts.length).equal(2); 356 | expect(blockStmt.stmts[0].type).equal(T_EXPRESSION_STATEMENT); 357 | expect(blockStmt.stmts[1].type).equal(T_BLOCK_STATEMENT); 358 | const nested = blockStmt.stmts[1] as BlockStatement; 359 | expect(nested.stmts.length).equal(2); 360 | expect(nested.stmts[0].type).equal(T_LET_STATEMENT); 361 | expect(nested.stmts[1].type).equal(T_EXPRESSION_STATEMENT); 362 | }); 363 | 364 | it("If statement - single then no else", () => { 365 | // --- Arrange 366 | const wParser = new Parser("if (true) x;"); 367 | 368 | // --- Act 369 | const stmts = wParser.parseStatements()!; 370 | 371 | // --- Assert 372 | expect(stmts.length).equal(1); 373 | expect(stmts[0].type).equal(T_IF_STATEMENT); 374 | const blockStmt = stmts[0] as IfStatement; 375 | expect(blockStmt.cond.type).equal(T_LITERAL); 376 | expect(blockStmt.thenB.type).equal(T_EXPRESSION_STATEMENT); 377 | expect(blockStmt.elseB).equal(null); 378 | }); 379 | 380 | it("If statement - block then no else", () => { 381 | // --- Arrange 382 | const wParser = new Parser("if (true) {x; let y }"); 383 | 384 | // --- Act 385 | const stmts = wParser.parseStatements()!; 386 | 387 | // --- Assert 388 | expect(stmts.length).equal(1); 389 | expect(stmts[0].type).equal(T_IF_STATEMENT); 390 | const blockStmt = stmts[0] as IfStatement; 391 | expect(blockStmt.cond.type).equal(T_LITERAL); 392 | expect(blockStmt.thenB.type).equal(T_BLOCK_STATEMENT); 393 | expect(blockStmt.elseB).equal(null); 394 | }); 395 | 396 | it("If statement - block then single else", () => { 397 | // --- Arrange 398 | const wParser = new Parser("if (true) {x; let y } else z"); 399 | 400 | // --- Act 401 | const stmts = wParser.parseStatements()!; 402 | 403 | // --- Assert 404 | expect(stmts.length).equal(1); 405 | expect(stmts[0].type).equal(T_IF_STATEMENT); 406 | const blockStmt = stmts[0] as IfStatement; 407 | expect(blockStmt.cond.type).equal(T_LITERAL); 408 | expect(blockStmt.thenB.type).equal(T_BLOCK_STATEMENT); 409 | expect(blockStmt.elseB!.type).equal(T_EXPRESSION_STATEMENT); 410 | }); 411 | 412 | it("If statement - block then block else", () => { 413 | // --- Arrange 414 | const wParser = new Parser("if (true) {x; let y } else { let z; y = 12; }"); 415 | 416 | // --- Act 417 | const stmts = wParser.parseStatements()!; 418 | 419 | // --- Assert 420 | expect(stmts.length).equal(1); 421 | expect(stmts[0].type).equal(T_IF_STATEMENT); 422 | const blockStmt = stmts[0] as IfStatement; 423 | expect(blockStmt.cond.type).equal(T_LITERAL); 424 | expect(blockStmt.thenB.type).equal(T_BLOCK_STATEMENT); 425 | expect(blockStmt.elseB!.type).equal(T_BLOCK_STATEMENT); 426 | }); 427 | 428 | it("If statement - single then block else", () => { 429 | // --- Arrange 430 | const wParser = new Parser("if (true) y=13; else { let z; y = 12; }"); 431 | 432 | // --- Act 433 | const stmts = wParser.parseStatements()!; 434 | 435 | // --- Assert 436 | expect(stmts.length).equal(1); 437 | expect(stmts[0].type).equal(T_IF_STATEMENT); 438 | const blockStmt = stmts[0] as IfStatement; 439 | expect(blockStmt.cond.type).equal(T_LITERAL); 440 | expect(blockStmt.thenB.type).equal(T_EXPRESSION_STATEMENT); 441 | expect(blockStmt.elseB!.type).equal(T_BLOCK_STATEMENT); 442 | }); 443 | 444 | it("If statement - single then single else", () => { 445 | // --- Arrange 446 | const wParser = new Parser("if (true) y=13; else y = 12;"); 447 | 448 | // --- Act 449 | const stmts = wParser.parseStatements()!; 450 | 451 | // --- Assert 452 | expect(stmts.length).equal(1); 453 | expect(stmts[0].type).equal(T_IF_STATEMENT); 454 | const blockStmt = stmts[0] as IfStatement; 455 | expect(blockStmt.cond.type).equal(T_LITERAL); 456 | expect(blockStmt.thenB.type).equal(T_EXPRESSION_STATEMENT); 457 | expect(blockStmt.elseB!.type).equal(T_EXPRESSION_STATEMENT); 458 | }); 459 | 460 | it("Return statement - no expression", () => { 461 | // --- Arrange 462 | const wParser = new Parser("return"); 463 | 464 | // --- Act 465 | const stmts = wParser.parseStatements()!; 466 | 467 | // --- Assert 468 | expect(stmts.length).equal(1); 469 | expect(stmts[0].type).equal(T_RETURN_STATEMENT); 470 | const returnStmt = stmts[0] as ReturnStatement; 471 | expect(returnStmt.expr).equal(undefined); 472 | }); 473 | 474 | it("Return statement - with expression", () => { 475 | // --- Arrange 476 | const wParser = new Parser("return 123;"); 477 | 478 | // --- Act 479 | const stmts = wParser.parseStatements()!; 480 | 481 | // --- Assert 482 | expect(stmts.length).equal(1); 483 | expect(stmts[0].type).equal(T_RETURN_STATEMENT); 484 | const returnStmt = stmts[0] as ReturnStatement; 485 | expect(returnStmt.expr!.type).equal(T_LITERAL); 486 | }); 487 | 488 | it("Break statement", () => { 489 | // --- Arrange 490 | const wParser = new Parser("break;"); 491 | 492 | // --- Act 493 | const stmts = wParser.parseStatements()!; 494 | 495 | // --- Assert 496 | expect(stmts.length).equal(1); 497 | expect(stmts[0].type).equal(T_BREAK_STATEMENT); 498 | }); 499 | 500 | it("Continue statement", () => { 501 | // --- Arrange 502 | const wParser = new Parser("continue;"); 503 | 504 | // --- Act 505 | const stmts = wParser.parseStatements()!; 506 | 507 | // --- Assert 508 | expect(stmts.length).equal(1); 509 | expect(stmts[0].type).equal(T_CONTINUE_STATEMENT); 510 | }); 511 | 512 | it("while statement - empty body", () => { 513 | // --- Arrange 514 | const wParser = new Parser("while (a > b);"); 515 | 516 | // --- Act 517 | const stmts = wParser.parseStatements()!; 518 | 519 | // --- Assert 520 | expect(stmts.length).equal(1); 521 | expect(stmts[0].type).equal(T_WHILE_STATEMENT); 522 | const whileStmt = stmts[0] as WhileStatement; 523 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 524 | expect(whileStmt.body.type).equal(T_EMPTY_STATEMENT); 525 | }); 526 | 527 | it("while statement - single statement body", () => { 528 | // --- Arrange 529 | const wParser = new Parser("while (a > b) break;"); 530 | 531 | // --- Act 532 | const stmts = wParser.parseStatements()!; 533 | 534 | // --- Assert 535 | expect(stmts.length).equal(1); 536 | expect(stmts[0].type).equal(T_WHILE_STATEMENT); 537 | const whileStmt = stmts[0] as WhileStatement; 538 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 539 | expect(whileStmt.body.type).equal(T_BREAK_STATEMENT); 540 | }); 541 | 542 | it("while statement - block body", () => { 543 | // --- Arrange 544 | const wParser = new Parser("while (a > b) { let x = 1; break; }"); 545 | 546 | // --- Act 547 | const stmts = wParser.parseStatements()!; 548 | 549 | // --- Assert 550 | 551 | expect(stmts.length).equal(1); 552 | expect(stmts[0].type).equal(T_WHILE_STATEMENT); 553 | const whileStmt = stmts[0] as WhileStatement; 554 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 555 | expect(whileStmt.body.type).equal(T_BLOCK_STATEMENT); 556 | const blockStmt = whileStmt.body as BlockStatement; 557 | expect(blockStmt.stmts.length).equal(2); 558 | expect(blockStmt.stmts[0].type).equal(T_LET_STATEMENT); 559 | expect(blockStmt.stmts[1].type).equal(T_BREAK_STATEMENT); 560 | }); 561 | 562 | it("do-while statement - empty body", () => { 563 | // --- Arrange 564 | const wParser = new Parser("do ; while (a > b);"); 565 | 566 | // --- Act 567 | const stmts = wParser.parseStatements()!; 568 | 569 | // --- Assert 570 | 571 | expect(stmts.length).equal(1); 572 | expect(stmts[0].type).equal(T_DO_WHILE_STATEMENT); 573 | const whileStmt = stmts[0] as DoWhileStatement; 574 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 575 | expect(whileStmt.body.type).equal(T_EMPTY_STATEMENT); 576 | }); 577 | 578 | it("do-while statement - single statement body", () => { 579 | // --- Arrange 580 | const wParser = new Parser("do break; while (a > b)"); 581 | 582 | // --- Act 583 | const stmts = wParser.parseStatements()!; 584 | 585 | // --- Assert 586 | 587 | expect(stmts.length).equal(1); 588 | expect(stmts[0].type).equal(T_DO_WHILE_STATEMENT); 589 | const whileStmt = stmts[0] as DoWhileStatement; 590 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 591 | expect(whileStmt.body.type).equal(T_BREAK_STATEMENT); 592 | }); 593 | 594 | it("do-while statement - block body", () => { 595 | // --- Arrange 596 | const wParser = new Parser("do { let x = 1; break; } while (a > b)"); 597 | 598 | // --- Act 599 | const stmts = wParser.parseStatements()!; 600 | 601 | // --- Assert 602 | 603 | expect(stmts.length).equal(1); 604 | expect(stmts[0].type).equal(T_DO_WHILE_STATEMENT); 605 | const whileStmt = stmts[0] as DoWhileStatement; 606 | expect(whileStmt.cond.type).equal(T_BINARY_EXPRESSION); 607 | expect(whileStmt.body.type).equal(T_BLOCK_STATEMENT); 608 | const blockStmt = whileStmt.body as BlockStatement; 609 | expect(blockStmt.stmts.length).equal(2); 610 | expect(blockStmt.stmts[0].type).equal(T_LET_STATEMENT); 611 | expect(blockStmt.stmts[1].type).equal(T_BREAK_STATEMENT); 612 | }); 613 | 614 | it("for loop - no declaration, no body", () => { 615 | // --- Arrange 616 | const wParser = new Parser("for (;;);"); 617 | 618 | // --- Act 619 | const stmts = wParser.parseStatements()!; 620 | 621 | // --- Assert 622 | 623 | expect(stmts.length).equal(1); 624 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 625 | const forStmt = stmts[0] as ForStatement; 626 | expect(forStmt.init).equal(undefined); 627 | expect(forStmt.cond).equal(undefined); 628 | expect(forStmt.upd).equal(undefined); 629 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 630 | }); 631 | 632 | it("for loop - no init, no condition, no body", () => { 633 | // --- Arrange 634 | const wParser = new Parser("for (;; x++);"); 635 | 636 | // --- Act 637 | const stmts = wParser.parseStatements()!; 638 | 639 | // --- Assert 640 | 641 | expect(stmts.length).equal(1); 642 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 643 | const forStmt = stmts[0] as ForStatement; 644 | expect(forStmt.init).equal(undefined); 645 | expect(forStmt.cond).equal(undefined); 646 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 647 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 648 | }); 649 | 650 | it("for loop - no init, no body", () => { 651 | // --- Arrange 652 | const wParser = new Parser("for (; x < 3; x++);"); 653 | 654 | // --- Act 655 | const stmts = wParser.parseStatements()!; 656 | 657 | // --- Assert 658 | 659 | expect(stmts.length).equal(1); 660 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 661 | const forStmt = stmts[0] as ForStatement; 662 | expect(forStmt.init).equal(undefined); 663 | expect(forStmt.cond!.type).equal(T_BINARY_EXPRESSION); 664 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 665 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 666 | }); 667 | 668 | it("for loop - expr init, no body", () => { 669 | // --- Arrange 670 | const wParser = new Parser("for (x = 0; x < 3; x++);"); 671 | 672 | // --- Act 673 | const stmts = wParser.parseStatements()!; 674 | 675 | // --- Assert 676 | 677 | expect(stmts.length).equal(1); 678 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 679 | const forStmt = stmts[0] as ForStatement; 680 | expect(forStmt.init!.type).equal(T_EXPRESSION_STATEMENT); 681 | expect(forStmt.cond!.type).equal(T_BINARY_EXPRESSION); 682 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 683 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 684 | }); 685 | 686 | it("for loop - let init, no body", () => { 687 | // --- Arrange 688 | const wParser = new Parser("for (let x = 0; x < 3; x++);"); 689 | 690 | // --- Act 691 | const stmts = wParser.parseStatements()!; 692 | 693 | // --- Assert 694 | 695 | expect(stmts.length).equal(1); 696 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 697 | const forStmt = stmts[0] as ForStatement; 698 | expect(forStmt.init!.type).equal(T_LET_STATEMENT); 699 | expect(forStmt.cond!.type).equal(T_BINARY_EXPRESSION); 700 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 701 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 702 | }); 703 | 704 | it("for loop - let init with '$'", () => { 705 | // --- Arrange 706 | const wParser = new Parser("for (let $x = 0; x < 3; x++);"); 707 | 708 | // --- Act 709 | try { 710 | wParser.parseStatements()!; 711 | } catch (err) { 712 | expect(wParser.errors[0].code).equal("W031"); 713 | return; 714 | } 715 | assert.fail("Exception expected"); 716 | }); 717 | 718 | it("for loop - single statement body", () => { 719 | // --- Arrange 720 | const wParser = new Parser("for (let x = 0; x < 3; x++) y++"); 721 | 722 | // --- Act 723 | const stmts = wParser.parseStatements()!; 724 | 725 | // --- Assert 726 | 727 | expect(stmts.length).equal(1); 728 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 729 | const forStmt = stmts[0] as ForStatement; 730 | expect(forStmt.init!.type).equal(T_LET_STATEMENT); 731 | expect(forStmt.cond!.type).equal(T_BINARY_EXPRESSION); 732 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 733 | expect(forStmt.body.type).equal(T_EXPRESSION_STATEMENT); 734 | }); 735 | 736 | it("for loop - block statement body", () => { 737 | // --- Arrange 738 | const wParser = new Parser("for (let x = 0; x < 3; x++) {y++; break;}"); 739 | 740 | // --- Act 741 | const stmts = wParser.parseStatements()!; 742 | 743 | // --- Assert 744 | 745 | expect(stmts.length).equal(1); 746 | expect(stmts[0].type).equal(T_FOR_STATEMENT); 747 | const forStmt = stmts[0] as ForStatement; 748 | expect(forStmt.init!.type).equal(T_LET_STATEMENT); 749 | expect(forStmt.cond!.type).equal(T_BINARY_EXPRESSION); 750 | expect(forStmt.upd!.type).equal(T_POSTFIX_OP_EXPRESSION); 751 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 752 | }); 753 | 754 | it("Throw statement - with expression", () => { 755 | // --- Arrange 756 | const wParser = new Parser("throw 123;"); 757 | 758 | // --- Act 759 | const stmts = wParser.parseStatements()!; 760 | 761 | // --- Assert 762 | 763 | expect(stmts.length).equal(1); 764 | expect(stmts[0].type).equal(T_THROW_STATEMENT); 765 | const throwStmt = stmts[0] as ThrowStatement; 766 | expect(throwStmt.expr!.type).equal(T_LITERAL); 767 | }); 768 | 769 | it("Try statement - with catch", () => { 770 | // --- Arrange 771 | const wParser = new Parser("try { let x = 1; } catch { return; }"); 772 | 773 | // --- Act 774 | const stmts = wParser.parseStatements()!; 775 | 776 | // --- Assert 777 | 778 | expect(stmts.length).equal(1); 779 | expect(stmts[0].type).equal(T_TRY_STATEMENT); 780 | const tryStmt = stmts[0] as TryStatement; 781 | expect(tryStmt.tryB.stmts[0].type).equal(T_LET_STATEMENT); 782 | expect(tryStmt.catchV).equal(undefined); 783 | expect(tryStmt.catchB!.stmts[0].type).equal(T_RETURN_STATEMENT); 784 | expect(tryStmt.finallyB).equal(undefined); 785 | }); 786 | 787 | it("Try statement - with catch and catch variable", () => { 788 | // --- Arrange 789 | const wParser = new Parser("try { let x = 1; } catch (err) { return; }"); 790 | 791 | // --- Act 792 | const stmts = wParser.parseStatements()!; 793 | 794 | // --- Assert 795 | 796 | expect(stmts.length).equal(1); 797 | expect(stmts[0].type).equal(T_TRY_STATEMENT); 798 | const tryStmt = stmts[0] as TryStatement; 799 | expect(tryStmt.tryB.stmts[0].type).equal(T_LET_STATEMENT); 800 | expect(tryStmt.catchV!.name).equal("err"); 801 | expect(tryStmt.catchB!.stmts[0].type).equal(T_RETURN_STATEMENT); 802 | expect(tryStmt.finallyB).equal(undefined); 803 | }); 804 | 805 | it("Try statement - with finally", () => { 806 | // --- Arrange 807 | const wParser = new Parser("try { let x = 1; } finally { return; }"); 808 | 809 | // --- Act 810 | const stmts = wParser.parseStatements()!; 811 | 812 | // --- Assert 813 | 814 | expect(stmts.length).equal(1); 815 | expect(stmts[0].type).equal(T_TRY_STATEMENT); 816 | const tryStmt = stmts[0] as TryStatement; 817 | expect(tryStmt.tryB.stmts[0].type).equal(T_LET_STATEMENT); 818 | expect(tryStmt.catchV).equal(undefined); 819 | expect(tryStmt.catchB).equal(undefined); 820 | expect(tryStmt.finallyB!.stmts[0].type).equal(T_RETURN_STATEMENT); 821 | }); 822 | 823 | it("Try statement - with catch and finally", () => { 824 | // --- Arrange 825 | const wParser = new Parser("try { let x = 1; } catch { return; } finally { break; }"); 826 | 827 | // --- Act 828 | const stmts = wParser.parseStatements()!; 829 | 830 | // --- Assert 831 | 832 | expect(stmts.length).equal(1); 833 | expect(stmts[0].type).equal(T_TRY_STATEMENT); 834 | const tryStmt = stmts[0] as TryStatement; 835 | expect(tryStmt.tryB.stmts[0].type).equal(T_LET_STATEMENT); 836 | expect(tryStmt.catchV).equal(undefined); 837 | expect(tryStmt.catchB!.stmts[0].type).equal(T_RETURN_STATEMENT); 838 | expect(tryStmt.finallyB!.stmts[0].type).equal(T_BREAK_STATEMENT); 839 | }); 840 | 841 | it("Try statement - with catch, catch variable, and finally", () => { 842 | // --- Arrange 843 | const wParser = new Parser("try { let x = 1; } catch (err) { return; } finally { break; }"); 844 | 845 | // --- Act 846 | const stmts = wParser.parseStatements()!; 847 | 848 | // --- Assert 849 | 850 | expect(stmts.length).equal(1); 851 | expect(stmts[0].type).equal(T_TRY_STATEMENT); 852 | const tryStmt = stmts[0] as TryStatement; 853 | expect(tryStmt.tryB.stmts[0].type).equal(T_LET_STATEMENT); 854 | expect(tryStmt.catchV!.name).equal("err"); 855 | expect(tryStmt.catchB!.stmts[0].type).equal(T_RETURN_STATEMENT); 856 | expect(tryStmt.finallyB!.stmts[0].type).equal(T_BREAK_STATEMENT); 857 | }); 858 | 859 | it("Switch statement - empty", () => { 860 | // --- Arrange 861 | const wParser = new Parser("switch (myValue) { }"); 862 | 863 | // --- Act 864 | const stmts = wParser.parseStatements()!; 865 | 866 | // --- Assert 867 | 868 | expect(stmts.length).equal(1); 869 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 870 | const swcStmt = stmts[0] as SwitchStatement; 871 | expect(swcStmt.cases.length).equal(0); 872 | }); 873 | 874 | it("Switch statement - single empty label", () => { 875 | // --- Arrange 876 | const wParser = new Parser(` 877 | switch (myValue) { 878 | case 0: 879 | }`); 880 | 881 | // --- Act 882 | const stmts = wParser.parseStatements()!; 883 | 884 | // --- Assert 885 | 886 | expect(stmts.length).equal(1); 887 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 888 | const swcStmt = stmts[0] as SwitchStatement; 889 | expect(swcStmt.cases.length).equal(1); 890 | const swcCase = swcStmt.cases[0]; 891 | expect(swcCase.caseE!.type).equal(T_LITERAL); 892 | expect(swcCase.stmts!.length).equal(0); 893 | }); 894 | 895 | it("Switch statement - single label/single statement", () => { 896 | // --- Arrange 897 | const wParser = new Parser(` 898 | switch (myValue) { 899 | case 0: 900 | let x = 3; 901 | }`); 902 | 903 | // --- Act 904 | const stmts = wParser.parseStatements()!; 905 | 906 | // --- Assert 907 | 908 | expect(stmts.length).equal(1); 909 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 910 | const swcStmt = stmts[0] as SwitchStatement; 911 | expect(swcStmt.cases.length).equal(1); 912 | const swcCase = swcStmt.cases[0]; 913 | expect(swcCase.caseE!.type).equal(T_LITERAL); 914 | expect(swcCase.stmts!.length).equal(1); 915 | }); 916 | 917 | it("Switch statement - single label/multiple statements", () => { 918 | // --- Arrange 919 | const wParser = new Parser(` 920 | switch (myValue) { 921 | case 0: 922 | let x = 3; 923 | console.log(x); 924 | }`); 925 | 926 | // --- Act 927 | const stmts = wParser.parseStatements()!; 928 | 929 | // --- Assert 930 | 931 | expect(stmts.length).equal(1); 932 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 933 | const swcStmt = stmts[0] as SwitchStatement; 934 | expect(swcStmt.cases.length).equal(1); 935 | const swcCase = swcStmt.cases[0]; 936 | expect(swcCase.caseE!.type).equal(T_LITERAL); 937 | expect(swcCase.stmts!.length).equal(2); 938 | }); 939 | 940 | it("Switch statement - multiple label #1", () => { 941 | // --- Arrange 942 | const wParser = new Parser(` 943 | switch (myValue) { 944 | case 0: 945 | case 1: 946 | let x = 3; 947 | console.log(x); 948 | }`); 949 | 950 | // --- Act 951 | const stmts = wParser.parseStatements()!; 952 | 953 | // --- Assert 954 | 955 | expect(stmts.length).equal(1); 956 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 957 | const swcStmt = stmts[0] as SwitchStatement; 958 | expect(swcStmt.cases.length).equal(2); 959 | let swcCase = swcStmt.cases[0]; 960 | expect(swcCase.caseE!.type).equal(T_LITERAL); 961 | expect(swcCase.stmts!.length).equal(0); 962 | swcCase = swcStmt.cases[1]; 963 | expect(swcCase.caseE!.type).equal(T_LITERAL); 964 | expect(swcCase.stmts!.length).equal(2); 965 | }); 966 | 967 | it("Switch statement - multiple label #2", () => { 968 | // --- Arrange 969 | const wParser = new Parser(` 970 | switch (myValue) { 971 | case 0: 972 | let x = 3; 973 | console.log(x); 974 | case 1: 975 | }`); 976 | 977 | // --- Act 978 | const stmts = wParser.parseStatements()!; 979 | 980 | // --- Assert 981 | 982 | expect(stmts.length).equal(1); 983 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 984 | const swcStmt = stmts[0] as SwitchStatement; 985 | expect(swcStmt.cases.length).equal(2); 986 | let swcCase = swcStmt.cases[0]; 987 | expect(swcCase.caseE!.type).equal(T_LITERAL); 988 | expect(swcCase.stmts!.length).equal(2); 989 | swcCase = swcStmt.cases[1]; 990 | expect(swcCase.caseE!.type).equal(T_LITERAL); 991 | expect(swcCase.stmts!.length).equal(0); 992 | }); 993 | 994 | it("Switch statement - multiple label #3", () => { 995 | // --- Arrange 996 | const wParser = new Parser(` 997 | switch (myValue) { 998 | case 0: 999 | let x = 3; 1000 | console.log(x); 1001 | case 1: 1002 | break; 1003 | }`); 1004 | 1005 | // --- Act 1006 | const stmts = wParser.parseStatements()!; 1007 | 1008 | // --- Assert 1009 | 1010 | expect(stmts.length).equal(1); 1011 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1012 | const swcStmt = stmts[0] as SwitchStatement; 1013 | expect(swcStmt.cases.length).equal(2); 1014 | let swcCase = swcStmt.cases[0]; 1015 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1016 | expect(swcCase.stmts!.length).equal(2); 1017 | swcCase = swcStmt.cases[1]; 1018 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1019 | expect(swcCase.stmts!.length).equal(1); 1020 | }); 1021 | 1022 | it("Switch statement - multiple label #4", () => { 1023 | // --- Arrange 1024 | const wParser = new Parser(` 1025 | switch (myValue) { 1026 | default: 1027 | case 0: 1028 | let x = 3; 1029 | console.log(x); 1030 | case 1: 1031 | break; 1032 | }`); 1033 | 1034 | // --- Act 1035 | const stmts = wParser.parseStatements()!; 1036 | 1037 | // --- Assert 1038 | 1039 | expect(stmts.length).equal(1); 1040 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1041 | const swcStmt = stmts[0] as SwitchStatement; 1042 | expect(swcStmt.cases.length).equal(3); 1043 | let swcCase = swcStmt.cases[0]; 1044 | expect(swcCase.caseE).equal(undefined); 1045 | expect(swcCase.stmts!.length).equal(0); 1046 | swcCase = swcStmt.cases[1]; 1047 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1048 | expect(swcCase.stmts!.length).equal(2); 1049 | swcCase = swcStmt.cases[2]; 1050 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1051 | expect(swcCase.stmts!.length).equal(1); 1052 | }); 1053 | 1054 | it("Switch statement - multiple label #5", () => { 1055 | // --- Arrange 1056 | const wParser = new Parser(` 1057 | switch (myValue) { 1058 | case 0: 1059 | let x = 3; 1060 | console.log(x); 1061 | default: 1062 | case 1: 1063 | break; 1064 | }`); 1065 | 1066 | // --- Act 1067 | const stmts = wParser.parseStatements()!; 1068 | 1069 | // --- Assert 1070 | 1071 | expect(stmts.length).equal(1); 1072 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1073 | const swcStmt = stmts[0] as SwitchStatement; 1074 | expect(swcStmt.cases.length).equal(3); 1075 | let swcCase = swcStmt.cases[0]; 1076 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1077 | expect(swcCase.stmts!.length).equal(2); 1078 | swcCase = swcStmt.cases![1]; 1079 | expect(swcCase.caseE).equal(undefined); 1080 | expect(swcCase.stmts!.length).equal(0); 1081 | swcCase = swcStmt.cases![2]; 1082 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1083 | expect(swcCase.stmts!.length).equal(1); 1084 | }); 1085 | 1086 | it("Switch statement - multiple label #6", () => { 1087 | // --- Arrange 1088 | const wParser = new Parser(` 1089 | switch (myValue) { 1090 | case 0: 1091 | let x = 3; 1092 | console.log(x); 1093 | case 1: 1094 | default: 1095 | break; 1096 | }`); 1097 | 1098 | // --- Act 1099 | const stmts = wParser.parseStatements()!; 1100 | 1101 | // --- Assert 1102 | 1103 | expect(stmts.length).equal(1); 1104 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1105 | const swcStmt = stmts[0] as SwitchStatement; 1106 | expect(swcStmt.cases.length).equal(3); 1107 | let swcCase = swcStmt.cases[0]; 1108 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1109 | expect(swcCase.stmts!.length).equal(2); 1110 | swcCase = swcStmt.cases[1]; 1111 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1112 | expect(swcCase.stmts!.length).equal(0); 1113 | swcCase = swcStmt.cases[2]; 1114 | expect(swcCase.caseE).equal(undefined); 1115 | expect(swcCase.stmts!.length).equal(1); 1116 | }); 1117 | 1118 | it("Switch statement - multiple label #7", () => { 1119 | // --- Arrange 1120 | const wParser = new Parser(` 1121 | switch (myValue) { 1122 | case 0: 1123 | let x = 3; 1124 | console.log(x); 1125 | case 1: 1126 | break; 1127 | default: 1128 | }`); 1129 | 1130 | // --- Act 1131 | const stmts = wParser.parseStatements()!; 1132 | 1133 | // --- Assert 1134 | 1135 | expect(stmts.length).equal(1); 1136 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1137 | const swcStmt = stmts[0] as SwitchStatement; 1138 | expect(swcStmt.cases.length).equal(3); 1139 | let swcCase = swcStmt.cases[0]; 1140 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1141 | expect(swcCase.stmts!.length).equal(2); 1142 | swcCase = swcStmt.cases[1]; 1143 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1144 | expect(swcCase.stmts!.length).equal(1); 1145 | swcCase = swcStmt.cases[2]; 1146 | expect(swcCase.caseE).equal(undefined); 1147 | expect(swcCase.stmts!.length).equal(0); 1148 | }); 1149 | 1150 | it("Switch statement - multiple label #8", () => { 1151 | // --- Arrange 1152 | const wParser = new Parser(` 1153 | switch (myValue) { 1154 | case 0: 1155 | let x = 3; 1156 | console.log(x); 1157 | case 1: 1158 | break; 1159 | default: { 1160 | let x = 0; 1161 | console.log(x); 1162 | } 1163 | }`); 1164 | 1165 | // --- Act 1166 | const stmts = wParser.parseStatements()!; 1167 | 1168 | // --- Assert 1169 | 1170 | expect(stmts.length).equal(1); 1171 | expect(stmts[0].type).equal(T_SWITCH_STATEMENT); 1172 | const swcStmt = stmts[0] as SwitchStatement; 1173 | expect(swcStmt.cases.length).equal(3); 1174 | let swcCase = swcStmt.cases[0]; 1175 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1176 | expect(swcCase.stmts!.length).equal(2); 1177 | swcCase = swcStmt.cases[1]; 1178 | expect(swcCase.caseE!.type).equal(T_LITERAL); 1179 | expect(swcCase.stmts!.length).equal(1); 1180 | swcCase = swcStmt.cases[2]; 1181 | expect(swcCase.caseE).equal(undefined); 1182 | expect(swcCase.stmts!.length).equal(1); 1183 | }); 1184 | 1185 | it("Switch statement - multiple default", () => { 1186 | // --- Arrange 1187 | const wParser = new Parser(` 1188 | switch (myValue) { 1189 | default: 1190 | let x = 3; 1191 | console.log(x); 1192 | case 1: 1193 | break; 1194 | default: { 1195 | let x = 0; 1196 | console.log(x); 1197 | } 1198 | }`); 1199 | 1200 | // --- Act/Assert 1201 | try { 1202 | wParser.parseStatements()!; 1203 | } catch (err) { 1204 | expect(wParser.errors.length).equal(1); 1205 | expect(wParser.errors[0].code).equal("W016"); 1206 | return; 1207 | } 1208 | assert.fail("Exception expected"); 1209 | }); 1210 | 1211 | it("for..in loop - no var binding, no body", () => { 1212 | // --- Arrange 1213 | const wParser = new Parser("for (myVar in collection);"); 1214 | 1215 | // --- Act 1216 | const stmts = wParser.parseStatements()!; 1217 | 1218 | // --- Assert 1219 | 1220 | expect(stmts.length).equal(1); 1221 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1222 | const forStmt = stmts[0] as ForInStatement; 1223 | expect(forStmt.varB).equal("none"); 1224 | expect(forStmt.id.name).equal("myVar"); 1225 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1226 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1227 | }); 1228 | 1229 | it("for..in loop - 'let' binding, no body", () => { 1230 | // --- Arrange 1231 | const wParser = new Parser("for (let myVar in collection);"); 1232 | 1233 | // --- Act 1234 | const stmts = wParser.parseStatements()!; 1235 | 1236 | // --- Assert 1237 | 1238 | expect(stmts.length).equal(1); 1239 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1240 | const forStmt = stmts[0] as ForInStatement; 1241 | expect(forStmt.varB).equal("let"); 1242 | expect(forStmt.id.name).equal("myVar"); 1243 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1244 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1245 | }); 1246 | 1247 | it("for..in loop - 'let' binding with '$'", () => { 1248 | // --- Arrange 1249 | const wParser = new Parser("for (let $myVar in collection);"); 1250 | 1251 | // --- Act 1252 | try { 1253 | wParser.parseStatements()!; 1254 | } catch (err) { 1255 | expect(wParser.errors[0].code).equal("W031"); 1256 | return; 1257 | } 1258 | assert.fail("Exception expected"); 1259 | }); 1260 | 1261 | it("for..in loop - 'const' binding, no body", () => { 1262 | // --- Arrange 1263 | const wParser = new Parser("for (const myVar in collection);"); 1264 | 1265 | // --- Act 1266 | const stmts = wParser.parseStatements()!; 1267 | 1268 | // --- Assert 1269 | 1270 | expect(stmts.length).equal(1); 1271 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1272 | const forStmt = stmts[0] as ForInStatement; 1273 | expect(forStmt.varB).equal("const"); 1274 | expect(forStmt.id.name).equal("myVar"); 1275 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1276 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1277 | }); 1278 | 1279 | it("for..in loop - 'const' binding with '$'", () => { 1280 | // --- Arrange 1281 | const wParser = new Parser("for (const $myVar in collection);"); 1282 | 1283 | // --- Act 1284 | try { 1285 | wParser.parseStatements()!; 1286 | } catch (err) { 1287 | expect(wParser.errors[0].code).equal("W031"); 1288 | return; 1289 | } 1290 | assert.fail("Exception expected"); 1291 | }); 1292 | 1293 | it("for..in loop - no var binding, body", () => { 1294 | // --- Arrange 1295 | const wParser = new Parser("for (myVar in collection) { console.log(myVar); }"); 1296 | 1297 | // --- Act 1298 | const stmts = wParser.parseStatements()!; 1299 | 1300 | // --- Assert 1301 | 1302 | expect(stmts.length).equal(1); 1303 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1304 | const forStmt = stmts[0] as ForInStatement; 1305 | expect(forStmt.varB).equal("none"); 1306 | expect(forStmt.id.name).equal("myVar"); 1307 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1308 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1309 | }); 1310 | 1311 | it("for..in loop - 'let' binding, body", () => { 1312 | // --- Arrange 1313 | const wParser = new Parser("for (let myVar in collection) { console.log(myVar); }"); 1314 | 1315 | // --- Act 1316 | const stmts = wParser.parseStatements()!; 1317 | 1318 | // --- Assert 1319 | 1320 | expect(stmts.length).equal(1); 1321 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1322 | const forStmt = stmts[0] as ForInStatement; 1323 | expect(forStmt.varB).equal("let"); 1324 | expect(forStmt.id.name).equal("myVar"); 1325 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1326 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1327 | }); 1328 | 1329 | it("for..in loop - 'const' binding, body", () => { 1330 | // --- Arrange 1331 | const wParser = new Parser("for (const myVar in collection) { console.log(myVar); }"); 1332 | 1333 | // --- Act 1334 | const stmts = wParser.parseStatements()!; 1335 | 1336 | // --- Assert 1337 | 1338 | expect(stmts.length).equal(1); 1339 | expect(stmts[0].type).equal(T_FOR_IN_STATEMENT); 1340 | const forStmt = stmts[0] as ForInStatement; 1341 | expect(forStmt.varB).equal("const"); 1342 | expect(forStmt.id.name).equal("myVar"); 1343 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1344 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1345 | }); 1346 | 1347 | it("for..of loop - no var binding, no body", () => { 1348 | // --- Arrange 1349 | const wParser = new Parser("for (myVar of collection);"); 1350 | 1351 | // --- Act 1352 | const stmts = wParser.parseStatements()!; 1353 | 1354 | // --- Assert 1355 | 1356 | expect(stmts.length).equal(1); 1357 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1358 | const forStmt = stmts[0] as ForOfStatement; 1359 | expect(forStmt.varB).equal("none"); 1360 | expect(forStmt.id.name).equal("myVar"); 1361 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1362 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1363 | }); 1364 | 1365 | it("for..of loop - 'let' binding, no body", () => { 1366 | // --- Arrange 1367 | const wParser = new Parser("for (let myVar of collection);"); 1368 | 1369 | // --- Act 1370 | const stmts = wParser.parseStatements()!; 1371 | 1372 | // --- Assert 1373 | 1374 | expect(stmts.length).equal(1); 1375 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1376 | const forStmt = stmts[0] as ForOfStatement; 1377 | expect(forStmt.varB).equal("let"); 1378 | expect(forStmt.id.name).equal("myVar"); 1379 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1380 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1381 | }); 1382 | 1383 | it("for..of loop - 'let' binding with '$'", () => { 1384 | // --- Arrange 1385 | const wParser = new Parser("for (let $myVar of collection);"); 1386 | 1387 | // --- Act 1388 | try { 1389 | wParser.parseStatements()!; 1390 | } catch (err) { 1391 | expect(wParser.errors[0].code).equal("W031"); 1392 | return; 1393 | } 1394 | assert.fail("Exception expected"); 1395 | }); 1396 | 1397 | it("for..of loop - 'const' binding, no body", () => { 1398 | // --- Arrange 1399 | const wParser = new Parser("for (const myVar of collection);"); 1400 | 1401 | // --- Act 1402 | const stmts = wParser.parseStatements()!; 1403 | 1404 | // --- Assert 1405 | 1406 | expect(stmts.length).equal(1); 1407 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1408 | const forStmt = stmts[0] as ForOfStatement; 1409 | expect(forStmt.varB).equal("const"); 1410 | expect(forStmt.id.name).equal("myVar"); 1411 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1412 | expect(forStmt.body.type).equal(T_EMPTY_STATEMENT); 1413 | }); 1414 | 1415 | it("for..of loop - 'const' binding with '$'", () => { 1416 | // --- Arrange 1417 | const wParser = new Parser("for (const $myVar of collection);"); 1418 | 1419 | // --- Act 1420 | try { 1421 | wParser.parseStatements()!; 1422 | } catch (err) { 1423 | expect(wParser.errors[0].code).equal("W031"); 1424 | return; 1425 | } 1426 | assert.fail("Exception expected"); 1427 | }); 1428 | 1429 | it("for..of loop - no var binding, body", () => { 1430 | // --- Arrange 1431 | const wParser = new Parser("for (myVar of collection) { console.log(myVar); }"); 1432 | 1433 | // --- Act 1434 | const stmts = wParser.parseStatements()!; 1435 | 1436 | // --- Assert 1437 | 1438 | expect(stmts.length).equal(1); 1439 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1440 | const forStmt = stmts[0] as ForOfStatement; 1441 | expect(forStmt.varB).equal("none"); 1442 | expect(forStmt.id.name).equal("myVar"); 1443 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1444 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1445 | }); 1446 | 1447 | it("for..of loop - 'let' binding, body", () => { 1448 | // --- Arrange 1449 | const wParser = new Parser("for (let myVar of collection) { console.log(myVar); }"); 1450 | 1451 | // --- Act 1452 | const stmts = wParser.parseStatements()!; 1453 | 1454 | // --- Assert 1455 | 1456 | expect(stmts.length).equal(1); 1457 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1458 | const forStmt = stmts[0] as ForOfStatement; 1459 | expect(forStmt.varB).equal("let"); 1460 | expect(forStmt.id.name).equal("myVar"); 1461 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1462 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1463 | }); 1464 | 1465 | it("for..of loop - 'const' binding, body", () => { 1466 | // --- Arrange 1467 | const wParser = new Parser("for (const myVar of collection) { console.log(myVar); }"); 1468 | 1469 | // --- Act 1470 | const stmts = wParser.parseStatements()!; 1471 | 1472 | // --- Assert 1473 | 1474 | expect(stmts.length).equal(1); 1475 | expect(stmts[0].type).equal(T_FOR_OF_STATEMENT); 1476 | const forStmt = stmts[0] as ForOfStatement; 1477 | expect(forStmt.varB).equal("const"); 1478 | expect(forStmt.id.name).equal("myVar"); 1479 | expect(forStmt.expr.type).equal(T_IDENTIFIER); 1480 | expect(forStmt.body.type).equal(T_BLOCK_STATEMENT); 1481 | }); 1482 | }); 1483 | ```