@livetiles/reach-components-react 0.4.0-preview.252 → 0.4.0-preview.254

package/index.esm2.js

@@ -1,7 +1,7 @@
 import { jsx as jsx$1, Fragment, jsxs } from 'react/jsx-runtime';
 import require$$0$6 from 'events';
 import * as React$d from 'react';
-import React__default, { useContext, createContext, useMemo, useState as useState$2, useCallback, useEffect as useEffect$1, useRef as useRef$1, useReducer, Children, isValidElement, cloneElement, Component, lazy as lazy$1, Suspense, forwardRef, createElement as createElement$a, useLayoutEffect, useImperativeHandle, Fragment as Fragment$1 } from 'react';
+import React__default, { useContext, createContext, useMemo, useRef as useRef$1, useEffect as useEffect$1, useState as useState$2, useCallback, useReducer, Children, isValidElement, cloneElement, Component, lazy as lazy$1, Suspense, forwardRef, createElement as createElement$a, useLayoutEffect, useImperativeHandle, Fragment as Fragment$1 } from 'react';
 import { PersonaInitialsColor, MessageBarType, loadTheme, IconButton as IconButton$1, Link as Link$3, MessageBar, ActionButton as ActionButton$1, TextField, PrimaryButton, DefaultButton, Icon, Image as Image$1, Spinner as Spinner$1, Toggle, ChoiceGroup as ChoiceGroup$1, Persona, Checkbox, Label as Label$2, Dropdown as Dropdown$1, ProgressIndicator, Shimmer, ShimmerElementsGroup, ShimmerElementType, DirectionalHint, PersonaSize, TooltipHost as TooltipHost$1, DialogType, Dialog as Dialog$1, DialogFooter, SelectionMode, NormalPeoplePicker, FocusTrapCallout, SpinnerSize, SearchBox as SearchBox$1, ResponsiveMode, ImageFit, Layer as Layer$1, initializeIcons, TagPicker, Breadcrumb, CommandBarButton, DatePicker, DayOfWeek } from 'office-ui-fabric-react';
 import * as ReactRouterDom from 'react-router-dom';
 import { useHistory, useRouteMatch, useLocation as useLocation$1, Link as Link$4, NavLink, MemoryRouter, Switch, Route } from 'react-router-dom';
@@ -7956,7 +7956,7 @@ var Stringify = stringify$4;
 var Parse = parse$5;
 
 
-var lib$4 = {
+var lib$5 = {
     stringify: Stringify,
     parse: Parse
 };
@@ -7969,7 +7969,7 @@ Object.defineProperty(exports, '__esModule', {
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-var _qs = lib$4;
+var _qs = lib$5;
 
 var _qs2 = _interopRequireDefault(_qs);
 
@@ -8597,7 +8597,7 @@ function createVersionParts(count) {
     return output;
 }
 
-var lib$3 = {exports: {}};
+var lib$4 = {exports: {}};
 
 /**
  * The code was extracted from:
@@ -8681,7 +8681,7 @@ function InvalidTokenError(message) {
 InvalidTokenError.prototype = new Error();
 InvalidTokenError.prototype.name = 'InvalidTokenError';
 
-lib$3.exports = function (token,options) {
+lib$4.exports = function (token,options) {
   if (typeof token !== 'string') {
     throw new InvalidTokenError('Invalid token specified');
   }
@@ -8695,9 +8695,9 @@ lib$3.exports = function (token,options) {
   }
 };
 
-lib$3.exports.InvalidTokenError = InvalidTokenError;
+lib$4.exports.InvalidTokenError = InvalidTokenError;
 
-var jwtDecode = lib$3.exports;
+var jwtDecode = lib$4.exports;
 
 var moment$1 = {exports: {}};
 
@@ -13355,10 +13355,10 @@ var requireObjectCoercible$4$5 = function (it) {
 
 
 var IndexedObject$1$3 = indexedObject$6;
-var requireObjectCoercible$3$5 = requireObjectCoercible$4$5;
+var requireObjectCoercible$3$6 = requireObjectCoercible$4$5;
 
 var toIndexedObject$4$4 = function (it) {
-  return IndexedObject$1$3(requireObjectCoercible$3$5(it));
+  return IndexedObject$1$3(requireObjectCoercible$3$6(it));
 };
 
 var check$7 = function (it) {
@@ -14157,7 +14157,7 @@ var aPossiblePrototype$1$4 = function (it) {
   return it;
 };
 
-var anObject$3$6 = anObject$8$5;
+var anObject$3$7 = anObject$8$5;
 var aPossiblePrototype$5 = aPossiblePrototype$1$4; // `Object.setPrototypeOf` method
 // https://tc39.github.io/ecma262/#sec-object.setprototypeof
 // Works with __proto__ only. Old v8 can't work with null proto objects.
@@ -14178,7 +14178,7 @@ var objectSetPrototypeOf$4 = Object.setPrototypeOf || ('__proto__' in {} ? funct
   }
 
   return function setPrototypeOf(O, proto) {
-    anObject$3$6(O);
+    anObject$3$7(O);
     aPossiblePrototype$5(proto);
     if (CORRECT_SETTER) setter.call(O, proto);else O.__proto__ = proto;
     return O;
@@ -18302,11 +18302,11 @@ for (var COLLECTION_NAME$3 in DOMIterables$3) {
   }
 }
 
-var anObject$3$5 = anObject$9$3; // `RegExp.prototype.flags` getter implementation
+var anObject$3$6 = anObject$9$3; // `RegExp.prototype.flags` getter implementation
 // https://tc39.github.io/ecma262/#sec-get-regexp.prototype.flags
 
 var regexpFlags$1$5 = function () {
-  var that = anObject$3$5(this);
+  var that = anObject$3$6(this);
   var result = '';
   if (that.global) result += 'g';
   if (that.ignoreCase) result += 'i';
@@ -18603,11 +18603,11 @@ var speciesConstructor$1$4 = function (O, defaultConstructor) {
 };
 
 var toInteger$1$6 = toInteger$4$4;
-var requireObjectCoercible$3$4 = requireObjectCoercible$6$3; // `String.prototype.{ codePointAt, at }` methods implementation
+var requireObjectCoercible$3$5 = requireObjectCoercible$6$3; // `String.prototype.{ codePointAt, at }` methods implementation
 
 var createMethod$1$4 = function (CONVERT_TO_STRING) {
   return function ($this, pos) {
-    var S = String(requireObjectCoercible$3$4($this));
+    var S = String(requireObjectCoercible$3$5($this));
     var position = toInteger$1$6(pos);
     var size = S.length;
     var first, second;
@@ -18656,7 +18656,7 @@ var regexpExecAbstract$5 = function (R, S) {
   return regexpExec$1$5.call(R, S);
 };
 
-var fixRegExpWellKnownSymbolLogic$1$3 = fixRegexpWellKnownSymbolLogic$5;
+var fixRegExpWellKnownSymbolLogic$1$4 = fixRegexpWellKnownSymbolLogic$5;
 var isRegExp$b = isRegexp$5;
 var anObject$1$6 = anObject$9$3;
 var requireObjectCoercible$2$6 = requireObjectCoercible$6$3;
@@ -18674,7 +18674,7 @@ var SUPPORTS_Y$3 = !fails$o(function () {
   return !RegExp(MAX_UINT32$3, 'y');
 }); // @@split logic
 
-fixRegExpWellKnownSymbolLogic$1$3('split', 2, function (SPLIT, nativeSplit, maybeCallNative) {
+fixRegExpWellKnownSymbolLogic$1$4('split', 2, function (SPLIT, nativeSplit, maybeCallNative) {
   var internalSplit;
 
   if ('abbc'.split(/(b)*/)[1] == 'c' || 'test'.split(/(?:)/, -1).length != 4 || 'ab'.split(/(?:ab)*/).length != 2 || '.'.split(/(.?)(.?)/).length != 4 || '.'.split(/()()/).length > 1 || ''.split(/.?/).length) {
@@ -19082,6 +19082,18 @@ function useBeforeUnload$2(onBeforeUnload, deps) {
   }, [handleBeforeUnload]);
 }
 
+function useEffectOnUpdate(effect, deps) {
+  var isFirstRun = useRef$1(true);
+  useEffect$1(function () {
+    if (isFirstRun.current) {
+      isFirstRun.current = false;
+      return;
+    }
+
+    return effect(); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps);
+}
+
 function usePerformanceTimer() {
   var stateRef = useRef$1({
     start: 0,
@@ -25136,15 +25148,15 @@ var anObject$4$4 = function (it) {
 
 var DESCRIPTORS$1$4 = descriptors$4;
 var IE8_DOM_DEFINE$5 = ie8DomDefine$4;
-var anObject$3$4 = anObject$4$4;
+var anObject$3$5 = anObject$4$4;
 var toPrimitive$7 = toPrimitive$2$4;
 var nativeDefineProperty$4 = Object.defineProperty; // `Object.defineProperty` method
 // https://tc39.github.io/ecma262/#sec-object.defineproperty
 
 objectDefineProperty$4.f = DESCRIPTORS$1$4 ? nativeDefineProperty$4 : function defineProperty(O, P, Attributes) {
-  anObject$3$4(O);
+  anObject$3$5(O);
   P = toPrimitive$7(P, true);
-  anObject$3$4(Attributes);
+  anObject$3$5(Attributes);
   if (IE8_DOM_DEFINE$5) try {
     return nativeDefineProperty$4(O, P, Attributes);
   } catch (error) {
@@ -25835,7 +25847,7 @@ var fixRegexpWellKnownSymbolLogic$4 = function (KEY, length, exec, sham) {
 // https://tc39.github.io/ecma262/#sec-samevalue
 
 
-var sameValue$1$3 = Object.is || function is(x, y) {
+var sameValue$1$4 = Object.is || function is(x, y) {
   // eslint-disable-next-line no-self-compare
   return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
 };
@@ -25867,7 +25879,7 @@ var regexpExecAbstract$4 = function (R, S) {
 var fixRegExpWellKnownSymbolLogic$7 = fixRegexpWellKnownSymbolLogic$4;
 var anObject$m = anObject$4$4;
 var requireObjectCoercible$i = requireObjectCoercible$2$5;
-var sameValue$4 = sameValue$1$3;
+var sameValue$5 = sameValue$1$4;
 var regExpExec$6 = regexpExecAbstract$4; // @@search logic
 
 fixRegExpWellKnownSymbolLogic$7('search', 1, function (SEARCH, nativeSearch, maybeCallNative) {
@@ -25885,9 +25897,9 @@ fixRegExpWellKnownSymbolLogic$7('search', 1, function (SEARCH, nativeSearch, may
     var rx = anObject$m(regexp);
     var S = String(this);
     var previousLastIndex = rx.lastIndex;
-    if (!sameValue$4(previousLastIndex, 0)) rx.lastIndex = 0;
+    if (!sameValue$5(previousLastIndex, 0)) rx.lastIndex = 0;
     var result = regExpExec$6(rx, S);
-    if (!sameValue$4(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
+    if (!sameValue$5(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
     return result === null ? -1 : result.index;
   }];
 });
@@ -40450,10 +40462,10 @@ var requireObjectCoercible$4$3 = function (it) {
 
 
 var IndexedObject$5 = indexedObject$3;
-var requireObjectCoercible$3$3 = requireObjectCoercible$4$3;
+var requireObjectCoercible$3$4 = requireObjectCoercible$4$3;
 
 var toIndexedObject$3$3 = function (it) {
-  return IndexedObject$5(requireObjectCoercible$3$3(it));
+  return IndexedObject$5(requireObjectCoercible$3$4(it));
 };
 
 var isObject$8$3 = function (it) {
@@ -41223,16 +41235,16 @@ var checkCorrectnessOfIteration$1$3 = function (exec, SKIP_CLOSING) {
   return ITERATION_SUPPORT;
 };
 
-var anObject$3$3 = anObject$8$3;
+var anObject$3$4 = anObject$8$3;
 var aFunction$3$3 = aFunction$5$3;
 var wellKnownSymbol$5$3 = wellKnownSymbol$d$3;
 var SPECIES$2$3 = wellKnownSymbol$5$3('species'); // `SpeciesConstructor` abstract operation
 // https://tc39.github.io/ecma262/#sec-speciesconstructor
 
 var speciesConstructor$1$3 = function (O, defaultConstructor) {
-  var C = anObject$3$3(O).constructor;
+  var C = anObject$3$4(O).constructor;
   var S;
-  return C === undefined || (S = anObject$3$3(C)[SPECIES$2$3]) == undefined ? defaultConstructor : aFunction$3$3(S);
+  return C === undefined || (S = anObject$3$4(C)[SPECIES$2$3]) == undefined ? defaultConstructor : aFunction$3$3(S);
 };
 
 var getBuiltIn$2$3 = getBuiltIn$5$3;
@@ -53600,22 +53612,22 @@ var addToUnscopables$4 = addToUnscopables$2$2;
 addToUnscopables$4('flatMap'); // `SameValue` abstract operation
 // https://tc39.github.io/ecma262/#sec-samevalue
 
-var sameValue$1$2 = Object.is || function is(x, y) {
+var sameValue$1$3 = Object.is || function is(x, y) {
   // eslint-disable-next-line no-self-compare
   return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
 };
 
 var fixRegExpWellKnownSymbolLogic$2$2 = fixRegexpWellKnownSymbolLogic$3;
-var anObject$3$2 = anObject$f$1;
-var requireObjectCoercible$3$2 = requireObjectCoercible$b$1;
-var sameValue$3 = sameValue$1$2;
-var regExpExec$1$2 = regexpExecAbstract$3; // @@search logic
+var anObject$3$3 = anObject$f$1;
+var requireObjectCoercible$3$3 = requireObjectCoercible$b$1;
+var sameValue$4 = sameValue$1$3;
+var regExpExec$1$3 = regexpExecAbstract$3; // @@search logic
 
 fixRegExpWellKnownSymbolLogic$2$2('search', 1, function (SEARCH, nativeSearch, maybeCallNative) {
   return [// `String.prototype.search` method
   // https://tc39.github.io/ecma262/#sec-string.prototype.search
   function search(regexp) {
-    var O = requireObjectCoercible$3$2(this);
+    var O = requireObjectCoercible$3$3(this);
     var searcher = regexp == undefined ? undefined : regexp[SEARCH];
     return searcher !== undefined ? searcher.call(regexp, O) : new RegExp(regexp)[SEARCH](String(O));
   }, // `RegExp.prototype[@@search]` method
@@ -53623,12 +53635,12 @@ fixRegExpWellKnownSymbolLogic$2$2('search', 1, function (SEARCH, nativeSearch, m
   function (regexp) {
     var res = maybeCallNative(nativeSearch, regexp, this);
     if (res.done) return res.value;
-    var rx = anObject$3$2(regexp);
+    var rx = anObject$3$3(regexp);
     var S = String(this);
     var previousLastIndex = rx.lastIndex;
-    if (!sameValue$3(previousLastIndex, 0)) rx.lastIndex = 0;
-    var result = regExpExec$1$2(rx, S);
-    if (!sameValue$3(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
+    if (!sameValue$4(previousLastIndex, 0)) rx.lastIndex = 0;
+    var result = regExpExec$1$3(rx, S);
+    if (!sameValue$4(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
     return result === null ? -1 : result.index;
   }];
 });
@@ -53917,14 +53929,14 @@ var defaultTheme = {
   semanticColors: semanticColors,
   textColors: textColors
 };
-var fixRegExpWellKnownSymbolLogic$1$2 = fixRegexpWellKnownSymbolLogic$3;
+var fixRegExpWellKnownSymbolLogic$1$3 = fixRegexpWellKnownSymbolLogic$3;
 var anObject$2$3 = anObject$f$1;
 var toLength$1$2 = toLength$a$1;
 var requireObjectCoercible$2$3 = requireObjectCoercible$b$1;
 var advanceStringIndex$1$3 = advanceStringIndex$3$1;
 var regExpExec$5 = regexpExecAbstract$3; // @@match logic
 
-fixRegExpWellKnownSymbolLogic$1$2('match', 1, function (MATCH, nativeMatch, maybeCallNative) {
+fixRegExpWellKnownSymbolLogic$1$3('match', 1, function (MATCH, nativeMatch, maybeCallNative) {
   return [// `String.prototype.match` method
   // https://tc39.github.io/ecma262/#sec-string.prototype.match
   function match(regexp) {
@@ -65244,7 +65256,7 @@ var __importDefault$m = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(avatar, "__esModule", { value: true });
 var styled_1$b = __importDefault$m(require$$0$4);
-var react_1$u = __importStar$d(React__default);
+var react_1$w = __importStar$d(React__default);
 var getSmallAvatar = function (avatar) {
     var _a, _b;
     if (!avatar)
@@ -65255,11 +65267,11 @@ var getSmallAvatar = function (avatar) {
 var Img = styled_1$b.default.img(templateObject_1$2I || (templateObject_1$2I = __makeTemplateObject$j(["\n    object-fit: cover;\n    width: 32px;\n    height: 32px;\n    margin-right: 8px;\n"], ["\n    object-fit: cover;\n    width: 32px;\n    height: 32px;\n    margin-right: 8px;\n"])));
 var Avatar$5 = function (_a) {
     var user = _a.user, _b = _a.className, className = _b === void 0 ? '' : _b;
-    var defaultAvatarId = react_1$u.useRef(Math.floor(Math.random() * 5) + 1);
+    var defaultAvatarId = react_1$w.useRef(Math.floor(Math.random() * 5) + 1);
     var url = user.avatar_url
         ? getSmallAvatar(user.avatar_url)
         : "https://media.giphy.com/avatars/default" + defaultAvatarId.current + ".gif";
-    return react_1$u.default.createElement(Img, { src: url, className: className });
+    return react_1$w.default.createElement(Img, { src: url, className: className });
 };
 avatar.default = Avatar$5;
 var templateObject_1$2I;
@@ -65570,17 +65582,17 @@ var __importDefault$l = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(verifiedBadge, "__esModule", { value: true });
 var js_brand_1$6 = dist$2;
-var react_1$t = __importDefault$l(React__default);
+var react_1$v = __importDefault$l(React__default);
 var VerifiedBadge = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.size, size = _c === void 0 ? 17 : _c, _d = _a.fill, fill = _d === void 0 ? '#15CDFF' : _d;
-    return (react_1$t.default.createElement("svg", { className: [VerifiedBadge.className, className].join(' '), height: size, width: "19px", viewBox: "0 0 19 17" },
-        react_1$t.default.createElement("path", { className: VerifiedBadge.checkMarkClassName, d: "M9.32727273,9.44126709 L9.32727273,3.03016561 L6.55027155,3.03016561 L6.55027155,10.8150746 L6.55027155,12.188882 L12.1042739,12.188882 L12.1042739,9.44126709 L9.32727273,9.44126709 Z", fill: js_brand_1$6.giphyBlack, transform: "translate(9.327273, 7.609524) scale(-1, 1) rotate(-45.000000) translate(-9.327273, -7.609524) " }),
-        react_1$t.default.createElement("g", { transform: "translate(-532.000000, -466.000000)", fill: fill },
-            react_1$t.default.createElement("g", { transform: "translate(141.000000, 235.000000)" },
-                react_1$t.default.createElement("g", { transform: "translate(264.000000, 0.000000)" },
-                    react_1$t.default.createElement("g", { transform: "translate(10.000000, 224.000000)" },
-                        react_1$t.default.createElement("g", { transform: "translate(114.000000, 2.500000)" },
-                            react_1$t.default.createElement("path", { d: "M15.112432,4.80769231 L16.8814194,6.87556817 L19.4157673,7.90116318 L19.6184416,10.6028916 L21.0594951,12.9065042 L19.6184416,15.2101168 L19.4157673,17.9118452 L16.8814194,18.9374402 L15.112432,21.0053161 L12.4528245,20.3611511 L9.79321699,21.0053161 L8.02422954,18.9374402 L5.48988167,17.9118452 L5.28720734,15.2101168 L3.84615385,12.9065042 L5.28720734,10.6028916 L5.48988167,7.90116318 L8.02422954,6.87556817 L9.79321699,4.80769231 L12.4528245,5.4518573 L15.112432,4.80769231 Z M17.8163503,10.8991009 L15.9282384,9.01098901 L11.5681538,13.3696923 L9.68115218,11.4818515 L7.81302031,13.3499833 L9.7011322,15.2380952 L11.5892441,17.1262071 L17.8163503,10.8991009 Z" }))))))));
+    return (react_1$v.default.createElement("svg", { className: [VerifiedBadge.className, className].join(' '), height: size, width: "19px", viewBox: "0 0 19 17" },
+        react_1$v.default.createElement("path", { className: VerifiedBadge.checkMarkClassName, d: "M9.32727273,9.44126709 L9.32727273,3.03016561 L6.55027155,3.03016561 L6.55027155,10.8150746 L6.55027155,12.188882 L12.1042739,12.188882 L12.1042739,9.44126709 L9.32727273,9.44126709 Z", fill: js_brand_1$6.giphyBlack, transform: "translate(9.327273, 7.609524) scale(-1, 1) rotate(-45.000000) translate(-9.327273, -7.609524) " }),
+        react_1$v.default.createElement("g", { transform: "translate(-532.000000, -466.000000)", fill: fill },
+            react_1$v.default.createElement("g", { transform: "translate(141.000000, 235.000000)" },
+                react_1$v.default.createElement("g", { transform: "translate(264.000000, 0.000000)" },
+                    react_1$v.default.createElement("g", { transform: "translate(10.000000, 224.000000)" },
+                        react_1$v.default.createElement("g", { transform: "translate(114.000000, 2.500000)" },
+                            react_1$v.default.createElement("path", { d: "M15.112432,4.80769231 L16.8814194,6.87556817 L19.4157673,7.90116318 L19.6184416,10.6028916 L21.0594951,12.9065042 L19.6184416,15.2101168 L19.4157673,17.9118452 L16.8814194,18.9374402 L15.112432,21.0053161 L12.4528245,20.3611511 L9.79321699,21.0053161 L8.02422954,18.9374402 L5.48988167,17.9118452 L5.28720734,15.2101168 L3.84615385,12.9065042 L5.28720734,10.6028916 L5.48988167,7.90116318 L8.02422954,6.87556817 L9.79321699,4.80769231 L12.4528245,5.4518573 L15.112432,4.80769231 Z M17.8163503,10.8991009 L15.9282384,9.01098901 L11.5681538,13.3696923 L9.68115218,11.4818515 L7.81302031,13.3499833 L9.7011322,15.2380952 L11.5892441,17.1262071 L17.8163503,10.8991009 Z" }))))))));
 };
 VerifiedBadge.className = 'giphy-verified-badge';
 VerifiedBadge.checkMarkClassName = 'giphy-verified-checkmark';
@@ -65623,7 +65635,7 @@ var __importDefault$k = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(attribution$1, "__esModule", { value: true });
 var styled_1$a = __importDefault$k(require$$0$4);
-var react_1$s = __importDefault$k(React__default);
+var react_1$u = __importDefault$k(React__default);
 var avatar_1$3 = __importDefault$k(avatar);
 var user_1$1 = __importDefault$k(user);
 var Container$b = styled_1$a.default.div(templateObject_1$2G || (templateObject_1$2G = __makeTemplateObject$h(["\n    display: flex;\n    align-items: center;\n    font-family: interface, helvetica, arial;\n"], ["\n    display: flex;\n    align-items: center;\n    font-family: interface, helvetica, arial;\n"])));
@@ -65634,7 +65646,7 @@ var Attribution$2 = function (_a) {
     if (!(user === null || user === void 0 ? void 0 : user.username) && !(user === null || user === void 0 ? void 0 : user.display_name)) {
         return null;
     }
-    return (react_1$s.default.createElement(Container$b, { className: [Attribution$2.className, className].join(' '), onClick: function (e) {
+    return (react_1$u.default.createElement(Container$b, { className: [Attribution$2.className, className].join(' '), onClick: function (e) {
             e.preventDefault();
             e.stopPropagation();
             if (onClick) {
@@ -65646,8 +65658,8 @@ var Attribution$2 = function (_a) {
                     window.open(url, '_blank');
             }
         } },
-        react_1$s.default.createElement(Avatar$4, { user: user }),
-        react_1$s.default.createElement(user_1$1.default, { user: gif.user })));
+        react_1$u.default.createElement(Avatar$4, { user: user }),
+        react_1$u.default.createElement(user_1$1.default, { user: gif.user })));
 };
 Attribution$2.className = 'giphy-attribution';
 attribution$1.default = Attribution$2;
@@ -65683,21 +65695,21 @@ var __importDefault$j = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(overlay, "__esModule", { value: true });
 var styled_1$9 = __importDefault$j(require$$0$4);
-var react_1$r = __importStar$c(React__default);
+var react_1$t = __importStar$c(React__default);
 var _1$1 = __importDefault$j(attribution$1);
 var Background = styled_1$9.default.div(templateObject_1$2F || (templateObject_1$2F = __makeTemplateObject$g(["\n    background: linear-gradient(rgba(0, 0, 0, 0), rgba(18, 18, 18, 0.6));\n    cursor: default;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 75px;\n    pointer-events: none;\n"], ["\n    background: linear-gradient(rgba(0, 0, 0, 0), rgba(18, 18, 18, 0.6));\n    cursor: default;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 75px;\n    pointer-events: none;\n"])));
 var Attribution$1 = styled_1$9.default(_1$1.default)(templateObject_2$1N || (templateObject_2$1N = __makeTemplateObject$g(["\n    position: absolute;\n    bottom: 10px;\n    left: 10px;\n    right: 10px;\n"], ["\n    position: absolute;\n    bottom: 10px;\n    left: 10px;\n    right: 10px;\n"])));
 var Container$a = styled_1$9.default.div(templateObject_3$1f || (templateObject_3$1f = __makeTemplateObject$g(["\n    transition: opacity 150ms ease-in;\n"], ["\n    transition: opacity 150ms ease-in;\n"])));
 var AttributionOverlay = function (_a) {
     var gif = _a.gif, isHovered = _a.isHovered, onClick = _a.onClick;
-    var hasHovered = react_1$r.useRef(isHovered);
+    var hasHovered = react_1$t.useRef(isHovered);
     if (isHovered) {
         // not rendering to avoid loading the avatar until hover
         hasHovered.current = true;
     }
-    return gif.user && hasHovered.current ? (react_1$r.default.createElement(Container$a, { style: { opacity: isHovered ? 1 : 0 } },
-        react_1$r.default.createElement(Background, null),
-        react_1$r.default.createElement(Attribution$1, { gif: gif, onClick: onClick }))) : null;
+    return gif.user && hasHovered.current ? (react_1$t.default.createElement(Container$a, { style: { opacity: isHovered ? 1 : 0 } },
+        react_1$t.default.createElement(Background, null),
+        react_1$t.default.createElement(Attribution$1, { gif: gif, onClick: onClick }))) : null;
 };
 overlay.default = AttributionOverlay;
 var templateObject_1$2F, templateObject_2$1N, templateObject_3$1f;
@@ -67652,7 +67664,7 @@ var stringify = stringify_1;
 var parse = parse$1;
 var formats = formats$3;
 
-var lib$2 = {
+var lib$3 = {
     formats: formats,
     parse: parse,
     stringify: stringify
@@ -67920,7 +67932,7 @@ Object.defineProperty(api, "__esModule", { value: true });
 api.GiphyFetch = void 0;
 /* eslint-disable no-dupe-class-members */
 var js_util_1$8 = dist$3;
-var qs_1 = __importDefault$i(lib$2);
+var qs_1 = __importDefault$i(lib$3);
 var gif_1$2 = gif$1;
 var request_1 = __importDefault$i(request);
 var getType = function (options) { return (options && options.type ? options.type : 'gifs'); };
@@ -68419,11 +68431,11 @@ var __importStar$b = (commonjsGlobal$7 && commonjsGlobal$7.__importStar) || func
     return result;
 };
 Object.defineProperty(observer, "__esModule", { value: true });
-var react_1$q = __importStar$b(React__default);
+var react_1$s = __importStar$b(React__default);
 var Observer$1 = function (_a) {
     var children = _a.children, className = _a.className, onVisibleChange = _a.onVisibleChange, config = _a.config;
-    var container = react_1$q.useRef(null);
-    react_1$q.useEffect(function () {
+    var container = react_1$s.useRef(null);
+    react_1$s.useEffect(function () {
         var io;
         if (container.current) {
             io = new IntersectionObserver(function (_a) {
@@ -68435,7 +68447,7 @@ var Observer$1 = function (_a) {
         }
         return function () { return io === null || io === void 0 ? void 0 : io.disconnect(); };
     }, [onVisibleChange, container, config]);
-    return (react_1$q.default.createElement("div", { ref: container, className: className }, children));
+    return (react_1$s.default.createElement("div", { ref: container, className: className }, children));
 };
 observer.default = Observer$1;
 
@@ -68961,7 +68973,7 @@ Object.defineProperty(carousel, "__esModule", { value: true });
 var styled_1$8 = __importDefault$f(require$$0$4);
 var js_fetch_api_1$1 = dist$1;
 var js_util_1$3 = dist$3;
-var react_1$p = __importStar$a(React__default);
+var react_1$r = __importStar$a(React__default);
 var throttle_debounce_1$1 = cjs;
 var observer_1$1 = __importDefault$f(observer);
 var gif_1$1 = __importDefault$f(gif);
@@ -69042,20 +69054,20 @@ var Carousel$1 = /** @class */ (function (_super) {
         var _d = this.state, gifs = _d.gifs, isDoneFetching = _d.isDoneFetching;
         var showLoader = !isDoneFetching;
         var isFirstLoad = gifs.length === 0;
-        return (react_1$p.default.createElement(pingback_context_manager_1$1.default, { attributes: { layout_type: 'CAROUSEL' } },
-            react_1$p.default.createElement(Container$9, { className: className },
+        return (react_1$r.default.createElement(pingback_context_manager_1$1.default, { attributes: { layout_type: 'CAROUSEL' } },
+            react_1$r.default.createElement(Container$9, { className: className },
                 gifs.map(function (gif) {
                     var gifWidth = js_util_1$3.getGifWidth(gif, gifHeight);
-                    return (react_1$p.default.createElement(Gif, { gif: gif, key: gif.id, tabIndex: tabIndex, width: gifWidth, onGifClick: onGifClick, onGifSeen: onGifSeen, onGifVisible: onGifVisible, onGifRightClick: onGifRightClick, user: user, ml: gutter, overlay: overlay, hideAttribution: hideAttribution, noLink: noLink, borderRadius: borderRadius, backgroundColor: backgroundColor }));
+                    return (react_1$r.default.createElement(Gif, { gif: gif, key: gif.id, tabIndex: tabIndex, width: gifWidth, onGifClick: onGifClick, onGifSeen: onGifSeen, onGifVisible: onGifVisible, onGifRightClick: onGifRightClick, user: user, ml: gutter, overlay: overlay, hideAttribution: hideAttribution, noLink: noLink, borderRadius: borderRadius, backgroundColor: backgroundColor }));
                 }),
                 !showLoader && gifs.length === 0 && noResultsMessage,
-                showLoader && (react_1$p.default.createElement(Observer, { onVisibleChange: this.onLoaderVisible, config: loaderConfig },
-                    react_1$p.default.createElement(Loader$2, { isFirstLoad: isFirstLoad, height: gifHeight }))))));
+                showLoader && (react_1$r.default.createElement(Observer, { onVisibleChange: this.onLoaderVisible, config: loaderConfig },
+                    react_1$r.default.createElement(Loader$2, { isFirstLoad: isFirstLoad, height: gifHeight }))))));
     };
     Carousel.className = 'giphy-carousel';
     Carousel.defaultProps = defaultProps$1;
     return Carousel;
-}(react_1$p.PureComponent));
+}(react_1$r.PureComponent));
 carousel.default = Carousel$1;
 var templateObject_1$2E, templateObject_2$1M, templateObject_3$1e, templateObject_4$Q;
 
@@ -69073,13 +69085,13 @@ var __importDefault$e = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(fetchError, "__esModule", { value: true });
 var styled_1$7 = __importDefault$e(require$$0$4);
 var js_brand_1$5 = dist$2;
-var react_1$o = __importDefault$e(React__default);
+var react_1$q = __importDefault$e(React__default);
 var Message$1 = styled_1$7.default.div(templateObject_1$2D || (templateObject_1$2D = __makeTemplateObject$e(["\n    color: ", ";\n    display: flex;\n    justify-content: center;\n    margin: 30px 0;\n    font-family: ", ";\n    font-size: 16px;\n    font-weight: 600;\n    a {\n        color: ", ";\n        cursor: pointer;\n        &:hover {\n            color: white;\n        }\n    }\n"], ["\n    color: ", ";\n    display: flex;\n    justify-content: center;\n    margin: 30px 0;\n    font-family: ", ";\n    font-size: 16px;\n    font-weight: 600;\n    a {\n        color: ", ";\n        cursor: pointer;\n        &:hover {\n            color: white;\n        }\n    }\n"])), js_brand_1$5.giphyLightGrey, js_brand_1$5.fontFamily.body, js_brand_1$5.giphyBlue);
 var FetchError = function (_a) {
     var onClick = _a.onClick;
-    return (react_1$o.default.createElement(Message$1, null,
+    return (react_1$q.default.createElement(Message$1, null,
         "Error loading GIFs.\u00A0",
-        react_1$o.default.createElement("a", { onClick: onClick }, "Try again?")));
+        react_1$q.default.createElement("a", { onClick: onClick }, "Try again?")));
 };
 fetchError.default = FetchError;
 var templateObject_1$2D;
@@ -69097,19 +69109,19 @@ Object.defineProperty(loader, "__esModule", { value: true });
 var core_1$4 = require$$0$1;
 var styled_1$6 = __importDefault$d(require$$0$4);
 var js_brand_1$4 = dist$2;
-var react_1$n = __importDefault$d(React__default);
+var react_1$p = __importDefault$d(React__default);
 var bouncer = core_1$4.keyframes(templateObject_1$2C || (templateObject_1$2C = __makeTemplateObject$d(["\n     to {\n    transform: scale(1.75) translateY(-20px);\n  }\n"], ["\n     to {\n    transform: scale(1.75) translateY(-20px);\n  }\n"])));
 var loaderHeight = 37;
 var Loader$1 = styled_1$6.default.div(templateObject_2$1L || (templateObject_2$1L = __makeTemplateObject$d(["\n    display: flex;\n    align-items: center;\n    height: ", "px;\n    padding-top: 15px;\n    margin: 0 auto;\n    text-align: center;\n    justify-content: center;\n    animation: pulse 0.8s ease-in-out 0s infinite alternate backwards;\n"], ["\n    display: flex;\n    align-items: center;\n    height: ", "px;\n    padding-top: 15px;\n    margin: 0 auto;\n    text-align: center;\n    justify-content: center;\n    animation: pulse 0.8s ease-in-out 0s infinite alternate backwards;\n"])), loaderHeight);
 var Dot = styled_1$6.default.div(templateObject_3$1d || (templateObject_3$1d = __makeTemplateObject$d(["\n    display: inline-block;\n    height: 10px;\n    width: 10px;\n    margin: ", "px 10px 10px 10px;\n    position: relative;\n    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);\n    animation: ", " cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.75s infinite alternate;\n    background: ", ";\n    animation-delay: ", ";\n"], ["\n    display: inline-block;\n    height: 10px;\n    width: 10px;\n    margin: ", "px 10px 10px 10px;\n    position: relative;\n    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);\n    animation: ", " cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.75s infinite alternate;\n    background: ", ";\n    animation-delay: ", ";\n"])), loaderHeight, bouncer, function (props) { return props.color; }, function (props) { return props.delay; });
 loader.default = (function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b;
-    return (react_1$n.default.createElement(Loader$1, { className: className },
-        react_1$n.default.createElement(Dot, { color: js_brand_1$4.giphyGreen, delay: "0" }),
-        react_1$n.default.createElement(Dot, { color: js_brand_1$4.giphyBlue, delay: ".1s" }),
-        react_1$n.default.createElement(Dot, { color: js_brand_1$4.giphyPurple, delay: ".2s" }),
-        react_1$n.default.createElement(Dot, { color: js_brand_1$4.giphyRed, delay: ".3s" }),
-        react_1$n.default.createElement(Dot, { color: js_brand_1$4.giphyYellow, delay: ".4s" })));
+    return (react_1$p.default.createElement(Loader$1, { className: className },
+        react_1$p.default.createElement(Dot, { color: js_brand_1$4.giphyGreen, delay: "0" }),
+        react_1$p.default.createElement(Dot, { color: js_brand_1$4.giphyBlue, delay: ".1s" }),
+        react_1$p.default.createElement(Dot, { color: js_brand_1$4.giphyPurple, delay: ".2s" }),
+        react_1$p.default.createElement(Dot, { color: js_brand_1$4.giphyRed, delay: ".3s" }),
+        react_1$p.default.createElement(Dot, { color: js_brand_1$4.giphyYellow, delay: ".4s" })));
 });
 var templateObject_1$2C, templateObject_2$1L, templateObject_3$1d;
 
@@ -69135,7 +69147,7 @@ var __importStar$9 = (commonjsGlobal$7 && commonjsGlobal$7.__importStar) || func
     return result;
 };
 Object.defineProperty(masonryGrid, "__esModule", { value: true });
-var react_1$m = __importStar$9(React__default);
+var react_1$o = __importStar$9(React__default);
 function fillArray(length, columnOffsets) {
     if (columnOffsets === void 0) { columnOffsets = []; }
     return Array.apply(null, Array(length)).map(function (_, index) { return columnOffsets[index] || 0; });
@@ -69146,7 +69158,7 @@ var MasonryGrid = function (_a) {
     function getChildren() {
         var columnTarget;
         var columnHeights = fillArray(columns, columnOffsets);
-        var result = react_1$m.default.Children.map(children, function (child, index) {
+        var result = react_1$o.default.Children.map(children, function (child, index) {
             var style = {
                 position: 'absolute',
             };
@@ -69165,16 +69177,16 @@ var MasonryGrid = function (_a) {
             if (height) {
                 columnHeights[columnTarget] += height + gutter;
             }
-            return react_1$m.default.cloneElement(child, { style: style });
+            return react_1$o.default.cloneElement(child, { style: style });
         });
         containerStyle.position = 'relative';
         containerStyle.width = columns * itemWidth + (columns - 1) * gutter + "px";
         containerStyle.height = Math.max.apply(Math, columnHeights) - gutter + "px";
         return result;
     }
-    return react_1$m.default.createElement("div", { style: containerStyle }, getChildren());
+    return react_1$o.default.createElement("div", { style: containerStyle }, getChildren());
 };
-masonryGrid.default = react_1$m.memo(MasonryGrid);
+masonryGrid.default = react_1$o.memo(MasonryGrid);
 
 var __makeTemplateObject$c = (commonjsGlobal$7 && commonjsGlobal$7.__makeTemplateObject) || function (cooked, raw) {
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
@@ -69268,7 +69280,7 @@ Object.defineProperty(grid, "__esModule", { value: true });
 var styled_1$5 = __importDefault$c(require$$0$4);
 var js_fetch_api_1 = dist$1;
 var js_util_1$2 = dist$3;
-var react_1$l = __importStar$8(React__default);
+var react_1$n = __importStar$8(React__default);
 var throttle_debounce_1 = cjs;
 var observer_1 = __importDefault$c(observer);
 var fetch_error_1 = __importDefault$c(fetchError);
@@ -69358,13 +69370,13 @@ var Grid$1 = /** @class */ (function (_super) {
         var isFirstLoad = gifs.length === 0;
         // get the height of each grid item
         var itemHeights = gifs.map(function (gif) { return js_util_1$2.getGifHeight(gif, gifWidth); });
-        return (react_1$l.default.createElement(pingback_context_manager_1.default, { attributes: { layout_type: layoutType } },
-            react_1$l.default.createElement("div", { className: className, style: { width: width } },
-                react_1$l.default.createElement(masonry_grid_1.default, { itemHeights: itemHeights, useTransform: useTransform, itemWidth: gifWidth, columns: columns, gutter: gutter, columnOffsets: columnOffsets }, gifs.map(function (gif) { return (react_1$l.default.createElement(gif_1.default, { gif: gif, tabIndex: tabIndex, key: gif.id, width: gifWidth, onGifClick: onGifClick, onGifSeen: onGifSeen, onGifVisible: onGifVisible, onGifRightClick: onGifRightClick, user: user, overlay: overlay, backgroundColor: backgroundColor, hideAttribution: hideAttribution, noLink: noLink, borderRadius: borderRadius })); })),
+        return (react_1$n.default.createElement(pingback_context_manager_1.default, { attributes: { layout_type: layoutType } },
+            react_1$n.default.createElement("div", { className: className, style: { width: width } },
+                react_1$n.default.createElement(masonry_grid_1.default, { itemHeights: itemHeights, useTransform: useTransform, itemWidth: gifWidth, columns: columns, gutter: gutter, columnOffsets: columnOffsets }, gifs.map(function (gif) { return (react_1$n.default.createElement(gif_1.default, { gif: gif, tabIndex: tabIndex, key: gif.id, width: gifWidth, onGifClick: onGifClick, onGifSeen: onGifSeen, onGifVisible: onGifVisible, onGifRightClick: onGifRightClick, user: user, overlay: overlay, backgroundColor: backgroundColor, hideAttribution: hideAttribution, noLink: noLink, borderRadius: borderRadius })); })),
                 !showLoader && gifs.length === 0 && noResultsMessage,
-                isError ? (react_1$l.default.createElement(fetch_error_1.default, { onClick: this.onFetch })) : (showLoader && (react_1$l.default.createElement(observer_1.default, { onVisibleChange: this.onLoaderVisible, config: loaderConfig },
-                    react_1$l.default.createElement(Loader, { isFirstLoad: isFirstLoad },
-                        react_1$l.default.createElement(LoaderVisual, { className: Grid.loaderClassName }))))))));
+                isError ? (react_1$n.default.createElement(fetch_error_1.default, { onClick: this.onFetch })) : (showLoader && (react_1$n.default.createElement(observer_1.default, { onVisibleChange: this.onLoaderVisible, config: loaderConfig },
+                    react_1$n.default.createElement(Loader, { isFirstLoad: isFirstLoad },
+                        react_1$n.default.createElement(LoaderVisual, { className: Grid.loaderClassName }))))))));
     };
     Grid.className = 'giphy-grid';
     Grid.loaderClassName = 'loader';
@@ -69380,27 +69392,27 @@ var Grid$1 = /** @class */ (function (_super) {
         return null;
     };
     return Grid;
-}(react_1$l.PureComponent));
+}(react_1$n.PureComponent));
 grid.default = Grid$1;
 var templateObject_1$2B;
 
 var searchBar = {};
 
-var useDebounce$3 = {};
+var useDebounce$5 = {};
 
 var require$$0 = /*@__PURE__*/getAugmentedNamespace(_tslib);
 
 var useTimeoutFn$2 = {};
 
 Object.defineProperty(useTimeoutFn$2, "__esModule", { value: true });
-var react_1$k = React__default;
+var react_1$m = React__default;
 function useTimeoutFn$1(fn, ms) {
     if (ms === void 0) { ms = 0; }
-    var ready = react_1$k.useRef(false);
-    var timeout = react_1$k.useRef();
-    var callback = react_1$k.useRef(fn);
-    var isReady = react_1$k.useCallback(function () { return ready.current; }, []);
-    var set = react_1$k.useCallback(function () {
+    var ready = react_1$m.useRef(false);
+    var timeout = react_1$m.useRef();
+    var callback = react_1$m.useRef(fn);
+    var isReady = react_1$m.useCallback(function () { return ready.current; }, []);
+    var set = react_1$m.useCallback(function () {
         ready.current = false;
         timeout.current && clearTimeout(timeout.current);
         timeout.current = setTimeout(function () {
@@ -69408,16 +69420,16 @@ function useTimeoutFn$1(fn, ms) {
             callback.current();
         }, ms);
     }, [ms]);
-    var clear = react_1$k.useCallback(function () {
+    var clear = react_1$m.useCallback(function () {
         ready.current = null;
         timeout.current && clearTimeout(timeout.current);
     }, []);
     // update ref when function changes
-    react_1$k.useEffect(function () {
+    react_1$m.useEffect(function () {
         callback.current = fn;
     }, [fn]);
     // set on mount, clear on unmount
-    react_1$k.useEffect(function () {
+    react_1$m.useEffect(function () {
         set();
         return clear;
     }, [ms]);
@@ -69425,18 +69437,18 @@ function useTimeoutFn$1(fn, ms) {
 }
 useTimeoutFn$2.default = useTimeoutFn$1;
 
-Object.defineProperty(useDebounce$3, "__esModule", { value: true });
+Object.defineProperty(useDebounce$5, "__esModule", { value: true });
 var tslib_1$9 = require$$0;
-var react_1$j = React__default;
+var react_1$l = React__default;
 var useTimeoutFn_1 = tslib_1$9.__importDefault(useTimeoutFn$2);
-function useDebounce$2(fn, ms, deps) {
+function useDebounce$4(fn, ms, deps) {
     if (ms === void 0) { ms = 0; }
     if (deps === void 0) { deps = []; }
     var _a = useTimeoutFn_1.default(fn, ms), isReady = _a[0], cancel = _a[1], reset = _a[2];
-    react_1$j.useEffect(reset, deps);
+    react_1$l.useEffect(reset, deps);
     return [isReady, cancel];
 }
-useDebounce$3.default = useDebounce$2;
+useDebounce$5.default = useDebounce$4;
 
 var context = {};
 
@@ -69784,7 +69796,7 @@ var __importDefault$a = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(searchBarChannel, "__esModule", { value: true });
 var core_1$2 = require$$0$1;
 var js_brand_1$3 = dist$2;
-var react_1$i = __importStar$7(React__default);
+var react_1$k = __importStar$7(React__default);
 var avatar_1$2 = __importDefault$a(avatar);
 var verified_badge_1$1 = __importDefault$a(verifiedBadge);
 var context_1$4 = context;
@@ -69798,14 +69810,14 @@ var Username = theme_1$4.default.div(templateObject_3$1b || (templateObject_3$1b
 var UsernamePill = theme_1$4.default.div(templateObject_4$P || (templateObject_4$P = __makeTemplateObject$a(["\n    background: ", ";\n    display: flex;\n    padding: 0 4px;\n    color: ", ";\n    font-family: interface, Helvetica Neue, helvetica, sans-serif;\n    font-weight: 600;\n    font-size: 12px;\n    align-items: center;\n    height: ", "px;\n    @media (", ") {\n        display: none;\n    }\n"], ["\n    background: ", ";\n    display: flex;\n    padding: 0 4px;\n    color: ", ";\n    font-family: interface, Helvetica Neue, helvetica, sans-serif;\n    font-weight: 600;\n    font-size: 12px;\n    align-items: center;\n    height: ", "px;\n    @media (", ") {\n        display: none;\n    }\n"])), js_brand_1$3.giphyWhiteSmoke, js_brand_1$3.giphyDarkCharcoal, function (props) { return channelSearchHeight(props.theme); }, function (props) { return props.theme.condensedMediaQuery; });
 var SearchBarChannel = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b;
-    var activeChannel = react_1$i.useContext(context_1$4.SearchContext).activeChannel;
-    return activeChannel ? (react_1$i.default.createElement(Username, { className: className },
-        react_1$i.default.createElement(Avatar$3, { user: activeChannel.user }),
-        react_1$i.default.createElement(UsernamePill, { key: activeChannel.id },
-            react_1$i.default.createElement("div", null,
+    var activeChannel = react_1$k.useContext(context_1$4.SearchContext).activeChannel;
+    return activeChannel ? (react_1$k.default.createElement(Username, { className: className },
+        react_1$k.default.createElement(Avatar$3, { user: activeChannel.user }),
+        react_1$k.default.createElement(UsernamePill, { key: activeChannel.id },
+            react_1$k.default.createElement("div", null,
                 "@",
                 activeChannel.user.username),
-            activeChannel.user.is_verified && react_1$i.default.createElement(verified_badge_1$1.default, { size: 14 })))) : null;
+            activeChannel.user.is_verified && react_1$k.default.createElement(verified_badge_1$1.default, { size: 14 })))) : null;
 };
 searchBarChannel.default = SearchBarChannel;
 var templateObject_1$2z, templateObject_2$1J, templateObject_3$1b, templateObject_4$P;
@@ -69819,18 +69831,18 @@ var useUnmount$3 = {};
 var useEffectOnce$3 = {};
 
 Object.defineProperty(useEffectOnce$3, "__esModule", { value: true });
-var react_1$h = React__default;
+var react_1$j = React__default;
 var useEffectOnce$2 = function (effect) {
-    react_1$h.useEffect(effect, []);
+    react_1$j.useEffect(effect, []);
 };
 useEffectOnce$3.default = useEffectOnce$2;
 
 Object.defineProperty(useUnmount$3, "__esModule", { value: true });
 var tslib_1$8 = require$$0;
-var react_1$g = React__default;
+var react_1$i = React__default;
 var useEffectOnce_1 = tslib_1$8.__importDefault(useEffectOnce$3);
 var useUnmount$2 = function (fn) {
-    var fnRef = react_1$g.useRef(fn);
+    var fnRef = react_1$i.useRef(fn);
     // update the ref each render so if it change the newest callback will be invoked
     fnRef.current = fn;
     useEffectOnce_1.default(function () { return function () { return fnRef.current(); }; });
@@ -69839,15 +69851,15 @@ useUnmount$3.default = useUnmount$2;
 
 Object.defineProperty(useThrottle$3, "__esModule", { value: true });
 var tslib_1$7 = require$$0;
-var react_1$f = React__default;
+var react_1$h = React__default;
 var useUnmount_1 = tslib_1$7.__importDefault(useUnmount$3);
 var useThrottle$2 = function (value, ms) {
     if (ms === void 0) { ms = 200; }
-    var _a = react_1$f.useState(value), state = _a[0], setState = _a[1];
-    var timeout = react_1$f.useRef();
-    var nextValue = react_1$f.useRef(null);
-    var hasNextValue = react_1$f.useRef(0);
-    react_1$f.useEffect(function () {
+    var _a = react_1$h.useState(value), state = _a[0], setState = _a[1];
+    var timeout = react_1$h.useRef();
+    var nextValue = react_1$h.useRef(null);
+    var hasNextValue = react_1$h.useRef(0);
+    react_1$h.useEffect(function () {
         if (!timeout.current) {
             setState(value);
             var timeoutCallback_1 = function () {
@@ -69880,20 +69892,20 @@ var __importDefault$9 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(searchIcon, "__esModule", { value: true });
-var react_1$e = __importDefault$9(React__default);
+var react_1$g = __importDefault$9(React__default);
 var SearchIcon$1 = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b;
-    return (react_1$e.default.createElement("svg", { viewBox: "0 0 30 30", version: "1.1", className: className },
-        react_1$e.default.createElement("defs", null,
-            react_1$e.default.createElement("path", { d: "M11.5482521,20.4090671 L4.24727698,28.2009189 C3.68084207,28.8054377 2.73159653,28.8363108 2.12707771,28.2698759 C1.5225589,27.703441 1.4916858,26.7541954 2.0581207,26.1496766 L9.40599838,18.3077689 C7.95982241,16.4371424 7.0978836,14.0789715 7.0978836,11.5181818 C7.0978836,5.44914339 11.9392549,0.518181818 17.9252787,0.518181818 C23.9113026,0.518181818 28.7526738,5.44914339 28.7526738,11.5181818 C28.7526738,17.5872202 23.9113026,22.5181818 17.9252787,22.5181818 C15.539851,22.5181818 13.3361963,21.7351359 11.5482521,20.4090671 Z M17.9252787,19.5181818 C22.242011,19.5181818 25.7526738,15.9425536 25.7526738,11.5181818 C25.7526738,7.09381 22.242011,3.51818182 17.9252787,3.51818182 C13.6085464,3.51818182 10.0978836,7.09381 10.0978836,11.5181818 C10.0978836,15.9425536 13.6085464,19.5181818 17.9252787,19.5181818 Z", id: "giphy-search-icon-path-1" })),
-        react_1$e.default.createElement("g", { id: "search", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
-            react_1$e.default.createElement("g", { id: "icons/search" },
-                react_1$e.default.createElement("mask", { id: "giphy-search-icon-mask-2", fill: "white" },
-                    react_1$e.default.createElement("use", { xlinkHref: "#giphy-search-icon-path-1" })),
-                react_1$e.default.createElement("use", { id: "Mask", fill: "#FFFFFF", fillRule: "nonzero", xlinkHref: "#giphy-search-icon-path-1" }),
-                react_1$e.default.createElement("g", { mask: "url(#giphy-search-icon-mask-2)" },
-                    react_1$e.default.createElement("g", { transform: "translate(0.250000, 0.250000)" },
-                        react_1$e.default.createElement("g", null)))))));
+    return (react_1$g.default.createElement("svg", { viewBox: "0 0 30 30", version: "1.1", className: className },
+        react_1$g.default.createElement("defs", null,
+            react_1$g.default.createElement("path", { d: "M11.5482521,20.4090671 L4.24727698,28.2009189 C3.68084207,28.8054377 2.73159653,28.8363108 2.12707771,28.2698759 C1.5225589,27.703441 1.4916858,26.7541954 2.0581207,26.1496766 L9.40599838,18.3077689 C7.95982241,16.4371424 7.0978836,14.0789715 7.0978836,11.5181818 C7.0978836,5.44914339 11.9392549,0.518181818 17.9252787,0.518181818 C23.9113026,0.518181818 28.7526738,5.44914339 28.7526738,11.5181818 C28.7526738,17.5872202 23.9113026,22.5181818 17.9252787,22.5181818 C15.539851,22.5181818 13.3361963,21.7351359 11.5482521,20.4090671 Z M17.9252787,19.5181818 C22.242011,19.5181818 25.7526738,15.9425536 25.7526738,11.5181818 C25.7526738,7.09381 22.242011,3.51818182 17.9252787,3.51818182 C13.6085464,3.51818182 10.0978836,7.09381 10.0978836,11.5181818 C10.0978836,15.9425536 13.6085464,19.5181818 17.9252787,19.5181818 Z", id: "giphy-search-icon-path-1" })),
+        react_1$g.default.createElement("g", { id: "search", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
+            react_1$g.default.createElement("g", { id: "icons/search" },
+                react_1$g.default.createElement("mask", { id: "giphy-search-icon-mask-2", fill: "white" },
+                    react_1$g.default.createElement("use", { xlinkHref: "#giphy-search-icon-path-1" })),
+                react_1$g.default.createElement("use", { id: "Mask", fill: "#FFFFFF", fillRule: "nonzero", xlinkHref: "#giphy-search-icon-path-1" }),
+                react_1$g.default.createElement("g", { mask: "url(#giphy-search-icon-mask-2)" },
+                    react_1$g.default.createElement("g", { transform: "translate(0.250000, 0.250000)" },
+                        react_1$g.default.createElement("g", null)))))));
 };
 searchIcon.default = SearchIcon$1;
 
@@ -69925,7 +69937,7 @@ var __importDefault$8 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(searchButton, "__esModule", { value: true });
 var core_1$1 = require$$0$1;
-var react_1$d = __importStar$6(React__default);
+var react_1$f = __importStar$6(React__default);
 var useThrottle_1 = __importDefault$8(useThrottle$3);
 var context_1$3 = context;
 var search_icon_1 = __importDefault$8(searchIcon);
@@ -69943,14 +69955,14 @@ var Fx = theme_1$3.default.div(templateObject_6$v || (templateObject_6$v = __mak
 var Scanner = theme_1$3.default.div(templateObject_7$o || (templateObject_7$o = __makeTemplateObject$9(["\n    position: absolute;\n    width: 200%;\n    height: 20px;\n    background: rgba(255, 255, 255, 0.5);\n    transform: rotate(34deg) translate(-10px, -20px);\n    animation: ", " 1s ", " 0s 1;\n    filter: blur(1px);\n"], ["\n    position: absolute;\n    width: 200%;\n    height: 20px;\n    background: rgba(255, 255, 255, 0.5);\n    transform: rotate(34deg) translate(-10px, -20px);\n    animation: ", " 1s ", " 0s 1;\n    filter: blur(1px);\n"])), searchFx, strongEasing);
 var SearchIcon = theme_1$3.default(search_icon_1.default)(templateObject_8$m || (templateObject_8$m = __makeTemplateObject$9(["\n    z-index: 1;\n    display: flex;\n    width: 60%;\n    height: 60%;\n"], ["\n    z-index: 1;\n    display: flex;\n    width: 60%;\n    height: 60%;\n"])));
 var SearchButton = function () {
-    var isFetching = react_1$d.useContext(context_1$3.SearchContext).isFetching;
+    var isFetching = react_1$f.useContext(context_1$3.SearchContext).isFetching;
     // let the animation run by throttling isFetching
     var throttledFetch = useThrottle_1.default(isFetching, 1000);
-    return (react_1$d.default.createElement(Container$8, null,
-        react_1$d.default.createElement(GradientBox, null),
-        react_1$d.default.createElement(SearchIcon, null),
-        throttledFetch && (react_1$d.default.createElement(Fx, null,
-            react_1$d.default.createElement(Scanner, null)))));
+    return (react_1$f.default.createElement(Container$8, null,
+        react_1$f.default.createElement(GradientBox, null),
+        react_1$f.default.createElement(SearchIcon, null),
+        throttledFetch && (react_1$f.default.createElement(Fx, null,
+            react_1$f.default.createElement(Scanner, null)))));
 };
 searchButton.default = SearchButton;
 var templateObject_1$2y, templateObject_2$1I, templateObject_3$1a, templateObject_4$O, templateObject_5$G, templateObject_6$v, templateObject_7$o, templateObject_8$m;
@@ -69984,15 +69996,15 @@ var __importDefault$7 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(searchBar, "__esModule", { value: true });
 var core_1 = require$$0$1;
 var js_brand_1$2 = dist$2;
-var react_1$c = __importStar$5(React__default);
-var useDebounce_1 = __importDefault$7(useDebounce$3);
+var react_1$e = __importStar$5(React__default);
+var useDebounce_1$1 = __importDefault$7(useDebounce$5);
 var context_1$2 = context;
 var search_bar_channel_1 = __importDefault$7(searchBarChannel);
 var search_button_1 = __importDefault$7(searchButton);
 var theme_1$2 = __importStar$5(theme);
 function usePrevious$1(value) {
-    var ref = react_1$c.useRef(value);
-    react_1$c.useEffect(function () {
+    var ref = react_1$e.useRef(value);
+    react_1$e.useEffect(function () {
         ref.current = value;
     });
     return ref.current;
@@ -70004,24 +70016,24 @@ var Input = theme_1$2.default.input(templateObject_3$19 || (templateObject_3$19
 });
 var SearchBar = function (_a) {
     var className = _a.className, _b = _a.placeholder, placeholder = _b === void 0 ? "Search GIPHY" : _b, _c = _a.clear, clear = _c === void 0 ? false : _c, autoFocus = _a.autoFocus;
-    var _d = react_1$c.useContext(context_1$2.SearchContext), setSearch = _d.setSearch, activeChannel = _d.activeChannel, setActiveChannel = _d.setActiveChannel, term = _d.term, channelSearch = _d.channelSearch;
+    var _d = react_1$e.useContext(context_1$2.SearchContext), setSearch = _d.setSearch, activeChannel = _d.activeChannel, setActiveChannel = _d.setActiveChannel, term = _d.term, channelSearch = _d.channelSearch;
     // debounce local input
-    var _e = react_1$c.useState(term), debouncedTerm = _e[0], setDebouncedInput = _e[1];
+    var _e = react_1$e.useState(term), debouncedTerm = _e[0], setDebouncedInput = _e[1];
     // used to see if the last term was a '' before clearing
     var lastTerm = usePrevious$1(debouncedTerm);
     // set the term when it changes
-    useDebounce_1.default(function () { return setSearch(debouncedTerm); }, SEARCH_DEBOUNCE, [debouncedTerm]);
+    useDebounce_1$1.default(function () { return setSearch(debouncedTerm); }, SEARCH_DEBOUNCE, [debouncedTerm]);
     // used only to focus the input
-    var inputRef = react_1$c.useRef(null);
+    var inputRef = react_1$e.useRef(null);
     // we'll use this to see when we went from no channel to channel
     var previousActiveChannel = usePrevious$1(activeChannel);
-    react_1$c.useEffect(function () {
+    react_1$e.useEffect(function () {
         var _a;
         if (autoFocus) {
             (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         }
     }, [autoFocus]);
-    react_1$c.useEffect(function () {
+    react_1$e.useEffect(function () {
         var _a;
         // if we know have a channel, focus and clear the input
         // so the user can search the channel
@@ -70031,11 +70043,11 @@ var SearchBar = function (_a) {
         }
     }, [debouncedTerm, activeChannel, previousActiveChannel]);
     // a pill could have been clicked, update our local term state
-    react_1$c.useEffect(function () {
+    react_1$e.useEffect(function () {
         setDebouncedInput(term);
     }, [term]);
-    var _f = react_1$c.useState(clear), isCleared = _f[0], setCleared = _f[1];
-    react_1$c.useEffect(function () {
+    var _f = react_1$e.useState(clear), isCleared = _f[0], setCleared = _f[1];
+    react_1$e.useEffect(function () {
         setCleared(clear);
     }, [clear]);
     // key ups to clear the active channel
@@ -70054,16 +70066,16 @@ var SearchBar = function (_a) {
                 break;
         }
     };
-    return (react_1$c.default.createElement(Container$7, { className: [SearchBar.className, className].join(' ') },
-        react_1$c.default.createElement(search_bar_channel_1.default, null),
-        react_1$c.default.createElement(Input, { isUsernameSearch: !!channelSearch, onChange: function (_a) {
+    return (react_1$e.default.createElement(Container$7, { className: [SearchBar.className, className].join(' ') },
+        react_1$e.default.createElement(search_bar_channel_1.default, null),
+        react_1$e.default.createElement(Input, { isUsernameSearch: !!channelSearch, onChange: function (_a) {
                 var value = _a.target.value;
                 if (!isCleared || value !== '') {
                     setCleared(false);
                     setDebouncedInput(value);
                 }
             }, value: isCleared ? '' : debouncedTerm, placeholder: activeChannel ? "Search " + activeChannel.display_name : placeholder, autoCapitalize: "off", autoCorrect: "off", autoComplete: "off", ref: inputRef, onKeyUp: onKeyUp }),
-        react_1$c.default.createElement(search_button_1.default, null)));
+        react_1$e.default.createElement(search_button_1.default, null)));
 };
 SearchBar.className = 'giphy-search-bar';
 searchBar.default = SearchBar;
@@ -70079,14 +70091,14 @@ var __importDefault$6 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(trendingIcon, "__esModule", { value: true });
-var react_1$b = __importDefault$6(React__default);
+var react_1$d = __importDefault$6(React__default);
 var TrendingIcon$1 = function (_a) {
     var _b = _a.size, size = _b === void 0 ? 18 : _b, className = _a.className;
-    return (react_1$b.default.createElement("svg", { width: size, height: size, viewBox: "0 0 18 16", version: "1.1", xmlns: "http://www.w3.org/2000/svg", className: className },
-        react_1$b.default.createElement("g", { id: "trending", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
-            react_1$b.default.createElement("g", null,
-                react_1$b.default.createElement("rect", { id: "Rectangle", stroke: "#979797", fill: "#D8D8D8", opacity: "0", x: "0.5", y: "0.5", width: "17", height: "17" }),
-                react_1$b.default.createElement("path", { d: "M12.6093329,3.12057664 L15.156896,3.12057664 L9.64199318,9.04253019 L6.88133868,6.8175119 C6.7544587,6.67603813 6.56616874,6.60087259 6.38404017,6.61897279 C6.2490402,6.63288422 6.11891631,6.69661171 6.02063992,6.79697337 C2.21226835,10.5943119 0.308082561,12.4929812 0.308082561,12.4929812 C0.308082561,12.4929812 0.527106106,12.8074292 0.710953088,13.0215425 C0.833517743,13.1642848 0.975497751,13.3098497 1.13689311,13.4582373 L6.47329888,8.13191205 L9.16381134,10.2953038 C9.40800276,10.5710787 9.68933701,10.7021044 10.019278,10.4570223 L16.0239805,4.04474473 C16.0239805,5.87956383 16.0239805,6.79697337 16.0239805,6.79697337 C16.0239805,6.79697337 16.4320205,6.79697337 17.2481004,6.79697337 L17.2481004,1.80604505 C14.1555887,1.80604505 12.6093329,1.80604505 12.6093329,1.80604505 C12.6093329,1.80604505 12.6093329,2.24422225 12.6093329,3.12057664 Z", id: "Shape", stroke: "#00CCFF", strokeWidth: "0.4", fill: "#00CCFF", fillRule: "nonzero", transform: "translate(8.778091, 7.632141) rotate(-2.000000) translate(-8.778091, -7.632141) " })))));
+    return (react_1$d.default.createElement("svg", { width: size, height: size, viewBox: "0 0 18 16", version: "1.1", xmlns: "http://www.w3.org/2000/svg", className: className },
+        react_1$d.default.createElement("g", { id: "trending", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
+            react_1$d.default.createElement("g", null,
+                react_1$d.default.createElement("rect", { id: "Rectangle", stroke: "#979797", fill: "#D8D8D8", opacity: "0", x: "0.5", y: "0.5", width: "17", height: "17" }),
+                react_1$d.default.createElement("path", { d: "M12.6093329,3.12057664 L15.156896,3.12057664 L9.64199318,9.04253019 L6.88133868,6.8175119 C6.7544587,6.67603813 6.56616874,6.60087259 6.38404017,6.61897279 C6.2490402,6.63288422 6.11891631,6.69661171 6.02063992,6.79697337 C2.21226835,10.5943119 0.308082561,12.4929812 0.308082561,12.4929812 C0.308082561,12.4929812 0.527106106,12.8074292 0.710953088,13.0215425 C0.833517743,13.1642848 0.975497751,13.3098497 1.13689311,13.4582373 L6.47329888,8.13191205 L9.16381134,10.2953038 C9.40800276,10.5710787 9.68933701,10.7021044 10.019278,10.4570223 L16.0239805,4.04474473 C16.0239805,5.87956383 16.0239805,6.79697337 16.0239805,6.79697337 C16.0239805,6.79697337 16.4320205,6.79697337 17.2481004,6.79697337 L17.2481004,1.80604505 C14.1555887,1.80604505 12.6093329,1.80604505 12.6093329,1.80604505 C12.6093329,1.80604505 12.6093329,2.24422225 12.6093329,3.12057664 Z", id: "Shape", stroke: "#00CCFF", strokeWidth: "0.4", fill: "#00CCFF", fillRule: "nonzero", transform: "translate(8.778091, 7.632141) rotate(-2.000000) translate(-8.778091, -7.632141) " })))));
 };
 trendingIcon.default = TrendingIcon$1;
 
@@ -70119,7 +70131,7 @@ var __importDefault$5 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(pills, "__esModule", { value: true });
 pills.TrendingSearchPill = pills.ChannelPill = void 0;
 var js_brand_1$1 = dist$2;
-var react_1$a = __importStar$4(React__default);
+var react_1$c = __importStar$4(React__default);
 var avatar_1$1 = __importDefault$5(avatar);
 var verified_badge_1 = __importDefault$5(verifiedBadge);
 var context_1$1 = context;
@@ -70132,20 +70144,20 @@ var Avatar$2 = theme_1$1.default(avatar_1$1.default)(templateObject_3$18 || (tem
 var TrendingIcon = theme_1$1.default(trending_icon_1.default)(templateObject_4$N || (templateObject_4$N = __makeTemplateObject$7(["\n    margin-right: 2px;\n"], ["\n    margin-right: 2px;\n"])));
 var ChannelPill = function (_a) {
     var channel = _a.channel;
-    var setActiveChannel = react_1$a.useContext(context_1$1.SearchContext).setActiveChannel;
-    return (react_1$a.default.createElement(ChannelPillContainer, { key: channel.id, onClick: function () { return setActiveChannel(channel); } },
-        react_1$a.default.createElement(Avatar$2, { user: channel.user }),
-        react_1$a.default.createElement("div", null,
+    var setActiveChannel = react_1$c.useContext(context_1$1.SearchContext).setActiveChannel;
+    return (react_1$c.default.createElement(ChannelPillContainer, { key: channel.id, onClick: function () { return setActiveChannel(channel); } },
+        react_1$c.default.createElement(Avatar$2, { user: channel.user }),
+        react_1$c.default.createElement("div", null,
             "@",
             channel.user.username),
-        channel.user.is_verified && react_1$a.default.createElement(verified_badge_1.default, { size: 14 })));
+        channel.user.is_verified && react_1$c.default.createElement(verified_badge_1.default, { size: 14 })));
 };
 pills.ChannelPill = ChannelPill;
 var TrendingSearchPill = function (_a) {
     var trendingSearch = _a.trendingSearch;
-    var setSearch = react_1$a.useContext(context_1$1.SearchContext).setSearch;
-    return (react_1$a.default.createElement(TrendingSearchPillContainer, { key: trendingSearch, onClick: function () { return setSearch(trendingSearch); } },
-        react_1$a.default.createElement(TrendingIcon, { size: 16 }),
+    var setSearch = react_1$c.useContext(context_1$1.SearchContext).setSearch;
+    return (react_1$c.default.createElement(TrendingSearchPillContainer, { key: trendingSearch, onClick: function () { return setSearch(trendingSearch); } },
+        react_1$c.default.createElement(TrendingIcon, { size: 16 }),
         trendingSearch));
 };
 pills.TrendingSearchPill = TrendingSearchPill;
@@ -70211,15 +70223,15 @@ var __generator$3 = (commonjsGlobal$7 && commonjsGlobal$7.__generator) || functi
     }
 };
 Object.defineProperty(suggestionBar, "__esModule", { value: true });
-var react_1$9 = __importStar$3(React__default);
+var react_1$b = __importStar$3(React__default);
 var context_1 = context;
 var theme_1 = __importStar$3(theme);
 var pills_1 = pills;
 var Container$6 = theme_1.default.div(templateObject_1$2v || (templateObject_1$2v = __makeTemplateObject$6(["\n    display: flex;\n    color: white;\n    flex-direction: row;\n    font-family: 'interface';\n    font-weight: 600;\n    font-size: 14px;\n    -webkit-overflow-scrolling: touch;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding-bottom: 10px;\n    ", "\n"], ["\n    display: flex;\n    color: white;\n    flex-direction: row;\n    font-family: 'interface';\n    font-weight: 600;\n    font-size: 14px;\n    -webkit-overflow-scrolling: touch;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding-bottom: 10px;\n    ", "\n"])), function (props) { return theme_1.getSize(props.theme); });
 var SuggestionBar = function () {
-    var _a = react_1$9.useContext(context_1.SearchContext), channelSearch = _a.channelSearch, fetchChannelSearch = _a.fetchChannelSearch, trendingSearches = _a.trendingSearches, activeChannel = _a.activeChannel;
-    var _b = react_1$9.useState([]), channels = _b[0], setChannels = _b[1];
-    react_1$9.useEffect(function () {
+    var _a = react_1$b.useContext(context_1.SearchContext), channelSearch = _a.channelSearch, fetchChannelSearch = _a.fetchChannelSearch, trendingSearches = _a.trendingSearches, activeChannel = _a.activeChannel;
+    var _b = react_1$b.useState([]), channels = _b[0], setChannels = _b[1];
+    react_1$b.useEffect(function () {
         var fetchChannels = function () { return __awaiter$3(void 0, void 0, void 0, function () {
             var channels;
             return __generator$3(this, function (_a) {
@@ -70240,9 +70252,9 @@ var SuggestionBar = function () {
             setChannels([]);
         }
     }, [channelSearch, activeChannel, fetchChannelSearch]);
-    return (react_1$9.default.createElement(Container$6, null, channels.length > 0
-        ? channels.map(function (channel) { return react_1$9.default.createElement(pills_1.ChannelPill, { key: channel.id, channel: channel }); })
-        : trendingSearches.map(function (trendingSearch) { return (react_1$9.default.createElement(pills_1.TrendingSearchPill, { key: trendingSearch, trendingSearch: trendingSearch })); })));
+    return (react_1$b.default.createElement(Container$6, null, channels.length > 0
+        ? channels.map(function (channel) { return react_1$b.default.createElement(pills_1.ChannelPill, { key: channel.id, channel: channel }); })
+        : trendingSearches.map(function (trendingSearch) { return (react_1$b.default.createElement(pills_1.TrendingSearchPill, { key: trendingSearch, trendingSearch: trendingSearch })); })));
 };
 suggestionBar.default = SuggestionBar;
 var templateObject_1$2v;
@@ -71714,7 +71726,7 @@ function useTimeoutFn(fn, ms) {
     return [isReady, clear, set];
 }
 
-function useDebounce$1(fn, ms, deps) {
+function useDebounce$3(fn, ms, deps) {
     if (ms === void 0) { ms = 0; }
     if (deps === void 0) { deps = []; }
     var _a = useTimeoutFn(fn, ms), isReady = _a[0], cancel = _a[1], reset = _a[2];
@@ -73625,14 +73637,14 @@ var useSearchParam = function (param) {
 var useSearchParamServer = function () { return null; };
 var useSearchParam$1 = isBrowser ? useSearchParam : useSearchParamServer;
 
-var lib$1 = {};
+var lib$2 = {};
 
 var render$1 = {};
 
 Object.defineProperty(render$1, "__esModule", { value: true });
 var tslib_1$6 = require$$0;
-var react_1$8 = React__default;
-var isReact16Plus = parseInt(react_1$8.version.substr(0, react_1$8.version.indexOf('.'))) > 15;
+var react_1$a = React__default;
+var isReact16Plus = parseInt(react_1$a.version.substr(0, react_1$a.version.indexOf('.'))) > 15;
 var isFn = function (fn) { return typeof fn === 'function'; };
 var render = function (props, data) {
     var more = [];
@@ -73659,10 +73671,10 @@ var render = function (props, data) {
     if (isFn(children))
         return children.apply(void 0, tslib_1$6.__spreadArrays([data], more));
     if (comp) {
-        return react_1$8.createElement(comp, data);
+        return react_1$a.createElement(comp, data);
     }
     if (children instanceof Array)
-        return isReact16Plus ? children : react_1$8.createElement.apply(void 0, tslib_1$6.__spreadArrays(['div', null], children));
+        return isReact16Plus ? children : react_1$a.createElement.apply(void 0, tslib_1$6.__spreadArrays(['div', null], children));
     if (children && (children instanceof Object)) {
         if (browser$1$1.env.NODE_ENV !== 'production') {
             if (!children.type || ((typeof children.type !== 'string') && (typeof children.type !== 'function') && (typeof children.type !== 'symbol'))) {
@@ -73672,12 +73684,12 @@ var render = function (props, data) {
             }
             if (typeof children.type === 'string')
                 return children;
-            return react_1$8.cloneElement(children, Object.assign({}, children.props, data));
+            return react_1$a.cloneElement(children, Object.assign({}, children.props, data));
         }
         else {
             if (typeof children.type === 'string')
                 return children;
-            return react_1$8.cloneElement(children, Object.assign({}, children.props, data));
+            return react_1$a.cloneElement(children, Object.assign({}, children.props, data));
         }
     }
     return children || null;
@@ -73766,15 +73778,15 @@ var hookToRenderProp = function (hook, mapPropsToArgs) {
 };
 hookToRenderProp$1.default = hookToRenderProp;
 
-Object.defineProperty(lib$1, "__esModule", { value: true });
-lib$1.hookToRenderProp = lib$1.createEnhancer = lib$1.render = void 0;
+Object.defineProperty(lib$2, "__esModule", { value: true });
+lib$2.hookToRenderProp = lib$2.createEnhancer = lib$2.render = void 0;
 var tslib_1$1 = require$$0;
 var render_1 = tslib_1$1.__importDefault(render$1);
-lib$1.render = render_1.default;
+lib$2.render = render_1.default;
 var createEnhancer_1 = tslib_1$1.__importDefault(createEnhancer$1);
-lib$1.createEnhancer = createEnhancer_1.default;
+lib$2.createEnhancer = createEnhancer_1.default;
 var hookToRenderProp_1 = tslib_1$1.__importDefault(hookToRenderProp$1);
-lib$1.hookToRenderProp = hookToRenderProp_1.default;
+lib$2.hookToRenderProp = hookToRenderProp_1.default;
 
 var useScratch = function (params) {
     if (params === void 0) { params = {}; }
@@ -74507,10 +74519,10 @@ function useTitle(title, options) {
 }
 var useTitle$1 = typeof document !== 'undefined' ? useTitle : function (_title) { };
 
-var lib = {};
+var lib$1 = {};
 
-Object.defineProperty(lib, "__esModule", { value: true });
-var easing$1 = lib.easing = {
+Object.defineProperty(lib$1, "__esModule", { value: true });
+var easing$1 = lib$1.easing = {
     // No easing, no acceleration
     linear: function (t) { return t; },
     // Accelerates fast, then slows quickly towards end.
@@ -74916,7 +74928,7 @@ var esm = /*#__PURE__*/Object.freeze({
 	useCounter: useCounter,
 	useCss: useCss$1,
 	useCustomCompareEffect: useCustomCompareEffect$1,
-	useDebounce: useDebounce$1,
+	useDebounce: useDebounce$3,
 	useDeepCompareEffect: useDeepCompareEffect$1,
 	useDefault: useDefault$1,
 	useDrop: useDrop$1,
@@ -75024,15 +75036,15 @@ var __importDefault$4 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(clipsBranding, "__esModule", { value: true });
-var react_1$7 = __importDefault$4(React__default);
+var react_1$9 = __importDefault$4(React__default);
 var GIPHYClips = function (_a) {
     var onClick = _a.onClick;
-    return (react_1$7.default.createElement("svg", { width: "66px", height: "13px", viewBox: "0 0 66 13", onClick: onClick },
-        react_1$7.default.createElement("g", { stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd" },
-            react_1$7.default.createElement("g", { transform: "translate(-1060.000000, -462.000000)", fill: "#FFFFFF", fillRule: "nonzero" },
-                react_1$7.default.createElement("g", { transform: "translate(931.000000, 286.375671)" },
-                    react_1$7.default.createElement("g", { transform: "translate(86.000000, 136.124329)" },
-                        react_1$7.default.createElement("path", { d: "M47.968,49.1962322 C49.588,49.1962322 51.052,48.6202322 51.58,47.5522322 L51.58,43.8202322 L47.476,43.8202322 L47.476,45.6802322 L49.6,45.6802322 L49.6,46.7602322 C49.12,47.1082322 48.424,47.1922322 47.98,47.1922322 C46.288,47.1922322 45.724,45.8602322 45.724,44.7802322 C45.724,43.1362322 46.612,42.3202322 47.98,42.3202322 C48.544,42.3202322 49.288,42.4762322 49.9,43.0522322 L51.28,41.6842322 C50.176,40.5682322 49.144,40.3282322 47.98,40.3282322 C44.824,40.3282322 43.384,42.5842322 43.384,44.7802322 C43.384,46.9762322 44.644,49.1962322 47.968,49.1962322 Z M54.928,48.9682322 L54.928,40.5682322 L52.564,40.5682322 L52.564,48.9682322 L54.928,48.9682322 Z M58.648,48.9682322 L58.648,46.7002322 L60.352,46.7002322 C62.596,46.6762322 63.724,45.3442322 63.724,43.6282322 C63.724,41.9842322 62.608,40.5682322 60.352,40.5682322 L56.272,40.5682322 L56.272,48.9682322 L58.648,48.9682322 Z M60.352,44.6962322 L58.648,44.6962322 L58.648,42.6082322 L60.352,42.6082322 C61,42.6082322 61.348,43.1122322 61.348,43.6642322 C61.348,44.2162322 61.012,44.6962322 60.352,44.6962322 Z M66.796,48.9802322 L66.796,45.8002322 L69.82,45.8002322 L69.82,48.9802322 L72.172,48.9802322 L72.172,40.5802322 L69.82,40.5802322 L69.82,43.7722322 L66.796,43.7722322 L66.796,40.5802322 L64.42,40.5802322 L64.42,48.9802322 L66.796,48.9802322 Z M78.16,48.9682322 L78.16,45.6202322 L81.496,40.6762322 L81.496,40.5682322 L78.82,40.5682322 L77.008,43.4482322 L75.268,40.5682322 L72.592,40.5682322 L72.592,40.6642322 L75.784,45.6202322 L75.784,48.9682322 L78.16,48.9682322 Z M87.796,49.1362322 C88.972,49.1362322 90.088,48.7402322 90.952,47.8882322 L90.028,46.9642322 C89.44,47.5522322 88.576,47.8762322 87.796,47.8762322 C85.624,47.8762322 84.712,46.3522322 84.7,44.8162322 C84.688,43.2682322 85.66,41.6962322 87.796,41.6962322 C88.576,41.6962322 89.368,41.9722322 89.968,42.5602322 L90.868,41.6962322 C90.016,40.8442322 88.924,40.4242322 87.796,40.4242322 C84.796,40.4242322 83.356,42.6202322 83.3679256,44.8282322 C83.38,47.0362322 84.748,49.1362322 87.796,49.1362322 Z M93.028,48.9682322 L93.028,40.5802322 L91.792,40.5802322 L91.792,48.9682322 L93.028,48.9682322 Z M94.252,41.3122322 C94.252,42.3322322 95.788,42.3322322 95.788,41.3122322 C95.788,40.3042322 94.252,40.3042322 94.252,41.3122322 Z M95.632,48.9682322 L95.632,43.0282322 L94.396,43.0282322 L94.396,48.9682322 L95.632,48.9682322 Z M98.188,51.7162322 L98.188,48.1042322 C98.632,48.8362322 99.556,49.1002322 100.276,49.1002322 C102.112,49.1002322 103.264,47.8042322 103.264,46.0162322 C103.264,44.2282322 102.04,42.9442322 100.276,42.9322322 C99.484,42.9322322 98.644,43.2922322 98.188,44.0122322 L98.116,43.0522322 L96.952,43.0522322 L96.952,51.7162322 L98.188,51.7162322 Z M100.156,47.9002322 C99.076,47.9002322 98.296,47.0722322 98.296,46.0162322 C98.296,44.9602322 99.016,44.1322322 100.156,44.1322322 C101.284,44.1322322 102.028,44.9002322 102.028,46.0162322 C102.028,47.1202322 101.236,47.9002322 100.156,47.9002322 Z M106.456,49.1482322 C107.992,49.1482322 108.964,48.3802322 108.976,47.2762322 C108.988,45.7522322 107.56,45.5122322 106.468,45.4162322 C105.712,45.3442322 105.196,45.1522322 105.184,44.6602322 C105.184,44.1922322 105.688,43.9402322 106.444,43.9522322 C107.032,43.9522322 107.536,44.0722322 108.004,44.5042322 L108.7,43.6882322 C108.04,43.1002322 107.332,42.8962322 106.42,42.8962322 C105.316,42.8962322 103.96,43.3882322 103.96,44.6962322 C103.972,46.0042322 105.256,46.3642322 106.372,46.4722322 C107.248,46.5562322 107.752,46.7602322 107.74,47.2882322 C107.728,47.8402322 107.068,48.0562322 106.48,48.0562322 C105.784,48.0442322 104.956,47.7922322 104.404,47.1802322 L103.756,48.0562322 C104.536,48.9322322 105.496,49.1482322 106.456,49.1482322 Z", id: "GIPHYClips" })))))));
+    return (react_1$9.default.createElement("svg", { width: "66px", height: "13px", viewBox: "0 0 66 13", onClick: onClick },
+        react_1$9.default.createElement("g", { stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd" },
+            react_1$9.default.createElement("g", { transform: "translate(-1060.000000, -462.000000)", fill: "#FFFFFF", fillRule: "nonzero" },
+                react_1$9.default.createElement("g", { transform: "translate(931.000000, 286.375671)" },
+                    react_1$9.default.createElement("g", { transform: "translate(86.000000, 136.124329)" },
+                        react_1$9.default.createElement("path", { d: "M47.968,49.1962322 C49.588,49.1962322 51.052,48.6202322 51.58,47.5522322 L51.58,43.8202322 L47.476,43.8202322 L47.476,45.6802322 L49.6,45.6802322 L49.6,46.7602322 C49.12,47.1082322 48.424,47.1922322 47.98,47.1922322 C46.288,47.1922322 45.724,45.8602322 45.724,44.7802322 C45.724,43.1362322 46.612,42.3202322 47.98,42.3202322 C48.544,42.3202322 49.288,42.4762322 49.9,43.0522322 L51.28,41.6842322 C50.176,40.5682322 49.144,40.3282322 47.98,40.3282322 C44.824,40.3282322 43.384,42.5842322 43.384,44.7802322 C43.384,46.9762322 44.644,49.1962322 47.968,49.1962322 Z M54.928,48.9682322 L54.928,40.5682322 L52.564,40.5682322 L52.564,48.9682322 L54.928,48.9682322 Z M58.648,48.9682322 L58.648,46.7002322 L60.352,46.7002322 C62.596,46.6762322 63.724,45.3442322 63.724,43.6282322 C63.724,41.9842322 62.608,40.5682322 60.352,40.5682322 L56.272,40.5682322 L56.272,48.9682322 L58.648,48.9682322 Z M60.352,44.6962322 L58.648,44.6962322 L58.648,42.6082322 L60.352,42.6082322 C61,42.6082322 61.348,43.1122322 61.348,43.6642322 C61.348,44.2162322 61.012,44.6962322 60.352,44.6962322 Z M66.796,48.9802322 L66.796,45.8002322 L69.82,45.8002322 L69.82,48.9802322 L72.172,48.9802322 L72.172,40.5802322 L69.82,40.5802322 L69.82,43.7722322 L66.796,43.7722322 L66.796,40.5802322 L64.42,40.5802322 L64.42,48.9802322 L66.796,48.9802322 Z M78.16,48.9682322 L78.16,45.6202322 L81.496,40.6762322 L81.496,40.5682322 L78.82,40.5682322 L77.008,43.4482322 L75.268,40.5682322 L72.592,40.5682322 L72.592,40.6642322 L75.784,45.6202322 L75.784,48.9682322 L78.16,48.9682322 Z M87.796,49.1362322 C88.972,49.1362322 90.088,48.7402322 90.952,47.8882322 L90.028,46.9642322 C89.44,47.5522322 88.576,47.8762322 87.796,47.8762322 C85.624,47.8762322 84.712,46.3522322 84.7,44.8162322 C84.688,43.2682322 85.66,41.6962322 87.796,41.6962322 C88.576,41.6962322 89.368,41.9722322 89.968,42.5602322 L90.868,41.6962322 C90.016,40.8442322 88.924,40.4242322 87.796,40.4242322 C84.796,40.4242322 83.356,42.6202322 83.3679256,44.8282322 C83.38,47.0362322 84.748,49.1362322 87.796,49.1362322 Z M93.028,48.9682322 L93.028,40.5802322 L91.792,40.5802322 L91.792,48.9682322 L93.028,48.9682322 Z M94.252,41.3122322 C94.252,42.3322322 95.788,42.3322322 95.788,41.3122322 C95.788,40.3042322 94.252,40.3042322 94.252,41.3122322 Z M95.632,48.9682322 L95.632,43.0282322 L94.396,43.0282322 L94.396,48.9682322 L95.632,48.9682322 Z M98.188,51.7162322 L98.188,48.1042322 C98.632,48.8362322 99.556,49.1002322 100.276,49.1002322 C102.112,49.1002322 103.264,47.8042322 103.264,46.0162322 C103.264,44.2282322 102.04,42.9442322 100.276,42.9322322 C99.484,42.9322322 98.644,43.2922322 98.188,44.0122322 L98.116,43.0522322 L96.952,43.0522322 L96.952,51.7162322 L98.188,51.7162322 Z M100.156,47.9002322 C99.076,47.9002322 98.296,47.0722322 98.296,46.0162322 C98.296,44.9602322 99.016,44.1322322 100.156,44.1322322 C101.284,44.1322322 102.028,44.9002322 102.028,46.0162322 C102.028,47.1202322 101.236,47.9002322 100.156,47.9002322 Z M106.456,49.1482322 C107.992,49.1482322 108.964,48.3802322 108.976,47.2762322 C108.988,45.7522322 107.56,45.5122322 106.468,45.4162322 C105.712,45.3442322 105.196,45.1522322 105.184,44.6602322 C105.184,44.1922322 105.688,43.9402322 106.444,43.9522322 C107.032,43.9522322 107.536,44.0722322 108.004,44.5042322 L108.7,43.6882322 C108.04,43.1002322 107.332,42.8962322 106.42,42.8962322 C105.316,42.8962322 103.96,43.3882322 103.96,44.6962322 C103.972,46.0042322 105.256,46.3642322 106.372,46.4722322 C107.248,46.5562322 107.752,46.7602322 107.74,47.2882322 C107.728,47.8402322 107.068,48.0562322 106.48,48.0562322 C105.784,48.0442322 104.956,47.7922322 104.404,47.1802322 L103.756,48.0562322 C104.536,48.9322322 105.496,49.1482322 106.456,49.1482322 Z", id: "GIPHYClips" })))))));
 };
 clipsBranding.default = GIPHYClips;
 
@@ -75045,7 +75057,7 @@ var __importDefault$3 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 };
 Object.defineProperty(attribution, "__esModule", { value: true });
 var styled_1$3 = __importDefault$3(require$$0$4);
-var react_1$6 = __importDefault$3(React__default);
+var react_1$8 = __importDefault$3(React__default);
 var avatar_1 = __importDefault$3(avatar);
 var user_1 = __importDefault$3(user);
 var clips_branding_1 = __importDefault$3(clipsBranding);
@@ -75058,7 +75070,7 @@ var Attribution = function (_a) {
     if (!(user === null || user === void 0 ? void 0 : user.username) && !(user === null || user === void 0 ? void 0 : user.display_name)) {
         return null;
     }
-    return (react_1$6.default.createElement(Container$5, { className: [Attribution.className, className].join(' '), onClick: function (e) {
+    return (react_1$8.default.createElement(Container$5, { className: [Attribution.className, className].join(' '), onClick: function (e) {
             e.preventDefault();
             e.stopPropagation();
             if (onClick) {
@@ -75070,9 +75082,9 @@ var Attribution = function (_a) {
                     window.open(url, '_blank');
             }
         } },
-        react_1$6.default.createElement(Avatar$1, { user: user }),
-        react_1$6.default.createElement(Right, null,
-            react_1$6.default.createElement(clips_branding_1.default, { onClick: function (e) {
+        react_1$8.default.createElement(Avatar$1, { user: user }),
+        react_1$8.default.createElement(Right, null,
+            react_1$8.default.createElement(clips_branding_1.default, { onClick: function (e) {
                     e.preventDefault();
                     e.stopPropagation();
                     if (onClick) {
@@ -75082,7 +75094,7 @@ var Attribution = function (_a) {
                         window.open(gif.url, '_blank');
                     }
                 } }),
-            react_1$6.default.createElement(user_1.default, { user: user }))));
+            react_1$8.default.createElement(user_1.default, { user: user }))));
 };
 Attribution.className = 'giphy-attribution';
 attribution.default = Attribution;
@@ -75157,19 +75169,19 @@ util$1.isBrowser = typeof window !== 'undefined';
 util$1.isNavigator = typeof navigator !== 'undefined';
 
 Object.defineProperty(useIsomorphicLayoutEffect$1, "__esModule", { value: true });
-var react_1$5 = React__default;
+var react_1$7 = React__default;
 var util_1$1 = util$1;
-var useIsomorphicLayoutEffect = util_1$1.isBrowser ? react_1$5.useLayoutEffect : react_1$5.useEffect;
+var useIsomorphicLayoutEffect = util_1$1.isBrowser ? react_1$7.useLayoutEffect : react_1$7.useEffect;
 useIsomorphicLayoutEffect$1.default = useIsomorphicLayoutEffect;
 
 Object.defineProperty(useRaf$1, "__esModule", { value: true });
 var tslib_1 = require$$0;
-var react_1$4 = React__default;
+var react_1$6 = React__default;
 var useIsomorphicLayoutEffect_1 = tslib_1.__importDefault(useIsomorphicLayoutEffect$1);
 var useRaf = function (ms, delay) {
     if (ms === void 0) { ms = 1e12; }
     if (delay === void 0) { delay = 0; }
-    var _a = react_1$4.useState(0), elapsed = _a[0], set = _a[1];
+    var _a = react_1$6.useState(0), elapsed = _a[0], set = _a[1];
     useIsomorphicLayoutEffect_1.default(function () {
         var raf;
         var timerStop;
@@ -75211,7 +75223,7 @@ var __importDefault$2 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(progressBar, "__esModule", { value: true });
 var styled_1$2 = __importDefault$2(require$$0$4);
 var js_brand_1 = dist$2;
-var react_1$3 = __importDefault$2(React__default);
+var react_1$5 = __importDefault$2(React__default);
 var useRaf_1 = __importDefault$2(useRaf$1);
 var Bar$1 = styled_1$2.default.div(templateObject_1$2t || (templateObject_1$2t = __makeTemplateObject$4(["\n    background: ", ";\n    height: ", "px;\n    position: absolute;\n    width: 5px;\n    bottom: 0;\n    left: 0;\n    opacity: 0.95;\n"], ["\n    background: ", ";\n    height: ", "px;\n    position: absolute;\n    width: 5px;\n    bottom: 0;\n    left: 0;\n    opacity: 0.95;\n"])), js_brand_1.giphyWhite, function (props) { return props.barHeight; });
 var ProgressBar = function (_a) {
@@ -75229,7 +75241,7 @@ var ProgressBar = function (_a) {
         barHeight = 4;
     }
     percentage = duration < 10 && percentage > 98 ? 100 : percentage;
-    return react_1$3.default.createElement(Bar$1, { style: { width: percentage + "%" }, barHeight: barHeight, className: "hide-in-percy" });
+    return react_1$5.default.createElement(Bar$1, { style: { width: percentage + "%" }, barHeight: barHeight, className: "hide-in-percy" });
 };
 progressBar.default = ProgressBar;
 var templateObject_1$2t;
@@ -75325,7 +75337,7 @@ var __generator$2 = (commonjsGlobal$7 && commonjsGlobal$7.__generator) || functi
 Object.defineProperty(video, "__esModule", { value: true });
 var js_analytics_1 = dist;
 var js_util_1$1 = dist$3;
-var react_1$2 = __importStar$2(React__default);
+var react_1$4 = __importStar$2(React__default);
 var util_1 = util;
 var quartileEvents = [0.25, 0.5, 0.75];
 var videoClassName = 'giphy-video';
@@ -75344,28 +75356,28 @@ var Video = function (_a) {
     var muted = _a.muted, _e = _a.ccEnabled, ccEnabled = _e === void 0 ? false : _e, _f = _a.ccLanguage, ccLanguage = _f === void 0 ? 'en' : _f, _g = _a.loop, loop = _g === void 0 ? true : _g, onStateChange = _a.onStateChange, onTimeUpdate = _a.onTimeUpdate, onCanPlay = _a.onCanPlay, onFirstPlay = _a.onFirstPlay, onWaiting = _a.onWaiting, onMuted = _a.onMuted, onError = _a.onError, onEnded = _a.onEnded, onLoop = _a.onLoop, onQuartile = _a.onQuartile, onEndFullscreen = _a.onEndFullscreen, setVideoEl = _a.setVideoEl, gif = _a.gif, width = _a.width, height_ = _a.height, _h = _a.volume, volume = _h === void 0 ? 0.7 : _h, _j = _a.className, className = _j === void 0 ? videoClassName : _j;
     var height = height_ || js_util_1$1.getGifHeight(gif, width);
     // state
-    var _k = react_1$2.useState(js_util_1$1.getBestVideo(gif.video, width, height)), media = _k[0], setMedia = _k[1];
-    var seek = react_1$2.useRef(0);
+    var _k = react_1$4.useState(js_util_1$1.getBestVideo(gif.video, width, height)), media = _k[0], setMedia = _k[1];
+    var seek = react_1$4.useRef(0);
     if (!media) {
         // Not all gif requests have video content
         // use { type: 'videos' } for search or trending endpoints
         console.warn("GiphyJS No video content for id: " + gif.id);
     }
-    var mountTime = react_1$2.useRef(Date.now());
-    var hasPlayingFired = react_1$2.useRef(false);
-    var loopNumber = react_1$2.useRef(0);
-    var waitingCount = react_1$2.useRef(0);
-    var quartilesFired = react_1$2.useRef(new Set());
+    var mountTime = react_1$4.useRef(Date.now());
+    var hasPlayingFired = react_1$4.useRef(false);
+    var loopNumber = react_1$4.useRef(0);
+    var waitingCount = react_1$4.useRef(0);
+    var quartilesFired = react_1$4.useRef(new Set());
     // reset the above when the gif.id changes
-    react_1$2.useEffect(function () {
+    react_1$4.useEffect(function () {
         mountTime.current = Date.now();
         hasPlayingFired.current = false;
         loopNumber.current = 1;
         waitingCount.current = 0;
         quartilesFired.current = new Set();
     }, [gif.id]);
-    var videoEl = react_1$2.useRef(null);
-    react_1$2.useEffect(function () {
+    var videoEl = react_1$4.useRef(null);
+    react_1$4.useEffect(function () {
         // when the width and height change, check if there's a new url
         var newMedia = js_util_1$1.getBestVideo(gif.video, width, height);
         if (videoEl.current && (media === null || media === void 0 ? void 0 : media.url) && newMedia.url !== media.url) {
@@ -75378,13 +75390,13 @@ var Video = function (_a) {
             setMedia(newMedia);
         }
     }, [width, height_, gif.video, height, media === null || media === void 0 ? void 0 : media.url, gif.id]);
-    react_1$2.useEffect(function () {
+    react_1$4.useEffect(function () {
         if (videoEl.current && (media === null || media === void 0 ? void 0 : media.url) && seek.current) {
             videoEl.current.currentTime = seek.current;
             seek.current = 0;
         }
     }, [media === null || media === void 0 ? void 0 : media.url, seek]);
-    var _onError = react_1$2.useCallback(function () {
+    var _onError = react_1$4.useCallback(function () {
         var _a;
         var el = videoEl.current;
         var code = (_a = el === null || el === void 0 ? void 0 : el.error) === null || _a === void 0 ? void 0 : _a.code;
@@ -75394,7 +75406,7 @@ var Video = function (_a) {
             onError === null || onError === void 0 ? void 0 : onError(code);
         }
     }, [onError]);
-    var _onPlaying = react_1$2.useCallback(function () {
+    var _onPlaying = react_1$4.useCallback(function () {
         onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('playing');
         if (!hasPlayingFired.current) {
             hasPlayingFired.current = true;
@@ -75404,8 +75416,8 @@ var Video = function (_a) {
             onFirstPlay === null || onFirstPlay === void 0 ? void 0 : onFirstPlay(Date.now() - mountTime.current);
         }
     }, [onFirstPlay, onStateChange, gif]);
-    var _onPaused = react_1$2.useCallback(function () { return onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('paused'); }, [onStateChange]);
-    var _onTimeUpdate = react_1$2.useCallback(function () {
+    var _onPaused = react_1$4.useCallback(function () { return onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('paused'); }, [onStateChange]);
+    var _onTimeUpdate = react_1$4.useCallback(function () {
         var el = videoEl.current;
         if (el) {
             var playhead_1 = el.currentTime;
@@ -75419,15 +75431,15 @@ var Video = function (_a) {
             onTimeUpdate === null || onTimeUpdate === void 0 ? void 0 : onTimeUpdate(playhead_1 || 0);
         }
     }, [onQuartile, onTimeUpdate]);
-    var _onCanPlay = react_1$2.useCallback(function () { return onCanPlay === null || onCanPlay === void 0 ? void 0 : onCanPlay(); }, [onCanPlay]);
-    var _onWaiting = react_1$2.useCallback(function () {
+    var _onCanPlay = react_1$4.useCallback(function () { return onCanPlay === null || onCanPlay === void 0 ? void 0 : onCanPlay(); }, [onCanPlay]);
+    var _onWaiting = react_1$4.useCallback(function () {
         var el = videoEl.current;
         // we get a waiting event after a loop, so ignore the first one while the play head is 0
         if ((el === null || el === void 0 ? void 0 : el.currentTime) !== 0 && (el === null || el === void 0 ? void 0 : el.networkState) !== Network.IDLE) {
             onWaiting === null || onWaiting === void 0 ? void 0 : onWaiting(++waitingCount.current);
         }
     }, [onWaiting]);
-    var _onEnded = react_1$2.useCallback(function () {
+    var _onEnded = react_1$4.useCallback(function () {
         // helps prevent two ended events when changing media
         if (!hasPlayingFired.current) {
             return;
@@ -75439,8 +75451,8 @@ var Video = function (_a) {
         loopNumber.current = loopNumber.current + 1;
         onEnded === null || onEnded === void 0 ? void 0 : onEnded();
     }, [onEnded, loop, onLoop]);
-    var _onEndFullscreen = react_1$2.useCallback(function () { return onEndFullscreen === null || onEndFullscreen === void 0 ? void 0 : onEndFullscreen(); }, [onEndFullscreen]);
-    var tryAutoPlayWithSound = react_1$2.useCallback(function (videoEl) { return __awaiter$2(void 0, void 0, void 0, function () {
+    var _onEndFullscreen = react_1$4.useCallback(function () { return onEndFullscreen === null || onEndFullscreen === void 0 ? void 0 : onEndFullscreen(); }, [onEndFullscreen]);
+    var tryAutoPlayWithSound = react_1$4.useCallback(function (videoEl) { return __awaiter$2(void 0, void 0, void 0, function () {
         var promisePlay;
         return __generator$2(this, function (_a) {
             switch (_a.label) {
@@ -75469,7 +75481,7 @@ var Video = function (_a) {
             }
         });
     }); }, [onMuted]);
-    react_1$2.useEffect(function () {
+    react_1$4.useEffect(function () {
         var el = videoEl.current;
         if (el) {
             tryAutoPlayWithSound(el);
@@ -75480,7 +75492,7 @@ var Video = function (_a) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    react_1$2.useEffect(function () {
+    react_1$4.useEffect(function () {
         var el = videoEl.current;
         if (el) {
             el.addEventListener('play', _onPlaying);
@@ -75506,7 +75518,7 @@ var Video = function (_a) {
         };
     }, [_onPlaying, _onPaused, _onError, _onTimeUpdate, _onCanPlay, _onEnded, _onWaiting, _onEndFullscreen]);
     var captionSrc = (_d = (_c = (_b = gif.video) === null || _b === void 0 ? void 0 : _b.captions) === null || _c === void 0 ? void 0 : _c[ccLanguage]) === null || _d === void 0 ? void 0 : _d.vtt;
-    return (media === null || media === void 0 ? void 0 : media.url) ? (react_1$2.default.createElement("video", { crossOrigin: "anonymous", draggable: true, className: className, width: width, height: height, muted: muted, autoPlay: true, playsInline: true, ref: videoEl, src: media === null || media === void 0 ? void 0 : media.url }, ccEnabled && captionSrc && (react_1$2.default.createElement("track", { label: "English", kind: "subtitles", srcLang: ccLanguage, src: captionSrc, default: true })))) : null;
+    return (media === null || media === void 0 ? void 0 : media.url) ? (react_1$4.default.createElement("video", { crossOrigin: "anonymous", draggable: true, className: className, width: width, height: height, muted: muted, autoPlay: true, playsInline: true, ref: videoEl, src: media === null || media === void 0 ? void 0 : media.url }, ccEnabled && captionSrc && (react_1$4.default.createElement("track", { label: "English", kind: "subtitles", srcLang: ccLanguage, src: captionSrc, default: true })))) : null;
 };
 Video.className = videoClassName;
 video.default = Video;
@@ -75551,7 +75563,7 @@ var __importDefault$1 = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) |
 Object.defineProperty(video$1, "__esModule", { value: true });
 var styled_1$1 = __importDefault$1(require$$0$4);
 var js_util_1 = dist$3;
-var react_1$1 = __importStar$1(React__default);
+var react_1$3 = __importStar$1(React__default);
 var react_use_1 = require$$3;
 var attribution_1 = __importDefault$1(attribution);
 var volume_1$1 = volume;
@@ -75567,20 +75579,20 @@ var LARGE_PLAYER_HEIGHT = 300;
 var AUTO_HIDE_TIMEOUT = 4000;
 var VideoPlayer = function (props) {
     var width = props.width, hideMute = props.hideMute, hideAttribution = props.hideAttribution, hideProgressBar = props.hideProgressBar, className = props.className, persistentControls = props.persistentControls, gif = props.gif, Overlay = props.overlay;
-    var _a = react_1$1.useState(false), isHovered = _a[0], setIsHovered = _a[1];
-    var _b = react_1$1.useState(null), videoEl = _b[0], _setVideoEl = _b[1];
-    var _c = react_1$1.useState(props.muted), muted = _c[0], setMuted = _c[1];
-    var _d = react_1$1.useState(false), mutedByBrowser = _d[0], setMutedByBrowser = _d[1];
+    var _a = react_1$3.useState(false), isHovered = _a[0], setIsHovered = _a[1];
+    var _b = react_1$3.useState(null), videoEl = _b[0], _setVideoEl = _b[1];
+    var _c = react_1$3.useState(props.muted), muted = _c[0], setMuted = _c[1];
+    var _d = react_1$3.useState(false), mutedByBrowser = _d[0], setMutedByBrowser = _d[1];
     var setVideoEl = props.setVideoEl, onMuted = props.onMuted, onUserMuted = props.onUserMuted;
     var height = props.height || js_util_1.getGifHeight(gif, width);
     var _e = react_use_1.useTimeoutFn(function () {
         setIsHovered(false);
     }, AUTO_HIDE_TIMEOUT), cancelHideTimeout = _e[1], resetHideTimeout = _e[2];
-    var combinedOnMuted = react_1$1.useCallback(function (args) {
+    var combinedOnMuted = react_1$3.useCallback(function (args) {
         onMuted === null || onMuted === void 0 ? void 0 : onMuted(args);
         setMutedByBrowser(args);
     }, [setMutedByBrowser, onMuted]);
-    var combinedSetVideoEl = react_1$1.useCallback(function (args) {
+    var combinedSetVideoEl = react_1$3.useCallback(function (args) {
         setVideoEl === null || setVideoEl === void 0 ? void 0 : setVideoEl(args);
         _setVideoEl(args);
     }, [setVideoEl, _setVideoEl]);
@@ -75593,13 +75605,13 @@ var VideoPlayer = function (props) {
             setMuted(!muted);
         }
     };
-    react_1$1.useEffect(function () {
+    react_1$3.useEffect(function () {
         setMuted(props.muted);
     }, [props.muted]);
     var showControls = persistentControls || isHovered;
     var isLargePlayer = height >= LARGE_PLAYER_HEIGHT;
     // Manage auto hide controls
-    react_1$1.useEffect(function () {
+    react_1$3.useEffect(function () {
         if (showControls) {
             resetHideTimeout();
         }
@@ -75608,7 +75620,7 @@ var VideoPlayer = function (props) {
         }
         return function () { return cancelHideTimeout(); };
     }, [showControls, cancelHideTimeout, resetHideTimeout]);
-    return (react_1$1.default.createElement(Container$4, { className: className, style: { width: width, height: height }, onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onMouseMove: function () {
+    return (react_1$3.default.createElement(Container$4, { className: className, style: { width: width, height: height }, onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onMouseMove: function () {
             setIsHovered(true);
             resetHideTimeout();
         }, onClick: function (e) {
@@ -75621,25 +75633,25 @@ var VideoPlayer = function (props) {
             e.preventDefault();
             toggleMute();
         } },
-        react_1$1.default.createElement(video_1.default, __assign$3({}, props, { onMuted: combinedOnMuted, setVideoEl: combinedSetVideoEl, muted: muted })),
-        showControls && react_1$1.default.createElement(Gradient, { isLargePlayer: isLargePlayer }),
-        react_1$1.default.createElement(Controls, { isHovered: showControls },
-            react_1$1.default.createElement(TitleContainer$1, null,
-                isLargePlayer && (react_1$1.default.createElement(Title$9, { onClick: function (e) {
+        react_1$3.default.createElement(video_1.default, __assign$3({}, props, { onMuted: combinedOnMuted, setVideoEl: combinedSetVideoEl, muted: muted })),
+        showControls && react_1$3.default.createElement(Gradient, { isLargePlayer: isLargePlayer }),
+        react_1$3.default.createElement(Controls, { isHovered: showControls },
+            react_1$3.default.createElement(TitleContainer$1, null,
+                isLargePlayer && (react_1$3.default.createElement(Title$9, { onClick: function (e) {
                         e.preventDefault();
                         e.stopPropagation();
                         window.open(gif.url, '_blank');
                     } }, gif.title)),
-                videoEl && !hideAttribution ? react_1$1.default.createElement(attribution_1.default, { gif: gif }) : null),
-            !hideMute && react_1$1.default.createElement(Volume, null, muted || mutedByBrowser ? react_1$1.default.createElement(volume_1$1.VolumeOffIcon, null) : react_1$1.default.createElement(volume_1$1.VolumeOnIcon, null))),
-        showControls && !hideProgressBar && videoEl ? react_1$1.default.createElement(progress_bar_1.default, { videoEl: videoEl }) : null,
-        Overlay && react_1$1.default.createElement(Overlay, { gif: gif, isHovered: isHovered, width: width, height: height })));
+                videoEl && !hideAttribution ? react_1$3.default.createElement(attribution_1.default, { gif: gif }) : null),
+            !hideMute && react_1$3.default.createElement(Volume, null, muted || mutedByBrowser ? react_1$3.default.createElement(volume_1$1.VolumeOffIcon, null) : react_1$3.default.createElement(volume_1$1.VolumeOnIcon, null))),
+        showControls && !hideProgressBar && videoEl ? react_1$3.default.createElement(progress_bar_1.default, { videoEl: videoEl }) : null,
+        Overlay && react_1$3.default.createElement(Overlay, { gif: gif, isHovered: isHovered, width: width, height: height })));
 };
 var VideoWrapper = function (props) {
     if (props.overlay && !props.controls) {
         console.warn(js_util_1.Logger.PREFIX + ": Overlays only work when controls are enabled");
     }
-    return props.controls ? react_1$1.default.createElement(VideoPlayer, __assign$3({}, props)) : react_1$1.default.createElement(video_1.default, __assign$3({}, props));
+    return props.controls ? react_1$3.default.createElement(VideoPlayer, __assign$3({}, props)) : react_1$3.default.createElement(video_1.default, __assign$3({}, props));
 };
 video$1.default = VideoWrapper;
 var templateObject_1$2s, templateObject_2$1E, templateObject_3$16, templateObject_4$M, templateObject_5$F, templateObject_6$u;
@@ -75714,7 +75726,7 @@ var __importDefault = (commonjsGlobal$7 && commonjsGlobal$7.__importDefault) ||
 };
 Object.defineProperty(videoOverlay, "__esModule", { value: true });
 var styled_1 = __importDefault(require$$0$4);
-var react_1 = __importStar(React__default);
+var react_1$2 = __importStar(React__default);
 var _1 = __importDefault(video$1);
 var volume_1 = volume;
 var VideoContainer = styled_1.default.div(templateObject_1$2r || (templateObject_1$2r = __makeTemplateObject$2(["\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    right: 0;\n    height: 100%;\n    width: 100%;\n"], ["\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    right: 0;\n    height: 100%;\n    width: 100%;\n"])));
@@ -75723,16 +75735,16 @@ var Button$2 = styled_1.default.div(templateObject_3$15 || (templateObject_3$15
 var speakerClassName = 'giphy-video-overlay-button';
 var VolumeButton = function (_a) {
     var muted = _a.muted, toggleMute = _a.toggleMute, mutedByBrowser = _a.mutedByBrowser, isHovered = _a.isHovered;
-    return (react_1.default.createElement(Button$2, { className: speakerClassName, onClick: function (e) {
+    return (react_1$2.default.createElement(Button$2, { className: speakerClassName, onClick: function (e) {
             e.preventDefault();
             e.stopPropagation();
             toggleMute();
-        }, isHovered: isHovered }, muted || mutedByBrowser || !isHovered ? react_1.default.createElement(volume_1.VolumeOffIcon, null) : react_1.default.createElement(volume_1.VolumeOnIcon, null)));
+        }, isHovered: isHovered }, muted || mutedByBrowser || !isHovered ? react_1$2.default.createElement(volume_1.VolumeOffIcon, null) : react_1$2.default.createElement(volume_1.VolumeOnIcon, null)));
 };
 var VideoOverlay = function (_a) {
     var gif = _a.gif, isHovered = _a.isHovered, hideMuteButton = _a.hideMuteButton, width = _a.width, height = _a.height, className = _a.className, _b = _a.muted, userPrefMuted = _b === void 0 ? false : _b, onUserMuted = _a.onUserMuted;
-    var _c = react_1.useState(userPrefMuted), muted = _c[0], setMuted = _c[1];
-    var _d = react_1.useState(false), mutedByBrowser = _d[0], setMutedByBrowser = _d[1];
+    var _c = react_1$2.useState(userPrefMuted), muted = _c[0], setMuted = _c[1];
+    var _d = react_1$2.useState(false), mutedByBrowser = _d[0], setMutedByBrowser = _d[1];
     var toggleMute = function () {
         if (mutedByBrowser) {
             setMutedByBrowser(false);
@@ -75743,13 +75755,13 @@ var VideoOverlay = function (_a) {
             setMuted(!muted);
         }
     };
-    react_1.useEffect(function () {
+    react_1$2.useEffect(function () {
         setMuted(userPrefMuted);
     }, [userPrefMuted, setMuted]);
     var props = { toggleMute: toggleMute, muted: muted, mutedByBrowser: mutedByBrowser };
-    return (react_1.default.createElement(VideoContainer, { className: className },
-        isHovered && (react_1.default.createElement(VideoStyled, { gif: gif, key: gif.id, loop: true, controls: true, hideAttribution: true, hideMute: true, persistentControls: true, muted: muted, width: width, height: height, onMuted: setMutedByBrowser })),
-        !hideMuteButton && react_1.default.createElement(VolumeButton, __assign$2({}, props, { isHovered: isHovered }))));
+    return (react_1$2.default.createElement(VideoContainer, { className: className },
+        isHovered && (react_1$2.default.createElement(VideoStyled, { gif: gif, key: gif.id, loop: true, controls: true, hideAttribution: true, hideMute: true, persistentControls: true, muted: muted, width: width, height: height, onMuted: setMutedByBrowser })),
+        !hideMuteButton && react_1$2.default.createElement(VolumeButton, __assign$2({}, props, { isHovered: isHovered }))));
 };
 VideoOverlay.imgClassName = speakerClassName;
 videoOverlay.default = VideoOverlay;
@@ -75936,7 +75948,7 @@ js_util_1.appendGiphySDKRequestHeader("X-GIPHY-SDK-VERSION", version);
 
 }(dist$4));
 
-function useDebouncedCallback(callback, delay, options) {
+function useDebouncedCallback$3(callback, delay, options) {
     if (options === void 0) { options = {}; }
     var maxWait = options.maxWait;
     var maxWaitHandler = useRef$1(null);
@@ -76006,13 +76018,13 @@ function useDebouncedCallback(callback, delay, options) {
     return [debouncedCallback, cancelDebouncedCallback, callPending];
 }
 
-function valueEquality(left, right) {
+function valueEquality$1(left, right) {
     return left === right;
 }
-function useDebounce(value, delay, options) {
-    var eq = options && options.equalityFn ? options.equalityFn : valueEquality;
+function useDebounce$2(value, delay, options) {
+    var eq = options && options.equalityFn ? options.equalityFn : valueEquality$1;
     var _a = useState$2(value), state = _a[0], dispatch = _a[1];
-    var _b = useDebouncedCallback(useCallback(function (value) { return dispatch(value); }, []), delay, options), callback = _b[0], cancel = _b[1], callPending = _b[2];
+    var _b = useDebouncedCallback$3(useCallback(function (value) { return dispatch(value); }, []), delay, options), callback = _b[0], cancel = _b[1], callPending = _b[2];
     var previousValue = useRef$1(value);
     useEffect$1(function () {
         // We need to use this condition otherwise we will run debounce timer for the first render (including maxWait option)
@@ -79501,7 +79513,7 @@ var fixRegexpWellKnownSymbolLogic$2 = function (KEY, length, exec, sham) {
 // https://tc39.github.io/ecma262/#sec-samevalue
 
 
-var sameValue$1$1 = Object.is || function is(x, y) {
+var sameValue$1$2 = Object.is || function is(x, y) {
   // eslint-disable-next-line no-self-compare
   return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
 };
@@ -79533,8 +79545,8 @@ var regexpExecAbstract$2 = function (R, S) {
 var fixRegExpWellKnownSymbolLogic$2$1 = fixRegexpWellKnownSymbolLogic$2;
 var anObject$6$1 = anObject$e$1;
 var requireObjectCoercible$4$1 = requireObjectCoercible$9$1;
-var sameValue$2 = sameValue$1$1;
-var regExpExec$1$1 = regexpExecAbstract$2; // @@search logic
+var sameValue$3 = sameValue$1$2;
+var regExpExec$1$2 = regexpExecAbstract$2; // @@search logic
 
 fixRegExpWellKnownSymbolLogic$2$1('search', 1, function (SEARCH, nativeSearch, maybeCallNative) {
   return [// `String.prototype.search` method
@@ -79551,18 +79563,18 @@ fixRegExpWellKnownSymbolLogic$2$1('search', 1, function (SEARCH, nativeSearch, m
     var rx = anObject$6$1(regexp);
     var S = String(this);
     var previousLastIndex = rx.lastIndex;
-    if (!sameValue$2(previousLastIndex, 0)) rx.lastIndex = 0;
-    var result = regExpExec$1$1(rx, S);
-    if (!sameValue$2(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
+    if (!sameValue$3(previousLastIndex, 0)) rx.lastIndex = 0;
+    var result = regExpExec$1$2(rx, S);
+    if (!sameValue$3(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
     return result === null ? -1 : result.index;
   }];
 });
 var toInteger$1$2 = toInteger$4$1;
-var requireObjectCoercible$3$1 = requireObjectCoercible$9$1; // `String.prototype.{ codePointAt, at }` methods implementation
+var requireObjectCoercible$3$2 = requireObjectCoercible$9$1; // `String.prototype.{ codePointAt, at }` methods implementation
 
 var createMethod$1$2 = function (CONVERT_TO_STRING) {
   return function ($this, pos) {
-    var S = String(requireObjectCoercible$3$1($this));
+    var S = String(requireObjectCoercible$3$2($this));
     var position = toInteger$1$2(pos);
     var size = S.length;
     var first, second;
@@ -79587,7 +79599,7 @@ var advanceStringIndex$2$1 = function (S, index, unicode) {
   return index + (unicode ? charAt$3(S, index).length : 1);
 };
 
-var fixRegExpWellKnownSymbolLogic$1$1 = fixRegexpWellKnownSymbolLogic$2;
+var fixRegExpWellKnownSymbolLogic$1$2 = fixRegexpWellKnownSymbolLogic$2;
 var anObject$5$1 = anObject$e$1;
 var toObject$3$1 = toObject$7$1;
 var toLength$4$1 = toLength$8$1;
@@ -79606,7 +79618,7 @@ var maybeToString$1 = function (it) {
 }; // @@replace logic
 
 
-fixRegExpWellKnownSymbolLogic$1$1('replace', 2, function (REPLACE, nativeReplace, maybeCallNative, reason) {
+fixRegExpWellKnownSymbolLogic$1$2('replace', 2, function (REPLACE, nativeReplace, maybeCallNative, reason) {
   var REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE = reason.REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE;
   var REPLACE_KEEPS_$0 = reason.REPLACE_KEEPS_$0;
   var UNSAFE_SUBSTITUTE = REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE ? '$' : '$0';
@@ -79959,7 +79971,7 @@ var callWithSafeIterationClosing$1$1 = function (iterator, fn, value, ENTRIES) {
   }
 };
 
-var anObject$3$1 = anObject$e$1;
+var anObject$3$2 = anObject$e$1;
 var isArrayIteratorMethod$3 = isArrayIteratorMethod$1$1;
 var toLength$3$1 = toLength$8$1;
 var bind$3$1 = functionBindContext$1;
@@ -79983,7 +79995,7 @@ var iterate$1$1 = iterate$2$1.exports = function (iterable, fn, that, AS_ENTRIES
 
     if (isArrayIteratorMethod$3(iterFn)) {
       for (index = 0, length = toLength$3$1(iterable.length); length > index; index++) {
-        result = AS_ENTRIES ? boundFunction(anObject$3$1(step = iterable[index])[0], step[1]) : boundFunction(iterable[index]);
+        result = AS_ENTRIES ? boundFunction(anObject$3$2(step = iterable[index])[0], step[1]) : boundFunction(iterable[index]);
         if (result && result instanceof Result$1) return result;
       }
 
@@ -83473,7 +83485,7 @@ var ChannelTitle = function ChannelTitle(_a) {
 var Host$g$2 = _styled.span.withConfig({
   displayName: "ChannelTitle__Host",
   componentId: "sc-1lqd4of-0"
-})(templateObject_1$u$1 || (templateObject_1$u$1 = __makeTemplateObject$1(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
+})(templateObject_1$u$2 || (templateObject_1$u$2 = __makeTemplateObject$1(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
 
 function isChannel$1(value) {
   return value.id != null;
@@ -83507,7 +83519,7 @@ function getChannelDisplayName(allChannels, channelOrName, user, language) {
   return language && translations[language] || translations[user.subscription.defaultLanguage] || channel.name;
 }
 
-var templateObject_1$u$1;
+var templateObject_1$u$2;
 
 _styled(ChannelTitle).withConfig({
   displayName: "ChannelItem__StyledChannelTitle",
@@ -84009,7 +84021,7 @@ var GifSelector = function GifSelector(_a) {
       searchText = _d[0],
       setSearchText = _d[1];
 
-  var debouncedSearchText = useDebounce(searchText, 500)[0];
+  var debouncedSearchText = useDebounce$2(searchText, 500)[0];
   var windowSize = useWindowSize$2();
 
   var _e = usePromise$2(getGifs, null, [debouncedSearchText]),
@@ -87489,9 +87501,9 @@ var AuthenticationContextProvider = function AuthenticationContextProvider(_a) {
   }), void 0);
 };
 
-var version$1 = "0.4.0-preview.252";
-var buildId = "99425";
-var commitId = "a8fa644e9027fa26fda6f9e9f36870dc61597514";
+var version$1 = "0.4.0-preview.254";
+var buildId = "99446";
+var commitId = "00cb8cad9b2eef3f51f022c697ed67fb851aeeba";
 var isCustomerBuild = false;
 var buildInfo = {
 	version: version$1,
@@ -131618,8 +131630,8 @@ setSpecies$1('RegExp');var redefine$1$1=redefine$9.exports;var anObject$4=anObje
 var INCORRECT_NAME$1=nativeToString$1.name!=TO_STRING$1;// `RegExp.prototype.toString` method
 // https://tc39.github.io/ecma262/#sec-regexp.prototype.tostring
 if(NOT_GENERIC$1||INCORRECT_NAME$1){redefine$1$1(RegExp.prototype,TO_STRING$1,function toString(){var R=anObject$4(this);var p=String(R.source);var rf=R.flags;var f=String(rf===undefined&&R instanceof RegExp&&!('flags'in RegExpPrototype$1)?flags$1.call(R):rf);return '/'+p+'/'+f;},{unsafe:true});}// Sources: https://webapps.stackexchange.com/questions/54443/format-for-id-of-youtube-video
-var videoRegex=/((https?:\/\/)?((www\.)?)?)(((youtube\.com|youtu\.?be)\/[^\s]{11,}.*?)|((vimeo\.com)\/(?:video\/)?[\d]{3,})|((player\.vimeo\.com\/external)\/(\S+)))/g;function getAllVideosFromString(content){var matches,url,type;return __generator(this,function(_a){switch(_a.label){case 0:videoRegex.lastIndex=0;_a.label=1;case 1:matches=videoRegex.exec(content);url=matches===null||matches===void 0?void 0:matches[0];if(!url){return [3/*break*/,3];}type=matches.filter(function(m){return !!m;}).some(function(m){return m.indexOf('vimeo')>-1;})?AttachmentType.VimeoVideo:AttachmentType.YouTubeVideo;return [4/*yield*/,{url:url,type:type}];case 2:_a.sent();return [3/*break*/,1];case 3:return [2/*return*/];}});}function getEmbeddedObjectsFromString(content){var embeddedObjectRegex,matches,url,subscriptionIdentifier,type,id;return __generator(this,function(_a){switch(_a.label){case 0:embeddedObjectRegex=new RegExp("/([^/]{3,})(/(redirect/)?(news|events|pages|posts)/([^\\s/?]+).*?)",'g');_a.label=1;case 1:matches=embeddedObjectRegex.exec(content);url=matches===null||matches===void 0?void 0:matches[2];if(!url){return [3/*break*/,3];}subscriptionIdentifier=matches[1];type=AttachmentType.News;switch(matches[4]){case'news':type=AttachmentType.News;break;case'events':type=AttachmentType.Event;break;case'pages':type=AttachmentType.Page;break;case'posts':type=AttachmentType.Post;break;default:type=AttachmentType.News;}id=matches[5];return [4/*yield*/,{url:url,subscriptionIdentifier:subscriptionIdentifier,type:type,id:id}];case 2:_a.sent();return [3/*break*/,1];case 3:return [2/*return*/];}});}var global$8=global$m;var nativePromiseConstructor=global$8.Promise;var iterate$2={exports:{}};var anObject$3=anObject$h;var isArrayIteratorMethod=isArrayIteratorMethod$2;var toLength$5=toLength$b;var bind$3=functionBindContext;var getIteratorMethod=getIteratorMethod$4;var callWithSafeIterationClosing=callWithSafeIterationClosing$2;var Result=function(stopped,result){this.stopped=stopped;this.result=result;};var iterate$1=iterate$2.exports=function(iterable,fn,that,AS_ENTRIES,IS_ITERATOR){var boundFunction=bind$3(fn,that,AS_ENTRIES?2:1);var iterator,iterFn,index,length,result,next,step;if(IS_ITERATOR){iterator=iterable;}else {iterFn=getIteratorMethod(iterable);if(typeof iterFn!='function')throw TypeError('Target is not iterable');// optimisation for array iterators
-if(isArrayIteratorMethod(iterFn)){for(index=0,length=toLength$5(iterable.length);length>index;index++){result=AS_ENTRIES?boundFunction(anObject$3(step=iterable[index])[0],step[1]):boundFunction(iterable[index]);if(result&&result instanceof Result)return result;}return new Result(false);}iterator=iterFn.call(iterable);}next=iterator.next;while(!(step=next.call(iterator)).done){result=callWithSafeIterationClosing(iterator,boundFunction,step.value,AS_ENTRIES);if(typeof result=='object'&&result&&result instanceof Result)return result;}return new Result(false);};iterate$1.stop=function(result){return new Result(true,result);};var wellKnownSymbol$3=wellKnownSymbol$l;var ITERATOR=wellKnownSymbol$3('iterator');var SAFE_CLOSING=false;try{var called=0;var iteratorWithReturn={next:function(){return {done:!!called++};},'return':function(){SAFE_CLOSING=true;}};iteratorWithReturn[ITERATOR]=function(){return this;};// eslint-disable-next-line no-throw-literal
+var videoRegex=/((https?:\/\/)?((www\.)?)?)(((youtube\.com|youtu\.?be)\/[^\s]{11,}.*?)|((vimeo\.com)\/(?:video\/)?[\d]{3,})|((player\.vimeo\.com\/external)\/(\S+)))/g;function getAllVideosFromString(content){var matches,url,type;return __generator(this,function(_a){switch(_a.label){case 0:videoRegex.lastIndex=0;_a.label=1;case 1:matches=videoRegex.exec(content);url=matches===null||matches===void 0?void 0:matches[0];if(!url){return [3/*break*/,3];}type=matches.filter(function(m){return !!m;}).some(function(m){return m.indexOf('vimeo')>-1;})?AttachmentType.VimeoVideo:AttachmentType.YouTubeVideo;return [4/*yield*/,{url:url,type:type}];case 2:_a.sent();return [3/*break*/,1];case 3:return [2/*return*/];}});}function getEmbeddedObjectsFromString(content){var embeddedObjectRegex,matches,url,subscriptionIdentifier,type,id;return __generator(this,function(_a){switch(_a.label){case 0:embeddedObjectRegex=new RegExp("/([^/]{3,})(/(redirect/)?(news|events|pages|posts)/([^\\s/?]+).*?)",'g');_a.label=1;case 1:matches=embeddedObjectRegex.exec(content);url=matches===null||matches===void 0?void 0:matches[2];if(!url){return [3/*break*/,3];}subscriptionIdentifier=matches[1];type=AttachmentType.News;switch(matches[4]){case'news':type=AttachmentType.News;break;case'events':type=AttachmentType.Event;break;case'pages':type=AttachmentType.Page;break;case'posts':type=AttachmentType.Post;break;default:type=AttachmentType.News;}id=matches[5];return [4/*yield*/,{url:url,subscriptionIdentifier:subscriptionIdentifier,type:type,id:id}];case 2:_a.sent();return [3/*break*/,1];case 3:return [2/*return*/];}});}var global$8=global$m;var nativePromiseConstructor=global$8.Promise;var iterate$2={exports:{}};var anObject$3$1=anObject$h;var isArrayIteratorMethod=isArrayIteratorMethod$2;var toLength$5=toLength$b;var bind$3=functionBindContext;var getIteratorMethod=getIteratorMethod$4;var callWithSafeIterationClosing=callWithSafeIterationClosing$2;var Result=function(stopped,result){this.stopped=stopped;this.result=result;};var iterate$1=iterate$2.exports=function(iterable,fn,that,AS_ENTRIES,IS_ITERATOR){var boundFunction=bind$3(fn,that,AS_ENTRIES?2:1);var iterator,iterFn,index,length,result,next,step;if(IS_ITERATOR){iterator=iterable;}else {iterFn=getIteratorMethod(iterable);if(typeof iterFn!='function')throw TypeError('Target is not iterable');// optimisation for array iterators
+if(isArrayIteratorMethod(iterFn)){for(index=0,length=toLength$5(iterable.length);length>index;index++){result=AS_ENTRIES?boundFunction(anObject$3$1(step=iterable[index])[0],step[1]):boundFunction(iterable[index]);if(result&&result instanceof Result)return result;}return new Result(false);}iterator=iterFn.call(iterable);}next=iterator.next;while(!(step=next.call(iterator)).done){result=callWithSafeIterationClosing(iterator,boundFunction,step.value,AS_ENTRIES);if(typeof result=='object'&&result&&result instanceof Result)return result;}return new Result(false);};iterate$1.stop=function(result){return new Result(true,result);};var wellKnownSymbol$3=wellKnownSymbol$l;var ITERATOR=wellKnownSymbol$3('iterator');var SAFE_CLOSING=false;try{var called=0;var iteratorWithReturn={next:function(){return {done:!!called++};},'return':function(){SAFE_CLOSING=true;}};iteratorWithReturn[ITERATOR]=function(){return this;};// eslint-disable-next-line no-throw-literal
 Array.from(iteratorWithReturn,function(){throw 2;});}catch(error){/* empty */}var checkCorrectnessOfIteration$1=function(exec,SKIP_CLOSING){if(!SKIP_CLOSING&&!SAFE_CLOSING)return false;var ITERATION_SUPPORT=false;try{var object={};object[ITERATOR]=function(){return {next:function(){return {done:ITERATION_SUPPORT=true};}};};exec(object);}catch(error){/* empty */}return ITERATION_SUPPORT;};var getBuiltIn$1=getBuiltIn$6;var engineUserAgent=getBuiltIn$1('navigator','userAgent')||'';var userAgent$1=engineUserAgent;var engineIsIos=/(iphone|ipod|ipad).*applewebkit/i.test(userAgent$1);var global$7=global$m;var fails$3$1=fails$i;var classof$3=classofRaw$1;var bind$2=functionBindContext;var html=html$2;var createElement=documentCreateElement$1;var IS_IOS$1=engineIsIos;var location$1=global$7.location;var set=global$7.setImmediate;var clear=global$7.clearImmediate;var process$3=global$7.process;var MessageChannel$1=global$7.MessageChannel;var Dispatch=global$7.Dispatch;var counter=0;var queue={};var ONREADYSTATECHANGE='onreadystatechange';var defer,channel,port;var run=function(id){// eslint-disable-next-line no-prototype-builtins
 if(queue.hasOwnProperty(id)){var fn=queue[id];delete queue[id];fn();}};var runner=function(id){return function(){run(id);};};var listener=function(event){run(event.data);};var post=function(id){// old engines have not location.origin
 global$7.postMessage(id+'',location$1.protocol+'//'+location$1.host);};// Node.js 0.9+ & IE10+ has setImmediate, otherwise:
@@ -131686,13 +131698,13 @@ var STRICT_METHOD$1=arrayMethodIsStrict$1('sort');var FORCED$1=FAILS_ON_UNDEFINE
 // https://tc39.github.io/ecma262/#sec-array.prototype.sort
 $$8({target:'Array',proto:true,forced:FORCED$1},{sort:function sort(comparefn){return comparefn===undefined?nativeSort.call(toObject$3(this)):nativeSort.call(toObject$3(this),aFunction$2(comparefn));}});var SortFieldsDefinitionBuilder=/** @class */function(){function SortFieldsDefinitionBuilder(){this.sort=[];}SortFieldsDefinitionBuilder.prototype.addSortField=function(field,direction){this.sort.push(field+":"+SortFieldsDefinitionBuilder.getSortDirectionAsString(direction));return this;};SortFieldsDefinitionBuilder.getSortDirectionAsString=function(direction){return direction===SortDirection.asc?'asc':'desc';};return SortFieldsDefinitionBuilder;}();var EventSortFieldsDefinitionBuilder=/** @class */function(_super){__extends(EventSortFieldsDefinitionBuilder,_super);function EventSortFieldsDefinitionBuilder(){return _super!==null&&_super.apply(this,arguments)||this;}EventSortFieldsDefinitionBuilder.create=function(){return new EventSortFieldsDefinitionBuilder();};return EventSortFieldsDefinitionBuilder;}(SortFieldsDefinitionBuilder);EventSortFieldsDefinitionBuilder.create().addSortField('startDate',SortDirection.desc);EventSortFieldsDefinitionBuilder.create().addSortField('publishingDate',SortDirection.desc);var ItemType;(function(ItemType){ItemType[ItemType["None"]=0]="None";ItemType[ItemType["News"]=1]="News";ItemType[ItemType["Post"]=2]="Post";ItemType[ItemType["Page"]=4]="Page";ItemType[ItemType["Event"]=8]="Event";})(ItemType||(ItemType={}));// `SameValue` abstract operation
 // https://tc39.github.io/ecma262/#sec-samevalue
-var sameValue$1=Object.is||function is(x,y){// eslint-disable-next-line no-self-compare
-return x===y?x!==0||1/x===1/y:x!=x&&y!=y;};var fixRegExpWellKnownSymbolLogic$1=fixRegexpWellKnownSymbolLogic$1;var anObject$1$1=anObject$h;var requireObjectCoercible$3=requireObjectCoercible$c;var sameValue=sameValue$1;var regExpExec$1=regexpExecAbstract$1;// @@search logic
-fixRegExpWellKnownSymbolLogic$1('search',1,function(SEARCH,nativeSearch,maybeCallNative){return [// `String.prototype.search` method
+var sameValue$1$1=Object.is||function is(x,y){// eslint-disable-next-line no-self-compare
+return x===y?x!==0||1/x===1/y:x!=x&&y!=y;};var fixRegExpWellKnownSymbolLogic$1$1=fixRegexpWellKnownSymbolLogic$1;var anObject$1$1=anObject$h;var requireObjectCoercible$3$1=requireObjectCoercible$c;var sameValue$2=sameValue$1$1;var regExpExec$1$1=regexpExecAbstract$1;// @@search logic
+fixRegExpWellKnownSymbolLogic$1$1('search',1,function(SEARCH,nativeSearch,maybeCallNative){return [// `String.prototype.search` method
 // https://tc39.github.io/ecma262/#sec-string.prototype.search
-function search(regexp){var O=requireObjectCoercible$3(this);var searcher=regexp==undefined?undefined:regexp[SEARCH];return searcher!==undefined?searcher.call(regexp,O):new RegExp(regexp)[SEARCH](String(O));},// `RegExp.prototype[@@search]` method
+function search(regexp){var O=requireObjectCoercible$3$1(this);var searcher=regexp==undefined?undefined:regexp[SEARCH];return searcher!==undefined?searcher.call(regexp,O):new RegExp(regexp)[SEARCH](String(O));},// `RegExp.prototype[@@search]` method
 // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@search
-function(regexp){var res=maybeCallNative(nativeSearch,regexp,this);if(res.done)return res.value;var rx=anObject$1$1(regexp);var S=String(this);var previousLastIndex=rx.lastIndex;if(!sameValue(previousLastIndex,0))rx.lastIndex=0;var result=regExpExec$1(rx,S);if(!sameValue(rx.lastIndex,previousLastIndex))rx.lastIndex=previousLastIndex;return result===null?-1:result.index;}];});var $$7=_export;var assign=objectAssign;// `Object.assign` method
+function(regexp){var res=maybeCallNative(nativeSearch,regexp,this);if(res.done)return res.value;var rx=anObject$1$1(regexp);var S=String(this);var previousLastIndex=rx.lastIndex;if(!sameValue$2(previousLastIndex,0))rx.lastIndex=0;var result=regExpExec$1$1(rx,S);if(!sameValue$2(rx.lastIndex,previousLastIndex))rx.lastIndex=previousLastIndex;return result===null?-1:result.index;}];});var $$7=_export;var assign=objectAssign;// `Object.assign` method
 // https://tc39.github.io/ecma262/#sec-object.assign
 $$7({target:'Object',stat:true,forced:Object.assign!==assign},{assign:assign});var fixRegExpWellKnownSymbolLogic$4=fixRegexpWellKnownSymbolLogic$1;var anObject$i=anObject$h;var toObject$2=toObject$7;var toLength$4=toLength$b;var toInteger$5=toInteger$4;var requireObjectCoercible$2$1=requireObjectCoercible$c;var advanceStringIndex$4=advanceStringIndex$3;var regExpExec$3=regexpExecAbstract$1;var max$1=Math.max;var min$2=Math.min;var floor=Math.floor;var SUBSTITUTION_SYMBOLS=/\$([$&'`]|\d\d?|<[^>]*>)/g;var SUBSTITUTION_SYMBOLS_NO_NAMED=/\$([$&'`]|\d\d?)/g;var maybeToString=function(it){return it===undefined?it:String(it);};// @@replace logic
 fixRegExpWellKnownSymbolLogic$4('replace',2,function(REPLACE,nativeReplace,maybeCallNative,reason){var REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE=reason.REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE;var REPLACE_KEEPS_$0=reason.REPLACE_KEEPS_$0;var UNSAFE_SUBSTITUTE=REGEXP_REPLACE_SUBSTITUTES_UNDEFINED_CAPTURE?'$':'$0';return [// `String.prototype.replace` method
@@ -131713,7 +131725,7 @@ storage.set(cacheKey,apiPage_1).then(function(){return null;});if(!cachedPage){o
 apiItem.fileAccessToken=cachedItem.fileAccessToken;}});observer.next(apiPage_1);observer.complete();return [3/*break*/,4];case 3:err_1=_a.sent();observer.error(err_1);return [3/*break*/,4];case 4:return [2/*return*/];}});});})();});}function validateFileAccessTokens(page,modifyFunc){if(!page||!page.items){return;}page.items.forEach(function(item){var isTokenValid=isTokenStillValid(item.fileAccessToken);modifyFunc(isTokenValid,item);});}var NewsApiService=/** @class */function(){function NewsApiService(factory,subscriptionId,storage){var _this=this;this.factory=factory;this.storage=storage;this.trackExternalItem=function(itemId,itemType){return _this.api.custom(itemType+"/"+encodeURIComponent(itemId)+"/external_url/track").get().then(function(result){return result.body().data();});};this.getAllNews=function(filterDefinition,paginationToken){return fetchNewsItems('news',NewsApiService.allNewsCacheKey,_this.api,_this.storage,paginationToken,__assign(__assign({},filterDefinition||{}),{includePromoted:true}));};this.getAllUnreadNews=function(filterDefinition,paginationToken){return fetchNewsItems('news',NewsApiService.allNewsCacheKey,_this.api,_this.storage,paginationToken,__assign(__assign({},filterDefinition||{}),{unreadOnly:true,pageSize:0}));};this.getMyNews=function(filterDefinition,paginationToken){return fetchNewsItems('users/current/news',NewsApiService.newsCacheKey,_this.api,_this.storage,paginationToken,filterDefinition);};this.getMyUnreadNews=function(filterDefinition,paginationToken){return fetchNewsItems('users/current/news/unread',NewsApiService.myUnreadNewsCacheKey,_this.api,_this.storage,paginationToken,filterDefinition,true);};this.getBookmarks=function(filterDefinition){return fetchNewsItems('users/current/bookmarks',NewsApiService.bookmarksCacheKey,_this.api,_this.storage,null,filterDefinition,true);};this.getNewsFromCache=function(){return __awaiter(_this,void 0,void 0,function(){var _a;return __generator(this,function(_b){switch(_b.label){case 0:return [4/*yield*/,this.storage.getObject(NewsApiService.newsItemsCacheKey)];case 1:return [2/*return*/,(_a=_b.sent())!==null&&_a!==void 0?_a:[]];}});});};this.get=function(newsId){var getFromCache=function getFromCache(id){return __awaiter(_this,void 0,void 0,function(){var cache,hits;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,this.getNewsFromCache()];case 1:cache=_a.sent();hits=cache.filter(function(i){return i.id===id;});return [2/*return*/,hits.length>0?hits[0]:null];}});});};var getFromApi=function getFromApi(id){return from(_this.api.all('news').get(id)).pipe(mergeMap(function(res){return updateItemCache(res.body().data());}));};var updateItemCache=function updateItemCache(item){return __awaiter(_this,void 0,void 0,function(){var fromCache,index,cacheItem,clonedCachedItem,clonedNewItem;return __generator(this,function(_a){switch(_a.label){case 0:if(item.statistics){itemStatisticsCache[item.id]=Promise.resolve(__assign({},item.statistics));}return [4/*yield*/,this.getNewsFromCache()];case 1:fromCache=_a.sent();index=fromCache.findIndex(function(i){return i.id===item.id;});if(index>-1){cacheItem=fromCache[index];if(isTokenStillValid(cacheItem.fileAccessToken)){clonedCachedItem=__assign({},cacheItem);delete clonedCachedItem.fileAccessToken;clonedNewItem=__assign({},item);delete clonedNewItem.fileAccessToken;if(JSON.stringify(clonedCachedItem)===JSON.stringify(clonedNewItem)){return [2/*return*/,null];}}fromCache.splice(index,1,item);}else {fromCache.push(item);}return [4/*yield*/,this.storage.set(NewsApiService.newsItemsCacheKey,fromCache)];case 2:_a.sent();return [2/*return*/,item];}});});};return concat(getFromCache(newsId),getFromApi(newsId)).pipe(filter(function(i){return i!=null;}),catchError(function(err){if(err.response&&err.response.statusCode===404){return of(null);}else {return throwError(err);}}));};this.getImageUrlWithToken=function(token,itemId,subscriptionId,resourceType,imageIdentifier,width,height){if(imageIdentifier===void 0){imageIdentifier='banner';}return _this.factory.createApiUrl("/"+resourceType+"/"+itemId+"/images/"+imageIdentifier+"/"+width+"/"+(height||''),{access_token:token,subscriptionId:subscriptionId});};this.getStatistics=function(newsId){if(!itemStatisticsCache[newsId]){itemStatisticsCache[newsId]=_this.api.custom("news/"+newsId+"/statistics").get().then(function(result){return result.body().data();}).then(function(result){var feedbackCountsKeys=Object.keys(result.feedbackCounts);return {bookmarkCount:result.bookmarkCount,likeCount:result.feedbackCounts[feedbackCountsKeys.find(function(k){return k==='like';})],commentCount:result.commentCount,confirmationCount:result.feedbackCounts[feedbackCountsKeys.find(function(k){return k==='confirm';})],readCount:result.readCount};});}return itemStatisticsCache[newsId];};this.refreshStatistics=function(itemId,delta){return __awaiter(_this,void 0,void 0,function(){var _this=this;return __generator(this,function(_a){switch(_a.label){case 0:// update statistics cache with new delta
 if(!itemStatisticsCache[itemId]){return [2/*return*/];}return [4/*yield*/,itemStatisticsCache[itemId].then(function(statistics){var updatedStatistics=NewsApiService.getUpdatedStatistics(statistics,delta);_this.tryUpdateStatisticsInCache(itemId,updatedStatistics).then(null,null);itemStatisticsCache[itemId]=Promise.resolve(updatedStatistics);onStatisticsUpdated.next(updatedStatistics);})];case 1:_a.sent();return [2/*return*/];}});});};this.tryUpdateStatisticsInCache=function(newsId,statistics){return __awaiter(_this,void 0,void 0,function(){var fromCache,index,item;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,this.getNewsFromCache()];case 1:fromCache=_a.sent();index=fromCache.findIndex(function(i){return i.id===newsId;});item=fromCache[index];if(!item||!item.statistics){return [2/*return*/];}item.statistics=statistics;fromCache.splice(index,1,item);return [4/*yield*/,this.storage.set(NewsApiService.newsItemsCacheKey,fromCache)];case 2:_a.sent();return [2/*return*/];}});});};this.getExternalItemRoute=function(resourceType,itemId,accessToken){return _this.factory.createApiUrl("/"+resourceType+"/"+encodeURIComponent(itemId)+"/external_url",{access_token:accessToken});};this.api=factory.createApi(false,subscriptionId);}NewsApiService.getUpdatedStatistics=function(curr,delta){var _a,_b,_c,_d,_e,_f;return {bookmarkCount:curr.bookmarkCount+((_a=delta.bookmarkCount)!==null&&_a!==void 0?_a:0),commentCount:curr.commentCount+((_b=delta.commentCount)!==null&&_b!==void 0?_b:0),likeCount:curr.likeCount+((_c=delta.likeCount)!==null&&_c!==void 0?_c:0),confirmationCount:curr.confirmationCount+((_d=delta.confirmationCount)!==null&&_d!==void 0?_d:0),readCount:curr.readCount+((_e=delta.readCount)!==null&&_e!==void 0?_e:0),participantsCount:curr.participantsCount+((_f=delta.participantsCount)!==null&&_f!==void 0?_f:0)};};NewsApiService.bookmarksCacheKey='NewsService::BookmarksV2';NewsApiService.newsItemsCacheKey='NewsService::NewsItems';NewsApiService.newsCacheKey='NewsService::News';NewsApiService.allNewsCacheKey='NewsService::AllNews';NewsApiService.myUnreadNewsCacheKey='NewsService::MyUnreadNews';return NewsApiService;}();function useNewsApi(){var storage=useStorage();var factory=useApiFactory();var identifier=useContext(SubscriptionIdContext).identifier;return useMemo(function(){return new NewsApiService(factory,identifier===null||identifier===void 0?void 0:identifier.id,storage);},[factory,identifier,storage]);}function usePagesApi(){var api=useApi();var createApiUrl=useApiFactory().createApiUrl;return useMemo(function(){return {loadPage:loadPage,loadPageChildren:loadPageChildren,getRootPagesNavigation:getRootPagesNavigation,getPublishedRootPages:getPublishedRootPages,searchPublishedPages:searchPublishedPages,getSubpages:getSubpages,searchPages:searchPages,getDocumentFileUrl:getDocumentFileUrl,searchToc:searchToc};function loadPage(id){return api.all('pages').get(id,{includeNavigationContext:true}).then(function(response){var page=response.body().data();itemStatisticsCache[page.id]=Promise.resolve(__assign({},page.statistics));return page;});}function loadPageChildren(id){return api.all("pages/"+id+"/navigation/children").getAll().then(function(r){return r.body().map(function(g){return g.data();});});}function getRootPagesNavigation(){return api.all('pages').getAll().then(function(r){return r.body().map(function(g){return g.data();});});}function getPublishedRootPages(filter){var rootPagesFilter=__assign(__assign({},filter),{rootPagesOnly:true});return searchPages('pages',rootPagesFilter);}function searchPublishedPages(filter){return searchPages('pages',filter);}function getSubpages(parentId,filter){var subPagesFilter=__assign(__assign({},filter),{parentId:parentId});if(!subPagesFilter.pageSize){// return all subpages & documents
 subPagesFilter.pageSize=0;}return searchPages('pages',subPagesFilter);}function searchToc(basePath,searchValue){return searchPages(basePath,{pageSize:100,search:searchValue,searchInTitlesOnly:true});}function searchPages(basePath,filter){if(filter){filter=__assign({},filter);if(!filter.restrictToPageContext){delete filter.pageContextId;}// we never need / want to send this param to the API, only used for the UI
-delete filter.restrictToPageContext;}var params=__assign(__assign({},filter),getCommaSeparatedKeywordsString(filter===null||filter===void 0?void 0:filter.keywords));return api.all(basePath+"/search").get('',params).then(function(result){return result.body().data();});}function getDocumentFileUrl(basePath,subscriptionId,pageId,fileId,language,token){return createApiUrl("/"+basePath+"/"+pageId+"/"+language+"/documents/"+fileId,{access_token:token,subscriptionId:subscriptionId});}},[api,createApiUrl]);}function usePostsApi(){var searchAccounts=useAccountApi().searchAccounts;var api=useApi();return useMemo(function(){return {createPost:createPost,togglePostLike:togglePostLike,getPosts:getPosts,updatePost:updatePost,deletePost:deletePost,getPost:getPost,getPostThread:getPostThread,translatePost:translatePost,searchPostMentionUsers:searchPostMentionUsers};function createPost(post){return api.all("posts").post(post).then(function(result){return result.body().data();});}function togglePostLike(postId,isLiked){if(isLiked){return api.custom("posts/"+postId+"/feedback/like").put({});}else {return api.custom("posts/"+postId+"/feedback/like").delete();}}function getPosts(filter){var groupIds=[];for(var _i=1;_i<arguments.length;_i++){groupIds[_i-1]=arguments[_i];}var params=__assign(__assign(__assign({},filter),{groupId:groupIds}),getCommaSeparatedKeywordsString(filter===null||filter===void 0?void 0:filter.keywords));return api.custom("posts?"+queryString.stringify(params)).get().then(function(res){return res.body().data();});}function updatePost(postId,content,attachments,keywords){return api.all('posts').patch(postId,{content:content,attachments:attachments,keywords:keywords}).then(function(result){return result.body().data();});}function deletePost(postId){return api.all("posts").delete(postId);}function getPost(postId){return api.all('posts').get(postId).then(function(result){return result.body().data();});}function getPostThread(postId,threadId){return api.custom("posts/"+postId+"/comments/"+threadId+"/thread").get().then(function(result){return result.body().data();});}function translatePost(postId,language){return api.custom("posts/"+postId+"/content/"+language).get().then(function(res){return res.body().data();});}function searchPostMentionUsers(searchText,postGroupId){return searchAccounts({search:searchText,type:AccountType.User,localOnly:true,groupId:[postGroupId],excludeApiUsers:true});}},[api,searchAccounts]);}function useEmbeddedObjectValidator(){var _this=this;var getPost=usePostsApi().getPost;var getNews=useNewsApi().get;var loadPage=usePagesApi().loadPage;var getEvent=useEventsApi().getEvent;return function(embeddedObject){return __awaiter(_this,void 0,void 0,function(){var _a,item,error_1;return __generator(this,function(_b){switch(_b.label){case 0:_b.trys.push([0,11,,12]);_a=embeddedObject.type;switch(_a){case AttachmentType.Post:return [3/*break*/,1];case AttachmentType.News:return [3/*break*/,3];case AttachmentType.Page:return [3/*break*/,5];case AttachmentType.Event:return [3/*break*/,7];}return [3/*break*/,9];case 1:return [4/*yield*/,getPost(embeddedObject.id)];case 2:_b.sent();return [2/*return*/,true];case 3:return [4/*yield*/,getNews(embeddedObject.id).toPromise()];case 4:item=_b.sent();return [2/*return*/,!!item];case 5:return [4/*yield*/,loadPage(embeddedObject.id)];case 6:_b.sent();return [2/*return*/,true];case 7:return [4/*yield*/,getEvent(embeddedObject.id)];case 8:_b.sent();return [2/*return*/,true];case 9:throw Error('Invalid type');case 10:return [3/*break*/,12];case 11:error_1=_b.sent();logger.error(error_1);return [2/*return*/,false];case 12:return [2/*return*/];}});});};}var RichCommentInput=/*#__PURE__*/forwardRef(function(_a,ref){var className=_a.className,buttons=_a.buttons,attachments=_a.attachments,deletedAttachmentUrls=_a.deletedAttachmentUrls,onAttachmentsChange=_a.onAttachmentsChange;_a.onDeleteAttachment;var allowAttachments=_a.allowAttachments,useLargeDropTarget=_a.useLargeDropTarget,disableDragAndDrop=_a.disableDragAndDrop;_a.allowKeywords;var defaultKeywords=_a.defaultKeywords,availableKeywords=_a.availableKeywords,mandatoryKeywords=_a.mandatoryKeywords,showKeywordsPicker=_a.showKeywordsPicker,onKeywordsChange=_a.onKeywordsChange,disableAddGif=_a.disableAddGif,disableAddFiles=_a.disableAddFiles,props=__rest(_a,["className","buttons","attachments","deletedAttachmentUrls","onAttachmentsChange","onDeleteAttachment","allowAttachments","useLargeDropTarget","disableDragAndDrop","allowKeywords","defaultKeywords","availableKeywords","mandatoryKeywords","showKeywordsPicker","onKeywordsChange","disableAddGif","disableAddFiles"]);var onDrop=useCallback(handleDropFiles,[attachments,onAttachmentsChange]);var _b=useDropzone({onDrop:onDrop}),getRootProps=_b.getRootProps,getInputProps=_b.getInputProps,open=_b.open,isDragActive=_b.isDragActive;var inputRef=useRef$1(null);var formatMessage=useIntl().formatMessage;useImperativeHandle(ref,function(){return inputRef.current;},[inputRef]);var user=useCurrentUser();var debouncedOnEmbeddedObjectsOrVideosChange=useDebouncedCallback(onEmbeddedObjectsOrVideosChange,500)[0];var validateEmbeddedObject=useEmbeddedObjectValidator();var isGifButtonDisabled=props.disabled||disableAddGif;var isAttachmentsButtonDisabled=props.disabled||disableAddFiles;if(props.disabled||!allowAttachments){return jsxs(Fragment,{children:[jsx$1(CommentInput,__assign({ref:inputRef,className:className,buttons:buttons},props),void 0),showKeywordsPicker&&!props.disabled&&jsx$1(KeywordsPicker,{defaultKeywords:defaultKeywords,availableKeywords:availableKeywords,mandatoryKeywords:mandatoryKeywords,onChangeKeywords:onKeywordsChange},void 0)]},void 0);}return jsxs("div",__assign({className:className},{children:[jsx$1("input",__assign({},getInputProps()),void 0),!disableDragAndDrop&&jsx$1(DropTarget,__assign({isActive:isDragActive,isLarge:useLargeDropTarget},getRootProps({onClick:function(e){return e.stopPropagation();}}),{"data-drop-target":true},{children:isDragActive&&jsx$1(DropInfo,{isLarge:useLargeDropTarget},void 0)}),void 0),jsx$1(CommentInput,__assign({},props,{onChange:handleChange,ref:inputRef,buttons:jsxs(Fragment,{children:[jsx$1(GifButton,{disabled:isGifButtonDisabled,onGifClick:handleGifClick},'gifButton'+isGifButtonDisabled),jsx$1(IconButton,{iconProps:{iconName:'Attach'},onClick:open,disabled:isAttachmentsButtonDisabled,"data-button-type":"attach",ariaLabel:formatMessage({id:'AriaLabel.attachmentsButton'})},'attachmentsButton'+isAttachmentsButtonDisabled),buttons]},void 0)}),void 0),showKeywordsPicker&&!props.disabled&&jsx$1(KeywordsPicker,{defaultKeywords:defaultKeywords,availableKeywords:availableKeywords,mandatoryKeywords:mandatoryKeywords,onChangeKeywords:onKeywordsChange},void 0)]}),void 0);function handleChange(content){props.onChange(content);debouncedOnEmbeddedObjectsOrVideosChange(content);}function onEmbeddedObjectsOrVideosChange(content){return __awaiter(this,void 0,void 0,function(){var existingAttachments,newAttachments,matchedVideoUrls,_i,matchedVideoUrls_1,matchedUrl,url,id,matchedEmbeddedObjects,_a,matchedEmbeddedObjects_1,matchedEmbeddedObject,url,isValid;return __generator(this,function(_b){switch(_b.label){case 0:existingAttachments=new Set(attachments.map(function(a){return a.url;}));newAttachments=[];matchedVideoUrls=__spreadArray([],Array.from(getAllVideosFromString(content)));for(_i=0,matchedVideoUrls_1=matchedVideoUrls;_i<matchedVideoUrls_1.length;_i++){matchedUrl=matchedVideoUrls_1[_i];url=matchedUrl.url;id=new VideoUrlParser(url).id;if(!existingAttachments.has(url)){newAttachments.push(__assign({id:id},matchedUrl));existingAttachments.add(url);}}matchedEmbeddedObjects=__spreadArray([],Array.from(getEmbeddedObjectsFromString(content)).filter(function(ob){return ob.subscriptionIdentifier===user.subscription.id||ob.subscriptionIdentifier===user.subscription.subscriptionHandle;}));_a=0,matchedEmbeddedObjects_1=matchedEmbeddedObjects;_b.label=1;case 1:if(!(_a<matchedEmbeddedObjects_1.length))return [3/*break*/,4];matchedEmbeddedObject=matchedEmbeddedObjects_1[_a];url=matchedEmbeddedObject.url;if(!(!existingAttachments.has(url)&&!(deletedAttachmentUrls===null||deletedAttachmentUrls===void 0?void 0:deletedAttachmentUrls.includes(url))))return [3/*break*/,3];return [4/*yield*/,validateEmbeddedObject(matchedEmbeddedObject)];case 2:isValid=_b.sent();if(isValid){newAttachments.push(__assign({},matchedEmbeddedObject));existingAttachments.add(url);}_b.label=3;case 3:_a++;return [3/*break*/,1];case 4:if(newAttachments.length!==0){onAttachmentsChange(attachments.concat(newAttachments));}return [2/*return*/];}});});}function handleGifClick(newAttachment){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){onAttachmentsChange(attachments.filter(function(attachment){return attachment.type!==AttachmentType.Giphy;}).concat(newAttachment));return [2/*return*/];});});}function handleDropFiles(dropResult){return __awaiter(this,void 0,void 0,function(){var newFiles,_i,_a,image,size;return __generator(this,function(_b){switch(_b.label){case 0:newFiles=dropResult.map(function(f){return {id:createId(),file:f,filename:f.name,previewUrl:URL.createObjectURL(f),type:f.type.startsWith('image/')?AttachmentType.Image:AttachmentType.File};});_i=0,_a=newFiles.filter(function(f){return f.type===AttachmentType.Image;});_b.label=1;case 1:if(!(_i<_a.length))return [3/*break*/,4];image=_a[_i];return [4/*yield*/,getImageSize(image.previewUrl)];case 2:size=_b.sent();image.width=size.width;image.height=size.height;_b.label=3;case 3:_i++;return [3/*break*/,1];case 4:onAttachmentsChange(attachments.concat(newFiles));return [2/*return*/];}});});}});var getMicrosoftStreamEmbedVideoUrl=function getMicrosoftStreamEmbedVideoUrl(id,autoPlay){if(autoPlay===void 0){autoPlay=false;}return "https://web.microsoftstream.com/embed/video/"+id+"?autoplay="+autoPlay+"&showInfo=true";};var getMicrosoftStreamVideoUrl=function getMicrosoftStreamVideoUrl(id){return "https://web.microsoftstream.com/video/"+id+"?autoplay=true";};var VideoElementGenerator=/** @class */function(){function VideoElementGenerator(videoInfo,iframeAreaLabel,autoplay,width,videoProperties){this.videoInfo=videoInfo;this.iframeAreaLabel=iframeAreaLabel;this.autoplay=autoplay;this.width=width;this.videoProperties=videoProperties;}VideoElementGenerator.prototype.getYouTubeVideoElement=function(){// <iframe
+delete filter.restrictToPageContext;}var params=__assign(__assign({},filter),getCommaSeparatedKeywordsString(filter===null||filter===void 0?void 0:filter.keywords));return api.all(basePath+"/search").get('',params).then(function(result){return result.body().data();});}function getDocumentFileUrl(basePath,subscriptionId,pageId,fileId,language,token){return createApiUrl("/"+basePath+"/"+pageId+"/"+language+"/documents/"+fileId,{access_token:token,subscriptionId:subscriptionId});}},[api,createApiUrl]);}function usePostsApi(){var searchAccounts=useAccountApi().searchAccounts;var api=useApi();return useMemo(function(){return {createPost:createPost,togglePostLike:togglePostLike,getPosts:getPosts,updatePost:updatePost,deletePost:deletePost,getPost:getPost,getPostThread:getPostThread,translatePost:translatePost,searchPostMentionUsers:searchPostMentionUsers};function createPost(post){return api.all("posts").post(post).then(function(result){return result.body().data();});}function togglePostLike(postId,isLiked){if(isLiked){return api.custom("posts/"+postId+"/feedback/like").put({});}else {return api.custom("posts/"+postId+"/feedback/like").delete();}}function getPosts(filter){var groupIds=[];for(var _i=1;_i<arguments.length;_i++){groupIds[_i-1]=arguments[_i];}var params=__assign(__assign(__assign({},filter),{groupId:groupIds}),getCommaSeparatedKeywordsString(filter===null||filter===void 0?void 0:filter.keywords));return api.custom("posts?"+queryString.stringify(params)).get().then(function(res){return res.body().data();});}function updatePost(postId,content,attachments,keywords){return api.all('posts').patch(postId,{content:content,attachments:attachments,keywords:keywords}).then(function(result){return result.body().data();});}function deletePost(postId){return api.all("posts").delete(postId);}function getPost(postId){return api.all('posts').get(postId).then(function(result){return result.body().data();});}function getPostThread(postId,threadId){return api.custom("posts/"+postId+"/comments/"+threadId+"/thread").get().then(function(result){return result.body().data();});}function translatePost(postId,language){return api.custom("posts/"+postId+"/content/"+language).get().then(function(res){return res.body().data();});}function searchPostMentionUsers(searchText,postGroupId){return searchAccounts({search:searchText,type:AccountType.User,localOnly:true,groupId:[postGroupId],excludeApiUsers:true});}},[api,searchAccounts]);}function useEmbeddedObjectValidator(){var _this=this;var getPost=usePostsApi().getPost;var getNews=useNewsApi().get;var loadPage=usePagesApi().loadPage;var getEvent=useEventsApi().getEvent;return function(embeddedObject){return __awaiter(_this,void 0,void 0,function(){var _a,item,error_1;return __generator(this,function(_b){switch(_b.label){case 0:_b.trys.push([0,11,,12]);_a=embeddedObject.type;switch(_a){case AttachmentType.Post:return [3/*break*/,1];case AttachmentType.News:return [3/*break*/,3];case AttachmentType.Page:return [3/*break*/,5];case AttachmentType.Event:return [3/*break*/,7];}return [3/*break*/,9];case 1:return [4/*yield*/,getPost(embeddedObject.id)];case 2:_b.sent();return [2/*return*/,true];case 3:return [4/*yield*/,getNews(embeddedObject.id).toPromise()];case 4:item=_b.sent();return [2/*return*/,!!item];case 5:return [4/*yield*/,loadPage(embeddedObject.id)];case 6:_b.sent();return [2/*return*/,true];case 7:return [4/*yield*/,getEvent(embeddedObject.id)];case 8:_b.sent();return [2/*return*/,true];case 9:throw Error('Invalid type');case 10:return [3/*break*/,12];case 11:error_1=_b.sent();logger.error(error_1);return [2/*return*/,false];case 12:return [2/*return*/];}});});};}var RichCommentInput=/*#__PURE__*/forwardRef(function(_a,ref){var className=_a.className,buttons=_a.buttons,attachments=_a.attachments,deletedAttachmentUrls=_a.deletedAttachmentUrls,onAttachmentsChange=_a.onAttachmentsChange;_a.onDeleteAttachment;var allowAttachments=_a.allowAttachments,useLargeDropTarget=_a.useLargeDropTarget,disableDragAndDrop=_a.disableDragAndDrop;_a.allowKeywords;var defaultKeywords=_a.defaultKeywords,availableKeywords=_a.availableKeywords,mandatoryKeywords=_a.mandatoryKeywords,showKeywordsPicker=_a.showKeywordsPicker,onKeywordsChange=_a.onKeywordsChange,disableAddGif=_a.disableAddGif,disableAddFiles=_a.disableAddFiles,props=__rest(_a,["className","buttons","attachments","deletedAttachmentUrls","onAttachmentsChange","onDeleteAttachment","allowAttachments","useLargeDropTarget","disableDragAndDrop","allowKeywords","defaultKeywords","availableKeywords","mandatoryKeywords","showKeywordsPicker","onKeywordsChange","disableAddGif","disableAddFiles"]);var onDrop=useCallback(handleDropFiles,[attachments,onAttachmentsChange]);var _b=useDropzone({onDrop:onDrop}),getRootProps=_b.getRootProps,getInputProps=_b.getInputProps,open=_b.open,isDragActive=_b.isDragActive;var inputRef=useRef$1(null);var formatMessage=useIntl().formatMessage;useImperativeHandle(ref,function(){return inputRef.current;},[inputRef]);var user=useCurrentUser();var debouncedOnEmbeddedObjectsOrVideosChange=useDebouncedCallback$3(onEmbeddedObjectsOrVideosChange,500)[0];var validateEmbeddedObject=useEmbeddedObjectValidator();var isGifButtonDisabled=props.disabled||disableAddGif;var isAttachmentsButtonDisabled=props.disabled||disableAddFiles;if(props.disabled||!allowAttachments){return jsxs(Fragment,{children:[jsx$1(CommentInput,__assign({ref:inputRef,className:className,buttons:buttons},props),void 0),showKeywordsPicker&&!props.disabled&&jsx$1(KeywordsPicker,{defaultKeywords:defaultKeywords,availableKeywords:availableKeywords,mandatoryKeywords:mandatoryKeywords,onChangeKeywords:onKeywordsChange},void 0)]},void 0);}return jsxs("div",__assign({className:className},{children:[jsx$1("input",__assign({},getInputProps()),void 0),!disableDragAndDrop&&jsx$1(DropTarget,__assign({isActive:isDragActive,isLarge:useLargeDropTarget},getRootProps({onClick:function(e){return e.stopPropagation();}}),{"data-drop-target":true},{children:isDragActive&&jsx$1(DropInfo,{isLarge:useLargeDropTarget},void 0)}),void 0),jsx$1(CommentInput,__assign({},props,{onChange:handleChange,ref:inputRef,buttons:jsxs(Fragment,{children:[jsx$1(GifButton,{disabled:isGifButtonDisabled,onGifClick:handleGifClick},'gifButton'+isGifButtonDisabled),jsx$1(IconButton,{iconProps:{iconName:'Attach'},onClick:open,disabled:isAttachmentsButtonDisabled,"data-button-type":"attach",ariaLabel:formatMessage({id:'AriaLabel.attachmentsButton'})},'attachmentsButton'+isAttachmentsButtonDisabled),buttons]},void 0)}),void 0),showKeywordsPicker&&!props.disabled&&jsx$1(KeywordsPicker,{defaultKeywords:defaultKeywords,availableKeywords:availableKeywords,mandatoryKeywords:mandatoryKeywords,onChangeKeywords:onKeywordsChange},void 0)]}),void 0);function handleChange(content){props.onChange(content);debouncedOnEmbeddedObjectsOrVideosChange(content);}function onEmbeddedObjectsOrVideosChange(content){return __awaiter(this,void 0,void 0,function(){var existingAttachments,newAttachments,matchedVideoUrls,_i,matchedVideoUrls_1,matchedUrl,url,id,matchedEmbeddedObjects,_a,matchedEmbeddedObjects_1,matchedEmbeddedObject,url,isValid;return __generator(this,function(_b){switch(_b.label){case 0:existingAttachments=new Set(attachments.map(function(a){return a.url;}));newAttachments=[];matchedVideoUrls=__spreadArray([],Array.from(getAllVideosFromString(content)));for(_i=0,matchedVideoUrls_1=matchedVideoUrls;_i<matchedVideoUrls_1.length;_i++){matchedUrl=matchedVideoUrls_1[_i];url=matchedUrl.url;id=new VideoUrlParser(url).id;if(!existingAttachments.has(url)){newAttachments.push(__assign({id:id},matchedUrl));existingAttachments.add(url);}}matchedEmbeddedObjects=__spreadArray([],Array.from(getEmbeddedObjectsFromString(content)).filter(function(ob){return ob.subscriptionIdentifier===user.subscription.id||ob.subscriptionIdentifier===user.subscription.subscriptionHandle;}));_a=0,matchedEmbeddedObjects_1=matchedEmbeddedObjects;_b.label=1;case 1:if(!(_a<matchedEmbeddedObjects_1.length))return [3/*break*/,4];matchedEmbeddedObject=matchedEmbeddedObjects_1[_a];url=matchedEmbeddedObject.url;if(!(!existingAttachments.has(url)&&!(deletedAttachmentUrls===null||deletedAttachmentUrls===void 0?void 0:deletedAttachmentUrls.includes(url))))return [3/*break*/,3];return [4/*yield*/,validateEmbeddedObject(matchedEmbeddedObject)];case 2:isValid=_b.sent();if(isValid){newAttachments.push(__assign({},matchedEmbeddedObject));existingAttachments.add(url);}_b.label=3;case 3:_a++;return [3/*break*/,1];case 4:if(newAttachments.length!==0){onAttachmentsChange(attachments.concat(newAttachments));}return [2/*return*/];}});});}function handleGifClick(newAttachment){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){onAttachmentsChange(attachments.filter(function(attachment){return attachment.type!==AttachmentType.Giphy;}).concat(newAttachment));return [2/*return*/];});});}function handleDropFiles(dropResult){return __awaiter(this,void 0,void 0,function(){var newFiles,_i,_a,image,size;return __generator(this,function(_b){switch(_b.label){case 0:newFiles=dropResult.map(function(f){return {id:createId(),file:f,filename:f.name,previewUrl:URL.createObjectURL(f),type:f.type.startsWith('image/')?AttachmentType.Image:AttachmentType.File};});_i=0,_a=newFiles.filter(function(f){return f.type===AttachmentType.Image;});_b.label=1;case 1:if(!(_i<_a.length))return [3/*break*/,4];image=_a[_i];return [4/*yield*/,getImageSize(image.previewUrl)];case 2:size=_b.sent();image.width=size.width;image.height=size.height;_b.label=3;case 3:_i++;return [3/*break*/,1];case 4:onAttachmentsChange(attachments.concat(newFiles));return [2/*return*/];}});});}});var getMicrosoftStreamEmbedVideoUrl=function getMicrosoftStreamEmbedVideoUrl(id,autoPlay){if(autoPlay===void 0){autoPlay=false;}return "https://web.microsoftstream.com/embed/video/"+id+"?autoplay="+autoPlay+"&showInfo=true";};var getMicrosoftStreamVideoUrl=function getMicrosoftStreamVideoUrl(id){return "https://web.microsoftstream.com/video/"+id+"?autoplay=true";};var VideoElementGenerator=/** @class */function(){function VideoElementGenerator(videoInfo,iframeAreaLabel,autoplay,width,videoProperties){this.videoInfo=videoInfo;this.iframeAreaLabel=iframeAreaLabel;this.autoplay=autoplay;this.width=width;this.videoProperties=videoProperties;}VideoElementGenerator.prototype.getYouTubeVideoElement=function(){// <iframe
 //    src="https://www.youtube.com/embed/{videoId}?ecver=1" frameborder="0" allowfullscreen>
 // </iframe>
 var iframe=document.createElement('iframe');iframe.setAttribute('aria-label',this.iframeAreaLabel);iframe.setAttribute('src',"https://www.youtube.com/embed/"+this.videoInfo.id+"?rel=0&autoplay="+(this.autoplay?'1':'0'));iframe.setAttribute('frameborder','0');iframe.setAttribute('allowfullscreen','');return iframe;};VideoElementGenerator.prototype.getVimeoVideoElement=function(){// <iframe src="https://player.vimeo.com/video/{videoId}"
@@ -131826,9 +131838,9 @@ if(node.querySelector('[data-code-html]')==null){node.innerHTML='';}}};var Heade
 },[pollResult,isLoadingPollResult]);// If the pollResult and the choice input is rendered with showResults
 // at the same time, we miss the animation of the bars when they fill up
 // Delay the pollResult a bit so the users sees the animation
-var delayedFetchPollResult=useDebouncedCallback(fetchPollResults,500)[0];if(isLoading){return null;}var actualQuestions=__spreadArray(__spreadArray([],questionDefinitions),(additionalQuestions===null||additionalQuestions===void 0?void 0:additionalQuestions.questions)||[]);var hasMissingAnswers=!!userAnswers.find(function(a){return a.choiceIds.length===0;});var hasMissingUnsavedAnswer=unsavedQuestionsIds.length>0||userAnswers.some(function(a){return !a.choiceIds.length;});showResult=(showResult||!hasMissingUnsavedAnswer)&&actualQuestions.length>0;return jsx$1(PollUserContext.Provider,__assign({value:{item:item,resourceType:resourceType,questions:actualQuestions,answers:userAnswers,addAnswer:handleAddAnswer,setAnswers:setUserAnswers,pollResult:pollResult,isLoadingPollResult:isLoadingPollResult,showResult:showResult,hasMissingAnswers:hasMissingAnswers,hasMissingUnsavedAnswer:hasMissingUnsavedAnswer,submitPoll:handleSubmitPoll,getQuestionResult:getQuestionResult,reset:reset,onBehalfOfUpn:onBehalfOfUpn,fetchPollResults:fetchPollResults}},{children:jsx$1(PollTranslationContextProvider,__assign({contents:item.contents,language:language,additionalTranslations:additionalQuestions===null||additionalQuestions===void 0?void 0:additionalQuestions.translations},{children:children}),void 0)}),void 0);function handleAddAnswer(questionId,selectedChoiceIds){setUnsavedQuestionsIds(function(a){return __spreadArray(__spreadArray([],a),[questionId]);});setUserAnswers(function(answers){return answers.map(function(a){return a.questionId===questionId?__assign(__assign({},a),{choiceIds:__spreadArray([],selectedChoiceIds)}):a;});});}function handleSubmitPoll(savePollAnswers){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:_a.trys.push([0,2,,3]);setUnsavedQuestionsIds([]);return [4/*yield*/,savePollAnswers()];case 1:_a.sent();delayedFetchPollResult();return [3/*break*/,3];case 2:_a.sent();showError('Generic.error');return [3/*break*/,3];case 3:return [2/*return*/];}});});}function reset(){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){setUnsavedQuestionsIds([]);setUserAnswers(createUsersAnswersFromFeedback({records:[]}));fetchPollResults();return [2/*return*/];});});}function loadUserAnswers(){return __awaiter(this,void 0,void 0,function(){var feedback,error_2;return __generator(this,function(_a){switch(_a.label){case 0:_a.trys.push([0,2,,3]);return [4/*yield*/,getFeedback(resourceType,itemId,onBehalfOfUpn)];case 1:feedback=_a.sent();return [3/*break*/,3];case 2:error_2=_a.sent();// if we got a 404, the user doesn't exist, in this case we simply treat the feedback as it is not set yet
+var delayedFetchPollResult=useDebouncedCallback$3(fetchPollResults,500)[0];if(isLoading){return null;}var actualQuestions=__spreadArray(__spreadArray([],questionDefinitions),(additionalQuestions===null||additionalQuestions===void 0?void 0:additionalQuestions.questions)||[]);var hasMissingAnswers=!!userAnswers.find(function(a){return a.choiceIds.length===0;});var hasMissingUnsavedAnswer=unsavedQuestionsIds.length>0||userAnswers.some(function(a){return !a.choiceIds.length;});showResult=(showResult||!hasMissingUnsavedAnswer)&&actualQuestions.length>0;return jsx$1(PollUserContext.Provider,__assign({value:{item:item,resourceType:resourceType,questions:actualQuestions,answers:userAnswers,addAnswer:handleAddAnswer,setAnswers:setUserAnswers,pollResult:pollResult,isLoadingPollResult:isLoadingPollResult,showResult:showResult,hasMissingAnswers:hasMissingAnswers,hasMissingUnsavedAnswer:hasMissingUnsavedAnswer,submitPoll:handleSubmitPoll,getQuestionResult:getQuestionResult,reset:reset,onBehalfOfUpn:onBehalfOfUpn,fetchPollResults:fetchPollResults}},{children:jsx$1(PollTranslationContextProvider,__assign({contents:item.contents,language:language,additionalTranslations:additionalQuestions===null||additionalQuestions===void 0?void 0:additionalQuestions.translations},{children:children}),void 0)}),void 0);function handleAddAnswer(questionId,selectedChoiceIds){setUnsavedQuestionsIds(function(a){return __spreadArray(__spreadArray([],a),[questionId]);});setUserAnswers(function(answers){return answers.map(function(a){return a.questionId===questionId?__assign(__assign({},a),{choiceIds:__spreadArray([],selectedChoiceIds)}):a;});});}function handleSubmitPoll(savePollAnswers){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:_a.trys.push([0,2,,3]);setUnsavedQuestionsIds([]);return [4/*yield*/,savePollAnswers()];case 1:_a.sent();delayedFetchPollResult();return [3/*break*/,3];case 2:_a.sent();showError('Generic.error');return [3/*break*/,3];case 3:return [2/*return*/];}});});}function reset(){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){setUnsavedQuestionsIds([]);setUserAnswers(createUsersAnswersFromFeedback({records:[]}));fetchPollResults();return [2/*return*/];});});}function loadUserAnswers(){return __awaiter(this,void 0,void 0,function(){var feedback,error_2;return __generator(this,function(_a){switch(_a.label){case 0:_a.trys.push([0,2,,3]);return [4/*yield*/,getFeedback(resourceType,itemId,onBehalfOfUpn)];case 1:feedback=_a.sent();return [3/*break*/,3];case 2:error_2=_a.sent();// if we got a 404, the user doesn't exist, in this case we simply treat the feedback as it is not set yet
 if((error_2===null||error_2===void 0?void 0:error_2.response.statusCode)!==404){throw error_2;}feedback={records:[]};return [3/*break*/,3];case 3:return [2/*return*/,createUsersAnswersFromFeedback(feedback)];}});});}function createUsersAnswersFromFeedback(feedback){var pollFeedback=feedback.records.find(function(r){return r.type==='poll';});var answers=pollFeedback?pollFeedback.answers:[];return questionDefinitions.map(function(q){return {questionId:q.questionId,choiceIds:answers.filter(function(a){return a.questionId===q.questionId;}).map(function(a){return a.choiceIds;})[0]||[]};}).concat(getAdditionalUserAnswers?getAdditionalUserAnswers(feedback.records)||[]:[]);}function getQuestionResult(questionId){var userSelectedChoices=userAnswers.filter(function(a){return a.questionId===questionId;}).map(function(a){return a.choiceIds;})[0]||[];return {showResults:showResult||unsavedQuestionsIds.every(function(id){return id!==questionId;})&&userSelectedChoices.length>0,userSelectedChoices:userSelectedChoices,totalFeedbackCount:pollResult.totalFeedbackCount,choiceResults:pollResult.answers.filter(function(a){return a.questionId===questionId;}).reduce(function(result,answer){return __spreadArray(__spreadArray([],result),answer.choices);},[]).reduce(function(result,next){var _a;return __assign(__assign({},result),(_a={},_a[next.choiceId]=next.count,_a));},{})};}};var DetailViewSectionPadding=css$2(templateObject_1$1k||(templateObject_1$1k=__makeTemplateObject(["\n  padding: ","px ","px 0 ","px;\n\n  @media (min-width: ","px) {\n    padding: 0 ","px 0 ","px;\n  }\n"],["\n  padding: ","px ","px 0 ","px;\n\n  @media (min-width: ","px) {\n    padding: 0 ","px 0 ","px;\n  }\n"])),spacingXs,spacingM,spacingM,minScreenSize.small,spacingXl,spacingXl);var templateObject_1$1k;var PollResultFeedbackCount=function PollResultFeedbackCount(){var _a=useContext(PollUserContext),showResult=_a.showResult,pollResult=_a.pollResult;if(!showResult){return null;}return jsx$1("div",__assign({className:"ms-fontColor-neutralTertiary","data-poll-result-total-count":pollResult.totalFeedbackCount},{children:jsx$1(FormattedMessage$1,{id:"Polls.editor.totalFeedbackCount",values:{count:pollResult.totalFeedbackCount},tagName:"span"},void 0)}),void 0);};var DetailViewPoll=function DetailViewPoll(){var _a=useDetailViewContext(),item=_a.item,contentLanguage=_a.contentLanguage,resourceType=_a.resourceType,isEditorPreview=_a.isEditorPreview;var features=useFeatures();var getPollResult=useFeedbackApi().getPollResult;if(!features.polls||item==null||item.poll==null||item.poll.questions==null||item.poll.questions.length===0){return null;}return jsx$1(PollUserContextProvider,__assign({item:item,resourceType:resourceType,language:contentLanguage,getPollResults:function(itemId){return getPollResult(resourceType,itemId);}},{children:jsxs(StyledPollDisplay$1,{children:[jsx$1(PollResultFeedbackCount,{},void 0),jsx$1(DetailViewPollsSubmitButton,{isReadOnly:isEditorPreview},void 0),jsx$1(StyledPollResultExport,{},void 0)]},void 0)}),void 0);};var StyledPollResultExport=_styled(DetailViewPollExportButton).withConfig({displayName:"DetailViewPoll__StyledPollResultExport",componentId:"sc-gvqgh8-0"})(templateObject_1$1j||(templateObject_1$1j=__makeTemplateObject(["\n  margin-top: ","px;\n"],["\n  margin-top: ","px;\n"])),spacingS);var StyledPollDisplay$1=_styled(PollDisplay).withConfig({displayName:"DetailViewPoll__StyledPollDisplay",componentId:"sc-gvqgh8-1"})(templateObject_2$N||(templateObject_2$N=__makeTemplateObject(["\n  ",";\n  margin-bottom: ","px;\n\n  max-width: 500px;\n"],["\n  ",";\n  margin-bottom: ","px;\n\n  max-width: 500px;\n"])),DetailViewSectionPadding,spacingL);var templateObject_1$1j,templateObject_2$N;var EventDetailViewResponseExportButton=function EventDetailViewResponseExportButton(_a){var className=_a.className;var features=useFeatures();if(!features.events){return null;}return jsx$1(DetailViewCsvExportButton,{className:className,path:"feedback/registration/result/export",stringResource:"Events.registration.exportResultsAsCsv"},void 0);};var FeedbackItemType;(function(FeedbackItemType){FeedbackItemType["comment"]="comment";FeedbackItemType["like"]="like";FeedbackItemType["confirm"]="confirm";FeedbackItemType["poll"]="poll";FeedbackItemType["eventRegistration"]="eventRegistration";})(FeedbackItemType||(FeedbackItemType={}));var EventRegistrationContextProvider=function EventRegistrationContextProvider(_a){var _b;var onBehalfOfUpn=_a.onBehalfOfUpn,children=_a.children;var formatMessage=useIntl().formatMessage;var features=useFeatures();var _c=useDetailViewContext(),item=_c.item,contentLanguage=_c.contentLanguage;var getEventRegistrationResults=useEventRegistrationApi().getEventRegistrationResults;if(!features.events||item==null){return null;}var locationQuestionId=getLocationQuestionId(item);var isCancelled=(_b=item.cancelInformation)===null||_b===void 0?void 0:_b.isCancelled;return jsx$1(PollUserContextProvider,__assign({item:item,onBehalfOfUpn:onBehalfOfUpn,resourceType:ItemResourceTypes.Events,language:contentLanguage,getAdditionalQuestions:function(result){return getAdditionalQuestions(result);},getAdditionalUserAnswers:extractLocationAnswers,getPollResults:getRegistrationResult,showResult:!!isCancelled},{children:children}),void 0);function getAdditionalQuestions(result){var _a=getLocationPollDefinitions(item,formatMessage,result,!!onBehalfOfUpn),question=_a.question,translations=_a.translations;return {questions:question?[question]:null,translations:translations};}function extractLocationAnswers(records){if(!item.locations||item.locations.length<2){return null;}var eventResponse=records.find(function(r){return r.type===FeedbackItemType.eventRegistration;});return [{questionId:locationQuestionId,choiceIds:eventResponse&&eventResponse.locationId?[eventResponse.locationId]:[]}];}function getRegistrationResult(itemId){return __awaiter(this,void 0,void 0,function(){var result;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,getEventRegistrationResults(itemId)];case 1:result=_a.sent();return [2/*return*/,{totalFeedbackCount:result.totalFeedbackCount,answers:result.answers.concat([{questionId:locationQuestionId,choices:result.locationAnswers.map(function(l){return {choiceId:l.locationId,count:l.count};})}])}];}});});}};var EventDetailViewUserRegistration=function EventDetailViewUserRegistration(_a){var className=_a.className,hideInfoMessage=_a.hideInfoMessage;var pollUserContext=useContext(PollUserContext);var getFeedback=useFeedbackApi().getFeedback;var item=pollUserContext.item;var isLoadingPollResult=pollUserContext.isLoadingPollResult,pollResult=pollUserContext.pollResult,onBehalfOfUpn=pollUserContext.onBehalfOfUpn;var _b=usePromise$2(getEventResponse,item.userResponse,[item]),eventResponse=_b[0],isLoading=_b[1],setEventResponse=_b[3];// eslint-disable-next-line react-hooks/exhaustive-deps
-var seatsResult=useMemo(getSeatsLeft,[isLoading,isLoadingPollResult,pollResult,item.id]);return jsx$1(EventUserRegistrationContext.Provider,__assign({value:__assign(__assign({},pollUserContext),{hasPollContext:true,eventResponse:eventResponse,setEventResponse:setEventResponse,isLoading:isLoadingPollResult||isLoading,seatsInfo:seatsResult})},{children:jsx$1(EventUserRegistration,{className:className,hideInfoMessage:hideInfoMessage},void 0)}),void 0);function getEventResponse(){return __awaiter(this,void 0,void 0,function(){var feedback,eventRecord;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,getFeedback(ItemResourceTypes.Events,item.id,onBehalfOfUpn)];case 1:feedback=_a.sent();eventRecord=feedback&&feedback.records.find(function(r){return r.type==='eventRegistration';});return [2/*return*/,eventRecord?eventRecord.eventResponse:EventResponse.NotSet];}});});}function getSeatsLeft(){var _a,_b,_c,_d;if(isLoading||!item.registrationSettings||!item.registrationSettings.enabled||((_a=item.cancelInformation)===null||_a===void 0?void 0:_a.isCancelled)||!((_b=pollResult===null||pollResult===void 0?void 0:pollResult.answers)===null||_b===void 0?void 0:_b.length)||isLoadingPollResult){return {hasAnySeatsLeft:true};}var locationsWithSeats=item.locations.filter(function(l){return l.maxNumberOfSeats>0;});var hasLocationsWithoutSeats=locationsWithSeats.length!==item.locations.length;if(!locationsWithSeats.length||hasLocationsWithoutSeats){return {hasAnySeatsLeft:true};}var locationAnswers=(_d=(_c=pollResult.answers.find(function(a){return a.questionId===getLocationQuestionId(item);}))===null||_c===void 0?void 0:_c.choices)===null||_d===void 0?void 0:_d.reduce(function(prev,curr){prev[curr.choiceId]=curr.count;return prev;},{});var locationsWithSeatsLeft=locationsWithSeats.map(function(l){return __assign(__assign({},l),{seatsLeft:Math.max(l.maxNumberOfSeats-(locationAnswers[l.locationId]||0),0)});});return {hasAnySeatsLeft:locationsWithSeatsLeft.some(function(l){return l.seatsLeft>0;}),locations:locationsWithSeatsLeft};}};var EventRegistrationRegisterSomeoneElseDialog=function EventRegistrationRegisterSomeoneElseDialog(_a){var show=_a.show,onDismiss=_a.onDismiss,onUpdate=_a.onUpdate;var formatMessage=useIntl().formatMessage;var user=useCurrentUser();var features=useFeatures();var _b=useState$2(),onBehalfOfUser=_b[0],setOnBehalfOfUser=_b[1];var item=useDetailViewContext().item;var isGroupAdmin=hasMinRoleInAllGroups(GroupRoles.Admin,user,item);useListener(EventResponseTriggerAction.type,function(action){if(action.itemId!==item.id){return false;}onUpdate({upn:onBehalfOfUser.userPrincipalName,displayName:onBehalfOfUser.displayName,locationId:action.locationId},action.response);onDismiss();return true;},[item.id,onBehalfOfUser===null||onBehalfOfUser===void 0?void 0:onBehalfOfUser.userPrincipalName]);return jsx$1(MobileFullHeightDialog,__assign({hidden:!show,modalProps:{isBlocking:true,className:'dialog-register-user'},dialogContentProps:{type:DialogType.close,title:formatMessage({id:'Events.registration.registerSomeoneElse.title'})},onDismiss:onDismiss},{children:jsxs(Host$u,__assign({className:"dialog-content-host"},{children:[jsx$1(DialogGlobalStyle$2,{},void 0),jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.peoplePickerLabel"},void 0),jsx$1(StyledPeoplePicker,{accountType:AccountType.User,allowMailItems:isGroupAdmin&&features.userInvitation,localOnly:!isGroupAdmin,includePendingInvitationUsers:true,includePendingRegistrationUsers:true,selectionMode:SelectionMode.single,selectedItems:onBehalfOfUser?[onBehalfOfUser]:[],onChange:function(accounts){return setOnBehalfOfUser(accounts[0]);},placeholderStringResourceKey:"Events.registration.registerSomeoneElse.peoplePickerPlaceholder",excludedItems:[user]},void 0),onBehalfOfUser&&jsxs(EventRegistrationContextProvider,__assign({onBehalfOfUpn:onBehalfOfUser.userPrincipalName},{children:[jsxs(DialogMainContent,__assign({isScrollable:!env.isAnyMobileApp},{children:[!(onBehalfOfUser===null||onBehalfOfUser===void 0?void 0:onBehalfOfUser.id)&&jsx$1(InvitationInfoMessage,{subscriptionName:getSubscriptionName(user.subscription)},void 0),jsx$1(StyledPollDisplay,{},void 0)]}),void 0),jsx$1(DialogFooter,{children:jsxs(Buttons,{children:[jsx$1(CancelButton,{onClick:onDismiss},void 0),jsx$1(EventDetailViewUserRegistration,{hideInfoMessage:true},void 0)]},void 0)},void 0)]}),onBehalfOfUser.userPrincipalName)]}),void 0)}),void 0);};var Host$u=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__Host",componentId:"sc-1rziepe-0"})(templateObject_1$1i||(templateObject_1$1i=__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n\n  .ms-Dialog-action {\n    display: block;\n    margin: 0;\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n\n  .ms-Dialog-action {\n    display: block;\n    margin: 0;\n  }\n"])),minScreenSize.small);var Buttons=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__Buttons",componentId:"sc-1rziepe-1"})(templateObject_2$M||(templateObject_2$M=__makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  margin-right: 4px; /* buttons alignment on the right */\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  margin-right: 4px; /* buttons alignment on the right */\n"])));var StyledPeoplePicker=_styled(PeoplePicker).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledPeoplePicker",componentId:"sc-1rziepe-2"})(templateObject_3$w||(templateObject_3$w=__makeTemplateObject(["\n  margin: ","px 0 ","px 0;\n\n  .ms-BasePicker-text {\n    padding: 0 !important;\n  }\n"],["\n  margin: ","px 0 ","px 0;\n\n  .ms-BasePicker-text {\n    padding: 0 !important;\n  }\n"])),spacingS,spacingM);var DialogMainContent=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__DialogMainContent",componentId:"sc-1rziepe-3"})(templateObject_5$k||(templateObject_5$k=__makeTemplateObject(["\n  ","\n  margin-bottom: auto;\n"],["\n  ","\n  margin-bottom: auto;\n"])),function(p){return p.isScrollable&&css$2(templateObject_4$l||(templateObject_4$l=__makeTemplateObject(["\n      max-height: 300px;\n      overflow: auto;\n    "],["\n      max-height: 300px;\n      overflow: auto;\n    "])));});var StyledPollDisplay=_styled(PollDisplay).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledPollDisplay",componentId:"sc-1rziepe-4"})(templateObject_6$d||(templateObject_6$d=__makeTemplateObject(["\n  max-width: calc(100% - 10px);\n  padding-left: 4px; // needed for the focus indicator\n"],["\n  max-width: calc(100% - 10px);\n  padding-left: 4px; // needed for the focus indicator\n"])));var CancelButton=function CancelButton(_a){var onClick=_a.onClick;return jsx$1(StyledCancelButton,__assign({onClick:onClick},{children:jsx$1(FormattedMessage$1,{id:"Generic.Cancel"},void 0)}),void 0);};var InvitationInfoMessage=function InvitationInfoMessage(_a){var subscriptionName=_a.subscriptionName;return jsxs(InfoMessageHost,{children:[jsx$1(InfoIcon,{iconName:"info"},void 0),jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.userWillBeInvited",values:{subscriptionName:subscriptionName}},void 0)]},void 0);};var InfoMessageHost=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__InfoMessageHost",componentId:"sc-1rziepe-5"})(templateObject_7$8||(templateObject_7$8=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding-bottom: ","px;\n"],["\n  display: flex;\n  align-items: center;\n  padding-bottom: ","px;\n"])),spacingM);var InfoIcon=_styled(Icon).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__InfoIcon",componentId:"sc-1rziepe-6"})(templateObject_8$7||(templateObject_8$7=__makeTemplateObject(["\n  padding-right: ","px;\n"],["\n  padding-right: ","px;\n"])),spacingS);var StyledCancelButton=_styled(DefaultButton).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledCancelButton",componentId:"sc-1rziepe-7"})(templateObject_9$5||(templateObject_9$5=__makeTemplateObject(["\n  && {\n    margin-right: ","px;\n  }\n"],["\n  && {\n    margin-right: ","px;\n  }\n"])),spacingM);var DialogGlobalStyle$2=createGlobalStyle(templateObject_10$4||(templateObject_10$4=__makeTemplateObject(["\n  .dialog-register-user {\n    .ms-Overlay {\n      background-color: transparent !important;\n    }\n\n    .ms-Dialog-main {\n      box-shadow: none !important;\n\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      min-height: 466px;\n    }\n  }\n"],["\n  .dialog-register-user {\n    .ms-Overlay {\n      background-color: transparent !important;\n    }\n\n    .ms-Dialog-main {\n      box-shadow: none !important;\n\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      min-height: 466px;\n    }\n  }\n"])),maxScreenSize.small);var templateObject_1$1i,templateObject_2$M,templateObject_3$w,templateObject_4$l,templateObject_5$k,templateObject_6$d,templateObject_7$8,templateObject_8$7,templateObject_9$5,templateObject_10$4;var EventRegistrationRegisterSomeoneElseButton=function EventRegistrationRegisterSomeoneElseButton(_a){var item=_a.item,onRegister=_a.onRegister,onDeregister=_a.onDeregister;var user=useCurrentUser();var _b=useState$2(false),showDialog=_b[0],setShowDialog=_b[1];if(!hasMinRoleInAllGroups(GroupRoles.Author,user,item)){return null;}return jsxs(Fragment,{children:[jsx$1(StyledButton$1,__assign({iconProps:{iconName:'AddFriend'},onClick:function(){return setShowDialog(true);}},{children:jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.title"},void 0)}),void 0),showDialog&&jsx$1(EventRegistrationRegisterSomeoneElseDialog,{onDismiss:handleDismiss,onUpdate:handleUpdate,show:showDialog},void 0)]},void 0);function handleDismiss(){setShowDialog(false);}function handleUpdate(participant,response){if(response===EventResponse.Registered){onRegister===null||onRegister===void 0?void 0:onRegister(participant);}else {onDeregister===null||onDeregister===void 0?void 0:onDeregister(participant);}}};var StyledButton$1=_styled(ActionButton).withConfig({displayName:"EventRegistrationRegisterSomeoneElseButton__StyledButton",componentId:"sc-mgwolr-0"})(templateObject_1$1h||(templateObject_1$1h=__makeTemplateObject(["\n  && {\n    height: auto;\n    padding: 0;\n    margin-bottom: ","px;\n    border: 0;\n  }\n"],["\n  && {\n    height: auto;\n    padding: 0;\n    margin-bottom: ","px;\n    border: 0;\n  }\n"])),spacingS);var templateObject_1$1h;var EventRegistrationDeregisterPersonButton=function EventRegistrationDeregisterPersonButton(_a){var item=_a.item,participant=_a.participant,onDeregistered=_a.onDeregistered;var user=useCurrentUserContext().user;var refreshUserDetails=useRefreshUserDetails();var setEventRegistration=useEventRegistrationApi().setEventRegistration;var showToast=useNotificationContext().showToast;var formatMessage=useIntl().formatMessage;var _b=useState$2(false),showDialog=_b[0],setShowDialog=_b[1];if(!hasMinRoleInAllGroups(GroupRoles.Author,user,item)){return null;}return jsxs("div",{children:[jsx$1(Tooltip,__assign({resourceKey:"Events.registration.deRegisterSomeoneElse.title",values:{name:participant.displayName}},{children:jsx$1(IconButton,{iconProps:{iconName:'Delete'},onClick:function(){return setShowDialog(true);},ariaLabel:formatMessage({id:'Events.registration.deRegisterSomeoneElse.title'},{name:participant.displayName})},void 0)}),void 0),showDialog&&jsx$1(ConfirmDialog,{showDialog:showDialog,titleResourceKey:"Events.registration.deRegisterSomeoneElse.confirmTitle",titleResourceValues:{name:participant.displayName},onConfirm:deRegister,onClose:function(){return setShowDialog(false);}},void 0)]},void 0);function deRegister(){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:onDeregistered();return [4/*yield*/,setEventRegistration(item.id,EventResponse.NotSet,null,null,participant.upn)];case 1:_a.sent();refreshUserDetails();showToast('Events.registration.onBehalfOfDeregistrationSuccess',{mail:participant.displayName});return [2/*return*/];}});});}};var EventRegistrationParticipantsDialog=function EventRegistrationParticipantsDialog(_a){var numberOfParticipants=_a.numberOfParticipants,show=_a.show,onDismiss=_a.onDismiss;var formatMessage=useIntl().formatMessage;return jsx$1(MobileFullHeightDialog,__assign({hidden:!show,modalProps:{isBlocking:false,className:'dialog-event-participants'},dialogContentProps:{type:DialogType.close,title:formatMessage({id:'Events.registration.participants'},{count:numberOfParticipants})},onDismiss:onDismiss},{children:jsxs(Host$t,__assign({className:"dialog-content-host"},{children:[jsx$1(DialogGlobalStyle$1,{},void 0),jsx$1(ParticipantsList,{},void 0)]}),void 0)}),void 0);};var Host$t=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__Host",componentId:"sc-1biaauh-0"})(templateObject_1$1g||(templateObject_1$1g=__makeTemplateObject(["\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n"],["\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n"])),minScreenSize.small);var DialogGlobalStyle$1=createGlobalStyle(templateObject_2$L||(templateObject_2$L=__makeTemplateObject(["\n  .dialog-event-participants {\n    .ms-Dialog-main {\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      height: 466px;\n    }\n}\n"],["\n  .dialog-event-participants {\n    .ms-Dialog-main {\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      height: 466px;\n    }\n}\n"])),maxScreenSize.small);var ParticipantsList=function ParticipantsList(){var formatMessage=useIntl().formatMessage;var user=useCurrentUser();var getParticipants=useEventRegistrationApi().getParticipants;var textColors=useContext(ThemeContext$1).theme.textColors;var _a=useContext(PollUserContext),fetchPollResults=_a.fetchPollResults,publishableItem=_a.item;var item=publishableItem;var _b=usePromise$2(getSortedParticipants,[],[item.id]),unfilteredParticipants=_b[0],isLoading=_b[1],setParticipants=_b[3];var handleSearchDebounced=useDebouncedCallback(handleSearch,300)[0];var _c=useState$2(),filteredParticipants=_c[0],setFilteredParticipants=_c[1];var participants=filteredParticipants||unfilteredParticipants;return jsxs(ListHost,{children:[jsx$1(EventRegistrationRegisterSomeoneElseButton,{item:item,onDeregister:handleDeregister,onRegister:handleRegister},void 0),jsx$1(SearchArea,{children:jsx$1(StyledSearchBox$1,{placeholder:formatMessage({id:'Events.registration.participants.search.placeholder'}),disabled:isLoading,onChange:function(_,value){return handleSearchDebounced(unfilteredParticipants,value);},iconProps:{style:{color:textColors.default}}},void 0)},void 0),isLoading&&jsx$1(Spinner,{},void 0),jsx$1(ListContainer,__assign({isScrollable:!env.isAnyMobileApp},{children:participants.map(function(p){var showDeregisterButton=p.upn!==user.userPrincipalName;return jsxs(ListRow,{children:[jsx$1(PersonaCardWrapper,__assign({showDeregisterButton:showDeregisterButton},{children:jsx$1(StyledPersonaCard$4,__assign({upn:p.upn},{children:jsx$1(StyledAvatar$3,{upn:p.upn,text:p.displayName,secondaryText:p.location&&formatMessage({id:'Events.registration.participants.location'},{location:p.location})},void 0)}),void 0)}),void 0),showDeregisterButton&&jsx$1(EventRegistrationDeregisterPersonButton,{item:item,participant:p,onDeregistered:function(){return handleDeregister(p);}},void 0)]},p.upn);})}),void 0),!isLoading&&!participants.length&&jsx$1(FormattedMessage$1,{id:"Generic.noResultsFound"},void 0)]},void 0);function getSortedParticipants(){return __awaiter(this,void 0,void 0,function(){var numberOfLocations,locationsMap,participants;return __generator(this,function(_a){switch(_a.label){case 0:numberOfLocations=item===null||item===void 0?void 0:item.locations.length;locationsMap=getLocations();return [4/*yield*/,getParticipants(item.id)];case 1:participants=_a.sent()||[];return [2/*return*/,participants.map(function(p){return __assign(__assign({},p),{location:numberOfLocations>1?locationsMap[p.locationId]||'':''});}).sort(function(a,b){var locationCompare=(locationsMap[a.locationId]||'').localeCompare(locationsMap[b.locationId]||'');if(locationCompare!==0){return locationCompare;}return a.displayName.localeCompare(b.displayName);})];}});});}function getLocations(){var _a;return ((_a=item.locations)===null||_a===void 0?void 0:_a.reduce(function(prev,curr){prev[curr.locationId]=curr.name;return prev;},{}))||{};}function handleSearch(unfilteredParticipants,searchValue){if(!searchValue){setFilteredParticipants(null);return;}var filter=new RegExp(searchValue,'i');setFilteredParticipants(unfilteredParticipants.filter(function(p){return (p.displayName+"|"+p.upn+"|"+p.location).search(filter)>-1;}));}function handleDeregister(participant){setParticipants(function(ps){return ps.filter(function(p){return p.upn!==participant.upn;});});fetchPollResults();setFilteredParticipants(null);}function handleRegister(participant){setParticipants(function(ps){return ps.concat([__assign(__assign({},participant),{location:getLocations()[participant.locationId]||''})]);});fetchPollResults();setFilteredParticipants(null);}};var ListContainer=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListContainer",componentId:"sc-1biaauh-1"})(templateObject_4$k||(templateObject_4$k=__makeTemplateObject(["\n  padding: 4px;\n\n  ","\n"],["\n  padding: 4px;\n\n  ","\n"])),function(p){return p.isScrollable&&css$2(templateObject_3$v||(templateObject_3$v=__makeTemplateObject(["\n      max-height: 382px;\n      overflow: auto;\n    "],["\n      max-height: 382px;\n      overflow: auto;\n    "])));});var SearchArea=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__SearchArea",componentId:"sc-1biaauh-2"})(templateObject_5$j||(templateObject_5$j=__makeTemplateObject(["\n  margin-bottom: ","px;\n  display: flex;\n"],["\n  margin-bottom: ","px;\n  display: flex;\n"])),spacingM);var StyledSearchBox$1=_styled(SearchBox$1).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledSearchBox",componentId:"sc-1biaauh-3"})(templateObject_6$c||(templateObject_6$c=__makeTemplateObject(["\n  flex-grow: 1;\n"],["\n  flex-grow: 1;\n"])));var ListRow=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListRow",componentId:"sc-1biaauh-4"})(templateObject_7$7||(templateObject_7$7=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  margin-bottom: ","px;\n"],["\n  display: flex;\n  align-items: center;\n  margin-bottom: ","px;\n"])),spacingS);var PersonaCardWrapper=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__PersonaCardWrapper",componentId:"sc-1biaauh-5"})(templateObject_8$6||(templateObject_8$6=__makeTemplateObject(["\n  width: calc(100% - ","px);\n"],["\n  width: calc(100% - ","px);\n"])),function(p){return p.showDeregisterButton?32:0;});var StyledPersonaCard$4=_styled(PersonaCard).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledPersonaCard",componentId:"sc-1biaauh-6"})(templateObject_9$4||(templateObject_9$4=__makeTemplateObject(["\n  width: 100%;\n\n  & > * {\n    width: 100%;\n  }\n"],["\n  width: 100%;\n\n  & > * {\n    width: 100%;\n  }\n"])));var StyledAvatar$3=_styled(Avatar).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledAvatar",componentId:"sc-1biaauh-7"})(templateObject_10$3||(templateObject_10$3=__makeTemplateObject(["\n  .ms-Persona-secondaryText {\n    white-space: initial;\n  }\n\n  height: auto;\n\n  > div:first-child {\n    align-self: flex-start;\n  }\n"],["\n  .ms-Persona-secondaryText {\n    white-space: initial;\n  }\n\n  height: auto;\n\n  > div:first-child {\n    align-self: flex-start;\n  }\n"])));var ListHost=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListHost",componentId:"sc-1biaauh-8"})(templateObject_11$2$1||(templateObject_11$2$1=__makeTemplateObject([""],[""])));var templateObject_1$1g,templateObject_2$L,templateObject_3$v,templateObject_4$k,templateObject_5$j,templateObject_6$c,templateObject_7$7,templateObject_8$6,templateObject_9$4,templateObject_10$3,templateObject_11$2$1;var EventRegistrationParticipantsLink=function EventRegistrationParticipantsLink(){var _a;var user=useCurrentUser();var _b=useContext(PollUserContext),pollResult=_b.pollResult,publishableItem=_b.item;var item=publishableItem;var _c=useState$2(false),showParticipants=_c[0],setShowParticipants=_c[1];var palette=useContext(ThemeContext$1).theme.palette;if(user.isPublicUser||(pollResult===null||pollResult===void 0?void 0:pollResult.totalFeedbackCount)==null){return null;}var isUserAuthor=hasMinRoleInAllGroups(GroupRoles.Author,user,item);var canOpenParticipantsDialog=isUserAuthor||pollResult.totalFeedbackCount>0&&((_a=item.registrationSettings)===null||_a===void 0?void 0:_a.showParticipantsToEverybody);return jsxs("div",__assign({"data-poll-result-total-count":pollResult.totalFeedbackCount},{children:[!canOpenParticipantsDialog?jsx$1(NoParticipantsContainer,{children:jsx$1(FormattedMessage$1,{id:"Events.registration.participants.count",values:{count:pollResult.totalFeedbackCount}},void 0)},void 0):jsx$1(ParticipantsButton,__assign({onClick:function(){return setShowParticipants(true);},color:palette.accent},{children:jsx$1(FormattedMessage$1,{id:isUserAuthor?'Events.registration.participants.viewAndManage':'Events.registration.participants.count',values:{count:pollResult.totalFeedbackCount}},void 0)}),void 0),jsx$1(EventRegistrationParticipantsDialog,{numberOfParticipants:pollResult.totalFeedbackCount,show:showParticipants,onDismiss:function(){return setShowParticipants(false);}},void 0)]}),void 0);};var NoParticipantsContainer=_styled.div.withConfig({displayName:"EventRegistrationParticipantsLink__NoParticipantsContainer",componentId:"sc-44nkgi-0"})(templateObject_1$1f||(templateObject_1$1f=__makeTemplateObject(["\n  color: ",";\n  font-size: ","px;\n"],["\n  color: ",";\n  font-size: ","px;\n"])),function(p){return p.theme.palette.neutralTertiary;},fontSizeSmall);var ParticipantsButton=_styled(ActionButton).withConfig({displayName:"EventRegistrationParticipantsLink__ParticipantsButton",componentId:"sc-44nkgi-1"})(templateObject_2$K||(templateObject_2$K=__makeTemplateObject(["\n  && {\n    height: auto;\n    padding: 0;\n    font-size: ","px;\n  }\n"],["\n  && {\n    height: auto;\n    padding: 0;\n    font-size: ","px;\n  }\n"])),fontSizeSmall);var templateObject_1$1f,templateObject_2$K;var EventDetailViewRegistrationPoll=function EventDetailViewRegistrationPoll(){return jsx$1(EventRegistrationContextProvider,{children:jsxs(StyledPollDisplay$1,{children:[jsx$1(EventRegistrationParticipantsLink,{},void 0),jsx$1(StyledEventUserRegistration,{},void 0),jsx$1(StyledResponseExportButton,{},void 0)]},void 0)},void 0);};var StyledEventUserRegistration=_styled(EventDetailViewUserRegistration).withConfig({displayName:"EventDetailViewRegistrationPoll__StyledEventUserRegistration",componentId:"sc-1kxjndz-0"})(templateObject_1$1e||(templateObject_1$1e=__makeTemplateObject(["\n  && {\n    margin-top: ","px;\n  }\n"],["\n  && {\n    margin-top: ","px;\n  }\n"])),spacingS);var StyledResponseExportButton=_styled(EventDetailViewResponseExportButton).withConfig({displayName:"EventDetailViewRegistrationPoll__StyledResponseExportButton",componentId:"sc-1kxjndz-1"})(templateObject_2$J||(templateObject_2$J=__makeTemplateObject(["\n  margin-top: ","px;\n"],["\n  margin-top: ","px;\n"])),spacingS);var templateObject_1$1e,templateObject_2$J;var EventDetailViewRegistration=function EventDetailViewRegistration(){var item=useDetailViewContext().item;var isRegistrationEnabled=item.registrationSettings&&item.registrationSettings.enabled;if(isRegistrationEnabled){return jsx$1(EventDetailViewRegistrationPoll,{},void 0);}return jsx$1(DetailViewPoll,{},void 0);};var EventDetailViewCancelInformation=function EventDetailViewCancelInformation(){var _a=useDetailViewContext(),item=_a.item,contentLanguage=_a.contentLanguage;return jsx$1(EventCancelInformation,{item:item,language:contentLanguage},void 0);};var classof$a=classofRaw$1;// `IsArray` abstract operation
+var seatsResult=useMemo(getSeatsLeft,[isLoading,isLoadingPollResult,pollResult,item.id]);return jsx$1(EventUserRegistrationContext.Provider,__assign({value:__assign(__assign({},pollUserContext),{hasPollContext:true,eventResponse:eventResponse,setEventResponse:setEventResponse,isLoading:isLoadingPollResult||isLoading,seatsInfo:seatsResult})},{children:jsx$1(EventUserRegistration,{className:className,hideInfoMessage:hideInfoMessage},void 0)}),void 0);function getEventResponse(){return __awaiter(this,void 0,void 0,function(){var feedback,eventRecord;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,getFeedback(ItemResourceTypes.Events,item.id,onBehalfOfUpn)];case 1:feedback=_a.sent();eventRecord=feedback&&feedback.records.find(function(r){return r.type==='eventRegistration';});return [2/*return*/,eventRecord?eventRecord.eventResponse:EventResponse.NotSet];}});});}function getSeatsLeft(){var _a,_b,_c,_d;if(isLoading||!item.registrationSettings||!item.registrationSettings.enabled||((_a=item.cancelInformation)===null||_a===void 0?void 0:_a.isCancelled)||!((_b=pollResult===null||pollResult===void 0?void 0:pollResult.answers)===null||_b===void 0?void 0:_b.length)||isLoadingPollResult){return {hasAnySeatsLeft:true};}var locationsWithSeats=item.locations.filter(function(l){return l.maxNumberOfSeats>0;});var hasLocationsWithoutSeats=locationsWithSeats.length!==item.locations.length;if(!locationsWithSeats.length||hasLocationsWithoutSeats){return {hasAnySeatsLeft:true};}var locationAnswers=(_d=(_c=pollResult.answers.find(function(a){return a.questionId===getLocationQuestionId(item);}))===null||_c===void 0?void 0:_c.choices)===null||_d===void 0?void 0:_d.reduce(function(prev,curr){prev[curr.choiceId]=curr.count;return prev;},{});var locationsWithSeatsLeft=locationsWithSeats.map(function(l){return __assign(__assign({},l),{seatsLeft:Math.max(l.maxNumberOfSeats-(locationAnswers[l.locationId]||0),0)});});return {hasAnySeatsLeft:locationsWithSeatsLeft.some(function(l){return l.seatsLeft>0;}),locations:locationsWithSeatsLeft};}};var EventRegistrationRegisterSomeoneElseDialog=function EventRegistrationRegisterSomeoneElseDialog(_a){var show=_a.show,onDismiss=_a.onDismiss,onUpdate=_a.onUpdate;var formatMessage=useIntl().formatMessage;var user=useCurrentUser();var features=useFeatures();var _b=useState$2(),onBehalfOfUser=_b[0],setOnBehalfOfUser=_b[1];var item=useDetailViewContext().item;var isGroupAdmin=hasMinRoleInAllGroups(GroupRoles.Admin,user,item);useListener(EventResponseTriggerAction.type,function(action){if(action.itemId!==item.id){return false;}onUpdate({upn:onBehalfOfUser.userPrincipalName,displayName:onBehalfOfUser.displayName,locationId:action.locationId},action.response);onDismiss();return true;},[item.id,onBehalfOfUser===null||onBehalfOfUser===void 0?void 0:onBehalfOfUser.userPrincipalName]);return jsx$1(MobileFullHeightDialog,__assign({hidden:!show,modalProps:{isBlocking:true,className:'dialog-register-user'},dialogContentProps:{type:DialogType.close,title:formatMessage({id:'Events.registration.registerSomeoneElse.title'})},onDismiss:onDismiss},{children:jsxs(Host$u,__assign({className:"dialog-content-host"},{children:[jsx$1(DialogGlobalStyle$2,{},void 0),jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.peoplePickerLabel"},void 0),jsx$1(StyledPeoplePicker,{accountType:AccountType.User,allowMailItems:isGroupAdmin&&features.userInvitation,localOnly:!isGroupAdmin,includePendingInvitationUsers:true,includePendingRegistrationUsers:true,selectionMode:SelectionMode.single,selectedItems:onBehalfOfUser?[onBehalfOfUser]:[],onChange:function(accounts){return setOnBehalfOfUser(accounts[0]);},placeholderStringResourceKey:"Events.registration.registerSomeoneElse.peoplePickerPlaceholder",excludedItems:[user]},void 0),onBehalfOfUser&&jsxs(EventRegistrationContextProvider,__assign({onBehalfOfUpn:onBehalfOfUser.userPrincipalName},{children:[jsxs(DialogMainContent,__assign({isScrollable:!env.isAnyMobileApp},{children:[!(onBehalfOfUser===null||onBehalfOfUser===void 0?void 0:onBehalfOfUser.id)&&jsx$1(InvitationInfoMessage,{subscriptionName:getSubscriptionName(user.subscription)},void 0),jsx$1(StyledPollDisplay,{},void 0)]}),void 0),jsx$1(DialogFooter,{children:jsxs(Buttons,{children:[jsx$1(CancelButton,{onClick:onDismiss},void 0),jsx$1(EventDetailViewUserRegistration,{hideInfoMessage:true},void 0)]},void 0)},void 0)]}),onBehalfOfUser.userPrincipalName)]}),void 0)}),void 0);};var Host$u=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__Host",componentId:"sc-1rziepe-0"})(templateObject_1$1i||(templateObject_1$1i=__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n\n  .ms-Dialog-action {\n    display: block;\n    margin: 0;\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n\n  .ms-Dialog-action {\n    display: block;\n    margin: 0;\n  }\n"])),minScreenSize.small);var Buttons=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__Buttons",componentId:"sc-1rziepe-1"})(templateObject_2$M||(templateObject_2$M=__makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  margin-right: 4px; /* buttons alignment on the right */\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  margin-right: 4px; /* buttons alignment on the right */\n"])));var StyledPeoplePicker=_styled(PeoplePicker).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledPeoplePicker",componentId:"sc-1rziepe-2"})(templateObject_3$w||(templateObject_3$w=__makeTemplateObject(["\n  margin: ","px 0 ","px 0;\n\n  .ms-BasePicker-text {\n    padding: 0 !important;\n  }\n"],["\n  margin: ","px 0 ","px 0;\n\n  .ms-BasePicker-text {\n    padding: 0 !important;\n  }\n"])),spacingS,spacingM);var DialogMainContent=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__DialogMainContent",componentId:"sc-1rziepe-3"})(templateObject_5$k||(templateObject_5$k=__makeTemplateObject(["\n  ","\n  margin-bottom: auto;\n"],["\n  ","\n  margin-bottom: auto;\n"])),function(p){return p.isScrollable&&css$2(templateObject_4$l||(templateObject_4$l=__makeTemplateObject(["\n      max-height: 300px;\n      overflow: auto;\n    "],["\n      max-height: 300px;\n      overflow: auto;\n    "])));});var StyledPollDisplay=_styled(PollDisplay).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledPollDisplay",componentId:"sc-1rziepe-4"})(templateObject_6$d||(templateObject_6$d=__makeTemplateObject(["\n  max-width: calc(100% - 10px);\n  padding-left: 4px; // needed for the focus indicator\n"],["\n  max-width: calc(100% - 10px);\n  padding-left: 4px; // needed for the focus indicator\n"])));var CancelButton=function CancelButton(_a){var onClick=_a.onClick;return jsx$1(StyledCancelButton,__assign({onClick:onClick},{children:jsx$1(FormattedMessage$1,{id:"Generic.Cancel"},void 0)}),void 0);};var InvitationInfoMessage=function InvitationInfoMessage(_a){var subscriptionName=_a.subscriptionName;return jsxs(InfoMessageHost,{children:[jsx$1(InfoIcon,{iconName:"info"},void 0),jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.userWillBeInvited",values:{subscriptionName:subscriptionName}},void 0)]},void 0);};var InfoMessageHost=_styled.div.withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__InfoMessageHost",componentId:"sc-1rziepe-5"})(templateObject_7$8||(templateObject_7$8=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding-bottom: ","px;\n"],["\n  display: flex;\n  align-items: center;\n  padding-bottom: ","px;\n"])),spacingM);var InfoIcon=_styled(Icon).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__InfoIcon",componentId:"sc-1rziepe-6"})(templateObject_8$7||(templateObject_8$7=__makeTemplateObject(["\n  padding-right: ","px;\n"],["\n  padding-right: ","px;\n"])),spacingS);var StyledCancelButton=_styled(DefaultButton).withConfig({displayName:"EventRegistrationRegisterSomeoneElseDialog__StyledCancelButton",componentId:"sc-1rziepe-7"})(templateObject_9$5||(templateObject_9$5=__makeTemplateObject(["\n  && {\n    margin-right: ","px;\n  }\n"],["\n  && {\n    margin-right: ","px;\n  }\n"])),spacingM);var DialogGlobalStyle$2=createGlobalStyle(templateObject_10$4||(templateObject_10$4=__makeTemplateObject(["\n  .dialog-register-user {\n    .ms-Overlay {\n      background-color: transparent !important;\n    }\n\n    .ms-Dialog-main {\n      box-shadow: none !important;\n\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      min-height: 466px;\n    }\n  }\n"],["\n  .dialog-register-user {\n    .ms-Overlay {\n      background-color: transparent !important;\n    }\n\n    .ms-Dialog-main {\n      box-shadow: none !important;\n\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      min-height: 466px;\n    }\n  }\n"])),maxScreenSize.small);var templateObject_1$1i,templateObject_2$M,templateObject_3$w,templateObject_4$l,templateObject_5$k,templateObject_6$d,templateObject_7$8,templateObject_8$7,templateObject_9$5,templateObject_10$4;var EventRegistrationRegisterSomeoneElseButton=function EventRegistrationRegisterSomeoneElseButton(_a){var item=_a.item,onRegister=_a.onRegister,onDeregister=_a.onDeregister;var user=useCurrentUser();var _b=useState$2(false),showDialog=_b[0],setShowDialog=_b[1];if(!hasMinRoleInAllGroups(GroupRoles.Author,user,item)){return null;}return jsxs(Fragment,{children:[jsx$1(StyledButton$1,__assign({iconProps:{iconName:'AddFriend'},onClick:function(){return setShowDialog(true);}},{children:jsx$1(FormattedMessage$1,{id:"Events.registration.registerSomeoneElse.title"},void 0)}),void 0),showDialog&&jsx$1(EventRegistrationRegisterSomeoneElseDialog,{onDismiss:handleDismiss,onUpdate:handleUpdate,show:showDialog},void 0)]},void 0);function handleDismiss(){setShowDialog(false);}function handleUpdate(participant,response){if(response===EventResponse.Registered){onRegister===null||onRegister===void 0?void 0:onRegister(participant);}else {onDeregister===null||onDeregister===void 0?void 0:onDeregister(participant);}}};var StyledButton$1=_styled(ActionButton).withConfig({displayName:"EventRegistrationRegisterSomeoneElseButton__StyledButton",componentId:"sc-mgwolr-0"})(templateObject_1$1h||(templateObject_1$1h=__makeTemplateObject(["\n  && {\n    height: auto;\n    padding: 0;\n    margin-bottom: ","px;\n    border: 0;\n  }\n"],["\n  && {\n    height: auto;\n    padding: 0;\n    margin-bottom: ","px;\n    border: 0;\n  }\n"])),spacingS);var templateObject_1$1h;var EventRegistrationDeregisterPersonButton=function EventRegistrationDeregisterPersonButton(_a){var item=_a.item,participant=_a.participant,onDeregistered=_a.onDeregistered;var user=useCurrentUserContext().user;var refreshUserDetails=useRefreshUserDetails();var setEventRegistration=useEventRegistrationApi().setEventRegistration;var showToast=useNotificationContext().showToast;var formatMessage=useIntl().formatMessage;var _b=useState$2(false),showDialog=_b[0],setShowDialog=_b[1];if(!hasMinRoleInAllGroups(GroupRoles.Author,user,item)){return null;}return jsxs("div",{children:[jsx$1(Tooltip,__assign({resourceKey:"Events.registration.deRegisterSomeoneElse.title",values:{name:participant.displayName}},{children:jsx$1(IconButton,{iconProps:{iconName:'Delete'},onClick:function(){return setShowDialog(true);},ariaLabel:formatMessage({id:'Events.registration.deRegisterSomeoneElse.title'},{name:participant.displayName})},void 0)}),void 0),showDialog&&jsx$1(ConfirmDialog,{showDialog:showDialog,titleResourceKey:"Events.registration.deRegisterSomeoneElse.confirmTitle",titleResourceValues:{name:participant.displayName},onConfirm:deRegister,onClose:function(){return setShowDialog(false);}},void 0)]},void 0);function deRegister(){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:onDeregistered();return [4/*yield*/,setEventRegistration(item.id,EventResponse.NotSet,null,null,participant.upn)];case 1:_a.sent();refreshUserDetails();showToast('Events.registration.onBehalfOfDeregistrationSuccess',{mail:participant.displayName});return [2/*return*/];}});});}};var EventRegistrationParticipantsDialog=function EventRegistrationParticipantsDialog(_a){var numberOfParticipants=_a.numberOfParticipants,show=_a.show,onDismiss=_a.onDismiss;var formatMessage=useIntl().formatMessage;return jsx$1(MobileFullHeightDialog,__assign({hidden:!show,modalProps:{isBlocking:false,className:'dialog-event-participants'},dialogContentProps:{type:DialogType.close,title:formatMessage({id:'Events.registration.participants'},{count:numberOfParticipants})},onDismiss:onDismiss},{children:jsxs(Host$t,__assign({className:"dialog-content-host"},{children:[jsx$1(DialogGlobalStyle$1,{},void 0),jsx$1(ParticipantsList,{},void 0)]}),void 0)}),void 0);};var Host$t=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__Host",componentId:"sc-1biaauh-0"})(templateObject_1$1g||(templateObject_1$1g=__makeTemplateObject(["\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n"],["\n  @media (min-width: ","px) {\n    width: 400px;\n  }\n"])),minScreenSize.small);var DialogGlobalStyle$1=createGlobalStyle(templateObject_2$L||(templateObject_2$L=__makeTemplateObject(["\n  .dialog-event-participants {\n    .ms-Dialog-main {\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      height: 466px;\n    }\n}\n"],["\n  .dialog-event-participants {\n    .ms-Dialog-main {\n      @media (max-width: ","px) {\n        width: 100% !important;\n      }\n    }\n\n    .dialog-content-host {\n      height: 466px;\n    }\n}\n"])),maxScreenSize.small);var ParticipantsList=function ParticipantsList(){var formatMessage=useIntl().formatMessage;var user=useCurrentUser();var getParticipants=useEventRegistrationApi().getParticipants;var textColors=useContext(ThemeContext$1).theme.textColors;var _a=useContext(PollUserContext),fetchPollResults=_a.fetchPollResults,publishableItem=_a.item;var item=publishableItem;var _b=usePromise$2(getSortedParticipants,[],[item.id]),unfilteredParticipants=_b[0],isLoading=_b[1],setParticipants=_b[3];var handleSearchDebounced=useDebouncedCallback$3(handleSearch,300)[0];var _c=useState$2(),filteredParticipants=_c[0],setFilteredParticipants=_c[1];var participants=filteredParticipants||unfilteredParticipants;return jsxs(ListHost,{children:[jsx$1(EventRegistrationRegisterSomeoneElseButton,{item:item,onDeregister:handleDeregister,onRegister:handleRegister},void 0),jsx$1(SearchArea,{children:jsx$1(StyledSearchBox$1,{placeholder:formatMessage({id:'Events.registration.participants.search.placeholder'}),disabled:isLoading,onChange:function(_,value){return handleSearchDebounced(unfilteredParticipants,value);},iconProps:{style:{color:textColors.default}}},void 0)},void 0),isLoading&&jsx$1(Spinner,{},void 0),jsx$1(ListContainer,__assign({isScrollable:!env.isAnyMobileApp},{children:participants.map(function(p){var showDeregisterButton=p.upn!==user.userPrincipalName;return jsxs(ListRow,{children:[jsx$1(PersonaCardWrapper,__assign({showDeregisterButton:showDeregisterButton},{children:jsx$1(StyledPersonaCard$4,__assign({upn:p.upn},{children:jsx$1(StyledAvatar$3,{upn:p.upn,text:p.displayName,secondaryText:p.location&&formatMessage({id:'Events.registration.participants.location'},{location:p.location})},void 0)}),void 0)}),void 0),showDeregisterButton&&jsx$1(EventRegistrationDeregisterPersonButton,{item:item,participant:p,onDeregistered:function(){return handleDeregister(p);}},void 0)]},p.upn);})}),void 0),!isLoading&&!participants.length&&jsx$1(FormattedMessage$1,{id:"Generic.noResultsFound"},void 0)]},void 0);function getSortedParticipants(){return __awaiter(this,void 0,void 0,function(){var numberOfLocations,locationsMap,participants;return __generator(this,function(_a){switch(_a.label){case 0:numberOfLocations=item===null||item===void 0?void 0:item.locations.length;locationsMap=getLocations();return [4/*yield*/,getParticipants(item.id)];case 1:participants=_a.sent()||[];return [2/*return*/,participants.map(function(p){return __assign(__assign({},p),{location:numberOfLocations>1?locationsMap[p.locationId]||'':''});}).sort(function(a,b){var locationCompare=(locationsMap[a.locationId]||'').localeCompare(locationsMap[b.locationId]||'');if(locationCompare!==0){return locationCompare;}return a.displayName.localeCompare(b.displayName);})];}});});}function getLocations(){var _a;return ((_a=item.locations)===null||_a===void 0?void 0:_a.reduce(function(prev,curr){prev[curr.locationId]=curr.name;return prev;},{}))||{};}function handleSearch(unfilteredParticipants,searchValue){if(!searchValue){setFilteredParticipants(null);return;}var filter=new RegExp(searchValue,'i');setFilteredParticipants(unfilteredParticipants.filter(function(p){return (p.displayName+"|"+p.upn+"|"+p.location).search(filter)>-1;}));}function handleDeregister(participant){setParticipants(function(ps){return ps.filter(function(p){return p.upn!==participant.upn;});});fetchPollResults();setFilteredParticipants(null);}function handleRegister(participant){setParticipants(function(ps){return ps.concat([__assign(__assign({},participant),{location:getLocations()[participant.locationId]||''})]);});fetchPollResults();setFilteredParticipants(null);}};var ListContainer=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListContainer",componentId:"sc-1biaauh-1"})(templateObject_4$k||(templateObject_4$k=__makeTemplateObject(["\n  padding: 4px;\n\n  ","\n"],["\n  padding: 4px;\n\n  ","\n"])),function(p){return p.isScrollable&&css$2(templateObject_3$v||(templateObject_3$v=__makeTemplateObject(["\n      max-height: 382px;\n      overflow: auto;\n    "],["\n      max-height: 382px;\n      overflow: auto;\n    "])));});var SearchArea=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__SearchArea",componentId:"sc-1biaauh-2"})(templateObject_5$j||(templateObject_5$j=__makeTemplateObject(["\n  margin-bottom: ","px;\n  display: flex;\n"],["\n  margin-bottom: ","px;\n  display: flex;\n"])),spacingM);var StyledSearchBox$1=_styled(SearchBox$1).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledSearchBox",componentId:"sc-1biaauh-3"})(templateObject_6$c||(templateObject_6$c=__makeTemplateObject(["\n  flex-grow: 1;\n"],["\n  flex-grow: 1;\n"])));var ListRow=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListRow",componentId:"sc-1biaauh-4"})(templateObject_7$7||(templateObject_7$7=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  margin-bottom: ","px;\n"],["\n  display: flex;\n  align-items: center;\n  margin-bottom: ","px;\n"])),spacingS);var PersonaCardWrapper=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__PersonaCardWrapper",componentId:"sc-1biaauh-5"})(templateObject_8$6||(templateObject_8$6=__makeTemplateObject(["\n  width: calc(100% - ","px);\n"],["\n  width: calc(100% - ","px);\n"])),function(p){return p.showDeregisterButton?32:0;});var StyledPersonaCard$4=_styled(PersonaCard).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledPersonaCard",componentId:"sc-1biaauh-6"})(templateObject_9$4||(templateObject_9$4=__makeTemplateObject(["\n  width: 100%;\n\n  & > * {\n    width: 100%;\n  }\n"],["\n  width: 100%;\n\n  & > * {\n    width: 100%;\n  }\n"])));var StyledAvatar$3=_styled(Avatar).withConfig({displayName:"EventRegistrationParticipantsDialog__StyledAvatar",componentId:"sc-1biaauh-7"})(templateObject_10$3||(templateObject_10$3=__makeTemplateObject(["\n  .ms-Persona-secondaryText {\n    white-space: initial;\n  }\n\n  height: auto;\n\n  > div:first-child {\n    align-self: flex-start;\n  }\n"],["\n  .ms-Persona-secondaryText {\n    white-space: initial;\n  }\n\n  height: auto;\n\n  > div:first-child {\n    align-self: flex-start;\n  }\n"])));var ListHost=_styled.div.withConfig({displayName:"EventRegistrationParticipantsDialog__ListHost",componentId:"sc-1biaauh-8"})(templateObject_11$2$1||(templateObject_11$2$1=__makeTemplateObject([""],[""])));var templateObject_1$1g,templateObject_2$L,templateObject_3$v,templateObject_4$k,templateObject_5$j,templateObject_6$c,templateObject_7$7,templateObject_8$6,templateObject_9$4,templateObject_10$3,templateObject_11$2$1;var EventRegistrationParticipantsLink=function EventRegistrationParticipantsLink(){var _a;var user=useCurrentUser();var _b=useContext(PollUserContext),pollResult=_b.pollResult,publishableItem=_b.item;var item=publishableItem;var _c=useState$2(false),showParticipants=_c[0],setShowParticipants=_c[1];var palette=useContext(ThemeContext$1).theme.palette;if(user.isPublicUser||(pollResult===null||pollResult===void 0?void 0:pollResult.totalFeedbackCount)==null){return null;}var isUserAuthor=hasMinRoleInAllGroups(GroupRoles.Author,user,item);var canOpenParticipantsDialog=isUserAuthor||pollResult.totalFeedbackCount>0&&((_a=item.registrationSettings)===null||_a===void 0?void 0:_a.showParticipantsToEverybody);return jsxs("div",__assign({"data-poll-result-total-count":pollResult.totalFeedbackCount},{children:[!canOpenParticipantsDialog?jsx$1(NoParticipantsContainer,{children:jsx$1(FormattedMessage$1,{id:"Events.registration.participants.count",values:{count:pollResult.totalFeedbackCount}},void 0)},void 0):jsx$1(ParticipantsButton,__assign({onClick:function(){return setShowParticipants(true);},color:palette.accent},{children:jsx$1(FormattedMessage$1,{id:isUserAuthor?'Events.registration.participants.viewAndManage':'Events.registration.participants.count',values:{count:pollResult.totalFeedbackCount}},void 0)}),void 0),jsx$1(EventRegistrationParticipantsDialog,{numberOfParticipants:pollResult.totalFeedbackCount,show:showParticipants,onDismiss:function(){return setShowParticipants(false);}},void 0)]}),void 0);};var NoParticipantsContainer=_styled.div.withConfig({displayName:"EventRegistrationParticipantsLink__NoParticipantsContainer",componentId:"sc-44nkgi-0"})(templateObject_1$1f||(templateObject_1$1f=__makeTemplateObject(["\n  color: ",";\n  font-size: ","px;\n"],["\n  color: ",";\n  font-size: ","px;\n"])),function(p){return p.theme.palette.neutralTertiary;},fontSizeSmall);var ParticipantsButton=_styled(ActionButton).withConfig({displayName:"EventRegistrationParticipantsLink__ParticipantsButton",componentId:"sc-44nkgi-1"})(templateObject_2$K||(templateObject_2$K=__makeTemplateObject(["\n  && {\n    height: auto;\n    padding: 0;\n    font-size: ","px;\n  }\n"],["\n  && {\n    height: auto;\n    padding: 0;\n    font-size: ","px;\n  }\n"])),fontSizeSmall);var templateObject_1$1f,templateObject_2$K;var EventDetailViewRegistrationPoll=function EventDetailViewRegistrationPoll(){return jsx$1(EventRegistrationContextProvider,{children:jsxs(StyledPollDisplay$1,{children:[jsx$1(EventRegistrationParticipantsLink,{},void 0),jsx$1(StyledEventUserRegistration,{},void 0),jsx$1(StyledResponseExportButton,{},void 0)]},void 0)},void 0);};var StyledEventUserRegistration=_styled(EventDetailViewUserRegistration).withConfig({displayName:"EventDetailViewRegistrationPoll__StyledEventUserRegistration",componentId:"sc-1kxjndz-0"})(templateObject_1$1e||(templateObject_1$1e=__makeTemplateObject(["\n  && {\n    margin-top: ","px;\n  }\n"],["\n  && {\n    margin-top: ","px;\n  }\n"])),spacingS);var StyledResponseExportButton=_styled(EventDetailViewResponseExportButton).withConfig({displayName:"EventDetailViewRegistrationPoll__StyledResponseExportButton",componentId:"sc-1kxjndz-1"})(templateObject_2$J||(templateObject_2$J=__makeTemplateObject(["\n  margin-top: ","px;\n"],["\n  margin-top: ","px;\n"])),spacingS);var templateObject_1$1e,templateObject_2$J;var EventDetailViewRegistration=function EventDetailViewRegistration(){var item=useDetailViewContext().item;var isRegistrationEnabled=item.registrationSettings&&item.registrationSettings.enabled;if(isRegistrationEnabled){return jsx$1(EventDetailViewRegistrationPoll,{},void 0);}return jsx$1(DetailViewPoll,{},void 0);};var EventDetailViewCancelInformation=function EventDetailViewCancelInformation(){var _a=useDetailViewContext(),item=_a.item,contentLanguage=_a.contentLanguage;return jsx$1(EventCancelInformation,{item:item,language:contentLanguage},void 0);};var classof$a=classofRaw$1;// `IsArray` abstract operation
 // https://tc39.github.io/ecma262/#sec-isarray
 var isArray$3=Array.isArray||function isArray(arg){return classof$a(arg)=='Array';};var $$3=_export;var isArray$2=isArray$3;var nativeReverse=[].reverse;var test=[1,2];// `Array.prototype.reverse` method
 // https://tc39.github.io/ecma262/#sec-array.prototype.reverse
@@ -131854,7 +131866,7 @@ if(container.current&&location.hash==='#comments'){setTimeout(function(){return
 if((_a=match.params)===null||_a===void 0?void 0:_a.threadId){history.push(__assign(__assign({},location),{pathname:buildPath("/"+type+"/"+item.id)}));}setThreadId(null);}function hasFeedbackEnabled(feedbackType){return hasFeedbackType(feedbackSettings||{},feedbackType);}function handleOnShowAllComments(){var _a;setThreadId(null);if((_a=match.params)===null||_a===void 0?void 0:_a.threadId){history.push(__assign(__assign({},location),{pathname:buildPath(type+"/"+item.id)}));}}};var StyledFeedbackButtons=_styled(FeedbackButtons).withConfig({displayName:"FeedbackSection__StyledFeedbackButtons",componentId:"sc-3bzj8d-0"})(templateObject_1$17||(templateObject_1$17=__makeTemplateObject(["\n  padding-bottom: ",";\n  @media (max-width: 500px) {\n    margin-bottom: 15px;\n  }\n"],["\n  padding-bottom: ",";\n  @media (max-width: 500px) {\n    margin-bottom: 15px;\n  }\n"])),function(p){return p.showComments?'15px':'30px';});var templateObject_1$17;var FeedbackButtonLike=function FeedbackButtonLike(_a){var isReadOnly=_a.isReadOnly;var refreshStatistics=useNewsApi().refreshStatistics;var features=useFeatures();var _b=useContext(FeedbackButtonContext),item=_b.item,likeCount=_b.statistics.likeCount,resourceType=_b.resourceType,hasFeedbackEnabled=_b.hasFeedbackEnabled;var _c=useFeedbackApi(),getFeedback=_c.getFeedback,setFeedback=_c.setFeedback,unsetFeedback=_c.unsetFeedback;var showError=useNotificationContext().showError;var _d=usePromise$2(getLikeState,false,[item.id]),isLiked=_d[0],isLoading=_d[1],setIsLiked=_d[3];var _e=useState$2(false),isSaving=_e[0],setIsSaving=_e[1];if(!features.likes||!hasFeedbackEnabled('like')){return null;}return jsx$1(LikeButton,{itemType:resourceType,itemId:item.id,isActive:isLiked,readOnly:isLoading||isSaving||isReadOnly,count:likeCount,onClick:function(){return handleLikeChanged(!isLiked);},isDemoContent:item.isDemoContent},void 0);function getLikeState(){var _a;return __awaiter(this,void 0,void 0,function(){var hasPublishedVersion,feedbackSummary;return __generator(this,function(_b){switch(_b.label){case 0:hasPublishedVersion=item.publishedVersionId!=null||item.isCurrentPublishedVersion;if(isReadOnly&&!hasPublishedVersion){return [2/*return*/,false];}if(!features.likes||!hasFeedbackEnabled('like')){return [2/*return*/,false];}return [4/*yield*/,getFeedback(resourceType,item.id)];case 1:feedbackSummary=_b.sent();return [2/*return*/,((_a=feedbackSummary.records)===null||_a===void 0?void 0:_a.findIndex(function(r){return r.type==='like';}))>-1];}});});}function handleLikeChanged(isNowLiked){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_b){switch(_b.label){case 0:if(isSaving||isLoading){return [2/*return*/];}setIsSaving(true);setIsLiked(isNowLiked);return [4/*yield*/,refreshStatistics(item.id,{likeCount:isNowLiked?1:-1})];case 1:_b.sent();_b.label=2;case 2:_b.trys.push([2,7,9,10]);if(!isNowLiked)return [3/*break*/,4];return [4/*yield*/,setFeedback(resourceType,item.id,'like')];case 3:_b.sent();return [3/*break*/,6];case 4:return [4/*yield*/,unsetFeedback(resourceType,item.id,'like')];case 5:_b.sent();_b.label=6;case 6:return [3/*break*/,10];case 7:_b.sent();setIsLiked(!isNowLiked);return [4/*yield*/,refreshStatistics(item.id,{likeCount:isNowLiked?-1:1})];case 8:_b.sent();showError('NewsArticle.setFeedback_error');return [3/*break*/,10];case 9:setIsSaving(false);return [7/*endfinally*/];case 10:return [2/*return*/];}});});}};var FeedbackButtonComments=function FeedbackButtonComments(){var features=useFeatures();var formatMessage=useIntl().formatMessage;var _a=useContext(FeedbackButtonContext),commentCount=_a.statistics.commentCount,resourceType=_a.resourceType,hasFeedbackEnabled=_a.hasFeedbackEnabled;if(!features.comments||!hasFeedbackEnabled('comment')){return null;}return jsx$1(FeedbackCountButton,{count:commentCount,iconName:"Chat",readOnly:true,tooltipResourceKey:resourceType===ItemResourceTypes.Pages?'Page.numberOfComments':'NewsArticle.numberOfComments',tooltipResourceKeyValues:{count:commentCount},ariaLabel:formatMessage({id:'AriaLabel.commentsButton'}),feedbackType:"comment"},void 0);};var FeedbackButtonViews=function FeedbackButtonViews(){var _a=useContext(FeedbackButtonContext),readCount=_a.statistics.readCount,resourceType=_a.resourceType;var formatMessage=useIntl().formatMessage;var resourceKey=getResourceKey();return jsx$1(FeedbackCountButton,{count:readCount,iconName:"View",readOnly:true,tooltipResourceKey:resourceKey,tooltipResourceKeyValues:{count:readCount},ariaLabel:formatMessage({id:resourceKey},{count:readCount}),feedbackType:"view"},void 0);function getResourceKey(){if(resourceType===ItemResourceTypes.Pages){return 'Page.readersTooltip';}if(resourceType===ItemResourceTypes.News){return 'NewsArticle.readersTooltip';}return 'Events.readersTooltip';}};var EventDownloadCalendarFileButton=function EventDownloadCalendarFileButton(_a){var item=_a.item,className=_a.className;var user=useCurrentUser();var createApiUrl=useApiFactory().createApiUrl;var formatMessage=useIntl().formatMessage;return jsx$1(Host$r,__assign({className:className},{children:jsx$1(Tooltip,__assign({resourceKey:"Events.downloadCalendarFile"},{children:jsx$1(DownloadLink,__assign({href:getDownloadUrl(),"aria-label":formatMessage({id:'Events.downloadCalendarFile'})},{children:jsx$1(Icon,{iconName:"AddEvent"},void 0)}),void 0)}),void 0)}),void 0);function getDownloadUrl(){return createApiUrl("/events/"+encodeURI(item.id)+"/export",{access_token:item.fileAccessToken,subscriptionId:user.subscription.id});}};var Host$r=_styled.div.withConfig({displayName:"EventDownloadCalendarFileButton__Host",componentId:"sc-1hjuosf-0"})(templateObject_1$16||(templateObject_1$16=__makeTemplateObject(["\n  && {\n    > div {\n      display: inline-block;\n    }\n\n    i {\n      font-size: 22px;\n    }\n  }\n"],["\n  && {\n    > div {\n      display: inline-block;\n    }\n\n    i {\n      font-size: 22px;\n    }\n  }\n"])));var DownloadLink=_styled.a.withConfig({displayName:"EventDownloadCalendarFileButton__DownloadLink",componentId:"sc-1hjuosf-1"})(templateObject_2$D||(templateObject_2$D=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: ","px;\n  width: ","px;\n  color: ",";\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: ","px;\n  width: ","px;\n  color: ",";\n"])),feedbackButtonHeight,feedbackButtonHeight,function(p){return p.theme.textColors.default;});var templateObject_1$16,templateObject_2$D;var EventFeedbackButtonDownloadCalendarFile=function EventFeedbackButtonDownloadCalendarFile(){var item=useContext(FeedbackButtonContext).item;return jsx$1(StyledEventDownloadCalendarFileButton,{item:item},void 0);};var StyledEventDownloadCalendarFileButton=_styled(EventDownloadCalendarFileButton).withConfig({displayName:"EventFeedbackButtonDownloadCalendarFile__StyledEventDownloadCalendarFileButton",componentId:"sc-dsznxm-0"})(templateObject_1$15||(templateObject_1$15=__makeTemplateObject(["\n  min-width: 60px;\n  margin-right: 9px;\n"],["\n  min-width: 60px;\n  margin-right: 9px;\n"])));var templateObject_1$15;var ShareButton=function ShareButton(_a){var url=_a.url,isReadOnly=_a.isReadOnly,className=_a.className;var copyContainerRef=useRef$1();var _b=useState$2(false),didCopy=_b[0],setDidCopy=_b[1];var onShare=useContext(LinkContext).onShare;var formatMessage=useIntl().formatMessage;return jsx$1(Host$q,__assign({className:className},{children:jsx$1(Tooltip,__assign({resourceKey:"ShareButton.ActionDescription"},{children:jsxs(StyledIconWithCallout,__assign({icon:"Share",onIconClick:function(){return __awaiter(void 0,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,onShare(url)];case 1:return [2/*return*/,_a.sent()];}});});},onCalloutDismissed:function(){return setDidCopy(false);},directionalHint:DirectionalHint.topAutoEdge,ariaLabel:formatMessage({id:'ShareButton.ActionDescription'}),disabled:isReadOnly},{children:[jsx$1(FormattedMessage$1,{id:"ShareButton.ActionDescription"},void 0),jsxs(CopyContainer,__assign({ref:copyContainerRef},{children:[jsx$1(CopyField,{value:url,readOnly:true,onFocus:handleTextFieldFocus,onMouseUp:function(e){return e.preventDefault();},ariaLabel:formatMessage({id:'AriaLabel.shareButton.copyField'})},void 0),jsx$1(CopyIconButton,{iconProps:{iconName:'Copy'},onClick:copyToClipBoard,ariaLabel:formatMessage({id:'AriaLabel.copyText'})},void 0)]}),void 0),didCopy&&jsx$1(FormattedMessage$1,{id:"ShareButton.CopySuccess"},void 0)]}),void 0)}),void 0)}),void 0);function copyToClipBoard(){var tempTextField=document.createElement('textarea');tempTextField.innerText=url;copyContainerRef.current.appendChild(tempTextField);tempTextField.select();document.execCommand('copy');copyContainerRef.current.removeChild(tempTextField);setDidCopy(true);}function handleTextFieldFocus(event){event.target.select();}};var Host$q=_styled.div.withConfig({displayName:"ShareButton__Host",componentId:"sc-6avyh0-0"})(templateObject_1$14||(templateObject_1$14=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"],["\n  display: flex;\n  align-items: center;\n"])));var StyledIconWithCallout=_styled(IconWithCallout).withConfig({displayName:"ShareButton__StyledIconWithCallout",componentId:"sc-6avyh0-1"})(templateObject_2$C||(templateObject_2$C=__makeTemplateObject(["\n  button {\n    height: ","px;\n  }\n\n  i {\n    font-size: ","px;\n  }\n"],["\n  button {\n    height: ","px;\n  }\n\n  i {\n    font-size: ","px;\n  }\n"])),feedbackButtonHeight,fontSizeMedium+4);var CopyContainer=_styled.div.withConfig({displayName:"ShareButton__CopyContainer",componentId:"sc-6avyh0-2"})(templateObject_3$r||(templateObject_3$r=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: 15px 0;\n"],["\n  display: flex;\n  align-items: center;\n  padding: 15px 0;\n"])));var CopyField=_styled(TextField).withConfig({displayName:"ShareButton__CopyField",componentId:"sc-6avyh0-3"})(templateObject_4$h||(templateObject_4$h=__makeTemplateObject(["\n  padding-right: ","px;\n  width: 400px;\n"],["\n  padding-right: ","px;\n  width: 400px;\n"])),spacingS);var CopyIconButton=_styled(IconButton).withConfig({displayName:"ShareButton__CopyIconButton",componentId:"sc-6avyh0-4"})(templateObject_5$g||(templateObject_5$g=__makeTemplateObject(["\n  i {\n    font-size: ","px;\n  }\n"],["\n  i {\n    font-size: ","px;\n  }\n"])),fontSizeMedium+4);var templateObject_1$14,templateObject_2$C,templateObject_3$r,templateObject_4$h,templateObject_5$g;var FeedbackButtonShare=function FeedbackButtonShare(_a){var isReadOnly=_a.isReadOnly;var item=useContext(FeedbackButtonContext).item;return jsx$1(ShareButton,{url:item.permalink,isReadOnly:isReadOnly},void 0);};var ConfirmationStatistics=function ConfirmationStatistics(_a){var count=_a.count;return jsxs(Host$p,{children:[jsx$1(Icon,{iconName:"Accept"},void 0),jsx$1(FormattedMessage$1,{id:'NewsArticle.feedback.statistic.label',values:{count:count}},void 0)]},void 0);};var Host$p=_styled.div.withConfig({displayName:"ConfirmationStatistics__Host",componentId:"sc-1wprhw1-0"})(templateObject_1$13||(templateObject_1$13=__makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n\n  i {\n    margin-right: ","px;\n  }\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"],["\n  display: inline-flex;\n  align-items: center;\n\n  i {\n    margin-right: ","px;\n  }\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"])),spacingXs-1,maxScreenSize.medium,fontSizeSmall);var templateObject_1$13;var ConfirmationStatisticsExport=function ConfirmationStatisticsExport(_a){var item=_a.item;var createApiUrl=useApiFactory().createApiUrl;var formatMessage=useIntl().formatMessage;var exchangeShortLivedToken=useFileAccessTokenApi().exchangeShortLivedToken;return jsx$1(Host$o,__assign({resourceKey:"DownloadButton.downloadTooltip"},{children:jsx$1(DownloadButton$1,{onClick:startDownload,iconProps:{iconName:'Download'},"aria-label":formatMessage({id:'AriaLabel.confirmationStatisticsExportButton'})},void 0)}),void 0);function startDownload(){return __awaiter(this,void 0,void 0,function(){var token;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,exchangeShortLivedToken(item.fileAccessToken)];case 1:token=_a.sent();window.open(getFileUrlWithToken(item.id,token||item.fileAccessToken));return [2/*return*/];}});});}function getFileUrlWithToken(newsId,fileDownloadToken){return createApiUrl("/news/"+newsId+"/statistics/confirmations",{access_token:fileDownloadToken});}};var DownloadButton$1=_styled(IconButton$1).withConfig({displayName:"ConfirmationStatisticsExport__DownloadButton",componentId:"sc-1gesr6p-0"})(templateObject_1$12||(templateObject_1$12=__makeTemplateObject(["\n  color: ",";\n"],["\n  color: ",";\n"])),function(p){return p.theme.textColors.default;});var Host$o=_styled(Tooltip).withConfig({displayName:"ConfirmationStatisticsExport__Host",componentId:"sc-1gesr6p-1"})(templateObject_2$B||(templateObject_2$B=__makeTemplateObject(["\n  && {\n    display: inline-flex;\n    align-items: center;\n  }\n"],["\n  && {\n    display: inline-flex;\n    align-items: center;\n  }\n"])));var templateObject_1$12,templateObject_2$B;var FeedbackButtonConfirmations=function FeedbackButtonConfirmations(){var features=useFeatures();var user=useCurrentUser();var _a=useContext(FeedbackButtonContext),item=_a.item,confirmationCount=_a.statistics.confirmationCount,hasFeedbackEnabled=_a.hasFeedbackEnabled;if(!features.confirmation||!hasFeedbackEnabled('confirm')||!hasMinRoleInSomeGroups(GroupRoles.Author,user,item)){return null;}return jsxs(Host$n,{children:[jsx$1(ConfirmationStatistics,{count:confirmationCount},void 0),jsx$1(ConfirmationStatisticsExport,{item:item},void 0)]},void 0);};var Host$n=_styled.span.withConfig({displayName:"FeedbackButtonConfirmations__Host",componentId:"sc-sgky21-0"})(templateObject_1$11||(templateObject_1$11=__makeTemplateObject(["\n  margin-left: 30px;\n\n  @media all and (max-width: ","px) {\n    margin-left: 0;\n    width: 100%;\n  }\n"],["\n  margin-left: 30px;\n\n  @media all and (max-width: ","px) {\n    margin-left: 0;\n    width: 100%;\n  }\n"])),maxScreenSize.medium);var templateObject_1$11;var EventDetailViewFeedbackSection=function EventDetailViewFeedbackSection(_a){var _b;var hideLikes=_a.hideLikes,hideComments=_a.hideComments,hideProfileUrl=_a.hideProfileUrl,disableLoginForPublicUser=_a.disableLoginForPublicUser;var _c=useDetailViewContext(),item=_c.item,resourceType=_c.resourceType,contentLanguage=_c.contentLanguage;// Info: We need this check so that in Teams on mobile we don't show the
 return jsxs(StyledFeedbackSection$2,__assign({item:item,language:contentLanguage,type:resourceType,feedbackSettings:(_b=item.metadata)===null||_b===void 0?void 0:_b.feedbackSettings,hideComments:hideComments,hideProfileUrl:hideProfileUrl,disableLoginForPublicUser:disableLoginForPublicUser},{children:[!hideLikes&&jsx$1(FeedbackButtonLike,{},void 0),!hideComments&&jsx$1(FeedbackButtonComments,{},void 0),jsx$1(FeedbackButtonViews,{},void 0),jsx$1(EventFeedbackButtonDownloadCalendarFile,{},void 0),jsx$1(FeedbackButtonShare,{},void 0),jsx$1(FeedbackButtonConfirmations,{},void 0)]}),void 0);};var StyledFeedbackSection$2=_styled(FeedbackSection).withConfig({displayName:"EventDetailViewFeedbackSection__StyledFeedbackSection",componentId:"sc-1m82rje-0"})(templateObject_1$10||(templateObject_1$10=__makeTemplateObject(["\n  ","\n"],["\n  ","\n"])),DetailViewSectionPadding);var templateObject_1$10;var EventDetailViewPlugins=function EventDetailViewPlugins(_a){var eventItem=_a.eventItem;return jsx$1(Host$m,{area:ExtensionArea.eventDetailViewSection,eventItem:eventItem},void 0);};var Host$m=_styled(Plugins)(templateObject_1$$||(templateObject_1$$=__makeTemplateObject(["\n  margin: auto -","px;\n  padding: 0 ","px;\n\n  @media (min-width: ","px) {\n    margin: auto -","px;\n    padding: 0 ","px;\n  }\n"],["\n  margin: auto -","px;\n  padding: 0 ","px;\n\n  @media (min-width: ","px) {\n    margin: auto -","px;\n    padding: 0 ","px;\n  }\n"])),spacingM,spacingM,minScreenSize.small,spacingXl,spacingXl);var templateObject_1$$;var DateMode;(function(DateMode){DateMode[DateMode["Published"]=0]="Published";DateMode[DateMode["Modified"]=1]="Modified";})(DateMode||(DateMode={}));var DateInfo$1=function DateInfo(_a){var item=_a.item,dateMode=_a.dateMode,expiryDate=_a.expiryDate,className=_a.className;var features=useFeatures();return jsxs("span",__assign({className:className},{children:[dateMode===DateMode.Modified&&getModifiedInfo(),dateMode===DateMode.Published&&getPublishInfo(),expiryDate&&features.expiryDate&&getArchiveInfo()]}),void 0);function getPublishInfo(){var format=isSameDay(item.publishingDate)?'relative':'absolute';if(!item.publishingDate){if(item.status!==WorkflowStatus.approved){return jsx$1(FormattedMessage$1,{id:"DateInfo.publishWhenApproved"},void 0);}return jsx$1(FormattedMessage$1,{id:"DateInfo.published"},void 0);}var values={start:jsx$1(DateTime,{value:item.publishingDate},void 0)};if(new Date(item.publishingDate)>=new Date()){return jsx$1(FormattedMessage$1,{id:item.status!==WorkflowStatus.approved?"DateInfo.publishOnIfApproved."+format:"DateInfo.publishOn."+format,values:values},void 0);}if(item.status===WorkflowStatus.approved){return jsx$1(FormattedMessage$1,{id:"DateInfo.publishedOn."+format,values:values},void 0);}if(!!item.publishedVersionId){return jsx$1(FormattedMessage$1,{id:"DateInfo.publishedWithPendingEdits."+format,values:values},void 0);}return jsx$1(FormattedMessage$1,{id:"DateInfo.missingApproval."+format,values:values},void 0);}function getArchiveInfo(){var format=isSameDay(expiryDate)?'relative':'absolute';var values={end:jsx$1(DateTime,{value:expiryDate},void 0)};if(new Date(expiryDate)<new Date()){// if already expired
 return jsxs("span",{children:[",\u00A0",jsx$1(FormattedMessage$1,{id:"DateInfo.archivedOn."+format,values:values},void 0)]},void 0);}else {// not yet expired
-return jsxs("span",{children:[",",' ',jsx$1(FormattedMessage$1,{id:"DateInfo.archiveOn."+format,values:values},void 0)]},void 0);}}function getModifiedInfo(){var date=item.modified||item.created||new Date();var format=isSameDay(date)?'relative':'absolute';return jsx$1("span",{children:jsx$1(FormattedMessage$1,{id:"DateInfo.modifiedOn."+format,values:{modified:jsx$1(ModifiedDateTime,{value:date},void 0)}},void 0)},void 0);}};var ModifiedDateTime=_styled(DateTime).withConfig({displayName:"DateInfo__ModifiedDateTime",componentId:"sc-xnzpy3-0"})(templateObject_1$_||(templateObject_1$_=__makeTemplateObject(["\n  &&& {\n    text-decoration: none;\n  }\n"],["\n  &&& {\n    text-decoration: none;\n  }\n"])));var templateObject_1$_;var getAuthor=function getAuthor(item){return item.onBehalfOf||item.owner||item.author||{};};var getRealAuthor=function getRealAuthor(item){return item.owner||item.author||{};};var ItemMetaInfo=function ItemMetaInfo(_a){var item=_a.item,className=_a.className,expiryDate=_a.expiryDate,showChannels=_a.showChannels,dateMode=_a.dateMode,channels=_a.channels,_b=_a.readOnly,readOnly=_b===void 0?true:_b,_c=_a.hideAvatar,hideAvatar=_c===void 0?false:_c,hideDisplayName=_a.hideDisplayName,language=_a.language,buildChannelFilterUrl=_a.buildChannelFilterUrl,_d=_a.clickableAvatar,clickableAvatar=_d===void 0?true:_d;var hasChannels=channels&&channels.length>0;var onBehalfAuthor=getAuthor(item);var realAuthor=getRealAuthor(item);return jsxs(Host$l,__assign({className:className,"data-item-metadata":true},{children:[!hideAvatar&&jsx$1(PersonaCard,__assign({upn:onBehalfAuthor.userPrincipalName,readOnly:!clickableAvatar,domIdentifier:"avatar"},{children:jsx$1(Avatar,{upn:onBehalfAuthor.userPrincipalName,text:onBehalfAuthor.displayName,secondaryText:onBehalfAuthor.userPrincipalName,hidePersonaDetails:true,coinSize:55},void 0)}),void 0),jsxs(InfoDetailsHost,__assign({"data-meta-info-details":true},{children:[!hideDisplayName&&jsx$1(AuthorContainer,{children:jsx$1(AuthorName$1,{author:onBehalfAuthor,readOnly:readOnly},void 0)},void 0),jsxs(DateAndChannels,{children:[jsx$1(DateInfo$1,{item:item,dateMode:dateMode,expiryDate:expiryDate},void 0),"\u00A0",showChannels&&jsx$1(Fragment,{children:hasChannels?jsx$1(FormattedMessage$1,{id:"NewsMetaInfo.channels",values:{channels:jsxs(Fragment,{children:["\u00A0",jsx$1(Channels$1,{channels:channels.map(function(c){return c.name;}),language:language,buildChannelFilterUrl:buildChannelFilterUrl},void 0)]},void 0)}},void 0):jsx$1(FormattedMessage$1,{id:"NewsMetaInfo.noChannels"},void 0)},void 0)]},void 0),!hideDisplayName&&realAuthor&&realAuthor.userPrincipalName!==onBehalfAuthor.userPrincipalName&&jsx$1(AuthorContainer,{children:jsx$1(FormattedMessage$1,{id:"MetaInfo.writtenBy",values:{author:jsx$1(AuthorName$1,{author:realAuthor,readOnly:readOnly},void 0)}},void 0)},void 0)]}),void 0)]}),void 0);};var Host$l=_styled.div.withConfig({displayName:"ItemMetaInfo__Host",componentId:"sc-1d6drj8-0"})(templateObject_1$Z||(templateObject_1$Z=__makeTemplateObject(["\n  display: flex;\n"],["\n  display: flex;\n"])));var InfoDetailsHost=_styled.div.withConfig({displayName:"ItemMetaInfo__InfoDetailsHost",componentId:"sc-1d6drj8-1"})(templateObject_2$A||(templateObject_2$A=__makeTemplateObject(["\n  padding-left: 8px;\n  display: flex;\n  flex-flow: column;\n  justify-content: center;\n  word-wrap: break-word;\n  text-align: left;\n"],["\n  padding-left: 8px;\n  display: flex;\n  flex-flow: column;\n  justify-content: center;\n  word-wrap: break-word;\n  text-align: left;\n"])));var AuthorContainer=_styled.div.withConfig({displayName:"ItemMetaInfo__AuthorContainer",componentId:"sc-1d6drj8-2"})(templateObject_3$q||(templateObject_3$q=__makeTemplateObject(["\n  font-style: normal;\n  display: inline-block;\n"],["\n  font-style: normal;\n  display: inline-block;\n"])));var DateAndChannels=_styled.div.withConfig({displayName:"ItemMetaInfo__DateAndChannels",componentId:"sc-1d6drj8-3"})(templateObject_4$g||(templateObject_4$g=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n"],["\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n"])));var AuthorName$1=function AuthorName(_a){var author=_a.author,readOnly=_a.readOnly;if(!readOnly){return jsx$1(Fragment,{children:author.displayName},void 0);}return jsx$1(PrimaryPersonaCard,__assign({upn:author.userPrincipalName},{children:author.displayName}),void 0);};var PrimaryPersonaCard=_styled(PersonaCard).withConfig({displayName:"ItemMetaInfo__PrimaryPersonaCard",componentId:"sc-1d6drj8-4"})(templateObject_5$f||(templateObject_5$f=__makeTemplateObject(["\n  color: ",";\n  text-decoration: underline;\n"],["\n  color: ",";\n  text-decoration: underline;\n"])),function(p){return p.theme.palette.accent;});var Channels$1=_styled(ClickableChannelTitles).withConfig({displayName:"ItemMetaInfo__Channels",componentId:"sc-1d6drj8-5"})(templateObject_6$9||(templateObject_6$9=__makeTemplateObject(["\n  display: contents;\n"],["\n  display: contents;\n"])));var templateObject_1$Z,templateObject_2$A,templateObject_3$q,templateObject_4$g,templateObject_5$f,templateObject_6$9;var PageDetailViewMetaInfo=function PageDetailViewMetaInfo(){var _a=useDetailViewContext(),item=_a.item,userPreferredLanguage=_a.userPreferredLanguage;return jsx$1(DetailMetaInfo$1,{item:item,dateMode:DateMode.Modified,language:userPreferredLanguage},void 0);};var DetailMetaInfo$1=_styled(ItemMetaInfo).withConfig({displayName:"PageDetailViewMetaInfo__DetailMetaInfo",componentId:"sc-1yz7bl7-0"})(templateObject_1$Y||(templateObject_1$Y=__makeTemplateObject(["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ","px) {\n    font-size: 14px;\n  }\n"],["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ","px) {\n    font-size: 14px;\n  }\n"])),minScreenSize.small);var templateObject_1$Y;var PageDetailViewFeedbackSection=function PageDetailViewFeedbackSection(_a){var hideLikes=_a.hideLikes,hideComments=_a.hideComments,hideProfileUrl=_a.hideProfileUrl,disableLoginForPublicUser=_a.disableLoginForPublicUser;var _b=useDetailViewContext(),item=_b.item,resourceType=_b.resourceType,contentLanguage=_b.contentLanguage;return jsxs(StyledFeedbackSection$1,__assign({item:item,language:contentLanguage,type:resourceType,feedbackSettings:item.feedbackSettings,hideComments:hideComments,hideProfileUrl:hideProfileUrl,disableLoginForPublicUser:disableLoginForPublicUser},{children:[!hideLikes&&jsx$1(FeedbackButtonLike,{},void 0),!hideComments&&jsx$1(FeedbackButtonComments,{},void 0),jsx$1(FeedbackButtonViews,{},void 0),jsx$1(FeedbackButtonShare,{},void 0)]}),void 0);};var StyledFeedbackSection$1=_styled(FeedbackSection).withConfig({displayName:"PageDetailViewFeedbackSection__StyledFeedbackSection",componentId:"sc-12s3v5d-0"})(templateObject_1$X||(templateObject_1$X=__makeTemplateObject(["\n  ",";\n  &[data-comment-section] {\n    padding-bottom: ","px;\n\n    @media (min-width: ","px) {\n      padding-bottom: 0;\n    }\n  }\n"],["\n  ",";\n  &[data-comment-section] {\n    padding-bottom: ","px;\n\n    @media (min-width: ","px) {\n      padding-bottom: 0;\n    }\n  }\n"])),DetailViewSectionPadding,spacingXl+10,minScreenSize.small);var templateObject_1$X;var PageTocSearch=function PageTocSearch(_a){var onSearch=_a.onSearch,onSearchResultChange=_a.onSearchResultChange;var formatMessage=useIntl().formatMessage;var onDebouncedSearch=useDebouncedCallback(handleSearch,300)[0];var textColors=useContext(ThemeContext$1).theme.textColors;return jsx$1(StyledSearchBox,{"data-toc-search-box":true,onChange:function(_,v){return onDebouncedSearch(v);},placeholder:formatMessage({id:'Pages.pagesTableOfContents.searchFieldPlaceholder'}),onKeyPress:handleKeyPress,iconProps:{style:{color:textColors.default}}},void 0);function handleKeyPress(event){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:if(!(event.key==='Enter'))return [3/*break*/,2];return [4/*yield*/,handleSearch(event.currentTarget.value,true)];case 1:_a.sent();_a.label=2;case 2:return [2/*return*/];}});});}function handleSearch(value,ignoreSearchTextLength){return __awaiter(this,void 0,void 0,function(){var result,allNodesById;return __generator(this,function(_a){switch(_a.label){case 0:if(!value||!ignoreSearchTextLength&&value.trim().length<3){onSearchResultChange(null);return [2/*return*/];}return [4/*yield*/,onSearch(value)];case 1:result=_a.sent();allNodesById={};// the search returns us a flat result of pages, we now have to build up
+return jsxs("span",{children:[",",' ',jsx$1(FormattedMessage$1,{id:"DateInfo.archiveOn."+format,values:values},void 0)]},void 0);}}function getModifiedInfo(){var date=item.modified||item.created||new Date();var format=isSameDay(date)?'relative':'absolute';return jsx$1("span",{children:jsx$1(FormattedMessage$1,{id:"DateInfo.modifiedOn."+format,values:{modified:jsx$1(ModifiedDateTime,{value:date},void 0)}},void 0)},void 0);}};var ModifiedDateTime=_styled(DateTime).withConfig({displayName:"DateInfo__ModifiedDateTime",componentId:"sc-xnzpy3-0"})(templateObject_1$_||(templateObject_1$_=__makeTemplateObject(["\n  &&& {\n    text-decoration: none;\n  }\n"],["\n  &&& {\n    text-decoration: none;\n  }\n"])));var templateObject_1$_;var getAuthor=function getAuthor(item){return item.onBehalfOf||item.owner||item.author||{};};var getRealAuthor=function getRealAuthor(item){return item.owner||item.author||{};};var ItemMetaInfo=function ItemMetaInfo(_a){var item=_a.item,className=_a.className,expiryDate=_a.expiryDate,showChannels=_a.showChannels,dateMode=_a.dateMode,channels=_a.channels,_b=_a.readOnly,readOnly=_b===void 0?true:_b,_c=_a.hideAvatar,hideAvatar=_c===void 0?false:_c,hideDisplayName=_a.hideDisplayName,language=_a.language,buildChannelFilterUrl=_a.buildChannelFilterUrl,_d=_a.clickableAvatar,clickableAvatar=_d===void 0?true:_d;var hasChannels=channels&&channels.length>0;var onBehalfAuthor=getAuthor(item);var realAuthor=getRealAuthor(item);return jsxs(Host$l,__assign({className:className,"data-item-metadata":true},{children:[!hideAvatar&&jsx$1(PersonaCard,__assign({upn:onBehalfAuthor.userPrincipalName,readOnly:!clickableAvatar,domIdentifier:"avatar"},{children:jsx$1(Avatar,{upn:onBehalfAuthor.userPrincipalName,text:onBehalfAuthor.displayName,secondaryText:onBehalfAuthor.userPrincipalName,hidePersonaDetails:true,coinSize:55},void 0)}),void 0),jsxs(InfoDetailsHost,__assign({"data-meta-info-details":true},{children:[!hideDisplayName&&jsx$1(AuthorContainer,{children:jsx$1(AuthorName$1,{author:onBehalfAuthor,readOnly:readOnly},void 0)},void 0),jsxs(DateAndChannels,{children:[jsx$1(DateInfo$1,{item:item,dateMode:dateMode,expiryDate:expiryDate},void 0),"\u00A0",showChannels&&jsx$1(Fragment,{children:hasChannels?jsx$1(FormattedMessage$1,{id:"NewsMetaInfo.channels",values:{channels:jsxs(Fragment,{children:["\u00A0",jsx$1(Channels$1,{channels:channels.map(function(c){return c.name;}),language:language,buildChannelFilterUrl:buildChannelFilterUrl},void 0)]},void 0)}},void 0):jsx$1(FormattedMessage$1,{id:"NewsMetaInfo.noChannels"},void 0)},void 0)]},void 0),!hideDisplayName&&realAuthor&&realAuthor.userPrincipalName!==onBehalfAuthor.userPrincipalName&&jsx$1(AuthorContainer,{children:jsx$1(FormattedMessage$1,{id:"MetaInfo.writtenBy",values:{author:jsx$1(AuthorName$1,{author:realAuthor,readOnly:readOnly},void 0)}},void 0)},void 0)]}),void 0)]}),void 0);};var Host$l=_styled.div.withConfig({displayName:"ItemMetaInfo__Host",componentId:"sc-1d6drj8-0"})(templateObject_1$Z||(templateObject_1$Z=__makeTemplateObject(["\n  display: flex;\n"],["\n  display: flex;\n"])));var InfoDetailsHost=_styled.div.withConfig({displayName:"ItemMetaInfo__InfoDetailsHost",componentId:"sc-1d6drj8-1"})(templateObject_2$A||(templateObject_2$A=__makeTemplateObject(["\n  padding-left: 8px;\n  display: flex;\n  flex-flow: column;\n  justify-content: center;\n  word-wrap: break-word;\n  text-align: left;\n"],["\n  padding-left: 8px;\n  display: flex;\n  flex-flow: column;\n  justify-content: center;\n  word-wrap: break-word;\n  text-align: left;\n"])));var AuthorContainer=_styled.div.withConfig({displayName:"ItemMetaInfo__AuthorContainer",componentId:"sc-1d6drj8-2"})(templateObject_3$q||(templateObject_3$q=__makeTemplateObject(["\n  font-style: normal;\n  display: inline-block;\n"],["\n  font-style: normal;\n  display: inline-block;\n"])));var DateAndChannels=_styled.div.withConfig({displayName:"ItemMetaInfo__DateAndChannels",componentId:"sc-1d6drj8-3"})(templateObject_4$g||(templateObject_4$g=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n"],["\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n"])));var AuthorName$1=function AuthorName(_a){var author=_a.author,readOnly=_a.readOnly;if(!readOnly){return jsx$1(Fragment,{children:author.displayName},void 0);}return jsx$1(PrimaryPersonaCard,__assign({upn:author.userPrincipalName},{children:author.displayName}),void 0);};var PrimaryPersonaCard=_styled(PersonaCard).withConfig({displayName:"ItemMetaInfo__PrimaryPersonaCard",componentId:"sc-1d6drj8-4"})(templateObject_5$f||(templateObject_5$f=__makeTemplateObject(["\n  color: ",";\n  text-decoration: underline;\n"],["\n  color: ",";\n  text-decoration: underline;\n"])),function(p){return p.theme.palette.accent;});var Channels$1=_styled(ClickableChannelTitles).withConfig({displayName:"ItemMetaInfo__Channels",componentId:"sc-1d6drj8-5"})(templateObject_6$9||(templateObject_6$9=__makeTemplateObject(["\n  display: contents;\n"],["\n  display: contents;\n"])));var templateObject_1$Z,templateObject_2$A,templateObject_3$q,templateObject_4$g,templateObject_5$f,templateObject_6$9;var PageDetailViewMetaInfo=function PageDetailViewMetaInfo(){var _a=useDetailViewContext(),item=_a.item,userPreferredLanguage=_a.userPreferredLanguage;return jsx$1(DetailMetaInfo$1,{item:item,dateMode:DateMode.Modified,language:userPreferredLanguage},void 0);};var DetailMetaInfo$1=_styled(ItemMetaInfo).withConfig({displayName:"PageDetailViewMetaInfo__DetailMetaInfo",componentId:"sc-1yz7bl7-0"})(templateObject_1$Y||(templateObject_1$Y=__makeTemplateObject(["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ","px) {\n    font-size: 14px;\n  }\n"],["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ","px) {\n    font-size: 14px;\n  }\n"])),minScreenSize.small);var templateObject_1$Y;var PageDetailViewFeedbackSection=function PageDetailViewFeedbackSection(_a){var hideLikes=_a.hideLikes,hideComments=_a.hideComments,hideProfileUrl=_a.hideProfileUrl,disableLoginForPublicUser=_a.disableLoginForPublicUser;var _b=useDetailViewContext(),item=_b.item,resourceType=_b.resourceType,contentLanguage=_b.contentLanguage;return jsxs(StyledFeedbackSection$1,__assign({item:item,language:contentLanguage,type:resourceType,feedbackSettings:item.feedbackSettings,hideComments:hideComments,hideProfileUrl:hideProfileUrl,disableLoginForPublicUser:disableLoginForPublicUser},{children:[!hideLikes&&jsx$1(FeedbackButtonLike,{},void 0),!hideComments&&jsx$1(FeedbackButtonComments,{},void 0),jsx$1(FeedbackButtonViews,{},void 0),jsx$1(FeedbackButtonShare,{},void 0)]}),void 0);};var StyledFeedbackSection$1=_styled(FeedbackSection).withConfig({displayName:"PageDetailViewFeedbackSection__StyledFeedbackSection",componentId:"sc-12s3v5d-0"})(templateObject_1$X||(templateObject_1$X=__makeTemplateObject(["\n  ",";\n  &[data-comment-section] {\n    padding-bottom: ","px;\n\n    @media (min-width: ","px) {\n      padding-bottom: 0;\n    }\n  }\n"],["\n  ",";\n  &[data-comment-section] {\n    padding-bottom: ","px;\n\n    @media (min-width: ","px) {\n      padding-bottom: 0;\n    }\n  }\n"])),DetailViewSectionPadding,spacingXl+10,minScreenSize.small);var templateObject_1$X;var PageTocSearch=function PageTocSearch(_a){var onSearch=_a.onSearch,onSearchResultChange=_a.onSearchResultChange;var formatMessage=useIntl().formatMessage;var onDebouncedSearch=useDebouncedCallback$3(handleSearch,300)[0];var textColors=useContext(ThemeContext$1).theme.textColors;return jsx$1(StyledSearchBox,{"data-toc-search-box":true,onChange:function(_,v){return onDebouncedSearch(v);},placeholder:formatMessage({id:'Pages.pagesTableOfContents.searchFieldPlaceholder'}),onKeyPress:handleKeyPress,iconProps:{style:{color:textColors.default}}},void 0);function handleKeyPress(event){return __awaiter(this,void 0,void 0,function(){return __generator(this,function(_a){switch(_a.label){case 0:if(!(event.key==='Enter'))return [3/*break*/,2];return [4/*yield*/,handleSearch(event.currentTarget.value,true)];case 1:_a.sent();_a.label=2;case 2:return [2/*return*/];}});});}function handleSearch(value,ignoreSearchTextLength){return __awaiter(this,void 0,void 0,function(){var result,allNodesById;return __generator(this,function(_a){switch(_a.label){case 0:if(!value||!ignoreSearchTextLength&&value.trim().length<3){onSearchResultChange(null);return [2/*return*/];}return [4/*yield*/,onSearch(value)];case 1:result=_a.sent();allNodesById={};// the search returns us a flat result of pages, we now have to build up
 // an hierarchical tree, with the roots node at the very top
 // so we can then pass this in to the actual ToC
 result.items.forEach(function(page){var _a;var node=convertToNavigationNode(page);node.isSearchMatch=true;while(true){// if we already have the current node collected
@@ -131869,7 +131881,7 @@ var existingNode=allNodesById[node.id];if(existingNode){if(existingNode.id===pag
 var InlinePageListByCurrentPage=function InlinePageListByCurrentPage(_a){var _b=_a.blockProps,props=_b===void 0?{showDocuments:true,showPages:true}:_b;var item=useDetailViewContext().item;var getSubpages=usePagesApi().getSubpages;var buildPath=useSubscriptionHandlePathBuilder().buildPath;var _c=useItemLoaderByCurrentPage(item.id,defaultPageSize,item.navigationContext,{showPages:props.showPages,showDocuments:props.showDocuments},getAllSubItems,[item===null||item===void 0?void 0:item.id]),items=_c.pageItems,pagingProps=_c.pagingProps;if(items.length===0){return null;}return jsx$1(InlinePageListWithPaging,{pages:items,pagingProps:pagingProps,baseRoute:buildPath('pages'),filterBaseUrl:buildPath('/pages/search')},void 0);function getAllSubItems(id,pageType){return __awaiter(this,void 0,void 0,function(){var result;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,getSubpages(id,{pageType:pageType})];case 1:result=_a.sent();return [2/*return*/,result.items];}});});}};var InlinePageList=function InlinePageList(_a){var blockProps=_a.blockProps;if(blockProps===null||blockProps===void 0?void 0:blockProps.keywords){return jsx$1(InlinePageListByKeywords,{keywords:blockProps.keywords.split(','),showPages:blockProps.showPages,showDocuments:blockProps.showDocuments},void 0);}if(blockProps===null||blockProps===void 0?void 0:blockProps.pageId){return jsx$1(InlinePageListByPageId,{pageId:blockProps.pageId,showPages:blockProps.showPages,showDocuments:blockProps.showDocuments},void 0);}return jsx$1(InlinePageListByCurrentPage,{blockProps:blockProps},void 0);};var InlinePageListMapper={component:InlinePageList,type:EntityType.InlinePageList,getPropsFromHtml:function(nodeName,node){if(nodeName!=='div'){return null;}var pageListId=node.getAttribute('data-page-list-id');if(pageListId==null){return null;}var showChildren=node.getAttribute('data-show-children')==='true';var showDocumentsAttribute=node.getAttribute('data-show-documents');var showPagesAttribute=node.getAttribute('data-show-pages');var pageId=node.getAttribute('data-page-id');var keywords=node.getAttribute('data-keywords');if(!showDocumentsAttribute&&!showPagesAttribute){// ensure backwards compatibility
 return {id:pageListId,showChildren:showChildren,showPages:true,showDocuments:false,pageId:pageId,keywords:keywords};}var showDocuments=showDocumentsAttribute==='true';var showPages=showPagesAttribute==='true';return {id:pageListId,showChildren:showChildren,showDocuments:showDocuments,showPages:showPages,pageId:pageId,keywords:keywords};}};var PageBreadcrumb=function PageBreadcrumb(_a){var page=_a.page,target=_a.target,languageOverride=_a.language,hideCurrentPageNode=_a.hideCurrentPageNode,className=_a.className;var user=useCurrentUser();var formatMessage=useIntl().formatMessage;var history=useHistory();if(!page||!page.navigationContext){return null;}var _b=getBreadcrumbsItems(page,target,handleOnClick,function(page){return getTitle(page,user,formatMessage,languageOverride);},formatMessage,hideCurrentPageNode),parentNode=_b.parentNode,breadcrumbItems=_b.breadcrumbItems;return jsxs("div",__assign({className:className},{children:[jsx$1(LargeScreenBreadcrumb,{items:breadcrumbItems,onRenderItem:renderBreadcrumbItem,overflowIndex:1,"data-breadcrumb":true,overflowAriaLabel:formatMessage({id:'AriaLabel.otherPages'}),focusZoneProps:{handleTabKey:1}},void 0),jsx$1(MobileBreadcrumb,{target:target,parentNode:parentNode},void 0)]}),void 0);function renderBreadcrumbItem(item){if(item.key==='home'){return jsx$1(BreadcrumbHomeItem,__assign({to:item.href,"aria-label":item.text,"data-pages-home-icon":true},{children:jsx$1(HomeIcon,{iconName:"HomeSolid"},void 0)}),void 0);}if(item.isCurrentItem){return jsx$1(BreadcrumbCurrentItem,__assign({"aria-current":"page"},{children:item.text}),void 0);}return jsx$1(BreadcrumbItem,__assign({to:item.href,"data-page-breadcrumb-node":item.key},{children:item.text}),void 0);}function handleOnClick(e,item){e.stopPropagation();e.preventDefault();history.push({pathname:item.href});}};var MobileBreadcrumb=function MobileBreadcrumb(_a){var target=_a.target,parentNode=_a.parentNode;var formatMessage=useIntl().formatMessage;return jsxs(MobileBreadcrumbHost,__assign({"data-mobile-breadcrumb":true},{children:[jsx$1("li",{children:jsx$1(BreadcrumbHomeItem,__assign({to:target,"aria-label":formatMessage({id:'Generic.home'}),"data-pages-home-icon":true},{children:jsx$1(HomeIcon,{iconName:"HomeSolid"},void 0)}),void 0)},void 0),parentNode&&jsxs(ParentNode,{children:[jsx$1(LeftChevronIcon,{iconName:"ChevronLeft"},void 0),jsx$1(BreadcrumbItem,__assign({to:NewsService.getNewsRoute(target,parentNode.id,parentNode.title),"data-page-breadcrumb-parent-node":parentNode.id},{children:parentNode.title}),void 0)]},void 0)]}),void 0);};var MobileBreadcrumbHost=_styled.ul.withConfig({displayName:"PageBreadcrumb__MobileBreadcrumbHost",componentId:"sc-1m4qq1d-0"})(templateObject_1$R||(templateObject_1$R=__makeTemplateObject(["\n  display: none;\n  align-items: center;\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  font-size: ","px;\n\n  @media (max-width: ","px) {\n    display: flex;\n  }\n"],["\n  display: none;\n  align-items: center;\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  font-size: ","px;\n\n  @media (max-width: ","px) {\n    display: flex;\n  }\n"])),fontSizeSmall,maxScreenSize.medium);var ParentNode=_styled.li.withConfig({displayName:"PageBreadcrumb__ParentNode",componentId:"sc-1m4qq1d-1"})(templateObject_2$w||(templateObject_2$w=__makeTemplateObject(["\n  margin: 0 ","px;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  color: ",";\n"],["\n  margin: 0 ","px;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  color: ",";\n"])),spacingM,function(p){return p.theme.palette.accent;});var LeftChevronIcon=_styled(Icon).withConfig({displayName:"PageBreadcrumb__LeftChevronIcon",componentId:"sc-1m4qq1d-2"})(templateObject_3$n||(templateObject_3$n=__makeTemplateObject(["\n  font-size: 10px;\n  font-weight: bold;\n  color: ",";\n"],["\n  font-size: 10px;\n  font-weight: bold;\n  color: ",";\n"])),function(p){return p.theme.palette.accent;});var LargeScreenBreadcrumb=_styled(Breadcrumb).withConfig({displayName:"PageBreadcrumb__LargeScreenBreadcrumb",componentId:"sc-1m4qq1d-3"})(templateObject_4$d||(templateObject_4$d=__makeTemplateObject(["\n  && {\n    margin: 0;\n  }\n\n  .ms-Breadcrumb-chevron {\n    font-weight: bold;\n  }\n\n  @media (max-width: ","px) {\n    display: none;\n  }\n"],["\n  && {\n    margin: 0;\n  }\n\n  .ms-Breadcrumb-chevron {\n    font-weight: bold;\n  }\n\n  @media (max-width: ","px) {\n    display: none;\n  }\n"])),maxScreenSize.medium);var HomeIcon=_styled(Icon).withConfig({displayName:"PageBreadcrumb__HomeIcon",componentId:"sc-1m4qq1d-4"})(templateObject_5$c||(templateObject_5$c=__makeTemplateObject(["\n  padding-top: 1px;\n"],["\n  padding-top: 1px;\n"])));var BreadcrumbItem=_styled(NavLink).withConfig({displayName:"PageBreadcrumb__BreadcrumbItem",componentId:"sc-1m4qq1d-5"})(templateObject_6$6$1||(templateObject_6$6$1=__makeTemplateObject(["\n  padding: 0 ","px;\n  color: ",";\n"],["\n  padding: 0 ","px;\n  color: ",";\n"])),spacingS,function(p){return p.theme.palette.accent;});var BreadcrumbHomeItem=_styled(NavLink).withConfig({displayName:"PageBreadcrumb__BreadcrumbHomeItem",componentId:"sc-1m4qq1d-6"})(templateObject_7$4$1||(templateObject_7$4$1=__makeTemplateObject(["\n  color: ",";\n\n  + i {\n    padding-left: ","px;\n  }\n"],["\n  color: ",";\n\n  + i {\n    padding-left: ","px;\n  }\n"])),function(p){return p.theme.palette.accent;},spacingS);var BreadcrumbCurrentItem=_styled.div.withConfig({displayName:"PageBreadcrumb__BreadcrumbCurrentItem",componentId:"sc-1m4qq1d-7"})(templateObject_8$4$1||(templateObject_8$4$1=__makeTemplateObject(["\n  padding-left: ","px;\n  color: ",";\n"],["\n  padding-left: ","px;\n  color: ",";\n"])),spacingS,function(p){return p.theme.palette.neutralSecondaryAlt;});var templateObject_1$R,templateObject_2$w,templateObject_3$n,templateObject_4$d,templateObject_5$c,templateObject_6$6$1,templateObject_7$4$1,templateObject_8$4$1;var DetailViewPageDocumentDownload=function DetailViewPageDocumentDownload(){var user=useCurrentUser();var _a=useDetailViewContext(),item=_a.item,preferredContent=_a.content;if(!item){return null;}var content=(preferredContent===null||preferredContent===void 0?void 0:preferredContent.fileInfo)?preferredContent:getContentForPage(item,user).content;if(!(content===null||content===void 0?void 0:content.fileInfo)){return null;}return jsx$1(PageDocumentDownloadButton,{item:item,content:content},void 0);};var PageDocumentDownloadButton=function PageDocumentDownloadButton(_a){var item=_a.item,content=_a.content,basePath=_a.basePath;var _b=useInlinePageDocument({pageId:item.id,fileId:content.fileInfo.fileId,extension:content.fileInfo.extension,title:content.title,fileName:content.fileInfo.fileName},item,basePath),fileUrl=_b.fileUrl,iconName=_b.iconName,title=_b.title,fileName=_b.fileName,onPageDocumentDownloadClick=_b.onPageDocumentDownloadClick;return jsxs(Host$k,{children:[jsx$1(FormattedMessage$1,{id:"Pages.documents.buttonDownloadInfo"},void 0),jsx$1(DownloadButton,{fileUrl:fileUrl,fileName:fileName,title:title,fileIconName:iconName,onClick:onPageDocumentDownloadClick},void 0)]},void 0);};var Host$k=_styled.div.withConfig({displayName:"DetailViewPageDocumentDownload__Host",componentId:"sc-1gtkslm-0"})(templateObject_1$Q||(templateObject_1$Q=__makeTemplateObject(["\n  margin-top: ","px;\n"],["\n  margin-top: ","px;\n"])),spacingM);var DownloadButton=_styled(InlinePageDocumentDownloadButton).withConfig({displayName:"DetailViewPageDocumentDownload__DownloadButton",componentId:"sc-1gtkslm-1"})(templateObject_2$v||(templateObject_2$v=__makeTemplateObject(["\n  margin-top: ","px;\n  @media (min-width: ","px) {\n    width: 50%;\n  }\n"],["\n  margin-top: ","px;\n  @media (min-width: ","px) {\n    width: 50%;\n  }\n"])),spacingS,minScreenSize.medium);var templateObject_1$Q,templateObject_2$v;_styled(PublishableItemBanner).withConfig({displayName:"CardBanner__StyledBanner",componentId:"sc-mqzdnh-0"})(templateObject_1$P||(templateObject_1$P=__makeTemplateObject(["\n  &.video-view-container {\n    height: 100%; /* this is needed for not overlapping the card title */\n  }\n"],["\n  &.video-view-container {\n    height: 100%; /* this is needed for not overlapping the card title */\n  }\n"])));var templateObject_1$P;_styled.div.withConfig({displayName:"Card__Host",componentId:"sc-1m8ygh-0"})(templateObject_1$O||(templateObject_1$O=__makeTemplateObject(["\n  &.card {\n    display: flex;\n    background-color: white;\n    box-shadow: 1px 1px 4px grey;\n    box-sizing: border-box;\n\n    width: 100%;\n\n    margin-bottom: 10px;\n\n    &[data-packed] {\n      opacity: 1;\n    }\n\n    &.card-enter,\n    &.card-appear {\n      opacity: 0.01;\n    }\n\n    &.card-enter.card-enter-active,\n    &.card-appear.card-appear-active {\n      opacity: 1;\n      transition: opacity 0.75s ease-in;\n    }\n\n    @media all and (min-width: ","px) {\n      transition: opacity 0.75s ease-in;\n      opacity: 0;\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n  }\n"],["\n  &.card {\n    display: flex;\n    background-color: white;\n    box-shadow: 1px 1px 4px grey;\n    box-sizing: border-box;\n\n    width: 100%;\n\n    margin-bottom: 10px;\n\n    &[data-packed] {\n      opacity: 1;\n    }\n\n    &.card-enter,\n    &.card-appear {\n      opacity: 0.01;\n    }\n\n    &.card-enter.card-enter-active,\n    &.card-appear.card-appear-active {\n      opacity: 1;\n      transition: opacity 0.75s ease-in;\n    }\n\n    @media all and (min-width: ","px) {\n      transition: opacity 0.75s ease-in;\n      opacity: 0;\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n\n    @media all and (min-width: ","px) {\n      width: ","px;\n    }\n  }\n"])),minScreenSize.small,cardWidthS,minScreenSize.medium,cardWidthM,minScreenSize.large,cardWidthL,minScreenSize.xLarge,cardWidthXL);_styled.article.withConfig({displayName:"Card__Article",componentId:"sc-1m8ygh-1"})(templateObject_3$m||(templateObject_3$m=__makeTemplateObject(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  ","\n\n  > .card-banner {\n    height: calc(((100vw - ","px) * (1 / ",")));\n    flex: 0 1 auto;\n  }\n\n  .card-title {\n    margin-top: 7px;\n    margin-bottom: 0;\n    font-size: 1.1em;\n  }\n\n  .card-metaInfo {\n    font-size: 0.9em;\n  }\n\n  .card-metaInfo {\n    padding-top: ","px;\n    color: #666;\n  }\n\n  @media all and (min-width: ","px) {\n    > .card-banner {\n      height: calc(","px * (1 / ","));\n    }\n\n    .card-title {\n      margin-top: 7px;\n      font-size: 1.3em;\n    }\n\n    .card-metaInfo {\n      font-size: 0.9em;\n    }\n  }\n\n  @media all and (min-width: ","px) {\n    > .card-banner {\n      height: calc(","px * (1 / ","));\n    }\n\n    @media all and (min-width: ","px) {\n      > .card-banner {\n        height: calc(","px * (1 / ","));\n      }\n    }\n\n    @media all and (min-width: ","px) {\n      > .card-banner {\n        height: calc(","px * (1 / ","));\n      }\n    }\n  }\n"],["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  ","\n\n  > .card-banner {\n    height: calc(((100vw - ","px) * (1 / ",")));\n    flex: 0 1 auto;\n  }\n\n  .card-title {\n    margin-top: 7px;\n    margin-bottom: 0;\n    font-size: 1.1em;\n  }\n\n  .card-metaInfo {\n    font-size: 0.9em;\n  }\n\n  .card-metaInfo {\n    padding-top: ","px;\n    color: #666;\n  }\n\n  @media all and (min-width: ","px) {\n    > .card-banner {\n      height: calc(","px * (1 / ","));\n    }\n\n    .card-title {\n      margin-top: 7px;\n      font-size: 1.3em;\n    }\n\n    .card-metaInfo {\n      font-size: 0.9em;\n    }\n  }\n\n  @media all and (min-width: ","px) {\n    > .card-banner {\n      height: calc(","px * (1 / ","));\n    }\n\n    @media all and (min-width: ","px) {\n      > .card-banner {\n        height: calc(","px * (1 / ","));\n      }\n    }\n\n    @media all and (min-width: ","px) {\n      > .card-banner {\n        height: calc(","px * (1 / ","));\n      }\n    }\n  }\n"])),function(p){return p.highlight&&css$2(templateObject_2$u||(templateObject_2$u=__makeTemplateObject(["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: ","px;\n        display: block;\n        background-color: ",";\n      }\n    "],["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: ","px;\n        display: block;\n        background-color: ",";\n      }\n    "])),spacingXs,function(p){return p.theme.palette.accent;});},spacingM,bannerAspectRatio,spacingM,minScreenSize.small,cardWidthS,bannerAspectRatio,minScreenSize.medium,cardWidthM,bannerAspectRatio,minScreenSize.large,cardWidthL,bannerAspectRatio,minScreenSize.xLarge,cardWidthXL,bannerAspectRatio);var templateObject_1$O,templateObject_2$u,templateObject_3$m;var LanguageSelector=function LanguageSelector(props){var history=useHistory();var currentUser=useCurrentUser();var buildPath=useSubscriptionHandlePathBuilder().buildPath;var getAllLanguagesLocalized=useLanguageApi().getAllLanguagesLocalized;var intl=useIntl();var formatMessage=intl.formatMessage;var languageDefinitions=usePromise$2(function(){return getAllLanguagesLocalized(intl);})[0];var features=useFeatures();if(languageDefinitions==null){return null;}if(props.chromeless)return jsx$1(ActionButton,__assign({iconProps:{iconName:'World'},menuProps:{items:getContextualMenuItems(),className:'lt-reach-callout'},className:classNames(props.className,'header-button')},{children:formatMessage({id:"Generic.languages."+props.selectedLanguage})}),void 0);return jsx$1(Tooltip,__assign({resourceKey:"Generic.translate"},{children:jsx$1(LanguageSelectorButton,{menuIconProps:{iconName:'World'},menuProps:{items:getContextualMenuItems(),className:'lt-reach-callout',isBeakVisible:props.showBeak},className:classNames(props.className,'header-button'),"data-language-selector-button":true,ariaLabel:formatMessage({id:'AriaLabel.autoTranslation'})},void 0)}),void 0);function getContextualMenuItems(){if(props.languages==null){return [];}var menuItems=[];var preferredLanguageItem=getPreferredLanguageItem();if(preferredLanguageItem){menuItems.push(preferredLanguageItem);}var activeLanguagesItems=getActiveLanguagesItems();activeLanguagesItems.sort(function(a,b){return a.text.localeCompare(b.text);});menuItems=menuItems.concat(activeLanguagesItems);if(!props.hideEditLanguagePreferences){var editLanguagePreferencesItem={key:'edit',text:formatMessage({id:'Generic.editLanguagePreferences'}),iconProps:{iconName:'PlayerSettings'},onClick:handleEditLanguagePreferences,className:'lt-reach-languageselector-menu-item'};menuItems.push(editLanguagePreferencesItem);}return menuItems;}function handleEditLanguagePreferences(){if(props.onEditLanguagePreferencesClick){props.onEditLanguagePreferencesClick();}else {history.push(buildPath('/user'));}}function getActiveLanguagesItems(){return props.languages.map(function(l){var fullLanguage=languageDefinitions.find(function(ld){return ld.code===l;});return {key:l,text:fullLanguage.localizedName,iconProps:{iconName:'World'},onClick:function(){return props.onLanguageChange(l.toString());},className:classNames('lt-reach-languageselector-menu-item',l===props.selectedLanguage&&'selected')};});}function getPreferredLanguageItem(){if(!features.automaticTranslation){return null;}if(!props.onTranslateClick){return null;}var preferredContentLanguage=getPreferredContentLanguage(currentUser);var shouldAddPreferredContentLanguage=preferredContentLanguage!=null&&!contentLanguagesWithoutAutomaticTranslation.includes(preferredContentLanguage)&&allAvailableContentLanguages.includes(preferredContentLanguage)&&props.languages.indexOf(preferredContentLanguage)<0;if(!shouldAddPreferredContentLanguage){return null;}return {key:preferredContentLanguage,text:formatMessage({id:'Generic.automaticTranslation'},{language:formatMessage({id:"Generic.languages."+preferredContentLanguage})}),iconProps:{iconName:'Robot'},onClick:function(){return props.onTranslateClick(preferredContentLanguage);},className:classNames('lt-reach-languageselector-menu-item',preferredContentLanguage===props.selectedLanguage&&'selected')};}};var LanguageSelectorButton=_styled(IconButton).withConfig({displayName:"LanguageSelector__LanguageSelectorButton",componentId:"sc-48zwek-0"})(templateObject_1$N||(templateObject_1$N=__makeTemplateObject(["\n  && {\n    height: 100%;\n    margin: 0;\n    background-color: transparent;\n  }\n"],["\n  && {\n    height: 100%;\n    margin: 0;\n    background-color: transparent;\n  }\n"])));var templateObject_1$N;_styled.article.withConfig({displayName:"DetailViewArticle__Host",componentId:"sc-we2q7z-0"})(templateObject_1$M||(templateObject_1$M=__makeTemplateObject(["\n  min-width: 300px;\n  width: 100%;\n\n  flex: 1 0 auto;\n  display: flex;\n  flex-flow: column nowrap;\n\n  @media (min-width: ","px) {\n    box-shadow: 1px 1px 4px grey;\n    max-width: ","px;\n  }\n"],["\n  min-width: 300px;\n  width: 100%;\n\n  flex: 1 0 auto;\n  display: flex;\n  flex-flow: column nowrap;\n\n  @media (min-width: ","px) {\n    box-shadow: 1px 1px 4px grey;\n    max-width: ","px;\n  }\n"])),minScreenSize.large+1,maxContentWidth);var templateObject_1$M;var DetailViewBanner=function DetailViewBanner(){var _a=useDetailViewContext(),item=_a.item,resourceType=_a.resourceType,isEditorPreview=_a.isEditorPreview;if(!item.bannerInfo){return null;}return jsx$1(Banner$3,{itemId:item.id,token:item.fileAccessToken,bannerInfo:item.bannerInfo,useEditorRoutes:isEditorPreview,width:getMaxImageWidth(),canOpenImage:true,resourceType:resourceType},void 0);};var Banner$3=_styled(PublishableItemBanner).withConfig({displayName:"DetailViewBanner__Banner",componentId:"sc-1wuqvtw-0"})(templateObject_1$L||(templateObject_1$L=__makeTemplateObject(["\n  && {\n    height: calc(100vw * (1 / ","));\n\n    @media (min-width: ","px) {\n      height: calc(\n        (","px - (2 * ","px)) *\n          (1 / ",")\n      );\n    }\n  }\n"],["\n  && {\n    height: calc(100vw * (1 / ","));\n\n    @media (min-width: ","px) {\n      height: calc(\n        (","px - (2 * ","px)) *\n          (1 / ",")\n      );\n    }\n  }\n"])),bannerAspectRatio,minScreenSize.large+1,minScreenSize.large,spacingM,bannerAspectRatio);var templateObject_1$L;var DetailViewIntro=function DetailViewIntro(){var content=useDetailViewContext().content;var hasIntro=content.intro&&content.intro.length>0;if(!hasIntro){return null;}return jsx$1(DetailIntro,{children:content.intro},void 0);};var DetailIntro=_styled.p.withConfig({displayName:"DetailViewIntro__DetailIntro",componentId:"sc-1kubhyf-0"})(templateObject_1$K||(templateObject_1$K=__makeTemplateObject(["\n  margin: 0;\n  font-size: ","px;\n  line-height: 26px;\n  font-weight: normal;\n\n  min-width: 100%;\n  width: 100px;\n\n  @media (min-width: ","px) {\n    margin-top: ","px;\n    margin-bottom: ","px;\n    line-height: 24px;\n    font-size: ","px;\n  }\n"],["\n  margin: 0;\n  font-size: ","px;\n  line-height: 26px;\n  font-weight: normal;\n\n  min-width: 100%;\n  width: 100px;\n\n  @media (min-width: ","px) {\n    margin-top: ","px;\n    margin-bottom: ","px;\n    line-height: 24px;\n    font-size: ","px;\n  }\n"])),fontSizeNormal,minScreenSize.small,spacingS,spacingS+2,fontSizeMedium+2);var templateObject_1$K;var DetailMainSection=function DetailMainSection(_a){var children=_a.children;return jsx$1(DetailMainStyledSection,__assign({className:"detail-view-main"},{children:children}),void 0);};var DetailMainStyledSection=_styled.section.withConfig({displayName:"DetailViewMainSection__DetailMainStyledSection",componentId:"sc-ifywhg-0"})(templateObject_1$J||(templateObject_1$J=__makeTemplateObject(["\n  position: relative;\n  flex: 1 0 auto;\n  display: flex;\n  flex-direction: column;\n  padding: ","px ","px\n    ","px;\n  font-size: 16px;\n\n  @media (min-width: ","px) {\n    padding: ","px\n      ","px ","px;\n  }\n"],["\n  position: relative;\n  flex: 1 0 auto;\n  display: flex;\n  flex-direction: column;\n  padding: ","px ","px\n    ","px;\n  font-size: 16px;\n\n  @media (min-width: ","px) {\n    padding: ","px\n      ","px ","px;\n  }\n"])),detailViewSectionPadding-5,detailViewSectionPadding,detailViewSectionPadding,minScreenSize.small,detailViewSectionPaddingLarge-10,detailViewSectionPaddingLarge,detailViewSectionPaddingLarge);var templateObject_1$J;var GutterMarkerIcon=function GutterMarkerIcon(_a){var iconName=_a.iconName,children=_a.children,isActive=_a.isActive,color=_a.color,tooltipResourceKey=_a.tooltipResourceKey,className=_a.className;return jsxs(Host$h$1,__assign({className:className},{children:[jsx$1(IconContainer$1,__assign({isActive:isActive,className:isActive?"ms-bgColor-"+color:'ms-bgColor-white'},{children:isActive&&jsx$1(StyledTooltip,__assign({resourceKey:tooltipResourceKey},{children:jsx$1(StyledIcon$2$1,{className:"ms-fontColor-white",iconName:iconName},void 0)}),void 0)}),void 0),isActive?jsx$1(ActiveContent,__assign({className:"ms-borderColor-"+color},{children:children}),void 0):jsx$1(Content$3,{children:children},void 0)]}),void 0);};var Host$h$1=_styled.div.withConfig({displayName:"GutterMakerIcon__Host",componentId:"sc-aa2cf4-0"})(templateObject_1$I||(templateObject_1$I=__makeTemplateObject(["\n  margin: 0;\n  display: flex;\n  align-content: center;\n"],["\n  margin: 0;\n  display: flex;\n  align-content: center;\n"])));var StyledIcon$2$1=_styled(Icon).withConfig({displayName:"GutterMakerIcon__StyledIcon",componentId:"sc-aa2cf4-1"})(templateObject_2$t||(templateObject_2$t=__makeTemplateObject(["\n  font-size: 25px;\n"],["\n  font-size: 25px;\n"])));var Content$3=_styled.div.withConfig({displayName:"GutterMakerIcon__Content",componentId:"sc-aa2cf4-2"})(templateObject_3$l||(templateObject_3$l=__makeTemplateObject(["\n  flex: 1 1 auto;\n  flex-basis: 100%; /*IE fix*/\n\n  display: flex;\n  align-items: center;\n\n  box-sizing: border-box;\n"],["\n  flex: 1 1 auto;\n  flex-basis: 100%; /*IE fix*/\n\n  display: flex;\n  align-items: center;\n\n  box-sizing: border-box;\n"])));var ActiveContent=_styled(Content$3).withConfig({displayName:"GutterMakerIcon__ActiveContent",componentId:"sc-aa2cf4-3"})(templateObject_4$c$1||(templateObject_4$c$1=__makeTemplateObject(["\n  padding-left: 10px;\n  min-height: 50px;\n\n  border-bottom-style: solid;\n  border-bottom-width: 4px;\n"],["\n  padding-left: 10px;\n  min-height: 50px;\n\n  border-bottom-style: solid;\n  border-bottom-width: 4px;\n"])));var IconContainer$1=_styled.div.withConfig({displayName:"GutterMakerIcon__IconContainer",componentId:"sc-aa2cf4-4"})(templateObject_5$b||(templateObject_5$b=__makeTemplateObject(["\n  flex-grow: 0;\n  flex-shrink: 0;\n  flex-basis: ",";\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  padding: 10px 0;\n"],["\n  flex-grow: 0;\n  flex-shrink: 0;\n  flex-basis: ",";\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  padding: 10px 0;\n"])),function(_a){var isActive=_a.isActive;return isActive?'50px':'auto';});var StyledTooltip=_styled(Tooltip).withConfig({displayName:"GutterMakerIcon__StyledTooltip",componentId:"sc-aa2cf4-5"})(templateObject_6$5$1||(templateObject_6$5$1=__makeTemplateObject(["\n  && {\n    display: inherit;\n  }\n"],["\n  && {\n    display: inherit;\n  }\n"])));var templateObject_1$I,templateObject_2$t,templateObject_3$l,templateObject_4$c$1,templateObject_5$b,templateObject_6$5$1;var DetailViewTitle=function DetailViewTitle(){var _a=useDetailViewContext(),content=_a.content,item=_a.item;var hasAlert=hasFlag(item.knownState,KnownNewsState.Alert);return jsx$1(GutterMarkerIcon,__assign({iconName:"Warning",isActive:hasAlert,color:"red",tooltipResourceKey:"NewsArticle.alert"},{children:jsx$1(Title$4,__assign({"data-title":true},{children:content.title}),void 0)}),void 0);};var Title$4=_styled.h1.withConfig({displayName:"DetailViewTitle__Title",componentId:"sc-1jbzvna-0"})(templateObject_1$H||(templateObject_1$H=__makeTemplateObject(["\n  color: black;\n  width: 100%;\n  font-size: ","px;\n  line-height: 29px;\n  margin: 0;\n\n  @media (min-width: ","px) {\n    font-size: 2.2em;\n    line-height: 42px;\n  }\n"],["\n  color: black;\n  width: 100%;\n  font-size: ","px;\n  line-height: 29px;\n  margin: 0;\n\n  @media (min-width: ","px) {\n    font-size: 2.2em;\n    line-height: 42px;\n  }\n"])),fontSizeLarge-1,minScreenSize.small);var templateObject_1$H;_styled(ItemMetaInfo).withConfig({displayName:"NewsDetailViewMetaInfo__DetailMetaInfo",componentId:"sc-kib7we-0"})(templateObject_1$G||(templateObject_1$G=__makeTemplateObject(["\n  display: flex;\n  font-size: ","px;\n  margin-top: 12px;\n"],["\n  display: flex;\n  font-size: ","px;\n  margin-top: 12px;\n"])),fontSizeSmall);var templateObject_1$G;var mappers=[InlineImageMapper,InlineFileMapper,InlineQuoteMapper,InlineGalleryMapper,InlineCodeMapper,InlineVideoMapper,InlineTable,InlineContactMapper,InlinePageListMapper,InlineUrlPreviewMapper];var RichTextViewer=function RichTextViewer(_a){var html=_a.html;return jsx$1(TextViewer,{html:html,componentMappers:mappers},void 0);};var DetailViewBody=function DetailViewBody(){var _a=useDetailViewContext(),content=_a.content,resourceType=_a.resourceType;var bodyHtml=content&&content.body;return jsx$1(DetailBody$1,__assign({className:"lt-reach-detail-view-body","data-item-type":resourceType},{children:jsx$1(ItemBodyWrapper,{children:jsx$1(RichTextViewer,{html:bodyHtml},void 0)},void 0)}),void 0);};var DetailBody$1=_styled.div.withConfig({displayName:"DetailViewBody__DetailBody",componentId:"sc-7b4trq-0"})(templateObject_1$F||(templateObject_1$F=__makeTemplateObject(["\n  flex: 1 0 auto;\n  box-sizing: border-box;\n  min-width: 100%;\n  width: 100px;\n  margin-top: 35px;\n\n  // So that headings have the correct semantics for accessibility (i.e. title is h1, subheadings start at h2),\n  // but maintain the same visual design, this styles each heading to look one \"step\" larger\n  // e.g. h2 looks like h1, etc.\n  && {\n    h2 {\n      font-size: ","px;\n      margin: ","px 0;\n    }\n\n    h3 {\n      font-size: ","px;\n    }\n\n    h4 {\n      font-size: ","px;\n    }\n\n    h3,\n    h4,\n    h5,\n    h6 {\n      margin: ","px 0;\n    }\n  }\n"],["\n  flex: 1 0 auto;\n  box-sizing: border-box;\n  min-width: 100%;\n  width: 100px;\n  margin-top: 35px;\n\n  // So that headings have the correct semantics for accessibility (i.e. title is h1, subheadings start at h2),\n  // but maintain the same visual design, this styles each heading to look one \"step\" larger\n  // e.g. h2 looks like h1, etc.\n  && {\n    h2 {\n      font-size: ","px;\n      margin: ","px 0;\n    }\n\n    h3 {\n      font-size: ","px;\n    }\n\n    h4 {\n      font-size: ","px;\n    }\n\n    h3,\n    h4,\n    h5,\n    h6 {\n      margin: ","px 0;\n    }\n  }\n"])),fontSizeLarge-1,spacingS+2,fontSizeLarge-3,fontSizeLarge-5,spacingS);var templateObject_1$F;var DetailViewKeywords=function DetailViewKeywords(_a){var filterBaseUrl=_a.filterBaseUrl;var features=useFeatures();var _b=useDetailViewContext(),item=_b.item,userPreferredLanguage=_b.userPreferredLanguage;var formatMessage=useIntl().formatMessage;if(!features.keywords){return null;}return jsx$1(Fragment,{children:Object.keys(item.keywords).length>0&&jsx$1(KeywordsSection,__assign({"aria-label":formatMessage({id:'AriaLabel.section.keywords'})},{children:jsx$1(KeywordsInfo,{keywords:item.keywords,language:userPreferredLanguage,filterBaseUrl:filterBaseUrl},void 0)}),void 0)},void 0);};var KeywordsSection=_styled.section.withConfig({displayName:"DetailViewKeywords__KeywordsSection",componentId:"sc-ltysu4-0"})(templateObject_1$E||(templateObject_1$E=__makeTemplateObject(["\n  margin-top: 2em;\n  display: flex;\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"],["\n  margin-top: 2em;\n  display: flex;\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"])),maxScreenSize.medium,fontSizeSmall);var templateObject_1$E;var ConfirmationBox=function ConfirmationBox(_a){var disabled=_a.disabled,checked=_a.checked,onChange=_a.onChange;var formatMessage=useIntl().formatMessage;return jsx$1(Host$g$1,{children:jsx$1(NeutralCheckBox,{disabled:disabled,checked:checked,onChange:function(_,value){return onChange(value);},label:formatMessage({id:checked?'NewsArticle.confirmed':'NewsArticle.confirm'})},void 0)},void 0);};var Host$g$1=_styled.div.withConfig({displayName:"ConfirmationBox__Host",componentId:"sc-1m5alil-0"})(templateObject_1$D||(templateObject_1$D=__makeTemplateObject(["\n  .ms-Checkbox-text {\n    font-weight: bold;\n    color: black;\n  }\n"],["\n  .ms-Checkbox-text {\n    font-weight: bold;\n    color: black;\n  }\n"])));var templateObject_1$D;var ConfirmationSection=function ConfirmationSection(_a){var item=_a.item,showDescription=_a.showDescription,readOnly=_a.readOnly,className=_a.className;var refreshStatistics=useNewsApi().refreshStatistics;var _b=useNotificationContext(),dismissToast=_b.dismissToast,showToast=_b.showToast,showError=_b.showError;var _c=useFeedbackApi(),getFeedback=_c.getFeedback,setFeedback=_c.setFeedback,unsetFeedback=_c.unsetFeedback;var _d=usePromise$2(function(){return getFeedback(ItemResourceTypes.News,item.id);}),summary=_d[0],isLoading=_d[1];var _e=useState$2(null),userChecked=_e[0],setChecked=_e[1];var toastHandle=useRef$1(null);var checked=userChecked!==null?userChecked:summary!=null&&!!summary.records.find(function(r){return r.type==='confirm';});return jsxs(Host$f$1,__assign({isLoading:isLoading,className:className},{children:[showDescription&&jsx$1(FormattedMessage$1,{id:"NewsArticle.confirmationRequiredDescription",tagName:"p"},void 0),jsx$1(StyledGutterMarkerIcon,__assign({iconName:"Completed",isActive:!isLoading&&!checked,color:"green"},{children:readOnly?jsx$1(ConfirmationBox,{checked:checked,disabled:true},void 0):jsx$1(ConfirmationBox,{checked:checked,disabled:checked,onChange:handleClickConfirm},void 0)}),void 0)]}),void 0);function handleClickConfirm(){return __awaiter(this,void 0,void 0,function(){var error_1;return __generator(this,function(_a){switch(_a.label){case 0:setChecked(true);_a.label=1;case 1:_a.trys.push([1,4,,5]);return [4/*yield*/,setFeedback(ItemResourceTypes.News,item.id,'confirm')];case 2:_a.sent();toastHandle.current=showToast('NewsArticle.confirmationSuccessToast',{},jsx$1(DefaultButton,__assign({onClick:handleUndo},{children:jsx$1(FormattedMessage$1,{id:"Generic.undo"},void 0)}),void 0),{autoClose:false});return [4/*yield*/,refreshStatistics(item.id,{confirmationCount:1})];case 3:_a.sent();return [3/*break*/,5];case 4:error_1=_a.sent();logger.error(error_1);showError('Generic.error');setChecked(false);return [3/*break*/,5];case 5:return [2/*return*/];}});});}function handleUndo(){return __awaiter(this,void 0,void 0,function(){var error_2;return __generator(this,function(_a){switch(_a.label){case 0:_a.trys.push([0,3,,4]);dismissToast(toastHandle.current);toastHandle.current=null;return [4/*yield*/,unsetFeedback(ItemResourceTypes.News,item.id,'confirm')];case 1:_a.sent();return [4/*yield*/,refreshStatistics(item.id,{confirmationCount:-1})];case 2:_a.sent();setChecked(false);return [3/*break*/,4];case 3:error_2=_a.sent();logger.error(error_2);showError('Generic.error');return [3/*break*/,4];case 4:return [2/*return*/];}});});}};var Host$f$1=_styled.div.withConfig({displayName:"ConfirmationSection__Host",componentId:"sc-1g2fxdb-0"})(templateObject_1$C||(templateObject_1$C=__makeTemplateObject(["\n  width: 100%;\n\n  opacity: ",";\n\n  > p {\n    margin: 0 0 5px ","px;\n    font-style: italic;\n  }\n\n  @media (min-width: ","px) {\n    > p {\n      margin: 0 0 ","px 0;\n    }\n  }\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"],["\n  width: 100%;\n\n  opacity: ",";\n\n  > p {\n    margin: 0 0 5px ","px;\n    font-style: italic;\n  }\n\n  @media (min-width: ","px) {\n    > p {\n      margin: 0 0 ","px 0;\n    }\n  }\n\n  @media (max-width: ","px) {\n    font-size: ","px;\n  }\n"])),function(_a){var isLoading=_a.isLoading;return isLoading?0.4:1;},spacingM,minScreenSize.small,spacingS,maxScreenSize.medium,fontSizeSmall);var StyledGutterMarkerIcon=_styled(GutterMarkerIcon).withConfig({displayName:"ConfirmationSection__StyledGutterMarkerIcon",componentId:"sc-1g2fxdb-1"})(templateObject_2$s||(templateObject_2$s=__makeTemplateObject(["\n  @media (max-width: ","px) {\n    margin: 0 ","px 0;\n  }\n"],["\n  @media (max-width: ","px) {\n    margin: 0 ","px 0;\n  }\n"])),maxScreenSize.small,spacingM);var templateObject_1$C,templateObject_2$s;var DetailViewConfirmations=function DetailViewConfirmations(){var features=useFeatures();var _a=useDetailViewContext(),item=_a.item,isEditorPreview=_a.isEditorPreview;var formatMessage=useIntl().formatMessage;if(!showConfirmationBox()){return null;}return jsx$1(ConfirmationHost,__assign({"aria-label":formatMessage({id:'NewsArticle.confirmation'})},{children:jsx$1(ConfirmationSection,{item:item,showDescription:true,readOnly:isEditorPreview},void 0)}),void 0);function showConfirmationBox(){return features.confirmation&&item.metadata&&item.metadata.feedbackSettings&&item.metadata.feedbackSettings.feedbackOptions.indexOf('confirm')>=0;}};var ConfirmationHost=_styled.section.withConfig({displayName:"DetailViewConfirmations__ConfirmationHost",componentId:"sc-f8jogv-0"})(templateObject_1$B||(templateObject_1$B=__makeTemplateObject(["\n  margin-bottom: ","px;\n\n  @media (min-width: ","px) {\n    padding: 0 ","px 0 ","px;\n  }\n"],["\n  margin-bottom: ","px;\n\n  @media (min-width: ","px) {\n    padding: 0 ","px 0 ","px;\n  }\n"])),spacingL,minScreenSize.small,spacingXl,spacingXl);var templateObject_1$B;var DetailViewPageViewTracker=function DetailViewPageViewTracker(){var _a=useDetailViewContext(),resourceType=_a.resourceType,itemId=_a.itemId;usePageViewTracker(resourceType,itemId);return null;};var FeedbackButtonBookmark=function FeedbackButtonBookmark(_a){var isReadOnly=_a.isReadOnly;var _b=useContext(FeedbackButtonContext),item=_b.item,bookmarkCount=_b.statistics.bookmarkCount;return jsxs(CountButtonHost,{children:[jsx$1(BookmarkButton,{item:item,isReadOnly:isReadOnly},void 0),jsx$1(CountLabel,__assign({isDisabled:isReadOnly},{children:bookmarkCount}),void 0)]},void 0);};var NewsDetailViewFeedbackSection=function NewsDetailViewFeedbackSection(_a){var _b;var hideLikes=_a.hideLikes,hideComments=_a.hideComments,hideProfileUrl=_a.hideProfileUrl,disableLoginForPublicUser=_a.disableLoginForPublicUser;var _c=useDetailViewContext(),item=_c.item,resourceType=_c.resourceType,contentLanguage=_c.contentLanguage,isEditorPreview=_c.isEditorPreview;return jsxs(StyledFeedbackSection,__assign({item:item,language:contentLanguage,type:resourceType,feedbackSettings:(_b=item.metadata)===null||_b===void 0?void 0:_b.feedbackSettings,hideComments:hideComments,hideProfileUrl:hideProfileUrl,disableLoginForPublicUser:disableLoginForPublicUser,isReadOnly:isEditorPreview},{children:[!hideLikes&&jsx$1(FeedbackButtonLike,{isReadOnly:isEditorPreview},void 0),jsx$1(FeedbackButtonBookmark,{isReadOnly:isEditorPreview},void 0),!hideComments&&jsx$1(FeedbackButtonComments,{},void 0),jsx$1(FeedbackButtonViews,{},void 0),jsx$1(FeedbackButtonShare,{isReadOnly:isEditorPreview},void 0),jsx$1(FeedbackButtonConfirmations,{},void 0)]}),void 0);};var StyledFeedbackSection=_styled(FeedbackSection).withConfig({displayName:"NewsDetailViewFeedbackSection__StyledFeedbackSection",componentId:"sc-pjpy6x-0"})(templateObject_1$A||(templateObject_1$A=__makeTemplateObject(["\n  ","\n"],["\n  ","\n"])),DetailViewSectionPadding);var templateObject_1$A;var DetailViewBodyExternalContent=function DetailViewBodyExternalContent(_a){var itemType=_a.itemType;var content=useDetailViewContext().content;var externalUrl=content&&content.externalUrl;return jsx$1(DetailBody,__assign({className:"lt-reach-detail-view-body"},{children:jsx$1(ItemBodyWrapper,{children:jsx$1(FormattedMessageWithStyle,{id:"ExternalLink."+itemType+".navigateTo",tagName:"p",values:{url:jsx$1(ExternalLink$2,__assign({href:externalUrl,className:"ms-fontColor-accent",target:"_blank",rel:"noopener noreferrer"},{children:externalUrl}),void 0)}},void 0)},void 0)}),void 0);};var DetailBody=_styled.div.withConfig({displayName:"DetailViewBodyExternalContent__DetailBody",componentId:"sc-1xjgw89-0"})(templateObject_1$z||(templateObject_1$z=__makeTemplateObject(["\n  flex: 1 0 auto;\n  box-sizing: border-box;\n  min-width: 100%;\n  width: 100px;\n  margin-top: 35px;\n"],["\n  flex: 1 0 auto;\n  box-sizing: border-box;\n  min-width: 100%;\n  width: 100px;\n  margin-top: 35px;\n"])));var templateObject_1$z;var DetailViewHeadline=function DetailViewHeadline(){var content=useDetailViewContext().content;var features=useFeatures();if(!features.contentHeadline||!content.headline){return null;}return jsx$1(Headline$1$1,__assign({"data-detail-view-headline":true},{children:content.headline}),void 0);};var Headline$1$1=_styled.p.withConfig({displayName:"DetailViewHeadline__Headline",componentId:"sc-wsid06-0"})(templateObject_1$y||(templateObject_1$y=__makeTemplateObject(["\n  width: 100%;\n  font-weight: bold;\n  font-size: ","px;\n  line-height: 26px;\n  margin: 0;\n\n  @media (min-width: ","px) {\n    line-height: 22px;\n    font-size: ","px;\n    margin-bottom: ","px;\n  }\n"],["\n  width: 100%;\n  font-weight: bold;\n  font-size: ","px;\n  line-height: 26px;\n  margin: 0;\n\n  @media (min-width: ","px) {\n    line-height: 22px;\n    font-size: ","px;\n    margin-bottom: ","px;\n  }\n"])),fontSizeNormal,minScreenSize.small,fontSizeMedium,spacingS);var templateObject_1$y;var StateIcon=function StateIcon(_a){var status=_a.status,isActive=_a.isActive,_b=_a.width,width=_b===void 0?16:_b,activeColor=_a.activeColor;var textColors=useContext(ThemeContext$1).theme.textColors;if(status===WorkflowStatus.draft){return jsx$1(Draft,{width:width,color:isActive?activeColor||textColors.onSecondary:textColors.default},void 0);}else if(status===WorkflowStatus.rejected){return jsx$1(Draft,{width:width,color:isActive?activeColor:'#b90000'},void 0);}else if(status===WorkflowStatus.ready){return jsx$1(Ready,{width:width,color:isActive?activeColor||textColors.onSecondary:textColors.default},void 0);}return null;};var Draft=function Draft(_a){var color=_a.color,className=_a.className,_b=_a.width,width=_b===void 0?16.25:_b;var ratio=20/16.25;return jsx$1("svg",__assign({className:className,version:"1.1",id:"Layer_1",x:"0px",y:"0px",width:width+"px",height:width*ratio+"px",viewBox:"0 0 16.25 20",enableBackground:"new 0 0 16.25 20"},{children:jsx$1("path",{fill:color,d:"M10,6.25V0h0.89l5.36,5.361V6.25H10z M11.25,5h2.861L11.25,2.139V5z M10,0H9.25v1.25H10V0z M7.675,1.25H6.1\n\tV0h1.575V1.25z M4.525,1.25H2.95V0h1.575V1.25z M1.25,17.057H0v-1.567h1.25V17.057z M1.25,13.921H0v-1.568h1.25V13.921z\n\t M1.25,10.784H0V9.216h1.25V10.784z M1.25,7.647H0V6.08h1.25V7.647z M1.25,4.512H0V2.943h1.25V4.512z M13.375,\n\t 20h-1.5v-1.25h1.5V20z\n\t M10.375,20h-1.5v-1.25h1.5V20z M7.375,20h-1.5v-1.25h1.5V20z M4.375,20h-1.5v-1.25h1.5V20z M16.25,\n\t 16.964H15v-1.661h1.25V16.964z\n\t M16.25,13.643H15v-1.661h1.25V13.643z M16.25,10.321H15V8.66h1.25V10.321z M16.25,6.25H15V7h1.25V6.25z\n\t M1.25,18.75H0V20h1.25\n\tV18.75z M1.25,0H0v1.25h1.25V0z M16.25,18.75H15V20h1.25V18.75z"},void 0)}),void 0);};var Ready=function Ready(_a){var color=_a.color,className=_a.className,_b=_a.width,width=_b===void 0?18.564:_b;var ratio=20/18.564;return jsx$1("svg",__assign({className:className,version:"1.1",id:"Layer_1",x:"0px",y:"0px",width:width+"px",height:width*ratio+"px",viewBox:"0 0 18.564 20",enableBackground:"new 0 0 18.564 20"},{children:jsx$1("path",{fill:color,d:"M10,6.25v-5H1.25v17.5H10V20H0V0h10.889l5.361,5.361V12.5L15,13.75v-7.5H10z M18.564,14.551L13.125,20\n  \tl-2.627-2.637l0.879-0.879l1.748,1.738l4.561-4.551L18.564,14.551z M11.25,5h2.861L11.25,2.139V5z"},void 0)}),void 0);};function useCommonEditorApi(){var api=useApi();return useMemo(function(){return {list:list,getTaskViewCounts:getTaskViewCounts};function list(type,filter,token,sortDefinition){var params=Object.assign({},__assign(__assign(__assign({},filter),getCommaSeparatedChannelsString(filter===null||filter===void 0?void 0:filter.channels)),getCommaSeparatedKeywordsString(filter===null||filter===void 0?void 0:filter.keywords)),{token:token},sortDefinition);return api.custom("editor/"+type+"?"+queryString.stringify(params)).get().then(function(res){return res.body().data();});}function getTaskViewCounts(type,groupId){return __awaiter(this,void 0,void 0,function(){var response;return __generator(this,function(_a){switch(_a.label){case 0:return [4/*yield*/,api.custom("editor/"+type+"/taskcounts?"+queryString.stringify({groupId:groupId})).get(groupId)];case 1:response=_a.sent();return [4/*yield*/,response.body().data()];case 2:return [2/*return*/,_a.sent()];}});});}},[api]);}var KeywordPickerGroup=function KeywordPickerGroup(_a){var group=_a.group,keywords=_a.keywords,expanded=_a.expanded,selectedKeywords=_a.selectedKeywords,onChange=_a.onChange,mandatoryKeywordIds=_a.mandatoryKeywordIds;var _b=useState$2(null),isExpanded=_b[0],setIsExpanded=_b[1];var isSelected=!!selectedKeywords.find(function(k){return k.groupId===group.id;});var isCollapsed=!(isExpanded===true||expanded);return jsxs(Host$e$1,{children:[jsxs(GroupButton,__assign({onClick:toggle,iconProps:{iconName:isCollapsed?'CaretRightSolid8':'CaretDownSolid8'},"aria-expanded":!isCollapsed,"aria-controls":group.name+"-list"},{children:[isSelected&&jsx$1(CheckMarkIcon,{iconName:"CheckMark"},void 0),jsx$1(ButtonLabel,__assign({"data-keyword-group":group.name,isSelected:isSelected},{children:jsx$1(KeywordTitle,{groupName:group.name},void 0)}),void 0)]}),void 0),jsx$1(KeywordsList,__assign({id:group.name+"-list","data-keyword-picker-group-list":true,isCollapsed:isCollapsed},{children:keywords.map(function(k){var checked=isKeywordSelected(k);var disabled=isKeywordDisabled(k);return jsx$1(KeywordItem,__assign({"data-keyword":k.name,"data-is-checked":checked,"data-is-disabled":disabled},{children:jsx$1(Checkbox,{label:k.name,onRenderLabel:function(){return jsx$1(KeywordTitle,{groupName:group.name,keywordName:k.name},void 0);},checked:checked,onChange:function(_e,isChecked){return handleChange(isChecked,k);},disabled:disabled},k.id)}),k.name);})}),void 0)]},void 0);function toggle(){setIsExpanded(!isExpanded);}function isKeywordSelected(keyword){return !!selectedKeywords.find(function(k){return k.id===keyword.id;});}function isKeywordDisabled(keyword){return mandatoryKeywordIds===null||mandatoryKeywordIds===void 0?void 0:mandatoryKeywordIds.some(function(id){return id===keyword.id;});}function handleChange(add,keyword){if(onChange){var result=selectedKeywords.filter(function(k){return keyword.id!==k.id;});if(add){result.push(keyword);}onChange(result);}}};var Host$e$1=_styled.div.withConfig({displayName:"KeywordPickerGroup__Host",componentId:"sc-pu16jm-0"})(templateObject_1$x||(templateObject_1$x=__makeTemplateObject(["\n  margin-bottom: ","px;\n"],["\n  margin-bottom: ","px;\n"])),spacingS);var GroupButton=_styled(ActionButton).withConfig({displayName:"KeywordPickerGroup__GroupButton",componentId:"sc-pu16jm-1"})(templateObject_2$r||(templateObject_2$r=__makeTemplateObject(["\n  && {\n    height: auto;\n    font-size: ","px;\n    padding: 0;\n    border: 0;\n\n    i {\n      font-size: ","px;\n\n      &:first-child {\n        margin: 0;\n      }\n    }\n  }\n"],["\n  && {\n    height: auto;\n    font-size: ","px;\n    padding: 0;\n    border: 0;\n\n    i {\n      font-size: ","px;\n\n      &:first-child {\n        margin: 0;\n      }\n    }\n  }\n"])),fontSizeNormal,fontSizeSmall);var CheckMarkIcon=_styled(Icon).withConfig({displayName:"KeywordPickerGroup__CheckMarkIcon",componentId:"sc-pu16jm-2"})(templateObject_3$k||(templateObject_3$k=__makeTemplateObject(["\n  margin-right: 6px;\n  margin-left: 12px;\n  width: 15px;\n"],["\n  margin-right: 6px;\n  margin-left: 12px;\n  width: 15px;\n"])));var ButtonLabel=_styled.span.withConfig({displayName:"KeywordPickerGroup__ButtonLabel",componentId:"sc-pu16jm-3"})(templateObject_5$a||(templateObject_5$a=__makeTemplateObject(["\n  display: inline-flex;\n  flex: 1 0 auto;\n\n  ","\n"],["\n  display: inline-flex;\n  flex: 1 0 auto;\n\n  ","\n"])),function(p){return !p.isSelected&&css$2(templateObject_4$b$1||(templateObject_4$b$1=__makeTemplateObject(["\n      margin-left: 33px; // checkmark icon space\n    "],["\n      margin-left: 33px; // checkmark icon space\n    "])));});var KeywordsList=_styled.ul.withConfig({displayName:"KeywordPickerGroup__KeywordsList",componentId:"sc-pu16jm-4"})(templateObject_7$3$1||(templateObject_7$3$1=__makeTemplateObject(["\n  ","\n  padding: 0;\n  margin: 0 0 0 ","px;\n  list-style: none;\n"],["\n  ","\n  padding: 0;\n  margin: 0 0 0 ","px;\n  list-style: none;\n"])),function(p){return p.isCollapsed&&css$2(templateObject_6$4$1||(templateObject_6$4$1=__makeTemplateObject(["\n      display: none;\n    "],["\n      display: none;\n    "])));},spacingX+10);var KeywordItem=_styled.li.withConfig({displayName:"KeywordPickerGroup__KeywordItem",componentId:"sc-pu16jm-5"})(templateObject_8$3$1||(templateObject_8$3$1=__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  margin-top: 9px;\n"],["\n  display: flex;\n  align-items: center;\n  margin-top: 9px;\n"])));var templateObject_1$x,templateObject_2$r,templateObject_3$k,templateObject_4$b$1,templateObject_5$a,templateObject_6$4$1,templateObject_7$3$1,templateObject_8$3$1;var KeywordPicker=function KeywordPicker(_a){var _b;var value=_a.value,onChange=_a.onChange,showSelectionToggle=_a.showSelectionToggle,incomingAvailableKeywords=_a.availableKeywords,mandatoryKeywordIds=_a.mandatoryKeywordIds,className=_a.className;var formatMessage=useIntl().formatMessage;var user=useCurrentUser();var _c=useContext(LazySubscriptionContext),allKeywords=_c.allKeywords,selectedKeywordGroups=_c.selectedKeywordGroups;var _d=useState$2(null),searchedKeywords=_d[0],setSearchedKeywords=_d[1];var _e=useState$2(null),searchText=_e[0],setSearchText=_e[1];var selectedKeywords=getSelectedKeywords();var availableKeywords=incomingAvailableKeywords!==null&&incomingAvailableKeywords!==void 0?incomingAvailableKeywords:allKeywords;var visibleKeywords=(_b=searchedKeywords!==null&&searchedKeywords!==void 0?searchedKeywords:availableKeywords)!==null&&_b!==void 0?_b:[];var mandatoryKeywords=mandatoryKeywordIds?availableKeywords.filter(function(k){return mandatoryKeywordIds.includes(k.id);}):[];var noKeywordGroups=(selectedKeywordGroups===null||selectedKeywordGroups===void 0?void 0:selectedKeywordGroups.length)===0;var noAvailableKeywords=!noKeywordGroups&&(availableKeywords===null||availableKeywords===void 0?void 0:availableKeywords.length)===0;var isEmpty=visibleKeywords.length===0;return jsxs(Host$d$1,__assign({className:classNames('keyword-picker',className)},{children:[(noKeywordGroups||noAvailableKeywords)&&jsx$1("span",__assign({className:"keyword-picker-empty"},{children:jsx$1(FormattedMessage$1,{id:noKeywordGroups?'KeywordPicker.noGroupsDefined':'KeywordPicker.noAvailableKeywordsForGroup'},void 0)}),void 0),!noKeywordGroups&&!noAvailableKeywords&&jsxs("div",{children:[jsxs(SearchHost,__assign({className:"keyword-picker-search","data-keyword-picker-search":true},{children:[jsx$1(TextField,{onChange:handleSearch,value:searchText||'',placeholder:formatMessage({id:'KeywordPicker.search'})},void 0),searchText&&jsx$1(SearchCancelButton,{iconProps:{iconName:'Cancel'},onClick:function(){return handleSearch(null,null);},"aria-hidden":"true"},void 0)]}),void 0),showSelectionToggle&&jsx$1(StyledToggleAllButtons,{toggleAll:handleToggleAll},void 0),jsxs(KeywordPickerTree,__assign({className:"keyword-picker-tree"},{children:[isEmpty&&jsx$1(FormattedMessage$1,{id:"KeywordPicker.emptySearch"},void 0),!isEmpty&&selectedKeywordGroups&&selectedKeywordGroups.sort(function(a,b){return a.name.localeCompare(b.name);}).map(function(g){var keywords=visibleKeywords.filter(function(k){return k.groupId===g.id;});return keywords.length===0?null:jsx$1(KeywordPickerGroup,{expanded:!!searchText,group:g,keywords:keywords,selectedKeywords:selectedKeywords,onChange:onChange,mandatoryKeywordIds:mandatoryKeywordIds},g.id);})]}),void 0)]},void 0)]}),void 0);function getSelectedKeywords(){if(value==null||allKeywords==null){return [];}return value.map(function(k){return typeof k==='string'?allKeywords.find(function(a){return a.id===k;}):k;}).filter(function(k){return k;});}function handleSearch(_,text){var hasSearch=text&&text.length;var keywords=hasSearch?availableKeywords.filter(function(k){return getKeywordTitle(user,k.translations,k.name).toLocaleLowerCase().indexOf(text.toLocaleLowerCase())>=0;}):availableKeywords;setSearchedKeywords(keywords);setSearchText(hasSearch?text:null);}function handleToggleAll(checkAll){onChange(checkAll?availableKeywords:mandatoryKeywords);}};var KeywordPickerTree=_styled.div.withConfig({displayName:"KeywordPicker__KeywordPickerTree",componentId:"sc-1ejjfwa-0"})(templateObject_1$w||(templateObject_1$w=__makeTemplateObject(["\n  padding-left: 4px;\n"],["\n  padding-left: 4px;\n"])));var StyledToggleAllButtons=_styled(ToggleAllButtons).withConfig({displayName:"KeywordPicker__StyledToggleAllButtons",componentId:"sc-1ejjfwa-1"})(templateObject_2$q||(templateObject_2$q=__makeTemplateObject(["\n  padding-left: 4px;\n"],["\n  padding-left: 4px;\n"])));var Host$d$1=_styled.div.withConfig({displayName:"KeywordPicker__Host",componentId:"sc-1ejjfwa-2"})(templateObject_3$j||(templateObject_3$j=__makeTemplateObject(["\n  overflow-x: hidden;\n  overflow-y: auto;\n\n  .ms-TextField-fieldGroup {\n    background: none;\n  }\n"],["\n  overflow-x: hidden;\n  overflow-y: auto;\n\n  .ms-TextField-fieldGroup {\n    background: none;\n  }\n"])));var SearchHost=_styled.div.withConfig({displayName:"KeywordPicker__SearchHost",componentId:"sc-1ejjfwa-3"})(templateObject_4$a$1||(templateObject_4$a$1=__makeTemplateObject(["\n  position: relative;\n  margin-bottom: 8px;\n"],["\n  position: relative;\n  margin-bottom: 8px;\n"])));var SearchCancelButton=_styled(IconButton).withConfig({displayName:"KeywordPicker__SearchCancelButton",componentId:"sc-1ejjfwa-4"})(templateObject_5$9$1||(templateObject_5$9$1=__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  z-index: 10;\n\n  &&&:focus::after {\n    outline-offset: -2px;\n  }\n"],["\n  position: absolute;\n  top: 0;\n  right: 0;\n  z-index: 10;\n\n  &&&:focus::after {\n    outline-offset: -2px;\n  }\n"])));var templateObject_1$w,templateObject_2$q,templateObject_3$j,templateObject_4$a$1,templateObject_5$9$1;var $$2=_export;var requireObjectCoercible$1$1=requireObjectCoercible$c;var isRegExp=isRegexp;var getRegExpFlags=regexpFlags$1$1;var wellKnownSymbol$1=wellKnownSymbol$l;var REPLACE$2=wellKnownSymbol$1('replace');var RegExpPrototype$3=RegExp.prototype;// `String.prototype.replaceAll` method
 // https://github.com/tc39/proposal-string-replace-all
-$$2({target:'String',proto:true},{replaceAll:function replaceAll(searchValue,replaceValue){var O=requireObjectCoercible$1$1(this);var IS_REG_EXP,flags,replacer,string,searchString,template,result,position,index;if(searchValue!=null){IS_REG_EXP=isRegExp(searchValue);if(IS_REG_EXP){flags=String(requireObjectCoercible$1$1('flags'in RegExpPrototype$3?searchValue.flags:getRegExpFlags.call(searchValue)));if(!~flags.indexOf('g'))throw TypeError('`.replaceAll` does not allow non-global regexes');}replacer=searchValue[REPLACE$2];if(replacer!==undefined){return replacer.call(searchValue,O,replaceValue);}}string=String(O);searchString=String(searchValue);if(searchString==='')return replaceAll.call(string,/(?:)/g,replaceValue);template=string.split(searchString);if(typeof replaceValue!=='function'){return template.join(String(replaceValue));}result=template[0];position=result.length;for(index=1;index<template.length;index++){result+=String(replaceValue(searchString,position,string));position+=searchString.length+template[index].length;result+=template[index];}return result;}});_styled.div.withConfig({displayName:"Textarea__Host",componentId:"sc-170lrb4-0"})(templateObject_1$v||(templateObject_1$v=__makeTemplateObject(["\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n"],["\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n"])));_styled.textarea.withConfig({displayName:"Textarea__StyledTextarea",componentId:"sc-170lrb4-1"})(templateObject_2$p||(templateObject_2$p=__makeTemplateObject(["\n  flex: 1 0 auto;\n  justify-content: space-between;\n  overflow: hidden;\n  resize: none;\n  min-height: 5px;\n\n  ","\n"],["\n  flex: 1 0 auto;\n  justify-content: space-between;\n  overflow: hidden;\n  resize: none;\n  min-height: 5px;\n\n  ","\n"])),InputPlaceholder('font-style: italic'));_styled(IconButton$1).withConfig({displayName:"Textarea__StyledIconButton",componentId:"sc-170lrb4-2"})(templateObject_3$i||(templateObject_3$i=__makeTemplateObject(["\n  position: absolute;\n  bottom: 2px;\n  right: 2px;\n"],["\n  position: absolute;\n  bottom: 2px;\n  right: 2px;\n"])));var templateObject_1$v,templateObject_2$p,templateObject_3$i;var InsertFilesDialogHost=_styled.div.withConfig({displayName:"InsertFilesButton__InsertFilesDialogHost",componentId:"sc-1q7gx3n-0"})(templateObject_2$o||(templateObject_2$o=__makeTemplateObject(["\n  ","\n\n  position: relative;\n  padding: ","px;\n  text-align: center;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"],["\n  ","\n\n  position: relative;\n  padding: ","px;\n  text-align: center;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])),function(p){return p.isActive&&css$2(templateObject_1$u||(templateObject_1$u=__makeTemplateObject(["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n\n        border: 2px black dashed;\n      }\n    "],["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n\n        border: 2px black dashed;\n      }\n    "])));},spacingM);_styled.p.withConfig({displayName:"InsertFilesButton__DragAndDropText",componentId:"sc-1q7gx3n-1"})(templateObject_3$h||(templateObject_3$h=__makeTemplateObject(["\n  font-size: ","px;\n  margin: ","px auto 0 auto;\n"],["\n  font-size: ","px;\n  margin: ","px auto 0 auto;\n"])),fontSizeSmall,spacingS);_styled(DefaultButton).withConfig({displayName:"InsertFilesButton__SelectFileButton",componentId:"sc-1q7gx3n-2"})(templateObject_4$9$1||(templateObject_4$9$1=__makeTemplateObject(["\n  margin-top: ","px;\n\n  span {\n    font-weight: normal;\n  }\n"],["\n  margin-top: ","px;\n\n  span {\n    font-weight: normal;\n  }\n"])),spacingM);_styled.div.withConfig({displayName:"InsertFilesButton__ButtonsContainer",componentId:"sc-1q7gx3n-3"})(templateObject_5$8$1||(templateObject_5$8$1=__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"],["\n  display: flex;\n  flex-direction: column;\n"])));var templateObject_1$u,templateObject_2$o,templateObject_3$h,templateObject_4$9$1,templateObject_5$8$1;_styled(InsertFilesDialogHost).withConfig({displayName:"InsertImagesButton__Host",componentId:"sc-63tjy6-0"})(templateObject_1$t$1||(templateObject_1$t$1=__makeTemplateObject(["\n  cursor: pointer;\n"],["\n  cursor: pointer;\n"])));_styled(PrimaryButton).withConfig({displayName:"InsertImagesButton__StyledButton",componentId:"sc-63tjy6-1"})(templateObject_2$n||(templateObject_2$n=__makeTemplateObject(["\n  && {\n    display: block;\n    margin: 10px auto;\n    background-color: transparent;\n    color: inherit;\n    font-size: large;\n    line-height: 2em;\n    border: none;\n\n    &:hover {\n      background-color: transparent;\n      color: inherit;\n      border: 0;\n    }\n  }\n"],["\n  && {\n    display: block;\n    margin: 10px auto;\n    background-color: transparent;\n    color: inherit;\n    font-size: large;\n    line-height: 2em;\n    border: none;\n\n    &:hover {\n      background-color: transparent;\n      color: inherit;\n      border: 0;\n    }\n  }\n"])));_styled.div.withConfig({displayName:"InsertImagesButton__Text",componentId:"sc-63tjy6-2"})(templateObject_3$g||(templateObject_3$g=__makeTemplateObject(["\n  max-width: 100%;\n  font-size: large;\n"],["\n  max-width: 100%;\n  font-size: large;\n"])));var templateObject_1$t$1,templateObject_2$n,templateObject_3$g;_styled.div.withConfig({displayName:"InsertVideoDialog__VideoHost",componentId:"sc-12gp7sa-0"})(templateObject_1$s$1||(templateObject_1$s$1=__makeTemplateObject(["\n  width: 100%;\n  margin-top: ","px;\n\n  .video-view-container--youtube {\n    &:after {\n      padding-bottom: calc(9 / 16 * 100%);\n    }\n  }\n"],["\n  width: 100%;\n  margin-top: ","px;\n\n  .video-view-container--youtube {\n    &:after {\n      padding-bottom: calc(9 / 16 * 100%);\n    }\n  }\n"])),spacingS);_styled(TextField).withConfig({displayName:"InsertVideoDialog__StyledTextField",componentId:"sc-12gp7sa-1"})(templateObject_2$m||(templateObject_2$m=__makeTemplateObject(["\n  width: 510px;\n\n  label {\n    font-weight: normal;\n  }\n"],["\n  width: 510px;\n\n  label {\n    font-weight: normal;\n  }\n"])));var templateObject_1$s$1,templateObject_2$m;var DateTimePicker=function DateTimePicker(props){var timeField=useRef$1();var formatMessage=useIntl().formatMessage;var _a=useState$2(getTime(props.date)),time=_a[0],setTime=_a[1];var _b=useState$2(false),timeHasFocus=_b[0],setTimeHasFocus=_b[1];var _c=useState$2(null),timeErrorMessageResourceKey=_c[0],setTimeErrorMessageResourceKey=_c[1];var momentMonths=['January','February','March','April','May','June','July','August','September','October','November','December'];var momentWeekdays=['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];useEffect$1(function(){// do not update if the user is typing time
+$$2({target:'String',proto:true},{replaceAll:function replaceAll(searchValue,replaceValue){var O=requireObjectCoercible$1$1(this);var IS_REG_EXP,flags,replacer,string,searchString,template,result,position,index;if(searchValue!=null){IS_REG_EXP=isRegExp(searchValue);if(IS_REG_EXP){flags=String(requireObjectCoercible$1$1('flags'in RegExpPrototype$3?searchValue.flags:getRegExpFlags.call(searchValue)));if(!~flags.indexOf('g'))throw TypeError('`.replaceAll` does not allow non-global regexes');}replacer=searchValue[REPLACE$2];if(replacer!==undefined){return replacer.call(searchValue,O,replaceValue);}}string=String(O);searchString=String(searchValue);if(searchString==='')return replaceAll.call(string,/(?:)/g,replaceValue);template=string.split(searchString);if(typeof replaceValue!=='function'){return template.join(String(replaceValue));}result=template[0];position=result.length;for(index=1;index<template.length;index++){result+=String(replaceValue(searchString,position,string));position+=searchString.length+template[index].length;result+=template[index];}return result;}});_styled.div.withConfig({displayName:"Textarea__Host",componentId:"sc-170lrb4-0"})(templateObject_1$v||(templateObject_1$v=__makeTemplateObject(["\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n"],["\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n"])));_styled.textarea.withConfig({displayName:"Textarea__StyledTextarea",componentId:"sc-170lrb4-1"})(templateObject_2$p||(templateObject_2$p=__makeTemplateObject(["\n  flex: 1 0 auto;\n  justify-content: space-between;\n  overflow: hidden;\n  resize: none;\n  min-height: 5px;\n\n  ","\n"],["\n  flex: 1 0 auto;\n  justify-content: space-between;\n  overflow: hidden;\n  resize: none;\n  min-height: 5px;\n\n  ","\n"])),InputPlaceholder('font-style: italic'));_styled(IconButton$1).withConfig({displayName:"Textarea__StyledIconButton",componentId:"sc-170lrb4-2"})(templateObject_3$i||(templateObject_3$i=__makeTemplateObject(["\n  position: absolute;\n  bottom: 2px;\n  right: 2px;\n"],["\n  position: absolute;\n  bottom: 2px;\n  right: 2px;\n"])));var templateObject_1$v,templateObject_2$p,templateObject_3$i;var InsertFilesDialogHost=_styled.div.withConfig({displayName:"InsertFilesButton__InsertFilesDialogHost",componentId:"sc-1q7gx3n-0"})(templateObject_2$o||(templateObject_2$o=__makeTemplateObject(["\n  ","\n\n  position: relative;\n  padding: ","px;\n  text-align: center;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"],["\n  ","\n\n  position: relative;\n  padding: ","px;\n  text-align: center;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])),function(p){return p.isActive&&css$2(templateObject_1$u$1||(templateObject_1$u$1=__makeTemplateObject(["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n\n        border: 2px black dashed;\n      }\n    "],["\n      &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n\n        border: 2px black dashed;\n      }\n    "])));},spacingM);_styled.p.withConfig({displayName:"InsertFilesButton__DragAndDropText",componentId:"sc-1q7gx3n-1"})(templateObject_3$h||(templateObject_3$h=__makeTemplateObject(["\n  font-size: ","px;\n  margin: ","px auto 0 auto;\n"],["\n  font-size: ","px;\n  margin: ","px auto 0 auto;\n"])),fontSizeSmall,spacingS);_styled(DefaultButton).withConfig({displayName:"InsertFilesButton__SelectFileButton",componentId:"sc-1q7gx3n-2"})(templateObject_4$9$1||(templateObject_4$9$1=__makeTemplateObject(["\n  margin-top: ","px;\n\n  span {\n    font-weight: normal;\n  }\n"],["\n  margin-top: ","px;\n\n  span {\n    font-weight: normal;\n  }\n"])),spacingM);_styled.div.withConfig({displayName:"InsertFilesButton__ButtonsContainer",componentId:"sc-1q7gx3n-3"})(templateObject_5$8$1||(templateObject_5$8$1=__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"],["\n  display: flex;\n  flex-direction: column;\n"])));var templateObject_1$u$1,templateObject_2$o,templateObject_3$h,templateObject_4$9$1,templateObject_5$8$1;_styled(InsertFilesDialogHost).withConfig({displayName:"InsertImagesButton__Host",componentId:"sc-63tjy6-0"})(templateObject_1$t$1||(templateObject_1$t$1=__makeTemplateObject(["\n  cursor: pointer;\n"],["\n  cursor: pointer;\n"])));_styled(PrimaryButton).withConfig({displayName:"InsertImagesButton__StyledButton",componentId:"sc-63tjy6-1"})(templateObject_2$n||(templateObject_2$n=__makeTemplateObject(["\n  && {\n    display: block;\n    margin: 10px auto;\n    background-color: transparent;\n    color: inherit;\n    font-size: large;\n    line-height: 2em;\n    border: none;\n\n    &:hover {\n      background-color: transparent;\n      color: inherit;\n      border: 0;\n    }\n  }\n"],["\n  && {\n    display: block;\n    margin: 10px auto;\n    background-color: transparent;\n    color: inherit;\n    font-size: large;\n    line-height: 2em;\n    border: none;\n\n    &:hover {\n      background-color: transparent;\n      color: inherit;\n      border: 0;\n    }\n  }\n"])));_styled.div.withConfig({displayName:"InsertImagesButton__Text",componentId:"sc-63tjy6-2"})(templateObject_3$g||(templateObject_3$g=__makeTemplateObject(["\n  max-width: 100%;\n  font-size: large;\n"],["\n  max-width: 100%;\n  font-size: large;\n"])));var templateObject_1$t$1,templateObject_2$n,templateObject_3$g;_styled.div.withConfig({displayName:"InsertVideoDialog__VideoHost",componentId:"sc-12gp7sa-0"})(templateObject_1$s$1||(templateObject_1$s$1=__makeTemplateObject(["\n  width: 100%;\n  margin-top: ","px;\n\n  .video-view-container--youtube {\n    &:after {\n      padding-bottom: calc(9 / 16 * 100%);\n    }\n  }\n"],["\n  width: 100%;\n  margin-top: ","px;\n\n  .video-view-container--youtube {\n    &:after {\n      padding-bottom: calc(9 / 16 * 100%);\n    }\n  }\n"])),spacingS);_styled(TextField).withConfig({displayName:"InsertVideoDialog__StyledTextField",componentId:"sc-12gp7sa-1"})(templateObject_2$m||(templateObject_2$m=__makeTemplateObject(["\n  width: 510px;\n\n  label {\n    font-weight: normal;\n  }\n"],["\n  width: 510px;\n\n  label {\n    font-weight: normal;\n  }\n"])));var templateObject_1$s$1,templateObject_2$m;var DateTimePicker=function DateTimePicker(props){var timeField=useRef$1();var formatMessage=useIntl().formatMessage;var _a=useState$2(getTime(props.date)),time=_a[0],setTime=_a[1];var _b=useState$2(false),timeHasFocus=_b[0],setTimeHasFocus=_b[1];var _c=useState$2(null),timeErrorMessageResourceKey=_c[0],setTimeErrorMessageResourceKey=_c[1];var momentMonths=['January','February','March','April','May','June','July','August','September','October','November','December'];var momentWeekdays=['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];useEffect$1(function(){// do not update if the user is typing time
 if(!timeHasFocus){// We might not know that the time field has the focus after an onBlur from the date field.
 // In this case only update the _time_ component if it has changed. Which is not the case for changes
 // from the date field
@@ -131953,9 +131965,9 @@ var NewsDetailViewMetaInfo = function NewsDetailViewMetaInfo() {
 var DetailMetaInfo = _styled(ItemMetaInfo).withConfig({
   displayName: "NewsDetailViewMetaInfo__DetailMetaInfo",
   componentId: "sc-1v9a7tf-0"
-})(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$l(["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ", "px) {\n    font-size: 14px;\n  }\n"], ["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ", "px) {\n    font-size: 14px;\n  }\n"])), minScreenSize.small);
+})(templateObject_1$u || (templateObject_1$u = __makeTemplateObject$l(["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ", "px) {\n    font-size: 14px;\n  }\n"], ["\n  display: flex;\n  font-size: 12px;\n  margin-top: 12px;\n\n  @media (min-width: ", "px) {\n    font-size: 14px;\n  }\n"])), minScreenSize.small);
 
-var templateObject_1$t;
+var templateObject_1$u;
 
 var NewsItemContextProvider = function NewsItemContextProvider(_a) {
   var itemId = _a.itemId,
@@ -132061,16 +132073,16 @@ var NewsDetailMainContent = function NewsDetailMainContent(_a) {
 var Host$h = _styled.div.withConfig({
   displayName: "NewsDetail__Host",
   componentId: "sc-6rz5th-0"
-})(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$l([""], [""])));
 
-var templateObject_1$s;
+var templateObject_1$t;
 
-var anObject$2 = anObject$v;
+var anObject$3 = anObject$v;
 
 // `RegExp.prototype.flags` getter implementation
 // https://tc39.github.io/ecma262/#sec-get-regexp.prototype.flags
 var regexpFlags$1 = function () {
-  var that = anObject$2(this);
+  var that = anObject$3(this);
   var result = '';
   if (that.global) result += 'g';
   if (that.ignoreCase) result += 'i';
@@ -132325,12 +132337,12 @@ var fixRegexpWellKnownSymbolLogic = function (KEY, length, exec, sham) {
 };
 
 var toInteger$1 = toInteger$e;
-var requireObjectCoercible$2 = requireObjectCoercible$m;
+var requireObjectCoercible$3 = requireObjectCoercible$m;
 
 // `String.prototype.{ codePointAt, at }` methods implementation
 var createMethod$1 = function (CONVERT_TO_STRING) {
   return function ($this, pos) {
-    var S = String(requireObjectCoercible$2($this));
+    var S = String(requireObjectCoercible$3($this));
     var position = toInteger$1(pos);
     var size = S.length;
     var first, second;
@@ -132382,20 +132394,20 @@ var regexpExecAbstract = function (R, S) {
   return regexpExec.call(R, S);
 };
 
-var fixRegExpWellKnownSymbolLogic = fixRegexpWellKnownSymbolLogic;
-var anObject$1 = anObject$v;
+var fixRegExpWellKnownSymbolLogic$1 = fixRegexpWellKnownSymbolLogic;
+var anObject$2 = anObject$v;
 var toLength = toLength$l;
-var requireObjectCoercible$1 = requireObjectCoercible$m;
+var requireObjectCoercible$2 = requireObjectCoercible$m;
 var advanceStringIndex = advanceStringIndex$1;
-var regExpExec = regexpExecAbstract;
+var regExpExec$1 = regexpExecAbstract;
 
 // @@match logic
-fixRegExpWellKnownSymbolLogic('match', 1, function (MATCH, nativeMatch, maybeCallNative) {
+fixRegExpWellKnownSymbolLogic$1('match', 1, function (MATCH, nativeMatch, maybeCallNative) {
   return [
     // `String.prototype.match` method
     // https://tc39.github.io/ecma262/#sec-string.prototype.match
     function match(regexp) {
-      var O = requireObjectCoercible$1(this);
+      var O = requireObjectCoercible$2(this);
       var matcher = regexp == undefined ? undefined : regexp[MATCH];
       return matcher !== undefined ? matcher.call(regexp, O) : new RegExp(regexp)[MATCH](String(O));
     },
@@ -132405,17 +132417,17 @@ fixRegExpWellKnownSymbolLogic('match', 1, function (MATCH, nativeMatch, maybeCal
       var res = maybeCallNative(nativeMatch, regexp, this);
       if (res.done) return res.value;
 
-      var rx = anObject$1(regexp);
+      var rx = anObject$2(regexp);
       var S = String(this);
 
-      if (!rx.global) return regExpExec(rx, S);
+      if (!rx.global) return regExpExec$1(rx, S);
 
       var fullUnicode = rx.unicode;
       rx.lastIndex = 0;
       var A = [];
       var n = 0;
       var result;
-      while ((result = regExpExec(rx, S)) !== null) {
+      while ((result = regExpExec$1(rx, S)) !== null) {
         var matchStr = String(result[0]);
         A[n] = matchStr;
         if (matchStr === '') rx.lastIndex = advanceStringIndex(S, toLength(rx.lastIndex), fullUnicode);
@@ -132462,11 +132474,11 @@ var PageTableOfContents = function PageTableOfContents(_a) {
     }, void 0)]
   }, void 0);
 };
-var Host$g = _styled.div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$l(["\n  && {\n    margin-top: ", "px;\n  }\n"], ["\n  && {\n    margin-top: ", "px;\n  }\n"])), spacingXs);
+var Host$g = _styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$l(["\n  && {\n    margin-top: ", "px;\n  }\n"], ["\n  && {\n    margin-top: ", "px;\n  }\n"])), spacingXs);
 var PageTableOfContentsButton = _styled(IconButton$1)(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$l(["\n  && {\n    padding: 0;\n    margin: 0;\n    width: 22px;\n    height: 22px;\n\n    i {\n      font-size: 20px;\n      color: ", ";\n    }\n  }\n"], ["\n  && {\n    padding: 0;\n    margin: 0;\n    width: 22px;\n    height: 22px;\n\n    i {\n      font-size: 20px;\n      color: ", ";\n    }\n  }\n"])), function (p) {
   return p.theme.textColors.default;
 });
-var templateObject_1$r, templateObject_2$h;
+var templateObject_1$s, templateObject_2$h;
 
 var PageDetail = function PageDetail(props) {
   var routeMatch = useRouteMatch();
@@ -132560,7 +132572,7 @@ var PageDetailInternal = function PageDetailInternal(_a) {
 var Host$f = _styled.div.withConfig({
   displayName: "PageDetail__Host",
   componentId: "sc-22rpk8-0"
-})(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$l([""], [""])));
 
 var PageHeader = _styled.div.withConfig({
   displayName: "PageDetail__PageHeader",
@@ -132637,7 +132649,7 @@ var InlinePageListWrapper = function InlinePageListWrapper() {
   return jsx$1(InlinePageList, {}, void 0);
 };
 
-var templateObject_1$q, templateObject_2$g, templateObject_3$e, templateObject_4$c, templateObject_5$9;
+var templateObject_1$r, templateObject_2$g, templateObject_3$e, templateObject_4$c, templateObject_5$9;
 
 var EventDetail = function EventDetail(_a) {
   var itemId = _a.itemId,
@@ -132705,7 +132717,7 @@ var EventDetail = function EventDetail(_a) {
 var Host$e = _styled.div.withConfig({
   displayName: "EventDetail__Host",
   componentId: "sc-hrm4yl-0"
-})(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$l([""], [""])));
 
 var EventDateAndRecurrenceInfo = _styled.div.withConfig({
   displayName: "EventDetail__EventDateAndRecurrenceInfo",
@@ -132724,7 +132736,7 @@ var EventRecurrenceSeriesInfoLink = _styled.a.withConfig({
   return p.theme.textColors.default;
 }, spacingM);
 
-var templateObject_1$p, templateObject_2$f, templateObject_3$d, templateObject_4$b;
+var templateObject_1$q, templateObject_2$f, templateObject_3$d, templateObject_4$b;
 
 function useNewsItemClickHandler() {
   var user = useCurrentUserContext().user;
@@ -132931,7 +132943,7 @@ var NewsCompactCard = function NewsCompactCard(_a) {
 var Host$d = _styled.div.withConfig({
   displayName: "NewsCompactCard__Host",
   componentId: "sc-16ovog0-0"
-})(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$l(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: ", "px;\n  background-color: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: ", "px;\n  background-color: ", ";\n"])), BannerSize, function (p) {
+})(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$l(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: ", "px;\n  background-color: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: ", "px;\n  background-color: ", ";\n"])), BannerSize, function (p) {
   return p.theme.palette.white;
 });
 
@@ -133029,7 +133041,7 @@ var BannerHost = _styled.div.withConfig({
   });
 });
 
-var templateObject_1$o, templateObject_2$e, templateObject_3$c, templateObject_4$a, templateObject_5$8, templateObject_6$7, templateObject_7$4, templateObject_8$4, templateObject_9$2, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$1;
+var templateObject_1$p, templateObject_2$e, templateObject_3$c, templateObject_4$a, templateObject_5$8, templateObject_6$7, templateObject_7$4, templateObject_8$4, templateObject_9$2, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$1;
 
 var EmptyNewsList = function EmptyNewsList() {
   return jsxs(Host$c, {
@@ -133046,7 +133058,7 @@ var EmptyNewsList = function EmptyNewsList() {
 var Host$c = _styled.div.withConfig({
   displayName: "EmptyNewsList__Host",
   componentId: "sc-11ktr8s-0"
-})(templateObject_1$n || (templateObject_1$n = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin: auto 0;\n  padding: ", "px 0;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin: auto 0;\n  padding: ", "px 0;\n"])), spacingM);
+})(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin: auto 0;\n  padding: ", "px 0;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin: auto 0;\n  padding: ", "px 0;\n"])), spacingM);
 
 var StyledIcon$3 = _styled(Icon).withConfig({
   displayName: "EmptyNewsList__StyledIcon",
@@ -133058,7 +133070,7 @@ var Message = _styled.p.withConfig({
   componentId: "sc-11ktr8s-2"
 })(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$l(["\n  text-align: center;\n  padding: 0;\n  margin: 0;\n"], ["\n  text-align: center;\n  padding: 0;\n  margin: 0;\n"])));
 
-var templateObject_1$n, templateObject_2$d, templateObject_3$b;
+var templateObject_1$o, templateObject_2$d, templateObject_3$b;
 
 var ItemLayoutMode;
 
@@ -133225,7 +133237,7 @@ var NewsListInternal = function NewsListInternal(_a) {
 var Host$b = _styled.div.withConfig({
   displayName: "NewsList__Host",
   componentId: "sc-1d0bzx1-0"
-})(templateObject_1$m || (templateObject_1$m = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$n || (templateObject_1$n = __makeTemplateObject$l([""], [""])));
 
 var CompactList = _styled.ul.withConfig({
   displayName: "NewsList__CompactList",
@@ -133265,7 +133277,7 @@ var ErrorContainer$1 = _styled.p.withConfig({
   return p.theme.palette.red;
 }, spacingM);
 
-var templateObject_1$m, templateObject_2$c, templateObject_3$a, templateObject_4$9, templateObject_5$7, templateObject_6$6, templateObject_7$3, templateObject_8$3;
+var templateObject_1$n, templateObject_2$c, templateObject_3$a, templateObject_4$9, templateObject_5$7, templateObject_6$6, templateObject_7$3, templateObject_8$3;
 
 var ManageChannels = function ManageChannels(_a) {
   var className = _a.className;
@@ -133431,7 +133443,7 @@ var ManageChannels = function ManageChannels(_a) {
 var Host$a = _styled.div.withConfig({
   displayName: "ManageChannels__Host",
   componentId: "sc-yyoxfw-0"
-})(templateObject_1$l || (templateObject_1$l = __makeTemplateObject$l(["\n  padding: ", "px ", "px;\n"], ["\n  padding: ", "px ", "px;\n"])), spacingX, spacingM);
+})(templateObject_1$m || (templateObject_1$m = __makeTemplateObject$l(["\n  padding: ", "px ", "px;\n"], ["\n  padding: ", "px ", "px;\n"])), spacingX, spacingM);
 
 var Title$2 = _styled.h3.withConfig({
   displayName: "ManageChannels__Title",
@@ -133504,7 +133516,7 @@ var StyledIconButton = _styled(IconButton$1).withConfig({
   return p.theme.textColors.default;
 });
 
-var templateObject_1$l, templateObject_2$b, templateObject_3$9, templateObject_4$8, templateObject_5$6, templateObject_6$5, templateObject_7$2, templateObject_8$2;
+var templateObject_1$m, templateObject_2$b, templateObject_3$9, templateObject_4$8, templateObject_5$6, templateObject_6$5, templateObject_7$2, templateObject_8$2;
 
 var NewsGridCard = function NewsGridCard(_a) {
   var _b;
@@ -133612,7 +133624,7 @@ var NewsGridCard = function NewsGridCard(_a) {
   }
 };
 var Host$9 = _styled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  box-shadow: 1px 1px 4px grey;\n  box-sizing: border-box;\n  position: relative;\n\n  ", "\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  box-shadow: 1px 1px 4px grey;\n  box-sizing: border-box;\n  position: relative;\n\n  ", "\n"])), function (p) {
-  return p.showHighlight && css$2(templateObject_1$k || (templateObject_1$k = __makeTemplateObject$l(["\n      position: relative;\n      &::after {\n        ", ";\n      }\n    "], ["\n      position: relative;\n      &::after {\n        ", ";\n      }\n    "])), BannerHighlightStyle);
+  return p.showHighlight && css$2(templateObject_1$l || (templateObject_1$l = __makeTemplateObject$l(["\n      position: relative;\n      &::after {\n        ", ";\n      }\n    "], ["\n      position: relative;\n      &::after {\n        ", ";\n      }\n    "])), BannerHighlightStyle);
 });
 var BannerHighlightStyle = css$2(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject$l(["\n  content: '';\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  width: ", "px;\n  display: block;\n  background-color: ", ";\n"], ["\n  content: '';\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  width: ", "px;\n  display: block;\n  background-color: ", ";\n"])), spacingXs, function (p) {
   return p.theme.palette.accent;
@@ -133639,7 +133651,7 @@ var KeywordsWrapper = _styled.div(templateObject_14$1 || (templateObject_14$1 =
   return p.theme.palette.neutralTertiary;
 });
 var StyledChannels$1 = _styled(ChannelList$1)(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject$l(["\n  margin-top: ", "px;\n  margin-bottom: ", "px;\n"], ["\n  margin-top: ", "px;\n  margin-bottom: ", "px;\n"])), spacingS, spacingM);
-var templateObject_1$k, templateObject_2$a, templateObject_3$8, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$1, templateObject_8$1, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1;
+var templateObject_1$l, templateObject_2$a, templateObject_3$8, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$1, templateObject_8$1, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1;
 
 var ErrorContainer = function ErrorContainer() {
   return jsx$1(Host$8, {
@@ -133652,11 +133664,11 @@ var ErrorContainer = function ErrorContainer() {
 var Host$8 = _styled.p.withConfig({
   displayName: "ErrorContainer__Host",
   componentId: "sc-499uwc-0"
-})(templateObject_1$j || (templateObject_1$j = __makeTemplateObject$l(["\n  color: ", ";\n  padding: ", "px 0;\n  text-align: center;\n"], ["\n  color: ", ";\n  padding: ", "px 0;\n  text-align: center;\n"])), function (p) {
+})(templateObject_1$k || (templateObject_1$k = __makeTemplateObject$l(["\n  color: ", ";\n  padding: ", "px 0;\n  text-align: center;\n"], ["\n  color: ", ";\n  padding: ", "px 0;\n  text-align: center;\n"])), function (p) {
   return p.theme.palette.red;
 }, spacingM);
 
-var templateObject_1$j;
+var templateObject_1$k;
 
 var NewsGrid = function NewsGrid(_a) {
   var filter = _a.filter,
@@ -133744,7 +133756,7 @@ var NewsGrid = function NewsGrid(_a) {
 var Host$7 = _styled.div.withConfig({
   displayName: "NewsGrid__Host",
   componentId: "sc-8ugpfz-0"
-})(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$j || (templateObject_1$j = __makeTemplateObject$l([""], [""])));
 
 var Inner$1 = _styled.div.withConfig({
   displayName: "NewsGrid__Inner",
@@ -133760,7 +133772,7 @@ _styled(NewsGridCard).withConfig({
   return css$2(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$l(["\n    width: calc(100% / ", " - ", "px);\n  "], ["\n    width: calc(100% / ", " - ", "px);\n  "])), p.columnCount, spacingM);
 });
 
-var templateObject_1$i, templateObject_2$9, templateObject_3$7, templateObject_4$6, templateObject_5$4;
+var templateObject_1$j, templateObject_2$9, templateObject_3$7, templateObject_4$6, templateObject_5$4;
 
 var HeroSlide = function HeroSlide(_a) {
   var item = _a.item,
@@ -133905,7 +133917,7 @@ var Host$6 = _styled.div.withConfig({
   displayName: "HeroSlide__Host",
   componentId: "sc-3yofth-0"
 })(templateObject_7 || (templateObject_7 = __makeTemplateObject$l(["\n  position: relative;\n\n  ", "\n\n  ", "\n  \n    ", "\n  \n    ", "\n"], ["\n  position: relative;\n\n  ", "\n\n  ", "\n  \n    ", "\n  \n    ", "\n"])), function (p) {
-  return p.width ? css$2(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$l(["\n          width: ", ";\n        "], ["\n          width: ", ";\n        "])), p.width) : css$2(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject$l(["\n          width: 100%;\n        "], ["\n          width: 100%;\n        "])));
+  return p.width ? css$2(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$l(["\n          width: ", ";\n        "], ["\n          width: ", ";\n        "])), p.width) : css$2(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject$l(["\n          width: 100%;\n        "], ["\n          width: 100%;\n        "])));
 }, function (p) {
   return p.height ? css$2(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject$l(["\n          height: ", ";\n        "], ["\n          height: ", ";\n        "])), p.height) : css$2(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$l(["\n          height: 100%;\n        "], ["\n          height: 100%;\n        "])));
 }, function (p) {
@@ -134025,7 +134037,7 @@ var StyledDateTime = _styled(DateTime).withConfig({
   return p.color ? css$2(templateObject_31 || (templateObject_31 = __makeTemplateObject$l(["\n          color: ", ";\n        "], ["\n          color: ", ";\n        "])), p.color) : css$2(templateObject_32 || (templateObject_32 = __makeTemplateObject$l(["\n          color: ", ";\n        "], ["\n          color: ", ";\n        "])), p.theme.textColors.default);
 });
 
-var templateObject_1$h, templateObject_2$8, templateObject_3$6, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33;
+var templateObject_1$i, templateObject_2$8, templateObject_3$6, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33;
 
 var HeroPaging = function HeroPaging(_a) {
   var items = _a.items,
@@ -134146,7 +134158,7 @@ function getWrappedIndex(index, max) {
 var PagingHost = _styled.div.withConfig({
   displayName: "HeroPaging__PagingHost",
   componentId: "sc-1y3j8qb-0"
-})(templateObject_1$g || (templateObject_1$g = __makeTemplateObject$l(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
+})(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$l(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
 
 var Paging = _styled.ul.withConfig({
   displayName: "HeroPaging__Paging",
@@ -134172,7 +134184,7 @@ var PagingArrow = _styled(IconButton).withConfig({
   componentId: "sc-1y3j8qb-4"
 })(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject$l(["\n  position: absolute;\n  top: 50%;\n\n  && {\n    padding: 0;\n  }\n\n  &[data-paging-next] {\n    left: 100%;\n    transform: translate(-5px, -50%);\n  }\n\n  &[data-paging-back] {\n    right: 100%;\n    transform: translate(5px, -50%);\n  }\n"], ["\n  position: absolute;\n  top: 50%;\n\n  && {\n    padding: 0;\n  }\n\n  &[data-paging-next] {\n    left: 100%;\n    transform: translate(-5px, -50%);\n  }\n\n  &[data-paging-back] {\n    right: 100%;\n    transform: translate(5px, -50%);\n  }\n"])));
 
-var templateObject_1$g, templateObject_2$7, templateObject_3$5, templateObject_4$4, templateObject_5$2, templateObject_6$2;
+var templateObject_1$h, templateObject_2$7, templateObject_3$5, templateObject_4$4, templateObject_5$2, templateObject_6$2;
 
 var Hero = function Hero(_a) {
   var items = _a.items,
@@ -134239,9 +134251,9 @@ var Hero = function Hero(_a) {
 var StyledCarousel = _styled(Carousel).withConfig({
   displayName: "Hero__StyledCarousel",
   componentId: "sc-55ys37-0"
-})(templateObject_1$f || (templateObject_1$f = __makeTemplateObject$l(["\n  .slider-list {\n    height: 100% !important;\n\n    > li {\n      height: 100% !important;\n    }\n  }\n\n  .slider-control-bottomcenter {\n    left: ", "px !important;\n    right: ", "px !important;\n    transform: none !important;\n  }\n\n  .hero-paging--hidden {\n    display: none;\n  }\n"], ["\n  .slider-list {\n    height: 100% !important;\n\n    > li {\n      height: 100% !important;\n    }\n  }\n\n  .slider-control-bottomcenter {\n    left: ", "px !important;\n    right: ", "px !important;\n    transform: none !important;\n  }\n\n  .hero-paging--hidden {\n    display: none;\n  }\n"])), spacingL, spacingL);
+})(templateObject_1$g || (templateObject_1$g = __makeTemplateObject$l(["\n  .slider-list {\n    height: 100% !important;\n\n    > li {\n      height: 100% !important;\n    }\n  }\n\n  .slider-control-bottomcenter {\n    left: ", "px !important;\n    right: ", "px !important;\n    transform: none !important;\n  }\n\n  .hero-paging--hidden {\n    display: none;\n  }\n"], ["\n  .slider-list {\n    height: 100% !important;\n\n    > li {\n      height: 100% !important;\n    }\n  }\n\n  .slider-control-bottomcenter {\n    left: ", "px !important;\n    right: ", "px !important;\n    transform: none !important;\n  }\n\n  .hero-paging--hidden {\n    display: none;\n  }\n"])), spacingL, spacingL);
 
-var templateObject_1$f;
+var templateObject_1$g;
 
 var NewsHero = function NewsHero(_a) {
   var filter = _a.filter,
@@ -134394,15 +134406,15 @@ var NewsHero = function NewsHero(_a) {
 var StyledChannels = _styled(ChannelList$1).withConfig({
   displayName: "NewsHero__StyledChannels",
   componentId: "sc-i9ar0j-0"
-})(templateObject_1$e || (templateObject_1$e = __makeTemplateObject$l(["\n  [data-channels] {\n    justify-content: flex-end;\n  }\n"], ["\n  [data-channels] {\n    justify-content: flex-end;\n  }\n"])));
+})(templateObject_1$f || (templateObject_1$f = __makeTemplateObject$l(["\n  [data-channels] {\n    justify-content: flex-end;\n  }\n"], ["\n  [data-channels] {\n    justify-content: flex-end;\n  }\n"])));
 
-var templateObject_1$e;
+var templateObject_1$f;
 
 // a string of all valid unicode whitespaces
 // eslint-disable-next-line max-len
 var whitespaces$2 = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
 
-var requireObjectCoercible = requireObjectCoercible$m;
+var requireObjectCoercible$1 = requireObjectCoercible$m;
 var whitespaces$1 = whitespaces$2;
 
 var whitespace = '[' + whitespaces$1 + ']';
@@ -134412,7 +134424,7 @@ var rtrim = RegExp(whitespace + whitespace + '*$');
 // `String.prototype.{ trim, trimStart, trimEnd, trimLeft, trimRight }` methods implementation
 var createMethod = function (TYPE) {
   return function ($this) {
-    var string = String(requireObjectCoercible($this));
+    var string = String(requireObjectCoercible$1($this));
     if (TYPE & 1) string = string.replace(ltrim, '');
     if (TYPE & 2) string = string.replace(rtrim, '');
     return string;
@@ -134457,7 +134469,7 @@ $({ target: 'String', proto: true, forced: forcedStringTrimMethod('trim') }, {
 });
 
 var redefine = redefine$k.exports;
-var anObject = anObject$v;
+var anObject$1 = anObject$v;
 var fails = fails$w;
 var flags = regexpFlags$1;
 
@@ -134473,7 +134485,7 @@ var INCORRECT_NAME = nativeToString.name != TO_STRING;
 // https://tc39.github.io/ecma262/#sec-regexp.prototype.tostring
 if (NOT_GENERIC || INCORRECT_NAME) {
   redefine(RegExp.prototype, TO_STRING, function toString() {
-    var R = anObject(this);
+    var R = anObject$1(this);
     var p = String(R.source);
     var rf = R.flags;
     var f = String(rf === undefined && R instanceof RegExp && !('flags' in RegExpPrototype) ? flags.call(R) : rf);
@@ -134564,7 +134576,7 @@ var GroupsDropdown = function GroupsDropdown(_a) {
 var StyledDropdown = _styled(Dropdown).withConfig({
   displayName: "GroupsDropdown__StyledDropdown",
   componentId: "sc-cmsnyu-0"
-})(templateObject_1$d || (templateObject_1$d = __makeTemplateObject$l(["\n  ", "\n\n  margin-bottom: ", "px;\n  width: 200px;\n  min-width: 200px;\n  padding: 0;\n\n  &&&,\n  &&&:hover,\n  .ms-Dropdown,\n  .ms-Dropdown-title,\n  .ms-Dropdown-caretDownWrapper {\n    color: ", " !important;\n  }\n\n  .ms-Dropdown-title {\n    background-color: ", ";\n    i {\n      font-size: ", "px;\n      margin: 0 ", "px 0 0;\n    }\n  }\n\n  .ms-Dropdown-caretDownWrapper {\n    top: 0;\n\n    & > i {\n      color: ", " !important;\n    }\n  }\n"], ["\n  ", "\n\n  margin-bottom: ", "px;\n  width: 200px;\n  min-width: 200px;\n  padding: 0;\n\n  &&&,\n  &&&:hover,\n  .ms-Dropdown,\n  .ms-Dropdown-title,\n  .ms-Dropdown-caretDownWrapper {\n    color: ", " !important;\n  }\n\n  .ms-Dropdown-title {\n    background-color: ", ";\n    i {\n      font-size: ", "px;\n      margin: 0 ", "px 0 0;\n    }\n  }\n\n  .ms-Dropdown-caretDownWrapper {\n    top: 0;\n\n    & > i {\n      color: ", " !important;\n    }\n  }\n"])), ToolbarNoBorderDropdownStyles, spacingXs, function (p) {
+})(templateObject_1$e || (templateObject_1$e = __makeTemplateObject$l(["\n  ", "\n\n  margin-bottom: ", "px;\n  width: 200px;\n  min-width: 200px;\n  padding: 0;\n\n  &&&,\n  &&&:hover,\n  .ms-Dropdown,\n  .ms-Dropdown-title,\n  .ms-Dropdown-caretDownWrapper {\n    color: ", " !important;\n  }\n\n  .ms-Dropdown-title {\n    background-color: ", ";\n    i {\n      font-size: ", "px;\n      margin: 0 ", "px 0 0;\n    }\n  }\n\n  .ms-Dropdown-caretDownWrapper {\n    top: 0;\n\n    & > i {\n      color: ", " !important;\n    }\n  }\n"], ["\n  ", "\n\n  margin-bottom: ", "px;\n  width: 200px;\n  min-width: 200px;\n  padding: 0;\n\n  &&&,\n  &&&:hover,\n  .ms-Dropdown,\n  .ms-Dropdown-title,\n  .ms-Dropdown-caretDownWrapper {\n    color: ", " !important;\n  }\n\n  .ms-Dropdown-title {\n    background-color: ", ";\n    i {\n      font-size: ", "px;\n      margin: 0 ", "px 0 0;\n    }\n  }\n\n  .ms-Dropdown-caretDownWrapper {\n    top: 0;\n\n    & > i {\n      color: ", " !important;\n    }\n  }\n"])), ToolbarNoBorderDropdownStyles, spacingXs, function (p) {
   return p.theme.textColors.onAccent;
 }, function (p) {
   return p.theme.palette.accent;
@@ -134584,7 +134596,7 @@ var Title = _styled.div.withConfig({
 
 var GlobalDropdownStyles = createGlobalStyle(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject$l(["\n  .ms-Dropdown-item {\n    i {\n      width: auto;\n      margin: 0 ", "px 0 0;\n    }\n  }\n"], ["\n  .ms-Dropdown-item {\n    i {\n      width: auto;\n      margin: 0 ", "px 0 0;\n    }\n  }\n"])), spacingS);
 
-var templateObject_1$d, templateObject_2$6, templateObject_3$4, templateObject_4$3;
+var templateObject_1$e, templateObject_2$6, templateObject_3$4, templateObject_4$3;
 
 var TaskButton = function TaskButton(_a) {
   var count = _a.count,
@@ -134626,9 +134638,9 @@ var TaskButton = function TaskButton(_a) {
 var ToggleButton = _styled(DefaultButton).withConfig({
   displayName: "TaskButton__ToggleButton",
   componentId: "sc-8eylsw-0"
-})(templateObject_1$c || (templateObject_1$c = __makeTemplateObject$l(["\n  border-radius: 0;\n  padding: 0 ", "px;\n  margin-bottom: ", "px;\n  font-size: ", "px;\n  user-select: none;\n  height: ", "px;\n\n  display: flex;\n  align-items: center;\n\n  svg {\n    margin-right: ", "px;\n  }\n"], ["\n  border-radius: 0;\n  padding: 0 ", "px;\n  margin-bottom: ", "px;\n  font-size: ", "px;\n  user-select: none;\n  height: ", "px;\n\n  display: flex;\n  align-items: center;\n\n  svg {\n    margin-right: ", "px;\n  }\n"])), spacingS, spacingXs, fontSizeSmall, spacingL + 2, spacingS);
+})(templateObject_1$d || (templateObject_1$d = __makeTemplateObject$l(["\n  border-radius: 0;\n  padding: 0 ", "px;\n  margin-bottom: ", "px;\n  font-size: ", "px;\n  user-select: none;\n  height: ", "px;\n\n  display: flex;\n  align-items: center;\n\n  svg {\n    margin-right: ", "px;\n  }\n"], ["\n  border-radius: 0;\n  padding: 0 ", "px;\n  margin-bottom: ", "px;\n  font-size: ", "px;\n  user-select: none;\n  height: ", "px;\n\n  display: flex;\n  align-items: center;\n\n  svg {\n    margin-right: ", "px;\n  }\n"])), spacingS, spacingXs, fontSizeSmall, spacingL + 2, spacingS);
 
-var templateObject_1$c;
+var templateObject_1$d;
 
 var TaskButtons = function TaskButtons(_a) {
   var type = _a.type,
@@ -134694,9 +134706,9 @@ var TaskButtons = function TaskButtons(_a) {
 var Host$5 = _styled.div.withConfig({
   displayName: "TaskButtons__Host",
   componentId: "sc-sw0zei-0"
-})(templateObject_1$b || (templateObject_1$b = __makeTemplateObject$l(["\n  display: flex;\n  flex-wrap: wrap;\n\n  button {\n    border: 1px solid #808080;\n\n    &:not(:first-child) {\n      border-left: none;\n    }\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n\n  button {\n    border: 1px solid #808080;\n\n    &:not(:first-child) {\n      border-left: none;\n    }\n  }\n"])));
+})(templateObject_1$c || (templateObject_1$c = __makeTemplateObject$l(["\n  display: flex;\n  flex-wrap: wrap;\n\n  button {\n    border: 1px solid #808080;\n\n    &:not(:first-child) {\n      border-left: none;\n    }\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n\n  button {\n    border: 1px solid #808080;\n\n    &:not(:first-child) {\n      border-left: none;\n    }\n  }\n"])));
 
-var templateObject_1$b;
+var templateObject_1$c;
 
 var NewArticleButton = function NewArticleButton(_a) {
   var groupId = _a.groupId,
@@ -134838,7 +134850,7 @@ var NewsEditorDashboard = function NewsEditorDashboard(_a) {
     }).length;
   }
 };
-var MessageBarStyle = createGlobalStyle(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$l(["\n  .ms-MessageBar {\n    margin-bottom: ", "px;\n  }\n  .ms-MessageBar-text {\n    flex: 1 1 0%;\n  }\n"], ["\n  .ms-MessageBar {\n    margin-bottom: ", "px;\n  }\n  .ms-MessageBar-text {\n    flex: 1 1 0%;\n  }\n"])), spacingXs);
+var MessageBarStyle = createGlobalStyle(templateObject_1$b || (templateObject_1$b = __makeTemplateObject$l(["\n  .ms-MessageBar {\n    margin-bottom: ", "px;\n  }\n  .ms-MessageBar-text {\n    flex: 1 1 0%;\n  }\n"], ["\n  .ms-MessageBar {\n    margin-bottom: ", "px;\n  }\n  .ms-MessageBar-text {\n    flex: 1 1 0%;\n  }\n"])), spacingXs);
 
 var StyledEditorListItem = _styled(EditorListItem).withConfig({
   displayName: "NewsEditorDashboard__StyledEditorListItem",
@@ -134865,7 +134877,7 @@ var StyledNewArticleButton = _styled(NewArticleButton).withConfig({
   componentId: "sc-vv9dzu-4"
 })(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n  align-self: flex-start;\n"], ["\n  margin-bottom: ", "px;\n  align-self: flex-start;\n"])), spacingXs);
 
-var templateObject_1$a, templateObject_2$5, templateObject_3$3, templateObject_4$2, templateObject_5$1, templateObject_6$1;
+var templateObject_1$b, templateObject_2$5, templateObject_3$3, templateObject_4$2, templateObject_5$1, templateObject_6$1;
 
 // NOTE: This component exists in this project and not in the ui/common/toolbar because it uses DetailViewContext placed in feature/content/
 // Also a generic component `ToolbarLanguageSelector` in ui/common/toolbar complicates the flow and requires some code duplication
@@ -134906,9 +134918,9 @@ var ToolbarNewsLanguageSelector = function ToolbarNewsLanguageSelector(_a) {
 var LanguageMenuButton = _styled(LanguageSelector).withConfig({
   displayName: "ToolbarNewsLanguageSelector__LanguageMenuButton",
   componentId: "sc-1xe5l19-0"
-})(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject$l(["\n  && {\n    i {\n      font-size: ", "px;\n    }\n  }\n"], ["\n  && {\n    i {\n      font-size: ", "px;\n    }\n  }\n"])), fontSizeNormal);
+})(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$l(["\n  && {\n    i {\n      font-size: ", "px;\n    }\n  }\n"], ["\n  && {\n    i {\n      font-size: ", "px;\n    }\n  }\n"])), fontSizeNormal);
 
-var templateObject_1$9;
+var templateObject_1$a;
 
 var ToolbarManageNewsItemButton = function ToolbarManageNewsItemButton(_a) {
   var onClick = _a.onClick;
@@ -135034,9 +135046,9 @@ var NewsDetailPreviewInternal = function NewsDetailPreviewInternal() {
 var Host$4 = _styled.div.withConfig({
   displayName: "NewsDetailPreview__Host",
   componentId: "sc-17gmqax-0"
-})(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$l([""], [""])));
+})(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject$l([""], [""])));
 
-var templateObject_1$8;
+var templateObject_1$9;
 
 var FilterContext = /*#__PURE__*/createContext(null);
 var FilterContextProvider = function FilterContextProvider(_a) {
@@ -135070,9 +135082,9 @@ var ToolbarFilterPanel = function ToolbarFilterPanel(_a) {
 var Host$3 = _styled.div.withConfig({
   displayName: "ToolbarFilterPanel__Host",
   componentId: "sc-118p488-0"
-})(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject$l(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
+})(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$l(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
 
-var templateObject_1$7;
+var templateObject_1$8;
 
 var ToolbarFilterCalloutButton = function ToolbarFilterCalloutButton(_a) {
   var buttonText = _a.buttonText,
@@ -135131,7 +135143,7 @@ var ToolbarFilterCalloutButton = function ToolbarFilterCalloutButton(_a) {
 var Host$2 = _styled.div.withConfig({
   displayName: "ToolbarFilterCalloutButton__Host",
   componentId: "sc-fu36ma-0"
-})(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+})(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
 
 var Button = _styled(ActionButton).withConfig({
   displayName: "ToolbarFilterCalloutButton__Button",
@@ -135145,7 +135157,7 @@ var ClearFilterButton = _styled(DefaultButton).withConfig({
   componentId: "sc-fu36ma-2"
 })(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject$l(["\n  margin-left: auto;\n\n  .ms-Button-label {\n    font-weight: normal;\n  }\n"], ["\n  margin-left: auto;\n\n  .ms-Button-label {\n    font-weight: normal;\n  }\n"])));
 
-var templateObject_1$6, templateObject_2$4, templateObject_3$2, templateObject_4$1;
+var templateObject_1$7, templateObject_2$4, templateObject_3$2, templateObject_4$1;
 
 var FilterLogicalOperators = function FilterLogicalOperators(_a) {
   var onChange = _a.onChange,
@@ -135192,14 +135204,14 @@ var FilterLogicalOperators = function FilterLogicalOperators(_a) {
 var StyledChoiceGroup = _styled(ChoiceGroup).withConfig({
   displayName: "FilterLogicalOperators__StyledChoiceGroup",
   componentId: "sc-10bpjo8-0"
-})(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n\n  .ms-ChoiceField {\n    margin-right: ", "px;\n  }\n"], ["\n  margin-bottom: ", "px;\n\n  .ms-ChoiceField {\n    margin-right: ", "px;\n  }\n"])), spacingM, spacingM);
+})(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n\n  .ms-ChoiceField {\n    margin-right: ", "px;\n  }\n"], ["\n  margin-bottom: ", "px;\n\n  .ms-ChoiceField {\n    margin-right: ", "px;\n  }\n"])), spacingM, spacingM);
 
 var Operator = _styled.span.withConfig({
   displayName: "FilterLogicalOperators__Operator",
   componentId: "sc-10bpjo8-1"
 })(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$l(["\n  text-transform: capitalize;\n"], ["\n  text-transform: capitalize;\n"])));
 
-var templateObject_1$5, templateObject_2$3;
+var templateObject_1$6, templateObject_2$3;
 
 var ChannelFilter = function ChannelFilter(_a) {
   var _b, _c, _d, _f, _g, _h;
@@ -135350,7 +135362,7 @@ var visibleChannels = 8;
 var Channels = _styled.div.withConfig({
   displayName: "ChannelFilter__Channels",
   componentId: "sc-1ju8xwz-0"
-})(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n  max-height: ", "px;\n  overflow-y: auto;\n"], ["\n  margin-bottom: ", "px;\n  max-height: ", "px;\n  overflow-y: auto;\n"])), spacingM, channelRowHeight * visibleChannels);
+})(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n  max-height: ", "px;\n  overflow-y: auto;\n"], ["\n  margin-bottom: ", "px;\n  max-height: ", "px;\n  overflow-y: auto;\n"])), spacingM, channelRowHeight * visibleChannels);
 
 var StyledCheckbox$1 = _styled(Checkbox).withConfig({
   displayName: "ChannelFilter__StyledCheckbox",
@@ -135362,7 +135374,7 @@ var StyledTextField$1 = _styled(TextField).withConfig({
   componentId: "sc-1ju8xwz-2"
 })(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject$l(["\n  padding-bottom: ", "px;\n"], ["\n  padding-bottom: ", "px;\n"])), spacingM);
 
-var templateObject_1$4, templateObject_2$2, templateObject_3$1;
+var templateObject_1$5, templateObject_2$2, templateObject_3$1;
 
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -138283,7 +138295,7 @@ var DateShortcutButton = function DateShortcutButton(_a) {
 var StyledDateTimePicker = _styled(DateTimePicker).withConfig({
   displayName: "PublishingDateFilter__StyledDateTimePicker",
   componentId: "sc-zv88cu-0"
-})(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n"], ["\n  margin-bottom: ", "px;\n"])), spacingS);
+})(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n"], ["\n  margin-bottom: ", "px;\n"])), spacingS);
 
 var DateShortcuts = _styled.div.withConfig({
   displayName: "PublishingDateFilter__DateShortcuts",
@@ -138292,7 +138304,7 @@ var DateShortcuts = _styled.div.withConfig({
   return p.theme.palette.themePrimary;
 });
 
-var templateObject_1$3, templateObject_2$1;
+var templateObject_1$4, templateObject_2$1;
 
 var ClearAllFiltersButton = function ClearAllFiltersButton(_a) {
   var onClick = _a.onClick;
@@ -138375,9 +138387,9 @@ var KeywordsFilter = function KeywordsFilter() {
 var StyledKeywordPicker = _styled(KeywordPicker).withConfig({
   displayName: "KeywordsFilter__StyledKeywordPicker",
   componentId: "sc-1aoeg5i-0"
-})(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n  overflow: hidden;\n\n  .keyword-picker-tree {\n    max-height: 256px;\n    overflow-y: auto;\n\n    div:last-child {\n      margin-bottom: 0;\n    }\n  }\n"], ["\n  margin-bottom: ", "px;\n  overflow: hidden;\n\n  .keyword-picker-tree {\n    max-height: 256px;\n    overflow-y: auto;\n\n    div:last-child {\n      margin-bottom: 0;\n    }\n  }\n"])), spacingM);
+})(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$l(["\n  margin-bottom: ", "px;\n  overflow: hidden;\n\n  .keyword-picker-tree {\n    max-height: 256px;\n    overflow-y: auto;\n\n    div:last-child {\n      margin-bottom: 0;\n    }\n  }\n"], ["\n  margin-bottom: ", "px;\n  overflow: hidden;\n\n  .keyword-picker-tree {\n    max-height: 256px;\n    overflow-y: auto;\n\n    div:last-child {\n      margin-bottom: 0;\n    }\n  }\n"])), spacingM);
 
-var templateObject_1$2;
+var templateObject_1$3;
 
 var EmptyFilterSearchResult = function EmptyFilterSearchResult() {
   return jsxs(Host$1, {
@@ -138390,8 +138402,8 @@ var EmptyFilterSearchResult = function EmptyFilterSearchResult() {
     }, void 0)]
   }, void 0);
 };
-var Host$1 = _styled.div(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject$l(["\n  text-align: center;\n  i {\n    font-size: ", "px;\n  }\n"], ["\n  text-align: center;\n  i {\n    font-size: ", "px;\n  }\n"])), fontSizeMedium);
-var templateObject_1$1;
+var Host$1 = _styled.div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject$l(["\n  text-align: center;\n  i {\n    font-size: ", "px;\n  }\n"], ["\n  text-align: center;\n  i {\n    font-size: ", "px;\n  }\n"])), fontSizeMedium);
+var templateObject_1$2;
 
 var AuthorFilter = function AuthorFilter() {
   var _a;
@@ -138406,7 +138418,7 @@ var AuthorFilter = function AuthorFilter() {
       searchText = _c[0],
       setSearchText = _c[1];
 
-  var debouncedSearchText = useDebounce(searchText.toLowerCase(), 500)[0];
+  var debouncedSearchText = useDebounce$2(searchText.toLowerCase(), 500)[0];
   var searchAccounts = useAccountApi().searchAccounts;
   var showError = useNotificationContext().showError;
   var authorsFromFilter = (_a = filter === null || filter === void 0 ? void 0 : filter.authors) !== null && _a !== void 0 ? _a : [];
@@ -138597,7 +138609,7 @@ var UserShimmer = function UserShimmer() {
 var Host = _styled.div.withConfig({
   displayName: "AuthorFilter__Host",
   componentId: "sc-cnx0p9-0"
-})(templateObject_1 || (templateObject_1 = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+})(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject$l(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
 
 var rowHeight = 40;
 var visibleUsers = 9;
@@ -138627,6 +138639,326 @@ var StyledAvatar = _styled(Avatar).withConfig({
   componentId: "sc-cnx0p9-5"
 })(templateObject_6 || (templateObject_6 = __makeTemplateObject$l(["\n  .ms-Persona-primaryText {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 105px;\n  }\n"], ["\n  .ms-Persona-primaryText {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 105px;\n  }\n"])));
 
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+
+// `SameValue` abstract operation
+// https://tc39.github.io/ecma262/#sec-samevalue
+var sameValue$1 = Object.is || function is(x, y) {
+  // eslint-disable-next-line no-self-compare
+  return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
+};
+
+var fixRegExpWellKnownSymbolLogic = fixRegexpWellKnownSymbolLogic;
+var anObject = anObject$v;
+var requireObjectCoercible = requireObjectCoercible$m;
+var sameValue = sameValue$1;
+var regExpExec = regexpExecAbstract;
+
+// @@search logic
+fixRegExpWellKnownSymbolLogic('search', 1, function (SEARCH, nativeSearch, maybeCallNative) {
+  return [
+    // `String.prototype.search` method
+    // https://tc39.github.io/ecma262/#sec-string.prototype.search
+    function search(regexp) {
+      var O = requireObjectCoercible(this);
+      var searcher = regexp == undefined ? undefined : regexp[SEARCH];
+      return searcher !== undefined ? searcher.call(regexp, O) : new RegExp(regexp)[SEARCH](String(O));
+    },
+    // `RegExp.prototype[@@search]` method
+    // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@search
+    function (regexp) {
+      var res = maybeCallNative(nativeSearch, regexp, this);
+      if (res.done) return res.value;
+
+      var rx = anObject(regexp);
+      var S = String(this);
+
+      var previousLastIndex = rx.lastIndex;
+      if (!sameValue(previousLastIndex, 0)) rx.lastIndex = 0;
+      var result = regExpExec(rx, S);
+      if (!sameValue(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
+      return result === null ? -1 : result.index;
+    }
+  ];
+});
+
+var lib = {};
+
+var useDebounce$1 = {};
+
+var useDebouncedCallback$2 = {};
+
+Object.defineProperty(useDebouncedCallback$2, "__esModule", { value: true });
+var react_1$1 = React__default;
+function useDebouncedCallback$1(callback, delay, options) {
+    if (options === void 0) { options = {}; }
+    var maxWait = options.maxWait;
+    var maxWaitHandler = react_1$1.useRef(null);
+    var maxWaitArgs = react_1$1.useRef([]);
+    var leading = options.leading;
+    var trailing = options.trailing === undefined ? true : options.trailing;
+    var leadingCall = react_1$1.useRef(false);
+    var functionTimeoutHandler = react_1$1.useRef(null);
+    var isComponentUnmounted = react_1$1.useRef(false);
+    var debouncedFunction = react_1$1.useRef(callback);
+    debouncedFunction.current = callback;
+    var cancelDebouncedCallback = react_1$1.useCallback(function () {
+        clearTimeout(functionTimeoutHandler.current);
+        clearTimeout(maxWaitHandler.current);
+        maxWaitHandler.current = null;
+        maxWaitArgs.current = [];
+        functionTimeoutHandler.current = null;
+        leadingCall.current = false;
+    }, []);
+    react_1$1.useEffect(function () { return function () {
+        // we use flag, as we allow to call callPending outside the hook
+        isComponentUnmounted.current = true;
+    }; }, []);
+    var debouncedCallback = react_1$1.useCallback(function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        maxWaitArgs.current = args;
+        clearTimeout(functionTimeoutHandler.current);
+        if (leadingCall.current) {
+            leadingCall.current = false;
+        }
+        if (!functionTimeoutHandler.current && leading && !leadingCall.current) {
+            debouncedFunction.current.apply(debouncedFunction, args);
+            leadingCall.current = true;
+        }
+        functionTimeoutHandler.current = setTimeout(function () {
+            var shouldCallFunction = true;
+            if (leading && leadingCall.current) {
+                shouldCallFunction = false;
+            }
+            cancelDebouncedCallback();
+            if (!isComponentUnmounted.current && trailing && shouldCallFunction) {
+                debouncedFunction.current.apply(debouncedFunction, args);
+            }
+        }, delay);
+        if (maxWait && !maxWaitHandler.current && trailing) {
+            maxWaitHandler.current = setTimeout(function () {
+                var args = maxWaitArgs.current;
+                cancelDebouncedCallback();
+                if (!isComponentUnmounted.current) {
+                    debouncedFunction.current.apply(null, args);
+                }
+            }, maxWait);
+        }
+    }, [maxWait, delay, cancelDebouncedCallback, leading, trailing]);
+    var callPending = react_1$1.useCallback(function () {
+        // Call pending callback only if we have anything in our queue
+        if (!functionTimeoutHandler.current) {
+            return;
+        }
+        debouncedFunction.current.apply(null, maxWaitArgs.current);
+        cancelDebouncedCallback();
+    }, [cancelDebouncedCallback]);
+    // At the moment, we use 3 args array so that we save backward compatibility
+    return [debouncedCallback, cancelDebouncedCallback, callPending];
+}
+useDebouncedCallback$2.default = useDebouncedCallback$1;
+
+Object.defineProperty(useDebounce$1, "__esModule", { value: true });
+var react_1 = React__default;
+var useDebouncedCallback_1$1 = useDebouncedCallback$2;
+function valueEquality(left, right) {
+    return left === right;
+}
+function useDebounce(value, delay, options) {
+    var eq = options && options.equalityFn ? options.equalityFn : valueEquality;
+    var _a = react_1.useState(value), state = _a[0], dispatch = _a[1];
+    var _b = useDebouncedCallback_1$1.default(react_1.useCallback(function (value) { return dispatch(value); }, []), delay, options), callback = _b[0], cancel = _b[1], callPending = _b[2];
+    var previousValue = react_1.useRef(value);
+    react_1.useEffect(function () {
+        // We need to use this condition otherwise we will run debounce timer for the first render (including maxWait option)
+        if (!eq(previousValue.current, value)) {
+            callback(value);
+            previousValue.current = value;
+        }
+    }, [value, callback, eq]);
+    return [state, cancel, callPending];
+}
+useDebounce$1.default = useDebounce;
+
+Object.defineProperty(lib, "__esModule", { value: true });
+var useDebounce_1 = useDebounce$1;
+lib.useDebounce = useDebounce_1.default;
+var useDebouncedCallback_1 = useDebouncedCallback$2;
+var useDebouncedCallback = lib.useDebouncedCallback = useDebouncedCallback_1.default;
+
+var VerticalFilterPanel = function VerticalFilterPanel(_a) {
+  var filter = _a.filter,
+      onChange = _a.onChange,
+      onDismiss = _a.onDismiss,
+      className = _a.className,
+      children = _a.children;
+  return jsx$1(FilterContextProvider, __assign$g({
+    filter: filter,
+    onChange: onChange
+  }, {
+    children: jsx$1(VerticalFilterPanelInternal, __assign$g({
+      className: className,
+      onDismiss: onDismiss
+    }, {
+      children: children
+    }), void 0)
+  }), void 0);
+};
+
+var VerticalFilterPanelInternal = function VerticalFilterPanelInternal(_a) {
+  var onDismiss = _a.onDismiss,
+      className = _a.className,
+      children = _a.children;
+  var formatMessage = useIntl().formatMessage;
+
+  var _b = useContext(FilterContext),
+      filter = _b.filter,
+      onChange = _b.onChange;
+
+  var _c = useState$2((filter === null || filter === void 0 ? void 0 : filter.search) || ''),
+      searchText = _c[0],
+      setSearchText = _c[1];
+
+  var _d = useDebouncedCallback(onChange, 500),
+      debouncedOnChange = _d[0],
+      cancelDebounce = _d[1];
+
+  var textColors = useContext(ThemeContext$1).theme.textColors;
+  useEffectOnUpdate(function () {
+    if ((filter === null || filter === void 0 ? void 0 : filter.search) !== searchText) {
+      setSearchText((filter === null || filter === void 0 ? void 0 : filter.search) || '');
+    }
+  }, [filter === null || filter === void 0 ? void 0 : filter.search]);
+  return jsxs("div", __assign$g({
+    className: className
+  }, {
+    children: [jsx$1(SearchBox$1, {
+      placeholder: formatMessage({
+        id: 'Generic.search'
+      }),
+      value: searchText,
+      onChange: function (_, text) {
+        setSearchText(text);
+        debouncedOnChange({
+          search: text
+        });
+      },
+      onSearch: function (text) {
+        cancelDebounce();
+        onChange({
+          search: text
+        });
+      },
+      iconProps: {
+        style: {
+          color: textColors.default
+        }
+      }
+    }, void 0), children, jsxs(ButtonsHost, {
+      children: [jsx$1(DefaultButton, {
+        iconProps: {
+          iconName: 'ClearFilter'
+        },
+        text: formatMessage({
+          id: 'FilterPanel.clearFilterText'
+        }),
+        onClick: function () {
+          setSearchText('');
+          onChange(null);
+        }
+      }, void 0), jsx$1(DefaultButton, {
+        text: formatMessage({
+          id: 'Generic.close'
+        }),
+        onClick: onDismiss
+      }, void 0)]
+    }, void 0)]
+  }), void 0);
+};
+
+var ButtonsHost = _styled.div.withConfig({
+  displayName: "VerticalFilterPanel__ButtonsHost",
+  componentId: "sc-12j7kak-0"
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject$l(["\n  display: flex;\n  justify-content: flex-end;\n  margin-top: 20px;\n\n  & > *:not(:first-child) {\n    margin-left: 20px;\n  }\n"], ["\n  display: flex;\n  justify-content: flex-end;\n  margin-top: 20px;\n\n  & > *:not(:first-child) {\n    margin-left: 20px;\n  }\n"])));
+
+var templateObject_1;
+
+var ToolbarFilterModal = function ToolbarFilterModal(_a) {
+  var filter = _a.filter,
+      onChange = _a.onChange,
+      isOpen = _a.isOpen,
+      onDismiss = _a.onDismiss,
+      children = _a.children;
+  var formatMessage = useIntl().formatMessage;
+  return jsx$1(Dialog, __assign$g({
+    hidden: !isOpen,
+    onDismiss: onDismiss,
+    modalProps: {
+      isBlocking: true
+    },
+    dialogContentProps: {
+      title: formatMessage({
+        id: 'FilterPanel.filterModal.title'
+      }),
+      showCloseButton: false
+    },
+    styles: {
+      main: {
+        minWidth: '340px !important'
+      }
+    }
+  }, {
+    children: jsx$1(VerticalFilterPanel, __assign$g({
+      filter: filter,
+      onChange: onChange,
+      onDismiss: onDismiss
+    }, {
+      children: children
+    }), void 0)
+  }), void 0);
+};
+
+var ToolbarFilterModalButton = function ToolbarFilterModalButton(_a) {
+  var filter = _a.filter,
+      onChange = _a.onChange,
+      children = _a.children;
+
+  var _b = useState$2(false),
+      isOpen = _b[0],
+      setIsOpen = _b[1];
+
+  return jsxs(Fragment, {
+    children: [jsx$1(ActionButton, {
+      iconProps: {
+        iconName: hasFilter() ? 'FilterSolid' : 'Filter'
+      },
+      onClick: function () {
+        return setIsOpen(true);
+      }
+    }, void 0), jsx$1(ToolbarFilterModal, __assign$g({
+      isOpen: isOpen,
+      onDismiss: function () {
+        return setIsOpen(false);
+      },
+      filter: filter,
+      onChange: onChange
+    }, {
+      children: children
+    }), void 0)]
+  }, void 0);
+
+  function hasFilter() {
+    if (filter == null) {
+      return false;
+    }
+
+    return Object.values(filter).filter(function (f) {
+      return f != null && f !== '';
+    }).length > 0;
+  }
+};
 
-export { Avatar as A, PublishingDateFilter as B, ChannelFilter as C, ClearAllFiltersButton as D, EventDetail as E, AuthorFilter as F, ItemLayoutMode as I, KeywordsFilter as K, ManageChannels as M, NewsDetail as N, PropTypes$2 as P, ReachContextProvider as R, ThemeContext$1 as T, UserDetails as U, _assertThisInitialized$b as _, commonjsGlobal$7 as a, _setPrototypeOf$6 as b, commonjsRequire as c, _defineProperty$p as d, _extends$9 as e, minScreenSize as f, PageDetail as g, NewsList as h, NewsGrid as i, useCurrentUser as j, NewsHero as k, NewsEditorDashboard as l, moment$1 as m, Toolbar$1 as n, ToolbarIconButton as o, ToolbarChannelSelector as p, ToolbarMarkAllEventsAsReadButton as q, ToolbarMarkAllNewsAsReadButton as r, ToolbarCloseButton as s, NewsItemContextProvider as t, useWindowSize$2 as u, ToolbarNewsLanguageSelector as v, ToolbarManageNewsItemButton as w, NewsDetailPreview as x, NewsItemPreviewContextProvider as y, ToolbarFilterPanel as z };
+export { Avatar as A, ToolbarFilterModal as B, ToolbarFilterModalButton as C, ChannelFilter as D, EventDetail as E, PublishingDateFilter as F, ClearAllFiltersButton as G, AuthorFilter as H, ItemLayoutMode as I, KeywordsFilter as K, ManageChannels as M, NewsDetail as N, PropTypes$2 as P, ReachContextProvider as R, ThemeContext$1 as T, UserDetails as U, VerticalFilterPanel as V, _assertThisInitialized$b as _, commonjsGlobal$7 as a, _setPrototypeOf$6 as b, commonjsRequire as c, _defineProperty$p as d, _extends$9 as e, minScreenSize as f, PageDetail as g, NewsList as h, NewsGrid as i, useCurrentUser as j, NewsHero as k, NewsEditorDashboard as l, moment$1 as m, Toolbar$1 as n, ToolbarIconButton as o, ToolbarChannelSelector as p, ToolbarMarkAllEventsAsReadButton as q, ToolbarMarkAllNewsAsReadButton as r, ToolbarCloseButton as s, NewsItemContextProvider as t, useWindowSize$2 as u, ToolbarNewsLanguageSelector as v, ToolbarManageNewsItemButton as w, NewsDetailPreview as x, NewsItemPreviewContextProvider as y, ToolbarFilterPanel as z };