gd-bs
Version:
Bootstrap JavaScript, TypeScript and Web Components library.
89 lines (88 loc) • 3.75 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.CardGroup = void 0;
var base_1 = require("../base");
var card_1 = require("../card");
var templates_1 = require("./templates");
/**
* Card Group
* @property props - The button group properties.
*/
var _CardGroup = /** @class */ (function (_super) {
__extends(_CardGroup, _super);
// Constructor
function _CardGroup(props, template, cardTemplate) {
if (template === void 0) { template = templates_1.HTML; }
var _this = _super.call(this, template, props) || this;
// Configure the card group
_this.configure(cardTemplate);
// Configure the parent
_this.configureParent();
return _this;
}
// Configure the card group
_CardGroup.prototype.configure = function (cardTemplate) {
var cards = this.props.cards || [];
var isGrid = false;
// See if we are rendering columns
if (typeof (this.props.colSize) === "number" || this.props.colSize == "auto") {
// Update the flag
isGrid = true;
// Update the class name
this.el.classList.remove("card-group");
this.el.classList.add("row");
// See if the column size is a number
if (this.props.colSize == "auto") {
// Set the column to auto size
this.el.classList.add("row-cols-auto");
}
else {
// Determine the column class to use
var colSize = this.props.colSize > 0 && this.props.colSize <= 12 ? this.props.colSize : 4;
this.el.classList.add("row-cols-" + colSize);
}
}
// Parse the cards
for (var i = 0; i < cards.length; i++) {
// Create the card
var card = (0, card_1.Card)(cards[i], cardTemplate);
// See if we are using a grid
if (isGrid) {
// Create a column element
var elCol = document.createElement("div");
elCol.classList.add("col");
elCol.appendChild(card.el);
// Add the card
this.el.appendChild(elCol);
// Call the event
this.props.onColRender ? this.props.onColRender(elCol, cards[i]) : null;
}
else {
// Add the card
this.el.appendChild(card.el);
// Call the event
this.props.onCardRender ? this.props.onCardRender(card.el, cards[i]) : null;
}
}
// Call the event
this.props.onRender ? this.props.onRender(this.el, this.props) : null;
};
return _CardGroup;
}(base_1.Base));
var CardGroup = function (props, template, cardTemplate) { return new _CardGroup(props, template, cardTemplate); };
exports.CardGroup = CardGroup;