office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
66 lines • 3.07 kB
JavaScript
import * as tslib_1 from "tslib";
import * as React from 'react';
import { Nav } from 'office-ui-fabric-react/lib/Nav';
import './Nav.Basic.Example.scss';
var NavBasicExample = /** @class */ (function (_super) {
tslib_1.__extends(NavBasicExample, _super);
function NavBasicExample(props) {
var _this = _super.call(this, props) || this;
_this._onClickHandler = _this._onClickHandler.bind(_this);
return _this;
}
NavBasicExample.prototype.render = function () {
return (React.createElement("div", { className: "ms-NavExample-LeftPane" },
React.createElement(Nav, { groups: [
{
links: [
{
name: 'Home',
url: 'http://example.com',
links: [
{
name: 'Activity',
url: 'http://msn.com',
key: 'key1'
},
{
name: 'News',
url: 'http://msn.com',
key: 'key2'
}
],
isExpanded: true
},
{ name: 'Documents', url: 'http://example.com', key: 'key3', isExpanded: true },
{ name: 'Pages', url: 'http://msn.com', key: 'key4' },
{ name: 'Notebook', url: 'http://msn.com', key: 'key5' },
{ name: 'Long Name Test for ellipse', url: 'http://msn.com', key: 'key6' },
{
name: 'Edit',
url: 'http://cnn.com',
onClick: this._onClickHandler2,
icon: 'Edit',
key: 'key8'
},
{
name: 'Delete',
url: 'http://cnn.com',
onClick: this._onClickHandler2,
iconProps: { iconName: 'Delete' },
key: 'key9'
}
]
}
], expandedStateText: 'expanded', collapsedStateText: 'collapsed', selectedKey: 'key3' })));
};
NavBasicExample.prototype._onClickHandler = function (e) {
alert('test');
return false;
};
NavBasicExample.prototype._onClickHandler2 = function (e) {
return false;
};
return NavBasicExample;
}(React.Component));
export { NavBasicExample };
//# sourceMappingURL=Nav.Basic.Example.js.map