gd-bs 5.1.9 → 5.2.3

package/src/components/tooltipGroup/index.ts

@@ -0,0 +1,75 @@
+import { ITooltip } from "../tooltip/types";
+import { ITooltipGroup, ITooltipGroupProps } from "./types";
+import { Base } from "../base";
+import { Tooltip } from "../tooltip";
+import { HTML } from "./templates";
+
+/**
+ * Tooltip Group
+ * @property props - The tooltip group properties.
+ */
+class _TooltipGroup extends Base<ITooltipGroupProps> implements ITooltipGroup {
+    private _tooltips: Array<ITooltip> = null;
+
+    // Constructor
+    constructor(props: ITooltipGroupProps, template: string = HTML, btnTemplate?: string) {
+        super(template, props);
+
+        // Configure the tooltip group
+        this.configure(btnTemplate);
+
+        // Configure the parent
+        this.configureParent();
+    }
+
+    // Configure the tooltip group
+    private configure(btnTemplate: string) {
+        // Set the attributes
+        this.props.id ? this.el.id = this.props.id : null;
+        this.props.label ? this.el.setAttribute("aria-label", this.props.label) : null;
+
+        // Set the class names
+        this.el.classList.add(this.props.isVertical ? "btn-group-vertical" : "btn-group");
+        this.props.isLarge ? this.el.classList.add("btn-group-lg") : null;
+        this.props.isSmall ? this.el.classList.add("btn-group-sm") : null;
+
+        // Render the tooltips
+        this.renderTooltips(btnTemplate);
+    }
+
+    // Render the tooltips
+    private renderTooltips(tooltipTemplate: string) {
+        // Clear the tooltips
+        this._tooltips = [];
+
+        // Parse the tooltips
+        let tooltips = this.props.tooltips || [];
+        for (let i = 0; i < tooltips.length; i++) {
+            let tooltipProps = tooltips[i];
+
+            // Set the property
+            tooltipProps.type = tooltipProps.type || this.props.tooltipType;
+
+            // See if the button props exists
+            if (tooltipProps.btnProps) {
+                // Set the button type
+                tooltipProps.btnProps.type = tooltipProps.btnProps.type || this.props.buttonType;
+            }
+
+            // Create the tooltip
+            let tooltip = Tooltip(tooltipProps, tooltipTemplate);
+            this._tooltips.push(tooltip);
+
+            // Append the tooltip to the group
+            this.el.appendChild(tooltip.el);
+        }
+    }
+
+    /**
+     * Public Interface
+     */
+
+    // Reference to the tooltips
+    get tooltips(): Array<ITooltip> { return this._tooltips; }
+}
+export const TooltipGroup = (props: ITooltipGroupProps, template?: string, tooltipTemplate?: string): ITooltipGroup => { return new _TooltipGroup(props, template, tooltipTemplate); }

package/src/components/tooltipGroup/templates.ts

@@ -0,0 +1 @@
+export const HTML = `<div class="btn-group" role="group"></div>`;

package/src/components/tooltipGroup/types.d.ts

