galaxis-card 1.8.3 → 1.9.0

package/dist/cjs/Card/App.d.ts

@@ -0,0 +1,15 @@
+import "bootstrap/dist/css/bootstrap.min.css";
+import "./styles/App.css";
+import React from "react";
+import { BalancesModel, MetadataModel } from "../models/metadata.model";
+type Configuration = {
+    cardLoyaltyLevel: string | undefined;
+    metadata: MetadataModel | undefined;
+    galaxisIcon: string | undefined;
+    userInteraction: Function | undefined;
+    balances?: BalancesModel | undefined;
+    badgeSize?: number;
+    badgeVisibleCount?: number;
+};
+declare const App: React.FC<Configuration>;
+export default App;

package/dist/cjs/Card/App.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+require("bootstrap/dist/css/bootstrap.min.css");
+require("./styles/App.css");
+var react_1 = require("react");
+var GalaxisCard_1 = tslib_1.__importDefault(require("./GalaxisCard"));
+var react_2 = tslib_1.__importDefault(require("react"));
+var App = function (_a) {
+    var metadata = _a.metadata, cardLoyaltyLevel = _a.cardLoyaltyLevel, galaxisIcon = _a.galaxisIcon, userInteraction = _a.userInteraction, balances = _a.balances, badgeSize = _a.badgeSize, badgeVisibleCount = _a.badgeVisibleCount;
+    var _b = (0, react_1.useState)(""), metadataUrl = _b[0], setMetadataUrl = _b[1];
+    (0, react_1.useEffect)(function () {
+        var hasIndexOf = window.location.href.indexOf("?");
+        if (hasIndexOf < 0 || metadata) {
+            return;
+        }
+        var urlParam = window.location.href.slice(hasIndexOf + 1);
+        if (urlParam) {
+            setMetadataUrl("https://" + urlParam.replace("&balancesOff", ""));
+        }
+    }, [metadata]);
+    var handleInteraction = function (badgeId, selectedValue) {
+        if (userInteraction) {
+            userInteraction(badgeId, selectedValue);
+        }
+    };
+    return (react_2.default.createElement(GalaxisCard_1.default, { metadataUrl: metadataUrl, metadata: metadata, communityCurrency: balances, cardLevel: cardLoyaltyLevel !== null && cardLoyaltyLevel !== void 0 ? cardLoyaltyLevel : "", icon: galaxisIcon !== null && galaxisIcon !== void 0 ? galaxisIcon : "", userInteraction: userInteraction ? handleInteraction : undefined, badgeSize: badgeSize, badgeVisibleCount: badgeVisibleCount }));
+};
+exports.default = App;
+//# sourceMappingURL=App.js.map

package/dist/cjs/Card/App.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/Card/App.tsx"],"names":[],"mappings":";;;AAAA,gDAA8C;AAC9C,4BAA0B;AAE1B,+BAA4C;AAC5C,sEAAwC;AACxC,wDAA0B;AAa1B,IAAM,GAAG,GAA4B,UAAC,EAQrC;QAPC,QAAQ,cAAA,EACR,gBAAgB,sBAAA,EAChB,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,iBAAiB,uBAAA;IAEX,IAAA,KAAgC,IAAA,gBAAQ,EAAS,EAAE,CAAC,EAAnD,WAAW,QAAA,EAAE,cAAc,QAAwB,CAAC;IAE3D,IAAA,iBAAS,EAAC;QACR,IAAM,UAAU,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QAErD,IAAI,UAAU,GAAG,CAAC,IAAI,QAAQ,EAAE,CAAC;YAC/B,OAAO;QACT,CAAC;QAED,IAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC;QAE5D,IAAI,QAAQ,EAAE,CAAC;YACb,cAAc,CAAC,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,CAAC;QACpE,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,IAAM,iBAAiB,GAAG,UAAC,OAAe,EAAE,aAAqB;QAC/D,IAAI,eAAe,EAAE,CAAC;YACpB,eAAe,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,8BAAC,qBAAW,IACV,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,QAAQ,EAC3B,SAAS,EAAE,gBAAgB,aAAhB,gBAAgB,cAAhB,gBAAgB,GAAI,EAAE,EACjC,IAAI,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,EAAE,EACvB,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,EAChE,SAAS,EAAE,SAAS,EACpB,iBAAiB,EAAE,iBAAiB,GACpC,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,GAAG,CAAC"}

