Skip to content

fix(playground): warn if version not specified #2668

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Feb 27, 2023
Merged

fix(playground): warn if version not specified #2668

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
1999365
fix(playground): warn if not specify a version
sean-perkins Dec 7, 2022
5ab8c04
chore: assign version 6 to all v6 playgrounds
sean-perkins Dec 7, 2022
987eaf6
fix: update playgrounds with missing version
sean-perkins Feb 27, 2023
c6c0db6
fix: remaining missing versions
sean-perkins Feb 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
4 changes: 2 additions & 2 deletions docs/api/select.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,9 +54,9 @@ By adding the `multiple` attribute to select, users are able to select multiple

Note: the `action-sheet` and `popover` interfaces will not work with multiple selection.

import MulipleSelectionExample from '@site/static/usage/v7/select/basic/multiple-selection/index.md';
import MultipleSelectionExample from '@site/static/usage/v7/select/basic/multiple-selection/index.md';

<MulipleSelectionExample />
<MultipleSelectionExample />

## Responding to Interaction

Expand Down
15 changes: 9 additions & 6 deletions src/components/global/Playground/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,11 +96,6 @@ interface UsageTargetOptions {
*/
declarations?: string[];
};
/**
* The major version of Ionic to use in the generated Stackblitz examples.
* This will also load assets for Stackblitz from the specified version directory.
*/
version?: number;
}

