diff --git a/.vitepress/theme/cliLanguage.ts b/.vitepress/theme/cliLanguage.ts index 3a12cddb..03af6911 100644 --- a/.vitepress/theme/cliLanguage.ts +++ b/.vitepress/theme/cliLanguage.ts @@ -1,10 +1,10 @@ // https://mysticmind.dev/vitepress-fenced-code-block-syntax-highlighting-quirks-with-net-or-other-languages -import { BUNDLED_LANGUAGES } from "shiki"; -import cliLanguageGrammar from "./shiki/cli.tmLanguage.json"; +import { bundledLanguages } from 'shiki' +import cliLanguageGrammar from './shiki/cli.tmLanguage.json' -BUNDLED_LANGUAGES.push({ - id: "cli", - scopeName: "source.cli", - // @ts-ignore +bundledLanguages['cli'] = { + id: 'cli', + scopeName: 'source.cli', grammar: cliLanguageGrammar, -}); +} +// bundledLanguages.push() diff --git a/content/dev-reference.md b/content/dev-reference.md index 289f1128..fb86c82d 100644 --- a/content/dev-reference.md +++ b/content/dev-reference.md @@ -100,18 +100,116 @@ For example: ![some image](../assets/images/setup/windows/.png) ``` - + + + +### Flavor Tabs + + + +This is the vue tab + + +This is the typescript tab + + +This is the javascript tab + + +This is the angular tab + + +This is the svelte tab + + +This is the react tab + + +This is the solid tab + + + + +All Flavor tabs will be synchronized and ordered consistently: + + + +This is the typescript tab + + +This is the javascript tab + + +This is the angular tab + + +This is the svelte tab + + +This is the react tab + + +This is the vue tab + + +This is the solid tab + + ## StepList diff --git a/content/ui/action-bar.md b/content/ui/action-bar.md index ffc123fd..bc1d87a7 100644 --- a/content/ui/action-bar.md +++ b/content/ui/action-bar.md @@ -20,7 +20,12 @@ Views also part of the ActionBar abstraction: -<<< @/../examples/src/ui/ActionBar/page.xml#example +<<< @/../examples/typescript/src/ui/ActionBar/page.xml#example +<<< @/../examples/angular/src/ui/ActionBar/component.html#example +<<< @/../examples/react/src/components/ui/actionbar.tsx#example +<<< @/../examples/solid/src/ui/actionbar.tsx#example +<<< @/../examples/svelte/app/components/ui/ActionBar.svelte#example +<<< @/../examples/vue/src/ui/Actionbar/component.vue#example ## Examples diff --git a/content/ui/activity-indicator.md b/content/ui/activity-indicator.md index c3b218cb..2a3afad1 100644 --- a/content/ui/activity-indicator.md +++ b/content/ui/activity-indicator.md @@ -15,7 +15,43 @@ contributors: -<<< @/../examples/src/ui/ActivityIndicator/template.xml#example + + + +<<< @/../examples/vue/src/ui/ActivityIndicator/component.vue#example + + + + +<<< @/../examples/typescript/src/ui/ActivityIndicator/template.xml#example + + + + +<<< @/../examples/typescript/src/ui/ActivityIndicator/template.xml#example + + + + +<<< @/../examples/angular/src/ui/ActivityIndicator/component.html#example + + + + +<<< @/../examples/svelte/app/components/ui/ActivityIndicator.svelte#example + + + + +<<< @/../examples/react/src/components/ui/activityindicator.tsx#example + + + + +<<< @/../examples/solid/src/ui/activityindicator.tsx#example + + + ## Examples diff --git a/content/ui/button.md b/content/ui/button.md index e93c1c49..2927e623 100644 --- a/content/ui/button.md +++ b/content/ui/button.md @@ -17,7 +17,12 @@ For more information about the available gestures, see [Gestures](/guide/gesture -<<< @/../examples/src/ui/Button/template.xml#example +<<< @/../examples/typescript/src/ui/Button/template.xml#example +<<< @/../examples/angular/src/ui/Button/component.html#example +<<< @/../examples/react/src/components/ui/button.tsx#example +<<< @/../examples/solid/src/ui/button.tsx#example +<<< @/../examples/svelte/app/components/ui/Button.svelte#example +<<< @/../examples/vue/src/ui/Button/component.vue#example ## Examples diff --git a/content/ui/date-picker.md b/content/ui/date-picker.md index 9f4c358f..64f55307 100644 --- a/content/ui/date-picker.md +++ b/content/ui/date-picker.md @@ -17,7 +17,12 @@ See also: [TimePicker](/ui/time-picker). -<<< @/../examples/src/ui/DatePicker/template.xml#example +<<< @/../examples/typescript/src/ui/DatePicker/template.xml#example +<<< @/../examples/angular/src/ui/DatePicker/component.html#example +<<< @/../examples/react/src/components/ui/datepicker.tsx#example +<<< @/../examples/solid/src/ui/datepicker.tsx#example +<<< @/../examples/svelte/app/components/ui/DatePicker.svelte#example +<<< @/../examples/vue/src/ui/DatePicker/component.vue#example ```xml -<<< @/../examples/src/ui/Dialogs/template.ts#example-alert +<<< @/../examples/typescript/src/ui/Dialogs/template.ts#example-alert +<<< @/../examples/angular/src/ui/Dialogs/component.html#example-alert +<<< @/../examples/react/src/components/ui/dialogs.tsx#example-alert +<<< @/../examples/solid/src/ui/dialogs.tsx#example-alert +<<< @/../examples/svelte/app/components/ui/Dialogs.svelte#example-alert +<<< @/../examples/vue/src/ui/Dialogs/component.vue#example-alert A dialog for alerting the user. @@ -60,7 +65,12 @@ See [alert()](/api/#alert). -<<< @/../examples/src/ui/Dialogs/template.ts#example-action +<<< @/../examples/typescript/src/ui/Dialogs/template.ts#example-action +<<< @/../examples/angular/src/ui/Dialogs/component.html#example-action +<<< @/../examples/react/src/components/ui/dialogs.tsx#example-action +<<< @/../examples/solid/src/ui/dialogs.tsx#example-action +<<< @/../examples/svelte/app/components/ui/Dialogs.svelte#example-action +<<< @/../examples/vue/src/ui/Dialogs/component.vue#example-action A dialog for prompting the user to choose. @@ -77,7 +87,12 @@ See [action()](/api/#action). -<<< @/../examples/src/ui/Dialogs/template.ts#example-confirm +<<< @/../examples/typescript/src/ui/Dialogs/template.ts#example-confirm +<<< @/../examples/angular/src/ui/Dialogs/component.html#example-confirm +<<< @/../examples/react/src/components/ui/dialogs.tsx#example-confirm +<<< @/../examples/solid/src/ui/dialogs.tsx#example-confirm +<<< @/../examples/svelte/app/components/ui/Dialogs.svelte#example-confirm +<<< @/../examples/vue/src/ui/Dialogs/component.vue#example-confirm A dialog for prompting the user to confirm. @@ -92,7 +107,12 @@ See [confirm()](/api/#confirm). -<<< @/../examples/src/ui/Dialogs/template.ts#example-prompt +<<< @/../examples/typescript/src/ui/Dialogs/template.ts#example-prompt +<<< @/../examples/angular/src/ui/Dialogs/component.html#example-prompt +<<< @/../examples/react/src/components/ui/dialogs.tsx#example-prompt +<<< @/../examples/solid/src/ui/dialogs.tsx#example-prompt +<<< @/../examples/svelte/app/components/ui/Dialogs.svelte#example-prompt +<<< @/../examples/vue/src/ui/Dialogs/component.vue#example-prompt A dialog for prompting the user for input. @@ -111,7 +131,12 @@ See [prompt()](/api/#prompt), [CoreTypes.AutocapitalizationType](/api/namespace/ -<<< @/../examples/src/ui/Dialogs/template.ts#example-login +<<< @/../examples/typescript/src/ui/Dialogs/template.ts#example-login +<<< @/../examples/angular/src/ui/Dialogs/component.html#example-login +<<< @/../examples/react/src/components/ui/dialogs.tsx#example-login +<<< @/../examples/solid/src/ui/dialogs.tsx#example-login +<<< @/../examples/svelte/app/components/ui/Dialogs.svelte#example-login +<<< @/../examples/vue/src/ui/Dialogs/component.vue#example-login A dialog for prompting the user for credentials. diff --git a/content/ui/html-view.md b/content/ui/html-view.md index 728e5d01..e7929972 100644 --- a/content/ui/html-view.md +++ b/content/ui/html-view.md @@ -22,8 +22,15 @@ See also: [WebView](/ui/web-view). -<<< @/../examples/src/ui/HtmlView/template.xml#example -<<< @/../examples/src/ui/HtmlView/template.ts#example{xml} +<<< @/../examples/typescript/src/ui/HtmlView/template.xml#example +<<< @/../examples/typescript/src/ui/HtmlView/template.ts#example{xml} + +<<< @/../examples/angular/src/ui/HtmlView/component.html#example +<<< @/../examples/angular/src/ui/HtmlView/component.ts#example{html} +<<< @/../examples/react/src/components/ui/htmlview.tsx#example +<<< @/../examples/solid/src/ui/htmlview.tsx#example +<<< @/../examples/svelte/app/components/ui/HtmlView.svelte#example +<<< @/../examples/vue/src/ui/HtmlView/component.vue#example ## Props diff --git a/content/ui/image.md b/content/ui/image.md index 61957b2a..09a0b9d1 100644 --- a/content/ui/image.md +++ b/content/ui/image.md @@ -16,7 +16,7 @@ When working with images, consider following [the best practices](/performance.h Working with many images can quickly become a memory hog, for improved image handling it's recommended to use an Image caching library. Here are a few plugins from our community: -- [@triniwiz/image-cache-it](https://triniwiz.github.io/nativescript-plugins/api-reference/image-cache-it.html) +- [@triniwiz/nativescript-image-cache-it](https://triniwiz.github.io/nativescript-plugins/api-reference/image-cache-it.html) - [@nativescript-community/ui-image](https://github.com/nativescript-community/ui-image) ::: @@ -28,7 +28,7 @@ Working with many images can quickly become a memory hog, for improved image han -<<< @/../examples/src/ui/Image/template.xml#example +<<< @/../examples/typescript/src/ui/Image/template.xml#example ## Examples diff --git a/content/ui/label.md b/content/ui/label.md index 423d3d03..9be5cd7c 100644 --- a/content/ui/label.md +++ b/content/ui/label.md @@ -21,7 +21,13 @@ The NativeScript `