@@ -0,0 +1,75 @@
+/**
+ * <div id="demo"></div>
+ * <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/gd-sprest-bs/5.0.3/gd-sprest-bs.min.js"></script>
+ * <script type="text/javascript">
+ *     // Wait for the window to be loaded
+ *     window.addEventListener("load", function() {
+ *         // Render the tooltip group
+ *         $REST.Components.TooltipGroup({
+ *             el: document.querySelector("#demo"),
+ *             buttonType: $REST.Components.ButtonTypes.Primary,
+ *             tooltipType: $REST.Components.TooltipTypes.LeftStart,
+ *             tooltips: [
+ *                 { text: "Left", onClick: function() { alert("Left button was clicked."); } },
+ *                 { text: "Middle", onClick: function() { alert("Middle button was clicked."); } },
+ *                 { text: "Right", onClick: function() { alert("Right button was clicked."); } }
+ *             ]
+ *         });
+ *     });
+ * </script>
+ */
+
+/**
+ * ### Tooltip Group
+ * 
+ * ```ts
+ * import { Components } from "gd-sprest-bs";
+ * 
+ * // Create the group
+ * let el = document.querySelector("#buttonGroup");
+ * let tooltipGroup = Components.TooltipGroup({
+ *     el: el,
+ *     buttonType: $REST.Components.ButtonTypes.Primary,
+ *     buttons: [
+ *          { text: "Left", onClick: function() { alert("Left button was clicked."); } },
+ *          { text: "Middle", onClick: function() { alert("Middle button was clicked."); } },
+ *          { text: "Right", onClick: function() { alert("Right button was clicked."); } }
+ *     ]
+ * });
+ * ```
+ */
+export const TooltipGroup: (props: ITooltipGroupProps, template?: string, btnTemplate?: string) => ITooltipGroup;
+
+import { IBaseProps } from "../types";
+import { ITooltip, ITooltipProps } from "../tooltip/types";
+
+/**
+ * Tooltip Group
+ */
+export interface ITooltipGroup {
+    /** The element. */
+    el: Element;
+
+    /** The tooltips. */
+    tooltips: Array<ITooltip>;
+
+    /** Hides the button group. */
+    hide: () => void;
+
+    /** Shows the button group. */
+    show: () => void;
+}
+
+/**
+ * Tooltip Group Properties
+ */
+export interface ITooltipGroupProps extends IBaseProps<ITooltipGroup> {
+    tooltips?: Array<ITooltipProps>;
+    buttonType?: number;
+    id?: string;
+    isLarge?: boolean;
+    isSmall?: boolean;
+    isVertical?: boolean;
+    label?: string;
+    tooltipType?: number;
+}

package/src/icons/iconTypes.ts