package/dist/cjs/Card/BadgeDetails.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { TraitModel } from "../models/metadata.model";
+type Props = {
+    badge: TraitModel;
+    userInteraction: Function | undefined;
+};
+declare const BadgeDetails: React.FC<Props>;
+export default BadgeDetails;

package/dist/cjs/Card/BadgeDetails.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var BadgeDetails = function (_a) {
+    var _b, _c;
+    var badge = _a.badge, userInteraction = _a.userInteraction;
+    var _d = react_1.default.useState(""), multipleChoiceValue = _d[0], setMultipleChoiceValue = _d[1];
+    (0, react_1.useEffect)(function () {
+        if (badge) {
+            if (badge.interaction && badge.interaction.config && badge.interaction.can_interact) {
+                if (badge.interaction.config.type === "multiple_choice") {
+                    if (badge.interaction.config.choices && badge.interaction.config.choices.length > 0) {
+                        setMultipleChoiceValue(badge.interaction.config.choices[0].value);
+                    }
+                }
+            }
+        }
+    }, [badge]);
+    var handleInteraction = function (badgeId, selectedValue) {
+        if (userInteraction) {
+            userInteraction(badgeId, selectedValue);
+        }
+    };
+    return (react_1.default.createElement("div", { className: "badge-wrapper" },
+        react_1.default.createElement("div", { className: "badge-details" },
+            (badge === null || badge === void 0 ? void 0 : badge.icon_url) && (react_1.default.createElement("div", { className: "badge-image" },
+                react_1.default.createElement("img", { src: badge.icon_url, alt: badge.name }))),
+            react_1.default.createElement("div", { className: "badge-title" },
+                react_1.default.createElement("div", null, badge === null || badge === void 0 ? void 0 : badge.name),
+                (badge === null || badge === void 0 ? void 0 : badge.value) && react_1.default.createElement("div", { className: "badge-value" }, badge.value)),
+            react_1.default.createElement("div", { className: "badge-description" },
+                react_1.default.createElement("div", { dangerouslySetInnerHTML: { __html: badge === null || badge === void 0 ? void 0 : badge.description }, className: "description-text" }),
+                (badge === null || badge === void 0 ? void 0 : badge.is_interactive) && userInteraction !== undefined && (react_1.default.createElement("div", { className: "badge-interactive" },
+                    badge.interaction && badge.interaction.config && badge.interaction.can_interact && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement("p", null, badge.interaction.config.description),
+                        badge.interaction.config.type === "single_button" && (react_1.default.createElement("div", null,
+                            react_1.default.createElement("button", { className: "btn btn-outline-primary btn-sm  mc-btn", onClick: function () {
+                                    var _a;
+                                    return handleInteraction(Number(badge.traitId), ((_a = badge === null || badge === void 0 ? void 0 : badge.interaction) === null || _a === void 0 ? void 0 : _a.config.button_text) || "OK");
+                                } }, badge.interaction.config.button_text))),
+                        badge.interaction.config.type === "multiple_choice" && (react_1.default.createElement("div", { className: "d-flex flex-row gap-2 align-items-center" },
+                            react_1.default.createElement("select", { className: "form-select form-select-sm w-75", onChange: function (e) { return setMultipleChoiceValue(e.target.value); } }, (_b = badge.interaction.config.choices) === null || _b === void 0 ? void 0 : _b.map(function (choice, index) { return (react_1.default.createElement("option", { key: index, value: choice.value }, choice.label)); })),
+                            react_1.default.createElement("button", { className: "btn btn-outline-primary btn-sm mc-btn", onClick: function () {
+                                    return handleInteraction(Number(badge.traitId), multipleChoiceValue);
+                                } }, "OK"))))),
+                    badge.interaction && badge.interaction.interacted_value && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement("p", null, badge.interaction.config.description),
+                        react_1.default.createElement("p", null, badge.interaction.config.type === "single_button"
+                            ? "I clicked the button."
+                            : "I chose this: ".concat(badge.interaction.config.choices
+                                ? (_c = badge.interaction.config.choices.find(function (choice) { var _a; return choice.value === ((_a = badge.interaction) === null || _a === void 0 ? void 0 : _a.interacted_value); })) === null || _c === void 0 ? void 0 : _c.label
+                                : ""))))))))));
+};
+exports.default = BadgeDetails;
+//# sourceMappingURL=BadgeDetails.js.map

