CyberCoveLLC/threshold-ui
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Swap @style='expand' to boolean @expand='true'

Browse Source
This commit is contained in:
Carlos Alcaide committed 2021-05-13 09:41:13 -07:00
1 parent 8feeaa47dc
commit 385ea34c98
4 files changed
+27 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

addons/rose/addon/components/rose/table/index.stories.mdx
+9 -15
View File
@@ -15,7 +15,7 @@ Cell expansion style should be applied to only one cell in a row.
<table.header as |header|>
<header.row @hidden={{hideHeaderRow}} as |row|>
<row.headerCell>Address</row.headerCell>
<row.headerCell @style={{cellStyle}}>Host Set</row.headerCell>
<row.headerCell @expand={{cellExpand}}>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 @style={{cellStyle}}>host-set-1, host-set-2</row.cell>
<row.cell @expand={{cellExpand}}>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 @style={{cellStyle}}>host-set-2</row.cell>
<row.cell @expand={{cellExpand}}>host-set-2</row.cell>
<row.cell @alignCenter={{true}}>optional name</row.cell>
<row.cell @alignRight={{true}}>description</row.cell>
</body.row>
<body.row as |row|>
<row.cell>1.1.1.1</row.cell>
<row.cell @style={{cellStyle}}>host-set-1</row.cell>
<row.cell @expand={{cellExpand}}>host-set-1</row.cell>
<row.cell>optional name</row.cell>
<row.cell>description</row.cell>
</body.row>
@@ -55,7 +55,7 @@ Cell expansion style should be applied to only one cell in a row.
<table.header as |header|>
<header.row @hidden={{hideHeaderRow}} as |row|>
<row.headerCell @alignCenter={{cellAlignmentCenter}} @alignRight={{cellAlignmentRight}}>Address</row.headerCell>
<row.headerCell @style={{cellStyle}} @alignCenter={{cellAlignmentCenter}} @alignRight={{cellAlignmentRight}}>Host Set</row.headerCell>
<row.headerCell @expand={{cellExpand}} @alignCenter={{cellAlignmentCenter}} @alignRight={{cellAlignmentRight}}>Host Set</row.headerCell>
<row.headerCell @alignCenter={{cellAlignmentCenter}} @alignRight={{cellAlignmentRight}}>Name</row.headerCell>
<row.headerCell @alignCenter={{cellAlignmentCenter}} @alignRight={{cellAlignmentRight}}>Description</row.headerCell>
</header.row>
@@ -63,19 +63,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 @style={{cellStyle}}>host-set-1, host-set-2</row.cell>
<row.cell @expand={{cellExpand}}>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 @alignCenter={{cellAlignmentCenter}}>1.1.1.1</row.cell>
<row.cell @style={{cellStyle}} @alignCenter={{cellAlignmentCenter}}>host-set-2</row.cell>
<row.cell @expand={{cellExpand}} @alignCenter={{cellAlignmentCenter}}>host-set-2</row.cell>
<row.cell @alignCenter={{cellAlignmentCenter}}>optional name</row.cell>
<row.cell @alignCenter={{cellAlignmentCenter}}>description</row.cell>
</body.row>
<body.row as |row|>
<row.cell @alignRight={{cellAlignmentRight}}>1.1.1.1</row.cell>
<row.cell @style={{cellStyle}} @alignRight={{cellAlignmentRight}}>host-set-1</row.cell>
<row.cell @expand={{cellExpand}} @alignRight={{cellAlignmentRight}}>host-set-1</row.cell>
<row.cell @alignRight={{cellAlignmentRight}}>optional name</row.cell>
<row.cell @alignRight={{cellAlignmentRight}}>description</row.cell>
</body.row>
@@ -89,13 +89,7 @@ Cell expansion style should be applied to only one cell in a row.
`,
context: {
hideHeaderRow: boolean('hideHeaderRow', false),
cellStyle: select(
'cellStyle',
{
default: '',
'expand': 'expand'
}
),
cellExpand: boolean('cellExpand', false),
style: select(
'style',
{
addons/rose/addon/components/rose/table/row/cell/index.js
+5 -3
View File
@@ -5,14 +5,16 @@ import { computed } from '@ember/object';
export default Component.extend({
layout,
tagName: 'td',
classNameBindings: ['cellTypeStyle', 'cellStyle', 'cellAlignmentStyle'],
classNameBindings: ['cellTypeStyle', 'cellExpand', 'cellAlignmentStyle'],
cellTypeStyle: computed(function () {
return this.tagName.match('th')
? `rose-table-header-cell`
: 'rose-table-cell';
}),
cellStyle: computed(function () {
return this.style ? `rose-table-cell-${this.style}` : '';
cellExpand: computed(function () {
if (this.expand) {
return 'rose-table-cell-expand'
}
}),
cellAlignmentStyle: computed(function () {
if (this.alignRight) {
addons/rose/tests/dummy/app/templates/index.hbs
+5 -5
View File
@@ -30,7 +30,7 @@
<row.headerCell >Address</row.headerCell>
<row.headerCell>Host Set</row.headerCell>
<row.headerCell>Name</row.headerCell>
<row.headerCell @style="expand">Description</row.headerCell>
<row.headerCell @expand={{true}}>Description</row.headerCell>
</header.row>
</table.header>
<table.body as |body|>
@@ -40,7 +40,7 @@
<row.cell>
<Rose::Button @style="secondary" @iconOnly="trash" title="Remove">Remove</Rose::Button>
</row.cell>
<row.cell @style="expand">description</row.cell>
<row.cell @expand={{true}}>description</row.cell>
</body.row>
</table.body>
<table.footer @hidden={{true}} as |footer|>
@@ -80,7 +80,7 @@
<table.header as |header|>
<header.row as |row|>
<row.headerCell>Key</row.headerCell>
<row.headerCell @style="expand">Value</row.headerCell>
<row.headerCell @expand={{true}}>Value</row.headerCell>
</header.row>
</table.header>
<table.body as |body|>
@@ -98,7 +98,7 @@
</body.row>
<body.row as |row|>
<row.cell>Key</row.cell>
<row.cell @style="expand">
<row.cell @expand={{true}}>
<Rose::Form::Input @contextual={{true}} as |input|>
<input.field />
<Rose::Button @style="secondary" @iconOnly="trash" title="Remove">Remove</Rose::Button>
@@ -120,7 +120,7 @@
<row.headerCell >Address</row.headerCell>
<row.headerCell>Host Set</row.headerCell>
<row.headerCell>Name</row.headerCell>
<row.headerCell @style="expand">Description</row.headerCell>
<row.headerCell @expand={{true}}>Description</row.headerCell>
</header.row>
</table.header>
<table.body as |body|>
addons/rose/tests/integration/components/rose/table/row/cell-test.js
+8 -2
View File
@@ -30,12 +30,18 @@ module('Integration | Component | rose/table/row/cell', function (hooks) {
assert.notOk(find('.rose-table-cell'));
});
test('it adds a style class', async function (assert) {
test('it adds expand style class', async function (assert) {
assert.expect(1);
await render(hbs`<Rose::Table::Row::Cell @style='expand' />`);
await render(hbs`<Rose::Table::Row::Cell @expand={{true}} />`);
assert.ok(find('.rose-table-cell-expand'));
});
test('it does not add expand style class', async function (assert) {
assert.expect(1);
await render(hbs`<Rose::Table::Row::Cell />`);
assert.notOk(find('.rose-table-cell-expand'));
});
test('it renders with align center in a header cell', async function (assert) {
assert.expect(2);
await render(