office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
60 lines • 2.78 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 NavDisabledItemsExample = /** @class */ (function (_super) {
tslib_1.__extends(NavDisabledItemsExample, _super);
function NavDisabledItemsExample() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.onLinkClick = function (ev, item) {
if (item && item.name === 'News') {
alert('News link clicked');
}
};
return _this;
}
NavDisabledItemsExample.prototype.render = function () {
return (React.createElement("div", { className: "ms-NavExample-LeftPane" },
React.createElement(Nav, { groups: [
{
links: [
{
name: 'Home',
url: 'http://example.com',
disabled: true,
links: [
{
name: 'Activity',
url: 'http://msn.com',
key: 'key1'
},
{
name: 'MSN',
url: 'http://msn.com',
key: 'key2',
disabled: true,
altText: 'The link is temporary disabled'
}
],
isExpanded: true
},
{
name: 'Documents',
url: 'http://example.com',
key: 'key3'
},
{
name: 'Unavailable Item',
url: 'http://cnn.com',
icon: 'News',
disabled: true,
key: 'key4'
}
]
}
], onLinkClick: this.onLinkClick, expandedStateText: 'expanded', collapsedStateText: 'collapsed', selectedKey: 'key3', expandButtonAriaLabel: 'Expand or collapse' })));
};
return NavDisabledItemsExample;
}(React.Component));
export { NavDisabledItemsExample };
//# sourceMappingURL=Nav.DisabledItems.Example.js.map