hitripod-react-iztro/lib/Izpalace/Izpalace.js

基于iztro实现的react紫微斗数星盘组件。A react component used to generate an astrolabe of ziweidoushu based on iztro.

"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Izpalace = void 0;
var react_1 = __importStar(require("react"));
var classnames_1 = __importDefault(require("classnames"));
require("./Izpalace.css");
var Izstar_1 = require("../Izstar");
var i18n_1 = require("iztro/lib/i18n");
var utils_1 = require("iztro/lib/utils");
var Izpalace = function (_a) {
    var _b, _c, _d, _e;
    var index = _a.index, taichiPalace = _a.taichiPalace, focusedIndex = _a.focusedIndex, onFocused = _a.onFocused, horoscope = _a.horoscope, activeHeavenlyStem = _a.activeHeavenlyStem, toggleActiveHeavenlyStem = _a.toggleActiveHeavenlyStem, hoverHeavenlyStem = _a.hoverHeavenlyStem, setHoverHeavenlyStem = _a.setHoverHeavenlyStem, _f = _a.showDecadalScope, showDecadalScope = _f === void 0 ? false : _f, _g = _a.showYearlyScope, showYearlyScope = _g === void 0 ? false : _g, _h = _a.showMonthlyScope, showMonthlyScope = _h === void 0 ? false : _h, _j = _a.showDailyScope, showDailyScope = _j === void 0 ? false : _j, _k = _a.showHourlyScope, showHourlyScope = _k === void 0 ? false : _k, toggleScope = _a.toggleScope, toggleTaichiPoint = _a.toggleTaichiPoint, palace = __rest(_a, ["index", "taichiPalace", "focusedIndex", "onFocused", "horoscope", "activeHeavenlyStem", "toggleActiveHeavenlyStem", "hoverHeavenlyStem", "setHoverHeavenlyStem", "showDecadalScope", "showYearlyScope", "showMonthlyScope", "showDailyScope", "showHourlyScope", "toggleScope", "toggleTaichiPoint"]);
    var horoscopeNames = (0, react_1.useMemo)(function () {
        var horoscopeNames = [];
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.decadal.index) === index) {
            horoscopeNames.push(__assign(__assign({}, horoscope.decadal), { scope: "decadal", show: showDecadalScope }));
        }
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly.index) === index) {
            horoscopeNames.push(__assign(__assign({}, horoscope.yearly), { scope: "yearly", show: showYearlyScope }));
        }
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.monthly.index) === index) {
            horoscopeNames.push(__assign(__assign({}, horoscope.monthly), { scope: "monthly", show: showMonthlyScope }));
        }
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.daily.index) === index) {
            horoscopeNames.push(__assign(__assign({}, horoscope.daily), { scope: "daily", show: showDailyScope }));
        }
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.hourly.index) === index) {
            horoscopeNames.push(__assign(__assign({}, horoscope.hourly), { scope: "hourly", show: showHourlyScope }));
        }
        if ((horoscope === null || horoscope === void 0 ? void 0 : horoscope.age.index) === index) {
            horoscopeNames.push({
                name: horoscope.age.name,
                heavenlyStem: undefined,
                scope: "age",
                show: false,
            });
        }
        return horoscopeNames;
    }, [
        horoscope,
        showDecadalScope,
        showYearlyScope,
        showMonthlyScope,
        showDailyScope,
        showHourlyScope,
    ]);
    var horoscopeMutagens = (0, react_1.useMemo)(function () {
        if (!horoscope) {
            return [];
        }
        return [
            {
                mutagen: horoscope.decadal.mutagen,
                scope: "decadal",
                show: showDecadalScope,
            },
            {
                mutagen: horoscope.yearly.mutagen,
                scope: "yearly",
                show: showYearlyScope,
            },
            {
                mutagen: horoscope.monthly.mutagen,
                scope: "monthly",
                show: showMonthlyScope,
            },
            {
                mutagen: horoscope.daily.mutagen,
                scope: "daily",
                show: showDailyScope,
            },
            {
                mutagen: horoscope.hourly.mutagen,
                scope: "hourly",
                show: showHourlyScope,
            },
        ];
    }, [
        horoscope,
        showDecadalScope,
        showYearlyScope,
        showMonthlyScope,
        showDailyScope,
        showHourlyScope,
    ]);
    return (react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace", {
            "focused-palace": focusedIndex === index,
            "opposite-palace": focusedIndex != undefined && index === (0, utils_1.fixIndex)(focusedIndex + 6),
            "surrounded-palace": focusedIndex != undefined &&
                (index === (0, utils_1.fixIndex)(focusedIndex + 4) ||
                    index === (0, utils_1.fixIndex)(focusedIndex - 4)),
        }), style: { gridArea: "g".concat(index) }, onMouseEnter: function () { return onFocused === null || onFocused === void 0 ? void 0 : onFocused(index); }, onMouseLeave: function () { return onFocused === null || onFocused === void 0 ? void 0 : onFocused(undefined); } },
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-major") }, palace.majorStars.map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name, activeHeavenlyStem: activeHeavenlyStem, hoverHeavenlyStem: hoverHeavenlyStem, palaceHeavenlyStem: (0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"), horoscopeMutagens: horoscopeMutagens }, star))); })),
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-minor") }, palace.minorStars.map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name, activeHeavenlyStem: activeHeavenlyStem, hoverHeavenlyStem: hoverHeavenlyStem, palaceHeavenlyStem: (0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"), horoscopeMutagens: horoscopeMutagens }, star))); })),
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-adj") },
            react_1.default.createElement("div", null, palace.adjectiveStars.slice(5).map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name }, star))); })),
            react_1.default.createElement("div", null, palace.adjectiveStars.slice(0, 5).map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name }, star))); }))),
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-horo-star") },
            react_1.default.createElement("div", { className: (0, classnames_1.default)("stars") }, ((_b = horoscope === null || horoscope === void 0 ? void 0 : horoscope.decadal) === null || _b === void 0 ? void 0 : _b.stars) &&
                ((_c = horoscope === null || horoscope === void 0 ? void 0 : horoscope.decadal) === null || _c === void 0 ? void 0 : _c.stars[index].map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name }, star))); }))),
            react_1.default.createElement("div", { className: (0, classnames_1.default)("stars") }, ((_d = horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly) === null || _d === void 0 ? void 0 : _d.stars) &&
                ((_e = horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly) === null || _e === void 0 ? void 0 : _e.stars[index].map(function (star) { return (react_1.default.createElement(Izstar_1.Izstar, __assign({ key: star.name }, star))); })))),
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-fate") }, horoscopeNames === null || horoscopeNames === void 0 ? void 0 : horoscopeNames.map(function (item) {
            var _a;
            return (react_1.default.createElement("span", { key: item.name, className: (0, classnames_1.default)((_a = {},
                    _a["iztro-palace-".concat(item.scope, "-active")] = item.show,
                    _a)), onClick: item.scope ? function () { return toggleScope === null || toggleScope === void 0 ? void 0 : toggleScope(item.scope); } : undefined },
                item.name,
                item.heavenlyStem && "\u00B7".concat(item.heavenlyStem)));
        })),
        react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-footer") },
            react_1.default.createElement("div", null,
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-lft24") },
                    react_1.default.createElement("div", null, palace.changsheng12),
                    react_1.default.createElement("div", null, palace.boshi12)),
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-name"), onClick: function () { return toggleTaichiPoint === null || toggleTaichiPoint === void 0 ? void 0 : toggleTaichiPoint(index); } },
                    react_1.default.createElement("span", { className: "iztro-palace-name-wrapper" },
                        palace.name,
                        react_1.default.createElement("span", { className: "iztro-palace-name-taichi" }, taichiPalace &&
                            ((0, i18n_1.kot)(taichiPalace) === (0, i18n_1.kot)("命宫")
                                ? "☯"
                                : taichiPalace))),
                    palace.isBodyPalace && (react_1.default.createElement("span", { className: (0, classnames_1.default)("iztro-palace-name-body") },
                        "\u00B7",
                        (0, i18n_1.t)("bodyPalace"))))),
            react_1.default.createElement("div", null,
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-scope") },
                    react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-scope-age") }, palace.ages.slice(0, 7).join(" ")),
                    react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-scope-decadal") }, palace.decadal.range.join(" - "))),
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-dynamic-name") },
                    showDecadalScope && (react_1.default.createElement("span", { className: "iztro-palace-dynamic-name-decadal" }, horoscope === null || horoscope === void 0 ? void 0 : horoscope.decadal.palaceNames[index])),
                    showYearlyScope && (react_1.default.createElement("span", { className: "iztro-palace-dynamic-name-yearly" }, horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly.palaceNames[index])),
                    showMonthlyScope && (react_1.default.createElement("span", { className: "iztro-palace-dynamic-name-monthly" }, horoscope === null || horoscope === void 0 ? void 0 : horoscope.monthly.palaceNames[index])),
                    showDailyScope && (react_1.default.createElement("span", { className: "iztro-palace-dynamic-name-daily" }, horoscope === null || horoscope === void 0 ? void 0 : horoscope.daily.palaceNames[index])),
                    showHourlyScope && (react_1.default.createElement("span", { className: "iztro-palace-dynamic-name-hourly" }, horoscope === null || horoscope === void 0 ? void 0 : horoscope.hourly.palaceNames[index])))),
            react_1.default.createElement("div", null,
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-rgt24") },
                    react_1.default.createElement("div", null, showYearlyScope
                        ? horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly.yearlyDecStar.suiqian12[index]
                        : palace.suiqian12),
                    react_1.default.createElement("div", null, showYearlyScope
                        ? horoscope === null || horoscope === void 0 ? void 0 : horoscope.yearly.yearlyDecStar.jiangqian12[index]
                        : palace.jiangqian12)),
                react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-palace-gz", {
                        "iztro-palace-gz-active": activeHeavenlyStem ===
                            (0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"),
                    }), onClick: function () {
                        return toggleActiveHeavenlyStem === null || toggleActiveHeavenlyStem === void 0 ? void 0 : toggleActiveHeavenlyStem((0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"));
                    }, onMouseEnter: function () {
                        return setHoverHeavenlyStem === null || setHoverHeavenlyStem === void 0 ? void 0 : setHoverHeavenlyStem((0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"));
                    }, onMouseLeave: function () { return setHoverHeavenlyStem === null || setHoverHeavenlyStem === void 0 ? void 0 : setHoverHeavenlyStem(undefined); } },
                    react_1.default.createElement("span", { className: (0, classnames_1.default)({
                            "iztro-palace-gz-active": activeHeavenlyStem ===
                                (0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"),
                        }) },
                        palace.heavenlyStem,
                        palace.earthlyBranch))))));
};
exports.Izpalace = Izpalace;