chore: Refactor Rose::Table::Row visually-hidden to hidden

This commit is contained in:
Susmitha Girumala authored and Carlos Alcaide committed 2021-05-11 15:08:01 -07:00
1 parent 6b93032a78
commit 84051e4b72
3 files changed
+16 -16

No files matched your search

@@ -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>
@@ -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')
@@ -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>