package/dist/cjs/Card/BadgeDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeDetails.js","sourceRoot":"","sources":["../../../src/Card/BadgeDetails.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Card/BadgeDisplay.d.ts

@@ -0,0 +1,12 @@
+import { FC } from "react";
+import "./styles/BadgeDisplay.css";
+import { TraitModel } from "../models/metadata.model";
+type Props = {
+    badges: TraitModel[];
+    onBadgeSelected: (id: number) => void;
+    bgColor?: string;
+    color?: string;
+    badgeSize?: number;
+};
+declare const BadgeDisplay: FC<Props>;
+export default BadgeDisplay;

package/dist/cjs/Card/BadgeDisplay.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+require("./styles/BadgeDisplay.css");
+var BadgeDisplay = function (_a) {
+    var badges = _a.badges, onBadgeSelected = _a.onBadgeSelected, bgColor = _a.bgColor, color = _a.color, badgeSize = _a.badgeSize;
+    if (!badges || badges.length === 0)
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    return (react_1.default.createElement("div", { className: "badge-container" },
+        react_1.default.createElement("div", { className: "badge counter", onClick: function () { return onBadgeSelected(0); }, style: {
+                backgroundColor: bgColor,
+                color: color,
+                width: badgeSize ? "".concat(badgeSize * 0.7, "px") : "2.2em",
+                height: badgeSize ? "".concat(badgeSize * 0.7, "px") : "2.2em",
+                fontSize: badgeSize ? "".concat(badgeSize * 0.3, "px") : "1em",
+            } }, badges.length)));
+};
+exports.default = BadgeDisplay;
+//# sourceMappingURL=BadgeDisplay.js.map

package/dist/cjs/Card/BadgeDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeDisplay.js","sourceRoot":"","sources":["../../../src/Card/BadgeDisplay.tsx"],"names":[],"mappings":";;;AAAA,wDAAkC;AAClC,qCAAmC;AAWnC,IAAM,YAAY,GAAc,UAAC,EAAsD;QAApD,MAAM,YAAA,EAAE,eAAe,qBAAA,EAAE,OAAO,aAAA,EAAE,KAAK,WAAA,EAAE,SAAS,eAAA;IACnF,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,6DAAK,CAAC;IAEjD,OAAO,CACL,uCAAK,SAAS,EAAC,iBAAiB;QAC9B,uCACE,SAAS,EAAC,eAAe,EACzB,OAAO,EAAE,cAAM,OAAA,eAAe,CAAC,CAAC,CAAC,EAAlB,CAAkB,EACjC,KAAK,EAAE;gBACL,eAAe,EAAE,OAAO;gBACxB,KAAK,OAAA;gBACL,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,UAAG,SAAS,GAAG,GAAG,OAAI,CAAC,CAAC,CAAC,OAAO;gBACnD,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,UAAG,SAAS,GAAG,GAAG,OAAI,CAAC,CAAC,CAAC,OAAO;gBACpD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,UAAG,SAAS,GAAG,GAAG,OAAI,CAAC,CAAC,CAAC,KAAK;aACrD,IAEA,MAAM,CAAC,MAAM,CACV,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,YAAY,CAAC"}

package/dist/cjs/Card/BadgeList.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import "./styles/BadgeList.css";
+import { TraitModel } from "../models/metadata.model";
+type Props = {
+    badges: TraitModel[];
+    selectedBadgeId: number;
+    backgroundImage: string;
+    onClose: () => void;
+    userInteraction: Function | undefined;
+    badgeSize?: number;
+};
+declare const BadgeList: React.FC<Props>;
+export default BadgeList;

