From 755dd1839c7d65933bb8637d677aeb67869b7ffc Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 1 Sep 2022 13:46:16 +0000 Subject: [PATCH 1/3] docs(checkbox): add indeterminate state --- docs/api/checkbox.md | 4 ++- src/components/global/Playground/index.tsx | 2 +- .../usage/checkbox/indeterminate/angular.md | 6 +++++ static/usage/checkbox/indeterminate/demo.html | 24 ++++++++++++++++++ static/usage/checkbox/indeterminate/index.md | 16 ++++++++++++ .../checkbox/indeterminate/javascript.md | 6 +++++ static/usage/checkbox/indeterminate/react.md | 18 +++++++++++++ static/usage/checkbox/indeterminate/vue.md | 25 +++++++++++++++++++ 8 files changed, 99 insertions(+), 2 deletions(-) create mode 100644 static/usage/checkbox/indeterminate/angular.md create mode 100644 static/usage/checkbox/indeterminate/demo.html create mode 100644 static/usage/checkbox/indeterminate/index.md create mode 100644 static/usage/checkbox/indeterminate/javascript.md create mode 100644 static/usage/checkbox/indeterminate/react.md create mode 100644 static/usage/checkbox/indeterminate/vue.md diff --git a/docs/api/checkbox.md b/docs/api/checkbox.md index a98ee09efe5..33d199d9d89 100644 --- a/docs/api/checkbox.md +++ b/docs/api/checkbox.md @@ -30,7 +30,9 @@ import Basic from '@site/static/usage/checkbox/basic/index.md'; ## Indeterminate Checkboxes -TODO Playground +import Indeterminate from '@site/static/usage/checkbox/indeterminate/index.md'; + + ## Theming diff --git a/src/components/global/Playground/index.tsx b/src/components/global/Playground/index.tsx index ca4128b9929..c1c36bef703 100644 --- a/src/components/global/Playground/index.tsx +++ b/src/components/global/Playground/index.tsx @@ -169,7 +169,7 @@ export default function Playground({ * load, so a loading screen is shown by default. * Once the source of the iframe loads we can * hide the loading screen and show the inner content. - * + * * We call this as a local function because useEffect * callbacks cannot return a Promise, as async functions do. */ diff --git a/static/usage/checkbox/indeterminate/angular.md b/static/usage/checkbox/indeterminate/angular.md new file mode 100644 index 00000000000..841851a904a --- /dev/null +++ b/static/usage/checkbox/indeterminate/angular.md @@ -0,0 +1,6 @@ +```html + + + Indeterminate checkbox + +``` diff --git a/static/usage/checkbox/indeterminate/demo.html b/static/usage/checkbox/indeterminate/demo.html new file mode 100644 index 00000000000..014f67d5210 --- /dev/null +++ b/static/usage/checkbox/indeterminate/demo.html @@ -0,0 +1,24 @@ + + + + + + Checkbox + + + + + + + + +
+ + + Indeterminate checkbox + +
+ + + + diff --git a/static/usage/checkbox/indeterminate/index.md b/static/usage/checkbox/indeterminate/index.md new file mode 100644 index 00000000000..01eb5a9da8a --- /dev/null +++ b/static/usage/checkbox/indeterminate/index.md @@ -0,0 +1,16 @@ +import Playground from '@site/src/components/global/Playground'; + +import javascript from './javascript.md'; +import react from './react.md'; +import vue from './vue.md'; +import angular from './angular.md'; + + diff --git a/static/usage/checkbox/indeterminate/javascript.md b/static/usage/checkbox/indeterminate/javascript.md new file mode 100644 index 00000000000..9a216a7d8b0 --- /dev/null +++ b/static/usage/checkbox/indeterminate/javascript.md @@ -0,0 +1,6 @@ +```html + + + Indeterminate checkbox + +``` diff --git a/static/usage/checkbox/indeterminate/react.md b/static/usage/checkbox/indeterminate/react.md new file mode 100644 index 00000000000..9e08f102560 --- /dev/null +++ b/static/usage/checkbox/indeterminate/react.md @@ -0,0 +1,18 @@ +```tsx +import React from 'react'; +import { + IonCheckbox, + IonItem, + IonLabel +} from '@ionic/react'; + +function Example() { + return ( + + + Indeterminate checkbox + + ); +} +export default Example; +``` \ No newline at end of file diff --git a/static/usage/checkbox/indeterminate/vue.md b/static/usage/checkbox/indeterminate/vue.md new file mode 100644 index 00000000000..0ad2ddbf62b --- /dev/null +++ b/static/usage/checkbox/indeterminate/vue.md @@ -0,0 +1,25 @@ +```html + + + +``` From 62b628bbe5846d6f2502d015b5d70af94f8276d5 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 1 Sep 2022 13:46:22 +0000 Subject: [PATCH 2/3] fix(playground): use className instead of class --- src/components/global/Playground/icons/IconDots.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/global/Playground/icons/IconDots.tsx b/src/components/global/Playground/icons/IconDots.tsx index 3c13b771d9c..5d74a1822a9 100644 --- a/src/components/global/Playground/icons/IconDots.tsx +++ b/src/components/global/Playground/icons/IconDots.tsx @@ -3,7 +3,7 @@ import React from 'react'; import './IconDots.css'; export const IconDots = () => ( -
+
From 4766c1f95f6bd2355173a3aff3d5abac73ecec0a Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 1 Sep 2022 09:47:06 -0400 Subject: [PATCH 3/3] Revert "fix(playground): use className instead of class" This reverts commit 62b628bbe5846d6f2502d015b5d70af94f8276d5. --- src/components/global/Playground/icons/IconDots.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/global/Playground/icons/IconDots.tsx b/src/components/global/Playground/icons/IconDots.tsx index 5d74a1822a9..3c13b771d9c 100644 --- a/src/components/global/Playground/icons/IconDots.tsx +++ b/src/components/global/Playground/icons/IconDots.tsx @@ -3,7 +3,7 @@ import React from 'react'; import './IconDots.css'; export const IconDots = () => ( -
+