UNPKG

coveo-search-ui-extensions

Version:

Small generic components to extend the functionality of Coveo's Search UI framework.

1,009 lines (928 loc) 221 kB
(function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require("Coveo")); else if(typeof define === 'function' && define.amd) define(["Coveo"], factory); else if(typeof exports === 'object') exports["CoveoExtension"] = factory(require("Coveo")); else root["CoveoExtension"] = factory(root["Coveo"]); })(window, function(__WEBPACK_EXTERNAL_MODULE_coveo_search_ui__) { return /******/ (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] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = 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; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); /******/ } /******/ }; /******/ /******/ // define __esModule on exports /******/ __webpack_require__.r = function(exports) { /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); /******/ } /******/ Object.defineProperty(exports, '__esModule', { value: true }); /******/ }; /******/ /******/ // create a fake namespace object /******/ // mode & 1: value is a module id, require it /******/ // mode & 2: merge all properties of value into the ns /******/ // mode & 4: return value when already ns object /******/ // mode & 8|1: behave like require /******/ __webpack_require__.t = function(value, mode) { /******/ if(mode & 1) value = __webpack_require__(value); /******/ if(mode & 8) return value; /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; /******/ var ns = Object.create(null); /******/ __webpack_require__.r(ns); /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); /******/ return ns; /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = "/commonjs"; /******/ /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = "./src/Index.ts"); /******/ }) /************************************************************************/ /******/ ({ /***/ "./src/Index.ts": /*!**********************!*\ !*** ./src/Index.ts ***! \**********************/ /*! exports provided: ActionButton, ToggleActionButton, DisableableToggleActionButton, AttachResult, UserActivity, UserActions, ClickedDocumentList, QueryList, UserProfilingEndpoint, UserProfileModel, ResultsFilter, ViewedByCustomer, ResultAction, CopyToClipboard, TopQueries */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _components_ActionButton_ActionButton__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/ActionButton/ActionButton */ "./src/components/ActionButton/ActionButton.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ActionButton", function() { return _components_ActionButton_ActionButton__WEBPACK_IMPORTED_MODULE_0__["ActionButton"]; }); /* harmony import */ var _components_ActionButton_ToggleActionButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/ActionButton/ToggleActionButton */ "./src/components/ActionButton/ToggleActionButton.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ToggleActionButton", function() { return _components_ActionButton_ToggleActionButton__WEBPACK_IMPORTED_MODULE_1__["ToggleActionButton"]; }); /* harmony import */ var _components_ActionButton_DisableableToggleActionButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/ActionButton/DisableableToggleActionButton */ "./src/components/ActionButton/DisableableToggleActionButton.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DisableableToggleActionButton", function() { return _components_ActionButton_DisableableToggleActionButton__WEBPACK_IMPORTED_MODULE_2__["DisableableToggleActionButton"]; }); /* harmony import */ var _components_AttachResult_AttachResult__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/AttachResult/AttachResult */ "./src/components/AttachResult/AttachResult.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AttachResult", function() { return _components_AttachResult_AttachResult__WEBPACK_IMPORTED_MODULE_3__["AttachResult"]; }); /* harmony import */ var _components_UserActions_UserActivity__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/UserActions/UserActivity */ "./src/components/UserActions/UserActivity.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "UserActivity", function() { return _components_UserActions_UserActivity__WEBPACK_IMPORTED_MODULE_4__["UserActivity"]; }); /* harmony import */ var _components_UserActions_UserActions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/UserActions/UserActions */ "./src/components/UserActions/UserActions.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "UserActions", function() { return _components_UserActions_UserActions__WEBPACK_IMPORTED_MODULE_5__["UserActions"]; }); /* harmony import */ var _components_UserActions_ClickedDocumentList__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components/UserActions/ClickedDocumentList */ "./src/components/UserActions/ClickedDocumentList.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ClickedDocumentList", function() { return _components_UserActions_ClickedDocumentList__WEBPACK_IMPORTED_MODULE_6__["ClickedDocumentList"]; }); /* harmony import */ var _components_UserActions_QueryList__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./components/UserActions/QueryList */ "./src/components/UserActions/QueryList.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "QueryList", function() { return _components_UserActions_QueryList__WEBPACK_IMPORTED_MODULE_7__["QueryList"]; }); /* harmony import */ var _rest_UserProfilingEndpoint__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./rest/UserProfilingEndpoint */ "./src/rest/UserProfilingEndpoint.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "UserProfilingEndpoint", function() { return _rest_UserProfilingEndpoint__WEBPACK_IMPORTED_MODULE_8__["UserProfilingEndpoint"]; }); /* harmony import */ var _models_UserProfileModel__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./models/UserProfileModel */ "./src/models/UserProfileModel.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "UserProfileModel", function() { return _models_UserProfileModel__WEBPACK_IMPORTED_MODULE_9__["UserProfileModel"]; }); /* harmony import */ var _components_ResultsFilter_ResultsFilter__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./components/ResultsFilter/ResultsFilter */ "./src/components/ResultsFilter/ResultsFilter.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ResultsFilter", function() { return _components_ResultsFilter_ResultsFilter__WEBPACK_IMPORTED_MODULE_10__["ResultsFilter"]; }); /* harmony import */ var _components_ViewedByCustomer_ViewedByCustomer__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./components/ViewedByCustomer/ViewedByCustomer */ "./src/components/ViewedByCustomer/ViewedByCustomer.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ViewedByCustomer", function() { return _components_ViewedByCustomer_ViewedByCustomer__WEBPACK_IMPORTED_MODULE_11__["ViewedByCustomer"]; }); /* harmony import */ var _components_ResultAction_ResultAction__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/ResultAction/ResultAction */ "./src/components/ResultAction/ResultAction.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ResultAction", function() { return _components_ResultAction_ResultAction__WEBPACK_IMPORTED_MODULE_12__["ResultAction"]; }); /* harmony import */ var _components_CopyToClipboard_CopyToClipboard__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/CopyToClipboard/CopyToClipboard */ "./src/components/CopyToClipboard/CopyToClipboard.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CopyToClipboard", function() { return _components_CopyToClipboard_CopyToClipboard__WEBPACK_IMPORTED_MODULE_13__["CopyToClipboard"]; }); /* harmony import */ var _components_TopQueries_TopQueries__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/TopQueries/TopQueries */ "./src/components/TopQueries/TopQueries.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TopQueries", function() { return _components_TopQueries_TopQueries__WEBPACK_IMPORTED_MODULE_14__["TopQueries"]; }); // This entry point defines all the components that are included in the extensions. /***/ }), /***/ "./src/components/ActionButton/ActionButton.ts": /*!*****************************************************!*\ !*** ./src/components/ActionButton/ActionButton.ts ***! \*****************************************************/ /*! exports provided: ActionButton */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ActionButton", function() { return ActionButton; }); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! coveo-search-ui */ "coveo-search-ui"); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__); var __extends = (undefined && undefined.__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 (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); /** * The _ActionButton_ component is a simple button allowing to show an icon, text, and tooltip. * * ```html * <button class='CoveoActionButton'></button> * ``` */ var ActionButton = /** @class */ (function (_super) { __extends(ActionButton, _super); function ActionButton(element, options, bindings) { var _this = _super.call(this, element, ActionButton.ID, bindings) || this; _this.element = element; _this.options = options; _this.bindings = bindings; _this.options = coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].initComponentOptions(element, ActionButton, options); if (_this.options.icon || _this.options.title) { _this.render(); } else { console.warn('The action button cannot render since no icon nor title is defined.'); Coveo.$$(_this.element).hide(); } if (_this.options.click) { Coveo.$$(element).on('click', function () { return _this.options.click(); }); } return _this; } /** * Updates the button icon. * @param icon Markup of the SVG icon to set. */ ActionButton.prototype.updateIcon = function (icon) { var iconElement = this.element.querySelector('.coveo-actionbutton_icon'); if (iconElement && icon && icon != iconElement.innerHTML) { iconElement.innerHTML = icon; } }; /** * Updates the button tooltip. * @param tooltip The tooltip to set. */ ActionButton.prototype.updateTooltip = function (tooltip) { if (tooltip && tooltip != this.element.title) { this.element.title = tooltip; } }; ActionButton.prototype.render = function () { this.applyButtonStyles(); if (this.options.icon) { this.appendIcon(); } if (this.options.title) { this.appendTitle(); } if (this.options.tooltip) { this.appendTooltip(); } }; ActionButton.prototype.applyButtonStyles = function () { this.element.classList.add('coveo-actionbutton'); if (this.options.icon && !this.options.title) { this.element.classList.add('coveo-actionbutton-icononly'); } }; ActionButton.prototype.createIconElement = function () { var iconElement = document.createElement('span'); iconElement.classList.add('coveo-icon', 'coveo-actionbutton_icon'); iconElement.innerHTML = this.options.icon; return iconElement; }; ActionButton.prototype.createTitleElement = function () { var titleElement = document.createElement('span'); titleElement.classList.add('coveo-actionbutton_title'); titleElement.innerText = this.options.title; return titleElement; }; ActionButton.prototype.appendIcon = function () { this.element.appendChild(this.createIconElement()); }; ActionButton.prototype.appendTitle = function () { this.element.appendChild(this.createTitleElement()); }; ActionButton.prototype.appendTooltip = function () { this.element.title = this.options.tooltip; }; ActionButton.ID = 'ActionButton'; /** * The possible options for _ActionButton_. * @componentOptions */ ActionButton.options = { /** * Specifies the button label. The text is displayed on a single line, next to the icon. * * Default is the empty string. * * ```html * <button class='CoveoActionButton' data-title='My Button'></button> * ``` */ title: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption(), /** * Specifies the button tooltip text. * * Default is the empty string. * * ```html * <button class='CoveoActionButton' data-tooltip='My button tooltip'></button> * ``` */ tooltip: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption(), /** * Specifies the button SVG icon. * Note: The SVG markup has to be HTML encoded when set using the HTML attributes. * * Default is the empty string. * * For example, with this SVG markup: * * ```xml * <svg width="1em" height="1em">...</svg> * ``` * * The attribute would be set like this: * * ```html * <button class='CoveoActionButton' data-icon='&lt;svg width=&quot;1em&quot; height=&quot;1em&quot;&gt;...&lt;/svg&gt;'></button> * ``` */ icon: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption(), /** * Specifies the handler called when the button is clicked. * * Default is `null`. * * This option must be set in JavaScript when initializing the component. */ click: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildCustomOption(function (s) { return null; }, { required: true }), }; return ActionButton; }(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Component"])); coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Initialization"].registerAutoCreateComponent(ActionButton); /***/ }), /***/ "./src/components/ActionButton/DisableableButton.ts": /*!**********************************************************!*\ !*** ./src/components/ActionButton/DisableableButton.ts ***! \**********************************************************/ /*! exports provided: DisabledState */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DisabledState", function() { return DisabledState; }); var DisabledState = /** @class */ (function () { function DisabledState(disabledButton) { this.name = 'DisabledState'; this.onStateEntry = function () { this.element.classList.add(DisabledState.DISABLED_CLASS_NAME); this.element.setAttribute('disabled', ''); }; this.onStateExit = function () { this.element.classList.remove(DisabledState.DISABLED_CLASS_NAME); this.element.removeAttribute('disabled'); }; this.click = function () { }; this.icon = disabledButton.options.disabledIcon; this.tooltip = disabledButton.options.disabledTooltip; } DisabledState.DISABLED_CLASS_NAME = 'coveo-actionbutton-disabled'; return DisabledState; }()); /***/ }), /***/ "./src/components/ActionButton/DisableableToggleActionButton.ts": /*!**********************************************************************!*\ !*** ./src/components/ActionButton/DisableableToggleActionButton.ts ***! \**********************************************************************/ /*! exports provided: DisableableToggleActionButton */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DisableableToggleActionButton", function() { return DisableableToggleActionButton; }); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! coveo-search-ui */ "coveo-search-ui"); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _StatefulActionButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./StatefulActionButton */ "./src/components/ActionButton/StatefulActionButton.ts"); /* harmony import */ var _ToggleableButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ToggleableButton */ "./src/components/ActionButton/ToggleableButton.ts"); /* harmony import */ var _DisableableButton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./DisableableButton */ "./src/components/ActionButton/DisableableButton.ts"); /* harmony import */ var _ToggleActionButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ToggleActionButton */ "./src/components/ActionButton/ToggleActionButton.ts"); var __extends = (undefined && undefined.__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 (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); var __assign = (undefined && undefined.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; var DisableableToggleActionButton = /** @class */ (function (_super) { __extends(DisableableToggleActionButton, _super); function DisableableToggleActionButton(element, options, bindings) { var _this = _super.call(this, element, DisableableToggleActionButton.ID, bindings) || this; _this.element = element; _this.options = options; _this.bindings = bindings; _this.options = coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].initComponentOptions(element, DisableableToggleActionButton, options); _this.createInnerButton(bindings); return _this; } /** * Indicates whether the toggle button is in the activated state. */ DisableableToggleActionButton.prototype.isActivated = function () { return this.innerStatefulActionButton.getCurrentState() === this.activatedState; }; /** * Indicates whether the disableable toggle button is in the disable state. */ DisableableToggleActionButton.prototype.isDisabled = function () { return this.innerStatefulActionButton.getCurrentState() === this.disabledState; }; /** * Sets the toggle button to the specified state. * @param activated Whether the button is activated. */ DisableableToggleActionButton.prototype.setActivated = function (activated) { if (this.isDisabled() && !activated) { this.innerStatefulActionButton.switchTo(this.deactivatedState); } if (!this.isDisabled() && activated !== this.isActivated()) { this.innerStatefulActionButton.switchTo(activated ? this.activatedState : this.deactivatedState); } }; DisableableToggleActionButton.prototype.setEnabled = function (enabled) { if (enabled) { this.enable(); } else { this.disable(); } }; DisableableToggleActionButton.prototype.disable = function () { if (this.isDisabled()) { return; } if (this.isActivated()) { this.innerStatefulActionButton.switchTo(this.deactivatedState); } this.innerStatefulActionButton.switchTo(this.disabledState); }; DisableableToggleActionButton.prototype.enable = function () { if (this.isDisabled()) { this.innerStatefulActionButton.switchTo(this.deactivatedState); } }; DisableableToggleActionButton.prototype.onClick = function () { if (this.isDisabled()) { return; } this.setActivated(!this.isActivated()); if (this.options.click) { this.options.click(); } }; DisableableToggleActionButton.prototype.createInnerButton = function (bindings) { this.deactivatedState = new _ToggleableButton__WEBPACK_IMPORTED_MODULE_2__["ToggleDeactivatedState"](this); this.disabledState = new _DisableableButton__WEBPACK_IMPORTED_MODULE_3__["DisabledState"](this); this.activatedState = new _ToggleableButton__WEBPACK_IMPORTED_MODULE_2__["ToggleActivatedState"](this); this.innerStatefulActionButton = new _StatefulActionButton__WEBPACK_IMPORTED_MODULE_1__["StatefulActionButton"](this.element, { initialState: this.deactivatedState, states: [this.deactivatedState, this.activatedState, this.disabledState], allowedTransitions: [ { from: this.deactivatedState, to: this.disabledState }, { from: this.disabledState, to: this.deactivatedState }, { from: this.deactivatedState, to: this.activatedState }, { from: this.activatedState, to: this.deactivatedState }, ], }, bindings); }; DisableableToggleActionButton.ID = 'DisableableToggleActionButton'; DisableableToggleActionButton.ACTIVATED_CLASS_NAME = 'coveo-toggleactionbutton-activated'; DisableableToggleActionButton.options = __assign(__assign({}, _ToggleActionButton__WEBPACK_IMPORTED_MODULE_4__["ToggleActionButton"].options), { disabledTooltip: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption(), disabledIcon: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption() }); return DisableableToggleActionButton; }(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Component"])); coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Initialization"].registerAutoCreateComponent(DisableableToggleActionButton); /***/ }), /***/ "./src/components/ActionButton/StatefulActionButton.ts": /*!*************************************************************!*\ !*** ./src/components/ActionButton/StatefulActionButton.ts ***! \*************************************************************/ /*! exports provided: StatefulActionButton */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StatefulActionButton", function() { return StatefulActionButton; }); /* harmony import */ var _ActionButton__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ActionButton */ "./src/components/ActionButton/ActionButton.ts"); var __assign = (undefined && undefined.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; /** * An action button able to handle multiple states and their transitions. */ var StatefulActionButton = /** @class */ (function () { function StatefulActionButton(element, options, bindings) { var _a; this.element = element; this.options = options; this.bindings = bindings; var optionsValidity = this.checkOptionsValidity(); if (!optionsValidity.areValid) { console.warn("Cannot render the stateful action button because options are invalid.\n\t" + optionsValidity.errorMessage); return; } this.currentState = this.options.initialState; (_a = this.currentState.onStateEntry) === null || _a === void 0 ? void 0 : _a.apply(this); this.innerActionButton = new _ActionButton__WEBPACK_IMPORTED_MODULE_0__["ActionButton"](element, __assign(__assign({}, this.options.initialState), { click: this.handleClick.bind(this) }), bindings); } /** * Switch the state of the instance if the state and the transition between the current and new state are allowed. * @param state a state to try to switch to */ StatefulActionButton.prototype.switchTo = function (state) { if (this.options.states.indexOf(state) === -1) { console.warn("State '" + state.name + "' does not exist on this StatefulActionButton\nEnsure to use the object references used at the instantiation."); return; } if (!this.isTransitionAllowed(state)) { console.warn("Transition from State '" + this.currentState.name + "' to State '" + state.name + "' is not allowed on this StatefulActionButton.\nEnsure to use the object references used at the instantiation."); return; } var _a = [this.currentState.onStateExit, state.onStateEntry], oldStateExit = _a[0], newStateEntry = _a[1]; this.innerActionButton.updateIcon(state.icon); this.innerActionButton.updateTooltip(state.tooltip); this.currentState = state; oldStateExit === null || oldStateExit === void 0 ? void 0 : oldStateExit.call(this); newStateEntry === null || newStateEntry === void 0 ? void 0 : newStateEntry.call(this); }; /** * Return the current state of the instance. */ StatefulActionButton.prototype.getCurrentState = function () { return this.currentState; }; /** * Check if the options given to the constructor are valid. * If not, it will also display the appropriate warning. */ StatefulActionButton.prototype.checkOptionsValidity = function () { var _a; if (!((_a = this.options.states) === null || _a === void 0 ? void 0 : _a.length)) { return { areValid: false, errorMessage: 'States is not defined or empty.' }; } if (!this.options.initialState) { return { areValid: false, errorMessage: 'InitialState is not defined.' }; } if (this.options.states.indexOf(this.options.initialState) < 0) { return { areValid: false, errorMessage: 'InitialState is not in the list of state.' }; } return !this.options.allowedTransitions ? { areValid: true } : this.areTransitionsValid(); }; StatefulActionButton.prototype.areTransitionsValid = function () { for (var index = 0; index < this.options.allowedTransitions.length; index++) { var transition = this.options.allowedTransitions[index]; if (this.options.states.indexOf(transition.from) === -1) { return { areValid: false, errorMessage: this.generateInvalidTransitionMessage(index, true) }; } if (this.options.states.indexOf(transition.to) === -1) { return { areValid: false, errorMessage: this.generateInvalidTransitionMessage(index, false) }; } } return { areValid: true }; }; StatefulActionButton.prototype.generateInvalidTransitionMessage = function (transitionNumber, isOrigin) { return (isOrigin ? 'Origin' : 'Destination') + " of Transition #" + transitionNumber + " is not in the list of states. Ensure to use the same object reference as in the options.states."; }; /** * Check if a transition from the current state to @param state is allowed. * @param state the destination of the transition */ StatefulActionButton.prototype.isTransitionAllowed = function (state) { var _this = this; if (!this.options.allowedTransitions) { return true; } return this.options.allowedTransitions.some(function (transition) { return transition.from === _this.currentState && transition.to === state; }); }; /** * Handle user click. */ StatefulActionButton.prototype.handleClick = function () { this.currentState.click(); }; StatefulActionButton.ID = 'StatefulActionButton'; return StatefulActionButton; }()); /***/ }), /***/ "./src/components/ActionButton/ToggleActionButton.ts": /*!***********************************************************!*\ !*** ./src/components/ActionButton/ToggleActionButton.ts ***! \***********************************************************/ /*! exports provided: ToggleActionButton */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ToggleActionButton", function() { return ToggleActionButton; }); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! coveo-search-ui */ "coveo-search-ui"); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _ToggleableButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ToggleableButton */ "./src/components/ActionButton/ToggleableButton.ts"); /* harmony import */ var _StatefulActionButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./StatefulActionButton */ "./src/components/ActionButton/StatefulActionButton.ts"); var __extends = (undefined && undefined.__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 (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); var ToggleActionButton = /** @class */ (function (_super) { __extends(ToggleActionButton, _super); function ToggleActionButton(element, options, bindings) { var _this = _super.call(this, element, ToggleActionButton.ID, bindings) || this; _this.element = element; _this.options = options; _this.bindings = bindings; _this.options = coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].initComponentOptions(element, ToggleActionButton, options); _this.createInnerButton(bindings); return _this; } /** * Indicates whether the toggle button is in the activated state. */ ToggleActionButton.prototype.isActivated = function () { return this.innerStatefulActionButton.getCurrentState() === this.activatedState; }; /** * Sets the toggle button to the specified state. * @param activated Whether the button is activated. */ ToggleActionButton.prototype.setActivated = function (activated) { if (activated !== this.isActivated()) { this.innerStatefulActionButton.switchTo(activated ? this.activatedState : this.deactivatedState); } }; ToggleActionButton.prototype.onClick = function () { this.setActivated(!this.isActivated()); if (this.options.click) { this.options.click(); } }; ToggleActionButton.prototype.createInnerButton = function (bindings) { this.deactivatedState = new _ToggleableButton__WEBPACK_IMPORTED_MODULE_1__["ToggleDeactivatedState"](this); this.activatedState = new _ToggleableButton__WEBPACK_IMPORTED_MODULE_1__["ToggleActivatedState"](this); this.innerStatefulActionButton = new _StatefulActionButton__WEBPACK_IMPORTED_MODULE_2__["StatefulActionButton"](this.element, { initialState: this.deactivatedState, states: [this.deactivatedState, this.activatedState], allowedTransitions: [ { from: this.deactivatedState, to: this.activatedState }, { from: this.activatedState, to: this.deactivatedState }, ], }, bindings); }; ToggleActionButton.ID = 'ToggleActionButton'; ToggleActionButton.ACTIVATED_CLASS_NAME = 'coveo-toggleactionbutton-activated'; ToggleActionButton.options = { /** * Specifies the button SVG icon displayed to activate the button. * Note: The SVG markup has to be HTML encoded when set using the HTML attributes. * * Default is the empty string. * * For example, with this SVG markup: * * ```xml * <svg width="1em" height="1em">...</svg> * ``` * * The attribute would be set like this: * * ```html * <button class='CoveoToggleActionButton' data-activate-icon='&lt;svg width=&quot;1em&quot; height=&quot;1em&quot;&gt;...&lt;/svg&gt;'></button> * ``` */ activateIcon: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption({ alias: 'deactivatedIcon' }), /** * Specifies the button tooltip text displayed to activate the button. * * Default is the empty string. * * ```html * <button class='CoveoToggleActionButton' data-activate-tooltip='Activate the feature'></button> * ``` */ activateTooltip: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption({ alias: 'deactivatedTooltip' }), /** * Specifies the button icon displayed to deactivate the button. * * Default is the empty string. * * For example, with this SVG markup: * * ```xml * <svg width="1em" height="1em">...</svg> * ``` * * The attribute would be set like this: * * ```html * <button class='CoveoToggleActionButton' data-deactivate-icon='&lt;svg width=&quot;1em&quot; height=&quot;1em&quot;&gt;...&lt;/svg&gt;'></button> * ``` */ deactivateIcon: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption({ alias: 'activatedIcon' }), /** * Specifies the button tooltip displayed to deactivate the button. * * Default is the empty string. * * ```html * <button class='CoveoToggleActionButton' data-deactivate-tooltip='Deactivate the feature'></button> * ``` */ deactivateTooltip: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildStringOption({ alias: 'activatedTooltip' }), /** * Specifies the handler called when the button is clicked. * * Default is `null`. * * This option is set in JavaScript when initializing the component. */ click: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildCustomOption(function (s) { return null; }), /** * Specifies the handler called when the button is activated. * * Default is `null`. * * This option is set in JavaScript when initializing the component. */ activate: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildCustomOption(function (s) { return null; }), /** * Specifies the handler called when the button is deactivated. * * Default is `null`. * * This option is set in JavaScript when initializing the component. */ deactivate: coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].buildCustomOption(function (s) { return null; }), }; return ToggleActionButton; }(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Component"])); coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["Initialization"].registerAutoCreateComponent(ToggleActionButton); /***/ }), /***/ "./src/components/ActionButton/ToggleableButton.ts": /*!*********************************************************!*\ !*** ./src/components/ActionButton/ToggleableButton.ts ***! \*********************************************************/ /*! exports provided: ToggleDeactivatedState, ToggleActivatedState */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ToggleDeactivatedState", function() { return ToggleDeactivatedState; }); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ToggleActivatedState", function() { return ToggleActivatedState; }); var ToggleDeactivatedState = /** @class */ (function () { function ToggleDeactivatedState(toggleableButton) { this.name = 'ToggleDeactivatedState'; this.icon = toggleableButton.options.activateIcon; this.tooltip = toggleableButton.options.activateTooltip; this.click = function () { return toggleableButton.onClick(); }; } return ToggleDeactivatedState; }()); var ToggleActivatedState = /** @class */ (function () { function ToggleActivatedState(toggleableButton) { this.name = 'ToggleActivatedState'; this.onStateEntry = function () { var _a; this.element.classList.add(ToggleActivatedState.ACTIVATED_CLASS_NAME); this.element.setAttribute('aria-pressed', 'true'); (_a = toggleableButton.options.activate) === null || _a === void 0 ? void 0 : _a.apply(toggleableButton); }; this.onStateExit = function () { var _a; this.element.classList.remove(ToggleActivatedState.ACTIVATED_CLASS_NAME); this.element.setAttribute('aria-pressed', 'false'); (_a = toggleableButton.options.deactivate) === null || _a === void 0 ? void 0 : _a.apply(toggleableButton); }; this.click = function () { return toggleableButton.onClick(); }; this.icon = toggleableButton.options.deactivateIcon; this.tooltip = toggleableButton.options.deactivateTooltip; } ToggleActivatedState.ACTIVATED_CLASS_NAME = 'coveo-toggleactionbutton-activated'; return ToggleActivatedState; }()); /***/ }), /***/ "./src/components/AttachResult/AttachResult.ts": /*!*****************************************************!*\ !*** ./src/components/AttachResult/AttachResult.ts ***! \*****************************************************/ /*! exports provided: AttachResult */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AttachResult", function() { return AttachResult; }); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! coveo-search-ui */ "coveo-search-ui"); /* harmony import */ var coveo_search_ui__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _utils_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../utils/icons */ "./src/utils/icons.ts"); /* harmony import */ var _Events__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Events */ "./src/components/AttachResult/Events.ts"); /* harmony import */ var _Strings__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Strings */ "./src/components/AttachResult/Strings.ts"); var __extends = (undefined && undefined.__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 (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); /** * The AttachResult component allows a user to link a search result to something else in their external * system, for instance a case, incident, request, etc. */ var AttachResult = /** @class */ (function (_super) { __extends(AttachResult, _super); function AttachResult(element, options, bindings, queryResult) { var _this = _super.call(this, element, AttachResult.ID, bindings) || this; _this.element = element; _this.options = options; _this.bindings = bindings; _this.queryResult = queryResult; _this.options = coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["ComponentOptions"].initComponentOptions(element, AttachResult, options); _this.queryResult = _this.queryResult || _this.resolveResult(); _this.initialize(); _this.bind.on(_this.element, 'click', _this.toggleAttached); return _this; } /** * Gets whether or not the result is currently attached. */ AttachResult.prototype.isAttached = function () { return !!this.attached; }; /** * Attach the query result. */ AttachResult.prototype.attach = function () { var _this = this; if (this.attached || this.loading) { return Promise.resolve(); } this.setLoading(true); return this.options .attach(this.queryResult) .then(function () { _this.attached = true; _this.usageAnalytics.logClickEvent(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["analyticsActionCauseList"].caseAttach, {}, _this.queryResult, _this.element); _this.logAnalyticsCaseEvent(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["analyticsActionCauseList"].caseAttach); Coveo.$$(_this.root).trigger(_Events__WEBPACK_IMPORTED_MODULE_2__["AttachResultEvents"].Attach, { queryResult: _this.queryResult }); }) .finally(function () { _this.setLoading(false); }); }; /** * Detach the query result. */ AttachResult.prototype.detach = function () { var _this = this; if (!this.attached && !this.loading) { return Promise.resolve(); } this.setLoading(true); return this.options .detach(this.queryResult) .then(function () { _this.attached = false; _this.logAnalyticsCaseEvent(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["analyticsActionCauseList"].caseDetach); Coveo.$$(_this.root).trigger(_Events__WEBPACK_IMPORTED_MODULE_2__["AttachResultEvents"].Detach, { queryResult: _this.queryResult }); }) .finally(function () { _this.setLoading(false); }); }; /** Toggle the state of the component. If the current result is not attached, attach it, if not, detach it. */ AttachResult.prototype.toggleAttached = function () { this.attached ? this.detach() : this.attach(); }; AttachResult.prototype.initialize = function () { this.buttonElement = Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])('div').el; this.element.appendChild(this.buttonElement); this.tooltipElement = Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])('div', { className: 'coveo-caption-for-icon', }).el; this.element.appendChild(this.tooltipElement); this.updateInitialAttachedState(); }; AttachResult.prototype.updateInitialAttachedState = function () { var _this = this; this.attached = false; this.render(); // Resolve the current result for the component and the initial state. if (this.options.isAttached) { this.setLoading(true); this.options .isAttached(this.queryResult) .then(function (attached) { _this.attached = attached; }) .catch(function (error) { _this.logger.error('Error retrieving initial result attached state.', error); }) .finally(function () { _this.setLoading(false); }); } }; /** Set the loading property and updates the component UI. */ AttachResult.prototype.setLoading = function (loading) { this.loading = loading; this.render(); }; AttachResult.prototype.logAnalyticsCaseEvent = function (cause) { var customData = { resultUriHash: this.queryResult.raw.urihash, author: this.queryResult.raw.author, articleID: this.queryResult.raw[this.options.articleIdField], caseID: this.options.caseId, }; this.usageAnalytics.logCustomEvent(cause, customData, this.element, this.queryResult); }; AttachResult.prototype.render = function () { Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])(this.buttonElement).removeClass('coveo-icon-attached'); Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])(this.buttonElement).removeClass('coveo-icon-attach'); Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])(this.buttonElement).removeClass('coveo-icon-loading'); if (this.loading) { Object(coveo_search_ui__WEBPACK_IMPORTED_MODULE_0__["$$"])(this.buttonElement).addClass('coveo-icon-loading'); this.buttonElement.innerHTML = _utils_icons__WEBPACK_IMPORTED_MODULE_1__["wait"]; } else { this.buttonElement.innerHTML = _utils_icons__WEBPACK_IMPORTED_MODULE_1__["paperclipIcon"]; if (this.at