Fixed deprecations this.property-fallback, with, and positional linkt… (#831)

* Fixed deprecations this.property-fallback, with, and positional linkto parms

* Update tests/acceptance/sandbox/api/guides-test.js

* Update index.js

Co-authored-by: Brian Gantzler <brian.gantzler@cardinalhealth.com>
Co-authored-by: Robert Wagner <rwwagner90@gmail.com>

Author: 3 people

.gitignore

@@ -24,3 +24,7 @@
 /.node_modules.ember-try/
 /bower.json.ember-try
 /package.json.ember-try
+
+# intellij
+/.idea/
+ember-cli-addon-docs.iml

addon/components/api/x-class/template.hbs

@@ -1,40 +1,40 @@
-<h1 class="docs-h1" data-test-class-name>{{class.name}}</h1>
+<h1 class="docs-h1" data-test-class-name>{{@class.name}}</h1>
 
 {{! wrapping in a div seems to work around https://github.com/ember-learn/ember-cli-addon-docs/issues/7 }}
-<div data-test-class-description>{{{class.description}}}</div>
+<div data-test-class-description>{{{@class.description}}}</div>
 
-{{#if (or (and class.exportType showImportPaths) hasToggles)}}
+{{#if (or (and @class.exportType @showImportPaths) this.hasToggles)}}
   <Api::XMetaPanel as |panel|>
-    {{#if class.exportType}}
+    {{#if @class.exportType}}
       <panel.header>
         Import Path
       </panel.header>
 
-      <Api::XImportPath @item={{class}} />
+      <Api::XImportPath @item={{@class}} />
     {{/if}}
 
-    {{#if hasToggles}}
+    {{#if @hasToggles}}
       <panel.header>
         Show
       </panel.header>
 
-      {{#if hasToggles}}
+      {{#if @hasToggles}}
         <Api::XToggles @toggles={{hash
-            inherited=(if class.hasInherited showInherited)
-            protected=(if class.hasProtected showProtected)
-            private=(if class.hasPrivate showPrivate)
-            deprecated=(if class.hasDeprecated showDeprecated)
+            inherited=(if @class.hasInherited this.showInherited)
+            protected=(if @class.hasProtected this.showProtected)
+            private=(if @class.hasPrivate this.showPrivate)
+            deprecated=(if @class.hasDeprecated this.showDeprecated)
           }} />
       {{/if}}
     {{/if}}
   </Api::XMetaPanel>
 {{/if}}
 
-{{#if hasContents}}
+{{#if this.hasContents}}
   <Api::XSections @sections={{hash
-      constructors=class.constructors
-      fields=class.fields
-      accessors=class.accessors
-      methods=class.methods
+      constructors=@class.constructors
+      fields=@class.fields
+      accessors=@class.accessors
+      methods=@class.methods
     }} />
 {{/if}}

addon/components/api/x-component/template.hbs

@@ -3,19 +3,19 @@
 {{! wrapping in a div seems to work around https://github.com/ember-learn/ember-cli-addon-docs/issues/7 }}
 <div data-test-component-name>{{{@component.description}}}</div>
 
-{{#if hasToggles}}
+{{#if this.hasToggles}}
   <Api::XMetaPanel as |panel|>
     <panel.header>
       Show
     </panel.header>
 
     {{#if hasToggles}}
       <Api::XToggles @toggles={{hash
-          inherited=(if component.hasInherited showInherited)
-          internal=(if component.hasInternal showInternal)
-          protected=(if component.hasProtected showProtected)
-          private=(if component.hasPrivate showPrivate)
-          deprecated=(if component.hasDeprecated showDeprecated)
+          inherited=(if @component.hasInherited this.showInherited)
+          internal=(if @component.hasInternal this.showInternal)
+          protected=(if @component.hasProtected this.showProtected)
+          private=(if @component.hasPrivate this.showPrivate)
+          deprecated=(if @component.hasDeprecated this.showDeprecated)
         }} @onToggle={{action "updateFilter"}} />
     {{/if}}
   </Api::XMetaPanel>
@@ -24,11 +24,11 @@
 
 {{#if hasContents}}
   <Api::XSections @sections={{hash
-      constructors=constructors
-      yields=yields
-      arguments=arguments
-      fields=fields
-      accessors=accessors
-      methods=methods
+      constructors=this.constructors
+      yields=this.yields
+      arguments=this.arguments
+      fields=this.fields
+      accessors=this.accessors
+      methods=this.methods
     }} />
 {{/if}}

addon/components/api/x-module/template.hbs

@@ -1,6 +1,6 @@
 <Api::XSections @sections={{hash
-    classes=module.classes
-    components=module.components
-    functions=module.functions
-    variables=module.variables
+    classes=@module.classes
+    components=@module.components
+    functions=@module.functions
+    variables=@module.variables
   }} />

addon/components/api/x-section/template.hbs

@@ -1,49 +1,49 @@
 <div data-test-item class="docs-pb-8">
   <h3
-    id={{item.name}}
-    data-text={{item.name}}
+    id={{@item.name}}
+    data-text={{@item.name}}
     data-test-item-header
     class="docs-h3 docs-font-mono docs-font-normal"
   >
-    {{#if (eq item.exportType "default")}}
+    {{#if (eq @item.exportType "default")}}
       <span class="docs-border docs-border-grey-light docs-align-text-top docs-leading-loose docs-text-xxs docs-pl-2 docs-mr-2 docs-py-1 docs-rounded">
         Default
       </span>
     {{/if}}
 
-    {{#if (or item.isClass item.isComponent)}}
-      <LinkTo @route="docs.api.item" @model={{concat "modules/" item.id}} class="hover:underline">
-        <strong>{{item.name}}</strong>
+    {{#if (or @item.isClass item.isComponent)}}
+      <LinkTo @route="docs.api.item" @model={{concat "modules/" @item.id}} class="hover:underline">
+        <strong>{{@item.name}}</strong>
       </LinkTo>
     {{else}}
-      <a href="#{{item.name}}" class="heading-anchor">
-        {{type-signature item}}
+      <a href="#{{@item.name}}" class="heading-anchor">
+        {{type-signature @item}}
       </a>
     {{/if}}
   </h3>
 
   <p data-test-item-description>
-    {{{item.description}}}
+    {{{@item.description}}}
   </p>
 
-  {{#if (or (and item.exportType showImportPaths) shouldDisplayParams)}}
+  {{#if (or (and @item.exportType this.showImportPaths) this.shouldDisplayParams)}}
     <Api::XMetaPanel as |panel|>
-      {{#if item.exportType}}
+      {{#if @item.exportType}}
         <panel.header>
           Import Path
         </panel.header>
 
-        <Api::XImportPath @item={{item}} />
+        <Api::XImportPath @item={{@item}} />
       {{/if}}
 
-      {{#if shouldDisplayParams}}
+      {{#if this.shouldDisplayParams}}
         <panel.header>
           Params
         </panel.header>
 
         <table class="docs-mb-6" data-test-item-params>
           <tbody>
-            {{#each item.params as |param|}}
+            {{#each @item.params as |param|}}
               <tr data-test-item-param>
                 <td><span class="docs-font-mono docs-font-bold docs-border-r docs-border-grey-light docs-pr-2">{{param.name}}</span></td>
                 <td><span class="docs-font-mono docs-border-r docs-border-grey-light docs-px-2">{{param.type}}</span></td>

addon/components/api/x-toggles/template.hbs

@@ -1,11 +1,11 @@
 <ul class="docs-mb-6">
-  {{#each-in toggles as |key toggle|}}
+  {{#each-in @toggles as |key toggle|}}
     {{#if (not-eq toggle undefined)}}
       <li class="docs-inline docs-ml-4">
         <label data-test-toggle>
           <input type="checkbox"
             checked={{toggle}}
-            onclick={{action onToggle key}}
+            onclick={{action @onToggle key}}
             class="docs-mr-1"
           >
 

addon/components/docs-demo/template.hbs

@@ -2,17 +2,17 @@
 
   {{yield (hash
     example=(component "docs-demo/x-example")
-    snippet=(component "docs-demo/x-snippet" did-init=(action "registerSnippet") activeSnippet=activeSnippet)
+    snippet=(component "docs-demo/x-snippet" did-init=(action "registerSnippet") activeSnippet=this.activeSnippet)
   )}}
 
   <div>
-    {{#if (and snippets (gt snippets.length 1))}}
+    {{#if (and this.snippets (gt this.snippets.length 1))}}
       <nav class="
         docs-demo__snippets-nav docs-py-2 docs-px-4 docs-font-medium
         docs-bg-black docs-tracking-tight docs-border-b
         docs-border-grey-darkest
       ">
-        {{#each snippets as |snippet|}}
+        {{#each this.snippets as |snippet|}}
           <button {{action "selectSnippet" snippet}}
             class="
               docs-mr-4 docs-text-xs docs-no-underline outline-none
@@ -29,7 +29,7 @@
       </nav>
     {{/if}}
 
-    {{#each snippets as |snippet|}}
+    {{#each this.snippets as |snippet|}}
       {{#if snippet.isActive}}
         <div class="
           docs-demo__snippet-wrapper docs-bg-code-base docs-rounded-b

addon/components/docs-header/link/template.hbs

@@ -1,32 +1,32 @@
-{{#if href}}
+{{#if @href}}
 
-  <a href={{href}}
+  <a href={{@href}}
     class="
       docs-px-4 docs-py-5 docs-transition docs-uppercase docs-text-xxs docs-font-bold
       docs-text-grey-darkest docs-no-underline hover:docs-text-brand
-      {{if push "docs-ml-auto"}}
+      {{if this.push "docs-ml-auto"}}
     "
-    data-test-id={{data-test-id}}>
+    data-test-id={{this.data-test-id}}>
     {{yield}}
   </a>
 
-{{else if on-click}}
+{{else if @on-click}}
 
-  <a {{action on-click}}
+  <a {{action @on-click}}
     href="#"
     class="
       docs-px-4 docs-py-5 docs-transition docs-uppercase docs-text-xxs docs-font-bold
       docs-text-grey-darkest docs-no-underline hover:docs-text-brand
-      {{if push "docs-ml-auto"}}
+      {{if this.push "docs-ml-auto"}}
     "
-    data-test-id={{data-test-id}}>
+    data-test-id={{this.data-test-id}}>
     {{yield}}
   </a>
 
 {{else}}
 
-  <LinkTo @route={{route}} class={{concat "docs-px-4 docs-py-5 docs-transition docs-uppercase docs-text-xxs
-      docs-font-bold docs-no-underline " (if (not (eq route "index")) (if isActive "docs-text-brand" "docs-text-grey-darkest hover:docs-text-brand") "docs-text-grey-darkest")}} data-test-id={{data-test-id}}>
+  <LinkTo @route={{@route}} class={{concat "docs-px-4 docs-py-5 docs-transition docs-uppercase docs-text-xxs
+      docs-font-bold docs-no-underline " (if (not (eq @route "index")) (if this.isActive "docs-text-brand" "docs-text-grey-darkest hover:docs-text-brand") "docs-text-grey-darkest")}} data-test-id={{this.data-test-id}}>
     {{yield}}
   </LinkTo>
 

addon/components/docs-header/search-box/template.hbs

@@ -7,10 +7,10 @@
     so we stick with the dumb html element. Maybe there's a way to disable them
     and get the convenient two-way binding.
    --}}
-  <input oninput={{action on-input value="target.value"}}
-    value={{query}}
+  <input oninput={{action @on-input value="target.value"}}
+    value={{@query}}
     type="text"
-    disabled={{fetchProject.isRunning}}
+    disabled={{this.fetchProject.isRunning}}
     placeholder="SEARCH"
     class="docs-w-24 docs-text-xxs docs-p-2 docs-pl-6 docs-rounded focus:docs-bg-grey-lighter outline-none"
     data-search-box-input

addon/components/docs-header/search-result/template.hbs

@@ -1,25 +1,25 @@
 <div {{on "click" this.onClick}} {{on "mouseenter" this.onMouseEnter}}>
   {{#link-to
-    params=linkArgs
+    params=this.linkArgs
     class=(concat
       "docs-block docs-py-2 docs-px-3 docs-text-black docs-no-underline hover:docs-bg-grey-lighter "
-      (if selected "docs-bg-grey-lighter")
+      (if @selected "docs-bg-grey-lighter")
     )
   }}
     <div class="docs-flex docs-items-center">
-      {{svg-jar icon height=28 width=28 class="docs-mr-2 docs-flex-no-shrink"}}
+      {{svg-jar this.icon height=28 width=28 class="docs-mr-2 docs-flex-no-shrink"}}
       <span class="docs-truncate">
-        {{#if titleMatchesQuery}}
-          {{{highlightedTitle}}}
+        {{#if this.titleMatchesQuery}}
+          {{{this.highlightedTitle}}}
         {{else}}
-          {{result.document.title}}
+          {{this.result.document.title}}
         {{/if}}
       </span>
     </div>
-  
-    {{#if (not titleMatchesQuery)}}
+
+    {{#if (not this.titleMatchesQuery)}}
       <small class="docs-text-grey-dark docs-inline-block">
-        {{{bestMatch}}}
+        {{{this.bestMatch}}}
       </small>
     {{/if}}
   {{/link-to}}