package/dist/cjs/Card/BadgeList.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+require("./styles/BadgeList.css");
+var BadgeDetails_1 = tslib_1.__importDefault(require("./BadgeDetails"));
+var BadgeList = function (_a) {
+    var badges = _a.badges, selectedBadgeId = _a.selectedBadgeId, backgroundImage = _a.backgroundImage, onClose = _a.onClose, userInteraction = _a.userInteraction, badgeSize = _a.badgeSize;
+    var _b = (0, react_1.useState)(null), selectedBadge = _b[0], setSelectedBadge = _b[1];
+    var _c = (0, react_1.useState)(false), badgeDetailsVisible = _c[0], setBadgeDetailsVisible = _c[1];
+    (0, react_1.useEffect)(function () {
+        if (selectedBadgeId !== 0) {
+            var selectedBadgeById = badges.find(function (b) { return +b.traitId === selectedBadgeId; });
+            if (!selectedBadgeById)
+                return;
+            setSelectedBadge(selectedBadgeById);
+            setBadgeDetailsVisible(true);
+        }
+        else {
+            setSelectedBadge(null);
+            setBadgeDetailsVisible(false);
+        }
+    }, [selectedBadgeId, badges]);
+    var selectBadge = function (traitId) {
+        var badge = badges.find(function (b) { return +b.traitId === traitId; }) || null;
+        setSelectedBadge(badge);
+        setBadgeDetailsVisible(true);
+    };
+    var handleOnClose = function () {
+        if (selectedBadgeId !== 0 || !badgeDetailsVisible) {
+            onClose();
+        }
+        setBadgeDetailsVisible(false);
+    };
+    return (react_1.default.createElement("div", { className: "badge-list ".concat(badgeDetailsVisible ? "details-visible" : ""), style: {
+            backgroundImage: "url(".concat(backgroundImage, ")"),
+            backgroundPosition: "center",
+            backgroundSize: "cover",
+        } },
+        react_1.default.createElement("div", { className: "close", onClick: handleOnClose },
+            react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16" },
+                react_1.default.createElement("path", { fill: "currentColor", d: "M15.1 3.1L12.9.9L8 5.9L3.1.9L.9 3.1l5 4.9l-5 4.9l2.2 2.2l4.9-5l4.9 5l2.2-2.2l-5-4.9z" }))),
+        react_1.default.createElement("div", { className: "overlay" },
+            react_1.default.createElement("div", { className: "badges" }, badges
+                .filter(function (badge) { return badge.badge_visibility !== "nowhere"; })
+                .map(function (badge) {
+                var _a;
+                return (react_1.default.createElement("div", { key: badge.traitId, className: "badge-item d-flex flex-row align-items-center", onClick: function () { return selectBadge(+badge.traitId); } },
+                    react_1.default.createElement("div", { className: "badge-holder d-flex" },
+                        react_1.default.createElement("img", { src: (_a = badge.icon_url) !== null && _a !== void 0 ? _a : undefined, alt: "Badge ".concat(badge.traitId), style: {
+                                width: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                                height: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                                minWidth: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                                minHeight: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                            } })),
+                    react_1.default.createElement("div", { className: "d-flex badge-label flex-shrink-1" }, badge.name)));
+            })),
+            react_1.default.createElement(BadgeDetails_1.default, { badge: selectedBadge, userInteraction: userInteraction }))));
+};
+exports.default = BadgeList;
+//# sourceMappingURL=BadgeList.js.map

package/dist/cjs/Card/BadgeList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeList.js","sourceRoot":"","sources":["../../../src/Card/BadgeList.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Card/CurrencyDisplay.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+import "./styles/CurrencyDisplay.css";
+import { BalancesModel } from "../models/metadata.model";
+type Props = {
+    balances: BalancesModel;
+    icon?: string;
+    bgColor: string;
+    color: string;
+};
+declare const CurrencyDisplay: FC<Props>;
+export default CurrencyDisplay;

