UNPKG

confluence-web-components

Version:

Web components used to render common Confluence components in Connect add-ons.

1,164 lines (944 loc) 99.8 kB
/******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; __webpack_require__(1); __webpack_require__(2); var _ConfluenceQuickSearch = __webpack_require__(6); var _ConfluenceQuickSearch2 = _interopRequireDefault(_ConfluenceQuickSearch); var _ConfluenceCommentList = __webpack_require__(16); var _ConfluenceCommentList2 = _interopRequireDefault(_ConfluenceCommentList); var _ConfluenceContentBody = __webpack_require__(18); var _ConfluenceContentBody2 = _interopRequireDefault(_ConfluenceContentBody); var _ConfluenceContentList = __webpack_require__(20); var _ConfluenceContentList2 = _interopRequireDefault(_ConfluenceContentList); var _ConfluenceSpaceList = __webpack_require__(22); var _ConfluenceSpaceList2 = _interopRequireDefault(_ConfluenceSpaceList); var _ConfluenceSpaceTitle = __webpack_require__(24); var _ConfluenceSpaceTitle2 = _interopRequireDefault(_ConfluenceSpaceTitle); var _ConfluenceContentTitle = __webpack_require__(25); var _ConfluenceContentTitle2 = _interopRequireDefault(_ConfluenceContentTitle); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } document.registerReact('confluence-quick-search', _ConfluenceQuickSearch2.default); document.registerReact('confluence-comment-list', _ConfluenceCommentList2.default); document.registerReact('confluence-content-body', _ConfluenceContentBody2.default); document.registerReact('confluence-content-list', _ConfluenceContentList2.default); document.registerReact('confluence-space-list', _ConfluenceSpaceList2.default); document.registerReact('confluence-space-title', _ConfluenceSpaceTitle2.default); document.registerReact('confluence-content-title', _ConfluenceContentTitle2.default); /***/ }, /* 1 */ /***/ function(module, exports) { /*! (C) WebReflection Mit Style License */ (function(e,t,n,r){"use strict";function rt(e,t){for(var n=0,r=e.length;n<r;n++)vt(e[n],t)}function it(e){for(var t=0,n=e.length,r;t<n;t++)r=e[t],nt(r,b[ot(r)])}function st(e){return function(t){j(t)&&(vt(t,e),rt(t.querySelectorAll(w),e))}}function ot(e){var t=e.getAttribute("is"),n=e.nodeName.toUpperCase(),r=S.call(y,t?v+t.toUpperCase():d+n);return t&&-1<r&&!ut(n,t)?-1:r}function ut(e,t){return-1<w.indexOf(e+'[is="'+t+'"]')}function at(e){var t=e.currentTarget,n=e.attrChange,r=e.attrName,i=e.target;Q&&(!i||i===t)&&t.attributeChangedCallback&&r!=="style"&&e.prevValue!==e.newValue&&t.attributeChangedCallback(r,n===e[a]?null:e.prevValue,n===e[l]?null:e.newValue)}function ft(e){var t=st(e);return function(e){X.push(t,e.target)}}function lt(e){K&&(K=!1,e.currentTarget.removeEventListener(h,lt)),rt((e.target||t).querySelectorAll(w),e.detail===o?o:s),B&&pt()}function ct(e,t){var n=this;q.call(n,e,t),G.call(n,{target:n})}function ht(e,t){D(e,t),et?et.observe(e,z):(J&&(e.setAttribute=ct,e[i]=Z(e),e.addEventListener(p,G)),e.addEventListener(c,at)),e.createdCallback&&Q&&(e.created=!0,e.createdCallback(),e.created=!1)}function pt(){for(var e,t=0,n=F.length;t<n;t++)e=F[t],E.contains(e)||(n--,F.splice(t--,1),vt(e,o))}function dt(e){throw new Error("A "+e+" type is already registered")}function vt(e,t){var n,r=ot(e);-1<r&&(tt(e,b[r]),r=0,t===s&&!e[s]?(e[o]=!1,e[s]=!0,r=1,B&&S.call(F,e)<0&&F.push(e)):t===o&&!e[o]&&(e[s]=!1,e[o]=!0,r=1),r&&(n=e[t+"Callback"])&&n.call(e))}if(r in t)return;var i="__"+r+(Math.random()*1e5>>0),s="attached",o="detached",u="extends",a="ADDITION",f="MODIFICATION",l="REMOVAL",c="DOMAttrModified",h="DOMContentLoaded",p="DOMSubtreeModified",d="<",v="=",m=/^[A-Z][A-Z0-9]*(?:-[A-Z0-9]+)+$/,g=["ANNOTATION-XML","COLOR-PROFILE","FONT-FACE","FONT-FACE-SRC","FONT-FACE-URI","FONT-FACE-FORMAT","FONT-FACE-NAME","MISSING-GLYPH"],y=[],b=[],w="",E=t.documentElement,S=y.indexOf||function(e){for(var t=this.length;t--&&this[t]!==e;);return t},x=n.prototype,T=x.hasOwnProperty,N=x.isPrototypeOf,C=n.defineProperty,k=n.getOwnPropertyDescriptor,L=n.getOwnPropertyNames,A=n.getPrototypeOf,O=n.setPrototypeOf,M=!!n.__proto__,_=n.create||function mt(e){return e?(mt.prototype=e,new mt):this},D=O||(M?function(e,t){return e.__proto__=t,e}:L&&k?function(){function e(e,t){for(var n,r=L(t),i=0,s=r.length;i<s;i++)n=r[i],T.call(e,n)||C(e,n,k(t,n))}return function(t,n){do e(t,n);while((n=A(n))&&!N.call(n,t));return t}}():function(e,t){for(var n in t)e[n]=t[n];return e}),P=e.MutationObserver||e.WebKitMutationObserver,H=(e.HTMLElement||e.Element||e.Node).prototype,B=!N.call(H,E),j=B?function(e){return e.nodeType===1}:function(e){return N.call(H,e)},F=B&&[],I=H.cloneNode,q=H.setAttribute,R=H.removeAttribute,U=t.createElement,z=P&&{attributes:!0,characterData:!0,attributeOldValue:!0},W=P||function(e){J=!1,E.removeEventListener(c,W)},X,V=e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,10)},$=!1,J=!0,K=!0,Q=!0,G,Y,Z,et,tt,nt;O||M?(tt=function(e,t){N.call(t,e)||ht(e,t)},nt=ht):(tt=function(e,t){e[i]||(e[i]=n(!0),ht(e,t))},nt=tt),B?(J=!1,function(){var e=k(H,"addEventListener"),t=e.value,n=function(e){var t=new CustomEvent(c,{bubbles:!0});t.attrName=e,t.prevValue=this.getAttribute(e),t.newValue=null,t[l]=t.attrChange=2,R.call(this,e),this.dispatchEvent(t)},r=function(e,t){var n=this.hasAttribute(e),r=n&&this.getAttribute(e),i=new CustomEvent(c,{bubbles:!0});q.call(this,e,t),i.attrName=e,i.prevValue=n?r:null,i.newValue=t,n?i[f]=i.attrChange=1:i[a]=i.attrChange=0,this.dispatchEvent(i)},s=function(e){var t=e.currentTarget,n=t[i],r=e.propertyName,s;n.hasOwnProperty(r)&&(n=n[r],s=new CustomEvent(c,{bubbles:!0}),s.attrName=n.name,s.prevValue=n.value||null,s.newValue=n.value=t[r]||null,s.prevValue==null?s[a]=s.attrChange=0:s[f]=s.attrChange=1,t.dispatchEvent(s))};e.value=function(e,o,u){e===c&&this.attributeChangedCallback&&this.setAttribute!==r&&(this[i]={className:{name:"class",value:this.className}},this.setAttribute=r,this.removeAttribute=n,t.call(this,"propertychange",s)),t.call(this,e,o,u)},C(H,"addEventListener",e)}()):P||(E.addEventListener(c,W),E.setAttribute(i,1),E.removeAttribute(i),J&&(G=function(e){var t=this,n,r,s;if(t===e.target){n=t[i],t[i]=r=Z(t);for(s in r){if(!(s in n))return Y(0,t,s,n[s],r[s],a);if(r[s]!==n[s])return Y(1,t,s,n[s],r[s],f)}for(s in n)if(!(s in r))return Y(2,t,s,n[s],r[s],l)}},Y=function(e,t,n,r,i,s){var o={attrChange:e,currentTarget:t,attrName:n,prevValue:r,newValue:i};o[s]=e,at(o)},Z=function(e){for(var t,n,r={},i=e.attributes,s=0,o=i.length;s<o;s++)t=i[s],n=t.name,n!=="setAttribute"&&(r[n]=t.value);return r})),t[r]=function(n,r){c=n.toUpperCase(),$||($=!0,P?(et=function(e,t){function n(e,t){for(var n=0,r=e.length;n<r;t(e[n++]));}return new P(function(r){for(var i,s,o,u=0,a=r.length;u<a;u++)i=r[u],i.type==="childList"?(n(i.addedNodes,e),n(i.removedNodes,t)):(s=i.target,Q&&s.attributeChangedCallback&&i.attributeName!=="style"&&(o=s.getAttribute(i.attributeName),o!==i.oldValue&&s.attributeChangedCallback(i.attributeName,i.oldValue,o)))})}(st(s),st(o)),et.observe(t,{childList:!0,subtree:!0})):(X=[],V(function E(){while(X.length)X.shift().call(null,X.shift());V(E)}),t.addEventListener("DOMNodeInserted",ft(s)),t.addEventListener("DOMNodeRemoved",ft(o))),t.addEventListener(h,lt),t.addEventListener("readystatechange",lt),t.createElement=function(e,n){var r=U.apply(t,arguments),i=""+e,s=S.call(y,(n?v:d)+(n||i).toUpperCase()),o=-1<s;return n&&(r.setAttribute("is",n=n.toLowerCase()),o&&(o=ut(i.toUpperCase(),n))),Q=!t.createElement.innerHTMLHelper,o&&nt(r,b[s]),r},H.cloneNode=function(e){var t=I.call(this,!!e),n=ot(t);return-1<n&&nt(t,b[n]),e&&it(t.querySelectorAll(w)),t}),-2<S.call(y,v+c)+S.call(y,d+c)&&dt(n);if(!m.test(c)||-1<S.call(g,c))throw new Error("The type "+n+" is invalid");var i=function(){return f?t.createElement(l,c):t.createElement(l)},a=r||x,f=T.call(a,u),l=f?r[u].toUpperCase():c,c,p;return f&&-1<S.call(y,d+l)&&dt(l),p=y.push((f?v:d)+c)-1,w=w.concat(w.length?",":"",f?l+'[is="'+n.toLowerCase()+'"]':l),i.prototype=b[p]=T.call(a,"prototype")?a.prototype:_(H),rt(t.querySelectorAll(w),s),i}})(window,document,Object,"registerElement"); /***/ }, /* 2 */ /***/ function(module, exports, __webpack_require__) { (function() { var registerElement = document.registerElement || document.register; if (registerElement) { registerElement = registerElement.bind(document); } else { throw new Error('No custom element support or polyfill found!'); return; } var React = window.React || __webpack_require__(3); var ReactDOM = window.ReactDOM || __webpack_require__(4); var utils = __webpack_require__(5); exports.registerReact = function (elementName, ReactComponent) { var elementPrototype = Object.create(HTMLElement.prototype); var reactElement; function create(parent, props) { var element = React.createElement(ReactComponent, props); parent.reactiveElement = element; return ReactDOM.render(element, parent, props.onRender); } elementPrototype.createdCallback = function () { var props = utils.getProps(this); props.children = utils.getChildren(this); reactElement = create(this, props); exposeMethods(reactElement, reactElement.props.container); exposeDefaultMethods(reactElement, reactElement.props.container); utils.getterSetter(this, 'props', function () { return reactElement.props; }, function (props) { reactElement = create(this, props); }); }; elementPrototype.detachedCallback = function () { ReactDOM.unmountComponentAtNode(this); }; elementPrototype.attributeChangedCallback = function (name, oldValue, newValue) { var propertyName = utils.attributeNameToPropertyName(name), value = utils.parseAttributeValue(newValue); var props = utils.shallowCopy({}, this.props); props[propertyName] = value; reactElement = create(this, props); }; registerElement(elementName, {prototype: elementPrototype}); }; function exposeDefaultMethods (reactComponent, customElement) { customElement.forceUpdate = reactComponent.forceUpdate.bind(reactComponent); } function exposeMethods (reactComponent, customElement) { utils.extend(customElement, reactComponent); } exports.utils = utils; document.registerReact = exports.registerReact; }()) /***/ }, /* 3 */ /***/ function(module, exports) { module.exports = React; /***/ }, /* 4 */ /***/ function(module, exports) { module.exports = ReactDOM; /***/ }, /* 5 */ /***/ function(module, exports, __webpack_require__) { var React = window.React || __webpack_require__(3); var getAllProperties = function (obj) { var props = {}; while (obj && obj !== React.Component.prototype && obj !== Object.prototype) { var propNames = Object.getOwnPropertyNames(obj); for (var i = 0; i < propNames.length; i++) { props[propNames[i]] = null; } obj = Object.getPrototypeOf(obj); } delete props.constructor; return Object.keys(props); }; exports.extend = function (extensible, extending) { var props = getAllProperties(extending); for (var i = 0; i < props.length; i++) { var prop = props[i]; if (!(prop in extensible)) { var val = extending[prop]; if (typeof val === 'function') { val = val.bind(extending); } extensible[prop] = val; } } }; exports.getProps = function (el) { var props = {}; for (var i = 0; i < el.attributes.length; i++) { var attribute = el.attributes[i]; var name = exports.attributeNameToPropertyName(attribute.name); props[name] = exports.parseAttributeValue(attribute.value); } props.container = el; return props; }; exports.getterSetter = function (variableParent, variableName, getterFunction, setterFunction) { if (Object.defineProperty) { Object.defineProperty(variableParent, variableName, { get: getterFunction, set: setterFunction }); } else if (document.__defineGetter__) { variableParent.__defineGetter__(variableName, getterFunction); variableParent.__defineSetter__(variableName, setterFunction); } variableParent['get' + variableName] = getterFunction; variableParent['set' + variableName] = setterFunction; }; exports.attributeNameToPropertyName = function (attributeName) { return attributeName .replace(/^(x|data)[-_:]/i, '') .replace(/[-_:](.)/g, function (x, chr) { return chr.toUpperCase(); }); }; exports.parseAttributeValue = function (value) { if (!value) { return null; } var pointerRegexp = /^{.*?}$/i, jsonRegexp = /^{{2}.*}{2}$/, jsonArrayRegexp = /^{\[.*\]}$/; var pointerMatches = value.match(pointerRegexp), jsonMatches = value.match(jsonRegexp) || value.match(jsonArrayRegexp); if (jsonMatches) { value = JSON.parse(jsonMatches[0].replace(/^{|}$/g, '')); } else if (pointerMatches) { value = eval(pointerMatches[0].replace(/[{}]/g, '')); } return value; }; exports.getChildren = function (el) { var fragment = document.createDocumentFragment(); while (el.childNodes.length) { fragment.appendChild(el.childNodes[0]); } return fragment; }; exports.shallowCopy = function (a, b) { for (var key in b) a[key] = b[key]; return a; }; /***/ }, /* 6 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _react = __webpack_require__(3); var _react2 = _interopRequireDefault(_react); var _QuickSearch = __webpack_require__(7); var _QuickSearch2 = _interopRequireDefault(_QuickSearch); var _context = __webpack_require__(14); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } // These items have no way to be navigated to using the Connect navigation API, so they get filtered out. var BLACKLIST = ['admin-item']; var ConfluenceQuickSearch = function (_Component) { _inherits(ConfluenceQuickSearch, _Component); function ConfluenceQuickSearch() { _classCallCheck(this, ConfluenceQuickSearch); var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(ConfluenceQuickSearch).call(this)); _this._getRecentPages = _this._getRecentPages.bind(_this); _this._handleSearchQueryChange = _this._handleSearchQueryChange.bind(_this); _this.state = { isLoading: false, searchQuery: '', searchResults: [] }; return _this; } _createClass(ConfluenceQuickSearch, [{ key: '_getRecentPages', value: function _getRecentPages() { var _this2 = this; this.setState({ isLoading: true }); AP.require('request', function (request) { request({ url: '/rest/api/content/search?expand=container,metadata.currentuser.viewed.lastSeen&cql=type%20in%20(page,blogpost)%20and%20id%20in%20recentlyViewedContent(%208,%200)', success: function success(response) { response = JSON.parse(response); var baseUrl = response._links.base; var recentPages = response.results.map(function (result) { return { id: result.id, lastSeen: new Date(result.metadata.currentuser.viewed.lastSeen), title: result.title, space: result.container.name, type: result.type, url: '' + baseUrl + result._links.webui }; }).sort(function (a, b) { return a.lastSeen < b.lastSeen; }); _this2.setState({ isLoading: false, recentPages: recentPages }); } }); }); } }, { key: '_handleSearchQueryChange', value: function _handleSearchQueryChange(searchQuery) { var _this3 = this; this.setState({ searchQuery: searchQuery }); if (searchQuery.length > 1) { this.setState({ isLoading: true }); AP.require('request', function (request) { request({ url: '/rest/quicknav/1/search?query=' + searchQuery, success: function success(response) { response = JSON.parse(response); // Only include content types that we can navigate to var searchResults = response.contentNameMatches.filter(function (group) { return BLACKLIST.indexOf(group[0].className) === -1; }); // Re-write to absolute URLs searchResults = searchResults.map(function (group) { return group.map(function (result) { return result = _extends({}, result, { href: '' + (0, _context.xdm_e)() + result.href }); }); }); _this3.setState({ isLoading: false, searchResults: searchResults }); } }); }); } else { this.setState({ searchResults: [] }); } } //_handleContentItemSelect(event, targetName, context) { // AP.require('navigator', navigator => navigator.go(targetName, context)); // event.preventDefault(); //} }, { key: '_handleSearch', value: function _handleSearch(event, query) { AP.require('navigator', function (navigator) { return navigator.go('sitesearch', { query: query }); }); event.preventDefault(); } }, { key: 'render', value: function render() { return _react2.default.createElement(_QuickSearch2.default, { onFocusInput: this._getRecentPages //onSelect={this._handleContentItemSelect} , onSearch: this._handleSearch, searchQuery: this.state.searchQuery, onChangeSearchQuery: this._handleSearchQueryChange, containerClass: this.props.containerClass, placeholder: this.props.placeholder, recentPages: this.state.recentPages, searchResults: this.state.searchResults, showLoadingIndicator: this.state.isLoading }); } }]); return ConfluenceQuickSearch; }(_react.Component); exports.default = ConfluenceQuickSearch; ConfluenceQuickSearch.propTypes = { /** * A CSS class name that will be applied to the root DOM node. */ containerClass: _react.PropTypes.string, /** * Placeholder text to show in the search input field. */ placeholder: _react.PropTypes.string }; /***/ }, /* 7 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _react = __webpack_require__(3); var _react2 = _interopRequireDefault(_react); var _reactDom = __webpack_require__(4); var _reactDom2 = _interopRequireDefault(_reactDom); var _AUIButton = __webpack_require__(8); var _AUIButton2 = _interopRequireDefault(_AUIButton); var _AUIIcon = __webpack_require__(10); var _AUIIcon2 = _interopRequireDefault(_AUIIcon); var _AUIItemLink = __webpack_require__(11); var _AUIItemLink2 = _interopRequireDefault(_AUIItemLink); var _AUIDropdownSection = __webpack_require__(12); var _AUIDropdownSection2 = _interopRequireDefault(_AUIDropdownSection); var _AUIDropdownMenu = __webpack_require__(13); var _AUIDropdownMenu2 = _interopRequireDefault(_AUIDropdownMenu); var _classnames = __webpack_require__(9); var _classnames2 = _interopRequireDefault(_classnames); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var availableItems = []; var activeTargetName = ''; var activeContext = {}; var QuickSearch = function (_Component) { _inherits(QuickSearch, _Component); function QuickSearch() { _classCallCheck(this, QuickSearch); var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(QuickSearch).call(this)); _this._handleChange = _this._handleChange.bind(_this); _this._handleKeyDown = _this._handleKeyDown.bind(_this); _this._handleMouseUp = _this._handleMouseUp.bind(_this); _this._handleNavigate = _this._handleNavigate.bind(_this); _this._goTo = _this._goTo.bind(_this); _this._handleFocus = _this._handleFocus.bind(_this); _this._handleSearch = _this._handleSearch.bind(_this); _this._clearActiveItem = _this._clearActiveItem.bind(_this); _this.state = { interacting: false, activeItem: -1 }; return _this; } _createClass(QuickSearch, [{ key: 'componentWillUnmount', value: function componentWillUnmount() { document.removeEventListener('mouseup', this._handleMouseUp, false); document.removeEventListener('keydown', this._handleKeyDown, false); } }, { key: '_setActiveItem', value: function _setActiveItem(type, index, event) { this.setState({ activeItem: availableItems.indexOf(type + '.' + index) }); } }, { key: '_activateNextItem', value: function _activateNextItem() { if (this.state.activeItem < availableItems.length - 1) { this.setState({ activeItem: ++this.state.activeItem }); } } }, { key: '_activatePreviousItem', value: function _activatePreviousItem() { if (this.state.activeItem > -1) { this.setState({ activeItem: --this.state.activeItem }); } } }, { key: '_clearActiveItem', value: function _clearActiveItem() { this.setState({ activeItem: -1 }); } }, { key: '_handleMouseUp', value: function _handleMouseUp(event) { var _this2 = this; if (event.target !== this.refs.searchQuery) { setTimeout(function () { _this2.setState({ interacting: false }); }, 0); } } }, { key: '_getContext', value: function _getContext(result) { switch (result.className) { case 'content-type-page': case 'content-type-blogpost': return { contentId: result.id }; case 'content-type-attachment-image': return { contentId: Number(result.href.match(/preview=%2F([^%]+)/)[1]), attachmentId: result.id }; case 'search-for': return { query: '' }; case 'content-type-userinfo': return { username: result.name }; } throw new Error('Content type "' + result.className + '" not supported'); } }, { key: '_goTo', value: function _goTo(targetName, context) { return this._handleNavigate.bind(this, targetName, context); } }, { key: '_handleNavigate', value: function _handleNavigate(targetName, context, event) { switch (targetName) { case 'sitesearch': context = { query: this.props.searchQuery }; break; } var selectEvent = new CustomEvent('select', { detail: { targetName: targetName, context: context, nativeEvent: event }, bubbles: true }); _reactDom2.default.findDOMNode(this).dispatchEvent(selectEvent); if (this.props.onSelect) { this.props.onSelect(event, targetName, context); } } }, { key: '_getTargetName', value: function _getTargetName(sectionName) { switch (sectionName) { case 'search-for': return 'sitesearch'; case 'recent-content': case 'content-type-page': case 'content-type-blogpost': return 'contentview'; case 'content-type-attachment-image': return 'attachmentview'; case 'content-type-userinfo': return 'userprofile'; } return sectionName; } }, { key: '_resultsList', value: function _resultsList(_ref) { var _this3 = this; var results = _ref.results; var anchorClass = _ref.anchorClass; return _react2.default.createElement( _AUIDropdownSection2.default, { key: anchorClass }, results.map(function (result, index) { var activateCurrentPage = function activateCurrentPage(targetName, context) { return function () { activeTargetName = targetName; activeContext = context; _this3._setActiveItem(result.className, index); _this3._userInteracting(); }; }; var classes = (0, _classnames2.default)({ 'active': anchorClass + '.' + index === availableItems[_this3.state.activeItem] }); var targetName = _this3._getTargetName(anchorClass); return _react2.default.createElement( _AUIItemLink2.default, { key: index, href: result.href, className: classes, anchorClassName: anchorClass, onClick: _this3._goTo(targetName, result.context), onFocus: activateCurrentPage(targetName, result.context), onBlur: _this3._clearActiveItem, onMouseOver: activateCurrentPage(targetName, result.context), onMouseOut: _this3._clearActiveItem, target: '_top' }, _react2.default.createElement('span', { dangerouslySetInnerHTML: { __html: result.name } }), result.spaceName ? _react2.default.createElement( 'small', null, result.spaceName ) : null ); }) ); } }, { key: '_dropdownMenusBySection', value: function _dropdownMenusBySection(_ref2) { var _this4 = this; var sections = _ref2.sections; availableItems = Object.keys(sections).reduce(function (context, sectionName) { return context.concat(sections[sectionName].map(function (item, index) { return sectionName + '.' + index; })); }, []); return _react2.default.createElement( _AUIDropdownMenu2.default, { style: { display: 'block' } }, Object.keys(sections).map(function (sectionName) { return _this4._resultsList({ results: sections[sectionName], anchorClass: sectionName }); }) ); } }, { key: '_handleChange', value: function _handleChange(event) { this._userInteracting(); this.props.onChangeSearchQuery(event.target.value); } }, { key: '_userInteracting', value: function _userInteracting() { this.setState({ interacting: true }); document.addEventListener('mouseup', this._handleMouseUp, false); document.addEventListener('keydown', this._handleKeyDown, false); } }, { key: '_userStoppedInteracting', value: function _userStoppedInteracting() { this.setState({ interacting: false, activeItem: -1 }); document.removeEventListener('mouseup', this._handleMouseUp, false); document.removeEventListener('keydown', this._handleKeyDown, false); } }, { key: '_handleKeyDown', value: function _handleKeyDown(event) { var ESC = 27; var DOWN_ARROW = 40; var UP_ARROW = 38; var ENTER = 13; switch (event.keyCode) { case ESC: this._userStoppedInteracting(); break; case DOWN_ARROW: this._activateNextItem(); break; case UP_ARROW: this._activatePreviousItem(); break; case ENTER: if (this.state.activeItem > -1) { this._handleNavigate(activeTargetName, activeContext, event); } this._userStoppedInteracting(); break; } } }, { key: '_handleFocus', value: function _handleFocus(event) { this._userInteracting(); if (this.props.onFocusInput) { this.props.onFocusInput(event); } } }, { key: '_handleSearch', value: function _handleSearch(event) { this.props.onSearch(event, this.props.searchQuery); event.preventDefault(); } }, { key: 'render', value: function render() { var _this5 = this; var dropdown = undefined; if (this.props.searchResults && this.props.searchResults.length > 0) { var sections = this.props.searchResults.reduce(function (prev, result) { prev[result[0].className] = result.map(function (result) { result.context = _this5._getContext(result); return result; }); return prev; }, {}); dropdown = this._dropdownMenusBySection({ sections: sections }); } else { if (this.props.recentPages && this.props.recentPages.length > 0) { var sections = { 'recent-content': this.props.recentPages.map(function (recentPage) { return { id: recentPage.id, spaceName: recentPage.space, context: { contentId: recentPage.id }, name: recentPage.title, className: 'recent-content', href: recentPage.url }; }) }; if (this.props.showMoreLink) { sections['recently-viewed'] = [{ id: 0, name: 'More recently viewed pages...', className: 'recently-viewed', href: '#' }]; } dropdown = this._dropdownMenusBySection({ sections: sections }); } } // TODO: Fix hard-coded content path (/confluence) here. return _react2.default.createElement( 'form', { className: (0, _classnames2.default)('aui', this.props.containerClass), action: '/confluence/dositesearch.action', method: 'get' }, _react2.default.createElement( 'fieldset', null, _react2.default.createElement( 'label', { className: 'assistive' }, 'Quick Search' ), _react2.default.createElement('input', { autoComplete: 'off', title: 'Quick Search (/or g , g)', className: 'text', name: 'queryString', ref: 'searchQuery', type: 'text', onChange: this._handleChange, onClick: this._handleFocus, onFocus: this._handleFocus, placeholder: this.props.placeholder, value: this.props.searchQuery }), this.state.interacting ? dropdown : null, _react2.default.createElement( _AUIButton2.default, { onClick: this._handleSearch }, 'Search' ) ) ); } }]); return QuickSearch; }(_react.Component); exports.default = QuickSearch; QuickSearch.displayName = 'Search'; QuickSearch.propTypes = { /** * A CSS class name that will be applied to the root DOM node. */ containerClass: _react.PropTypes.string, /** * Triggered when focusing on the search input field. */ onFocusInput: _react.PropTypes.func, /** * Triggered when the user selects a search result. */ onSelect: _react.PropTypes.func, /** * Trigger when a search is performed. e.g. When clicking the Search button or pressing Enter. */ onSearch: _react.PropTypes.func, /** * Placeholder text to show in the search input field. */ placeholder: _react.PropTypes.string, /** * The current value of the search input field. */ searchQuery: _react.PropTypes.string, /** * Triggered whenever the search query changes. */ onChangeSearchQuery: _react.PropTypes.func, /** * The search results to display (grouped by section). */ searchResults: _react.PropTypes.array, /** * The recent pages to display. */ recentPages: _react.PropTypes.array, /** * Indicates if a link should be displayed to show more recently visited pages. */ showMoreLink: _react.PropTypes.bool }; /***/ }, /* 8 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _react = __webpack_require__(3); var _react2 = _interopRequireDefault(_react); var _classnames = __webpack_require__(9); var _classnames2 = _interopRequireDefault(_classnames); var _AUIIcon = __webpack_require__(10); var _AUIIcon2 = _interopRequireDefault(_AUIIcon); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var AUIButton = function (_Component) { _inherits(AUIButton, _Component); function AUIButton() { _classCallCheck(this, AUIButton); return _possibleConstructorReturn(this, Object.getPrototypeOf(AUIButton).apply(this, arguments)); } _createClass(AUIButton, [{ key: 'render', value: function render() { var _props = this.props; var icon = _props.icon; var type = _props.type; var disabled = _props.disabled; var children = _props.children; var className = _props.className; var otherProps = _objectWithoutProperties(_props, ['icon', 'type', 'disabled', 'children', 'className']); var iconComponent = null; if (icon) { iconComponent = _react2.default.createElement( 'span', null, _react2.default.createElement(_AUIIcon2.default, { icon: icon }), ' ' ); } var typeClass = undefined; if (type) { typeClass = 'aui-button-' + type; } var classes = (0, _classnames2.default)('aui-button', typeClass); if (className) { classes += ' ' + className; } return _react2.default.createElement( 'button', _extends({ className: classes, 'aria-disabled': disabled }, otherProps), iconComponent, children ); } }]); return AUIButton; }(_react.Component); exports.default = AUIButton; AUIButton.defaultProps = { className: '' }; AUIButton.displayName = 'AUIButton'; AUIButton.propTypes = { /** * The type of the button link, primary or subtle */ type: _react.PropTypes.oneOf(['link', 'primary', 'subtle']), /** * The icon to show in the button */ icon: _react.PropTypes.string, /** * Disabled */ disabled: _react.PropTypes.bool, /** * The children of the button */ children: _react.PropTypes.oneOfType([_react.PropTypes.element, _react.PropTypes.string]), className: _react.PropTypes.string }; /***/ }, /* 9 */ /***/ function(module, exports, __webpack_require__) { var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! Copyright (c) 2016 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */ /* global define */ (function () { 'use strict'; var hasOwn = {}.hasOwnProperty; function classNames () { var classes = []; for (var i = 0; i < arguments.length; i++) { var arg = arguments[i]; if (!arg) continue; var argType = typeof arg; if (argType === 'string' || argType === 'number') { classes.push(arg); } else if (Array.isArray(arg)) { classes.push(classNames.apply(null, arg)); } else if (argType === 'object') { for (var key in arg) { if (hasOwn.call(arg, key) && arg[key]) { classes.push(key); } } } } return classes.join(' '); } if (typeof module !== 'undefined' && module.exports) { module.exports = classNames; } else if (true) { // register as 'classnames', consistent with npm package name !(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = function () { return classNames; }.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); } else { window.classNames = classNames; } }()); /***/ }, /* 10 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _react = __webpack_require__(3); var _react2 = _interopRequireDefault(_react); var _classnames = __webpack_require__(9); var _classnames2 = _interopRequireDefault(_classnames); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var AUIIcon = function (_Component) { _inherits(AUIIcon, _Component); function AUIIcon() { _classCallCheck(this, AUIIcon); return _possibleConstructorReturn(this, Object.getPrototypeOf(AUIIcon).apply(this, arguments)); } _createClass(AUIIcon, [{ key: 'render', value: function render() { var iconfontClass = undefined; var customStyle = undefined; var className = this.props.className; var _props = this.props; var icon = _props.icon; var size = _props.size; var style = _props.style;