@fluentui/react-button 0.20.1 → 0.20.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +16 -1
- package/CHANGELOG.md +11 -2
- package/dist/demo-app.js +5 -5
- package/dist-storybook/iframe.html +1 -1
- package/dist-storybook/{main.7da4035404597c1a9885.bundle.js → main.6d4ff50b2d1a618817d2.bundle.js} +440 -138
- package/dist-storybook/main.6d4ff50b2d1a618817d2.bundle.js.map +1 -0
- package/dist-storybook/{runtime~main.7da4035404597c1a9885.bundle.js → runtime~main.6d4ff50b2d1a618817d2.bundle.js} +1 -1
- package/dist-storybook/{runtime~main.7da4035404597c1a9885.bundle.js.map → runtime~main.6d4ff50b2d1a618817d2.bundle.js.map} +1 -1
- package/dist-storybook/{vendors~main.7da4035404597c1a9885.bundle.js → vendors~main.6d4ff50b2d1a618817d2.bundle.js} +29 -29
- package/dist-storybook/{vendors~main.7da4035404597c1a9885.bundle.js.map → vendors~main.6d4ff50b2d1a618817d2.bundle.js.map} +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/lib-amd/version.js +1 -1
- package/lib-amd/version.js.map +1 -1
- package/lib-commonjs/version.js +1 -1
- package/lib-commonjs/version.js.map +1 -1
- package/package.json +8 -8
- package/dist-storybook/main.7da4035404597c1a9885.bundle.js.map +0 -1
package/dist-storybook/{main.7da4035404597c1a9885.bundle.js → main.6d4ff50b2d1a618817d2.bundle.js}
RENAMED
@@ -207,8 +207,7 @@ tslib_1.__exportStar(__webpack_require__(694), exports);
|
|
207
207
|
/* 27 */,
|
208
208
|
/* 28 */,
|
209
209
|
/* 29 */,
|
210
|
-
/* 30
|
211
|
-
/* 31 */
|
210
|
+
/* 30 */
|
212
211
|
/***/ (function(module, exports, __webpack_require__) {
|
213
212
|
|
214
213
|
"use strict";
|
@@ -228,7 +227,9 @@ exports.fontFamily =
|
|
228
227
|
'Segoe UI, "Segoe UI Web (West European)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue",sans-serif';
|
229
228
|
exports.fontWeightRegular = '400';
|
230
229
|
exports.fontWeightBold = '700';
|
230
|
+
exports.choiceGroupDimensions = '18px';
|
231
231
|
exports.inputControlHeight = '24px';
|
232
|
+
exports.inputControlPadding = '12px';
|
232
233
|
exports.inputControlHeightInner = '20px';
|
233
234
|
exports.textAlignCenter = 'center';
|
234
235
|
exports.transparent = 'transparent';
|
@@ -237,6 +238,7 @@ exports.MediumScreenSelector = Styling_1.getScreenSelector(Styling_1.ScreenWidth
|
|
237
238
|
|
238
239
|
|
239
240
|
/***/ }),
|
241
|
+
/* 31 */,
|
240
242
|
/* 32 */,
|
241
243
|
/* 33 */,
|
242
244
|
/* 34 */,
|
@@ -637,7 +639,7 @@ exports.DEFAULT_ROW_HEIGHTS = {
|
|
637
639
|
var values = tslib_1.__assign(tslib_1.__assign({}, exports.DEFAULT_ROW_HEIGHTS), { rowVerticalPadding: 11, compactRowVerticalPadding: 6 });
|
638
640
|
exports.getDetailsRowStyles = function (props) {
|
639
641
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
640
|
-
var theme = props.theme, isSelected = props.isSelected, canSelect = props.canSelect, droppingClassName = props.droppingClassName, anySelected = props.anySelected, isCheckVisible = props.isCheckVisible, checkboxCellClassName = props.checkboxCellClassName, compact = props.compact, className = props.className, _o = props.cellStyleProps, cellStyleProps = _o === void 0 ? exports.DEFAULT_CELL_STYLE_PROPS : _o, enableUpdateAnimations = props.enableUpdateAnimations;
|
642
|
+
var theme = props.theme, isSelected = props.isSelected, canSelect = props.canSelect, droppingClassName = props.droppingClassName, anySelected = props.anySelected, isCheckVisible = props.isCheckVisible, checkboxCellClassName = props.checkboxCellClassName, compact = props.compact, className = props.className, _o = props.cellStyleProps, cellStyleProps = _o === void 0 ? exports.DEFAULT_CELL_STYLE_PROPS : _o, enableUpdateAnimations = props.enableUpdateAnimations, disabled = props.disabled;
|
641
643
|
var palette = theme.palette, fonts = theme.fonts;
|
642
644
|
var neutralPrimary = palette.neutralPrimary, white = palette.white, neutralSecondary = palette.neutralSecondary, neutralLighter = palette.neutralLighter, neutralLight = palette.neutralLight, neutralDark = palette.neutralDark, neutralQuaternaryAlt = palette.neutralQuaternaryAlt;
|
643
645
|
var focusBorder = theme.semanticColors.focusBorder;
|
@@ -821,6 +823,7 @@ exports.getDetailsRowStyles = function (props) {
|
|
821
823
|
_h),
|
822
824
|
},
|
823
825
|
compact && cellCompactStyles,
|
826
|
+
disabled && { opacity: 0.5 },
|
824
827
|
];
|
825
828
|
return {
|
826
829
|
root: [
|
@@ -2680,6 +2683,7 @@ var ContextualMenu_1 = __webpack_require__(248);
|
|
2680
2683
|
var BaseButton_classNames_1 = __webpack_require__(194);
|
2681
2684
|
var SplitButton_classNames_1 = __webpack_require__(719);
|
2682
2685
|
var KeytipData_1 = __webpack_require__(79);
|
2686
|
+
var Utilities_2 = __webpack_require__(3);
|
2683
2687
|
var TouchIdleDelay = 500; /* ms */
|
2684
2688
|
var COMPONENT_NAME = 'BaseButton';
|
2685
2689
|
/**
|
@@ -2766,16 +2770,8 @@ var BaseButton = /** @class */ (function (_super) {
|
|
2766
2770
|
return React.createElement(Icon_1.FontIcon, tslib_1.__assign({ iconName: "ChevronDown" }, menuIconProps, { className: _this._classNames.menuIcon }));
|
2767
2771
|
};
|
2768
2772
|
_this._onRenderMenu = function (menuProps) {
|
2769
|
-
var
|
2770
|
-
|
2771
|
-
var MenuType = _this.props.menuAs || ContextualMenu_1.ContextualMenu;
|
2772
|
-
// the accessible menu label (accessible name) has a relationship to the button.
|
2773
|
-
// If the menu props do not specify an explicit value for aria-label or aria-labelledBy,
|
2774
|
-
// AND the button has text, we'll set the menu aria-labelledBy to the text element id.
|
2775
|
-
if (!menuProps.ariaLabel && !menuProps.labelElementId && _this._hasText()) {
|
2776
|
-
menuProps = tslib_1.__assign(tslib_1.__assign({}, menuProps), { labelElementId: _this._labelId });
|
2777
|
-
}
|
2778
|
-
return (React.createElement(MenuType, tslib_1.__assign({ id: _this._labelId + '-menu', directionalHint: DirectionalHint_1.DirectionalHint.bottomLeftEdge }, menuProps, { shouldFocusOnContainer: _this._menuShouldFocusOnContainer, shouldFocusOnMount: _this._menuShouldFocusOnMount, hidden: persistMenu ? menuHidden : undefined, className: Utilities_1.css('ms-BaseButton-menuhost', menuProps.className), target: _this._isSplitButton ? _this._splitButtonContainer.current : _this._buttonElement.current, onDismiss: _this._onDismissMenu })));
|
2773
|
+
var MenuType = _this.props.menuAs ? Utilities_2.composeComponentAs(_this.props.menuAs, ContextualMenu_1.ContextualMenu) : ContextualMenu_1.ContextualMenu;
|
2774
|
+
return React.createElement(MenuType, tslib_1.__assign({}, menuProps));
|
2779
2775
|
};
|
2780
2776
|
_this._onDismissMenu = function (ev) {
|
2781
2777
|
var menuProps = _this.props.menuProps;
|
@@ -3136,14 +3132,14 @@ var BaseButton = /** @class */ (function (_super) {
|
|
3136
3132
|
menuProps &&
|
3137
3133
|
!menuProps.doNotLayer &&
|
3138
3134
|
_this._shouldRenderMenu() &&
|
3139
|
-
onRenderMenu(menuProps, _this._onRenderMenu)))); };
|
3135
|
+
onRenderMenu(_this._getMenuProps(menuProps), _this._onRenderMenu)))); };
|
3140
3136
|
var Content = keytipProps ? (
|
3141
3137
|
// If we're making a split button, we won't put the keytip here
|
3142
3138
|
React.createElement(KeytipData_1.KeytipData, { keytipProps: !this._isSplitButton ? keytipProps : undefined, ariaDescribedBy: buttonProps['aria-describedby'], disabled: disabled }, function (keytipAttributes) { return Button(keytipAttributes); })) : (Button());
|
3143
3139
|
if (menuProps && menuProps.doNotLayer) {
|
3144
3140
|
return (React.createElement("span", { style: { display: 'inline-block' } },
|
3145
3141
|
Content,
|
3146
|
-
this._shouldRenderMenu() && onRenderMenu(menuProps, this._onRenderMenu)));
|
3142
|
+
this._shouldRenderMenu() && onRenderMenu(this._getMenuProps(menuProps), this._onRenderMenu)));
|
3147
3143
|
}
|
3148
3144
|
return (React.createElement(React.Fragment, null,
|
3149
3145
|
Content,
|
@@ -3176,6 +3172,17 @@ var BaseButton = /** @class */ (function (_super) {
|
|
3176
3172
|
// Purely a code maintainability/reuse issue, but logged as Issue #4979.
|
3177
3173
|
return this.props.text !== null && (this.props.text !== undefined || typeof this.props.children === 'string');
|
3178
3174
|
};
|
3175
|
+
BaseButton.prototype._getMenuProps = function (menuProps) {
|
3176
|
+
var persistMenu = this.props.persistMenu;
|
3177
|
+
var menuHidden = this.state.menuHidden;
|
3178
|
+
// the accessible menu label (accessible name) has a relationship to the button.
|
3179
|
+
// If the menu props do not specify an explicit value for aria-label or aria-labelledBy,
|
3180
|
+
// AND the button has text, we'll set the menu aria-labelledBy to the text element id.
|
3181
|
+
if (!menuProps.ariaLabel && !menuProps.labelElementId && this._hasText()) {
|
3182
|
+
menuProps = tslib_1.__assign(tslib_1.__assign({}, menuProps), { labelElementId: this._labelId });
|
3183
|
+
}
|
3184
|
+
return tslib_1.__assign(tslib_1.__assign({ id: this._labelId + '-menu', directionalHint: DirectionalHint_1.DirectionalHint.bottomLeftEdge }, menuProps), { shouldFocusOnContainer: this._menuShouldFocusOnContainer, shouldFocusOnMount: this._menuShouldFocusOnMount, hidden: persistMenu ? menuHidden : undefined, className: Utilities_1.css('ms-BaseButton-menuhost', menuProps.className), target: this._isSplitButton ? this._splitButtonContainer.current : this._buttonElement.current, onDismiss: this._onDismissMenu });
|
3185
|
+
};
|
3179
3186
|
BaseButton.prototype._onRenderSplitButtonContent = function (tag, buttonProps) {
|
3180
3187
|
var _this = this;
|
3181
3188
|
var _a = this.props, _b = _a.styles, styles = _b === void 0 ? {} : _b, disabled = _a.disabled, allowDisabledFocus = _a.allowDisabledFocus, checked = _a.checked, getSplitButtonClassNames = _a.getSplitButtonClassNames, primaryDisabled = _a.primaryDisabled, menuProps = _a.menuProps, toggle = _a.toggle, role = _a.role, primaryActionButtonProps = _a.primaryActionButtonProps;
|
@@ -3809,7 +3816,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
3809
3816
|
// Do not modify this file; it is generated as part of publish.
|
3810
3817
|
// The checked in version is a placeholder only and will not be updated.
|
3811
3818
|
var set_version_1 = __webpack_require__(57);
|
3812
|
-
set_version_1.setVersion('office-ui-fabric-react', '7.
|
3819
|
+
set_version_1.setVersion('office-ui-fabric-react', '7.184.0');
|
3813
3820
|
|
3814
3821
|
|
3815
3822
|
/***/ }),
|
@@ -17098,6 +17105,7 @@ exports.getNativeProps = getNativeProps;
|
|
17098
17105
|
|
17099
17106
|
Object.defineProperty(exports, "__esModule", { value: true });
|
17100
17107
|
exports.SELECTION_CHANGE = 'change';
|
17108
|
+
exports.SELECTION_ITEMS_CHANGE = 'items-change';
|
17101
17109
|
/**
|
17102
17110
|
* {@docCategory Selection}
|
17103
17111
|
*/
|
@@ -18976,33 +18984,37 @@ var LayerBase = /** @class */ (function (_super) {
|
|
18976
18984
|
var _this = _super.call(this, props) || this;
|
18977
18985
|
_this._rootRef = React.createRef();
|
18978
18986
|
_this._createLayerElement = function () {
|
18987
|
+
var _a, _b;
|
18979
18988
|
var hostId = _this.props.hostId;
|
18980
18989
|
var doc = Utilities_1.getDocument(_this._rootRef.current);
|
18981
18990
|
var host = _this._getHost();
|
18982
|
-
if (!
|
18991
|
+
if (!host) {
|
18983
18992
|
return;
|
18984
18993
|
}
|
18985
18994
|
// If one was already existing, remove.
|
18986
18995
|
_this._removeLayerElement();
|
18987
|
-
|
18988
|
-
var
|
18989
|
-
layerElement
|
18990
|
-
|
18991
|
-
|
18992
|
-
|
18993
|
-
|
18994
|
-
|
18995
|
-
|
18996
|
-
|
18997
|
-
|
18998
|
-
|
18999
|
-
|
19000
|
-
onLayerMounted
|
19001
|
-
|
19002
|
-
|
19003
|
-
|
19004
|
-
|
19005
|
-
|
18996
|
+
// eslint-disable-next-line deprecation/deprecation
|
18997
|
+
var layerElement = (_b = (_a = host.ownerDocument, (_a !== null && _a !== void 0 ? _a : doc))) === null || _b === void 0 ? void 0 : _b.createElement('div');
|
18998
|
+
if (layerElement) {
|
18999
|
+
var classNames = _this._getClassNames();
|
19000
|
+
layerElement.className = classNames.root;
|
19001
|
+
Utilities_1.setPortalAttribute(layerElement);
|
19002
|
+
Utilities_1.setVirtualParent(layerElement, _this._rootRef.current);
|
19003
|
+
_this.props.insertFirst ? host.insertBefore(layerElement, host.firstChild) : host.appendChild(layerElement);
|
19004
|
+
_this.setState({
|
19005
|
+
hostId: hostId,
|
19006
|
+
layerElement: layerElement,
|
19007
|
+
}, function () {
|
19008
|
+
// eslint-disable-next-line deprecation/deprecation
|
19009
|
+
var _a = _this.props, onLayerDidMount = _a.onLayerDidMount, onLayerMounted = _a.onLayerMounted;
|
19010
|
+
if (onLayerMounted) {
|
19011
|
+
onLayerMounted();
|
19012
|
+
}
|
19013
|
+
if (onLayerDidMount) {
|
19014
|
+
onLayerDidMount();
|
19015
|
+
}
|
19016
|
+
});
|
19017
|
+
}
|
19006
19018
|
};
|
19007
19019
|
_this.state = {};
|
19008
19020
|
if (true) {
|
@@ -19064,17 +19076,19 @@ var LayerBase = /** @class */ (function (_super) {
|
|
19064
19076
|
return classNames;
|
19065
19077
|
};
|
19066
19078
|
LayerBase.prototype._getHost = function () {
|
19079
|
+
var _a, _b, _c, _d, _e, _f;
|
19067
19080
|
var hostId = this.props.hostId;
|
19068
19081
|
var doc = Utilities_1.getDocument(this._rootRef.current);
|
19069
|
-
if (!doc) {
|
19070
|
-
return undefined;
|
19071
|
-
}
|
19072
19082
|
if (hostId) {
|
19073
|
-
|
19083
|
+
var layerHost = Layer_notification_1.getLayerHost(hostId);
|
19084
|
+
if (layerHost) {
|
19085
|
+
return _a = layerHost.rootRef.current, (_a !== null && _a !== void 0 ? _a : null);
|
19086
|
+
}
|
19087
|
+
return _c = (_b = doc) === null || _b === void 0 ? void 0 : _b.getElementById(hostId), (_c !== null && _c !== void 0 ? _c : null);
|
19074
19088
|
}
|
19075
19089
|
else {
|
19076
19090
|
var defaultHostSelector = Layer_notification_1.getDefaultTarget();
|
19077
|
-
return defaultHostSelector ? doc.querySelector(defaultHostSelector) : doc.body;
|
19091
|
+
return _f = (defaultHostSelector ? (_d = doc) === null || _d === void 0 ? void 0 : _d.querySelector(defaultHostSelector) : (_e = doc) === null || _e === void 0 ? void 0 : _e.body), (_f !== null && _f !== void 0 ? _f : null);
|
19078
19092
|
}
|
19079
19093
|
};
|
19080
19094
|
LayerBase.defaultProps = {
|
@@ -19242,6 +19256,7 @@ exports.FabricBase = FabricBase;
|
|
19242
19256
|
|
19243
19257
|
Object.defineProperty(exports, "__esModule", { value: true });
|
19244
19258
|
var _layersByHostId = {};
|
19259
|
+
var _layerHostsById = {};
|
19245
19260
|
var _defaultHostSelector;
|
19246
19261
|
/**
|
19247
19262
|
* Register a layer for a given host id
|
@@ -19253,6 +19268,13 @@ function registerLayer(hostId, callback) {
|
|
19253
19268
|
_layersByHostId[hostId] = [];
|
19254
19269
|
}
|
19255
19270
|
_layersByHostId[hostId].push(callback);
|
19271
|
+
var layerHosts = _layerHostsById[hostId];
|
19272
|
+
if (layerHosts) {
|
19273
|
+
for (var _i = 0, layerHosts_1 = layerHosts; _i < layerHosts_1.length; _i++) {
|
19274
|
+
var layerHost = layerHosts_1[_i];
|
19275
|
+
layerHost.notifyLayersChanged();
|
19276
|
+
}
|
19277
|
+
}
|
19256
19278
|
}
|
19257
19279
|
exports.registerLayer = registerLayer;
|
19258
19280
|
/**
|
@@ -19261,17 +19283,77 @@ exports.registerLayer = registerLayer;
|
|
19261
19283
|
* @param layer Layer instance
|
19262
19284
|
*/
|
19263
19285
|
function unregisterLayer(hostId, callback) {
|
19264
|
-
|
19265
|
-
|
19286
|
+
var layers = _layersByHostId[hostId];
|
19287
|
+
if (layers) {
|
19288
|
+
var idx = layers.indexOf(callback);
|
19266
19289
|
if (idx >= 0) {
|
19267
|
-
|
19268
|
-
if (
|
19290
|
+
layers.splice(idx, 1);
|
19291
|
+
if (layers.length === 0) {
|
19269
19292
|
delete _layersByHostId[hostId];
|
19270
19293
|
}
|
19271
19294
|
}
|
19272
19295
|
}
|
19296
|
+
var layerHosts = _layerHostsById[hostId];
|
19297
|
+
if (layerHosts) {
|
19298
|
+
for (var _i = 0, layerHosts_2 = layerHosts; _i < layerHosts_2.length; _i++) {
|
19299
|
+
var layerHost = layerHosts_2[_i];
|
19300
|
+
layerHost.notifyLayersChanged();
|
19301
|
+
}
|
19302
|
+
}
|
19273
19303
|
}
|
19274
19304
|
exports.unregisterLayer = unregisterLayer;
|
19305
|
+
/**
|
19306
|
+
* Gets the number of layers currently registered with a host id.
|
19307
|
+
* @param hostId Id of the layer host.
|
19308
|
+
* @returns The number of layers currently registered with the host.
|
19309
|
+
*/
|
19310
|
+
function getLayerCount(hostId) {
|
19311
|
+
var layers = _layerHostsById[hostId];
|
19312
|
+
return layers ? layers.length : 0;
|
19313
|
+
}
|
19314
|
+
exports.getLayerCount = getLayerCount;
|
19315
|
+
/**
|
19316
|
+
* Gets the Layer Host instance associated with a hostId, if applicable.
|
19317
|
+
* @param hostId
|
19318
|
+
* @returns A component ref for the associated layer host.
|
19319
|
+
*/
|
19320
|
+
function getLayerHost(hostId) {
|
19321
|
+
var layerHosts = _layerHostsById[hostId];
|
19322
|
+
return (layerHosts && layerHosts[0]) || undefined;
|
19323
|
+
}
|
19324
|
+
exports.getLayerHost = getLayerHost;
|
19325
|
+
/**
|
19326
|
+
* Registers a Layer Host with an associated hostId.
|
19327
|
+
* @param hostId Id of the layer host
|
19328
|
+
* @param layerHost layer host instance
|
19329
|
+
*/
|
19330
|
+
function registerLayerHost(hostId, layerHost) {
|
19331
|
+
var layerHosts = _layerHostsById[hostId] || (_layerHostsById[hostId] = []);
|
19332
|
+
// Insert this at the start of an array to avoid race conditions between mount and unmount.
|
19333
|
+
// If a LayerHost is re-mounted, and mount of the new instance may occur before the unmount of the old one.
|
19334
|
+
// Putting the new instance at the start of this array ensures that calls to `getLayerHost` will immediately
|
19335
|
+
// get the new one even if the old one is around briefly.
|
19336
|
+
layerHosts.unshift(layerHost);
|
19337
|
+
}
|
19338
|
+
exports.registerLayerHost = registerLayerHost;
|
19339
|
+
/**
|
19340
|
+
* Unregisters a Layer Host from the associated hostId.
|
19341
|
+
* @param hostId Id of the layer host
|
19342
|
+
* @param layerHost layer host instance
|
19343
|
+
*/
|
19344
|
+
function unregisterLayerHost(hostId, layerHost) {
|
19345
|
+
var layerHosts = _layerHostsById[hostId];
|
19346
|
+
if (layerHosts) {
|
19347
|
+
var idx = layerHosts.indexOf(layerHost);
|
19348
|
+
if (idx >= 0) {
|
19349
|
+
layerHosts.splice(idx, 1);
|
19350
|
+
}
|
19351
|
+
if (layerHosts.length === 0) {
|
19352
|
+
delete _layerHostsById[hostId];
|
19353
|
+
}
|
19354
|
+
}
|
19355
|
+
}
|
19356
|
+
exports.unregisterLayerHost = unregisterLayerHost;
|
19275
19357
|
/**
|
19276
19358
|
* Used for notifying applicable Layers that a host is available/unavailable and to re-evaluate Layers that
|
19277
19359
|
* care about the specific host.
|
@@ -19348,8 +19430,26 @@ var Styling_1 = __webpack_require__(4);
|
|
19348
19430
|
var ContextualMenu_classNames_1 = __webpack_require__(249);
|
19349
19431
|
var getClassNames = Utilities_1.classNamesFunction();
|
19350
19432
|
var getContextualMenuItemClassNames = Utilities_1.classNamesFunction();
|
19351
|
-
function getSubmenuItems(item) {
|
19352
|
-
|
19433
|
+
function getSubmenuItems(item, options) {
|
19434
|
+
var _a;
|
19435
|
+
var target = (_a = options) === null || _a === void 0 ? void 0 : _a.target;
|
19436
|
+
// eslint-disable-next-line deprecation/deprecation
|
19437
|
+
var items = item.subMenuProps ? item.subMenuProps.items : item.items;
|
19438
|
+
if (items) {
|
19439
|
+
var overrideItems = [];
|
19440
|
+
for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
|
19441
|
+
var subItem = items_1[_i];
|
19442
|
+
if (subItem.preferMenuTargetAsEventTarget) {
|
19443
|
+
// For sub-items which need an overridden target, intercept `onClick`
|
19444
|
+
var onClick = subItem.onClick, contextItem = tslib_1.__rest(subItem, ["onClick"]);
|
19445
|
+
overrideItems.push(tslib_1.__assign(tslib_1.__assign({}, contextItem), { onClick: getOnClickWithOverrideTarget(onClick, target) }));
|
19446
|
+
}
|
19447
|
+
else {
|
19448
|
+
overrideItems.push(subItem);
|
19449
|
+
}
|
19450
|
+
}
|
19451
|
+
return overrideItems;
|
19452
|
+
}
|
19353
19453
|
}
|
19354
19454
|
exports.getSubmenuItems = getSubmenuItems;
|
19355
19455
|
/**
|
@@ -19652,7 +19752,8 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
19652
19752
|
_this._onItemClickBase(item, ev, ev.currentTarget);
|
19653
19753
|
};
|
19654
19754
|
_this._onItemClickBase = function (item, ev, target) {
|
19655
|
-
var
|
19755
|
+
var menuTarget = _this.props.target;
|
19756
|
+
var items = getSubmenuItems(item, { target: menuTarget });
|
19656
19757
|
// Cancel a async menu item hover timeout action from being taken and instead
|
19657
19758
|
// just trigger the click event instead.
|
19658
19759
|
_this._cancelSubMenuTimer();
|
@@ -19683,9 +19784,13 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
19683
19784
|
ev.stopPropagation();
|
19684
19785
|
};
|
19685
19786
|
_this._executeItemClick = function (item, ev) {
|
19787
|
+
var menuTarget = _this.props.target;
|
19686
19788
|
if (item.disabled || item.isDisabled) {
|
19687
19789
|
return;
|
19688
19790
|
}
|
19791
|
+
if (item.preferMenuTargetAsEventTarget) {
|
19792
|
+
overrideTarget(ev, menuTarget);
|
19793
|
+
}
|
19689
19794
|
var dismiss = false;
|
19690
19795
|
if (item.onClick) {
|
19691
19796
|
dismiss = !!item.onClick(ev, item);
|
@@ -19882,8 +19987,8 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
19882
19987
|
// The menu should only return if items were provided, if no items were provided then it should not appear.
|
19883
19988
|
if (items && items.length > 0) {
|
19884
19989
|
var totalItemCount = 0;
|
19885
|
-
for (var _i = 0,
|
19886
|
-
var item =
|
19990
|
+
for (var _i = 0, items_2 = items; _i < items_2.length; _i++) {
|
19991
|
+
var item = items_2[_i];
|
19887
19992
|
if (item.itemType !== ContextualMenu_types_1.ContextualMenuItemType.Divider && item.itemType !== ContextualMenu_types_1.ContextualMenuItemType.Header) {
|
19888
19993
|
var itemCount = item.customOnRenderListLength ? item.customOnRenderListLength : 1;
|
19889
19994
|
totalItemCount += itemCount;
|
@@ -20127,9 +20232,10 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
20127
20232
|
var _a = this.state, submenuTarget = _a.submenuTarget, expandedMenuItemKey = _a.expandedMenuItemKey;
|
20128
20233
|
var item = this._findItemByKey(expandedMenuItemKey);
|
20129
20234
|
var submenuProps = null;
|
20235
|
+
var menuTarget = this.props.target;
|
20130
20236
|
if (item) {
|
20131
20237
|
submenuProps = {
|
20132
|
-
items: getSubmenuItems(item),
|
20238
|
+
items: getSubmenuItems(item, { target: menuTarget }),
|
20133
20239
|
target: submenuTarget,
|
20134
20240
|
onDismiss: this._onSubMenuDismiss,
|
20135
20241
|
isSubMenu: true,
|
@@ -20144,6 +20250,10 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
20144
20250
|
if (item.subMenuProps) {
|
20145
20251
|
Utilities_1.assign(submenuProps, item.subMenuProps);
|
20146
20252
|
}
|
20253
|
+
if (item.preferMenuTargetAsEventTarget) {
|
20254
|
+
var onItemClick = item.onItemClick;
|
20255
|
+
submenuProps.onItemClick = getOnClickWithOverrideTarget(onItemClick, menuTarget);
|
20256
|
+
}
|
20147
20257
|
}
|
20148
20258
|
return submenuProps;
|
20149
20259
|
};
|
@@ -20157,8 +20267,8 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
20157
20267
|
* @param items - The items to look for the key
|
20158
20268
|
*/
|
20159
20269
|
ContextualMenuBase.prototype._findItemByKeyFromItems = function (key, items) {
|
20160
|
-
for (var _i = 0,
|
20161
|
-
var item =
|
20270
|
+
for (var _i = 0, items_3 = items; _i < items_3.length; _i++) {
|
20271
|
+
var item = items_3[_i];
|
20162
20272
|
if (item.itemType === ContextualMenu_types_1.ContextualMenuItemType.Section && item.sectionProps) {
|
20163
20273
|
var match = this._findItemByKeyFromItems(key, item.sectionProps.items);
|
20164
20274
|
if (match) {
|
@@ -20219,6 +20329,25 @@ var ContextualMenuBase = /** @class */ (function (_super) {
|
|
20219
20329
|
return ContextualMenuBase;
|
20220
20330
|
}(React.Component));
|
20221
20331
|
exports.ContextualMenuBase = ContextualMenuBase;
|
20332
|
+
function getOnClickWithOverrideTarget(onClick, target) {
|
20333
|
+
return onClick
|
20334
|
+
? function (ev, item) {
|
20335
|
+
overrideTarget(ev, target);
|
20336
|
+
return onClick(ev, item);
|
20337
|
+
}
|
20338
|
+
: onClick;
|
20339
|
+
}
|
20340
|
+
function overrideTarget(ev, target) {
|
20341
|
+
if (ev && target) {
|
20342
|
+
ev.persist();
|
20343
|
+
if (target instanceof Event) {
|
20344
|
+
ev.target = target.target;
|
20345
|
+
}
|
20346
|
+
else if (target instanceof Element) {
|
20347
|
+
ev.target = target;
|
20348
|
+
}
|
20349
|
+
}
|
20350
|
+
}
|
20222
20351
|
|
20223
20352
|
|
20224
20353
|
/***/ }),
|
@@ -22076,7 +22205,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
22076
22205
|
var theme_1 = __webpack_require__(80);
|
22077
22206
|
var AzureColors_1 = __webpack_require__(86);
|
22078
22207
|
var AzureType_1 = __webpack_require__(115);
|
22079
|
-
var StyleConstants = __webpack_require__(
|
22208
|
+
var StyleConstants = __webpack_require__(30);
|
22080
22209
|
var AzureStyleSettings_1 = __webpack_require__(193);
|
22081
22210
|
var darkExtendedSemanticColors = {
|
22082
22211
|
bodyBackground: AzureColors_1.DarkSemanticColors.background,
|
@@ -22923,7 +23052,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
22923
23052
|
var theme_1 = __webpack_require__(80);
|
22924
23053
|
var AzureColors_1 = __webpack_require__(86);
|
22925
23054
|
var AzureType_1 = __webpack_require__(115);
|
22926
|
-
var StyleConstants = __webpack_require__(
|
23055
|
+
var StyleConstants = __webpack_require__(30);
|
22927
23056
|
var AzureStyleSettings_1 = __webpack_require__(193);
|
22928
23057
|
var lightExtendedSemanticColors = {
|
22929
23058
|
bodyBackground: AzureColors_1.LightSemanticColors.background,
|
@@ -23105,7 +23234,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
23105
23234
|
var theme_1 = __webpack_require__(80);
|
23106
23235
|
var AzureColors_1 = __webpack_require__(86);
|
23107
23236
|
var AzureType_1 = __webpack_require__(115);
|
23108
|
-
var StyleConstants = __webpack_require__(
|
23237
|
+
var StyleConstants = __webpack_require__(30);
|
23109
23238
|
var AzureStyleSettings_1 = __webpack_require__(193);
|
23110
23239
|
var highContrastLightExtendedSemanticColors = {
|
23111
23240
|
bodyBackground: AzureColors_1.HighContrastLightSemanticColors.background,
|
@@ -23288,7 +23417,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
23288
23417
|
var theme_1 = __webpack_require__(80);
|
23289
23418
|
var AzureColors_1 = __webpack_require__(86);
|
23290
23419
|
var AzureType_1 = __webpack_require__(115);
|
23291
|
-
var StyleConstants = __webpack_require__(
|
23420
|
+
var StyleConstants = __webpack_require__(30);
|
23292
23421
|
var AzureStyleSettings_1 = __webpack_require__(193);
|
23293
23422
|
var highContrastDarkExtendedSemanticColors = {
|
23294
23423
|
bodyBackground: AzureColors_1.HighContrastDarkSemanticColors.background,
|
@@ -24677,6 +24806,7 @@ var Button_1 = __webpack_require__(44);
|
|
24677
24806
|
var DirectionalHint_1 = __webpack_require__(53);
|
24678
24807
|
var ResizeGroup_1 = __webpack_require__(379);
|
24679
24808
|
var Tooltip_1 = __webpack_require__(256);
|
24809
|
+
var Utilities_2 = __webpack_require__(3);
|
24680
24810
|
var getClassNames = Utilities_1.classNamesFunction();
|
24681
24811
|
var OVERFLOW_KEY = 'overflow';
|
24682
24812
|
var nullFunction = function () { return null; };
|
@@ -24734,7 +24864,7 @@ var BreadcrumbBase = /** @class */ (function (_super) {
|
|
24734
24864
|
return tslib_1.__assign(tslib_1.__assign({}, data), { renderedItems: renderedItems, renderedOverflowItems: renderedOverflowItems });
|
24735
24865
|
};
|
24736
24866
|
_this._onRenderBreadcrumb = function (data) {
|
24737
|
-
var _a = data.props, ariaLabel = _a.ariaLabel, _b = _a.dividerAs, DividerType = _b === void 0 ? Icon_1.Icon : _b,
|
24867
|
+
var _a = data.props, ariaLabel = _a.ariaLabel, _b = _a.dividerAs, DividerType = _b === void 0 ? Icon_1.Icon : _b, onRenderItem = _a.onRenderItem, overflowAriaLabel = _a.overflowAriaLabel, overflowIndex = _a.overflowIndex, onRenderOverflowIcon = _a.onRenderOverflowIcon, overflowButtonAs = _a.overflowButtonAs;
|
24738
24868
|
var renderedOverflowItems = data.renderedOverflowItems, renderedItems = data.renderedItems;
|
24739
24869
|
var contextualItems = renderedOverflowItems.map(function (item) {
|
24740
24870
|
var isActionable = !!(item.onClick || item.href);
|
@@ -24752,9 +24882,18 @@ var BreadcrumbBase = /** @class */ (function (_super) {
|
|
24752
24882
|
// knows not to render on that item
|
24753
24883
|
var lastItemIndex = renderedItems.length - 1;
|
24754
24884
|
var hasOverflowItems = renderedOverflowItems && renderedOverflowItems.length !== 0;
|
24755
|
-
var itemElements = renderedItems.map(function (item, index) {
|
24756
|
-
|
24757
|
-
|
24885
|
+
var itemElements = renderedItems.map(function (item, index) {
|
24886
|
+
var finalOnRenderItem = _this._onRenderItem;
|
24887
|
+
if (item.onRender) {
|
24888
|
+
finalOnRenderItem = Utilities_2.composeRenderFunction(item.onRender, finalOnRenderItem);
|
24889
|
+
}
|
24890
|
+
if (onRenderItem) {
|
24891
|
+
finalOnRenderItem = Utilities_2.composeRenderFunction(onRenderItem, finalOnRenderItem);
|
24892
|
+
}
|
24893
|
+
return (React.createElement("li", { className: _this._classNames.listItem, key: item.key || String(index) },
|
24894
|
+
finalOnRenderItem(item),
|
24895
|
+
(index !== lastItemIndex || (hasOverflowItems && index === overflowIndex - 1)) && (React.createElement(DividerType, { className: _this._classNames.chevron, iconName: Utilities_1.getRTL(_this.props.theme) ? 'ChevronLeft' : 'ChevronRight', item: item }))));
|
24896
|
+
});
|
24758
24897
|
if (hasOverflowItems) {
|
24759
24898
|
var iconProps = !onRenderOverflowIcon ? { iconName: 'More' } : {};
|
24760
24899
|
var onRenderMenuIcon = onRenderOverflowIcon ? onRenderOverflowIcon : nullFunction;
|
@@ -24774,17 +24913,27 @@ var BreadcrumbBase = /** @class */ (function (_super) {
|
|
24774
24913
|
React.createElement("ol", { className: _this._classNames.list }, itemElements))));
|
24775
24914
|
};
|
24776
24915
|
_this._onRenderItem = function (item) {
|
24777
|
-
|
24916
|
+
if (!item) {
|
24917
|
+
return null;
|
24918
|
+
}
|
24919
|
+
var as = item.as, href = item.href, onClick = item.onClick, isCurrentItem = item.isCurrentItem, text = item.text, onRenderContent = item.onRenderContent, additionalProps = tslib_1.__rest(item, ["as", "href", "onClick", "isCurrentItem", "text", "onRenderContent"]);
|
24920
|
+
var finalOnRenderContent = defaultOnRenderCrumbContent;
|
24921
|
+
if (onRenderContent) {
|
24922
|
+
finalOnRenderContent = Utilities_2.composeRenderFunction(onRenderContent, finalOnRenderContent);
|
24923
|
+
}
|
24924
|
+
if (_this.props.onRenderItemContent) {
|
24925
|
+
finalOnRenderContent = Utilities_2.composeRenderFunction(_this.props.onRenderItemContent, finalOnRenderContent);
|
24926
|
+
}
|
24778
24927
|
if (onClick || href) {
|
24779
24928
|
return (React.createElement(Link_1.Link, tslib_1.__assign({}, additionalProps, { as: as, className: _this._classNames.itemLink, href: href, "aria-current": isCurrentItem ? 'page' : undefined,
|
24780
24929
|
// eslint-disable-next-line react/jsx-no-bind
|
24781
24930
|
onClick: _this._onBreadcrumbClicked.bind(_this, item) }),
|
24782
|
-
React.createElement(Tooltip_1.TooltipHost, tslib_1.__assign({ content: text, overflowMode: Tooltip_1.TooltipOverflowMode.Parent }, _this.props.tooltipHostProps),
|
24931
|
+
React.createElement(Tooltip_1.TooltipHost, tslib_1.__assign({ content: text, overflowMode: Tooltip_1.TooltipOverflowMode.Parent }, _this.props.tooltipHostProps), finalOnRenderContent(item))));
|
24783
24932
|
}
|
24784
24933
|
else {
|
24785
24934
|
var Tag = as || 'span';
|
24786
24935
|
return (React.createElement(Tag, tslib_1.__assign({}, additionalProps, { className: _this._classNames.item }),
|
24787
|
-
React.createElement(Tooltip_1.TooltipHost, tslib_1.__assign({ content: text, overflowMode: Tooltip_1.TooltipOverflowMode.Parent }, _this.props.tooltipHostProps),
|
24936
|
+
React.createElement(Tooltip_1.TooltipHost, tslib_1.__assign({ content: text, overflowMode: Tooltip_1.TooltipOverflowMode.Parent }, _this.props.tooltipHostProps), finalOnRenderContent(item))));
|
24788
24937
|
}
|
24789
24938
|
};
|
24790
24939
|
_this._onBreadcrumbClicked = function (item, ev) {
|
@@ -24840,6 +24989,9 @@ var BreadcrumbBase = /** @class */ (function (_super) {
|
|
24840
24989
|
return BreadcrumbBase;
|
24841
24990
|
}(React.Component));
|
24842
24991
|
exports.BreadcrumbBase = BreadcrumbBase;
|
24992
|
+
function defaultOnRenderCrumbContent(item) {
|
24993
|
+
return item ? React.createElement(React.Fragment, null, item.text) : null;
|
24994
|
+
}
|
24843
24995
|
|
24844
24996
|
|
24845
24997
|
/***/ }),
|
@@ -28218,6 +28370,9 @@ var ComboBox = /** @class */ (function (_super) {
|
|
28218
28370
|
* {@inheritdoc}
|
28219
28371
|
*/
|
28220
28372
|
_this.focus = function (shouldOpenOnFocus, useFocusAsync) {
|
28373
|
+
if (_this.props.disabled === true) {
|
28374
|
+
return;
|
28375
|
+
}
|
28221
28376
|
if (_this._autofill.current) {
|
28222
28377
|
if (useFocusAsync) {
|
28223
28378
|
Utilities_1.focusAsync(_this._autofill.current);
|
@@ -28487,9 +28642,54 @@ var ComboBox = /** @class */ (function (_super) {
|
|
28487
28642
|
};
|
28488
28643
|
// Render List of items
|
28489
28644
|
_this._onRenderList = function (props) {
|
28490
|
-
var
|
28645
|
+
var _a = props.onRenderItem, onRenderItem = _a === void 0 ? _this._onRenderItem : _a, label = props.label, ariaLabel = props.ariaLabel;
|
28646
|
+
var queue = { items: [] };
|
28647
|
+
var renderedList = [];
|
28491
28648
|
var id = _this._id;
|
28492
|
-
|
28649
|
+
var emptyQueue = function () {
|
28650
|
+
var newGroup = queue.id
|
28651
|
+
? [
|
28652
|
+
React.createElement("div", { role: "group", key: queue.id, "aria-labelledby": queue.id }, queue.items),
|
28653
|
+
]
|
28654
|
+
: queue.items;
|
28655
|
+
renderedList = tslib_1.__spreadArrays(renderedList, newGroup);
|
28656
|
+
// Flush items and id
|
28657
|
+
queue = { items: [] };
|
28658
|
+
};
|
28659
|
+
var placeRenderedOptionIntoQueue = function (item, index) {
|
28660
|
+
/*
|
28661
|
+
Case Header
|
28662
|
+
empty queue if it's not already empty
|
28663
|
+
ensure unique ID for header and set queue ID
|
28664
|
+
push header into queue
|
28665
|
+
Case Divider
|
28666
|
+
push divider into queue if not first item
|
28667
|
+
empty queue if not already empty
|
28668
|
+
Default
|
28669
|
+
push item into queue
|
28670
|
+
*/
|
28671
|
+
switch (item.itemType) {
|
28672
|
+
case index_2.SelectableOptionMenuItemType.Header:
|
28673
|
+
queue.items.length > 0 && emptyQueue();
|
28674
|
+
id = id + item.key;
|
28675
|
+
queue.items.push(onRenderItem(tslib_1.__assign(tslib_1.__assign({ id: id }, item), { index: index }), _this._onRenderItem));
|
28676
|
+
queue.id = id;
|
28677
|
+
break;
|
28678
|
+
case index_2.SelectableOptionMenuItemType.Divider:
|
28679
|
+
index > 0 && queue.items.push(onRenderItem(tslib_1.__assign(tslib_1.__assign({}, item), { index: index }), _this._onRenderItem));
|
28680
|
+
queue.items.length > 0 && emptyQueue();
|
28681
|
+
break;
|
28682
|
+
default:
|
28683
|
+
queue.items.push(onRenderItem(tslib_1.__assign(tslib_1.__assign({}, item), { index: index }), _this._onRenderItem));
|
28684
|
+
}
|
28685
|
+
};
|
28686
|
+
// Place options into the queue. Queue will be emptied anytime a Header or Divider is encountered
|
28687
|
+
props.options.forEach(function (item, index) {
|
28688
|
+
placeRenderedOptionIntoQueue(item, index);
|
28689
|
+
});
|
28690
|
+
// Push remaining items into all renderedList
|
28691
|
+
queue.items.length > 0 && emptyQueue();
|
28692
|
+
return (React.createElement("div", { id: id + '-list', className: _this._classNames.optionsContainer, "aria-labelledby": label && id + '-label', "aria-label": ariaLabel && !label ? ariaLabel : undefined, role: "listbox" }, renderedList));
|
28493
28693
|
};
|
28494
28694
|
// Render items
|
28495
28695
|
_this._onRenderItem = function (item) {
|
@@ -28524,11 +28724,14 @@ var ComboBox = /** @class */ (function (_super) {
|
|
28524
28724
|
// eslint-disable-next-line react/jsx-no-bind
|
28525
28725
|
onMouseEnter: _this._onOptionMouseEnter.bind(_this, item.index),
|
28526
28726
|
// eslint-disable-next-line react/jsx-no-bind
|
28527
|
-
onMouseMove: _this._onOptionMouseMove.bind(_this, item.index), onMouseLeave: _this._onOptionMouseLeave, role: "option", "aria-selected":
|
28727
|
+
onMouseMove: _this._onOptionMouseMove.bind(_this, item.index), onMouseLeave: _this._onOptionMouseLeave, role: "option", "aria-selected": isChecked ? 'true' : 'false', ariaLabel: item.ariaLabel, disabled: item.disabled, title: title }, React.createElement("span", { className: optionClassNames.optionTextWrapper, ref: isSelected ? _this._selectedElement : undefined }, onRenderOption(item, _this._onRenderOptionContent)))) : (React.createElement(Checkbox_1.Checkbox, { id: id + '-list' + item.index, ariaLabel: item.ariaLabel, key: item.key, styles: optionStyles, className: 'ms-ComboBox-option', onChange: _this._onItemClick(item), label: item.text, checked: isChecked, title: title, disabled: item.disabled,
|
28528
28728
|
// eslint-disable-next-line react/jsx-no-bind
|
28529
|
-
onRenderLabel: onRenderCheckboxLabel, inputProps: {
|
28530
|
-
|
28531
|
-
|
28729
|
+
onRenderLabel: onRenderCheckboxLabel, inputProps: tslib_1.__assign({
|
28730
|
+
// aria-selected should only be applied to checked items, not hovered items
|
28731
|
+
'aria-selected': isChecked ? 'true' : 'false', role: 'option' }, {
|
28732
|
+
'data-index': item.index,
|
28733
|
+
'data-is-focusable': true,
|
28734
|
+
}) }));
|
28532
28735
|
};
|
28533
28736
|
return (React.createElement(ComboBoxOptionWrapper, { key: item.key, index: item.index, disabled: item.disabled, isSelected: isSelected, isChecked: isChecked, text: item.text,
|
28534
28737
|
// eslint-disable-next-line react/jsx-no-bind
|
@@ -29383,7 +29586,7 @@ var ComboBox = /** @class */ (function (_super) {
|
|
29383
29586
|
};
|
29384
29587
|
ComboBox.prototype._renderHeader = function (item) {
|
29385
29588
|
var _a = this.props.onRenderOption, onRenderOption = _a === void 0 ? this._onRenderOptionContent : _a;
|
29386
|
-
return (React.createElement("div", { key: item.key, className: this._classNames.header }, onRenderOption(item, this._onRenderOptionContent)));
|
29589
|
+
return (React.createElement("div", { id: item.id, key: item.key, className: this._classNames.header }, onRenderOption(item, this._onRenderOptionContent)));
|
29387
29590
|
};
|
29388
29591
|
/**
|
29389
29592
|
* If we are coming from a mouseOut:
|
@@ -31785,18 +31988,19 @@ var DetailsRowBase = /** @class */ (function (_super) {
|
|
31785
31988
|
}
|
31786
31989
|
};
|
31787
31990
|
DetailsRowBase.prototype.render = function () {
|
31788
|
-
var _a = this.props, className = _a.className, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b, dragDropEvents = _a.dragDropEvents, item = _a.item, itemIndex = _a.itemIndex, id = _a.id,
|
31991
|
+
var _a = this.props, className = _a.className, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b, dragDropEvents = _a.dragDropEvents, item = _a.item, itemIndex = _a.itemIndex, _c = _a.flatIndexOffset, flatIndexOffset = _c === void 0 ? 2 : _c, id = _a.id, _d = _a.onRenderCheck, onRenderCheck = _d === void 0 ? this._onRenderCheck : _d, onRenderDetailsCheckbox = _a.onRenderDetailsCheckbox, onRenderItemColumn = _a.onRenderItemColumn, getCellValueKey = _a.getCellValueKey, selectionMode = _a.selectionMode, _e = _a.rowWidth, rowWidth = _e === void 0 ? 0 : _e, checkboxVisibility = _a.checkboxVisibility, getRowAriaLabel = _a.getRowAriaLabel, getRowAriaDescription = _a.getRowAriaDescription, getRowAriaDescribedBy = _a.getRowAriaDescribedBy, checkButtonAriaLabel = _a.checkButtonAriaLabel, checkboxCellClassName = _a.checkboxCellClassName,
|
31789
31992
|
/** Alias rowFieldsAs as RowFields and default to DetailsRowFields if rowFieldsAs does not exist */
|
31790
|
-
|
31993
|
+
_f = _a.rowFieldsAs,
|
31791
31994
|
/** Alias rowFieldsAs as RowFields and default to DetailsRowFields if rowFieldsAs does not exist */
|
31792
|
-
RowFields =
|
31793
|
-
var
|
31794
|
-
var
|
31995
|
+
RowFields = _f === void 0 ? DetailsRowFields_1.DetailsRowFields : _f, selection = _a.selection, indentWidth = _a.indentWidth, enableUpdateAnimations = _a.enableUpdateAnimations, compact = _a.compact, theme = _a.theme, styles = _a.styles, cellsByColumn = _a.cellsByColumn, groupNestingDepth = _a.groupNestingDepth, _g = _a.useFastIcons, useFastIcons = _g === void 0 ? true : _g, cellStyleProps = _a.cellStyleProps, _h = _a.disabled, disabled = _h === void 0 ? false : _h;
|
31996
|
+
var _j = this.state, columnMeasureInfo = _j.columnMeasureInfo, isDropping = _j.isDropping;
|
31997
|
+
var _k = this.state.selectionState, _l = _k.isSelected, isSelected = _l === void 0 ? false : _l, _m = _k.isSelectionModal, isSelectionModal = _m === void 0 ? false : _m;
|
31795
31998
|
var isDraggable = dragDropEvents ? !!(dragDropEvents.canDrag && dragDropEvents.canDrag(item)) : undefined;
|
31796
31999
|
var droppingClassName = isDropping ? this._droppingClassNames || DEFAULT_DROPPING_CSS_CLASS : '';
|
31797
32000
|
var ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : undefined;
|
32001
|
+
var ariaRowDescription = getRowAriaDescription ? getRowAriaDescription(item) : undefined;
|
31798
32002
|
var ariaDescribedBy = getRowAriaDescribedBy ? getRowAriaDescribedBy(item) : undefined;
|
31799
|
-
var canSelect = !!selection && selection.canSelectItem(item, itemIndex);
|
32003
|
+
var canSelect = !!selection && selection.canSelectItem(item, itemIndex) && !disabled;
|
31800
32004
|
var isContentUnselectable = selectionMode === interfaces_1.SelectionMode.multiple;
|
31801
32005
|
var showCheckbox = selectionMode !== interfaces_1.SelectionMode.none && checkboxVisibility !== DetailsList_types_1.CheckboxVisibility.hidden;
|
31802
32006
|
var ariaSelected = selectionMode === interfaces_1.SelectionMode.none ? undefined : isSelected;
|
@@ -31811,6 +32015,7 @@ var DetailsRowBase = /** @class */ (function (_super) {
|
|
31811
32015
|
compact: compact,
|
31812
32016
|
enableUpdateAnimations: enableUpdateAnimations,
|
31813
32017
|
cellStyleProps: cellStyleProps,
|
32018
|
+
disabled: disabled,
|
31814
32019
|
}));
|
31815
32020
|
var rowClassNames = {
|
31816
32021
|
isMultiline: this._classNames.isMultiline,
|
@@ -31831,12 +32036,14 @@ var DetailsRowBase = /** @class */ (function (_super) {
|
|
31831
32036
|
var rowFields = (React.createElement(RowFields, { rowClassNames: this._rowClassNames, rowHeaderId: id + "-header", cellsByColumn: cellsByColumn, columns: columns, item: item, itemIndex: itemIndex, columnStartIndex: (showCheckbox ? 1 : 0) + (groupNestingDepth ? 1 : 0), onRenderItemColumn: onRenderItemColumn, getCellValueKey: getCellValueKey, enableUpdateAnimations: enableUpdateAnimations, cellStyleProps: cellStyleProps }));
|
31832
32037
|
var defaultRole = 'row';
|
31833
32038
|
var role = this.props.role ? this.props.role : defaultRole;
|
32039
|
+
this._ariaRowDescriptionId = Utilities_2.getId('DetailsRow-description');
|
31834
32040
|
return (React.createElement(FocusZone_1.FocusZone, tslib_1.__assign({ "data-is-focusable": true }, Utilities_1.getNativeProps(this.props, Utilities_1.divProperties), (typeof isDraggable === 'boolean'
|
31835
32041
|
? {
|
31836
32042
|
'data-is-draggable': isDraggable,
|
31837
32043
|
draggable: isDraggable,
|
31838
32044
|
}
|
31839
|
-
: {}), { direction: FocusZone_1.FocusZoneDirection.horizontal, elementRef: this._root, componentRef: this._focusZone, role: role, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, className: this._classNames.root, "data-selection-index": itemIndex, "data-selection-touch-invoke": true, "data-item-index": itemIndex, "aria-rowindex": groupNestingDepth ? undefined : itemIndex +
|
32045
|
+
: {}), { direction: FocusZone_1.FocusZoneDirection.horizontal, elementRef: this._root, componentRef: this._focusZone, role: role, "aria-label": ariaLabel, "aria-disabled": disabled || undefined, "aria-describedby": ariaRowDescription ? this._ariaRowDescriptionId : ariaDescribedBy, className: this._classNames.root, "data-selection-index": itemIndex, "data-selection-touch-invoke": true, "data-selection-disabled": disabled || undefined, "data-item-index": itemIndex, "aria-rowindex": groupNestingDepth ? undefined : itemIndex + flatIndexOffset, "aria-level": (groupNestingDepth && groupNestingDepth + 1) || undefined, "data-automationid": "DetailsRow", style: { minWidth: rowWidth }, "aria-selected": ariaSelected, allowFocusRoot: true }),
|
32046
|
+
ariaRowDescription ? (React.createElement("span", { key: "description", role: "presentation", hidden: true, id: this._ariaRowDescriptionId }, ariaRowDescription)) : null,
|
31840
32047
|
showCheckbox && (React.createElement("div", { role: "gridcell", "aria-colindex": 1, "data-selection-toggle": true, className: this._classNames.checkCell }, onRenderCheck({
|
31841
32048
|
id: id ? id + "-checkbox" : undefined,
|
31842
32049
|
selected: isSelected,
|
@@ -33034,7 +33241,7 @@ var DEFAULT_RENDERED_WINDOWS_BEHIND = 2;
|
|
33034
33241
|
*/
|
33035
33242
|
var DetailsListInner = function (props) {
|
33036
33243
|
var selection = props.selection;
|
33037
|
-
var ariaLabelForListHeader = props.ariaLabelForListHeader, ariaLabelForSelectAllCheckbox = props.ariaLabelForSelectAllCheckbox, ariaLabelForSelectionColumn = props.ariaLabelForSelectionColumn, className = props.className, checkboxVisibility = props.checkboxVisibility, compact = props.compact, constrainMode = props.constrainMode, dragDropEvents = props.dragDropEvents, groups = props.groups, groupProps = props.groupProps, indentWidth = props.indentWidth, items = props.items, isPlaceholderData = props.isPlaceholderData, isHeaderVisible = props.isHeaderVisible, layoutMode = props.layoutMode, onItemInvoked = props.onItemInvoked, onItemContextMenu = props.onItemContextMenu, onColumnHeaderClick = props.onColumnHeaderClick, onColumnHeaderContextMenu = props.onColumnHeaderContextMenu, _a = props.selectionMode, selectionMode = _a === void 0 ? selection.mode : _a, selectionPreservedOnEmptyClick = props.selectionPreservedOnEmptyClick, selectionZoneProps = props.selectionZoneProps, ariaLabel = props.ariaLabel, ariaLabelForGrid = props.ariaLabelForGrid, rowElementEventMap = props.rowElementEventMap, _b = props.shouldApplyApplicationRole, shouldApplyApplicationRole = _b === void 0 ? false : _b, getKey = props.getKey, listProps = props.listProps, usePageCache = props.usePageCache, onShouldVirtualize = props.onShouldVirtualize, viewport = props.viewport, minimumPixelsForDrag = props.minimumPixelsForDrag, getGroupHeight = props.getGroupHeight, styles = props.styles, theme = props.theme, _c = props.cellStyleProps, cellStyleProps = _c === void 0 ? DetailsRow_styles_1.DEFAULT_CELL_STYLE_PROPS : _c, onRenderCheckbox = props.onRenderCheckbox, useFastIcons = props.useFastIcons, dragDropHelper = props.dragDropHelper, adjustedColumns = props.adjustedColumns, isCollapsed = props.isCollapsed, isSizing = props.isSizing, isSomeGroupExpanded = props.isSomeGroupExpanded, version = props.version, rootRef = props.rootRef, listRef = props.listRef, focusZoneRef = props.focusZoneRef, columnReorderOptions = props.columnReorderOptions, groupedListRef = props.groupedListRef, headerRef = props.headerRef, onGroupExpandStateChanged = props.onGroupExpandStateChanged, onColumnIsSizingChanged = props.onColumnIsSizingChanged, onRowDidMount = props.onRowDidMount, onRowWillUnmount = props.onRowWillUnmount, disableSelectionZone = props.disableSelectionZone, onColumnResized = props.onColumnResized, onColumnAutoResized = props.onColumnAutoResized, onToggleCollapse = props.onToggleCollapse, onActiveRowChanged = props.onActiveRowChanged, onBlur = props.onBlur, eventsToRegister = props.rowElementEventMap, onRenderMissingItem = props.onRenderMissingItem, onRenderItemColumn = props.onRenderItemColumn, getCellValueKey = props.getCellValueKey, getRowAriaLabel = props.getRowAriaLabel, getRowAriaDescribedBy = props.getRowAriaDescribedBy, checkButtonAriaLabel = props.checkButtonAriaLabel, checkboxCellClassName = props.checkboxCellClassName, useReducedRowRenderer = props.useReducedRowRenderer, enableUpdateAnimations = props.enableUpdateAnimations, enterModalSelectionOnTouch = props.enterModalSelectionOnTouch, onRenderDefaultRow = props.onRenderDefaultRow, selectionZoneRef = props.selectionZoneRef;
|
33244
|
+
var ariaLabelForListHeader = props.ariaLabelForListHeader, ariaLabelForSelectAllCheckbox = props.ariaLabelForSelectAllCheckbox, ariaLabelForSelectionColumn = props.ariaLabelForSelectionColumn, className = props.className, checkboxVisibility = props.checkboxVisibility, compact = props.compact, constrainMode = props.constrainMode, dragDropEvents = props.dragDropEvents, groups = props.groups, groupProps = props.groupProps, indentWidth = props.indentWidth, items = props.items, isPlaceholderData = props.isPlaceholderData, isHeaderVisible = props.isHeaderVisible, layoutMode = props.layoutMode, onItemInvoked = props.onItemInvoked, onItemContextMenu = props.onItemContextMenu, onColumnHeaderClick = props.onColumnHeaderClick, onColumnHeaderContextMenu = props.onColumnHeaderContextMenu, _a = props.selectionMode, selectionMode = _a === void 0 ? selection.mode : _a, selectionPreservedOnEmptyClick = props.selectionPreservedOnEmptyClick, selectionZoneProps = props.selectionZoneProps, ariaLabel = props.ariaLabel, ariaLabelForGrid = props.ariaLabelForGrid, rowElementEventMap = props.rowElementEventMap, _b = props.shouldApplyApplicationRole, shouldApplyApplicationRole = _b === void 0 ? false : _b, getKey = props.getKey, listProps = props.listProps, usePageCache = props.usePageCache, onShouldVirtualize = props.onShouldVirtualize, viewport = props.viewport, minimumPixelsForDrag = props.minimumPixelsForDrag, getGroupHeight = props.getGroupHeight, styles = props.styles, theme = props.theme, _c = props.cellStyleProps, cellStyleProps = _c === void 0 ? DetailsRow_styles_1.DEFAULT_CELL_STYLE_PROPS : _c, onRenderCheckbox = props.onRenderCheckbox, useFastIcons = props.useFastIcons, dragDropHelper = props.dragDropHelper, adjustedColumns = props.adjustedColumns, isCollapsed = props.isCollapsed, isSizing = props.isSizing, isSomeGroupExpanded = props.isSomeGroupExpanded, version = props.version, rootRef = props.rootRef, listRef = props.listRef, focusZoneRef = props.focusZoneRef, columnReorderOptions = props.columnReorderOptions, groupedListRef = props.groupedListRef, headerRef = props.headerRef, onGroupExpandStateChanged = props.onGroupExpandStateChanged, onColumnIsSizingChanged = props.onColumnIsSizingChanged, onRowDidMount = props.onRowDidMount, onRowWillUnmount = props.onRowWillUnmount, disableSelectionZone = props.disableSelectionZone, onColumnResized = props.onColumnResized, onColumnAutoResized = props.onColumnAutoResized, onToggleCollapse = props.onToggleCollapse, onActiveRowChanged = props.onActiveRowChanged, onBlur = props.onBlur, eventsToRegister = props.rowElementEventMap, onRenderMissingItem = props.onRenderMissingItem, onRenderItemColumn = props.onRenderItemColumn, getCellValueKey = props.getCellValueKey, getRowAriaLabel = props.getRowAriaLabel, getRowAriaDescribedBy = props.getRowAriaDescribedBy, checkButtonAriaLabel = props.checkButtonAriaLabel, checkButtonGroupAriaLabel = props.checkButtonGroupAriaLabel, checkboxCellClassName = props.checkboxCellClassName, useReducedRowRenderer = props.useReducedRowRenderer, enableUpdateAnimations = props.enableUpdateAnimations, enterModalSelectionOnTouch = props.enterModalSelectionOnTouch, onRenderDefaultRow = props.onRenderDefaultRow, selectionZoneRef = props.selectionZoneRef;
|
33038
33245
|
var defaultRole = 'grid';
|
33039
33246
|
var role = props.role ? props.role : defaultRole;
|
33040
33247
|
var rowId = utilities_1.getId('row');
|
@@ -33167,9 +33374,7 @@ var DetailsListInner = function (props) {
|
|
33167
33374
|
var ariaPosInSet = groupHeaderProps.ariaPosInSet, ariaSetSize = groupHeaderProps.ariaSetSize;
|
33168
33375
|
return onRenderDetailsGroupHeader(tslib_1.__assign(tslib_1.__assign({}, groupHeaderProps), { columns: adjustedColumns, groupNestingDepth: groupNestingDepth,
|
33169
33376
|
indentWidth: indentWidth,
|
33170
|
-
selection: selection,
|
33171
|
-
selectionMode: selectionMode,
|
33172
|
-
viewport: viewport,
|
33377
|
+
selection: selection, selectionMode: checkboxVisibility !== DetailsList_types_1.CheckboxVisibility.hidden ? selectionMode : index_1.SelectionMode.none, viewport: viewport,
|
33173
33378
|
checkboxVisibility: checkboxVisibility,
|
33174
33379
|
cellStyleProps: cellStyleProps, ariaColSpan: adjustedColumns.length, ariaPosInSet: undefined, ariaSetSize: undefined, ariaRowCount: ariaSetSize ? ariaSetSize + (isHeaderVisible ? 1 : 0) : undefined, ariaRowIndex: ariaPosInSet ? ariaPosInSet + (isHeaderVisible ? 1 : 0) : undefined }), defaultRender);
|
33175
33380
|
}
|
@@ -33190,8 +33395,11 @@ var DetailsListInner = function (props) {
|
|
33190
33395
|
cellStyleProps,
|
33191
33396
|
]);
|
33192
33397
|
var finalGroupProps = React.useMemo(function () {
|
33193
|
-
|
33194
|
-
|
33398
|
+
var _a, _b, _c;
|
33399
|
+
return tslib_1.__assign(tslib_1.__assign({}, groupProps), { role: role === defaultRole ? 'rowgroup' : 'presentation', onRenderFooter: finalOnRenderDetailsGroupFooter, onRenderHeader: finalOnRenderDetailsGroupHeader,
|
33400
|
+
// pass through custom group header checkbox label
|
33401
|
+
headerProps: tslib_1.__assign(tslib_1.__assign({}, (_a = groupProps) === null || _a === void 0 ? void 0 : _a.headerProps), { selectAllButtonProps: tslib_1.__assign({ 'aria-label': checkButtonGroupAriaLabel }, (_c = (_b = groupProps) === null || _b === void 0 ? void 0 : _b.headerProps) === null || _c === void 0 ? void 0 : _c.selectAllButtonProps) }) });
|
33402
|
+
}, [groupProps, finalOnRenderDetailsGroupFooter, finalOnRenderDetailsGroupHeader, checkButtonGroupAriaLabel, role]);
|
33195
33403
|
var sumColumnWidths = react_hooks_1.useConst(function () {
|
33196
33404
|
return Utilities_1.memoizeFunction(function (columns) {
|
33197
33405
|
var totalWidth = 0;
|
@@ -33211,6 +33419,7 @@ var DetailsListInner = function (props) {
|
|
33211
33419
|
var rowProps = {
|
33212
33420
|
item: item,
|
33213
33421
|
itemIndex: index,
|
33422
|
+
flatIndexOffset: isHeaderVisible ? 2 : 1,
|
33214
33423
|
compact: compact,
|
33215
33424
|
columns: adjustedColumns,
|
33216
33425
|
groupNestingDepth: nestingDepth,
|
@@ -33265,6 +33474,7 @@ var DetailsListInner = function (props) {
|
|
33265
33474
|
collapseAllVisibility,
|
33266
33475
|
getRowAriaLabel,
|
33267
33476
|
getRowAriaDescribedBy,
|
33477
|
+
isHeaderVisible,
|
33268
33478
|
checkButtonAriaLabel,
|
33269
33479
|
checkboxCellClassName,
|
33270
33480
|
useReducedRowRenderer,
|
@@ -34040,8 +34250,8 @@ var DialogBase = /** @class */ (function (_super) {
|
|
34040
34250
|
dialogDefaultMinWidth: minWidth,
|
34041
34251
|
dialogDefaultMaxWidth: maxWidth,
|
34042
34252
|
});
|
34043
|
-
return (React.createElement(Modal_1.Modal, tslib_1.__assign({ elementToFocusOnDismiss: elementToFocusOnDismiss, firstFocusableSelector: firstFocusableSelector, forceFocusInsideTrap: forceFocusInsideTrap, ignoreExternalFocusing: ignoreExternalFocusing, isClickableOutsideFocusTrap: isClickableOutsideFocusTrap,
|
34044
|
-
React.createElement(DialogContent_1.DialogContent, tslib_1.__assign({ subTextId: this._defaultSubTextId,
|
34253
|
+
return (React.createElement(Modal_1.Modal, tslib_1.__assign({ elementToFocusOnDismiss: elementToFocusOnDismiss, firstFocusableSelector: firstFocusableSelector, forceFocusInsideTrap: forceFocusInsideTrap, ignoreExternalFocusing: ignoreExternalFocusing, isClickableOutsideFocusTrap: isClickableOutsideFocusTrap, responsiveMode: responsiveMode }, mergedModalProps, { isOpen: isOpen !== undefined ? isOpen : !hidden, className: classNames.root, containerClassName: classNames.main, onDismiss: onDismiss ? onDismiss : mergedModalProps.onDismiss, subtitleAriaId: this._getSubTextId(), titleAriaId: this._getTitleTextId() }),
|
34254
|
+
React.createElement(DialogContent_1.DialogContent, tslib_1.__assign({ subTextId: this._defaultSubTextId, showCloseButton: mergedModalProps.isBlocking, onDismiss: onDismiss }, dialogContentProps), this.props.children)));
|
34045
34255
|
};
|
34046
34256
|
DialogBase.defaultProps = {
|
34047
34257
|
hidden: true,
|
@@ -34350,12 +34560,13 @@ var ModalBase = /** @class */ (function (_super) {
|
|
34350
34560
|
ModalBase.prototype.render = function () {
|
34351
34561
|
var _a = this.props, className = _a.className, containerClassName = _a.containerClassName, scrollableContentClassName = _a.scrollableContentClassName, elementToFocusOnDismiss = _a.elementToFocusOnDismiss, firstFocusableSelector = _a.firstFocusableSelector, forceFocusInsideTrap = _a.forceFocusInsideTrap, ignoreExternalFocusing = _a.ignoreExternalFocusing, isBlocking = _a.isBlocking, isClickableOutsideFocusTrap = _a.isClickableOutsideFocusTrap, isDarkOverlay = _a.isDarkOverlay, onDismiss = _a.onDismiss, layerProps = _a.layerProps, overlay = _a.overlay, responsiveMode = _a.responsiveMode, titleAriaId = _a.titleAriaId, styles = _a.styles, subtitleAriaId = _a.subtitleAriaId, theme = _a.theme, topOffsetFixed = _a.topOffsetFixed,
|
34352
34562
|
// eslint-disable-next-line deprecation/deprecation
|
34353
|
-
onLayerDidMount = _a.onLayerDidMount, isModeless = _a.isModeless, dragOptions = _a.dragOptions, enableAriaHiddenSiblings = _a.enableAriaHiddenSiblings;
|
34563
|
+
onLayerDidMount = _a.onLayerDidMount, isModeless = _a.isModeless, isAlert = _a.isAlert, dragOptions = _a.dragOptions, enableAriaHiddenSiblings = _a.enableAriaHiddenSiblings;
|
34354
34564
|
var _b = this.state, isOpen = _b.isOpen, isVisible = _b.isVisible, hasBeenOpened = _b.hasBeenOpened, modalRectangleTop = _b.modalRectangleTop, x = _b.x, y = _b.y, isInKeyboardMoveMode = _b.isInKeyboardMoveMode;
|
34355
34565
|
if (!isOpen) {
|
34356
34566
|
return null;
|
34357
34567
|
}
|
34358
34568
|
var layerClassName = layerProps === undefined ? '' : layerProps.className;
|
34569
|
+
var isAlertRole = (isAlert !== null && isAlert !== void 0 ? isAlert : (isBlocking && !isModeless));
|
34359
34570
|
var classNames = getClassNames(styles, {
|
34360
34571
|
theme: theme,
|
34361
34572
|
className: className,
|
@@ -34382,7 +34593,7 @@ var ModalBase = /** @class */ (function (_super) {
|
|
34382
34593
|
// @temp tuatology - Will adjust this to be a panel at certain breakpoints
|
34383
34594
|
if (responsiveMode >= withResponsiveMode_1.ResponsiveMode.small) {
|
34384
34595
|
return (React.createElement(Layer_1.Layer, tslib_1.__assign({}, mergedLayerProps),
|
34385
|
-
React.createElement(index_2.Popup, { role:
|
34596
|
+
React.createElement(index_2.Popup, { role: isAlertRole ? 'alertdialog' : 'dialog', "aria-modal": !isModeless, ariaLabelledBy: titleAriaId, ariaDescribedBy: subtitleAriaId, onDismiss: onDismiss, shouldRestoreFocus: !ignoreExternalFocusing },
|
34386
34597
|
React.createElement("div", { className: classNames.root, role: !isModeless ? 'document' : undefined },
|
34387
34598
|
!isModeless && (React.createElement(Overlay_1.Overlay, tslib_1.__assign({ isDarkThemed: isDarkOverlay, onClick: isBlocking ? undefined : onDismiss, allowTouchBodyScroll: this._allowTouchBodyScroll }, overlay))),
|
34388
34599
|
dragOptions ? (React.createElement(index_5.DraggableZone, { handleSelector: dragOptions.dragHandleSelector || "." + classNames.main.split(' ')[0], preventDragSelector: "button", onStart: this._onDragStart, onDragChange: this._onDrag, onStop: this._onDragStop, position: { x: x, y: y } }, modalContent)) : (modalContent)))));
|
@@ -34692,7 +34903,7 @@ var DialogContentBase = /** @class */ (function (_super) {
|
|
34692
34903
|
React.createElement("div", tslib_1.__assign({ id: titleId, role: "heading", "aria-level": 1 }, titleProps, { className: Utilities_1.css(classNames.title, titleProps.className) }), title),
|
34693
34904
|
React.createElement("div", { className: classNames.topButton },
|
34694
34905
|
this.props.topButtonsProps.map(function (props, index) { return (React.createElement(Button_1.IconButton, tslib_1.__assign({ key: props.uniqueId || index }, props))); }),
|
34695
|
-
(type === DialogContent_types_1.DialogType.close || (showCloseButton && type !== DialogContent_types_1.DialogType.largeHeader)) && (React.createElement(Button_1.IconButton, { className: classNames.button, iconProps: { iconName: 'Cancel' }, ariaLabel: closeButtonAriaLabel, onClick: onDismiss
|
34906
|
+
(type === DialogContent_types_1.DialogType.close || (showCloseButton && type !== DialogContent_types_1.DialogType.largeHeader)) && (React.createElement(Button_1.IconButton, { className: classNames.button, iconProps: { iconName: 'Cancel' }, ariaLabel: closeButtonAriaLabel, onClick: onDismiss })))),
|
34696
34907
|
React.createElement("div", { className: classNames.inner },
|
34697
34908
|
React.createElement("div", { className: classNames.innerContent },
|
34698
34909
|
subTextContent,
|
@@ -35269,13 +35480,10 @@ var DropdownBase = /** @class */ (function (_super) {
|
|
35269
35480
|
// eslint-disable-next-line react/jsx-no-bind
|
35270
35481
|
onMouseLeave: _this._onMouseItemLeave.bind(_this, item),
|
35271
35482
|
// eslint-disable-next-line react/jsx-no-bind
|
35272
|
-
onMouseMove: _this._onItemMouseMove.bind(_this, item), role: "option", "aria-selected": isItemSelected ? 'true' : 'false', ariaLabel: item.ariaLabel, title: title, "aria-posinset": _this._sizePosCache.positionInSet(item.index), "aria-setsize": _this._sizePosCache.optionSetSize }, onRenderOption(item, _this._onRenderOption))) : (React.createElement(Checkbox_1.Checkbox, { id: _this._listId + item.index, key: item.key,
|
35273
|
-
'
|
35274
|
-
|
35275
|
-
|
35276
|
-
onMouseMove: _this._onItemMouseMove.bind(_this, item),
|
35277
|
-
role: 'option',
|
35278
|
-
}, label: item.text, title: title,
|
35483
|
+
onMouseMove: _this._onItemMouseMove.bind(_this, item), role: "option", "aria-selected": isItemSelected ? 'true' : 'false', ariaLabel: item.ariaLabel, title: title, "aria-posinset": _this._sizePosCache.positionInSet(item.index), "aria-setsize": _this._sizePosCache.optionSetSize }, onRenderOption(item, _this._onRenderOption))) : (React.createElement(Checkbox_1.Checkbox, { id: _this._listId + item.index, key: item.key, disabled: item.disabled, onChange: _this._onItemClick(item), inputProps: tslib_1.__assign({ 'aria-selected': isItemSelected, onMouseEnter: _this._onItemMouseEnter.bind(_this, item), onMouseLeave: _this._onMouseItemLeave.bind(_this, item), onMouseMove: _this._onItemMouseMove.bind(_this, item), role: 'option' }, {
|
35484
|
+
'data-index': item.index,
|
35485
|
+
'data-is-focusable': !item.disabled,
|
35486
|
+
}), label: item.text, title: title,
|
35279
35487
|
// eslint-disable-next-line react/jsx-no-bind
|
35280
35488
|
onRenderLabel: _this._onRenderItemLabel.bind(_this, item), className: itemClassName, checked: isItemSelected, styles: multiSelectItemStyles, ariaPositionInSet: _this._sizePosCache.positionInSet(item.index), ariaSetSize: _this._sizePosCache.optionSetSize }));
|
35281
35489
|
};
|
@@ -41608,9 +41816,13 @@ var SliderBase = /** @class */ (function (_super) {
|
|
41608
41816
|
break;
|
41609
41817
|
case Utilities_1.KeyCodes.home:
|
41610
41818
|
value = min;
|
41819
|
+
_this._clearOnKeyDownTimer();
|
41820
|
+
_this._setOnKeyDownTimer(event);
|
41611
41821
|
break;
|
41612
41822
|
case Utilities_1.KeyCodes.end:
|
41613
41823
|
value = max;
|
41824
|
+
_this._clearOnKeyDownTimer();
|
41825
|
+
_this._setOnKeyDownTimer(event);
|
41614
41826
|
break;
|
41615
41827
|
default:
|
41616
41828
|
return;
|
@@ -42697,7 +42909,7 @@ var TeachingBubbleContentBase = /** @class */ (function (_super) {
|
|
42697
42909
|
if (headline) {
|
42698
42910
|
var HeaderWrapperAs = typeof headline === 'string' ? 'p' : 'div';
|
42699
42911
|
headerContent = (React.createElement("div", { className: classNames.header },
|
42700
|
-
React.createElement(HeaderWrapperAs, { role: "heading", className: classNames.headline, id: ariaLabelledBy }, headline)));
|
42912
|
+
React.createElement(HeaderWrapperAs, { role: "heading", "aria-level": 3, className: classNames.headline, id: ariaLabelledBy }, headline)));
|
42701
42913
|
}
|
42702
42914
|
if (children) {
|
42703
42915
|
var BodyContentWrapperAs = typeof children === 'string' ? 'p' : 'div';
|
@@ -49122,7 +49334,7 @@ var Selection = /** @class */ (function () {
|
|
49122
49334
|
) {
|
49123
49335
|
options[_i] = arguments[_i]; // Otherwise, arguments require options with `getKey`.
|
49124
49336
|
}
|
49125
|
-
var _a = options[0] || {}, onSelectionChanged = _a.onSelectionChanged, getKey = _a.getKey, _b = _a.canSelectItem, canSelectItem = _b === void 0 ? function () { return true; } : _b, items = _a.items, _c = _a.selectionMode, selectionMode = _c === void 0 ? Selection_types_1.SelectionMode.multiple : _c;
|
49337
|
+
var _a = options[0] || {}, onSelectionChanged = _a.onSelectionChanged, onItemsChanged = _a.onItemsChanged, getKey = _a.getKey, _b = _a.canSelectItem, canSelectItem = _b === void 0 ? function () { return true; } : _b, items = _a.items, _c = _a.selectionMode, selectionMode = _c === void 0 ? Selection_types_1.SelectionMode.multiple : _c;
|
49126
49338
|
this.mode = selectionMode;
|
49127
49339
|
this._getKey = getKey || defaultGetKey;
|
49128
49340
|
this._changeEventSuppressionCount = 0;
|
@@ -49130,7 +49342,9 @@ var Selection = /** @class */ (function () {
|
|
49130
49342
|
this._anchoredIndex = 0;
|
49131
49343
|
this._unselectableCount = 0;
|
49132
49344
|
this._onSelectionChanged = onSelectionChanged;
|
49345
|
+
this._onItemsChanged = onItemsChanged;
|
49133
49346
|
this._canSelectItem = canSelectItem;
|
49347
|
+
this._keyToIndexMap = {};
|
49134
49348
|
this._isModal = false;
|
49135
49349
|
this.setItems(items || [], true);
|
49136
49350
|
this.count = this.getSelectedCount();
|
@@ -49182,12 +49396,16 @@ var Selection = /** @class */ (function () {
|
|
49182
49396
|
this.setChangeEvents(false);
|
49183
49397
|
// Reset the unselectable count.
|
49184
49398
|
this._unselectableCount = 0;
|
49399
|
+
var haveItemsChanged = false;
|
49185
49400
|
// Build lookup table for quick selection evaluation.
|
49186
49401
|
for (var i = 0; i < items.length; i++) {
|
49187
49402
|
var item = items[i];
|
49188
49403
|
if (item) {
|
49189
49404
|
var key = this.getKey(item, i);
|
49190
49405
|
if (key) {
|
49406
|
+
if (!haveItemsChanged && (!(key in this._keyToIndexMap) || this._keyToIndexMap[key] !== i)) {
|
49407
|
+
haveItemsChanged = true;
|
49408
|
+
}
|
49191
49409
|
newKeyToIndexMap[key] = i;
|
49192
49410
|
}
|
49193
49411
|
}
|
@@ -49224,6 +49442,15 @@ var Selection = /** @class */ (function () {
|
|
49224
49442
|
// If everything was selected but the number of items has changed, selection has changed.
|
49225
49443
|
hasSelectionChanged = true;
|
49226
49444
|
}
|
49445
|
+
if (!haveItemsChanged) {
|
49446
|
+
for (var _i = 0, _a = Object.keys(this._keyToIndexMap); _i < _a.length; _i++) {
|
49447
|
+
var key = _a[_i];
|
49448
|
+
if (!(key in newKeyToIndexMap)) {
|
49449
|
+
haveItemsChanged = true;
|
49450
|
+
break;
|
49451
|
+
}
|
49452
|
+
}
|
49453
|
+
}
|
49227
49454
|
this._exemptedIndices = newExemptedIndicies;
|
49228
49455
|
this._exemptedCount = newExemptedCount;
|
49229
49456
|
this._keyToIndexMap = newKeyToIndexMap;
|
@@ -49232,6 +49459,14 @@ var Selection = /** @class */ (function () {
|
|
49232
49459
|
this._selectedItems = null;
|
49233
49460
|
if (hasSelectionChanged) {
|
49234
49461
|
this._updateCount();
|
49462
|
+
}
|
49463
|
+
if (haveItemsChanged) {
|
49464
|
+
EventGroup_1.EventGroup.raise(this, Selection_types_1.SELECTION_ITEMS_CHANGE);
|
49465
|
+
if (this._onItemsChanged) {
|
49466
|
+
this._onItemsChanged();
|
49467
|
+
}
|
49468
|
+
}
|
49469
|
+
if (hasSelectionChanged) {
|
49235
49470
|
this._change();
|
49236
49471
|
}
|
49237
49472
|
this.setChangeEvents(true);
|
@@ -49272,6 +49507,10 @@ var Selection = /** @class */ (function () {
|
|
49272
49507
|
}
|
49273
49508
|
return this._selectedIndices;
|
49274
49509
|
};
|
49510
|
+
Selection.prototype.getItemIndex = function (key) {
|
49511
|
+
var index = this._keyToIndexMap[key];
|
49512
|
+
return (index !== null && index !== void 0 ? index : -1);
|
49513
|
+
};
|
49275
49514
|
Selection.prototype.isRangeSelected = function (fromIndex, count) {
|
49276
49515
|
if (count === 0) {
|
49277
49516
|
return false;
|
@@ -51421,7 +51660,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
51421
51660
|
// Do not modify this file; it is generated as part of publish.
|
51422
51661
|
// The checked in version is a placeholder only and will not be updated.
|
51423
51662
|
var set_version_1 = __webpack_require__(57);
|
51424
|
-
set_version_1.setVersion('@uifabric/styling', '7.
|
51663
|
+
set_version_1.setVersion('@uifabric/styling', '7.20.0');
|
51425
51664
|
|
51426
51665
|
|
51427
51666
|
/***/ }),
|
@@ -51703,20 +51942,31 @@ var Utilities_1 = __webpack_require__(3);
|
|
51703
51942
|
var Layer_notification_1 = __webpack_require__(685);
|
51704
51943
|
var LayerHost = /** @class */ (function (_super) {
|
51705
51944
|
tslib_1.__extends(LayerHost, _super);
|
51706
|
-
function LayerHost() {
|
51707
|
-
|
51945
|
+
function LayerHost(props) {
|
51946
|
+
var _this = _super.call(this, props) || this;
|
51947
|
+
var layerHostId = Utilities_1.getId();
|
51948
|
+
var _a = _this.props.id, hostId = _a === void 0 ? layerHostId : _a;
|
51949
|
+
_this.hostId = hostId;
|
51950
|
+
_this.rootRef = React.createRef();
|
51951
|
+
Utilities_1.initializeComponentRef(_this);
|
51952
|
+
return _this;
|
51708
51953
|
}
|
51954
|
+
LayerHost.prototype.notifyLayersChanged = function () {
|
51955
|
+
// Nothing, since the default implementation of Layer Host does not need to react to layer changes.
|
51956
|
+
};
|
51709
51957
|
LayerHost.prototype.shouldComponentUpdate = function () {
|
51710
51958
|
return false;
|
51711
51959
|
};
|
51712
51960
|
LayerHost.prototype.componentDidMount = function () {
|
51961
|
+
Layer_notification_1.registerLayerHost(this.hostId, this);
|
51713
51962
|
Layer_notification_1.notifyHostChanged(this.props.id);
|
51714
51963
|
};
|
51715
51964
|
LayerHost.prototype.componentWillUnmount = function () {
|
51965
|
+
Layer_notification_1.unregisterLayerHost(this.hostId, this);
|
51716
51966
|
Layer_notification_1.notifyHostChanged(this.props.id);
|
51717
51967
|
};
|
51718
51968
|
LayerHost.prototype.render = function () {
|
51719
|
-
return React.createElement("div", tslib_1.__assign({}, this.props, { className: Utilities_1.css('ms-LayerHost', this.props.className) }));
|
51969
|
+
return React.createElement("div", tslib_1.__assign({}, this.props, { className: Utilities_1.css('ms-LayerHost', this.props.className), ref: this.rootRef }));
|
51720
51970
|
};
|
51721
51971
|
return LayerHost;
|
51722
51972
|
}(React.Component));
|
@@ -52619,7 +52869,11 @@ function onRenderSubMenu(subMenuProps) {
|
|
52619
52869
|
return React.createElement(LocalContextualMenu, tslib_1.__assign({}, subMenuProps));
|
52620
52870
|
}
|
52621
52871
|
// This is to prevent cyclic import with ContextualMenu.base.tsx.
|
52622
|
-
var LocalContextualMenu = Utilities_1.styled(ContextualMenu_base_1.ContextualMenuBase, ContextualMenu_styles_1.getStyles, function () { return ({
|
52872
|
+
var LocalContextualMenu = Utilities_1.styled(ContextualMenu_base_1.ContextualMenuBase, ContextualMenu_styles_1.getStyles, function (props) { return ({
|
52873
|
+
onRenderSubMenu: props.onRenderSubMenu
|
52874
|
+
? Utilities_1.composeRenderFunction(props.onRenderSubMenu, onRenderSubMenu)
|
52875
|
+
: onRenderSubMenu,
|
52876
|
+
}); }, { scope: 'ContextualMenu' });
|
52623
52877
|
/**
|
52624
52878
|
* ContextualMenu description
|
52625
52879
|
*/
|
@@ -52647,7 +52901,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
52647
52901
|
// Do not modify this file; it is generated as part of publish.
|
52648
52902
|
// The checked in version is a placeholder only and will not be updated.
|
52649
52903
|
var set_version_1 = __webpack_require__(57);
|
52650
|
-
set_version_1.setVersion('@fluentui/react-focus', '7.18.
|
52904
|
+
set_version_1.setVersion('@fluentui/react-focus', '7.18.2');
|
52651
52905
|
|
52652
52906
|
|
52653
52907
|
/***/ }),
|
@@ -52685,6 +52939,35 @@ var LARGE_DISTANCE_FROM_CENTER = 999999999;
|
|
52685
52939
|
var LARGE_NEGATIVE_DISTANCE_FROM_CENTER = -999999999;
|
52686
52940
|
var focusZoneStyles;
|
52687
52941
|
var focusZoneClass = 'ms-FocusZone';
|
52942
|
+
/**
|
52943
|
+
* Raises a click on a target element based on a keyboard event.
|
52944
|
+
*/
|
52945
|
+
function raiseClickFromKeyboardEvent(target, ev) {
|
52946
|
+
var _a, _b, _c, _d, _e, _f;
|
52947
|
+
var event;
|
52948
|
+
if (typeof MouseEvent === 'function') {
|
52949
|
+
event = new MouseEvent('click', {
|
52950
|
+
ctrlKey: (_a = ev) === null || _a === void 0 ? void 0 : _a.ctrlKey,
|
52951
|
+
metaKey: (_b = ev) === null || _b === void 0 ? void 0 : _b.metaKey,
|
52952
|
+
shiftKey: (_c = ev) === null || _c === void 0 ? void 0 : _c.shiftKey,
|
52953
|
+
altKey: (_d = ev) === null || _d === void 0 ? void 0 : _d.altKey,
|
52954
|
+
bubbles: (_e = ev) === null || _e === void 0 ? void 0 : _e.bubbles,
|
52955
|
+
cancelable: (_f = ev) === null || _f === void 0 ? void 0 : _f.cancelable,
|
52956
|
+
});
|
52957
|
+
}
|
52958
|
+
else {
|
52959
|
+
event = document.createEvent('MouseEvents');
|
52960
|
+
event.initMouseEvent('click', ev ? ev.bubbles : false, ev ? ev.cancelable : false, window, // not using getWindow() since this can only be run client side
|
52961
|
+
0, // detail
|
52962
|
+
0, // screen x
|
52963
|
+
0, // screen y
|
52964
|
+
0, // client x
|
52965
|
+
0, // client y
|
52966
|
+
ev ? ev.ctrlKey : false, ev ? ev.altKey : false, ev ? ev.shiftKey : false, ev ? ev.metaKey : false, 0, // button
|
52967
|
+
null);
|
52968
|
+
}
|
52969
|
+
target.dispatchEvent(event);
|
52970
|
+
}
|
52688
52971
|
// Helper function that will return a class for when the root is focused
|
52689
52972
|
function getRootClass() {
|
52690
52973
|
if (!focusZoneStyles) {
|
@@ -52856,7 +53139,7 @@ var FocusZone = /** @class */ (function (_super) {
|
|
52856
53139
|
// eslint-disable-next-line @fluentui/deprecated-keyboard-event-props
|
52857
53140
|
switch (ev.which) {
|
52858
53141
|
case utilities_1.KeyCodes.space:
|
52859
|
-
if (_this._tryInvokeClickForFocusable(ev.target)) {
|
53142
|
+
if (_this._tryInvokeClickForFocusable(ev.target, ev)) {
|
52860
53143
|
break;
|
52861
53144
|
}
|
52862
53145
|
return;
|
@@ -52954,7 +53237,7 @@ var FocusZone = /** @class */ (function (_super) {
|
|
52954
53237
|
}
|
52955
53238
|
return;
|
52956
53239
|
case utilities_1.KeyCodes.enter:
|
52957
|
-
if (_this._tryInvokeClickForFocusable(ev.target)) {
|
53240
|
+
if (_this._tryInvokeClickForFocusable(ev.target, ev)) {
|
52958
53241
|
break;
|
52959
53242
|
}
|
52960
53243
|
return;
|
@@ -53257,7 +53540,8 @@ var FocusZone = /** @class */ (function (_super) {
|
|
53257
53540
|
/**
|
53258
53541
|
* Walk up the dom try to find a focusable element.
|
53259
53542
|
*/
|
53260
|
-
FocusZone.prototype._tryInvokeClickForFocusable = function (
|
53543
|
+
FocusZone.prototype._tryInvokeClickForFocusable = function (targetElement, ev) {
|
53544
|
+
var target = targetElement;
|
53261
53545
|
if (target === this._root.current || !this.props.shouldRaiseClicks) {
|
53262
53546
|
return false;
|
53263
53547
|
}
|
@@ -53271,7 +53555,7 @@ var FocusZone = /** @class */ (function (_super) {
|
|
53271
53555
|
if (this._isImmediateDescendantOfZone(target) &&
|
53272
53556
|
target.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' &&
|
53273
53557
|
target.getAttribute(IS_ENTER_DISABLED_ATTRIBUTE) !== 'true') {
|
53274
|
-
|
53558
|
+
raiseClickFromKeyboardEvent(target, ev);
|
53275
53559
|
return true;
|
53276
53560
|
}
|
53277
53561
|
target = utilities_1.getParent(target, ALLOW_VIRTUAL_ELEMENTS);
|
@@ -53746,6 +54030,7 @@ function getIsChecked(item) {
|
|
53746
54030
|
}
|
53747
54031
|
exports.getIsChecked = getIsChecked;
|
53748
54032
|
function hasSubmenu(item) {
|
54033
|
+
// eslint-disable-next-line deprecation/deprecation
|
53749
54034
|
return !!(item.subMenuProps || item.items);
|
53750
54035
|
}
|
53751
54036
|
exports.hasSubmenu = hasSubmenu;
|
@@ -55127,7 +55412,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
55127
55412
|
// Do not modify this file; it is generated as part of publish.
|
55128
55413
|
// The checked in version is a placeholder only and will not be updated.
|
55129
55414
|
var set_version_1 = __webpack_require__(57);
|
55130
|
-
set_version_1.setVersion('@fluentui/react-theme-provider', '0.19.
|
55415
|
+
set_version_1.setVersion('@fluentui/react-theme-provider', '0.19.1');
|
55131
55416
|
|
55132
55417
|
|
55133
55418
|
/***/ }),
|
@@ -56096,7 +56381,7 @@ exports.AzureCustomizationsHighContrastDark = {
|
|
56096
56381
|
|
56097
56382
|
Object.defineProperty(exports, "__esModule", { value: true });
|
56098
56383
|
var tslib_1 = __webpack_require__(2);
|
56099
|
-
var StyleConstants = __webpack_require__(
|
56384
|
+
var StyleConstants = __webpack_require__(30);
|
56100
56385
|
exports.ActionButtonStyles = function (theme) {
|
56101
56386
|
var semanticColors = theme.semanticColors;
|
56102
56387
|
var extendedSemanticColors = semanticColors;
|
@@ -56243,7 +56528,7 @@ exports.CalloutContentStyles = function (props) {
|
|
56243
56528
|
|
56244
56529
|
Object.defineProperty(exports, "__esModule", { value: true });
|
56245
56530
|
var AzureColors_1 = __webpack_require__(86);
|
56246
|
-
var StyleConstants = __webpack_require__(
|
56531
|
+
var StyleConstants = __webpack_require__(30);
|
56247
56532
|
exports.CheckboxStyles = function (props) {
|
56248
56533
|
var _a;
|
56249
56534
|
var disabled = props.disabled, checked = props.checked, theme = props.theme, indeterminate = props.indeterminate;
|
@@ -56363,7 +56648,7 @@ exports.CheckboxStyles = function (props) {
|
|
56363
56648
|
|
56364
56649
|
Object.defineProperty(exports, "__esModule", { value: true });
|
56365
56650
|
var AzureType_1 = __webpack_require__(115);
|
56366
|
-
var StyleConstants = __webpack_require__(
|
56651
|
+
var StyleConstants = __webpack_require__(30);
|
56367
56652
|
exports.CheckStyles = function (props) {
|
56368
56653
|
var theme = props.theme, checked = props.checked;
|
56369
56654
|
var semanticColors = theme.semanticColors;
|
@@ -56544,7 +56829,7 @@ exports.DetailsRowStyles = function (props) {
|
|
56544
56829
|
"use strict";
|
56545
56830
|
|
56546
56831
|
Object.defineProperty(exports, "__esModule", { value: true });
|
56547
|
-
var StyleConstants = __webpack_require__(
|
56832
|
+
var StyleConstants = __webpack_require__(30);
|
56548
56833
|
exports.ChoiceGroupOptionStyles = function (props) {
|
56549
56834
|
var checked = props.checked, disabled = props.disabled, theme = props.theme, hasIcon = props.hasIcon, hasImage = props.hasImage;
|
56550
56835
|
var semanticColors = theme.semanticColors;
|
@@ -56578,6 +56863,8 @@ exports.ChoiceGroupOptionStyles = function (props) {
|
|
56578
56863
|
// The circle
|
56579
56864
|
':before': [
|
56580
56865
|
{
|
56866
|
+
width: StyleConstants.choiceGroupDimensions,
|
56867
|
+
height: StyleConstants.choiceGroupDimensions,
|
56581
56868
|
borderColor: semanticColors.bodyText,
|
56582
56869
|
},
|
56583
56870
|
checked && {
|
@@ -56598,6 +56885,8 @@ exports.ChoiceGroupOptionStyles = function (props) {
|
|
56598
56885
|
':after': [
|
56599
56886
|
{
|
56600
56887
|
borderColor: extendedSemanticColors.checkboxBorderChecked,
|
56888
|
+
top: 4,
|
56889
|
+
left: 4,
|
56601
56890
|
},
|
56602
56891
|
checked &&
|
56603
56892
|
disabled && {
|
@@ -56619,6 +56908,8 @@ exports.ChoiceGroupOptionStyles = function (props) {
|
|
56619
56908
|
':after': {
|
56620
56909
|
borderColor: extendedSemanticColors.checkboxBorderChecked,
|
56621
56910
|
backgroundColor: extendedSemanticColors.choiceGroupUncheckedDotHover,
|
56911
|
+
top: 4,
|
56912
|
+
left: 4,
|
56622
56913
|
},
|
56623
56914
|
},
|
56624
56915
|
},
|
@@ -56779,7 +57070,7 @@ exports.ColorSliderStyles = function (props) {
|
|
56779
57070
|
|
56780
57071
|
Object.defineProperty(exports, "__esModule", { value: true });
|
56781
57072
|
var AzureDepths_1 = __webpack_require__(116);
|
56782
|
-
var StyleConstants = __webpack_require__(
|
57073
|
+
var StyleConstants = __webpack_require__(30);
|
56783
57074
|
exports.ComboBoxStyles = function (theme) {
|
56784
57075
|
var semanticColors = theme.semanticColors;
|
56785
57076
|
var extendedSemanticColors = semanticColors;
|
@@ -57058,7 +57349,7 @@ exports.CommandBarButtonStyles = function (theme) {
|
|
57058
57349
|
|
57059
57350
|
Object.defineProperty(exports, "__esModule", { value: true });
|
57060
57351
|
var tslib_1 = __webpack_require__(2);
|
57061
|
-
var StyleConstants = __webpack_require__(
|
57352
|
+
var StyleConstants = __webpack_require__(30);
|
57062
57353
|
exports.CompoundButtonStyles = function (theme) {
|
57063
57354
|
var semanticColors = theme.semanticColors;
|
57064
57355
|
var extendedSemanticColors = semanticColors;
|
@@ -57178,7 +57469,7 @@ exports.CompoundButtonStyles = function (theme) {
|
|
57178
57469
|
|
57179
57470
|
Object.defineProperty(exports, "__esModule", { value: true });
|
57180
57471
|
var AzureDepths_1 = __webpack_require__(116);
|
57181
|
-
var StyleConstants = __webpack_require__(
|
57472
|
+
var StyleConstants = __webpack_require__(30);
|
57182
57473
|
exports.ContextualMenuStyles = function (props) {
|
57183
57474
|
var theme = props.theme;
|
57184
57475
|
var semanticColors = theme.semanticColors;
|
@@ -57252,7 +57543,7 @@ exports.ContextualMenuStyles = function (props) {
|
|
57252
57543
|
|
57253
57544
|
Object.defineProperty(exports, "__esModule", { value: true });
|
57254
57545
|
var tslib_1 = __webpack_require__(2);
|
57255
|
-
var StyleConstants = __webpack_require__(
|
57546
|
+
var StyleConstants = __webpack_require__(30);
|
57256
57547
|
var AzureColors_1 = __webpack_require__(86);
|
57257
57548
|
exports.DatePickerStyles = function (props) {
|
57258
57549
|
var disabled = props.disabled, theme = props.theme;
|
@@ -57393,7 +57684,7 @@ exports.DatePickerStyles = function (props) {
|
|
57393
57684
|
"use strict";
|
57394
57685
|
|
57395
57686
|
Object.defineProperty(exports, "__esModule", { value: true });
|
57396
|
-
var StyleConstants = __webpack_require__(
|
57687
|
+
var StyleConstants = __webpack_require__(30);
|
57397
57688
|
exports.DefaultButtonStyles = function (theme) {
|
57398
57689
|
var semanticColors = theme.semanticColors;
|
57399
57690
|
var extendedSemanticColors = semanticColors;
|
@@ -57832,7 +58123,7 @@ exports.DocumentCardStyles = function (props) {
|
|
57832
58123
|
|
57833
58124
|
Object.defineProperty(exports, "__esModule", { value: true });
|
57834
58125
|
var AzureDepths_1 = __webpack_require__(116);
|
57835
|
-
var StyleConstants = __webpack_require__(
|
58126
|
+
var StyleConstants = __webpack_require__(30);
|
57836
58127
|
exports.DropdownStyles = function (props) {
|
57837
58128
|
var _a, _b, _c, _d;
|
57838
58129
|
var disabled = props.disabled, theme = props.theme, hasError = props.hasError, isOpen = props.isOpen;
|
@@ -58031,7 +58322,7 @@ exports.DropdownStyles = function (props) {
|
|
58031
58322
|
"use strict";
|
58032
58323
|
|
58033
58324
|
Object.defineProperty(exports, "__esModule", { value: true });
|
58034
|
-
var StyleConstants = __webpack_require__(
|
58325
|
+
var StyleConstants = __webpack_require__(30);
|
58035
58326
|
exports.IconButtonStyles = function (theme) {
|
58036
58327
|
var semanticColors = theme.semanticColors;
|
58037
58328
|
var extendedSemanticColors = semanticColors;
|
@@ -59147,7 +59438,7 @@ exports.getStyles = function (props) {
|
|
59147
59438
|
|
59148
59439
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59149
59440
|
var AzureDepths_1 = __webpack_require__(116);
|
59150
|
-
var StyleConstants = __webpack_require__(
|
59441
|
+
var StyleConstants = __webpack_require__(30);
|
59151
59442
|
exports.ModalStyles = function (props) {
|
59152
59443
|
var theme = props.theme;
|
59153
59444
|
var semanticColors = theme.semanticColors;
|
@@ -59196,7 +59487,7 @@ exports.OverlayStyles = function (props) {
|
|
59196
59487
|
"use strict";
|
59197
59488
|
|
59198
59489
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59199
|
-
var Constants_1 = __webpack_require__(
|
59490
|
+
var Constants_1 = __webpack_require__(30);
|
59200
59491
|
exports.NavStyles = function (props) {
|
59201
59492
|
var theme = props.theme;
|
59202
59493
|
var semanticColors = theme.semanticColors;
|
@@ -59270,7 +59561,7 @@ exports.PanelStyles = function (props) {
|
|
59270
59561
|
"use strict";
|
59271
59562
|
|
59272
59563
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59273
|
-
var StyleConstants = __webpack_require__(
|
59564
|
+
var StyleConstants = __webpack_require__(30);
|
59274
59565
|
exports.PivotStyles = function (props) {
|
59275
59566
|
var theme = props.theme, rootIsTabs = props.rootIsTabs, rootIsLarge = props.rootIsLarge;
|
59276
59567
|
var semanticColors = theme.semanticColors;
|
@@ -59425,7 +59716,7 @@ exports.PivotStyles = function (props) {
|
|
59425
59716
|
"use strict";
|
59426
59717
|
|
59427
59718
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59428
|
-
var StyleConstants = __webpack_require__(
|
59719
|
+
var StyleConstants = __webpack_require__(30);
|
59429
59720
|
exports.ExpandingCardStyles = function (props) {
|
59430
59721
|
var theme = props.theme;
|
59431
59722
|
var semanticColors = theme.semanticColors;
|
@@ -59465,7 +59756,7 @@ exports.PlainCardStyles = function (props) {
|
|
59465
59756
|
"use strict";
|
59466
59757
|
|
59467
59758
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59468
|
-
var StyleConstants = __webpack_require__(
|
59759
|
+
var StyleConstants = __webpack_require__(30);
|
59469
59760
|
exports.PrimaryButtonStyles = function (theme) {
|
59470
59761
|
var semanticColors = theme.semanticColors;
|
59471
59762
|
var extendedSemanticColors = semanticColors;
|
@@ -59589,7 +59880,7 @@ exports.RatingStyles = function (props) {
|
|
59589
59880
|
"use strict";
|
59590
59881
|
|
59591
59882
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59592
|
-
var StyleConstants = __webpack_require__(
|
59883
|
+
var StyleConstants = __webpack_require__(30);
|
59593
59884
|
exports.SearchBoxStyles = function (props) {
|
59594
59885
|
var theme = props.theme, hasFocus = props.hasFocus;
|
59595
59886
|
var semanticColors = theme.semanticColors;
|
@@ -59650,7 +59941,7 @@ exports.SearchBoxStyles = function (props) {
|
|
59650
59941
|
"use strict";
|
59651
59942
|
|
59652
59943
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59653
|
-
var StyleConstants = __webpack_require__(
|
59944
|
+
var StyleConstants = __webpack_require__(30);
|
59654
59945
|
var SLIDER_BOX_DIMENSION = 8;
|
59655
59946
|
var SLIDER_DIAMETER = 16;
|
59656
59947
|
var SLIDER_BORDER_RADIUS = 10;
|
@@ -59876,7 +60167,7 @@ exports.SuggestionsStyles = function (props) {
|
|
59876
60167
|
"use strict";
|
59877
60168
|
|
59878
60169
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59879
|
-
var Constants_1 = __webpack_require__(
|
60170
|
+
var Constants_1 = __webpack_require__(30);
|
59880
60171
|
exports.TagItemStyles = function (props) {
|
59881
60172
|
var theme = props.theme, selected = props.selected;
|
59882
60173
|
if (!theme) {
|
@@ -59928,7 +60219,7 @@ exports.TagItemStyles = function (props) {
|
|
59928
60219
|
"use strict";
|
59929
60220
|
|
59930
60221
|
Object.defineProperty(exports, "__esModule", { value: true });
|
59931
|
-
var StyleConstants = __webpack_require__(
|
60222
|
+
var StyleConstants = __webpack_require__(30);
|
59932
60223
|
exports.TagPickerStyles = function (props) {
|
59933
60224
|
var theme = props.theme;
|
59934
60225
|
if (!theme) {
|
@@ -60090,7 +60381,7 @@ exports.TeachingBubbleStyles = function (props) {
|
|
60090
60381
|
"use strict";
|
60091
60382
|
|
60092
60383
|
Object.defineProperty(exports, "__esModule", { value: true });
|
60093
|
-
var StyleConstants = __webpack_require__(
|
60384
|
+
var StyleConstants = __webpack_require__(30);
|
60094
60385
|
exports.TextFieldStyles = function (props) {
|
60095
60386
|
var focused = props.focused, disabled = props.disabled, hasErrorMessage = props.hasErrorMessage, multiline = props.multiline, theme = props.theme;
|
60096
60387
|
var semanticColors = theme.semanticColors;
|
@@ -60182,7 +60473,7 @@ exports.TextFieldStyles = function (props) {
|
|
60182
60473
|
"use strict";
|
60183
60474
|
|
60184
60475
|
Object.defineProperty(exports, "__esModule", { value: true });
|
60185
|
-
var StyleConstants = __webpack_require__(
|
60476
|
+
var StyleConstants = __webpack_require__(30);
|
60186
60477
|
exports.ToggleStyles = function (props) {
|
60187
60478
|
var theme = props.theme, disabled = props.disabled, checked = props.checked;
|
60188
60479
|
var semanticColors = theme.semanticColors;
|
@@ -60308,10 +60599,19 @@ exports.ToggleStyles = function (props) {
|
|
60308
60599
|
"use strict";
|
60309
60600
|
|
60310
60601
|
Object.defineProperty(exports, "__esModule", { value: true });
|
60602
|
+
var StyleConstants = __webpack_require__(30);
|
60311
60603
|
exports.TooltipStyles = function (props) {
|
60604
|
+
var theme = props.theme;
|
60605
|
+
var semanticColors = theme.semanticColors;
|
60606
|
+
var extendedSemanticColors = semanticColors;
|
60312
60607
|
return {
|
60313
60608
|
root: {
|
60314
60609
|
maxWidth: '480px',
|
60610
|
+
padding: 0,
|
60611
|
+
},
|
60612
|
+
content: {
|
60613
|
+
backgroundColor: extendedSemanticColors.controlBackground,
|
60614
|
+
padding: StyleConstants.inputControlPadding,
|
60315
60615
|
},
|
60316
60616
|
};
|
60317
60617
|
};
|
@@ -69036,9 +69336,9 @@ var SelectionZone = /** @class */ (function (_super) {
|
|
69036
69336
|
}
|
69037
69337
|
};
|
69038
69338
|
SelectionZone.prototype._clearAndSelectIndex = function (index) {
|
69039
|
-
var
|
69339
|
+
var _a = this.props, selection = _a.selection, _b = _a.selectionClearedOnSurfaceClick, selectionClearedOnSurfaceClick = _b === void 0 ? true : _b;
|
69040
69340
|
var isAlreadySingleSelected = selection.getSelectedCount() === 1 && selection.isIndexSelected(index);
|
69041
|
-
if (!isAlreadySingleSelected) {
|
69341
|
+
if (!isAlreadySingleSelected && selectionClearedOnSurfaceClick) {
|
69042
69342
|
var isModal = selection.isModal && selection.isModal();
|
69043
69343
|
selection.setChangeEvents(false);
|
69044
69344
|
selection.setAllSelected(false);
|
@@ -69606,7 +69906,7 @@ var GroupHeaderBase = /** @class */ (function (_super) {
|
|
69606
69906
|
return (React.createElement("div", { className: this._classNames.root, style: viewport ? { minWidth: viewport.width } : {}, onClick: this._onHeaderClick, role: "row", "aria-setsize": ariaSetSize, "aria-posinset": ariaPosInSet, "data-is-focusable": true, onKeyUp: this._onKeyUp, "aria-label": group.ariaLabel, "aria-labelledby": group.ariaLabel ? undefined : this._id, "aria-expanded": !this.state.isCollapsed, "aria-selected": canSelectGroup ? currentlySelected : undefined, "aria-level": groupLevel + 1 },
|
69607
69907
|
React.createElement("div", { className: this._classNames.groupHeaderContainer, role: "presentation" },
|
69608
69908
|
isSelectionCheckVisible ? (React.createElement("div", { role: "gridcell" },
|
69609
|
-
React.createElement("button", tslib_1.__assign({ "data-is-focusable": false, type: "button", className: this._classNames.check, role: "checkbox", "aria-checked": currentlySelected, "data-selection-toggle": true, onClick: this._onToggleSelectGroupClick }, selectAllButtonProps), onRenderCheckbox({ checked: currentlySelected, theme: theme }, onRenderCheckbox)))) : (selectionMode !== Selection_1.SelectionMode.none && React.createElement(GroupSpacer_1.GroupSpacer, { indentWidth: indentWidth, count: 1 })),
|
69909
|
+
React.createElement("button", tslib_1.__assign({ "data-is-focusable": false, type: "button", className: this._classNames.check, role: "checkbox", id: this._id + "-check", "aria-checked": currentlySelected, "aria-labelledby": this._id + "-check " + this._id, "data-selection-toggle": true, onClick: this._onToggleSelectGroupClick }, selectAllButtonProps), onRenderCheckbox({ checked: currentlySelected, theme: theme }, onRenderCheckbox)))) : (selectionMode !== Selection_1.SelectionMode.none && React.createElement(GroupSpacer_1.GroupSpacer, { indentWidth: indentWidth, count: 1 })),
|
69610
69910
|
React.createElement(GroupSpacer_1.GroupSpacer, { indentWidth: indentWidth, count: groupLevel }),
|
69611
69911
|
React.createElement("div", { className: this._classNames.dropIcon, role: "presentation" },
|
69612
69912
|
React.createElement(Icon_1.Icon, { iconName: "Tag" })),
|
@@ -78916,7 +79216,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
78916
79216
|
// Do not modify this file; it is generated as part of publish.
|
78917
79217
|
// The checked in version is a placeholder only and will not be updated.
|
78918
79218
|
var set_version_1 = __webpack_require__(57);
|
78919
|
-
set_version_1.setVersion('@uifabric/icons', '7.6.
|
79219
|
+
set_version_1.setVersion('@uifabric/icons', '7.6.2');
|
78920
79220
|
|
78921
79221
|
|
78922
79222
|
/***/ }),
|
@@ -80352,6 +80652,7 @@ function getStyles(props) {
|
|
80352
80652
|
},
|
80353
80653
|
_c[":hover ." + classNames.icon] = {
|
80354
80654
|
opacity: 0,
|
80655
|
+
pointerEvents: 'none',
|
80355
80656
|
},
|
80356
80657
|
_c),
|
80357
80658
|
},
|
@@ -80422,6 +80723,7 @@ function getStyles(props) {
|
|
80422
80723
|
},
|
80423
80724
|
hasFocus && {
|
80424
80725
|
opacity: 0,
|
80726
|
+
pointerEvents: 'none',
|
80425
80727
|
},
|
80426
80728
|
!disableAnimation && {
|
80427
80729
|
transition: "opacity " + Styling_1.AnimationVariables.durationValue1 + " 0s",
|
@@ -82879,7 +83181,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
82879
83181
|
// Do not modify this file; it is generated as part of publish.
|
82880
83182
|
// The checked in version is a placeholder only and will not be updated.
|
82881
83183
|
var set_version_1 = __webpack_require__(57);
|
82882
|
-
set_version_1.setVersion('@uifabric/foundation', '7.10.
|
83184
|
+
set_version_1.setVersion('@uifabric/foundation', '7.10.1');
|
82883
83185
|
|
82884
83186
|
|
82885
83187
|
/***/ }),
|
@@ -86621,7 +86923,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
86621
86923
|
// Do not modify this file; it is generated as part of publish.
|
86622
86924
|
// The checked in version is a placeholder only and will not be updated.
|
86623
86925
|
var set_version_1 = __webpack_require__(57);
|
86624
|
-
set_version_1.setVersion('@fluentui/react-button', '0.20.
|
86926
|
+
set_version_1.setVersion('@fluentui/react-button', '0.20.1');
|
86625
86927
|
|
86626
86928
|
|
86627
86929
|
/***/ }),
|
@@ -127098,4 +127400,4 @@ exports.ToggleButtons = function () { return (React.createElement(office_ui_fabr
|
|
127098
127400
|
|
127099
127401
|
/***/ })
|
127100
127402
|
],[[929,1,2]]]);
|
127101
|
-
//# sourceMappingURL=main.
|
127403
|
+
//# sourceMappingURL=main.6d4ff50b2d1a618817d2.bundle.js.map
|