package/dist/cjs/Card/CurrencyDisplay.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+require("./styles/CurrencyDisplay.css");
+var Icons_1 = require("../icons/Icons");
+var viem_1 = require("viem");
+var CurrencyDisplay = function (_a) {
+    var balances = _a.balances, icon = _a.icon, bgColor = _a.bgColor, color = _a.color;
+    var _b = (0, react_1.useState)(false), showCurrencies = _b[0], setShowCurrencies = _b[1];
+    var currencyRef = react_1.default.useRef(null);
+    var galaxis = balances.galaxis, stable = balances.stable, custom = balances.custom;
+    var allCurrencies = [
+        { key: "galaxis", data: galaxis, alwaysShow: true },
+        { key: "stable", data: stable, alwaysShow: false },
+        { key: "custom", data: custom, alwaysShow: false },
+    ];
+    (0, react_1.useEffect)(function () {
+        var handleClickAway = function (event) {
+            if (currencyRef.current && !currencyRef.current.contains(event.target)) {
+                setShowCurrencies(false);
+            }
+        };
+        document.addEventListener("mousedown", handleClickAway);
+        return function () { return document.removeEventListener("mousedown", handleClickAway); };
+    }, []);
+    var bigIntToDecimalNumber = function (value, decimals, returnDecimals) {
+        var convertedValue = (0, viem_1.formatUnits)(value, decimals);
+        var _a = convertedValue.split("."), integer = _a[0], decimal = _a[1];
+        var decimalValue = "";
+        if (decimal) {
+            decimalValue = decimal.substring(0, returnDecimals);
+        }
+        var formattedInteger = Number(integer).toLocaleString();
+        return "".concat(formattedInteger).concat(decimalValue ? ".".concat(decimalValue) : "");
+    };
+    return (react_1.default.createElement("div", { className: "currency-display", ref: currencyRef, onClick: function () { return setShowCurrencies(function (prev) { return !prev; }); } }, allCurrencies.map(function (_a) {
+        var key = _a.key, data = _a.data, alwaysShow = _a.alwaysShow;
+        if ((!alwaysShow && !showCurrencies) || !(data === null || data === void 0 ? void 0 : data.symbol))
+            return null;
+        var showMore = alwaysShow && (!!(stable === null || stable === void 0 ? void 0 : stable.symbol) || !!(custom === null || custom === void 0 ? void 0 : custom.symbol));
+        return (react_1.default.createElement("div", { key: key, className: "".concat(key, "-balance ").concat(showMore ? "show-more" : "") },
+            react_1.default.createElement("span", { style: { backgroundColor: bgColor, color: color } },
+                key === "galaxis" && (react_1.default.createElement(react_1.default.Fragment, null, icon ? (react_1.default.createElement("img", { src: icon, alt: "".concat(data === null || data === void 0 ? void 0 : data.symbol, " icon") })) : (react_1.default.createElement(Icons_1.GalaxisTokenLogo, { className: "galaxis-token-logo" })))), data === null || data === void 0 ? void 0 :
+                data.symbol,
+                ": ",
+                bigIntToDecimalNumber(BigInt(data === null || data === void 0 ? void 0 : data.balance), data === null || data === void 0 ? void 0 : data.decimals, 2),
+                key === "galaxis" && data.locked && (react_1.default.createElement("span", { className: "locked-amount" },
+                    "(+",
+                    bigIntToDecimalNumber(BigInt(data.locked), data.decimals, 2),
+                    " locked)",
+                    " ")),
+                showMore && (react_1.default.createElement(Icons_1.ShowMoreIcon, { className: "show-more-icon ".concat(showCurrencies ? "flipped" : "") })))));
+    })));
+};
+exports.default = CurrencyDisplay;
+//# sourceMappingURL=CurrencyDisplay.js.map

package/dist/cjs/Card/CurrencyDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyDisplay.js","sourceRoot":"","sources":["../../../src/Card/CurrencyDisplay.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Card/Decals.d.ts

