@orfeas126/box-ui-elements
Version:
Box UI Elements
3,239 lines • 145 kB
JavaScript
/*!
* Box UI Element
*
* Copyright 2019 Box, Inc. All rights reserved.
*
* This product includes software developed by Box, Inc. ("Box")
* (http://www.box.com)
*
* ALL BOX SOFTWARE IS PROVIDED "AS IS" AND ANY EXPRESS OR IMPLIED
* WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED.
* IN NO EVENT SHALL BOX BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
* LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
* DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
* THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*
* See the Box license for the specific language governing permissions
* and limitations under the license.
*/
(globalThis["webpackChunk_orfeas126_box_ui_elements"] = globalThis["webpackChunk_orfeas126_box_ui_elements"] || []).push([["skills-sidebar"],{
/***/ "./src/components/pill-cloud/PillCloud.js":
/*!************************************************!*\
!*** ./src/components/pill-cloud/PillCloud.js ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var lodash_isEqual__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/isEqual */ "./node_modules/lodash/isEqual.js");
/* harmony import */ var lodash_isEqual__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_isEqual__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./src/components/button/index.ts");
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const PillCloud = ({
options,
onSelect,
selectedOptions = [],
buttonProps = {}
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "bdl-PillCloud pill-cloud-container"
}, options && options.map(option => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_button__WEBPACK_IMPORTED_MODULE_3__["default"], _extends({
key: option.value,
className: classnames__WEBPACK_IMPORTED_MODULE_1___default()('bdl-Pill', 'bdl-PillCloud-button', 'pill', 'pill-cloud-button', {
'is-selected': selectedOptions.find(op => lodash_isEqual__WEBPACK_IMPORTED_MODULE_2___default()(op, option))
}),
onClick: onSelect ? () => onSelect(option) : undefined,
"data-resin-target": option.value
}, buttonProps), option.displayText)));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PillCloud);
/***/ }),
/***/ "./src/components/primary-button/PrimaryButton.tsx":
/*!*********************************************************!*\
!*** ./src/components/primary-button/PrimaryButton.tsx ***!
\*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _button_Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button/Button */ "./src/components/button/Button.tsx");
const _excluded = ["children", "className"];
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
const PrimaryButton = _ref => {
let {
children,
className = ''
} = _ref,
rest = _objectWithoutProperties(_ref, _excluded);
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_button_Button__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({
className: `btn-primary ${className}`
}, rest), children);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PrimaryButton);
/***/ }),
/***/ "./src/elements/content-sidebar/SkillsSidebar.js":
/*!*******************************************************!*\
!*** ./src/elements/content-sidebar/SkillsSidebar.js ***!
\*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ SkillsSidebarComponent: () => (/* binding */ SkillsSidebar),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var lodash_flow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/flow */ "./node_modules/lodash/flow.js");
/* harmony import */ var lodash_flow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_flow__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/get */ "./node_modules/lodash/get.js");
/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! lodash/noop */ "./node_modules/lodash/noop.js");
/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(lodash_noop__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var _api__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../api */ "./src/api/index.js");
/* harmony import */ var _components_loading_indicator_LoadingIndicator__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/loading-indicator/LoadingIndicator */ "./src/components/loading-indicator/LoadingIndicator.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _SidebarContent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./SidebarContent */ "./src/elements/content-sidebar/SidebarContent.js");
/* harmony import */ var _skills_SidebarSkills__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./skills/SidebarSkills */ "./src/elements/content-sidebar/skills/SidebarSkills.js");
/* harmony import */ var _common_logger_constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../common/logger/constants */ "./src/elements/common/logger/constants.js");
/* harmony import */ var _utils_performance__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../utils/performance */ "./src/utils/performance.js");
/* harmony import */ var _common_api_context__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../common/api-context */ "./src/elements/common/api-context/index.js");
/* harmony import */ var _common_error_boundary__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../common/error-boundary */ "./src/elements/common/error-boundary/index.js");
/* harmony import */ var _common_logger__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../common/logger */ "./src/elements/common/logger/index.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../constants */ "./src/constants.js");
/* harmony import */ var _SkillsSidebar_scss__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./SkillsSidebar.scss */ "./src/elements/content-sidebar/SkillsSidebar.scss");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file Skills sidebar component
* @author Box
*/
const MARK_NAME_JS_READY = `${_constants__WEBPACK_IMPORTED_MODULE_14__.ORIGIN_SKILLS_SIDEBAR}_${_common_logger_constants__WEBPACK_IMPORTED_MODULE_9__.EVENT_JS_READY}`;
(0,_utils_performance__WEBPACK_IMPORTED_MODULE_10__.mark)(MARK_NAME_JS_READY);
class SkillsSidebar extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
constructor(props) {
super(props);
_defineProperty(this, "state", {
errors: {}
});
/**
* Handles skills fetch success
*
* @private
* @param {Array<SkillCard>} cards - Skills cards
* @return {void}
*/
_defineProperty(this, "fetchSkillsSuccessCallback", cards => {
this.updatePreviewTranscript(cards);
this.setState({
cards
});
});
/**
* Updates Preview with transcript data
*
* @private
* @param {Array<SkillCard>} cards - Skills cards
* @return {void}
*/
_defineProperty(this, "updatePreviewTranscript", cards => {
const {
getPreview,
getViewer
} = this.props;
const preview = getPreview ? getPreview() : null;
const viewer = getViewer ? getViewer() : null;
const transcriptCard = cards.find(card => card.skill_card_type === _constants__WEBPACK_IMPORTED_MODULE_14__.SKILLS_TRANSCRIPT);
if (!transcriptCard || !preview) {
return;
}
if (!viewer) {
preview.addListener('load', ({
viewer: loadedViewer
}) => {
if (typeof loadedViewer.loadAutoGeneratedCaptions === 'function') {
loadedViewer.loadAutoGeneratedCaptions(transcriptCard);
}
});
} else if (typeof viewer.loadAutoGeneratedCaptions === 'function') {
viewer.loadAutoGeneratedCaptions(transcriptCard);
}
});
/**
* Success handler for save
*
* @private
* @param {Array} updatedCards - updated skill cards
* @param {number} index - index of the card being edited
* @return {void}
*/
_defineProperty(this, "onSaveSuccessHandler", (index, updatedCards) => {
const {
errors
} = this.state;
const clone = _objectSpread({}, errors);
delete clone[index];
this.updatePreviewTranscript(updatedCards);
this.setState({
cards: updatedCards,
errors: clone
});
});
/**
* Error handler for save
*
* @private
* @param {number} index - index of the card being edited
* @return {void}
*/
_defineProperty(this, "onSaveErrorHandler", index => {
const {
errors
} = this.state;
const clone = _objectSpread({}, errors);
clone[index] = true;
this.setState({
errors: clone
});
});
/**
* Updates skill metadata
*
* @private
* @param {number} index - index of the card being edited
* @param {Array} removes - entries to remove
* @param {Array} adds - entries to add
* @param {Array} replaces - entries to replace
* @return {void}
*/
_defineProperty(this, "onSave", (index, removes = [], adds = [], replaces = []) => {
const {
api,
file
} = this.props;
const {
cards = []
} = this.state;
const card = cards[index];
const path = `/cards/${index}`;
const ops = [];
const canEdit = lodash_get__WEBPACK_IMPORTED_MODULE_2___default()(file, _constants__WEBPACK_IMPORTED_MODULE_14__.FIELD_PERMISSIONS_CAN_UPLOAD, false);
if (!canEdit || !card) {
return;
}
if (Array.isArray(replaces)) {
replaces.forEach(({
replaced,
replacement
}) => {
const idx = card.entries.findIndex(entry => entry === replaced);
if (idx > -1) {
ops.push({
op: 'replace',
path: `${path}/entries/${idx}`,
value: replacement
});
}
});
}
if (Array.isArray(removes)) {
const deletes = [];
removes.forEach(removed => {
const idx = card.entries.findIndex(entry => entry === removed);
if (idx > -1) {
deletes.push(idx);
}
});
// To maintain metadata index positions, removes should be
// done is reverse order with largest index being removed first.
// Remove operations are atomic and don't happen in batch.
deletes.sort((a, b) => b - a) // number sort in descending order
.forEach(idx => {
ops.push({
op: 'remove',
path: `${path}/entries/${idx}`
});
});
}
if (Array.isArray(adds)) {
adds.forEach(added => {
ops.push({
op: 'add',
path: `${path}/entries/-`,
value: added
});
});
}
// If no ops, don't proceed
if (ops.length === 0) {
return;
}
// Add test ops before any other ops
ops.splice(0, 0, {
op: 'test',
path,
value: card
});
api.getMetadataAPI(false).updateSkills(file, ops, updatedCards => {
this.onSaveSuccessHandler(index, updatedCards);
}, () => {
this.onSaveErrorHandler(index);
});
});
const {
logger
} = this.props;
logger.onReadyMetric({
endMarkName: MARK_NAME_JS_READY
});
}
componentDidMount() {
const {
api,
file
} = this.props;
api.getMetadataAPI(false).getSkills(file, this.fetchSkillsSuccessCallback, (lodash_noop__WEBPACK_IMPORTED_MODULE_3___default()));
}
componentDidUpdate({
refreshIdentity: prevRefreshIdentity
}) {
const {
api,
file,
refreshIdentity
} = this.props;
if (refreshIdentity !== prevRefreshIdentity) {
api.getMetadataAPI(false).getSkills(file, this.fetchSkillsSuccessCallback, (lodash_noop__WEBPACK_IMPORTED_MODULE_3___default()));
}
}
render() {
const {
file,
getViewer,
elementId
} = this.props;
const {
cards,
errors
} = this.state;
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SidebarContent__WEBPACK_IMPORTED_MODULE_7__["default"], {
className: "bcs-skills",
elementId: elementId,
sidebarView: _constants__WEBPACK_IMPORTED_MODULE_14__.SIDEBAR_VIEW_SKILLS,
title: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_16__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_6__["default"].sidebarSkillsTitle)
}, cards ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_skills_SidebarSkills__WEBPACK_IMPORTED_MODULE_8__["default"], {
cards: cards,
errors: errors,
file: file,
getViewer: getViewer,
onSkillChange: this.onSave
}) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_loading_indicator_LoadingIndicator__WEBPACK_IMPORTED_MODULE_5__["default"], null));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (lodash_flow__WEBPACK_IMPORTED_MODULE_1___default()([(0,_common_logger__WEBPACK_IMPORTED_MODULE_13__.withLogger)(_constants__WEBPACK_IMPORTED_MODULE_14__.ORIGIN_SKILLS_SIDEBAR), (0,_common_error_boundary__WEBPACK_IMPORTED_MODULE_12__.withErrorBoundary)(_constants__WEBPACK_IMPORTED_MODULE_14__.ORIGIN_SKILLS_SIDEBAR), _common_api_context__WEBPACK_IMPORTED_MODULE_11__.withAPIContext])(SkillsSidebar));
/***/ }),
/***/ "./src/elements/content-sidebar/skills/SidebarSkills.js":
/*!**************************************************************!*\
!*** ./src/elements/content-sidebar/skills/SidebarSkills.js ***!
\**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var lodash_uniqueId__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/uniqueId */ "./node_modules/lodash/uniqueId.js");
/* harmony import */ var lodash_uniqueId__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_uniqueId__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _SidebarSection__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../SidebarSection */ "./src/elements/content-sidebar/SidebarSection.js");
/* harmony import */ var _skillUtils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./skillUtils */ "./src/elements/content-sidebar/skills/skillUtils.js");
/* harmony import */ var _SidebarSkillsCard__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./SidebarSkillsCard */ "./src/elements/content-sidebar/skills/SidebarSkillsCard.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../constants */ "./src/constants.js");
/**
*
* @file Details sidebar component
* @author Box
*/
/**
* Get ths skill interaction target based on card type
*
* @param {Object} card - skill card
* @return {string} - interaction target
*/
const getCardInteractionTarget = ({
skill_card_type
}) => {
switch (skill_card_type) {
case _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_KEYWORD:
return _common_interactionTargets__WEBPACK_IMPORTED_MODULE_3__.SKILLS_TARGETS.KEYWORDS.CARD;
case _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_FACE:
case _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_TIMELINE:
return _common_interactionTargets__WEBPACK_IMPORTED_MODULE_3__.SKILLS_TARGETS.FACES.CARD;
case _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_TRANSCRIPT:
return _common_interactionTargets__WEBPACK_IMPORTED_MODULE_3__.SKILLS_TARGETS.TRANSCRIPTS.CARD;
default:
return '';
}
};
/**
* Get ths string skill title based on card title
*
* @param {Object} card - skill card
* @return {string} - skill title
*/
const getCardTitle = ({
skill_card_type,
skill_card_title = {}
}) => {
const {
code,
message
} = skill_card_title;
const defaultKey = `${skill_card_type}Skill`;
const defaultMessage = _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"][defaultKey] || _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].defaultSkill;
switch (code) {
case 'skills_faces':
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].faceSkill);
case 'skills_transcript':
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].transcriptSkill);
case 'skills_topics':
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].topicsSkill);
case 'skills_status':
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].statusSkill);
case 'skills_error':
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_2__["default"].error);
default:
return message || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], defaultMessage);
}
};
const SidebarSkills = ({
file,
cards,
errors,
getViewer,
onSkillChange
}) => {
const {
permissions = {}
} = file;
const isSkillEditable = !!permissions.can_upload;
return cards.map((card, index) => {
if (card.error && !card.status) {
card.skill_card_type = _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_STATUS;
card.status = {
code: _constants__WEBPACK_IMPORTED_MODULE_7__.SKILLS_ERROR_UNKNOWN
};
delete card.error;
}
const {
id
} = card;
const cardId = id || lodash_uniqueId__WEBPACK_IMPORTED_MODULE_1___default()('card_');
const isValid = (0,_skillUtils__WEBPACK_IMPORTED_MODULE_5__.isValidSkillsCard)(file, card);
const interactionTarget = getCardInteractionTarget(card);
const title = getCardTitle(card);
const hasEntries = Array.isArray(card.entries) ? card.entries.length > 0 : isValid;
return isValid ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SidebarSection__WEBPACK_IMPORTED_MODULE_4__["default"], {
key: cardId,
interactionTarget: interactionTarget,
isOpen: hasEntries,
title: title
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SidebarSkillsCard__WEBPACK_IMPORTED_MODULE_6__["default"], {
card: card,
cards: cards,
getViewer: getViewer,
hasError: !!errors[index],
isEditable: isSkillEditable,
onSkillChange: (...args) => onSkillChange(index, ...args)
})) : null;
});
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SidebarSkills);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/SidebarSkillsCard.js":
/*!******************************************************************!*\
!*** ./src/elements/content-sidebar/skills/SidebarSkillsCard.js ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _status__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./status */ "./src/elements/content-sidebar/skills/status/index.js");
/* harmony import */ var _transcript__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./transcript */ "./src/elements/content-sidebar/skills/transcript/index.js");
/* harmony import */ var _keywords__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./keywords */ "./src/elements/content-sidebar/skills/keywords/index.js");
/* harmony import */ var _faces__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./faces */ "./src/elements/content-sidebar/skills/faces/index.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../constants */ "./src/constants.js");
/**
*
* @file Skills card component
* @author Box
*/
const SidebarSkillsCard = ({
card,
cards,
hasError,
isEditable,
onSkillChange,
getViewer
}) => {
switch (card.skill_card_type) {
case _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_KEYWORD:
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_keywords__WEBPACK_IMPORTED_MODULE_3__["default"], {
card: card,
getViewer: getViewer,
hasError: hasError,
isEditable: isEditable,
onSkillChange: onSkillChange,
transcript: isEditable ? cards.find(({
skill_card_type
}) => skill_card_type === _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TRANSCRIPT) : undefined
});
case _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TIMELINE:
case _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_FACE:
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_faces__WEBPACK_IMPORTED_MODULE_4__["default"], {
card: card,
getViewer: getViewer,
hasError: hasError,
isEditable: isEditable,
onSkillChange: onSkillChange
});
case _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TRANSCRIPT:
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_transcript__WEBPACK_IMPORTED_MODULE_2__["default"], {
card: card,
getViewer: getViewer,
hasError: hasError,
isEditable: isEditable,
onSkillChange: onSkillChange
});
case _constants__WEBPACK_IMPORTED_MODULE_5__.SKILLS_STATUS:
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_status__WEBPACK_IMPORTED_MODULE_1__["default"], {
card: card
});
default:
return null;
}
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SidebarSkillsCard);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/faces/Face.js":
/*!***********************************************************!*\
!*** ./src/elements/content-sidebar/skills/faces/Face.js ***!
\***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _icons_general_IconClose__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../icons/general/IconClose */ "./src/icons/general/IconClose.tsx");
/* harmony import */ var _icons_general_IconMinus__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../icons/general/IconMinus */ "./src/icons/general/IconMinus.tsx");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../constants */ "./src/constants.js");
/* harmony import */ var _Face_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Face.scss */ "./src/elements/content-sidebar/skills/faces/Face.scss");
/**
*
* @file File Keywords SkillCard component
* @author Box
*/
const Face = ({
face,
selected,
isEditing,
onDelete,
onSelect
}) => {
const isAnyFaceSelected = !!selected;
const isCurrentFaceSelected = face === selected;
const isFaceSelected = isAnyFaceSelected && isCurrentFaceSelected && !isEditing;
const faceClassName = classnames__WEBPACK_IMPORTED_MODULE_1___default()('be-face-wrapper', {
'be-face-unselected': !isEditing && isAnyFaceSelected && !isCurrentFaceSelected
});
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: faceClassName
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: "be-face",
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.FACES.FACE,
onClick: () => !isEditing && onSelect(face),
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("img", {
alt: face.text,
src: face.image_url,
title: face.text
}), isFaceSelected && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconMinus__WEBPACK_IMPORTED_MODULE_4__["default"], {
color: _constants__WEBPACK_IMPORTED_MODULE_6__.COLOR_WHITE
})), isEditing && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: "be-face-delete",
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.FACES.DELETE,
onClick: () => onDelete(face),
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconClose__WEBPACK_IMPORTED_MODULE_3__["default"], {
color: _constants__WEBPACK_IMPORTED_MODULE_6__.COLOR_999,
height: 16,
width: 16
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Face);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/faces/Faces.js":
/*!************************************************************!*\
!*** ./src/elements/content-sidebar/skills/faces/Faces.js ***!
\************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../components/primary-button/PrimaryButton */ "./src/components/primary-button/PrimaryButton.tsx");
/* harmony import */ var _components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../components/loading-indicator/LoadingIndicatorWrapper */ "./src/components/loading-indicator/LoadingIndicatorWrapper.tsx");
/* harmony import */ var _components_inline_error_InlineError__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../components/inline-error/InlineError */ "./src/components/inline-error/InlineError.js");
/* harmony import */ var _components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../components/tooltip/Tooltip */ "./src/components/tooltip/Tooltip.tsx");
/* harmony import */ var _components_button_Button__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../components/button/Button */ "./src/components/button/Button.tsx");
/* harmony import */ var _icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../icons/general/IconEdit */ "./src/icons/general/IconEdit.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _Face__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Face */ "./src/elements/content-sidebar/skills/faces/Face.js");
/* harmony import */ var _timeline__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../timeline */ "./src/elements/content-sidebar/skills/timeline/index.js");
/* harmony import */ var _Faces_scss__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Faces.scss */ "./src/elements/content-sidebar/skills/faces/Faces.scss");
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file Faces Skill Card component
* @author Box
*/
class Faces extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
/**
* [constructor]
*
* @public
* @return {Faces}
*/
constructor(props) {
super(props);
/**
* Toggles the edit mode
*
* @private
* @return {void}
*/
_defineProperty(this, "toggleIsEditing", () => {
this.setState(prevState => ({
isEditing: !prevState.isEditing
}));
});
/**
* Toggles face selection
*
* @private
* @return {void}
*/
_defineProperty(this, "onSelect", face => {
const {
selected
} = this.state;
this.setState({
selected: selected === face ? undefined : face
});
});
/**
* Deletes a face
*
* @private
* @return {void}
*/
_defineProperty(this, "onDelete", face => {
const {
removes
} = this.state;
removes.push(face);
this.setState({
removes: removes.slice(0)
});
});
/**
* Saves the new card data
*
* @private
* @return {void}
*/
_defineProperty(this, "onSave", () => {
const {
onSkillChange
} = this.props;
const {
removes
} = this.state;
this.toggleIsEditing();
if (removes.length > 0) {
this.setState({
isLoading: true
});
onSkillChange(removes);
}
});
/**
* Cancels editing
*
* @private
* @return {void}
*/
_defineProperty(this, "onCancel", () => {
this.resetState(this.props);
});
this.state = {
faces: props.card.entries,
removes: [],
isEditing: props.hasError,
hasError: props.hasError,
isLoading: false
};
}
/**
* Helper to reset the state
*
* @private
* @param {Object} props - component props
* @return {void}
*/
resetState(props) {
this.setState({
faces: props.card.entries,
removes: [],
isEditing: false,
selected: undefined,
hasError: false,
isLoading: false
});
}
/**
* Renders the faces
*
* @private
* @return {void}
*/
render() {
const {
card,
isEditable,
getViewer
} = this.props;
const {
selected,
faces,
removes,
isEditing,
hasError,
isLoading
} = this.state;
const {
duration
} = card;
const hasFaces = faces.length > 0;
const entries = faces.filter(face => !removes.includes(face));
const editClassName = classnames__WEBPACK_IMPORTED_MODULE_1___default()('be-face-edit', {
'be-faces-is-editing': isEditing
});
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_4__["default"], {
className: "be-faces",
isLoading: isLoading
}, hasFaces && isEditable && !isLoading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_6__["default"], {
text: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].editLabel)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: editClassName,
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_10__.SKILLS_TARGETS.FACES.EDIT,
onClick: this.toggleIsEditing,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_8__["default"], null))), hasError && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_inline_error_InlineError__WEBPACK_IMPORTED_MODULE_5__["default"], {
title: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].sidebarSkillsErrorTitle)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].sidebarSkillsErrorContent)), hasFaces ? entries.map((face, index) =>
/*#__PURE__*/
/* eslint-disable react/no-array-index-key */
react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Face__WEBPACK_IMPORTED_MODULE_11__["default"], {
key: index,
face: face,
isEditing: isEditing,
onDelete: this.onDelete,
onSelect: this.onSelect,
selected: selected
})
/* eslint-enable react/no-array-index-key */) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].skillNoInfoFoundError), !!selected && !isEditing && Array.isArray(selected.appears) && selected.appears.length > 0 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_timeline__WEBPACK_IMPORTED_MODULE_12__["default"], {
duration: duration,
getViewer: getViewer,
interactionTarget: _common_interactionTargets__WEBPACK_IMPORTED_MODULE_10__.SKILLS_TARGETS.FACES.TIMELINE,
timeslices: selected.appears
}), isEditing && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-faces-buttons"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_button_Button__WEBPACK_IMPORTED_MODULE_7__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_10__.SKILLS_TARGETS.FACES.EDIT_CANCEL,
onClick: this.onCancel,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].cancel)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_3__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_10__.SKILLS_TARGETS.FACES.EDIT_SAVE,
onClick: this.onSave,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_14__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_9__["default"].save))));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Faces);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/faces/index.js":
/*!************************************************************!*\
!*** ./src/elements/content-sidebar/skills/faces/index.js ***!
\************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* reexport safe */ _Faces__WEBPACK_IMPORTED_MODULE_0__["default"])
/* harmony export */ });
/* harmony import */ var _Faces__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Faces */ "./src/elements/content-sidebar/skills/faces/Faces.js");
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/EditableKeywords.js":
/*!**************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/EditableKeywords.js ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var _components_pill_selector_dropdown_PillSelector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/pill-selector-dropdown/PillSelector */ "./src/components/pill-selector-dropdown/PillSelector.js");
/* harmony import */ var _components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../components/primary-button/PrimaryButton */ "./src/components/primary-button/PrimaryButton.tsx");
/* harmony import */ var _components_button_Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../components/button/Button */ "./src/components/button/Button.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _keywordUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./keywordUtils */ "./src/elements/content-sidebar/skills/keywords/keywordUtils.js");
/* harmony import */ var _EditableKeywords_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./EditableKeywords.scss */ "./src/elements/content-sidebar/skills/keywords/EditableKeywords.scss");
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file Editable Skill Keywords card component
* @author Box
*/
class EditableKeywords extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
/**
* [constructor]
*
* @public
* @return {EditableKeywords}
*/
constructor(props) {
super(props);
/**
* Called when keywords gets new properties.
* Should reset to original state.
*
* @private
* @param {Object} option - pill
* @param {number} index - pill index
* @return {void}
*/
_defineProperty(this, "onRemove", (option, index) => {
// eslint-disable-line
const {
onDelete,
keywords
} = this.props;
onDelete(keywords[index]);
});
/**
* When pressing enter in the pill input box
*
* @private
* @param {Event} event - keyboard event
* @return {void}
*/
_defineProperty(this, "onKeyDown", ({
key
}) => {
if (key === 'Enter' && !this.state.isInCompositionMode) {
this.onBlur();
}
});
/**
* Called when pill selector is blurred.
* Adds a new pill if needed.
*
* @private
* @return {void}
*/
_defineProperty(this, "onBlur", () => {
const {
onAdd
} = this.props;
const {
keyword
} = this.state;
if (keyword) {
onAdd({
type: 'text',
text: keyword
});
}
});
/**
* Enables composition mode.
*
* @private
* @return {void}
*/
_defineProperty(this, "onCompositionStart", () => {
this.setState({
isInCompositionMode: true
});
});
/**
* Disables composition mode.
*
* @private
* @return {void}
*/
_defineProperty(this, "onCompositionEnd", () => {
this.setState({
isInCompositionMode: false
});
});
/**
* Called when pill selector gets new input value.
*
* @private
* @return {void}
*/
_defineProperty(this, "onInput", event => {
const currentTarget = event.currentTarget;
this.setState({
keyword: currentTarget.value
});
});
this.state = {
pills: (0,_keywordUtils__WEBPACK_IMPORTED_MODULE_6__["default"])(props.keywords),
keyword: '',
isInCompositionMode: false
};
}
/**
* Called when keywords gets new properties.
* Should reset to original state.
*
* @private
* @param {Object} nextProps - component props
* @return {void}
*/
componentDidUpdate({
keywords: prevKeywords
}) {
const {
keywords
} = this.props;
if (prevKeywords !== keywords) {
this.setState({
pills: (0,_keywordUtils__WEBPACK_IMPORTED_MODULE_6__["default"])(keywords),
keyword: ''
});
}
}
/**
* Renders the keywords
*
* @private
* @return {void}
*/
render() {
const {
onSave,
onCancel
} = this.props;
const {
pills,
keyword
} = this.state;
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("span", {
className: "bdl-EditableKeywords"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_pill_selector_dropdown_PillSelector__WEBPACK_IMPORTED_MODULE_1__["default"], {
onBlur: this.onBlur,
onCompositionEnd: this.onCompositionEnd,
onCompositionStart: this.onCompositionStart,
onInput: this.onInput,
onKeyDown: this.onKeyDown,
onPaste: this.onInput,
onRemove: this.onRemove,
selectedOptions: pills,
value: keyword
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-keywords-buttons"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_button_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.KEYWORDS.EDIT_CANCEL,
onClick: onCancel,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_4__["default"].cancel)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_2__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.KEYWORDS.EDIT_SAVE,
onClick: onSave,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_8__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_4__["default"].save))));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditableKeywords);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/Keywords.js":
/*!******************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/Keywords.js ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../icons/general/IconEdit */ "./src/icons/general/IconEdit.tsx");
/* harmony import */ var _components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../components/loading-indicator/LoadingIndicatorWrapper */ "./src/components/loading-indicator/LoadingIndicatorWrapper.tsx");
/* harmony import */ var _components_inline_error_InlineError__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../components/inline-error/InlineError */ "./src/components/inline-error/InlineError.js");
/* harmony import */ var _components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../components/tooltip/Tooltip */ "./src/components/tooltip/Tooltip.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _EditableKeywords__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./EditableKeywords */ "./src/elements/content-sidebar/skills/keywords/EditableKeywords.js");
/* harmony import */ var _ReadOnlyKeywords__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./ReadOnlyKeywords */ "./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.js");
/* harmony import */ var _Keywords_scss__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Keywords.scss */ "./src/elements/content-sidebar/skills/keywords/Keywords.scss");
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file File Keywords SkillCard component
* @author Box
*/
class Keywords extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
/**
* [constructor]
*
* @public
* @return {Keywords}
*/
constructor(props) {
super(props);
/**
* Toggles the edit mode
*
* @private
* @return {void}
*/
_defineProperty(this, "toggleIsEditing", () => {
this.setState(prevState => ({
isEditing: !prevState.isEditing
}));
});
/**
* Adds a new keyword.
* Iterates over the transcript to find locations
*
* @private
* @return {void}
*/
_defineProperty(this, "onAdd", keyword => {
const {
transcript
} = this.props;
const {
adds
} = this.state;
const locations = [];
const regex = new RegExp(`\\b${keyword.text}\\b`, 'i');
if (transcript && Array.isArray(transcript.entries)) {
transcript.entries.forEach(({
text,
appears
}) => {
if (text && regex.test(text) && Array.isArray(appears) && appears.length > 0) {
locations.push(appears[0]);
}
});
}
keyword.appears = locations;
adds.push(keyword);
this.setState({
adds: adds.slice(0)
});
});
/**
* Deletes a keyword
*
* @private
* @return {void}
*/
_defineProperty(this, "onDelete", keyword => {
const {
adds,
removes
} = this.state;
const addedIndex = adds.findIndex(added => added === keyword);
if (addedIndex > -1) {
adds.splice(addedIndex, 1);
this.setState({
adds: adds.slice(0)
});
} else {
removes.push(keyword);
this.setState({
removes: removes.slice(0)
});
}
});
/**
* Saves the new card data
*
* @private
* @return {void}
*/
_defineProperty(this, "onSave", () => {
const {
onSkillChange
} = this.props;
const {
removes,
adds
} = this.state;
this.toggleIsEditing();
if (removes.length > 0 || adds.length > 0) {
this.setState({
isLoading: true
});
onSkillChange(removes, adds);
}
});
/**
* Cancels editing
*
* @private
* @return {void}
*/
_defineProperty(this, "onCancel", () => {
this.resetState(this.props);
});
this.state = {
keywords: props.card.entries,
adds: [],
removes: [],
isEditing: props.hasError,
hasError: props.hasError,
isLoading: false
};
}
/**
* Helper to reset the state
*
* @private
* @param {Object} props - component props
* @return {void}
*/
resetState(props) {
this.setState({
keywords: props.card.entries,
adds: [],
removes: [],
isEditing: false,
hasError: false,
isLoading: false
});
}
/**
* Renders the keywords
*
* @private
* @return {void}
*/
render() {
const {
card,
getViewer,
isEditable
} = this.props;
const {
duration
} = card;
const {
isEditing,
isLoading,
hasError,
keywords,
removes,
adds
} = this.state;
const hasKeywords = keywords.length > 0;
const entries = keywords.filter(face => !removes.includes(face)).concat(adds);
const editClassName = classnames__WEBPACK_IMPORTED_MODULE_1___default()('be-keyword-edit', {
'be-keyword-is-editing': isEditing
});
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_4__["default"], {
className: "be-keywords",
isLoading: isLoading
}, hasKeywords && isEditable && !isLoading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_6__["default"], {
text: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_12__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_7__["default"].editLabel)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: editClassName,
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_8__.SKILLS_TARGETS.KEYWORDS.EDIT,
onClick: this.toggleIsEditing,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_3__["default"], null))), hasError && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_inline_error_InlineError__WEBPACK_IMPORTED_MODULE_5__["default"], {
title: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_12__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_7__["default"].sidebarSkillsErrorTitle)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_12__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_7__["default"].sidebarSkillsErrorContent)), isEditing && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_EditableKeywords__WEBPACK_IMPORTED_MODULE_9__["default"], {
keywords: entries,
onAdd: this.onAdd,
onCancel: this.onCancel,
onDelete: this.onDelete,
onSave: this.onSave
}), !isEditing && hasKeywords && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ReadOnlyKeywords__WEBPACK_IMPORTED_MODULE_10__["default"], {
duration: duration,
getViewer: getViewer,
keywords: entries
}), !isEditing && !hasKeywords && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_12__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_7__["default"].skillNoInfoFoundError));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Keywords);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.js":
/*!**************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.js ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _components_pill_cloud_PillCloud__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/pill-cloud/PillCloud */ "./src/components/pill-cloud/PillCloud.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _timeline__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../timeline */ "./src/elements/content-sidebar/skills/timeline/index.js");
/* harmony import */ var _keywordUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./keywordUtils */ "./src/elements/content-sidebar/skills/keywords/keywordUtils.js");
/* harmony import */ var _ReadOnlyKeywords_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ReadOnlyKeywords.scss */ "./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.scss");
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file Read Only Keywords Card component
* @author Box
*/
class ReadOnlyselecteds extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
constructor(...args) {
super(...args);
_defineProperty(this, "state", {
selectedIndex: -1
});
/**
* Shows the time line by selecting the keyword
*
* @private
* @param {Object} pill - keyword
* @return {void}
*/
_defineProperty(this, "onSelect", pill => {
const {
selectedIndex
} = this.state;
const newIndex = pill.value;
this.setState({
selectedIndex: selectedIndex === newIndex ? -1 : newIndex
});
});
}
/**
* Renders the keywords
*
* @private
* @return {void}
*/
render() {
const {
keywords,
getViewer,
duration
} = this.props;
const {
selectedIndex
} = this.state;
const options = (0,_keywordUtils__WEBPACK_IMPORTED_MODULE_4__["default"])(keywords);
const selected = keywords[selectedIndex];
const pillCloudProps = selected ? {
selectedOptions: [options[selectedIndex]]
} : {};
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_pill_cloud_PillCloud__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({
onSelect: this.onSelect,
options: options
}, pillCloudProps, {
buttonProps: {
[_common_interactionTargets__WEBPACK_IMPORTED_MODULE_2__.INTERACTION_TARGET]: _common_interactionTargets__WEBPACK_IMPORTED_MODULE_2__.SKILLS_TARGETS.KEYWORDS.SELECT
}
})), !!selected && Array.isArray(selected.appears) && selected.appears.length > 0 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_timeline__WEBPACK_IMPORTED_MODULE_3__["default"], {
duration: duration,
getViewer: getViewer,
interactionTarget: _common_interactionTargets__WEBPACK_IMPORTED_MODULE_2__.SKILLS_TARGETS.KEYWORDS.TIMELINE,
text: selected.text,
timeslices: selected.appears
}));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadOnlyselecteds);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/index.js":
/*!***************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/index.js ***!
\***************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* reexport safe */ _Keywords__WEBPACK_IMPORTED_MODULE_0__["default"])
/* harmony export */ });
/* harmony import */ var _Keywords__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Keywords */ "./src/elements/content-sidebar/skills/keywords/Keywords.js");
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/keywordUtils.js":
/*!**********************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/keywordUtils.js ***!
\**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/**
*
* @file Utilities for keywords skill
* @author Box
*/
/**
* Converts skill card entries into pills
*
* @private
* @param {Array<Object>} props - keyword entries
* @return {Array<Object>} pills
*/
const getPills = (keywords = []) => keywords.map((keyword, index) => ({
displayText: keyword.text,
value: index
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (getPills);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/status/Status.js":
/*!**************************************************************!*\
!*** ./src/elements/content-sidebar/skills/status/Status.js ***!
\**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../constants */ "./src/constants.js");
/**
*
* @file Status Skill Card component
* @author Box
*/
const Status = ({
card
}) => {
const {
status = {}
} = card;
const {
code,
message
} = status;
let localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillUnknownError;
switch (code) {
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_INVALID_FILE_SIZE:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillInvalidFileSizeError;
break;
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_INVALID_FILE_FORMAT:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillInvalidFileExtensionError;
break;
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_EXTERNAL_AUTH:
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_BILLING:
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_INVOCATIONS:
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_UNKNOWN:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillUnknownError;
break;
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_ERROR_FILE_PROCESSING:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillFileProcessingError;
break;
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_STATUS_PENDING:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillPendingStatus;
break;
case _constants__WEBPACK_IMPORTED_MODULE_2__.SKILLS_STATUS_INVOKED:
localizedMessage = _common_messages__WEBPACK_IMPORTED_MODULE_1__["default"].skillInvokedStatus;
break;
default:
if (message) {
return message;
}
}
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_3__["default"], localizedMessage);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Status);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/status/index.js":
/*!*************************************************************!*\
!*** ./src/elements/content-sidebar/skills/status/index.js ***!
\*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* reexport safe */ _Status__WEBPACK_IMPORTED_MODULE_0__["default"])
/* harmony export */ });
/* harmony import */ var _Status__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Status */ "./src/elements/content-sidebar/skills/status/Status.js");
/***/ }),
/***/ "./src/elements/content-sidebar/skills/timeline/Timeline.js":
/*!******************************************************************!*\
!*** ./src/elements/content-sidebar/skills/timeline/Timeline.js ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _icons_general_IconTrackNext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../icons/general/IconTrackNext */ "./src/icons/general/IconTrackNext.tsx");
/* harmony import */ var _icons_general_IconTrackPrevious__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../icons/general/IconTrackPrevious */ "./src/icons/general/IconTrackPrevious.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _Timeslice__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Timeslice */ "./src/elements/content-sidebar/skills/timeline/Timeslice.js");
/* harmony import */ var _transcript_timeSliceUtils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../transcript/timeSliceUtils */ "./src/elements/content-sidebar/skills/transcript/timeSliceUtils.js");
/* harmony import */ var _Timeline_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Timeline.scss */ "./src/elements/content-sidebar/skills/timeline/Timeline.scss");
/**
*
* @file Timeline component
* @author Box
*/
const Timeline = ({
text = '',
duration = 0,
timeslices = [],
getViewer,
interactionTarget
}) => {
let timeSliceIndex = -1;
const playSegment = (index, incr = 0) => {
const newIndex = incr > 0 ? Math.min(timeslices.length - 1, index + incr) : Math.max(0, index + incr);
const viewer = getViewer ? getViewer() : null;
const timeslice = timeslices[newIndex];
const validTime = (0,_transcript_timeSliceUtils__WEBPACK_IMPORTED_MODULE_7__.isValidStartTime)(timeslice);
if (validTime && viewer && typeof viewer.play === 'function') {
viewer.play(timeslice.start);
timeSliceIndex = newIndex;
}
};
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-timeline"
}, text && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-timeline-label"
}, text), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-timeline-line-wrapper"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-timeline-line"
}), timeslices.map(({
start,
end
}, index) =>
/*#__PURE__*/
/* eslint-disable react/no-array-index-key */
react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Timeslice__WEBPACK_IMPORTED_MODULE_6__["default"], {
key: index,
duration: duration,
end: end,
index: index,
interactionTarget: interactionTarget,
onClick: playSegment,
start: start
})
/* eslint-enable react/no-array-index-key */)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-timeline-btns"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.TIMELINE.PREVIOUS,
onClick: () => playSegment(timeSliceIndex, -1),
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconTrackPrevious__WEBPACK_IMPORTED_MODULE_3__["default"], {
title: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_9__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_4__["default"].previousSegment)
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_5__.SKILLS_TARGETS.TIMELINE.NEXT,
onClick: () => playSegment(timeSliceIndex, 1),
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconTrackNext__WEBPACK_IMPORTED_MODULE_2__["default"], {
title: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_9__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_4__["default"].nextSegment)
}))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Timeline);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/timeline/Timeslice.js":
/*!*******************************************************************!*\
!*** ./src/elements/content-sidebar/skills/timeline/Timeslice.js ***!
\*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _Timeslice_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Timeslice.scss */ "./src/elements/content-sidebar/skills/timeline/Timeslice.scss");
/**
*
* @file Timeline line component
* @author Box
*/
const LENGTH_TEXT_ITEMLINE = 290; // match with css
const MIN_WIDTH = 6; // Need at least some width to be clickable
const Timeslice = ({
start,
end,
duration,
onClick,
index,
interactionTarget
}) => {
if (typeof start !== 'number' || !duration || start >= duration) {
return null;
}
const barLength = LENGTH_TEXT_ITEMLINE;
let startLeft = Math.round(start * barLength / duration);
const minEnding = startLeft + MIN_WIDTH; // Need at least some width to be clickable
const ending = typeof end === 'number' ? Math.max(minEnding, end * barLength / duration) : minEnding;
const endLeft = Math.round(Math.min(barLength, ending));
let width = endLeft - startLeft;
// If width is too small re-adjust the left position
// to get to at least 6px wide for clickability
if (width < MIN_WIDTH) {
startLeft -= MIN_WIDTH - width;
width = MIN_WIDTH;
}
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: "be-timeline-time",
"data-resin-target": interactionTarget,
onClick: () => onClick(index),
style: {
left: `${startLeft}px`,
width: `${width}px`
},
type: "button"
});
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Timeslice);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/timeline/index.js":
/*!***************************************************************!*\
!*** ./src/elements/content-sidebar/skills/timeline/index.js ***!
\***************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* reexport safe */ _Timeline__WEBPACK_IMPORTED_MODULE_0__["default"])
/* harmony export */ });
/* harmony import */ var _Timeline__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Timeline */ "./src/elements/content-sidebar/skills/timeline/Timeline.js");
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.js":
/*!********************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.js ***!
\********************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var react_textarea_autosize__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-textarea-autosize */ "./node_modules/react-textarea-autosize/dist/react-textarea-autosize.browser.development.esm.js");
/* harmony import */ var _components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/primary-button/PrimaryButton */ "./src/components/primary-button/PrimaryButton.tsx");
/* harmony import */ var _components_button_Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../components/button/Button */ "./src/components/button/Button.tsx");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _EditingTranscriptRow_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./EditingTranscriptRow.scss */ "./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.scss");
/**
*
* @file Editable transcript row component
* @author Box
*/
const EditingTranscriptRow = ({
time,
text = '',
onSave,
onCancel,
onChange
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-row be-transcript-editing-row"
}, time && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-time"
}, time), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-text"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_textarea_autosize__WEBPACK_IMPORTED_MODULE_6__["default"], {
maxRows: 10,
onChange: onChange,
value: text
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-buttons"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_button_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_4__.SKILLS_TARGETS.TRANSCRIPTS.EDIT_CANCEL,
onClick: onCancel,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_7__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_3__["default"].cancel)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_primary_button_PrimaryButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_4__.SKILLS_TARGETS.TRANSCRIPTS.EDIT_SAVE,
onClick: onSave,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_7__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_3__["default"].save)))));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditingTranscriptRow);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/ReadOnlyTranscriptRow.js":
/*!*********************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/ReadOnlyTranscriptRow.js ***!
\*********************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/**
*
* @file Read only transcript row component
* @author Box
*/
const ReadOnlyTranscriptRow = ({
time,
text = '',
onClick,
interactionTarget
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: "be-transcript-row",
"data-resin-target": interactionTarget,
onClick: onClick,
type: "button"
}, time && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-time"
}, time), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-text"
}, text));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadOnlyTranscriptRow);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/Transcript.js":
/*!**********************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/Transcript.js ***!
\**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _styles_variables__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../styles/variables */ "./src/styles/variables.ts");
/* harmony import */ var _components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../components/plain-button/PlainButton */ "./src/components/plain-button/PlainButton.tsx");
/* harmony import */ var _icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../icons/general/IconEdit */ "./src/icons/general/IconEdit.tsx");
/* harmony import */ var _icons_general_IconCopy__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../icons/general/IconCopy */ "./src/icons/general/IconCopy.tsx");
/* harmony import */ var _icons_general_IconExpand__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../icons/general/IconExpand */ "./src/icons/general/IconExpand.tsx");
/* harmony import */ var _icons_general_IconCollapse__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../icons/general/IconCollapse */ "./src/icons/general/IconCollapse.tsx");
/* harmony import */ var _utils_datetime__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../utils/datetime */ "./src/utils/datetime.js");
/* harmony import */ var _components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../components/loading-indicator/LoadingIndicatorWrapper */ "./src/components/loading-indicator/LoadingIndicatorWrapper.tsx");
/* harmony import */ var _components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../../components/tooltip/Tooltip */ "./src/components/tooltip/Tooltip.tsx");
/* harmony import */ var _utils_download__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../../utils/download */ "./src/utils/download.js");
/* harmony import */ var _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../../common/interactionTargets */ "./src/elements/common/interactionTargets.js");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _timeSliceUtils__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./timeSliceUtils */ "./src/elements/content-sidebar/skills/transcript/timeSliceUtils.js");
/* harmony import */ var _TranscriptRow__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./TranscriptRow */ "./src/elements/content-sidebar/skills/transcript/TranscriptRow.js");
/* harmony import */ var _Transcript_scss__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./Transcript.scss */ "./src/elements/content-sidebar/skills/transcript/Transcript.scss");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
*
* @file Transcript component
* @author Box
*/
class Transcript extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent {
constructor(...args) {
super(...args);
_defineProperty(this, "state", {
isEditingIndex: undefined,
newTranscriptText: '',
isCollapsed: true,
isLoading: false
});
/**
* Reducer to accumulate all transcript entries for copying
*
* @param {Object} accumulator - reducer accumulator
* @return {string} accumulated transcript entries
*/
_defineProperty(this, "transcriptReducer", (accumulator, {
appears,
text
}) => {
const start = (0,_timeSliceUtils__WEBPACK_IMPORTED_MODULE_14__.isValidTimeSlice)(appears) && Array.isArray(appears) ? `${(0,_utils_datetime__WEBPACK_IMPORTED_MODULE_8__.formatTime)(appears[0].start)}:` : '';
return `${accumulator}${start} ${text || ''}\r\n`;
});
/**
* Mapper to accumulate all transcript entries for displaying
*
* @param {Object} accumulator - reducer accumulator
* @param {number} index - mapper index
* @return {string} accumulated transcript entries
*/
_defineProperty(this, "transcriptMapper", ({
appears,
text
}, index) => {
const {
isEditingIndex,
newTranscriptText
} = this.state;
const isEditingRow = isEditingIndex === index;
const transcriptText = isEditingRow ? newTranscriptText : text;
const interactionTarget = isEditingRow ? _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__.SKILLS_TARGETS.TRANSCRIPTS.EDIT_TEXT : _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__.SKILLS_TARGETS.TRANSCRIPTS.TRANSCRIPT;
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TranscriptRow__WEBPACK_IMPORTED_MODULE_15__["default"], {
key: index,
appears: appears,
interactionTarget: interactionTarget,
isEditing: isEditingRow,
onCancel: this.onCancel,
onChange: this.onChange,
onClick: () => this.onClick(index),
onSave: this.onSave,
text: transcriptText
});
});
/**
* Toggles the edit mode
*
* @private
* @return {void}
*/
_defineProperty(this, "toggleIsEditing", () => {
this.setState(prevState => ({
isEditingIndex: typeof prevState.isEditingIndex === 'number' ? undefined : -1
}));
});
/**
* Saves the new card data
*
* @private
* @return {void}
*/
_defineProperty(this, "onSave", () => {
const {
card: {
entries
},
onSkillChange
} = this.props;
const {
isEditingIndex,
newTranscriptText
} = this.state;
if (typeof isEditingIndex !== 'number') {
return;
}
const entry = entries[isEditingIndex];
if (entry.text === newTranscriptText) {
this.onCancel();
} else {
this.setState({
isLoading: true,
isEditingIndex: -1
});
onSkillChange(null, null, [{
replacement: _objectSpread(_objectSpread({}, entry), {}, {
text: newTranscriptText
}),
replaced: entry
}]);
}
});
/**
* Cancels editing
*
* @private
* @return {void}
*/
_defineProperty(this, "onCancel", () => {
this.setState({
isEditingIndex: -1,
newTranscriptText: ''
});
});
/**
* Reflects changes of editing
*
* @private
* @param {Event} event - keyboard event
* @return {void}
*/
_defineProperty(this, "onChange", event => {
const currentTarget = event.currentTarget;
this.setState({
newTranscriptText: currentTarget.value
});
});
/**
* Click handler for transcript
*
* @private
* @return {void}
*/
_defineProperty(this, "onClick", index => {
const {
card: {
entries
}
} = this.props;
const {
isEditingIndex
} = this.state;
if (typeof isEditingIndex === 'number') {
this.setState({
isEditingIndex: index,
newTranscriptText: entries[index].text
});
} else {
this.previewSegment(index);
}
});
/**
* Copies the transcript.
* Also animates the copy button.
*
* @private
* @return {void}
*/
_defineProperty(this, "copyTranscript", () => {
const {
card: {
entries
}
} = this.props;
const copiedClass = 'be-transcript-copied';
(0,_utils_download__WEBPACK_IMPORTED_MODULE_11__.copy)(entries.reduce(this.transcriptReducer, ''));
// Animate the button by adding a class
if (this.copyBtn) {
this.copyBtn.classList.add(copiedClass);
}
// Remove the animation class
setTimeout(() => {
if (this.copyBtn) {
this.copyBtn.classList.remove(copiedClass);
}
}, 1000);
});
/**
* Copy button reference
*
* @private
* @return {void}
*/
_defineProperty(this, "copyBtnRef", btn => {
this.copyBtn = btn;
});
/**
* Toggles transcript exapand and collapse
*
* @private
* @return {void}
*/
_defineProperty(this, "toggleExpandCollapse", () => {
this.setState(prevState => ({
isCollapsed: !prevState.isCollapsed
}));
});
}
/**
* Called when transcripts gets new properties
*
* @private
* @return {void}
*/
componentDidUpdate(prevProps) {
if (prevProps === this.props) {
return;
}
const wasEditing = typeof this.state.isEditingIndex === 'number';
this.setState({
isEditingIndex: wasEditing ? -1 : undefined,
newTranscriptText: '',
isLoading: false
});
}
/**
* Previews a transcript segment
*
* @private
* @param {number|void} [index] - row index to edit
* @return {void}
*/
previewSegment(index) {
const {
card: {
entries
},
getViewer
} = this.props;
const {
appears
} = entries[index];
const viewer = getViewer ? getViewer() : null;
const isValid = (0,_timeSliceUtils__WEBPACK_IMPORTED_MODULE_14__.isValidTimeSlice)(appears) && Array.isArray(appears) && appears.length === 1;
const timeSlice = appears;
const start = isValid ? timeSlice[0].start : 0;
if (isValid && viewer && typeof viewer.play === 'function') {
viewer.play(start);
}
}
/**
* Renders the transcript
*
* @private
* @return {Object}
*/
render() {
const {
card: {
entries
},
isEditable
} = this.props;
const {
isEditingIndex,
isCollapsed,
isLoading
} = this.state;
const hasEntries = entries.length > 0;
const hasManyEntries = entries.length > 5;
const isEditing = typeof isEditingIndex === 'number';
const editBtnClassName = classnames__WEBPACK_IMPORTED_MODULE_1___default()('be-transcript-edit', {
'be-transcript-is-editing': isEditing
});
const contentClassName = classnames__WEBPACK_IMPORTED_MODULE_1___default()({
'be-transcript-content-collapsed': isCollapsed
});
const expandCollapseMessage = isCollapsed ? _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].expand : _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].collapse;
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_loading_indicator_LoadingIndicatorWrapper__WEBPACK_IMPORTED_MODULE_9__["default"], {
className: "be-transcript",
isLoading: isLoading
}, hasEntries && !isLoading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-actions"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_10__["default"], {
text: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_17__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].copy)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: "be-transcript-copy",
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__.SKILLS_TARGETS.TRANSCRIPTS.COPY,
getDOMRef: this.copyBtnRef,
onClick: this.copyTranscript,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconCopy__WEBPACK_IMPORTED_MODULE_5__["default"], {
color: _styles_variables__WEBPACK_IMPORTED_MODULE_2__.bdlGray50
}))), hasManyEntries && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_10__["default"], {
text: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_17__["default"], expandCollapseMessage)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: "be-transcript-expand",
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__.SKILLS_TARGETS.TRANSCRIPTS.EXPAND,
onClick: this.toggleExpandCollapse,
type: "button"
}, isCollapsed ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconExpand__WEBPACK_IMPORTED_MODULE_6__["default"], {
color: _styles_variables__WEBPACK_IMPORTED_MODULE_2__.bdlGray50
}) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconCollapse__WEBPACK_IMPORTED_MODULE_7__["default"], {
color: _styles_variables__WEBPACK_IMPORTED_MODULE_2__.bdlGray50
}))), isEditable && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_10__["default"], {
text: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_17__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].editLabel)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_plain_button_PlainButton__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: editBtnClassName,
"data-resin-target": _common_interactionTargets__WEBPACK_IMPORTED_MODULE_12__.SKILLS_TARGETS.TRANSCRIPTS.EDIT,
onClick: this.toggleIsEditing,
type: "button"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_icons_general_IconEdit__WEBPACK_IMPORTED_MODULE_4__["default"], null)))), isEditing ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "be-transcript-edit-message"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_17__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].transcriptEdit)) : null, hasEntries ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: contentClassName
}, entries.map(this.transcriptMapper)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_17__["default"], _common_messages__WEBPACK_IMPORTED_MODULE_13__["default"].skillNoInfoFoundError));
}
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Transcript);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/TranscriptRow.js":
/*!*************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/TranscriptRow.js ***!
\*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _utils_datetime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../utils/datetime */ "./src/utils/datetime.js");
/* harmony import */ var _ReadOnlyTranscriptRow__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ReadOnlyTranscriptRow */ "./src/elements/content-sidebar/skills/transcript/ReadOnlyTranscriptRow.js");
/* harmony import */ var _EditingTranscriptRow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./EditingTranscriptRow */ "./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.js");
/* harmony import */ var _timeSliceUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./timeSliceUtils */ "./src/elements/content-sidebar/skills/transcript/timeSliceUtils.js");
/* harmony import */ var _TranscriptRow_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TranscriptRow.scss */ "./src/elements/content-sidebar/skills/transcript/TranscriptRow.scss");
/**
*
* @file Transcript row component
* @author Box
*/
const TranscriptRow = ({
appears,
text,
isEditing,
onClick,
onSave,
onCancel,
onChange,
interactionTarget
}) => {
const isValid = (0,_timeSliceUtils__WEBPACK_IMPORTED_MODULE_4__.isValidTimeSlice)(appears) && Array.isArray(appears) && appears.length === 1;
const timeSlice = appears;
const start = isValid ? (0,_utils_datetime__WEBPACK_IMPORTED_MODULE_1__.formatTime)(timeSlice[0].start) : undefined;
return isEditing ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_EditingTranscriptRow__WEBPACK_IMPORTED_MODULE_3__["default"], {
onCancel: onCancel,
onChange: onChange,
onSave: onSave,
text: text,
time: start
}) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ReadOnlyTranscriptRow__WEBPACK_IMPORTED_MODULE_2__["default"], {
interactionTarget: interactionTarget,
onClick: onClick,
text: text,
time: start
});
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TranscriptRow);
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/index.js":
/*!*****************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/index.js ***!
\*****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* reexport safe */ _Transcript__WEBPACK_IMPORTED_MODULE_0__["default"])
/* harmony export */ });
/* harmony import */ var _Transcript__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Transcript */ "./src/elements/content-sidebar/skills/transcript/Transcript.js");
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/timeSliceUtils.js":
/*!**************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/timeSliceUtils.js ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ isValidStartTime: () => (/* binding */ isValidStartTime),
/* harmony export */ isValidTimeSlice: () => (/* binding */ isValidTimeSlice)
/* harmony export */ });
/**
*
* @file Transcript utils
* @author Box
*/
/**
* Returns true if there is a valid start time
*
* @param {SkillCardEntryTimeSlice} timeslices - skill entry time slice
* @return {boolean} if there is a valid start time
*/
const isValidStartTime = timeslice => !!timeslice && typeof timeslice.start === 'number';
/**
* Returns true if there is a valid time slice with valid start time
*
* @param {SkillCardEntryTimeSlice[]} timeslices - skill entry time slice
* @return {boolean} if it is a valid time slice
*/
const isValidTimeSlice = timeslices => Array.isArray(timeslices) && isValidStartTime(timeslices[0]);
/***/ }),
/***/ "./src/icons/general/IconCollapse.tsx":
/*!********************************************!*\
!*** ./src/icons/general/IconCollapse.tsx ***!
\********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconCollapse = ({
className = '',
color = '#979797',
height = 13,
title,
width = 13
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-collapse ${className}`,
height: height,
title: title,
viewBox: "0 0 13 13",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M8 6h4a1 1 0 0 0 0-2H9V1a1 1 0 0 0-2 0v4a1 1 0 0 0 1 1zM1 9h3v3a1 1 0 0 0 2 0V8a1 1 0 0 0-1-1H1a1 1 0 0 0 0 2z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconCollapse);
/***/ }),
/***/ "./src/icons/general/IconCopy.tsx":
/*!****************************************!*\
!*** ./src/icons/general/IconCopy.tsx ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconCopy = ({
className = '',
color = '#999',
height = 14,
title,
width = 14
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-copy ${className}`,
height: height,
title: title,
viewBox: "0 0 14 14",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M1 11a1 1 0 0 1-1-1V1a1 1 0 0 1 1-1h9a1 1 0 0 1 0 2H2v8a1 1 0 0 1-1 1z",
fill: color
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M13 3H3v10a1 1 0 0 0 1 1h9a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1zm-3 8H7a1 1 0 0 1 0-2h3a1 1 0 0 1 0 2zm0-3H7a1 1 0 0 1 0-2h3a1 1 0 0 1 0 2z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconCopy);
/***/ }),
/***/ "./src/icons/general/IconEdit.tsx":
/*!****************************************!*\
!*** ./src/icons/general/IconEdit.tsx ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
/* harmony import */ var _styles_variables__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../styles/variables */ "./src/styles/variables.ts");
const IconEdit = ({
className = '',
color = _styles_variables__WEBPACK_IMPORTED_MODULE_2__.bdlGray65,
height = 14,
title,
width = 14
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-edit ${className}`,
height: height,
title: title,
viewBox: "0 0 14 14",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M3.21 7.89l6.47-6.48a2 2 0 0 1 2.88 2.78h-.05L6 10.72 3.21 7.89zM2.24 9l2.83 2.83L1.67 13c-.52.18-.79-.1-.62-.61z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconEdit);
/***/ }),
/***/ "./src/icons/general/IconExpand.tsx":
/*!******************************************!*\
!*** ./src/icons/general/IconExpand.tsx ***!
\******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconExpand = ({
className = '',
color = '#979797',
height = 13,
title,
width = 13
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-expand ${className}`,
height: height,
title: title,
viewBox: "0 0 13 13",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M12 0H6a1 1 0 0 0 0 2h5v5a1 1 0 0 0 2 0V1a1 1 0 0 0-1-1zM7 11H2V6a1 1 0 0 0-2 0v6a1 1 0 0 0 1 1h6a1 1 0 0 0 0-2z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconExpand);
/***/ }),
/***/ "./src/icons/general/IconMinus.tsx":
/*!*****************************************!*\
!*** ./src/icons/general/IconMinus.tsx ***!
\*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconMinus = ({
className = '',
color = '#000000',
height = 16,
title,
width = 16
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-minus ${className}`,
height: height,
title: title,
viewBox: "0 0 16 16",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
d: "M2 5h8v2H2z",
fill: color,
fillRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconMinus);
/***/ }),
/***/ "./src/icons/general/IconTrackNext.tsx":
/*!*********************************************!*\
!*** ./src/icons/general/IconTrackNext.tsx ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconTrackNext = ({
className = '',
color = '#999',
height = 14,
title,
width = 14
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-track-next ${className}`,
height: height,
title: title,
viewBox: "0 0 14 14",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M7.72 7.85a1 1 0 0 0 0-1.41l-5-4.81A1 1 0 0 0 2 1.35a1 1 0 0 0-1 1V12a1 1 0 0 0 .28.69 1 1 0 0 0 1.41 0l5-4.81zM13 2v10a1 1 0 0 1-1 1 1 1 0 0 1-1-1V2a1 1 0 0 1 1-1 1 1 0 0 1 1 1z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconTrackNext);
/***/ }),
/***/ "./src/icons/general/IconTrackPrevious.tsx":
/*!*************************************************!*\
!*** ./src/icons/general/IconTrackPrevious.tsx ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _accessible_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../accessible-svg */ "./src/icons/accessible-svg/index.ts");
const IconTrackPrevious = ({
className = '',
color = '#999',
height = 14,
title,
width = 14
}) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_accessible_svg__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: `icon-track-previous ${className}`,
height: height,
title: title,
viewBox: "0 0 14 14",
width: width
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
className: "fill-color",
d: "M6.31 7.88l5 4.81a1 1 0 0 0 1.41 0A1 1 0 0 0 13 12V2.35a1 1 0 0 0-1-1 1 1 0 0 0-.69.28l-5 4.81a1 1 0 0 0 0 1.41zM2 1a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1 1 1 0 0 1-1-1V2a1 1 0 0 1 1-1z",
fill: color
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconTrackPrevious);
/***/ }),
/***/ "./src/utils/download.js":
/*!*******************************!*\
!*** ./src/utils/download.js ***!
\*******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ copy: () => (/* binding */ copy),
/* harmony export */ download: () => (/* binding */ download)
/* harmony export */ });
/**
*
* @file Utility for copying and downloading
* @author Box
*/
/**
* Function to download string as txt file
*
* @private
* @param {String} string - string to download
* @param {String} name - file name to use
* @return {void}
*/
function download(string, name) {
const blob = new Blob([string], {
type: 'text/plain;charset=utf-8'
});
// IE11
if (window.navigator.msSaveBlob) {
window.navigator.msSaveBlob(blob, name);
return;
}
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = name;
if (document.body) {
document.body.appendChild(a);
}
a.click();
setTimeout(() => {
if (document.body) {
document.body.removeChild(a);
}
URL.revokeObjectURL(url);
}, 100);
}
/**
* Function to copy string to the clipboard
*
* @private
* @param {String} string - string to copy
* @return {void}
*/
function copy(string) {
const textarea = document.createElement('textarea');
const {
body
} = document;
textarea.value = string;
textarea.style.display = 'hidden';
if (body) {
body.appendChild(textarea);
textarea.select();
document.execCommand('copy');
body.removeChild(textarea);
}
}
/***/ }),
/***/ "./node_modules/lodash/isEqual.js":
/*!****************************************!*\
!*** ./node_modules/lodash/isEqual.js ***!
\****************************************/
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
var baseIsEqual = __webpack_require__(/*! ./_baseIsEqual */ "./node_modules/lodash/_baseIsEqual.js");
/**
* Performs a deep comparison between two values to determine if they are
* equivalent.
*
* **Note:** This method supports comparing arrays, array buffers, booleans,
* date objects, error objects, maps, numbers, `Object` objects, regexes,
* sets, strings, symbols, and typed arrays. `Object` objects are compared
* by their own, not inherited, enumerable properties. Functions and DOM
* nodes are compared by strict equality, i.e. `===`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
* @example
*
* var object = { 'a': 1 };
* var other = { 'a': 1 };
*
* _.isEqual(object, other);
* // => true
*
* object === other;
* // => false
*/
function isEqual(value, other) {
return baseIsEqual(value, other);
}
module.exports = isEqual;
/***/ }),
/***/ "./src/elements/content-sidebar/SkillsSidebar.scss":
/*!*********************************************************!*\
!*** ./src/elements/content-sidebar/SkillsSidebar.scss ***!
\*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/faces/Face.scss":
/*!*************************************************************!*\
!*** ./src/elements/content-sidebar/skills/faces/Face.scss ***!
\*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/faces/Faces.scss":
/*!**************************************************************!*\
!*** ./src/elements/content-sidebar/skills/faces/Faces.scss ***!
\**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/EditableKeywords.scss":
/*!****************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/EditableKeywords.scss ***!
\****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/Keywords.scss":
/*!********************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/Keywords.scss ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.scss":
/*!****************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/keywords/ReadOnlyKeywords.scss ***!
\****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/timeline/Timeline.scss":
/*!********************************************************************!*\
!*** ./src/elements/content-sidebar/skills/timeline/Timeline.scss ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/timeline/Timeslice.scss":
/*!*********************************************************************!*\
!*** ./src/elements/content-sidebar/skills/timeline/Timeslice.scss ***!
\*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.scss":
/*!**********************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/EditingTranscriptRow.scss ***!
\**********************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/Transcript.scss":
/*!************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/Transcript.scss ***!
\************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/elements/content-sidebar/skills/transcript/TranscriptRow.scss":
/*!***************************************************************************!*\
!*** ./src/elements/content-sidebar/skills/transcript/TranscriptRow.scss ***!
\***************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./node_modules/react-textarea-autosize/dist/react-textarea-autosize.browser.development.esm.js":
/*!******************************************************************************************************!*\
!*** ./node_modules/react-textarea-autosize/dist/react-textarea-autosize.browser.development.esm.js ***!
\******************************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ index)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutPropertiesLoose */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var use_latest__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! use-latest */ "./node_modules/use-latest/dist/use-latest.esm.js");
/* harmony import */ var use_composed_ref__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! use-composed-ref */ "./node_modules/use-composed-ref/dist/use-composed-ref.esm.js");
var HIDDEN_TEXTAREA_STYLE = {
'min-height': '0',
'max-height': 'none',
height: '0',
visibility: 'hidden',
overflow: 'hidden',
position: 'absolute',
'z-index': '-1000',
top: '0',
right: '0'
};
var forceHiddenStyles = function forceHiddenStyles(node) {
Object.keys(HIDDEN_TEXTAREA_STYLE).forEach(function (key) {
node.style.setProperty(key, HIDDEN_TEXTAREA_STYLE[key], 'important');
});
};
var forceHiddenStyles$1 = forceHiddenStyles;
// TODO: use labelled tuples once they are avaiable:
// export type CalculatedNodeHeights = [height: number, rowHeight: number];
// https://github.com/microsoft/TypeScript/issues/28259
var hiddenTextarea = null;
var getHeight = function getHeight(node, sizingData) {
var height = node.scrollHeight;
if (sizingData.sizingStyle.boxSizing === 'border-box') {
// border-box: add border, since height = content + padding + border
return height + sizingData.borderSize;
}
// remove padding, since height = content
return height - sizingData.paddingSize;
};
function calculateNodeHeight(sizingData, value, minRows, maxRows) {
if (minRows === void 0) {
minRows = 1;
}
if (maxRows === void 0) {
maxRows = Infinity;
}
if (!hiddenTextarea) {
hiddenTextarea = document.createElement('textarea');
hiddenTextarea.setAttribute('tabindex', '-1');
hiddenTextarea.setAttribute('aria-hidden', 'true');
forceHiddenStyles$1(hiddenTextarea);
}
if (hiddenTextarea.parentNode === null) {
document.body.appendChild(hiddenTextarea);
}
var paddingSize = sizingData.paddingSize,
borderSize = sizingData.borderSize,
sizingStyle = sizingData.sizingStyle;
var boxSizing = sizingStyle.boxSizing;
Object.keys(sizingStyle).forEach(function (_key) {
var key = _key;
hiddenTextarea.style[key] = sizingStyle[key];
});
forceHiddenStyles$1(hiddenTextarea);
hiddenTextarea.value = value;
var height = getHeight(hiddenTextarea, sizingData);
// Double set and calc due to Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1795904
hiddenTextarea.value = value;
height = getHeight(hiddenTextarea, sizingData);
// measure height of a textarea with a single row
hiddenTextarea.value = 'x';
var rowHeight = hiddenTextarea.scrollHeight - paddingSize;
var minHeight = rowHeight * minRows;
if (boxSizing === 'border-box') {
minHeight = minHeight + paddingSize + borderSize;
}
height = Math.max(minHeight, height);
var maxHeight = rowHeight * maxRows;
if (boxSizing === 'border-box') {
maxHeight = maxHeight + paddingSize + borderSize;
}
height = Math.min(maxHeight, height);
return [height, rowHeight];
}
var noop = function noop() {};
var pick = function pick(props, obj) {
return props.reduce(function (acc, prop) {
acc[prop] = obj[prop];
return acc;
}, {});
};
var SIZING_STYLE = ['borderBottomWidth', 'borderLeftWidth', 'borderRightWidth', 'borderTopWidth', 'boxSizing', 'fontFamily', 'fontSize', 'fontStyle', 'fontWeight', 'letterSpacing', 'lineHeight', 'paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop',
// non-standard
'tabSize', 'textIndent',
// non-standard
'textRendering', 'textTransform', 'width', 'wordBreak'];
var isIE = !!document.documentElement.currentStyle ;
var getSizingData = function getSizingData(node) {
var style = window.getComputedStyle(node);
if (style === null) {
return null;
}
var sizingStyle = pick(SIZING_STYLE, style);
var boxSizing = sizingStyle.boxSizing;
// probably node is detached from DOM, can't read computed dimensions
if (boxSizing === '') {
return null;
}
// IE (Edge has already correct behaviour) returns content width as computed width
// so we need to add manually padding and border widths
if (isIE && boxSizing === 'border-box') {
sizingStyle.width = parseFloat(sizingStyle.width) + parseFloat(sizingStyle.borderRightWidth) + parseFloat(sizingStyle.borderLeftWidth) + parseFloat(sizingStyle.paddingRight) + parseFloat(sizingStyle.paddingLeft) + 'px';
}
var paddingSize = parseFloat(sizingStyle.paddingBottom) + parseFloat(sizingStyle.paddingTop);
var borderSize = parseFloat(sizingStyle.borderBottomWidth) + parseFloat(sizingStyle.borderTopWidth);
return {
sizingStyle: sizingStyle,
paddingSize: paddingSize,
borderSize: borderSize
};
};
var getSizingData$1 = getSizingData;
function useListener(target, type, listener) {
var latestListener = (0,use_latest__WEBPACK_IMPORTED_MODULE_3__["default"])(listener);
react__WEBPACK_IMPORTED_MODULE_2__.useLayoutEffect(function () {
var handler = function handler(ev) {
return latestListener.current(ev);
};
// might happen if document.fonts is not defined, for instance
if (!target) {
return;
}
target.addEventListener(type, handler);
return function () {
return target.removeEventListener(type, handler);
};
}, []);
}
var useWindowResizeListener = function useWindowResizeListener(listener) {
useListener(window, 'resize', listener);
};
var useFontsLoadedListener = function useFontsLoadedListener(listener) {
useListener(document.fonts, 'loadingdone', listener);
};
var _excluded = ["cacheMeasurements", "maxRows", "minRows", "onChange", "onHeightChange"];
var TextareaAutosize = function TextareaAutosize(_ref, userRef) {
var cacheMeasurements = _ref.cacheMeasurements,
maxRows = _ref.maxRows,
minRows = _ref.minRows,
_ref$onChange = _ref.onChange,
onChange = _ref$onChange === void 0 ? noop : _ref$onChange,
_ref$onHeightChange = _ref.onHeightChange,
onHeightChange = _ref$onHeightChange === void 0 ? noop : _ref$onHeightChange,
props = (0,_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref, _excluded);
if (props.style) {
if ('maxHeight' in props.style) {
throw new Error('Using `style.maxHeight` for <TextareaAutosize/> is not supported. Please use `maxRows`.');
}
if ('minHeight' in props.style) {
throw new Error('Using `style.minHeight` for <TextareaAutosize/> is not supported. Please use `minRows`.');
}
}
var isControlled = props.value !== undefined;
var libRef = react__WEBPACK_IMPORTED_MODULE_2__.useRef(null);
var ref = (0,use_composed_ref__WEBPACK_IMPORTED_MODULE_4__["default"])(libRef, userRef);
var heightRef = react__WEBPACK_IMPORTED_MODULE_2__.useRef(0);
var measurementsCacheRef = react__WEBPACK_IMPORTED_MODULE_2__.useRef();
var resizeTextarea = function resizeTextarea() {
var node = libRef.current;
var nodeSizingData = cacheMeasurements && measurementsCacheRef.current ? measurementsCacheRef.current : getSizingData$1(node);
if (!nodeSizingData) {
return;
}
measurementsCacheRef.current = nodeSizingData;
var _calculateNodeHeight = calculateNodeHeight(nodeSizingData, node.value || node.placeholder || 'x', minRows, maxRows),
height = _calculateNodeHeight[0],
rowHeight = _calculateNodeHeight[1];
if (heightRef.current !== height) {
heightRef.current = height;
node.style.setProperty('height', height + "px", 'important');
onHeightChange(height, {
rowHeight: rowHeight
});
}
};
var handleChange = function handleChange(event) {
if (!isControlled) {
resizeTextarea();
}
onChange(event);
};
{
react__WEBPACK_IMPORTED_MODULE_2__.useLayoutEffect(resizeTextarea);
useWindowResizeListener(resizeTextarea);
useFontsLoadedListener(resizeTextarea);
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement("textarea", (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, props, {
onChange: handleChange,
ref: ref
}));
}
};
var index = /* #__PURE__ */react__WEBPACK_IMPORTED_MODULE_2__.forwardRef(TextareaAutosize);
/***/ }),
/***/ "./node_modules/use-composed-ref/dist/use-composed-ref.esm.js":
/*!********************************************************************!*\
!*** ./node_modules/use-composed-ref/dist/use-composed-ref.esm.js ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var updateRef = function updateRef(ref, value) {
if (typeof ref === 'function') {
ref(value);
return;
}
ref.current = value;
};
var useComposedRef = function useComposedRef(libRef, userRef) {
var prevUserRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)();
return (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (instance) {
libRef.current = instance;
if (prevUserRef.current) {
updateRef(prevUserRef.current, null);
}
prevUserRef.current = userRef;
if (!userRef) {
return;
}
updateRef(userRef, instance);
}, [userRef]);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useComposedRef);
/***/ }),
/***/ "./node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.browser.esm.js":
/*!****************************************************************************************************!*\
!*** ./node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.browser.esm.js ***!
\****************************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var index = react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect ;
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (index);
/***/ }),
/***/ "./node_modules/use-latest/dist/use-latest.esm.js":
/*!********************************************************!*\
!*** ./node_modules/use-latest/dist/use-latest.esm.js ***!
\********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ useLatest)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var use_isomorphic_layout_effect__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! use-isomorphic-layout-effect */ "./node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.browser.esm.js");
var useLatest = function useLatest(value) {
var ref = react__WEBPACK_IMPORTED_MODULE_0__.useRef(value);
(0,use_isomorphic_layout_effect__WEBPACK_IMPORTED_MODULE_1__["default"])(function () {
ref.current = value;
});
return ref;
};
/***/ })
}]);
//# sourceMappingURL=skills-sidebar.js.map