@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
43 lines • 2.81 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import React from 'react';
import { List, ListItem, ListItemSection, Button, Popover } from '@momentum-ui/react-collaboration';
var TabbableChildren = /** @class */ (function (_super) {
__extends(TabbableChildren, _super);
function TabbableChildren() {
return _super !== null && _super.apply(this, arguments) || this;
}
TabbableChildren.prototype.render = function () {
return (React.createElement("div", { className: "medium-6 columns" },
React.createElement(List, { id: "tabbable-children-list" },
React.createElement(ListItem, { link: "javascript:void(0)", focusLockTabbableChildren: true, focusLockTabbableChildrenProps: {
tabbableChildrenQuery: '#popover-btn,#btn',
tabbableChildrenHasPopover: true,
portalNodeQuery: '#tabbable-children-list',
tabbableChildSpawnedPopoverQuery: '#list-item-popover',
} },
React.createElement(ListItemSection, { position: "left" },
React.createElement(Popover, { id: "list-item-popover", content: React.createElement("div", { style: { display: 'block', padding: '7px 7px 0px 7px' } }, [1, 2, 3].map(function (id) { return (React.createElement("div", { style: { paddingBottom: '7px' }, key: "btn".concat(id) },
React.createElement(Button, { id: "btn".concat(id) }, "TabbableChild".concat(id)))); })), includeFocusOnHover: false },
React.createElement(Button, { tabIndex: "-1", id: "popover-btn", circle: true }, "A"))),
React.createElement(ListItemSection, { position: "center" }, "Center"),
React.createElement(ListItemSection, { position: "right" },
React.createElement(Button, { tabIndex: "-1", id: "btn" }, "Button"))))));
};
return TabbableChildren;
}(React.PureComponent));
export default TabbableChildren;
//# sourceMappingURL=TabbableChildren.js.map