@@ -0,0 +1,7 @@
+import { FC } from "react";
+import "./styles/Decals.css";
+type Props = {
+    decals: string[];
+};
+declare const Decals: FC<Props>;
+export default Decals;

package/dist/cjs/Card/Decals.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+require("./styles/Decals.css");
+var Decals = function (_a) {
+    var decals = _a.decals;
+    if (decals.length === 0)
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    return (react_1.default.createElement("div", { className: "decals" }, decals.map(function (d, i) { return (react_1.default.createElement("div", { key: "decal-" + i, className: "decal" },
+        react_1.default.createElement("img", { src: d, alt: "Decal ".concat(i) }))); })));
+};
+exports.default = Decals;
+//# sourceMappingURL=Decals.js.map

package/dist/cjs/Card/Decals.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Decals.js","sourceRoot":"","sources":["../../../src/Card/Decals.tsx"],"names":[],"mappings":";;;AAAA,wDAAkC;AAClC,+BAA6B;AAM7B,IAAM,MAAM,GAAc,UAAC,EAAU;QAAR,MAAM,YAAA;IACjC,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,6DAAK,CAAC;IAEtC,OAAO,CACL,uCAAK,SAAS,EAAC,QAAQ,IACpB,MAAM,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CACpB,uCAAK,GAAG,EAAE,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAC,OAAO;QACvC,uCAAK,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,gBAAS,CAAC,CAAE,GAAI,CAC9B,CACP,EAJqB,CAIrB,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,MAAM,CAAC"}

package/dist/cjs/Card/Frame.d.ts

@@ -0,0 +1,7 @@
+import { FC } from "react";
+import "./styles/Frame.css";
+type Props = {
+    frameUrl: string;
+};
+declare const Frame: FC<Props>;
+export default Frame;

package/dist/cjs/Card/Frame.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+require("./styles/Frame.css");
+var Frame = function (_a) {
+    var frameUrl = _a.frameUrl;
+    if (!frameUrl)
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    return (react_1.default.createElement("div", { className: "frame" },
+        react_1.default.createElement("img", { src: frameUrl, alt: "Frame" })));
+};
+exports.default = Frame;
+//# sourceMappingURL=Frame.js.map

package/dist/cjs/Card/Frame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Frame.js","sourceRoot":"","sources":["../../../src/Card/Frame.tsx"],"names":[],"mappings":";;;AAAA,wDAAkC;AAClC,8BAA4B;AAM5B,IAAM,KAAK,GAAc,UAAC,EAAY;QAAV,QAAQ,cAAA;IAClC,IAAI,CAAC,QAAQ;QAAE,OAAO,6DAAK,CAAC;IAC5B,OAAO,CACL,uCAAK,SAAS,EAAC,OAAO;QACpB,uCAAK,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAC,OAAO,GAAG,CAC9B,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC"}

package/dist/cjs/Card/FrontBadgeList.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import "./styles/FrontBadgeList.css";
+import { TraitModel } from "../models/metadata.model";
+type Props = {
+    badges: TraitModel[];
+    setFlipToBadges: React.Dispatch<React.SetStateAction<boolean>>;
+    setSelectedBadgeId: React.Dispatch<React.SetStateAction<number>>;
+    setFlipped: React.Dispatch<React.SetStateAction<boolean>>;
+    badgeSize?: number;
+    badgeVisibleCount?: number;
+};
+declare const FrontBadgeList: React.FC<Props>;
+export default FrontBadgeList;

