Skip to content

Commit 31d90eb

Browse files
author
David
committed
Merge branch 'master' into upgrade_react_modal
2 parents 2f211c6 + 36af33e commit 31d90eb

File tree

19 files changed

+298
-382
lines changed

19 files changed

+298
-382
lines changed

‎app.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,12 @@
33
/* eslint-disable import/no-extraneous-dependencies */
44
const compression = require('compression');
55
const express = require('express');
6+
const minimist = require('minimist');
67

78
const port = process.env.PORT || 9001;
9+
const argv = minimist(process.argv.slice(2));
10+
const buildFolder = argv.folder || 'storybook';
11+
// Setting buildFolder to 'storybook-based-tests' will allow interactive viewing of the Storyshots (story based tests).
812

913
// Create server
1014
const app = express();
@@ -19,10 +23,7 @@ app.use(
1923
`${__dirname}/node_modules/@salesforce-ux/design-system/assets/`
2024
)
2125
);
22-
app.use(express.static(`${__dirname}/storybook`));
23-
24-
// Use the following line to test Storyshots instead
25-
// app.use(express.static(`${__dirname}/storybook-based-tests`));
26+
app.use(express.static(`${__dirname}/${buildFolder}`));
2627

2728
// Listen
2829
const server = app.listen(port, () => {

‎components/component-docs.json

Lines changed: 68 additions & 35 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"
@@ -6748,29 +6741,8 @@
67486741
},
67496742
"iconCategory": {
67506743
"type": {
6751-
"name": "enum",
6752-
"value": [
6753-
{
6754-
"value": "'action'",
6755-
"computed": false
6756-
},
6757-
{
6758-
"value": "'custom'",
6759-
"computed": false
6760-
},
6761-
{
6762-
"value": "'doctype'",
6763-
"computed": false
6764-
},
6765-
{
6766-
"value": "'standard'",
6767-
"computed": false
6768-
},
6769-
{
6770-
"value": "'utility'",
6771-
"computed": false
6772-
}
6773-
]
6744+
"name": "custom",
6745+
"raw": "requiredIf(\n PropTypes.oneOf(['action', 'custom', 'doctype', 'standard', 'utility']),\n (props) => !!props.iconName\n)"
67746746
},
67756747
"required": false,
67766748
"description": "Name of the icon category. Visit <a href=\"http://www.lightningdesignsystem.com/resources/icons\">Lightning Design System Icons</a> to reference icon categories."
@@ -7445,6 +7417,23 @@
74457417
"computed": false
74467418
}
74477419
},
7420+
"assistiveText": {
7421+
"type": {
7422+
"name": "shape",
7423+
"value": {
7424+
"dialogLabel": {
7425+
"name": "string",
7426+
"required": false
7427+
}
7428+
}
7429+
},
7430+
"required": false,
7431+
"description": "Assistive text for the modal.",
7432+
"defaultValue": {
7433+
"value": "{}",
7434+
"computed": false
7435+
}
7436+
},
74487437
"children": {
74497438
"type": {
74507439
"name": "node"
@@ -11110,7 +11099,51 @@
1111011099
},
1111111100
"tree": {
1111211101
"description": "A tree is visualization of a structure hierarchy. A branch can be expanded or collapsed. This is a controlled component, since visual state is present in the `nodes` data.",
11113-
"methods": [],
11102+
"methods": [
11103+
{
11104+
"name": "handleSelect",
11105+
"docblock": null,
11106+
"modifiers": [],
11107+
"params": [
11108+
{
11109+
"name": "event",
11110+
"type": null
11111+
},
11112+
{
11113+
"name": "data",
11114+
"type": null
11115+
},
11116+
{
11117+
"name": "clearSelectedNodes",
11118+
"type": null
11119+
}
11120+
],
11121+
"returns": null
11122+
},
11123+
{
11124+
"name": "handleNodeBlur",
11125+
"docblock": null,
11126+
"modifiers": [],
11127+
"params": [],
11128+
"returns": null
11129+
},
11130+
{
11131+
"name": "handleExpand",
11132+
"docblock": null,
11133+
"modifiers": [],
11134+
"params": [
11135+
{
11136+
"name": "event",
11137+
"type": null
11138+
},
11139+
{
11140+
"name": "data",
11141+
"type": null
11142+
}
11143+
],
11144+
"returns": null
11145+
}
11146+
],
1111411147
"props": {
1111511148
"assistiveText": {
1111611149
"type": {
@@ -11185,21 +11218,21 @@
1118511218
"name": "array"
1118611219
},
1118711220
"required": false,
11188-
"description": "Array of items starting at the top of the tree. The required shape is: `{expanded: string, id: string, label: string, selected: string, type: string, nodes: array}`, but only `id` and `label` are required. Use `type: 'branch'` for folder and categories."
11221+
"description": "Array of items starting at the top of the tree. The shape each node in the array is:\n```\n{\n expanded: string,\n id: string,\n label: string or node,\n selected: string,\n type: string,\n nodes: array\n}\n```\n`assistiveText: string` is optional and helpful if the label is not a string. Only `id` and `label` are required. Use `type: 'branch'` for folder and categories."
1118911222
},
1119011223
"onClick": {
1119111224
"type": {
1119211225
"name": "func"
1119311226
},
1119411227
"required": true,
11195-
"description": "Function that will run whenever an item or branch is clicked."
11228+
"description": "Function that will run whenever an item or branch is selected due to click or keyboard navigation."
1119611229
},
1119711230
"onExpandClick": {
1119811231
"type": {
1119911232
"name": "func"
1120011233
},
1120111234
"required": true,
11202-
"description": "This function triggers when the expand or collapse icon is clicked."
11235+
"description": "This function triggers when the expand or collapse icon is clicked or due to keyboard navigation."
1120311236
},
1120411237
"onScroll": {
1120511238
"type": {
@@ -11654,4 +11687,4 @@
1165411687
"SLDS-component-path": "/components/slider",
1165511688
"dependencies": []
1165611689
}
11657-
}
11690+
}

‎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':

‎components/tree/__docs__/storybook-stories.jsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React from 'react';
22
import createReactClass from 'create-react-class';
33
import PropTypes from 'prop-types';
44
import { storiesOf, action } from '@storybook/react';
5+
import cloneDeep from 'lodash.clonedeep';
56
import IconSettings from '../../icon-settings';
67

78
import { TREE } from '../../../utilities/constants';
@@ -38,7 +39,7 @@ const DemoTree = createReactClass({
3839
? sampleNodes[this.props.exampleNodesIndex]
3940
: sampleNodes.sampleNodesDefault;
4041
return {
41-
nodes: initalNodes,
42+
nodes: cloneDeep(initalNodes),
4243
selectedNode: undefined,
4344
searchTerm: this.props.searchable ? 'fruit' : undefined,
4445
};
@@ -74,15 +75,15 @@ const DemoTree = createReactClass({
7475

7576
return { selectedNode: data.node };
7677
});
77-
itemClicked('Node Clicked')(event, data);
78+
itemClicked('Node Selected')(event, data);
7879
} else if (
7980
!this.props.noBranchSelection ||
8081
(this.props.noBranchSelection && data.node.type !== 'branch')
8182
) {
8283
data.node.selected = data.select;
8384
// trigger render
8485
this.setState((prevState) => ({ ...prevState }));
85-
itemClicked('Node Clicked')(event, data);
86+
itemClicked('Node Selected')(event, data);
8687
}
8788
},
8889

‎components/tree/__examples__/default.jsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,8 @@ const sampleNodes = {
1919
expanded: true,
2020
nodes: [
2121
{
22-
label: 'Ground Fruits',
22+
assistiveText: 'Ground Fruits',
23+
label: <span>Ground Fruits</span>,
2324
type: 'branch',
2425
id: 4,
2526
nodes: [

0 commit comments

Comments
 (0)