@microsoft/sp-webpart-base/lib-commonjs/core/SpinnerFactory.js

SharePoint Framework support for building web parts

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var spinner_module_scss_1 = tslib_1.__importDefault(require("./styles/spinner.module.scss"));
/**
 * @internal
 */
var SpinnerFactory = /** @class */ (function () {
    function SpinnerFactory() {
    }
    SpinnerFactory.createSpinner = function (loadingMessage) {
        var spinnerContainerDiv = document.createElement('div');
        spinnerContainerDiv.className = spinner_module_scss_1.default.spinnerContainer;
        var spinnerDiv = document.createElement('div');
        spinnerDiv.className = spinner_module_scss_1.default.spinner;
        spinnerDiv.innerHTML = "<svg class=".concat(spinner_module_scss_1.default.spinnerSlice, " xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 21 21\">\n      <defs>\n        <style>\n          .slice {\n            fill: none;\n            stroke: currentColor;\n            stroke-miterlimit:10;\n            stroke-width:2px;\n          }\n        </style>\n      </defs>\n      <path class=\"slice\" d=\"M17.5,6.5a10,10,0,0,1,10,10\" transform=\"translate(-7 -6)\"/>\n    </svg>\n    <svg class=").concat(spinner_module_scss_1.default.spinnerRing, " xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 21 21\">\n      <defs>\n        <style>\n          .ring {\n            fill: none;\n            stroke: currentColor;\n            stroke-miterlimit:10;\n            stroke-width:2px;\n          }\n        </style>\n      </defs>\n      <path class=\"ring\" d=\"M10,0A10,10,0,1,1,0,10,10,10,0,0,1,10,0Z\" transform=\"translate(0.5 0.5)\"/>\n  </svg>");
        spinnerContainerDiv.appendChild(spinnerDiv);
        var spinnerLoadingMessageDiv = document.createElement('div');
        spinnerLoadingMessageDiv.className = spinner_module_scss_1.default.spinnerLoadingMessage;
        spinnerLoadingMessageDiv.innerText = loadingMessage;
        spinnerContainerDiv.appendChild(spinnerLoadingMessageDiv);
        var spinnerAccessibilityContainerDiv = document.createElement('div');
        spinnerAccessibilityContainerDiv.setAttribute('role', 'status');
        spinnerAccessibilityContainerDiv.setAttribute('aria-live', 'polite');
        var spinnerAccessibilityMessageDiv = document.createElement('div');
        spinnerAccessibilityMessageDiv.className = spinner_module_scss_1.default.spinnerAccessibilityMessage;
        spinnerAccessibilityMessageDiv.innerText = loadingMessage;
        spinnerAccessibilityContainerDiv.appendChild(spinnerAccessibilityMessageDiv);
        spinnerContainerDiv.appendChild(spinnerAccessibilityContainerDiv);
        return spinnerContainerDiv;
    };
    return SpinnerFactory;
}());
exports.default = SpinnerFactory;
//# sourceMappingURL=SpinnerFactory.js.map