package/dist/cjs/Card/FrontBadgeList.js

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+require("./styles/FrontBadgeList.css");
+var FrontBadgeList = function (_a) {
+    var badges = _a.badges, setFlipToBadges = _a.setFlipToBadges, setSelectedBadgeId = _a.setSelectedBadgeId, setFlipped = _a.setFlipped, badgeSize = _a.badgeSize, _b = _a.badgeVisibleCount, badgeVisibleCount = _b === void 0 ? 5 : _b;
+    var selectBadge = function (traitId) {
+        setFlipToBadges(true);
+        setSelectedBadgeId(traitId);
+        setFlipped(true);
+    };
+    var attributeHighlight = badges.filter(function (badge) { return badge.attribute_highlight !== undefined; });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: "badge-list-on-front", style: {
+                top: badgeSize ? "".concat(badgeSize, "px") : "4em",
+            } }, badges
+            .filter(function (badge) { return badge.decorator_type !== "decal" && badge.decorator_type !== "frame"; })
+            .filter(function (badge) {
+            return badge.badge_visibility !== "back_only" && badge.badge_visibility !== "nowhere";
+        })
+            .slice(0, badgeVisibleCount)
+            .map(function (badge) {
+            var _a;
+            return (react_1.default.createElement("div", { key: badge.traitId, className: "badge-item d-flex flex-row align-items-center", onClick: function () { return selectBadge(+badge.traitId); } },
+                react_1.default.createElement("div", { className: "front-badge d-flex" },
+                    react_1.default.createElement("img", { src: (_a = badge.icon_url) !== null && _a !== void 0 ? _a : undefined, alt: "Badge ".concat(badge.traitId), style: {
+                            width: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                            height: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                            minWidth: badgeSize ? "".concat(badgeSize, "px") : "3em",
+                        } }))));
+        })),
+        attributeHighlight.length > 0 &&
+            attributeHighlight.map(function (highlight, index) {
+                var _a;
+                // HTML content is the source of truth for positioning
+                // Wrapper fills the card and allows content to position itself
+                var content = highlight.attribute_highlight.content;
+                var shouldOpenAttribute = (_a = highlight.attribute_highlight) === null || _a === void 0 ? void 0 : _a.openAttributeOnClick;
+                // Wrapper fills the card as a positioning context
+                // pointerEvents: none ensures it doesn't interfere with card interactions
+                var wrapperStyle = {
+                    position: "absolute",
+                    inset: 0,
+                    pointerEvents: "none",
+                };
+                // Inject pointer-events:auto into the content if openAttributeOnClick is enabled
+                // This ensures only the inner container is clickable, not the full-card wrapper
+                var modifiedContent = content;
+                if (shouldOpenAttribute) {
+                    // Find the first element with style attribute and inject pointer-events
+                    var hasExistingStyle = /<(\w+)[^>]*\sstyle="/i.test(modifiedContent);
+                    if (hasExistingStyle) {
+                        // Inject into the first element's existing style attribute
+                        modifiedContent = modifiedContent.replace(/(<\w+[^>]*\sstyle=")([^"]*)/i, "$1cursor: pointer; pointer-events: auto; $2");
+                    }
+                    else {
+                        // Add style attribute to the first element
+                        modifiedContent = modifiedContent.replace(/(<\w+)([^>]*>)/i, '$1 style="cursor: pointer; pointer-events: auto;"$2');
+                    }
+                }
+                return (react_1.default.createElement("div", { style: wrapperStyle, key: index, dangerouslySetInnerHTML: { __html: modifiedContent }, onClick: function (e) {
+                        var target = e.target;
+                        var anchor = target.closest("a");
+                        if (!shouldOpenAttribute) {
+                            if (anchor)
+                                return; // Allow anchor clicks
+                            return;
+                        }
+                        if (anchor) {
+                            e.preventDefault();
+                            e.stopPropagation();
+                        }
+                        selectBadge(+highlight.traitId);
+                    } }));
+            })));
+};
+exports.default = FrontBadgeList;
+//# sourceMappingURL=FrontBadgeList.js.map

package/dist/cjs/Card/FrontBadgeList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FrontBadgeList.js","sourceRoot":"","sources":["../../../src/Card/FrontBadgeList.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Card/GSpinner/GSpinner.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+import "../styles/GSpinner.css";
+type Props = {
+    className?: string;
+    size?: number;
+    thickness?: number;
+    color?: string;
+    secondaryColor?: string;
+};
+declare const GSpinner: FC<Props>;
+export default GSpinner;

