Update input helpers page #696

ddoria921 · 2019-03-28T15:40:02Z

I started this work in response to #692.

In this PR, I started the work of converting the Input Helpers guide. I mainly worked on updating the code snippets, but also updated some of the copy where I thought it was necessary. Any feedback here is appreciated.

I particularly wasn't sure how the checkbox input helper would work with the new syntax. I assumed the correct way was to use <Input type="checkbox" />, but wasn't sure if it should be <Input @type="checkbox" /> instead.

I'm happy to make any updates that are necessary.

guides/release/templates/input-helpers.md

chancancode · 2019-03-28T15:48:09Z

guides/release/templates/input-helpers.md

@@ -31,13 +31,13 @@ helper:
  <tr><td>`selectionDirection`</td><td>`spellcheck`</td><td>`type`</td></tr>
 </table>


This section can probably be deleted since you can pass literally any attributes

Other than @type, @value and @checked (double check the API docs PR as the final source of truth). Could replace this with an example.

chancancode · 2019-03-28T15:49:43Z

guides/release/templates/input-helpers.md

-unquoted, these values will be bound to a property on the template's current
+If these attributes are set without the `@` symbol, their values will be set
+directly on the element. However, when including the `@` symbol, these
+values will be bound to a property on the template's current
 rendering context. For example:


This is not quite right. It will be "bound" either way... see the API docs PR.

chancancode · 2019-03-28T15:50:17Z

guides/release/templates/input-helpers.md

 rendering context. For example:

 ```handlebars
-{{input type="text" value=this.firstName disabled=this.entryNotAllowed size="50"}}
+<Input type="text" @value={{this.firstName}} @disabled={{this.entryNotAllowed}} size="50" />


@type, disabled (no @)

chancancode · 2019-03-28T15:51:07Z

guides/release/templates/input-helpers.md

@@ -48,7 +48,7 @@ current context.
 To dispatch an action on specific events such as `key-press`, use the following

 ```handlebars
-{{input value=this.firstName key-press=(action "updateFirstName")}}
+<Input @value={{this.firstName}} @key-press={{action "updateFirstName"}} />
 ```

 The following event types are supported (dasherized format):


I think the API docs PR refers to these as "custom events".. double check to make sure and try to align the language

chancancode · 2019-03-28T15:51:32Z

guides/release/templates/input-helpers.md

 helper to create a checkbox by setting its `type`:

 ```handlebars
-{{input type="checkbox" name="isAdmin" checked=this.isAdmin}}
+<Input type="checkbox" @name="isAdmin" @checked={{this.isAdmin}} />


@type, name

chancancode · 2019-03-28T15:51:45Z

guides/release/templates/input-helpers.md

