From c0186d437ea19ee75b62902b2c8c53f61bce0802 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 21 Mar 2024 12:04:51 -0400 Subject: [PATCH 1/4] docs(password-toggle): add password toggle docs --- docs/api/input-password-toggle.md | 46 +++++++++++++++++++ .../index.js | 4 +- sidebars.js | 2 +- .../v8/input-password-toggle/basic/angular.md | 5 ++ .../v8/input-password-toggle/basic/demo.html | 37 +++++++++++++++ .../v8/input-password-toggle/basic/index.md | 12 +++++ .../input-password-toggle/basic/javascript.md | 5 ++ .../v8/input-password-toggle/basic/react.md | 13 ++++++ .../v8/input-password-toggle/basic/vue.md | 11 +++++ 9 files changed, 133 insertions(+), 2 deletions(-) create mode 100644 docs/api/input-password-toggle.md create mode 100644 static/usage/v8/input-password-toggle/basic/angular.md create mode 100644 static/usage/v8/input-password-toggle/basic/demo.html create mode 100644 static/usage/v8/input-password-toggle/basic/index.md create mode 100644 static/usage/v8/input-password-toggle/basic/javascript.md create mode 100644 static/usage/v8/input-password-toggle/basic/react.md create mode 100644 static/usage/v8/input-password-toggle/basic/vue.md diff --git a/docs/api/input-password-toggle.md b/docs/api/input-password-toggle.md new file mode 100644 index 00000000000..0663ebed855 --- /dev/null +++ b/docs/api/input-password-toggle.md @@ -0,0 +1,46 @@ +--- +title: "ion-password-toggle" +--- +import Props from '@ionic-internal/component-api/v8/input-password-toggle/props.md'; +import Events from '@ionic-internal/component-api/v8/input-password-toggle/events.md'; +import Methods from '@ionic-internal/component-api/v8/input-password-toggle/methods.md'; +import Parts from '@ionic-internal/component-api/v8/input-password-toggle/parts.md'; +import CustomProps from '@ionic-internal/component-api/v8/input-password-toggle/custom-props.md'; +import Slots from '@ionic-internal/component-api/v8/input-password-toggle/slots.md'; + + + ion-input-password-toggle: Toggle the visibility of a password in Input + + + +import EncapsulationPill from '@components/page/api/EncapsulationPill'; + + + + +The InputPasswordToggle component is a companion component to [Input](./input). It allows users to toggle the visibilty of text in a password input. + + +## Basic Usage + +import Basic from '@site/static/usage/v8/input-password-toggle/basic/index.md'; + + + +## Properties + + +## Events + + +## Methods + + +## CSS Shadow Parts + + +## CSS Custom Properties + + +## Slots + diff --git a/plugins/docusaurus-plugin-ionic-component-api/index.js b/plugins/docusaurus-plugin-ionic-component-api/index.js index 21578910eda..df1b5c7a67a 100644 --- a/plugins/docusaurus-plugin-ionic-component-api/index.js +++ b/plugins/docusaurus-plugin-ionic-component-api/index.js @@ -52,7 +52,9 @@ module.exports = function (context, options) { let npmTag = 'latest'; if (currentVersion.banner === 'unreleased') { - npmTag = 'next'; + // TODO NOW - Revert this to "next" prior to merge + // this was changed so the new component shows up in the docs + npmTag = '8.0.0-dev.11711035263.183d2423'; } else if (currentVersion.path !== undefined) { npmTag = currentVersion.path.slice(1); } diff --git a/sidebars.js b/sidebars.js index e9094c63ef3..fa0deedbff8 100644 --- a/sidebars.js +++ b/sidebars.js @@ -352,7 +352,7 @@ module.exports = { type: 'category', label: 'Input', collapsed: false, - items: ['api/input', 'api/textarea'], + items: ['api/input', 'api/input-password-toggle', 'api/textarea'], }, { type: 'category', diff --git a/static/usage/v8/input-password-toggle/basic/angular.md b/static/usage/v8/input-password-toggle/basic/angular.md new file mode 100644 index 00000000000..5a1acf3ffc3 --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/angular.md @@ -0,0 +1,5 @@ +```html + + + +``` diff --git a/static/usage/v8/input-password-toggle/basic/demo.html b/static/usage/v8/input-password-toggle/basic/demo.html new file mode 100644 index 00000000000..fc74add420b --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/demo.html @@ -0,0 +1,37 @@ + + + + + + Input + + + + + + + + + + + + +
+ + + +
+ + + + diff --git a/static/usage/v8/input-password-toggle/basic/index.md b/static/usage/v8/input-password-toggle/basic/index.md new file mode 100644 index 00000000000..037fec4f190 --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/index.md @@ -0,0 +1,12 @@ +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/v8/input-password-toggle/basic/javascript.md b/static/usage/v8/input-password-toggle/basic/javascript.md new file mode 100644 index 00000000000..5a1acf3ffc3 --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/javascript.md @@ -0,0 +1,5 @@ +```html + + + +``` diff --git a/static/usage/v8/input-password-toggle/basic/react.md b/static/usage/v8/input-password-toggle/basic/react.md new file mode 100644 index 00000000000..88ade62f97c --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/react.md @@ -0,0 +1,13 @@ +```tsx +import React from 'react'; +import { IonInput, IonInputPasswordToggle } from '@ionic/react'; + +function Example() { + return ( + + + + ); +} +export default Example; +``` diff --git a/static/usage/v8/input-password-toggle/basic/vue.md b/static/usage/v8/input-password-toggle/basic/vue.md new file mode 100644 index 00000000000..806941c3762 --- /dev/null +++ b/static/usage/v8/input-password-toggle/basic/vue.md @@ -0,0 +1,11 @@ +```html + + + +``` From 7c59a1eb4ec7f3624f8251f68d36fe71263277ae Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 21 Mar 2024 12:45:56 -0400 Subject: [PATCH 2/4] spelling --- docs/api/input-password-toggle.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/api/input-password-toggle.md b/docs/api/input-password-toggle.md index 0663ebed855..60a856ee117 100644 --- a/docs/api/input-password-toggle.md +++ b/docs/api/input-password-toggle.md @@ -10,7 +10,7 @@ import Slots from '@ionic-internal/component-api/v8/input-password-toggle/slots. ion-input-password-toggle: Toggle the visibility of a password in Input - + import EncapsulationPill from '@components/page/api/EncapsulationPill'; @@ -18,7 +18,7 @@ import EncapsulationPill from '@components/page/api/EncapsulationPill'; -The InputPasswordToggle component is a companion component to [Input](./input). It allows users to toggle the visibilty of text in a password input. +The InputPasswordToggle component is a companion component to [Input](./input). It allows users to toggle the visibility of text in a password input. ## Basic Usage From d3cca0c5225b08b6de3c9471c5f13368361eeac8 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 22 Mar 2024 09:17:35 -0400 Subject: [PATCH 3/4] add note about proper usage --- docs/api/input-password-toggle.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/docs/api/input-password-toggle.md b/docs/api/input-password-toggle.md index 60a856ee117..ede03ccb3ea 100644 --- a/docs/api/input-password-toggle.md +++ b/docs/api/input-password-toggle.md @@ -20,9 +20,15 @@ import EncapsulationPill from '@components/page/api/EncapsulationPill'; The InputPasswordToggle component is a companion component to [Input](./input). It allows users to toggle the visibility of text in a password input. - ## Basic Usage +:::info +InputPasswordToggle must be used with an [Input](./input) that has its [`type`](./input/#type) property set to either `'text'` or `'password'`. + +Using any other `type` will cause a warning to be logged. +::: + + import Basic from '@site/static/usage/v8/input-password-toggle/basic/index.md'; From c88465b1d256d0d7243961a787f7ea6708959332 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 27 Mar 2024 11:20:26 -0400 Subject: [PATCH 4/4] chore: revert TODOs --- .../docusaurus-plugin-ionic-component-api/index.js | 4 +--- static/usage/v8/input-password-toggle/basic/demo.html | 11 ++--------- 2 files changed, 3 insertions(+), 12 deletions(-) diff --git a/plugins/docusaurus-plugin-ionic-component-api/index.js b/plugins/docusaurus-plugin-ionic-component-api/index.js index df1b5c7a67a..21578910eda 100644 --- a/plugins/docusaurus-plugin-ionic-component-api/index.js +++ b/plugins/docusaurus-plugin-ionic-component-api/index.js @@ -52,9 +52,7 @@ module.exports = function (context, options) { let npmTag = 'latest'; if (currentVersion.banner === 'unreleased') { - // TODO NOW - Revert this to "next" prior to merge - // this was changed so the new component shows up in the docs - npmTag = '8.0.0-dev.11711035263.183d2423'; + npmTag = 'next'; } else if (currentVersion.path !== undefined) { npmTag = currentVersion.path.slice(1); } diff --git a/static/usage/v8/input-password-toggle/basic/demo.html b/static/usage/v8/input-password-toggle/basic/demo.html index fc74add420b..642fae3652b 100644 --- a/static/usage/v8/input-password-toggle/basic/demo.html +++ b/static/usage/v8/input-password-toggle/basic/demo.html @@ -6,15 +6,8 @@ Input - - - + +