package/dist/cjs/Card/GSpinner/GSpinner.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+require("../styles/GSpinner.css");
+var GSpinner = function (_a) {
+    var className = _a.className, _b = _a.size, size = _b === void 0 ? 24 : _b, _c = _a.thickness, thickness = _c === void 0 ? 100 : _c, _d = _a.color, color = _d === void 0 ? "white" : _d, _e = _a.secondaryColor, secondaryColor = _e === void 0 ? "gray" : _e;
+    return (react_1.default.createElement("svg", { fill: "none", viewBox: "0 0 66 66", className: className, style: { overflow: "visible", width: "".concat(size, "px") } },
+        react_1.default.createElement("circle", { cx: "33", cy: "33", fill: "none", r: "28", stroke: secondaryColor, strokeWidth: 4 * (thickness / 100) }),
+        react_1.default.createElement("circle", { cx: "33", cy: "33", fill: "none", r: "28", stroke: color, strokeDasharray: "1, 174", strokeDashoffset: "306", strokeLinecap: "round", strokeWidth: 4 * (thickness / 100), style: {
+                animation: "1.4s linear 0s infinite normal none running gspinner-animation",
+            } })));
+};
+exports.default = GSpinner;
+//# sourceMappingURL=GSpinner.js.map

package/dist/cjs/Card/GSpinner/GSpinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GSpinner.js","sourceRoot":"","sources":["../../../../src/Card/GSpinner/GSpinner.tsx"],"names":[],"mappings":";;;AAAA,wDAAkC;AAClC,kCAAgC;AAUhC,IAAM,QAAQ,GAAc,UAAC,EAM5B;QALC,SAAS,eAAA,EACT,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAe,EAAf,SAAS,mBAAG,GAAG,KAAA,EACf,aAAe,EAAf,KAAK,mBAAG,OAAO,KAAA,EACf,sBAAuB,EAAvB,cAAc,mBAAG,MAAM,KAAA;IAEvB,OAAO,CACL,uCACE,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,UAAG,IAAI,OAAI,EAAE;QAElD,0CACE,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,IAAI,EAAC,MAAM,EACX,CAAC,EAAC,IAAI,EACN,MAAM,EAAE,cAAc,EACtB,WAAW,EAAE,CAAC,GAAG,CAAC,SAAS,GAAG,GAAG,CAAC,GAC1B;QACV,0CACE,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,IAAI,EAAC,MAAM,EACX,CAAC,EAAC,IAAI,EACN,MAAM,EAAE,KAAK,EACb,eAAe,EAAC,QAAQ,EACxB,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAC,OAAO,EACrB,WAAW,EAAE,CAAC,GAAG,CAAC,SAAS,GAAG,GAAG,CAAC,EAClC,KAAK,EAAE;gBACL,SAAS,EAAE,gEAAgE;aAC5E,GACO,CACN,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,QAAQ,CAAC"}

package/dist/cjs/Card/GSpinner/index.d.ts

@@ -0,0 +1 @@
+export { default as GSpinner } from "./GSpinner";

package/dist/cjs/Card/GSpinner/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GSpinner = void 0;
+var tslib_1 = require("tslib");
+var GSpinner_1 = require("./GSpinner");
+Object.defineProperty(exports, "GSpinner", { enumerable: true, get: function () { return tslib_1.__importDefault(GSpinner_1).default; } });
+//# sourceMappingURL=index.js.map

package/dist/cjs/Card/GSpinner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/Card/GSpinner/index.ts"],"names":[],"mappings":";;;;AAAA,uCAAiD;AAAxC,6HAAA,OAAO,OAAY"}

package/dist/cjs/Card/GalaxisCard.d.ts

@@ -0,0 +1,15 @@
+import { FC } from "react";
+import "./styles/GalaxisCard.css";
+import { BalancesModel, MetadataModel } from "../models/metadata.model";
+type Props = {
+    metadataUrl?: string;
+    metadata?: MetadataModel;
+    communityCurrency?: BalancesModel;
+    cardLevel?: string;
+    icon: string;
+    userInteraction: Function | undefined;
+    badgeSize?: number;
+    badgeVisibleCount?: number;
+};
+declare const GalaxisCard: FC<Props>;
+export default GalaxisCard;