From 84051e4b7242a62e8defeddec4178b5d19993b4a Mon Sep 17 00:00:00 2001
From: Susmitha Girumala <susmitha@hashicorp.com>
Date: Thu, 6 May 2021 17:06:01 -0400
Subject: [PATCH] chore: Refactor Rose::Table::Row visually-hidden to hidden

---
 .../components/rose/table/index.stories.mdx   | 22 +++++++++----------
 .../addon/components/rose/table/row/index.hbs |  2 +-
 .../rose/tests/dummy/app/templates/index.hbs  |  8 +++----
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/addons/rose/addon/components/rose/table/index.stories.mdx b/addons/rose/addon/components/rose/table/index.stories.mdx
index a6a840401..d2f56a5b8 100644
--- a/addons/rose/addon/components/rose/table/index.stories.mdx
+++ b/addons/rose/addon/components/rose/table/index.stories.mdx
@@ -10,12 +10,12 @@ A table component to display data in structure of rows and columns. It supports
 
 Cell expansion style should be applied to only one cell in a row.
 
-```htmlbars
-<Rose::Table as |table|>
+```html
+<Rose::Table @style={{style}} as |table|>
   <table.header as |header|>
-    <header.row as |row|>
+    <header.row @hidden={{hideHeaderRow}} as |row|>
       <row.headerCell>Address</row.headerCell>
-      <row.headerCell>Host Set</row.headerCell>
+      <row.headerCell @style={{cellStyle}}>Host Set</row.headerCell>
       <row.headerCell>Name</row.headerCell>
       <row.headerCell>Description</row.headerCell>
     </header.row>
@@ -23,19 +23,19 @@ Cell expansion style should be applied to only one cell in a row.
   <table.body as |body|>
     <body.row as |row|>
       <row.cell>1.1.1.1</row.cell>
-      <row.cell>host-set-1, host-set-2</row.cell>
+      <row.cell @style={{cellStyle}}>host-set-1, host-set-2</row.cell>
       <row.cell>optional name</row.cell>
       <row.cell>description</row.cell>
     </body.row>
     <body.row as |row|>
       <row.cell>1.1.1.1</row.cell>
-      <row.cell>host-set-2</row.cell>
+      <row.cell @style={{cellStyle}}>host-set-2</row.cell>
       <row.cell>optional name</row.cell>
       <row.cell>description</row.cell>
     </body.row>
     <body.row as |row|>
       <row.cell>1.1.1.1</row.cell>
-      <row.cell>host-set-1</row.cell>
+      <row.cell @style={{cellStyle}}>host-set-1</row.cell>
       <row.cell>optional name</row.cell>
       <row.cell>description</row.cell>
     </body.row>
@@ -53,7 +53,7 @@ Cell expansion style should be applied to only one cell in a row.
     template: hbs`
     <Rose::Table @style={{style}} as |table|>
       <table.header as |header|>
-        <header.row @visually-hidden={{visuallyHideHeaderRow}} as |row|>
+        <header.row @hidden={{hideHeaderRow}} as |row|>
           <row.headerCell>Address</row.headerCell>
           <row.headerCell @style={{cellStyle}}>Host Set</row.headerCell>
           <row.headerCell>Name</row.headerCell>
@@ -88,7 +88,7 @@ Cell expansion style should be applied to only one cell in a row.
     </Rose::Table>
     `,
     context: {
-      visuallyHideHeaderRow: boolean('visuallyHideHeaderRow', false),
+      hideHeaderRow: boolean('hideHeaderRow', false),
       cellStyle: select(
         'cellStyle',
         {
@@ -112,7 +112,7 @@ Cell expansion style should be applied to only one cell in a row.
     template: hbs`
       <Rose::Table @style="condensed" as |table|>
         <table.header as |header|>
-          <header.row @visually-hidden=true as |row|>
+          <header.row @hidden=true as |row|>
             <row.headerCell>Key</row.headerCell>
             <row.headerCell @style="expand">Value</row.headerCell>
           </header.row>
@@ -150,7 +150,7 @@ Cell expansion style should be applied to only one cell in a row.
           </body.row>
         </table.body>
         <table.footer as |footer|>
-          <footer.row  @visually-hidden=true as |row|>
+          <footer.row  @hidden=true as |row|>
             <row.cell>Footer</row.cell>
           </footer.row>
         </table.footer>
diff --git a/addons/rose/addon/components/rose/table/row/index.hbs b/addons/rose/addon/components/rose/table/row/index.hbs
index 5afc830e2..7431132ea 100644
--- a/addons/rose/addon/components/rose/table/row/index.hbs
+++ b/addons/rose/addon/components/rose/table/row/index.hbs
@@ -1,4 +1,4 @@
-<tr ...attributes class='rose-table-row {{if @visually-hidden (concat "rose-table-row-visually-hidden")}}'>
+<tr ...attributes class='rose-table-row {{if @hidden (concat "rose-table-row-visually-hidden")}}'>
   {{yield (hash
     cell=(component 'rose/table/row/cell' tagName='td')
     headerCell=(component 'rose/table/row/cell' tagName='th')
diff --git a/addons/rose/tests/dummy/app/templates/index.hbs b/addons/rose/tests/dummy/app/templates/index.hbs
index 22d4f9e81..eabd793cb 100644
--- a/addons/rose/tests/dummy/app/templates/index.hbs
+++ b/addons/rose/tests/dummy/app/templates/index.hbs
@@ -43,7 +43,7 @@
       <row.cell @style="expand">description</row.cell>
     </body.row>
   </table.body>
-  <table.footer @visually-hidden=true as |footer|>
+  <table.footer @hidden=true as |footer|>
     <footer.row as |row|>
       <row.cell>Footer</row.cell>
     </footer.row>
@@ -106,7 +106,7 @@
       </row.cell>
     </body.row>
   </table.body>
-  <table.footer @visually-hidden=true as |footer|>
+  <table.footer @hidden=true as |footer|>
     <footer.row as |row|>
       <row.cell>Footer</row.cell>
     </footer.row>
@@ -116,7 +116,7 @@
 <h2>Condensed Table With Visually Hidden Header & Footer</h2>
 <Rose::Table @style="condensed" as |table|>
   <table.header as |header|>
-    <header.row @visually-hidden=true as |row|>
+    <header.row @hidden=true as |row|>
       <row.headerCell >Address</row.headerCell>
       <row.headerCell>Host Set</row.headerCell>
       <row.headerCell>Name</row.headerCell>
@@ -132,7 +132,7 @@
     </body.row>
   </table.body>
   <table.footer as |footer|>
-    <footer.row @visually-hidden=true as |row|>
+    <footer.row @hidden=true as |row|>
       <row.cell>Footer</row.cell>
     </footer.row>
   </table.footer>