@@ -1376,149 +1376,150 @@ export enum IconTypes {
 	TerminalFill = 1374,
 	TerminalPlus = 1375,
 	TerminalSplit = 1376,
-	Terminal = 1377,
-	TextCenter = 1378,
-	TextIndentLeft = 1379,
-	TextIndentRight = 1380,
-	TextLeft = 1381,
-	TextParagraph = 1382,
-	TextRight = 1383,
-	TextareaResize = 1384,
-	TextareaT = 1385,
-	Textarea = 1386,
-	ThermometerHalf = 1387,
-	ThermometerHigh = 1388,
-	ThermometerLow = 1389,
-	ThermometerSnow = 1390,
-	ThermometerSun = 1391,
-	Thermometer = 1392,
-	ThreeDotsVertical = 1393,
-	ThreeDots = 1394,
-	ThunderboltFill = 1395,
-	Thunderbolt = 1396,
-	TicketDetailedFill = 1397,
-	TicketDetailed = 1398,
-	TicketFill = 1399,
-	TicketPerferatedFill = 1400,
-	TicketPerferated = 1401,
-	Ticket = 1402,
-	Tiktok = 1403,
-	ToggleOff = 1404,
-	ToggleOn = 1405,
-	Toggle2Off = 1406,
-	Toggle2On = 1407,
-	Toggles = 1408,
-	Toggles2 = 1409,
-	Tools = 1410,
-	Tornado = 1411,
-	Translate = 1412,
-	TrashFill = 1413,
-	Trash = 1414,
-	Trash2Fill = 1415,
-	Trash2 = 1416,
-	TreeFill = 1417,
-	Tree = 1418,
-	TriangleFill = 1419,
-	TriangleHalf = 1420,
-	Triangle = 1421,
-	TrophyFill = 1422,
-	Trophy = 1423,
-	TropicalStorm = 1424,
-	TruckFlatbed = 1425,
-	Truck = 1426,
-	Tsunami = 1427,
-	TvFill = 1428,
-	Tv = 1429,
-	Twitch = 1430,
-	Twitter = 1431,
-	TypeBold = 1432,
-	TypeH1 = 1433,
-	TypeH2 = 1434,
-	TypeH3 = 1435,
-	TypeItalic = 1436,
-	TypeStrikethrough = 1437,
-	TypeUnderline = 1438,
-	Type = 1439,
-	UiChecksGrid = 1440,
-	UiChecks = 1441,
-	UiRadiosGrid = 1442,
-	UiRadios = 1443,
-	UmbrellaFill = 1444,
-	Umbrella = 1445,
-	Union = 1446,
-	UnlockFill = 1447,
-	Unlock = 1448,
-	UpcScan = 1449,
-	Upc = 1450,
-	Upload = 1451,
-	UsbCFill = 1452,
-	UsbC = 1453,
-	UsbDriveFill = 1454,
-	UsbDrive = 1455,
-	UsbFill = 1456,
-	UsbMicroFill = 1457,
-	UsbMicro = 1458,
-	UsbMiniFill = 1459,
-	UsbMini = 1460,
-	UsbPlugFill = 1461,
-	UsbPlug = 1462,
-	UsbSymbol = 1463,
-	Usb = 1464,
-	VectorPen = 1465,
-	ViewList = 1466,
-	ViewStacked = 1467,
-	Vimeo = 1468,
-	VinylFill = 1469,
-	Vinyl = 1470,
-	Voicemail = 1471,
-	VolumeDownFill = 1472,
-	VolumeDown = 1473,
-	VolumeMuteFill = 1474,
-	VolumeMute = 1475,
-	VolumeOffFill = 1476,
-	VolumeOff = 1477,
-	VolumeUpFill = 1478,
-	VolumeUp = 1479,
-	Vr = 1480,
-	WalletFill = 1481,
-	Wallet = 1482,
-	Wallet2 = 1483,
-	Watch = 1484,
-	Water = 1485,
-	WebcamFill = 1486,
-	Webcam = 1487,
-	Whatsapp = 1488,
-	Wifi1 = 1489,
-	Wifi2 = 1490,
-	WifiOff = 1491,
-	Wifi = 1492,
-	Wind = 1493,
-	WindowDash = 1494,
-	WindowDesktop = 1495,
-	WindowDock = 1496,
-	WindowFullscreen = 1497,
-	WindowPlus = 1498,
-	WindowSidebar = 1499,
-	WindowSplit = 1500,
-	WindowStack = 1501,
-	WindowX = 1502,
-	AppWindow = 1503,
-	Windows = 1504,
-	Wordpress = 1505,
-	Wrench = 1506,
-	XCircleFill = 1507,
-	XCircle = 1508,
-	XDiamondFill = 1509,
-	XDiamond = 1510,
-	XLg = 1511,
-	XOctagonFill = 1512,
-	XOctagon = 1513,
-	XSquareFill = 1514,
-	XSquare = 1515,
-	X = 1516,
-	Xbox = 1517,
-	YinYang = 1518,
-	Youtube = 1519,
-	ZoomIn = 1520,
-	ZoomOut = 1521
+	TerminalX = 1377,
+	Terminal = 1378,
+	TextCenter = 1379,
+	TextIndentLeft = 1380,
+	TextIndentRight = 1381,
+	TextLeft = 1382,
+	TextParagraph = 1383,
+	TextRight = 1384,
+	TextareaResize = 1385,
+	TextareaT = 1386,
+	Textarea = 1387,
+	ThermometerHalf = 1388,
+	ThermometerHigh = 1389,
+	ThermometerLow = 1390,
+	ThermometerSnow = 1391,
+	ThermometerSun = 1392,
+	Thermometer = 1393,
+	ThreeDotsVertical = 1394,
+	ThreeDots = 1395,
+	ThunderboltFill = 1396,
+	Thunderbolt = 1397,
+	TicketDetailedFill = 1398,
+	TicketDetailed = 1399,
+	TicketFill = 1400,
+	TicketPerferatedFill = 1401,
+	TicketPerferated = 1402,
+	Ticket = 1403,
+	Tiktok = 1404,
+	ToggleOff = 1405,
+	ToggleOn = 1406,
+	Toggle2Off = 1407,
+	Toggle2On = 1408,
+	Toggles = 1409,
+	Toggles2 = 1410,
+	Tools = 1411,
+	Tornado = 1412,
+	Translate = 1413,
+	TrashFill = 1414,
+	Trash = 1415,
+	Trash2Fill = 1416,
+	Trash2 = 1417,
+	TreeFill = 1418,
+	Tree = 1419,
+	TriangleFill = 1420,
+	TriangleHalf = 1421,
+	Triangle = 1422,
+	TrophyFill = 1423,
+	Trophy = 1424,
+	TropicalStorm = 1425,
+	TruckFlatbed = 1426,
+	Truck = 1427,
+	Tsunami = 1428,
+	TvFill = 1429,
+	Tv = 1430,
+	Twitch = 1431,
+	Twitter = 1432,
+	TypeBold = 1433,
+	TypeH1 = 1434,
+	TypeH2 = 1435,
+	TypeH3 = 1436,
+	TypeItalic = 1437,
+	TypeStrikethrough = 1438,
+	TypeUnderline = 1439,
+	Type = 1440,
+	UiChecksGrid = 1441,
+	UiChecks = 1442,
+	UiRadiosGrid = 1443,
+	UiRadios = 1444,
+	UmbrellaFill = 1445,
+	Umbrella = 1446,
+	Union = 1447,
+	UnlockFill = 1448,
+	Unlock = 1449,
+	UpcScan = 1450,
+	Upc = 1451,
+	Upload = 1452,
+	UsbCFill = 1453,
+	UsbC = 1454,
+	UsbDriveFill = 1455,
+	UsbDrive = 1456,
+	UsbFill = 1457,
+	UsbMicroFill = 1458,
+	UsbMicro = 1459,
+	UsbMiniFill = 1460,
+	UsbMini = 1461,
+	UsbPlugFill = 1462,
+	UsbPlug = 1463,
+	UsbSymbol = 1464,
+	Usb = 1465,
+	VectorPen = 1466,
+	ViewList = 1467,
+	ViewStacked = 1468,
+	Vimeo = 1469,
+	VinylFill = 1470,
+	Vinyl = 1471,
+	Voicemail = 1472,
+	VolumeDownFill = 1473,
+	VolumeDown = 1474,
+	VolumeMuteFill = 1475,
+	VolumeMute = 1476,
+	VolumeOffFill = 1477,
+	VolumeOff = 1478,
+	VolumeUpFill = 1479,
+	VolumeUp = 1480,
+	Vr = 1481,
+	WalletFill = 1482,
+	Wallet = 1483,
+	Wallet2 = 1484,
+	Watch = 1485,
+	Water = 1486,
+	WebcamFill = 1487,
+	Webcam = 1488,
+	Whatsapp = 1489,
+	Wifi1 = 1490,
+	Wifi2 = 1491,
+	WifiOff = 1492,
+	Wifi = 1493,
+	Wind = 1494,
+	WindowDash = 1495,
+	WindowDesktop = 1496,
+	WindowDock = 1497,
+	WindowFullscreen = 1498,
+	WindowPlus = 1499,
+	WindowSidebar = 1500,
+	WindowSplit = 1501,
+	WindowStack = 1502,
+	WindowX = 1503,
+	AppWindow = 1504,
+	Windows = 1505,
+	Wordpress = 1506,
+	Wrench = 1507,
+	XCircleFill = 1508,
+	XCircle = 1509,
+	XDiamondFill = 1510,
+	XDiamond = 1511,
+	XLg = 1512,
+	XOctagonFill = 1513,
+	XOctagon = 1514,
+	XSquareFill = 1515,
+	XSquare = 1516,
+	X = 1517,
+	Xbox = 1518,
+	YinYang = 1519,
+	Youtube = 1520,
+	ZoomIn = 1521,
+	ZoomOut = 1522
 }

package/src/icons/index.d.ts

@@ -2782,6 +2782,8 @@ export const IconTypes: {
 	TerminalPlus: number;
 	// terminal-split.svg
 	TerminalSplit: number;
+	// terminal-x.svg
+	TerminalX: number;
 	// terminal.svg
 	Terminal: number;
 	// text-center.svg