Skip to content

Commit

Permalink
feat(node-renderer): Make title and subtitle insertable via props
Browse files Browse the repository at this point in the history
  • Loading branch information
@fritz-c
fritz-c committed Aug 5, 2017
1 parent 0abba80 commit fff72c6
Show file tree
Hide file tree
Showing 4 changed files with 407 additions and 7 deletions.
335 changes: 335 additions & 0 deletions examples/storybooks/__snapshots__/storyshots.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1398,3 +1398,338 @@ exports[`Storyshots Basics Minimal implementation 1`] = `
</a>
</div>
`;

exports[`Storyshots Basics Modify nodes 1`] = `
<div>
<div>
<div
style={
Object {
"height": 300,
}
}
>
<div
className="tree"
style={
Object {
"height": "100%",
}
}
>
<div>
<div
aria-label="grid"
className="ReactVirtualized__Grid ReactVirtualized__List virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Object {
"WebkitOverflowScrolling": "touch",
"boxSizing": "border-box",
"direction": "ltr",
"height": 99999,
"overflowX": "hidden",
"overflowY": "hidden",
"position": "relative",
"width": 200,
"willChange": "transform",
}
}
tabIndex={0}
>
<div
className="ReactVirtualized__Grid__innerScrollContainer"
style={
Object {
"height": 186,
"maxHeight": 186,
"maxWidth": 200,
"overflow": "hidden",
"pointerEvents": "",
"position": "relative",
"width": "auto",
}
}
>
<div
className="node"
style={
Object {
"height": 62,
"left": 0,
"position": "absolute",
"top": 0,
"width": "100%",
}
}
>
<div
className="lineBlock lineHalfHorizontalRight lineHalfVerticalBottom"
style={
Object {
"width": 44,
}
}
/>
<div
className="nodeContent"
style={
Object {
"left": 44,
}
}
>
<div
style={
Object {
"height": "100%",
}
}
>
<div
className="rowWrapper"
>
<div
className="row"
style={
Object {
"opacity": 1,
}
}
>
<div
className="moveHandle"
/>
<div
className="rowContents"
>
<div
className="rowLabel"
>
<span
className="rowTitle"
>
<input
onChange={[Function]}
style={
Object {
"fontSize": "1.1rem",
}
}
value="IT Manager"
/>
</span>
</div>
<div
className="rowToolbar"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<div
className="node"
style={
Object {
"height": 62,
"left": 0,
"position": "absolute",
"top": 62,
"width": "100%",
}
}
>
<div
className="lineBlock lineHalfVerticalTop lineHalfHorizontalRight"
style={
Object {
"width": 44,
}
}
/>
<div
className="nodeContent"
style={
Object {
"left": 44,
}
}
>
<div
style={
Object {
"height": "100%",
}
}
>
<div>
<button
aria-label="Collapse"
className="collapseButton"
onClick={[Function]}
style={
Object {
"left": -22,
}
}
type="button"
/>
<div
className="lineChildren"
style={
Object {
"width": 44,
}
}
/>
</div>
<div
className="rowWrapper"
>
<div
className="row"
style={
Object {
"opacity": 1,
}
}
>
<div
className="moveHandle"
/>
<div
className="rowContents"
>
<div
className="rowLabel"
>
<span
className="rowTitle"
>
<input
onChange={[Function]}
style={
Object {
"fontSize": "1.1rem",
}
}
value="Regional Manager"
/>
</span>
</div>
<div
className="rowToolbar"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<div
className="node"
style={
Object {
"height": 62,
"left": 0,
"position": "absolute",
"top": 124,
"width": "100%",
}
}
>
<div
className="lineBlock "
style={
Object {
"width": 44,
}
}
/>
<div
className="lineBlock lineHalfVerticalTop lineHalfHorizontalRight"
style={
Object {
"width": 44,
}
}
/>
<div
className="nodeContent"
style={
Object {
"left": 88,
}
}
>
<div
style={
Object {
"height": "100%",
}
}
>
<div
className="rowWrapper"
>
<div
className="row"
style={
Object {
"opacity": 1,
}
}
>
<div
className="moveHandle"
/>
<div
className="rowContents"
>
<div
className="rowLabel"
>
<span
className="rowTitle"
>
<input
onChange={[Function]}
style={
Object {
"fontSize": "1.1rem",
}
}
value="Branch Manager"
/>
</span>
</div>
<div
className="rowToolbar"
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<br />
<a
className="sourceLink"
href="https://github.com/fritz-c/react-sortable-tree/blob/master/examples/storybooks/modify-nodes.js"
rel="noopener noreferrer"
target="_top"
>
VIEW SOURCE →
</a>
</div>
`;
4 changes: 4 additions & 0 deletions examples/storybooks/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { storiesOf } from '@storybook/react';
// import { action } from '@storybook/addon-actions';
import BarebonesExample from './barebones';
import AddRemoveExample from './add-remove';
import ModifyNodesExample from './modify-nodes';
import ExternalNodeExample from './external-node';
import TouchSupportExample from './touch-support';
import TreeToTreeExample from './tree-to-tree';
Expand All @@ -31,6 +32,9 @@ storiesOf('Basics', module)
)
.add('Add and remove nodes programmatically', () =>
wrapWithSource(<AddRemoveExample />, 'add-remove.js')
)
.add('Modify nodes', () =>
wrapWithSource(<ModifyNodesExample />, 'modify-nodes.js')
);

storiesOf('Advanced', module)
Expand Down
Loading

0 comments on commit fff72c6

Please sign in to comment.