@blackbaud/skyux
Version:
SKY UX built on Angular 2
1,223 lines (1,211 loc) • 1.92 MB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/platform-browser'), require('ng2-dragula/ng2-dragula'), require('@angular/router')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/platform-browser', 'ng2-dragula/ng2-dragula', '@angular/router'], factory) :
(factory((global.skyux = global.skyux || {}, global.skyux.core = global.skyux.core || {}),global.ng.core,global.ng.common,global.ng.forms,global.ng.platformBrowser,global.ng2.dragula,global.ng.router));
}(this, (function (exports,_angular_core,_angular_common,_angular_forms,_angular_platformBrowser,ng2Dragula_ng2Dragula,_angular_router) { 'use strict';
var SkyModalAdapterService = (function () {
function SkyModalAdapterService(appRef, injector) {
this.appRef = appRef;
this.injector = injector;
}
SkyModalAdapterService.prototype.addHostEl = function () {
document.body.appendChild(document.createElement('sky-modal-host'));
};
SkyModalAdapterService.prototype.removeHostEl = function () {
document.body.removeChild(document.querySelector('sky-modal-host'));
};
SkyModalAdapterService.prototype.setPageScroll = function (isAdd) {
var modalClass = 'sky-modal-body-open';
if (isAdd) {
document.body.classList.add(modalClass);
}
else {
document.body.classList.remove(modalClass);
}
};
SkyModalAdapterService.prototype.getModalOpener = function () {
return document.activeElement;
};
return SkyModalAdapterService;
}());
SkyModalAdapterService.decorators = [
{ type: _angular_core.Injectable },
];
/** @nocollapse */
SkyModalAdapterService.ctorParameters = function () { return [
{ type: _angular_core.ApplicationRef, },
{ type: _angular_core.Injector, },
]; };
var SkyModalHostService = (function () {
function SkyModalHostService() {
this.close = new _angular_core.EventEmitter();
SkyModalHostService.modalHosts.push(this);
}
Object.defineProperty(SkyModalHostService, "openModalCount", {
get: function () {
return SkyModalHostService.modalHosts.length;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalHostService, "BASE_Z_INDEX", {
get: function () {
return 1040;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalHostService, "backdropZIndex", {
get: function () {
return SkyModalHostService.BASE_Z_INDEX + SkyModalHostService.modalHosts.length * 10;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalHostService, "topModal", {
get: function () {
return SkyModalHostService.modalHosts[SkyModalHostService.modalHosts.length - 1];
},
enumerable: true,
configurable: true
});
SkyModalHostService.prototype.getModalZIndex = function () {
var zIndex = SkyModalHostService.BASE_Z_INDEX + 1;
zIndex += (SkyModalHostService.modalHosts.indexOf(this) + 1) * 10;
return zIndex;
};
SkyModalHostService.prototype.onClose = function (modalComponent) {
this.close.emit(modalComponent);
};
SkyModalHostService.prototype.destroy = function () {
SkyModalHostService.modalHosts.splice(SkyModalHostService.modalHosts.indexOf(this));
};
return SkyModalHostService;
}());
SkyModalHostService.modalHosts = [];
SkyModalHostService.decorators = [
{ type: _angular_core.Injectable },
];
/** @nocollapse */
SkyModalHostService.ctorParameters = function () { return []; };
var SkyModalConfiguration = (function () {
function SkyModalConfiguration() {
this.fullPage = this.fullPage;
this.size = 'medium';
}
return SkyModalConfiguration;
}());
SkyModalConfiguration.decorators = [
{ type: _angular_core.Injectable },
];
/** @nocollapse */
SkyModalConfiguration.ctorParameters = function () { return []; };
/* tslint:disable */
var tabbableSelector = 'a[href], area[href], input:not([disabled]):not([tabindex=\'-1\']), ' +
'button:not([disabled]):not([tabindex=\'-1\']),select:not([disabled]):not([tabindex=\'-1\']), textarea:not([disabled]):not([tabindex=\'-1\']), ' +
'iframe, object, embed, *[tabindex]:not([tabindex=\'-1\']), *[contenteditable=true]';
/* tslint:enable */
var SkyModalComponentAdapterService = (function () {
function SkyModalComponentAdapterService() {
}
SkyModalComponentAdapterService.prototype.handleWindowChange = function (modalEl) {
var boundedHeightEl = modalEl.nativeElement.querySelector('.sky-modal');
var fullPageModalEl = modalEl.nativeElement.querySelector('.sky-modal-full-page');
/*
Set modal height equal to max height of window (accounting for padding above and below modal)
*/
var newHeight = window.innerHeight - 40;
boundedHeightEl.style.maxHeight = newHeight.toString() + 'px';
if (fullPageModalEl) {
fullPageModalEl.style.height = window.innerHeight.toString() + 'px';
fullPageModalEl.style.maxHeight = window.innerHeight.toString() + 'px';
}
else {
/*
IE11 doesn't handle flex and max-height correctly so we have to explicitly add
max-height to the content that accounts for standard header and footer height.
*/
var modalContentEl = modalEl.nativeElement.querySelector('.sky-modal-content');
var contentHeight = newHeight - 114;
modalContentEl.style.maxHeight = contentHeight.toString() + 'px';
}
};
SkyModalComponentAdapterService.prototype.loadFocusElementList = function (modalEl) {
var _this = this;
var elements = Array.prototype.slice.call(modalEl.nativeElement.querySelectorAll(tabbableSelector));
return elements.filter(function (element) {
return _this.isVisible(element);
});
};
SkyModalComponentAdapterService.prototype.isFocusInFirstItem = function (event, list) {
/* istanbul ignore next */
/* sanity check */
var eventTarget = event.target || event.srcElement;
return list.length > 0 && eventTarget === list[0];
};
SkyModalComponentAdapterService.prototype.isFocusInLastItem = function (event, list) {
/* istanbul ignore next */
/* sanity check */
var eventTarget = event.target || event.srcElement;
return list.length > 0 && eventTarget === list[list.length - 1];
};
SkyModalComponentAdapterService.prototype.isModalFocused = function (event, modalEl) {
/* istanbul ignore next */
/* sanity check */
var eventTarget = event.target || event.srcElement;
return modalEl &&
eventTarget === modalEl.nativeElement.querySelector('.sky-modal-dialog');
};
SkyModalComponentAdapterService.prototype.focusLastElement = function (list) {
if (list.length > 0) {
list[list.length - 1].focus();
return true;
}
return false;
};
SkyModalComponentAdapterService.prototype.focusFirstElement = function (list) {
if (list.length > 0) {
list[0].focus();
return true;
}
return false;
};
SkyModalComponentAdapterService.prototype.modalOpened = function (modalEl) {
/* istanbul ignore else */
/* handle the case where somehow there is a focused element already in the modal */
if (!(document.activeElement && modalEl.nativeElement.contains(document.activeElement))) {
var inputWithAutofocus = modalEl.nativeElement.querySelector('[autofocus]');
if (inputWithAutofocus) {
inputWithAutofocus.focus();
}
else {
var focusEl = modalEl.nativeElement.querySelector('.sky-modal-dialog');
focusEl.focus();
}
}
};
SkyModalComponentAdapterService.prototype.isVisible = function (element) {
return !!(element.offsetWidth ||
element.offsetHeight ||
element.getClientRects().length);
};
return SkyModalComponentAdapterService;
}());
SkyModalComponentAdapterService.decorators = [
{ type: _angular_core.Injectable },
];
/** @nocollapse */
SkyModalComponentAdapterService.ctorParameters = function () { return []; };
var skyModalUniqueIdentifier = 0;
var SkyModalComponent = (function () {
function SkyModalComponent(hostService, config, elRef, componentAdapter) {
this.hostService = hostService;
this.config = config;
this.elRef = elRef;
this.componentAdapter = componentAdapter;
this.modalState = 'in';
this.modalContentId = 'sky-modal-content-id-' + skyModalUniqueIdentifier.toString();
this.modalHeaderId = 'sky-modal-header-id-' + skyModalUniqueIdentifier.toString();
}
Object.defineProperty(SkyModalComponent.prototype, "modalZIndex", {
get: function () {
return this.hostService.getModalZIndex();
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "modalFullPage", {
get: function () {
return this.config.fullPage;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "isSmallSize", {
get: function () {
return !this.modalFullPage && this.isSizeEqual(this.config.size, 'small');
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "isMediumSize", {
get: function () {
return !this.modalFullPage && !(this.isSmallSize || this.isLargeSize);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "isLargeSize", {
get: function () {
return !this.modalFullPage && this.isSizeEqual(this.config.size, 'large');
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "ariaDescribedBy", {
get: function () {
return this.config.ariaDescribedBy || this.modalContentId;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalComponent.prototype, "ariaLabelledBy", {
get: function () {
return this.config.ariaLabelledBy || this.modalHeaderId;
},
enumerable: true,
configurable: true
});
SkyModalComponent.prototype.onDocumentKeyDown = function (event) {
/* istanbul ignore else */
/* sanity check */
if (SkyModalHostService.openModalCount > 0) {
var topModal = SkyModalHostService.topModal;
if (topModal && topModal === this.hostService) {
switch (event.which) {
case 27: {
event.preventDefault();
this.hostService.onClose(this);
break;
}
case 9: {
var focusChanged = false;
var focusElementList = this.componentAdapter.loadFocusElementList(this.elRef);
if (event.shiftKey &&
(this.componentAdapter.isFocusInFirstItem(event, focusElementList) ||
this.componentAdapter.isModalFocused(event, this.elRef))) {
focusChanged = this.componentAdapter.focusLastElement(focusElementList);
}
else if (this.componentAdapter.isFocusInLastItem(event, focusElementList)) {
focusChanged = this.componentAdapter.focusFirstElement(focusElementList);
}
if (focusChanged) {
event.preventDefault();
event.stopPropagation();
}
break;
}
default:
break;
}
}
}
};
SkyModalComponent.prototype.ngAfterViewInit = function () {
skyModalUniqueIdentifier++;
this.componentAdapter.handleWindowChange(this.elRef);
this.componentAdapter.modalOpened(this.elRef);
};
SkyModalComponent.prototype.closeButtonClick = function () {
this.hostService.onClose(this);
};
SkyModalComponent.prototype.windowResize = function () {
this.componentAdapter.handleWindowChange(this.elRef);
};
SkyModalComponent.prototype.isSizeEqual = function (actualSize, size) {
return actualSize && actualSize.toLowerCase() === size;
};
return SkyModalComponent;
}());
SkyModalComponent.decorators = [
{ type: _angular_core.Component, args: [{
selector: 'sky-modal',
template: "<!--\n Animations are broken in Chrome v52. Angular 2 RC5 will fix it.\n https://github.com/angular/angular/issues/10245\n-->\n<!--<div @modalState=\"modalState\">-->\n\n<div\n class=\"sky-modal-dialog\"\n role=\"dialog\"\n tabindex=\"-1\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n (window:resize)=\"windowResize()\"\n>\n <div class=\"sky-modal\"\n [ngClass]=\"{\n 'sky-modal-full-page': modalFullPage,\n 'sky-modal-small' : isSmallSize,\n 'sky-modal-medium' : isMediumSize,\n 'sky-modal-large' : isLargeSize\n }\"\n [ngStyle]=\"{\n zIndex: modalZIndex\n }\">\n\n <div class=\"sky-modal-header\" [hidden]=\"!headerContent || !headerContent.children || headerContent.children.length < 1\">\n <div [attr.id]=\"modalHeaderId\" class=\"sky-modal-header-content\" #headerContent>\n <ng-content select=\"sky-modal-header\"></ng-content>\n </div>\n <div class=\"sky-modal-header-buttons\">\n\n <button type=\"button\" class=\"sky-btn sky-modal-btn-close\" [attr.aria-label]=\"'modal_close' | skyResources\" (click)=\"closeButtonClick()\">\n\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n\n </div>\n <div [attr.id]=\"modalContentId\" class=\"sky-modal-content\">\n <ng-content select=\"sky-modal-content\"></ng-content>\n </div>\n <div class=\"sky-modal-footer\">\n <ng-content select=\"sky-modal-footer\"></ng-content>\n </div>\n</div>\n</div>\n",
styles: [".sky-modal{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;box-shadow:0px 0px 5px 0 rgba(0,0,0,0.3);position:fixed;width:auto;left:0;right:0;top:20px;margin:10px;display:flex;flex-direction:column}@media (min-width: 768px){.sky-modal:not(.sky-modal-large){margin:0 auto}.sky-modal-small{width:300px}.sky-modal-medium{width:600px}}@media (min-width: 920px){.sky-modal-large{margin:0 auto;width:900px}}.sky-modal-content{background-color:#fff;padding:15px}.sky-modal-header{padding-left:15px;padding-top:9px;padding-bottom:9px;padding-right:3px;background-color:#fff;display:flex;align-items:baseline;border-bottom:1px solid #e2e3e4}.sky-modal-header-buttons .sky-btn{border:none;color:#686c73}.sky-modal-header-buttons .sky-btn:hover{color:#282b31;transition:color 150ms}.sky-modal-header-content{flex-grow:1;color:#282b31;font-weight:600;font-size:16px}.sky-modal-header{flex-shrink:0}.sky-modal-content{overflow-y:auto}.sky-modal-footer{flex-shrink:0}.sky-modal-footer /deep/ sky-tabset-nav-button+sky-tabset-nav-button{margin-left:10px}.sky-modal-footer /deep/ sky-tabset-nav-button+.sky-btn{margin-left:10px}.sky-modal-footer /deep/ .sky-btn+.sky-btn{margin-left:10px}.sky-modal-footer /deep/ .sky-btn+.sky-btn-link{margin-left:-2px}.sky-modal-full-page{width:100%;top:0;margin:0}.sky-modal-full-page .sky-modal-header-content{color:#282b31;font-weight:300;font-size:26px;font-stretch:condensed}.sky-modal-full-page .sky-modal-header-buttons .fa-close{font-size:20px}.sky-modal-full-page .sky-modal-content{flex-grow:1}\n"],
animations: [
_angular_core.trigger('modalState', [
_angular_core.state('in', _angular_core.style({ opacity: '1.0' })),
_angular_core.state('out', _angular_core.style({ opacity: '0.0' })),
_angular_core.transition('void => *', [
_angular_core.style({ opacity: '0.0' }),
_angular_core.animate(150)
]),
_angular_core.transition('* => void', [
_angular_core.animate(150, _angular_core.style({ opacity: '0.0' }))
])
])
],
providers: [
SkyModalComponentAdapterService
]
},] },
];
/** @nocollapse */
SkyModalComponent.ctorParameters = function () { return [
{ type: SkyModalHostService, },
{ type: SkyModalConfiguration, },
{ type: _angular_core.ElementRef, },
{ type: SkyModalComponentAdapterService, },
]; };
SkyModalComponent.propDecorators = {
'onDocumentKeyDown': [{ type: _angular_core.HostListener, args: ['document:keydown', ['$event'],] },],
};
var SkyModalContentComponent = (function () {
function SkyModalContentComponent() {
}
return SkyModalContentComponent;
}());
SkyModalContentComponent.decorators = [
{ type: _angular_core.Component, args: [{
selector: 'sky-modal-content',
template: "<ng-content></ng-content>\n"
},] },
];
/** @nocollapse */
SkyModalContentComponent.ctorParameters = function () { return []; };
var SkyModalFooterComponent = (function () {
function SkyModalFooterComponent() {
}
return SkyModalFooterComponent;
}());
SkyModalFooterComponent.decorators = [
{ type: _angular_core.Component, args: [{
selector: 'sky-modal-footer',
template: "<div class=\"sky-modal-footer-container\">\n <ng-content></ng-content>\n</div>\n",
styles: [".sky-modal-footer-container{background-color:#fff;padding:15px;border-top:1px solid #e2e3e4}.sky-modal-footer-container /deep/ .sky-btn-link:first-child{margin-left:-12px}\n"]
},] },
];
/** @nocollapse */
SkyModalFooterComponent.ctorParameters = function () { return []; };
var SkyModalHeaderComponent = (function () {
function SkyModalHeaderComponent() {
}
return SkyModalHeaderComponent;
}());
SkyModalHeaderComponent.decorators = [
{ type: _angular_core.Component, args: [{
selector: 'sky-modal-header',
template: "<ng-content></ng-content>\n"
},] },
];
/** @nocollapse */
SkyModalHeaderComponent.ctorParameters = function () { return []; };
var SkyModalHostComponent = (function () {
function SkyModalHostComponent(resolver, elRef, viewContainer, adapter, injector) {
this.resolver = resolver;
this.elRef = elRef;
this.viewContainer = viewContainer;
this.adapter = adapter;
this.injector = injector;
}
Object.defineProperty(SkyModalHostComponent.prototype, "modalOpen", {
get: function () {
return SkyModalHostService.openModalCount > 0;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SkyModalHostComponent.prototype, "backdropZIndex", {
get: function () {
return SkyModalHostService.backdropZIndex;
},
enumerable: true,
configurable: true
});
SkyModalHostComponent.prototype.open = function (modalInstance, component, config) {
var params = Object.assign({}, config);
var factory = this.resolver.resolveComponentFactory(component);
var hostService = new SkyModalHostService();
var adapter = this.adapter;
var modalOpener = adapter.getModalOpener();
params.providers.push({
provide: SkyModalHostService,
useValue: hostService
});
params.providers.push({
provide: SkyModalConfiguration,
useValue: params
});
adapter.setPageScroll(SkyModalHostService.openModalCount > 0);
var providers = params.providers /* istanbul ignore next */ || [];
var resolvedProviders = _angular_core.ReflectiveInjector.resolve(providers);
var injector = _angular_core.ReflectiveInjector.fromResolvedProviders(resolvedProviders, this.injector);
var modalComponentRef = this.target.createComponent(factory, undefined, injector);
modalInstance.componentInstance = modalComponentRef.instance;
function closeModal() {
hostService.destroy();
adapter.setPageScroll(SkyModalHostService.openModalCount > 0);
/* istanbul ignore else */
/* sanity check */
if (modalOpener && modalOpener.focus) {
modalOpener.focus();
}
modalComponentRef.destroy();
}
hostService.close.subscribe(function (modalComponent) {
closeModal();
});
modalInstance.setCloseCallback(function () {
closeModal();
});
};
return SkyModalHostComponent;
}());
SkyModalHostComponent.decorators = [
{ type: _angular_core.Component, args: [{
selector: 'sky-modal-host',
template: "<div\n class=\"sky-modal-host-backdrop\"\n [hidden]=\"!modalOpen\"\n [ngStyle]=\"{\n zIndex: backdropZIndex\n }\"\n>\n</div>\n<div #target></div>\n",
styles: [".sky-modal-host-backdrop{background-color:rgba(0,0,0,0.2);position:fixed;top:0;left:0;bottom:0;right:0}\n"],
viewProviders: [SkyModalAdapterService]
},] },
];
/** @nocollapse */
SkyModalHostComponent.ctorParameters = function () { return [
{ type: _angular_core.ComponentFactoryResolver, },
{ type: _angular_core.ElementRef, },
{ type: _angular_core.ViewContainerRef, },
{ type: SkyModalAdapterService, },
{ type: _angular_core.Injector, },
]; };
SkyModalHostComponent.propDecorators = {
'target': [{ type: _angular_core.ViewChild, args: ['target', { read: _angular_core.ViewContainerRef },] },],
};
var SkyModalInstance = (function () {
function SkyModalInstance() {
this.closed = new _angular_core.EventEmitter();
}
SkyModalInstance.prototype.setCloseCallback = function (closeCallback) {
this.closeCallback = closeCallback;
};
SkyModalInstance.prototype.close = function (result, reason) {
if (reason === undefined) {
reason = 'close';
}
this.closeModal(reason, result);
};
SkyModalInstance.prototype.cancel = function (result) {
this.closeModal('cancel', result);
};
SkyModalInstance.prototype.save = function (result) {
this.closeModal('save', result);
};
SkyModalInstance.prototype.closeModal = function (type, result) {
if (this.closeCallback) {
this.closeCallback();
}
this.closed.emit({ reason: type, data: result });
};
return SkyModalInstance;
}());
var SkyModalService = (function () {
function SkyModalService(resolver, injector, appRef, adapter) {
var _this = this;
this.resolver = resolver;
this.injector = injector;
this.appRef = appRef;
this.adapter = adapter;
/*
This timeout is needed because you can run into errors like 'ApplicationRef.tick is called
recursively' when the modal service is injected into a component hidden by an *ngIf.
*/
setTimeout(function () {
_this.createHostComponent();
});
}
// Open Method
SkyModalService.prototype.open = function () {
var modalInstance = new SkyModalInstance();
this.createHostComponent();
var providersOrConfig = arguments[1];
var params = this.getConfigFromParameter(providersOrConfig);
var component = arguments[0];
params.providers.push({
provide: SkyModalInstance,
useValue: modalInstance
});
SkyModalService.hostComponent.open(modalInstance, component, params);
return modalInstance;
};
SkyModalService.prototype.dispose = function () {
/* istanbul ignore else */
/* sanity check */
if (SkyModalService.hostComponent) {
SkyModalService.hostComponent = undefined;
this.adapter.removeHostEl();
}
};
SkyModalService.prototype.getConfigFromParameter = function (providersOrConfig) {
var defaultParams = { 'providers': [], 'fullPage': false, 'size': 'medium' };
var params = undefined;
var method = undefined;
// Object Literal Lookup for backwards compatability.
method = {
'providers?': Object.assign({}, defaultParams, { 'providers': providersOrConfig }),
'config': Object.assign({}, defaultParams, providersOrConfig)
};
if (Array.isArray(providersOrConfig) === true) {
params = method['providers?'];
}
else {
params = method['config'];
}
return params;
};
SkyModalService.prototype.createHostComponent = function () {
if (!SkyModalService.hostComponent) {
var factory = this.resolver.resolveComponentFactory(SkyModalHostComponent);
this.adapter.addHostEl();
var cmpRef = this.appRef.bootstrap(factory);
SkyModalService.hostComponent = cmpRef.instance;
}
};
return SkyModalService;
}());
SkyModalService.decorators = [
{ type: _angular_core.Injectable },
];
/** @nocollapse */
SkyModalService.ctorParameters = function () { return [
{ type: _angular_core.ComponentFactoryResolver, },
{ type: _angular_core.Injector, },
{ type: _angular_core.ApplicationRef, },
{ type: SkyModalAdapterService, },
]; };
var SkyResources = (function () {
/*istanbul ignore next */
function SkyResources() {
}
SkyResources.getString = function (name) {
var stringObj = this.resources[name];
if (stringObj) {
return stringObj.message;
}
return name;
};
return SkyResources;
}());
SkyResources.resources = {
"action_bar_actions": {
"_description": "The label for the actions dropdown on the action button bar",
"message": "Actions"
},
"alert_close": {
"_description": "Screen reader text for the close button on alerts",
"message": "Close the alert"
},
"avatar_error_not_image_description": {
"_description": "Message description displayed when the user attempts to upload an avatar file that is not a valid image",
"message": "Please choose a file that is a valid image."
},
"avatar_error_not_image_title": {
"_description": "Message title displayed when the user attempts to upload an avatar file that is not a valid image",
"message": "File is not an image."
},
"avatar_error_too_large_description": {
"_description": "Message description displayed when the user attempts to upload an avatar image with a file size that is too large",
"message": "Please choose an image that is less than {0}."
},
"avatar_error_too_large_title": {
"_description": "Message title displayed when the user attempts to upload an avatar image with a file size that is too large",
"message": "File is too large."
},
"card_checkbox_label": {
"_description": "Label for the multiselect checkbox for the card component",
"message": "Select card"
},
"checklist_clear_all": {
"_description": "Text for the link in a checklist to clear selections.",
"message": "Clear all"
},
"checklist_no_items": {
"_description": "Text in a checklist when no items are shown based on the current filter.",
"message": "No items found"
},
"checklist_select_all": {
"_description": "Text for the link in a checklist to select all items.",
"message": "Select all"
},
"chevron_collapse": {
"_description": "Screen reader text for when clicking the chevron would collapse the corresponding section",
"message": "Collapse"
},
"chevron_expand": {
"_description": "Screen reader text for when clicking the chevron would expand the corresponding section",
"message": "Expand"
},
"colorpicker_alpha": {
"_description": "Label for the alpha input",
"message": "A:"
},
"colorpicker_apply": {
"_description": "Label for the apply button",
"message": "Apply"
},
"colorpicker_aria_alpha": {
"_description": "aria label for the alpha input",
"message": "Alpha"
},
"colorpicker_aria_blue": {
"_description": "aria label for the blue input",
"message": "Blue"
},
"colorpicker_aria_green": {
"_description": "aria label for the green input",
"message": "Green"
},
"colorpicker_aria_hex": {
"_description": "aria label for the hex input",
"message": "Hex"
},
"colorpicker_aria_red": {
"_description": "aria label for the red input",
"message": "Red"
},
"colorpicker_blue": {
"_description": "Label for the blue input",
"message": "B:"
},
"colorpicker_close": {
"_description": "Label for the close button",
"message": "Close"
},
"colorpicker_green": {
"_description": "Label for the green input",
"message": "G:"
},
"colorpicker_hex": {
"_description": "aria label for the hex input",
"message": "Hex:"
},
"colorpicker_preset_color": {
"_description": "Label for the preset colors",
"message": "Preset Color:"
},
"colorpicker_red": {
"_description": "Label for the red input",
"message": "R:"
},
"colorpicker_reset": {
"_description": "Label for the reset button to change the color back to the initial color",
"message": "Reset"
},
"context_menu_default_label": {
"_description": "The label on the context menu button used for screen readers when the consumer has not specified a label",
"message": "Context menu"
},
"date_field_invalid_date_message": {
"_description": "error message shown when an invalid date is entered.",
"message": "Please enter a valid date"
},
"date_range_picker_at_any_time": {
"_description": "text for date range picker",
"message": "At any time"
},
"date_range_picker_filter_description_at_any_time": {
"_description": "text for date range picker",
"message": "{0} at any time"
},
"date_range_picker_filter_description_last_calendar_year": {
"_description": "text for date range picker",
"message": "{0} from last calendar year"
},
"date_range_picker_filter_description_last_fiscal_year": {
"_description": "text for date range picker",
"message": "{0} from last fiscal year"
},
"date_range_picker_filter_description_last_month": {
"_description": "text for date range picker",
"message": "{0} from last month"
},
"date_range_picker_filter_description_last_quarter": {
"_description": "text for date range picker",
"message": "{0} from last quarter"
},
"date_range_picker_filter_description_last_week": {
"_description": "text for date range picker",
"message": "{0} from last week"
},
"date_range_picker_filter_description_next_calendar_year": {
"_description": "text for date range picker",
"message": "{0} for next calendar year"
},
"date_range_picker_filter_description_next_fiscal_year": {
"_description": "text for date range picker",
"message": "{0} for next fiscal year"
},
"date_range_picker_filter_description_next_month": {
"_description": "text for date range picker",
"message": "{0} for next month"
},
"date_range_picker_filter_description_next_quarter": {
"_description": "text for date range picker",
"message": "{0} for next quarter"
},
"date_range_picker_filter_description_next_week": {
"_description": "text for date range picker",
"message": "{0} for next week"
},
"date_range_picker_filter_description_specific_range": {
"_description": "text for date range picker",
"message": "{0} from {1} to {2}"
},
"date_range_picker_filter_description_this_calendar_year": {
"_description": "text for date range picker",
"message": "{0} for this calendar year"
},
"date_range_picker_filter_description_this_fiscal_year": {
"_description": "text for date range picker",
"message": "{0} for this fiscal year"
},
"date_range_picker_filter_description_this_month": {
"_description": "text for date range picker",
"message": "{0} for this month"
},
"date_range_picker_filter_description_this_quarter": {
"_description": "text for date range picker",
"message": "{0} for this quarter"
},
"date_range_picker_filter_description_this_week": {
"_description": "text for date range picker",
"message": "{0} for this week"
},
"date_range_picker_filter_description_today": {
"_description": "text for date range picker",
"message": "{0} for today"
},
"date_range_picker_filter_description_tomorrow": {
"_description": "text for date range picker",
"message": "{0} for tomorrow"
},
"date_range_picker_filter_description_yesterday": {
"_description": "text for date range picker",
"message": "{0} from yesterday"
},
"date_range_picker_from_date": {
"_description": "label for date range picker",
"message": "From date"
},
"date_range_picker_last_calendar_year": {
"_description": "text for date range picker",
"message": "Last calendar year"
},
"date_range_picker_last_fiscal_year": {
"_description": "text for date range picker",
"message": "Last fiscal year"
},
"date_range_picker_last_month": {
"_description": "text for date range picker",
"message": "Last month"
},
"date_range_picker_last_quarter": {
"_description": "text for date range picker",
"message": "Last quarter"
},
"date_range_picker_last_week": {
"_description": "text for date range picker",
"message": "Last week"
},
"date_range_picker_max_date_error": {
"_description": "error message for date range picker",
"message": "Start date must be before end date"
},
"date_range_picker_min_date_error": {
"_description": "error message for date range picker",
"message": "End date must be after start date"
},
"date_range_picker_next_calendar_year": {
"_description": "text for date range picker",
"message": "Next calendar year"
},
"date_range_picker_next_fiscal_year": {
"_description": "text for date range picker",
"message": "Next fiscal year"
},
"date_range_picker_next_month": {
"_description": "text for date range picker",
"message": "Next month"
},
"date_range_picker_next_quarter": {
"_description": "text for date range picker",
"message": "Next quarter"
},
"date_range_picker_next_week": {
"_description": "text for date range picker",
"message": "Next week"
},
"date_range_picker_specific_range": {
"_description": "text for date range picker",
"message": "Specific range"
},
"date_range_picker_this_calendar_year": {
"_description": "text for date range picker",
"message": "This calendar year"
},
"date_range_picker_this_fiscal_year": {
"_description": "text for date range picker",
"message": "This fiscal year"
},
"date_range_picker_this_month": {
"_description": "text for date range picker",
"message": "This month"
},
"date_range_picker_this_quarter": {
"_description": "text for date range picker",
"message": "This quarter"
},
"date_range_picker_this_week": {
"_description": "text for date range picker",
"message": "This week"
},
"date_range_picker_to_date": {
"_description": "label for date range picker",
"message": "To date"
},
"date_range_picker_today": {
"_description": "text for date range picker",
"message": "Today"
},
"date_range_picker_tomorrow": {
"_description": "text for date range picker",
"message": "Tomorrow"
},
"date_range_picker_yesterday": {
"_description": "text for date range picker",
"message": "Yesterday"
},
"datepicker_clear": {
"_description": "Text displayed in the Clear button of the datepicker",
"message": "Clear"
},
"datepicker_close": {
"_description": "Text displayed in the Close button of the datepicker",
"message": "Done"
},
"datepicker_today": {
"_description": "Text displayed in the Today button of the datepicker",
"message": "Today"
},
"definition_list_none_found": {
"_description": "The default text to show when a definition list item has no value",
"message": "None found"
},
"error_component_broken_description": {
"_description": "The error component description message for the broken error type",
"message": "Try to refresh this page or come back later."
},
"error_component_broken_title": {
"_description": "The error component title message for the broken error type",
"message": "Sorry, something went wrong."
},
"error_component_construction_description": {
"_description": "The error component description message for the construction error type",
"message": "Thanks for your patience while improvements are made! \n Please check back in a little while."
},
"error_component_construction_title": {
"_description": "The error component title message for the construction error type",
"message": "This page will return soon."
},
"error_component_not_found_title": {
"_description": "The error component title message for the not found error type",
"message": "Sorry, we can't reach that page."
},
"error_description_broken": {
"_description": "Text used for the error description to when page is broken.",
"message": "Try to refresh this page or come back later."
},
"error_description_construction": {
"_description": "Text used for the error description when page is under construction.",
"message": "Thanks for your patience while improvements are made!\nPlease check back in a little while."
},
"error_title_broken": {
"_description": "Text used for the error title when something is broken",
"message": "Sorry, something went wrong."
},
"error_title_construction": {
"_description": "Text used for the error title when page is under construction.",
"message": "This page will return soon."
},
"error_title_notfound": {
"_description": "Text used for the error title when page is not found.",
"message": "Sorry, we can't reach that page."
},
"errormodal_ok": {
"_description": "Text used on the primary button to dismiss the error modal.",
"message": "OK"
},
"file_item_delete": {
"_description": "Label for the button that deletes a file",
"message": "Delete file"
},
"file_size_b_plural": {
"_description": "",
"message": "{0} bytes"
},
"file_size_b_singular": {
"_description": "",
"message": "{0} byte"
},
"file_size_gb": {
"_description": "",
"message": "{0} GB"
},
"file_size_kb": {
"_description": "",
"message": "{0} KB"
},
"file_size_mb": {
"_description": "",
"message": "{0} MB"
},
"file_upload_drag_file_here": {
"_description": "",
"message": "Drag a file here"
},
"file_upload_drag_or_click": {
"_description": "Label for file drop",
"message": "Drag a file here or click to browse"
},
"file_upload_drop_files_here": {
"_description": "",
"message": "Drop files here"
},
"file_upload_invalid_file": {
"_description": "",
"message": "This file type is invalid"
},
"file_upload_link_input": {
"_description": "Label for input to upload file",
"message": "Add a link to a file"
},
"file_upload_link_placeholder": {
"_description": "",
"message": "http://www.something.com/file"
},
"file_upload_or_click_to_browse": {
"_description": "",
"message": "or click to browse"
},
"file_upload_paste_link": {
"_description": "",
"message": "Paste a link to a file"
},
"file_upload_paste_link_done": {
"_description": "",
"message": "Done"
},
"filter_button_title": {
"_description": "Text for the filter button title",
"message": "Filters"
},
"filter_summary_header": {
"_description": "Text for the filter summary component",
"message": "Filter"
},
"grid_action_bar_cancel_mobile_actions": {
"_description": "Close the menu where you choose an action in mobile multiselect.",
"message": "Cancel"
},
"grid_action_bar_choose_action": {
"_description": "Open a menu to choose an action in mobile multiselect.",
"message": "Choose an action"
},
"grid_action_bar_clear_selection": {
"_description": "Clear the selections in the grid.",
"message": "Clear selection"
},
"grid_back_to_top": {
"_description": "Text for link in grid to scroll back to the top.",
"message": "Back to top"
},
"grid_column_picker_all_categories": {
"_description": "Button text for category filters used to indicate that all columns should be shown in the column picker",
"message": "All"
},
"grid_column_picker_cancel": {
"_description": "Button text for cancelling changes made in the grid column picker",
"message": "Cancel"
},
"grid_column_picker_description_header": {
"_description": "In the column picker, the header for the column showing the description of the columns to include in the grid.",
"message": "Description"
},
"grid_column_picker_header": {
"_description": "Header text for the grid column picker screen",
"message": "Choose columns to show in the list"
},
"grid_column_picker_name_header": {
"_description": "In the column picker, the header for the column showing the names of the columns to include in the grid.",
"message": "Column"
},
"grid_column_picker_search_no_columns": {
"_description": "Displays when no columns are found for the specified search text.",
"message": "No columns found"
},
"grid_column_picker_search_placeholder": {
"_description": "Search text placeholder for the search box on the grid column picker",
"message": "Search for columns"
},
"grid_column_picker_submit": {
"_description": "Button text for applying changes made in the grid column picker",
"message": "Apply changes"
},
"grid_columns_button": {
"_description": "Label for button to select columns to display in a grid.",
"message": " Choose columns"
},
"grid_filters_apply": {
"_description": "Text for button on filters flyout to apply the selected filters to the grid",
"message": "Apply filters"
},
"grid_filters_button": {
"_description": "Label for button to select filters to be applied to a grid.",
"message": "Filters"
},
"grid_filters_clear": {
"_description": "Text for button on filters flyout to clear the selected filters for the grid",
"message": "Clear"
},
"grid_filters_header": {
"_description": "Header text for grid filters flyout",
"message": "Filter"
},
"grid_filters_hide": {
"_description": "Hide link text for grid filters flyout",
"message": "Hide"
},
"grid_filters_summary_header": {
"_description": "Header text for filter summary on top of grid",
"message": "Filter:"
},
"grid_load_more": {
"_description": "The text for the button to load additional rows into the grid if more rows are available.",
"message": "Load more"
},
"grid_search_placeholder": {
"_description": "Placeholder text in grid search box",
"message": "Find in this list"
},
"list_show_secondary_actions": {
"_description": "Label for the button that opens the secondary actions menu in the list toolbar",
"message": "Show secondary actions"
},
"modal_close": {
"_description": "Text for modal close button",
"message": "Close modal"
},
"modal_footer_cancel_button": {
"_description": "Default lable text for modal cancel button",
"message": "Cancel"
},
"modal_footer_primary_button": {
"_description": "Default lable text for modal primary button",
"message": "Save"
},
"month_short_april": {
"_description": "",
"message": "Apr"
},
"month_short_august": {
"_description": "",
"message": "Aug"
},
"month_short_december": {
"_description": "",
"message": "Dec"
},
"month_short_february": {
"_description": "",
"message": "Feb"
},
"month_short_january": {
"_description": "",
"message": "Jan"
},
"month_short_july": {
"_description": "",
"message": "Jul"
},
"month_short_june": {
"_description": "",
"message": "Jun"
},
"month_short_march": {
"_description": "",
"message": "Mar"
},
"month_short_may": {
"_description": "",
"message": "May"
},
"month_short_november": {
"_description": "",
"message": "Nov"
},
"month_short_october": {
"_description": "",
"message": "Oct"
},
"month_short_september": {
"_description": "",
"message": "Sep"
},
"number_billion_abrev": {
"_description": "Abreviation for Billion used by numbers",
"message": "B"
},
"number_million_abrev": {
"_description": "Abreviation for million used by numbers",
"message": "M"
},
"number_thousands_abrev": {
"_description": "Abreviation for Thousands used by numbers",
"message": "K"
},
"number_trillion_abrev": {
"_description": "Abreviation for Trillion used by numbers",
"message": "T"
},
"page_noaccess_button": {
"_description": "",
"message": "Return to a non-classified page"
},
"page_noaccess_description": {
"_description": "",
"message": "Sorry, you don't have rights to this page.\nIf you feel you should, please contact your system administrator."
},
"page_noaccess_header": {
"_description": "",
"message": "Move along, there's nothing to see here"
},
"paging_label": {
"_description": "Default text for the label for the pagination component",
"message": "Pagination"
},
"paging_next": {
"_description": "Text for the label for the next button on the pagination component",
"message": "Next"
},
"paging_previous": {
"_description": "Text for the label for the previous button on the pagination component",
"message": "Previous"
},
"reorder_top": {
"_description": "Text displayed to indicate that a row can be pushed to the top of the list",
"message": "Top"
},
"repeater_item_checkbox_label": {
"_description": "Label for the repeater item checkbox for the repeater component",
"message": "Select row"
},
"search_dismiss": {
"_description": "Label for dismissing search input",
"message": "Dismiss search"
},
"search_label": {
"_description": "Label for search component functionality",
"message": "Search items"
},
"search_open": {
"_description": "Label for opening search input",
"message": "Open search"
},
"search_placeholder": {
"_description": "Placeholder text for search input component",
"message": "Find in this list"
},
"searchfield_no_records": {
"_description": "text for ui-select search control when no records are found.",
"message": "Sorry, no matching records found"
},
"searchfield_searching": {
"_description": "