Skip to content

Commit 8f8a75d

Browse files
dennismphildennismphil
committed
Remove compact prop from DataTable #1189 
1 parent eb560a0 commit 8f8a75d

File tree

5 files changed

+9
-124
lines changed

5 files changed

+9
-124
lines changed

‎components/component-docs.json

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3083,13 +3083,6 @@
30833083
"required": false,
30843084
"description": "A variant which adds border to the vertical columns."
30853085
},
3086-
"compact": {
3087-
"type": {
3088-
"name": "bool"
3089-
},
3090-
"required": false,
3091-
"description": "A variant which decreases padding and allows more items and columns to be viewed."
3092-
},
30933086
"id": {
30943087
"type": {
30953088
"name": "string"
@@ -11654,4 +11647,4 @@
1165411647
"SLDS-component-path": "/components/slider",
1165511648
"dependencies": []
1165611649
}
11657-
}
11650+
}

‎components/data-table/__examples__/basic.jsx

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -133,18 +133,6 @@ const Example = createReactClass({
133133
>
134134
{columns}
135135
</DataTable>
136-
137-
<h3 className="slds-text-heading--medium slds-m-vertical--medium">
138-
Compact
139-
</h3>
140-
141-
<DataTable
142-
compact
143-
items={this.state.items}
144-
id="DataTableExample-compact"
145-
>
146-
{columns}
147-
</DataTable>
148136
</div>
149137
</IconSettings>
150138
);

‎components/data-table/__tests__/__snapshots__/data-table.snapshot-test.jsx.snap

Lines changed: 0 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -556,104 +556,5 @@ exports[`DataTable Basic HTML Snapshot 1`] = `
556556
</tr>
557557
</tbody>
558558
</table>
559-
<h3 class=\\"slds-text-heading--medium slds-m-vertical--medium\\">Compact</h3>
560-
<table class=\\"slds-table slds-table--compact slds-table--bordered slds-table--cell-buffer\\" id=\\"DataTableExample-compact\\">
561-
<thead>
562-
<tr class=\\"slds-text-title--caps\\">
563-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
564-
<div class=\\"slds-truncate\\">Opportunity Name</div>
565-
</th>
566-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
567-
<div class=\\"slds-truncate\\">Account Name</div>
568-
</th>
569-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
570-
<div class=\\"slds-truncate\\">Close Date</div>
571-
</th>
572-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
573-
<div class=\\"slds-truncate\\">Stage</div>
574-
</th>
575-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
576-
<div class=\\"slds-truncate\\">Confidence</div>
577-
</th>
578-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
579-
<div class=\\"slds-truncate\\">Amount</div>
580-
</th>
581-
<th class=\\"\\" focusable=\\"false\\" scope=\\"col\\">
582-
<div class=\\"slds-truncate\\">Contact</div>
583-
</th>
584-
</tr>
585-
</thead>
586-
<tbody>
587-
<tr class=\\"\\">
588-
<td>
589-
<div class=\\"\\" title=\\"Cloudhub\\"><a href=\\"javascript:void(0);\\">Cloudhub</a></div>
590-
</td>
591-
<td>
592-
<div class=\\"\\" title=\\"Cloudhub\\">Cloudhub</div>
593-
</td>
594-
<td>
595-
<div class=\\"\\" title=\\"4/14/2015\\">4/14/2015</div>
596-
</td>
597-
<td>
598-
<div class=\\"\\" title=\\"Prospecting\\">Prospecting</div>
599-
</td>
600-
<td>
601-
<div class=\\"\\" title=\\"20%\\">20%</div>
602-
</td>
603-
<td>
604-
<div class=\\"\\" title=\\"$25k\\">$25k</div>
605-
</td>
606-
<td>
607-
<div class=\\"\\" title=\\"[email protected]\\"><a href=\\"javascript:void(0);\\">[email protected]</a></div>
608-
</td>
609-
</tr>
610-
<tr class=\\"\\">
611-
<td>
612-
<div class=\\"\\" title=\\"Cloudhub + Anypoint Connectors\\"><a href=\\"javascript:void(0);\\">Cloudhub + Anypoint Connectors</a></div>
613-
</td>
614-
<td>
615-
<div class=\\"\\" title=\\"Cloudhub\\">Cloudhub</div>
616-
</td>
617-
<td>
618-
<div class=\\"\\" title=\\"4/14/2015\\">4/14/2015</div>
619-
</td>
620-
<td>
621-
<div class=\\"\\" title=\\"Prospecting\\">Prospecting</div>
622-
</td>
623-
<td>
624-
<div class=\\"\\" title=\\"20%\\">20%</div>
625-
</td>
626-
<td>
627-
<div class=\\"\\" title=\\"$25k\\">$25k</div>
628-
</td>
629-
<td>
630-
<div class=\\"\\" title=\\"[email protected]\\"><a href=\\"javascript:void(0);\\">[email protected]</a></div>
631-
</td>
632-
</tr>
633-
<tr class=\\"\\">
634-
<td>
635-
<div class=\\"\\" title=\\"Cloudhub\\"><a href=\\"javascript:void(0);\\">Cloudhub</a></div>
636-
</td>
637-
<td>
638-
<div class=\\"\\" title=\\"Cloudhub\\">Cloudhub</div>
639-
</td>
640-
<td>
641-
<div class=\\"\\" title=\\"4/14/2015\\">4/14/2015</div>
642-
</td>
643-
<td>
644-
<div class=\\"\\" title=\\"Prospecting\\">Prospecting</div>
645-
</td>
646-
<td>
647-
<div class=\\"\\" title=\\"20%\\">20%</div>
648-
</td>
649-
<td>
650-
<div class=\\"\\" title=\\"$25k\\">$25k</div>
651-
</td>
652-
<td>
653-
<div class=\\"\\" title=\\"[email protected]\\"><a href=\\"javascript:void(0);\\">[email protected]</a></div>
654-
</td>
655-
</tr>
656-
</tbody>
657-
</table>
658559
</div>"
659560
`;

‎components/data-table/check-props.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,14 @@ if (process.env.NODE_ENV !== 'production') {
1111
checkProps = function (COMPONENT, props) {
1212
/* eslint-disable max-len */
1313
// Deprecated and changed to another property
14+
deprecatedProperty(
15+
COMPONENT,
16+
props.compact,
17+
'compact',
18+
undefined,
19+
'compact has been deprecated as non-compact data tables do not exist in SLDS'
20+
);
21+
1422
deprecatedProperty(COMPONENT, props.collection, 'collection', 'items');
1523
deprecatedProperty(COMPONENT, props.onSelect, 'onSelect', 'onChange');
1624
deprecatedProperty(COMPONENT, props.onDeselect, 'onDeselect', 'onChange');

‎components/data-table/index.jsx

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -118,10 +118,6 @@ const DataTable = createReactClass({
118118
* A variant which adds border to the vertical columns.
119119
*/
120120
columnBordered: PropTypes.bool,
121-
/**
122-
* A variant which decreases padding and allows more items and columns to be viewed.
123-
*/
124-
compact: PropTypes.bool,
125121
/**
126122
* A unique ID is needed in order to support keyboard navigation and ARIA support.
127123
*/
@@ -261,7 +257,6 @@ const DataTable = createReactClass({
261257
className={classNames(
262258
'slds-table',
263259
{
264-
'slds-table--compact': this.props.compact,
265260
'slds-table--fixed-layout': this.props.fixedLayout,
266261
'slds-table--bordered': !this.props.unborderedRow,
267262
'slds-table--cell-buffer':

0 commit comments

Comments
 (0)