refactor: 💡 Remove text attribute in table cell rose component

Instead of providing table cell content using `<row.cell
@text="something" />`, update allows for content to be defined within
tags `<row.cell>something</row.cell>`
This commit is contained in:
Susmitha Girumala committed 2020-06-09 14:20:12 -04:00
1 parent 37ddd97bf9
commit 9bc5dee4c7
4 files changed
+34 -29

No files matched your search

@@ -13,23 +13,23 @@ A table component to display data in structure of rows and columns. It supports
<Rose::Table as |table|>
<table.header as |header|>
<header.row as |row|>
<row.cell @text="Address" />
<row.cell @text="Host Set" />
<row.cell @text="Name" />
<row.cell @text="Description" />
<row.cell>Address</row.cell>
<row.cell>Host Set</row.cell>
<row.cell>Name</row.cell>
<row.cell>Description</row.cell>
</header.row>
</table.header>
<table.body as |body|>
<body.row as |row|>
<row.cell @text="1.1.1.1" />
<row.cell @text="host-set-1, host-set-2" />
<row.cell @text="optional name" />
<row.cell @text="description" />
<row.cell>1.1.1.1</row.cell>
<row.cell>host-set-1, host-set-2</row.cell>
<row.cell>optional name</row.cell>
<row.cell>description</row.cell>
</body.row>
</table.body>
<table.footer as |footer|>
<footer.row as |row|>
<row.cell @text="Footer" />
<row.cell>Footer</row.cell>
</footer.row>
</table.footer>
</Rose::Table>
@@ -41,23 +41,23 @@ A table component to display data in structure of rows and columns. It supports
<Rose::Table as |table|>
<table.header as |header|>
<header.row as |row|>
<row.cell @text="Address" />
<row.cell @text="Host Set" />
<row.cell @text="Name" />
<row.cell @text="Description" />
<row.cell>Address</row.cell>
<row.cell>Host Set</row.cell>
<row.cell>Name</row.cell>
<row.cell>Description</row.cell>
</header.row>
</table.header>
<table.body as |body|>
<body.row as |row|>
<row.cell @text="1.1.1.1" />
<row.cell @text="host-set-1, host-set-2" />
<row.cell @text="optional name" />
<row.cell @text="description" />
<row.cell>1.1.1.1</row.cell>
<row.cell>host-set-1, host-set-2</row.cell>
<row.cell>optional name</row.cell>
<row.cell>description</row.cell>
</body.row>
</table.body>
<table.footer as |footer|>
<footer.row as |row|>
<row.cell @text="Footer" />
<row.cell>Footer</row.cell>
</footer.row>
</table.footer>
</Rose::Table>
@@ -1,11 +1,9 @@
{{#if @header}}
<th ...attributes class="rose-table-cell rose-table-header-cell">
{{@text}}
{{yield}}
</th>
{{else}}
<td ...attributes class="{{concat "rose-table-cell" (if @footer " rose-table-footer-cell" " rose-table-body-cell")}}">
{{@text}}
{{yield}}
</td>
{{/if}}
@@ -1,23 +1,23 @@
<Rose::Table as |table|>
<table.header as |header|>
<header.row as |row|>
<row.cell @text="Address" />
<row.cell @text="Host Set" />
<row.cell @text="Name" />
<row.cell @text="Description" />
<row.cell>Address</row.cell>
<row.cell>Host Set</row.cell>
<row.cell>Name</row.cell>
<row.cell>Description</row.cell>
</header.row>
</table.header>
<table.body as |body|>
<body.row as |row|>
<row.cell @text="1.1.1.1" />
<row.cell @text="host-set-1, host-set-2" />
<row.cell @text="optional name" />
<row.cell @text="description" />
<row.cell>1.1.1.1</row.cell>
<row.cell>host-set-1, host-set-2</row.cell>
<row.cell>optional name</row.cell>
<row.cell>description</row.cell>
</body.row>
</table.body>
<table.footer as |footer|>
<footer.row as |row|>
<row.cell @text="Footer" />
<row.cell>Footer</row.cell>
</footer.row>
</table.footer>
</Rose::Table>
@@ -18,6 +18,13 @@ module('Integration | Component | rose/table/cell', function (hooks) {
assert.ok(find('#cell'));
});
test('it renders with content', async function (assert) {
await render(hbs`<Rose::Table::Cell>
Cell content
</Rose::Table::Cell>`);
assert.equal(find('.rose-table-cell').textContent.trim(), 'Cell content');
});
test('it renders as header cell', async function (assert) {
await render(hbs`<Rose::Table::Cell @header={{true}}/>`);
assert.ok(find('.rose-table-cell'));