gd-bs
Version:
Bootstrap JavaScript, TypeScript and Web Components library.
146 lines (145 loc) • 5.63 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.Alert = exports.AlertClassNames = exports.AlertTypes = void 0;
var base_1 = require("../base");
var classNames_1 = require("../classNames");
var common_1 = require("../common");
var templates_1 = require("./templates");
/**
* Alert Types
*/
var AlertTypes;
(function (AlertTypes) {
AlertTypes[AlertTypes["Danger"] = 1] = "Danger";
AlertTypes[AlertTypes["Dark"] = 2] = "Dark";
AlertTypes[AlertTypes["Info"] = 3] = "Info";
AlertTypes[AlertTypes["Light"] = 4] = "Light";
AlertTypes[AlertTypes["Primary"] = 5] = "Primary";
AlertTypes[AlertTypes["Secondary"] = 6] = "Secondary";
AlertTypes[AlertTypes["Success"] = 7] = "Success";
AlertTypes[AlertTypes["Warning"] = 8] = "Warning";
})(AlertTypes = exports.AlertTypes || (exports.AlertTypes = {}));
/**
* Alert Class Names
*/
exports.AlertClassNames = new classNames_1.ClassNames([
"alert-danger",
"alert-dark",
"alert-info",
"alert-light",
"alert-primary",
"alert-secondary",
"alert-success",
"alert-warning"
]);
/**
* Alert
*/
var _Alert = /** @class */ (function (_super) {
__extends(_Alert, _super);
// Constructor
function _Alert(props, template) {
if (template === void 0) { template = templates_1.HTML; }
var _this = _super.call(this, template, props) || this;
_this._btnClose = null;
// Set the default styling
_this.el.classList.add(exports.AlertClassNames.getByType(_this.props.type) || exports.AlertClassNames.getByType(AlertTypes.Primary));
// Configure the alert
_this.configure();
// Configure the events
_this.configureEvents();
// Configure the parent element
_this.configureParent();
return _this;
}
// Configure the alert
_Alert.prototype.configure = function () {
// Append the content
(0, common_1.appendContent)(this.el, this.props.content);
// See if a header was defined
if (this.props.header) {
// Create the header
var elHeader = document.createElement("h4");
elHeader.classList.add("alert-heading");
elHeader.innerHTML = this.props.header;
this.el.prepend(elHeader);
}
// See if we need to add the dismiss icon
if (this.props.isDismissible) {
// Add the class
this.el.classList.add("alert-dismissible");
// Create the button
var btn = document.createElement("button");
btn.className = "btn-close";
btn.type = "button";
btn.setAttribute("data-bs-dismiss", "alert");
btn.setAttribute("aria-label", "Close");
// Append the button
this.el.appendChild(btn);
}
};
// Configure the events
_Alert.prototype.configureEvents = function () {
var _this = this;
// See if we are dismissing the alert
this._btnClose = this.el.querySelector(".btn-close");
if (this._btnClose) {
// Add a click event
this._btnClose.addEventListener("click", function () {
// Add the fade class
_this.el.classList.add("fade");
setTimeout(function () { _this.hide(); }, 250);
// Execute the event
_this.props.onClose ? _this.props.onClose(_this.props) : null;
});
}
};
/**
* Public Properties
*/
// Closes the alert
_Alert.prototype.close = function () {
// Click the close button
this._btnClose ? this._btnClose.click() : null;
};
// Clears the alert and updates the text
_Alert.prototype.setText = function (alertText) {
// Clear the element
while (this.el.firstChild) {
this.el.removeChild(this.el.firstChild);
}
// Set the text
var elText = document.createTextNode(alertText == null ? "" : alertText);
// Append the text
this.el.appendChild(elText);
};
// Updates the alert template type
_Alert.prototype.setType = function (alertType) {
var _this = this;
// Parse the class names
exports.AlertClassNames.parse(function (className) {
// Remove the class name
_this.el.classList.remove(className);
});
// Set the alert type
this.el.classList.add(exports.AlertClassNames.getByType(alertType) || exports.AlertClassNames.getByType(AlertTypes.Primary));
};
return _Alert;
}(base_1.Base));
var Alert = function (props, template) { return new _Alert(props, template); };
exports.Alert = Alert;