From 980006057eee12864fba698780747dbc6de0183b Mon Sep 17 00:00:00 2001
From: Randall Morey <randall@randallmorey.com>
Date: Thu, 6 Aug 2020 12:47:52 -0400
Subject: [PATCH] =?UTF-8?q?refactor:=20=F0=9F=92=A1=20extract=20input=20an?=
 =?UTF-8?q?d=20textarea=20into=20separate=20components?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../addon/components/rose/form/input/input.js   |  7 +++++++
 .../components/rose/form/textarea/textarea.js   |  7 +++++++
 .../templates/components/rose/form/input.hbs    | 17 +++++++++++------
 .../components/rose/form/input/input.hbs        |  9 +++++++++
 .../templates/components/rose/form/textarea.hbs | 10 +++++-----
 .../components/rose/form/textarea/textarea.hbs  |  8 ++++++++
 .../app/components/rose/form/input/input.js     |  1 +
 .../components/rose/form/textarea/textarea.js   |  1 +
 8 files changed, 49 insertions(+), 11 deletions(-)
 create mode 100644 addons/rose/addon/components/rose/form/input/input.js
 create mode 100644 addons/rose/addon/components/rose/form/textarea/textarea.js
 create mode 100644 addons/rose/addon/templates/components/rose/form/input/input.hbs
 create mode 100644 addons/rose/addon/templates/components/rose/form/textarea/textarea.hbs
 create mode 100644 addons/rose/app/components/rose/form/input/input.js
 create mode 100644 addons/rose/app/components/rose/form/textarea/textarea.js

diff --git a/addons/rose/addon/components/rose/form/input/input.js b/addons/rose/addon/components/rose/form/input/input.js
new file mode 100644
index 000000000..f20d86c82
--- /dev/null
+++ b/addons/rose/addon/components/rose/form/input/input.js
@@ -0,0 +1,7 @@
+import Component from '@ember/component';
+import layout from '../../../../templates/components/rose/form/input/input';
+
+export default Component.extend({
+  layout,
+  tagName: '',
+});
diff --git a/addons/rose/addon/components/rose/form/textarea/textarea.js b/addons/rose/addon/components/rose/form/textarea/textarea.js
new file mode 100644
index 000000000..3e9bbb99b
--- /dev/null
+++ b/addons/rose/addon/components/rose/form/textarea/textarea.js
@@ -0,0 +1,7 @@
+import Component from '@ember/component';
+import layout from '../../../../templates/components/rose/form/textarea/textarea';
+
+export default Component.extend({
+  layout,
+  tagName: '',
+});
diff --git a/addons/rose/addon/templates/components/rose/form/input.hbs b/addons/rose/addon/templates/components/rose/form/input.hbs
index ec5474b03..aca21cd3f 100644
--- a/addons/rose/addon/templates/components/rose/form/input.hbs
+++ b/addons/rose/addon/templates/components/rose/form/input.hbs
@@ -8,15 +8,20 @@
     </Rose::Form::HelperText>
   {{/if}}
 
-  <Input
+  {{!--
+    - refactor errors styles so that error classes appear on individual atoms
+      instead of on the parent wrapper (since the wrapper won't exist in cases
+      where the atoms are yielded, such as for use within a list
+      or other custom use cases)
+  --}}
+  <Rose::Form::Input::Input
     ...attributes
-    class="rose-form-input-field"
-    id={{this.id}}
-    disabled={{@disabled}}
-    name={{@name}}
+    @id={{this.id}}
+    @disabled={{@disabled}}
+    @name={{@name}}
     @type={{@type}}
     @value={{@value}}
-    aria-describedby="{{if @helperText (concat 'helper-text-' this.id)}} {{if @error (concat 'errors-' this.id)}}" />
+    @aria-describedby="{{if @helperText (concat 'helper-text-' this.id)}} {{if @error (concat 'errors-' this.id)}}" />
 
   {{yield (hash
     errors=(component 'rose/form/errors' id=(concat 'errors-' this.id))
diff --git a/addons/rose/addon/templates/components/rose/form/input/input.hbs b/addons/rose/addon/templates/components/rose/form/input/input.hbs
new file mode 100644
index 000000000..c7153718c
--- /dev/null
+++ b/addons/rose/addon/templates/components/rose/form/input/input.hbs
@@ -0,0 +1,9 @@
+<Input
+  ...attributes
+  class="rose-form-input-field"
+  id={{@id}}
+  disabled={{@disabled}}
+  name={{@name}}
+  @type={{@type}}
+  @value={{@value}}
+  aria-describedby={{@aria-describedby}} />
diff --git a/addons/rose/addon/templates/components/rose/form/textarea.hbs b/addons/rose/addon/templates/components/rose/form/textarea.hbs
index fc5b406d5..83a58643b 100644
--- a/addons/rose/addon/templates/components/rose/form/textarea.hbs
+++ b/addons/rose/addon/templates/components/rose/form/textarea.hbs
@@ -8,14 +8,14 @@
     </Rose::Form::HelperText>
   {{/if}}
 
-  <Textarea
+  <Rose::Form::Textarea::Textarea
     ...attributes
     class="rose-form-input-field"
-    id={{this.id}}
-    name={{@name}}
-    disabled={{@disabled}}
+    @id={{this.id}}
+    @name={{@name}}
+    @disabled={{@disabled}}
     @value={{@value}}
-    aria-describedby="{{if @helperText (concat 'helper-text-' this.id)}} {{if @error (concat 'errors-' this.id)}}" />
+    @aria-describedby="{{if @helperText (concat 'helper-text-' this.id)}} {{if @error (concat 'errors-' this.id)}}" />
 
   {{yield (hash
     errors=(component 'rose/form/errors' id=(concat 'errors-' this.id))
diff --git a/addons/rose/addon/templates/components/rose/form/textarea/textarea.hbs b/addons/rose/addon/templates/components/rose/form/textarea/textarea.hbs
new file mode 100644
index 000000000..dba3196d5
--- /dev/null
+++ b/addons/rose/addon/templates/components/rose/form/textarea/textarea.hbs
@@ -0,0 +1,8 @@
+<Textarea
+  ...attributes
+  class="rose-form-input-field"
+  id={{@id}}
+  name={{@name}}
+  disabled={{@disabled}}
+  @value={{@value}}
+  aria-describedby={{@aria-describedby}} />
diff --git a/addons/rose/app/components/rose/form/input/input.js b/addons/rose/app/components/rose/form/input/input.js
new file mode 100644
index 000000000..a80b8a6b6
--- /dev/null
+++ b/addons/rose/app/components/rose/form/input/input.js
@@ -0,0 +1 @@
+export { default } from 'rose/components/rose/form/input/input';
\ No newline at end of file
diff --git a/addons/rose/app/components/rose/form/textarea/textarea.js b/addons/rose/app/components/rose/form/textarea/textarea.js
new file mode 100644
index 000000000..3a8c03cf9
--- /dev/null
+++ b/addons/rose/app/components/rose/form/textarea/textarea.js
@@ -0,0 +1 @@
+export { default } from 'rose/components/rose/form/textarea/textarea';
\ No newline at end of file