@@ -91,19 +91,19 @@ Which can be bound or set as described in the previous section.
 Checkboxes are a special input type. If you want to dispatch an action on a certain [event](https://www.emberjs.com/api/ember/release/classes/Component), you will always need to define the event name in camelCase format:

 ```handlebars
-{{input type="checkbox" keyPress=(action "updateName")}}
+<Input type="checkbox" @keyPress={{action "updateName"}} />


Suggested change

<Input type="checkbox" @keyPress={{action "updateName"}} />

<Input @type="checkbox" @keyPress={{action "updateName"}} />

chancancode

(see inline comments)

jenweber · 2019-04-02T22:10:39Z

Hi @ddoria921! Thanks for your help! It looks like these changes have been made on the master branch and not from octane. Could you branch from octane and open your PR back into octane? This PR can't be merged into Guides master yet. Thank you!

jenweber

See other comment - this should target octane so that it can be merged. Thanks!

ddoria921 · 2019-04-02T23:52:04Z

@jenweber oh my bad! Should I close this PR and open a new one? I'm not sure how to keep this PR intact and branch off of octane.

locks · 2019-04-14T00:56:40Z

@ddoria921 I have changed the target branch and rebased for you! You will have to reset your branch, git reset --hard origin/update-input-helpers-guide and you can continue addressing Godfrey's comments. Happy editing!

jenweber · 2019-05-16T14:44:41Z

@ddoria921 I would like to get your work merged so we can use it as an example that other contributors can follow in other pages of the guides. Do you have time to finish up this PR? Or would you like someone to help you with it? Thanks!

ddoria921 · 2019-05-23T04:27:19Z

This is still on my radar. Gonna find some time to get this done within the next week.

guides/release/templates/input-helpers.md

jenweber · 2019-05-31T00:32:04Z

Hi @ddoria921, some of this work has been merged in through another PR, and some has not, so make sure to rebase or merge in the latest from octane before doing more work. Let me know if you need any help with this step.

Bring branch up-to-date with `octane` branch # Conflicts: # guides/release/templates/input-helpers.md

locks · 2019-06-28T00:26:50Z

@ddoria921 you still have some asks, are you able to address them or do you need help?

jenweber · 2019-07-12T03:14:20Z

I'm closing this PR, as most of the work has made it into the Guides now. If you would like to include any of the other changes, feel free to open a new PR. Thanks everyone for your help!

ddoria921 changed the base branch from octane to master March 28, 2019 15:40

chancancode mentioned this pull request Mar 28, 2019

Switch to <AngleBracket /> built-in components on Octane branch (input, link-to, etc) #692

Closed

16 tasks

chancancode reviewed Mar 28, 2019

View reviewed changes

guides/release/templates/input-helpers.md Outdated Show resolved Hide resolved

chancancode reviewed Mar 28, 2019

View reviewed changes

chancancode requested changes Mar 28, 2019

View reviewed changes

jenweber requested changes Apr 2, 2019

View reviewed changes

jenweber added the needs contributor response label Apr 2, 2019

locks changed the base branch from master to octane April 3, 2019 07:40

locks changed the base branch from octane to master April 3, 2019 07:40

locks self-assigned this Apr 3, 2019

locks changed the base branch from master to octane April 14, 2019 00:39

Update input-helpers to angle bracket syntax ember-learn#692

2802b7e

locks force-pushed the update-input-helpers-guide branch from 92e0060 to 2802b7e Compare April 14, 2019 00:53

locks removed their assignment Apr 14, 2019

jenweber mentioned this pull request May 9, 2019

Quest - Changes we need to make before the official release of Octane Guides #669

Closed

30 tasks

locks self-assigned this May 17, 2019

locks requested changes May 25, 2019

View reviewed changes

guides/release/templates/input-helpers.md Outdated Show resolved Hide resolved

guides/release/templates/input-helpers.md Outdated Show resolved Hide resolved

guides/release/templates/input-helpers.md Outdated Show resolved Hide resolved

Merge branch 'octane' into update-input-helpers-guide

1b9fd7e

Bring branch up-to-date with `octane` branch # Conflicts: # guides/release/templates/input-helpers.md

jenweber closed this Jul 12, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update input helpers page #696

Update input helpers page #696

ddoria921 commented Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019

chancancode Mar 28, 2019 •

edited by locks

Loading

chancancode left a comment

jenweber commented Apr 2, 2019

jenweber left a comment

ddoria921 commented Apr 2, 2019

locks commented Apr 14, 2019

jenweber commented May 16, 2019

ddoria921 commented May 23, 2019

jenweber commented May 31, 2019

locks commented Jun 28, 2019

jenweber commented Jul 12, 2019

		@@ -31,13 +31,13 @@ helper:
		<tr><td>`selectionDirection`</td><td>`spellcheck`</td><td>`type`</td></tr>
		</table>

	<Input type="checkbox" @keyPress={{action "updateName"}} />
	<Input @type="checkbox" @keyPress={{action "updateName"}} />

Update input helpers page #696

Update input helpers page #696

Conversation

ddoria921 commented Mar 28, 2019

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019

Choose a reason for hiding this comment

chancancode Mar 28, 2019 • edited by locks Loading

Choose a reason for hiding this comment

chancancode left a comment

Choose a reason for hiding this comment

jenweber commented Apr 2, 2019

jenweber left a comment

Choose a reason for hiding this comment

ddoria921 commented Apr 2, 2019

locks commented Apr 14, 2019

jenweber commented May 16, 2019

ddoria921 commented May 23, 2019

jenweber commented May 31, 2019

locks commented Jun 28, 2019

jenweber commented Jul 12, 2019

chancancode Mar 28, 2019 •

edited by locks

Loading