/**
Expand All @@ -120,7 +115,7 @@ export default function Playground({
mode,
devicePreview,
includeIonContent = true,
version = 6,
version,
}: {
code: { [key in UsageTarget]?: MdxContent | UsageTargetOptions };
title?: string;
Expand All @@ -135,6 +130,10 @@ export default function Playground({
description?: string;
devicePreview?: boolean;
includeIonContent: boolean;
/**
* The major version of Ionic to use in the generated Stackblitz examples.
* This will also load assets for Stackblitz from the specified version directory.
*/
version: number;
}) {
if (!code || Object.keys(code).length === 0) {
Expand All @@ -145,6 +144,10 @@ export default function Playground({
console.warn(`Invalid mode provided: ${mode}. Accepted values are: "ios" or "md".`);
return;
}
if (typeof version === 'undefined') {
console.warn('You must specify a `version` for the Playground example. For example: <Playground version="7" />');
return;
}

const { isDarkTheme } = useThemeContext();

Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/accessibility/animations/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/customization/advanced-expansion-styles/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import angular_example_component_css from './angular/example_component_css.md';
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/customization/expansion-styles/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/customization/icons/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/customization/theming/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_global_css from './angular/global_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/disable-group/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/disable/group/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/disable/individual/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/listen-changes/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/multiple/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/readonly/group/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/readonly/individual/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/accordion/toggle/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/action-sheet/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_css from './angular/example_component_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/action-sheet/theming/css-properties/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_global_css from './angular/global_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/action-sheet/theming/styling/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_global_css from './angular/global_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/alert/buttons/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
size="300px"
code={{
javascript,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/alert/customization/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
import angular_global_css from './angular/global_css.md';

<Playground
version="6"
size="300px"
code={{
javascript,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/alert/inputs/radios/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
size="medium"
code={{
javascript,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/alert/inputs/text-inputs/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
size="450px"
code={{
javascript,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/alert/presenting/controller/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
size="300px"
code={{
javascript,
Expand Down
2 changes: 1 addition & 1 deletion static/usage/v6/avatar/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/avatar/basic/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/avatar/basic/demo.html" />
2 changes: 1 addition & 1 deletion static/usage/v6/avatar/chip/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/avatar/chip/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/avatar/chip/demo.html" />
2 changes: 1 addition & 1 deletion static/usage/v6/avatar/item/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/avatar/item/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/avatar/item/demo.html" />
1 change: 1 addition & 0 deletions static/usage/v6/avatar/theming/css-properties/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_css from './angular/example_component_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/back-button/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import vue_page_one from './vue/page_one_vue.md';
import vue_page_two from './vue/page_two_vue.md';

<Playground
version="6"
code={{
javascript,
angular: {
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/back-button/custom/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import vue_page_one from './vue/page_one_vue.md';
import vue_page_two from './vue/page_two_vue.md';

<Playground
version="6"
code={{
javascript,
angular: {
Expand Down
7 changes: 6 additions & 1 deletion static/usage/v6/backdrop/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,9 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/backdrop/basic/demo.html" devicePreview={true} />
<Playground
version="6"
code={{ javascript, react, vue, angular }}
src="usage/v6/backdrop/basic/demo.html"
devicePreview={true}
/>
1 change: 1 addition & 0 deletions static/usage/v6/backdrop/styling/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import angular_example_component_css from './angular/example_component_css.md';
import angular_example_component_html from './angular/example_component_html.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
2 changes: 1 addition & 1 deletion static/usage/v6/badge/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/badge/basic/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/badge/basic/demo.html" />
7 changes: 6 additions & 1 deletion static/usage/v6/badge/theming/colors/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,9 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground size="medium" code={{ javascript, react, vue, angular }} src="usage/v6/badge/theming/colors/demo.html" />
<Playground
version="6"
size="medium"
code={{ javascript, react, vue, angular }}
src="usage/v6/badge/theming/colors/demo.html"
/>
1 change: 1 addition & 0 deletions static/usage/v6/badge/theming/css-properties/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_css from './angular/example_component_css.md';

<Playground
version="6"
size="300px"
code={{
javascript,
Expand Down
2 changes: 1 addition & 1 deletion static/usage/v6/breadcrumbs/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/breadcrumbs/basic/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/breadcrumbs/basic/demo.html" />
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/collapsing-items/expand-on-click/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
code={{
javascript,
react,
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/collapsing-items/items-before-after/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
size="300px"
code={{ javascript, react, vue, angular }}
src="usage/v6/breadcrumbs/collapsing-items/items-before-after/demo.html"
Expand Down
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/collapsing-items/max-items/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
code={{ javascript, react, vue, angular }}
src="usage/v6/breadcrumbs/collapsing-items/max-items/demo.html"
/>
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/collapsing-items/popover-on-click/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_ts from './angular/example_component_ts.md';

<Playground
version="6"
size="500px"
code={{
javascript,
Expand Down
6 changes: 5 additions & 1 deletion static/usage/v6/breadcrumbs/icons/custom-separators/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,8 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/breadcrumbs/icons/custom-separators/demo.html" />
<Playground
version="6"
code={{ javascript, react, vue, angular }}
src="usage/v6/breadcrumbs/icons/custom-separators/demo.html"
/>
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/icons/icons-on-items/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import vue from './vue.md';
import angular from './angular.md';

<Playground
version="6"
size="300px"
code={{ javascript, react, vue, angular }}
src="usage/v6/breadcrumbs/icons/icons-on-items/demo.html"
Expand Down
6 changes: 5 additions & 1 deletion static/usage/v6/breadcrumbs/theming/colors/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,8 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/breadcrumbs/theming/colors/demo.html" />
<Playground
version="6"
code={{ javascript, react, vue, angular }}
src="usage/v6/breadcrumbs/theming/colors/demo.html"
/>
1 change: 1 addition & 0 deletions static/usage/v6/breadcrumbs/theming/css-properties/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import angular_example_component_html from './angular/example_component_html.md'
import angular_example_component_css from './angular/example_component_css.md';

<Playground
version="6"
code={{
javascript,
react: {
Expand Down
2 changes: 1 addition & 1 deletion static/usage/v6/button/basic/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ import react from './react.md';
import vue from './vue.md';
import angular from './angular.md';

<Playground code={{ javascript, react, vue, angular }} src="usage/v6/button/basic/demo.html" />
<Playground version="6" code={{ javascript, react, vue, angular }} src="usage/v6/button/basic/demo.html" />
Loading