react-iztro - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

lib/Izpalace/Izpalace.d.ts

 import React from "react";
 import { IzpalaceProps } from "./Izpalace.type";
 import "./Izpalace.css";
-export declare const Izpalace: ({ index, focusedIndex, onFocused, horoscope, activeHeavenlyStem, toggleActiveHeavenlyStem, showDecadalScope, showYearlyScope, showMonthlyScope, showDailyScope, showHourlyScope, toggleScope, ...palace }: IzpalaceProps) => React.JSX.Element;
+export declare const Izpalace: ({ index, focusedIndex, onFocused, horoscope, activeHeavenlyStem, toggleActiveHeavenlyStem, hoverHeavenlyStem, setHoverHeavenlyStem, showDecadalScope, showYearlyScope, showMonthlyScope, showDailyScope, showHourlyScope, toggleScope, ...palace }: IzpalaceProps) => React.JSX.Element;

lib/Izpalace/Izpalace.js

@@ -60,3 +60,3 @@ "use strict";
     var _b, _c, _d, _e;
-    var index = _a.index, focusedIndex = _a.focusedIndex, onFocused = _a.onFocused, horoscope = _a.horoscope, activeHeavenlyStem = _a.activeHeavenlyStem, toggleActiveHeavenlyStem = _a.toggleActiveHeavenlyStem, _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, palace = __rest(_a, ["index", "focusedIndex", "onFocused", "horoscope", "activeHeavenlyStem", "toggleActiveHeavenlyStem", "showDecadalScope", "showYearlyScope", "showMonthlyScope", "showDailyScope", "showHourlyScope", "toggleScope"]);
+    var index = _a.index, 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, palace = __rest(_a, ["index", "focusedIndex", "onFocused", "horoscope", "activeHeavenlyStem", "toggleActiveHeavenlyStem", "hoverHeavenlyStem", "setHoverHeavenlyStem", "showDecadalScope", "showYearlyScope", "showMonthlyScope", "showDailyScope", "showHourlyScope", "toggleScope"]);
     var horoscopeNames = (0, react_1.useMemo)(function () {
@@ -142,4 +142,4 @@ var horoscopeNames = [];
         }), 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, 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, palaceHeavenlyStem: (0, i18n_1.kot)(palace.heavenlyStem, "Heavenly"), horoscopeMutagens: horoscopeMutagens }, star))); })),
+        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") },
@@ -194,3 +194,5 @@ 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))); })),
                         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)({
@@ -197,0 +199,0 @@ "iztro-palace-gz-active": activeHeavenlyStem ===

lib/Izpalace/Izpalace.type.d.ts

@@ -15,2 +15,4 @@ import FunctionalHoroscope from "iztro/lib/astro/FunctionalHoroscope";
     activeHeavenlyStem?: HeavenlyStemKey;
+    hoverHeavenlyStem?: HeavenlyStemKey;
+    setHoverHeavenlyStem?: (heavenlyStem?: HeavenlyStemKey) => void;
     toggleActiveHeavenlyStem?: (heavenlyStem: HeavenlyStemKey) => void;
@@ -17,0 +19,0 @@ toggleScope?: (scope: Scope) => void;

lib/Izstar/Izstar.d.ts

 import React from "react";
 import { IzstarProps } from "./Izstar.type";
-export declare const Izstar: ({ horoscopeMutagens, activeHeavenlyStem, palaceHeavenlyStem, ...star }: IzstarProps) => React.JSX.Element;
+export declare const Izstar: ({ horoscopeMutagens, activeHeavenlyStem, hoverHeavenlyStem, palaceHeavenlyStem, ...star }: IzstarProps) => React.JSX.Element;

lib/Izstar/Izstar.js

@@ -47,3 +47,3 @@ "use strict";
 var Izstar = function (_a) {
-    var horoscopeMutagens = _a.horoscopeMutagens, activeHeavenlyStem = _a.activeHeavenlyStem, palaceHeavenlyStem = _a.palaceHeavenlyStem, star = __rest(_a, ["horoscopeMutagens", "activeHeavenlyStem", "palaceHeavenlyStem"]);
+    var horoscopeMutagens = _a.horoscopeMutagens, activeHeavenlyStem = _a.activeHeavenlyStem, hoverHeavenlyStem = _a.hoverHeavenlyStem, palaceHeavenlyStem = _a.palaceHeavenlyStem, star = __rest(_a, ["horoscopeMutagens", "activeHeavenlyStem", "hoverHeavenlyStem", "palaceHeavenlyStem"]);
     var mutagenStyle = (0, react_1.useMemo)(function () {
@@ -60,4 +60,15 @@ if (!activeHeavenlyStem) {
     }, [activeHeavenlyStem, star.name]);
+    var hoverMutagenStyle = (0, react_1.useMemo)(function () {
+        if (!hoverHeavenlyStem) {
+            return "";
+        }
+        var mutagens = (0, utils_1.getMutagensByHeavenlyStem)((0, i18n_1.t)(hoverHeavenlyStem));
+        var index = mutagens.indexOf(star.name);
+        if (index < 0) {
+            return "";
+        }
+        return "iztro-star-hover-mutagen-".concat(index);
+    }, [hoverHeavenlyStem, star.name]);
     var selfMutagenStyle = (0, react_1.useMemo)(function () {
-        if (!palaceHeavenlyStem) {
+        if (!palaceHeavenlyStem || activeHeavenlyStem || hoverHeavenlyStem) {
             return undefined;
@@ -71,5 +82,5 @@ }
         return "iztro-star-self-mutagen-".concat(index);
-    }, [palaceHeavenlyStem]);
+    }, [palaceHeavenlyStem, activeHeavenlyStem, hoverHeavenlyStem]);
     return (react_1.default.createElement("div", { className: (0, classnames_1.default)("iztro-star", "iztro-star-".concat(star.type)) },
-        react_1.default.createElement("span", { className: (0, classnames_1.default)(mutagenStyle, selfMutagenStyle, {
+        react_1.default.createElement("span", { className: (0, classnames_1.default)("star-with-mutagen", mutagenStyle, selfMutagenStyle, hoverMutagenStyle, {
                 "iztro-star-self-mutagen": !!selfMutagenStyle,
@@ -76,0 +87,0 @@ }) }, star.name),

lib/Izstar/Izstar.type.d.ts

@@ -12,3 +12,4 @@ import FunctionalStar from "iztro/lib/star/FunctionalStar";
     activeHeavenlyStem?: HeavenlyStemKey;
+    hoverHeavenlyStem?: HeavenlyStemKey;
     horoscopeMutagens?: HoroscopeMutagen[];
 } & FunctionalStar;

lib/Iztrolabe/Iztrolabe.js

@@ -50,11 +50,12 @@ "use strict";
     var _a = (0, react_1.useState)(), activeHeavenlyStem = _a[0], setActiveHeavenlyStem = _a[1];
-    var _b = (0, react_1.useState)(), focusedIndex = _b[0], setFocusedIndex = _b[1];
-    var _c = (0, react_1.useState)(false), showDecadal = _c[0], setShowDecadal = _c[1];
-    var _d = (0, react_1.useState)(false), showYearly = _d[0], setShowYearly = _d[1];
-    var _e = (0, react_1.useState)(false), showMonthly = _e[0], setShowMonthly = _e[1];
-    var _f = (0, react_1.useState)(false), showDaily = _f[0], setShowDaily = _f[1];
-    var _g = (0, react_1.useState)(false), showHourly = _g[0], setShowShowHourly = _g[1];
-    var _h = (0, react_1.useState)(), horoscopeDate = _h[0], setHoroscopeDate = _h[1];
-    var _j = (0, react_1.useState)(), horoscopeHour = _j[0], setHoroscopeHour = _j[1];
-    var _k = (0, iztro_hook_1.useIztro)({
+    var _b = (0, react_1.useState)(), hoverHeavenlyStem = _b[0], setHoverHeavenlyStem = _b[1];
+    var _c = (0, react_1.useState)(), focusedIndex = _c[0], setFocusedIndex = _c[1];
+    var _d = (0, react_1.useState)(false), showDecadal = _d[0], setShowDecadal = _d[1];
+    var _e = (0, react_1.useState)(false), showYearly = _e[0], setShowYearly = _e[1];
+    var _f = (0, react_1.useState)(false), showMonthly = _f[0], setShowMonthly = _f[1];
+    var _g = (0, react_1.useState)(false), showDaily = _g[0], setShowDaily = _g[1];
+    var _h = (0, react_1.useState)(false), showHourly = _h[0], setShowShowHourly = _h[1];
+    var _j = (0, react_1.useState)(), horoscopeDate = _j[0], setHoroscopeDate = _j[1];
+    var _k = (0, react_1.useState)(), horoscopeHour = _k[0], setHoroscopeHour = _k[1];
+    var _l = (0, iztro_hook_1.useIztro)({
         birthday: props.birthday,
@@ -67,3 +68,3 @@ birthTime: props.birthTime,
         lang: props.lang,
-    }), astrolabe = _k.astrolabe, horoscope = _k.horoscope, setHoroscope = _k.setHoroscope;
+    }), astrolabe = _l.astrolabe, horoscope = _l.horoscope, setHoroscope = _l.setHoroscope;
     var toggleShowScope = function (scope) {
@@ -138,3 +139,3 @@ switch (scope) {
         astrolabe.palaces.map(function (palace, index) {
-            return (react_1.default.createElement(Izpalace_1.Izpalace, __assign({ key: palace.earthlyBranch, index: index, focusedIndex: focusedIndex, onFocused: setFocusedIndex, horoscope: horoscope, showDecadalScope: showDecadal, showYearlyScope: showYearly, showMonthlyScope: showMonthly, showDailyScope: showDaily, showHourlyScope: showHourly, toggleScope: toggleShowScope, activeHeavenlyStem: activeHeavenlyStem, toggleActiveHeavenlyStem: toggleActiveHeavenlyStem }, palace)));
+            return (react_1.default.createElement(Izpalace_1.Izpalace, __assign({ key: palace.earthlyBranch, index: index, focusedIndex: focusedIndex, onFocused: setFocusedIndex, horoscope: horoscope, showDecadalScope: showDecadal, showYearlyScope: showYearly, showMonthlyScope: showMonthly, showDailyScope: showDaily, showHourlyScope: showHourly, toggleScope: toggleShowScope, activeHeavenlyStem: activeHeavenlyStem, toggleActiveHeavenlyStem: toggleActiveHeavenlyStem, hoverHeavenlyStem: hoverHeavenlyStem, setHoverHeavenlyStem: setHoverHeavenlyStem }, palace)));
         }),
@@ -141,0 +142,0 @@ react_1.default.createElement(IzpalaceCenter_1.IzpalaceCenter, __assign({ astrolabe: astrolabe, horoscope: horoscope, horoscopeDate: horoscopeDate, horoscopeHour: horoscopeHour, setHoroscopeDate: setHoroscopeDate, setHoroscopeHour: setHoroscopeHour }, dynamic))));

package.json

 {
   "name": "react-iztro",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "基于iztro实现的react紫微斗数星盘组件。A react component used to generate an astrolabe of ziweidoushu based on iztro.",
@@ -70,4 +70,4 @@ "main": "lib/index.js",
     "classnames": "^2.3.2",
-    "iztro": "^2.0.3",
-    "iztro-hook": "^1.2.2",
+    "iztro": "^2.0.5",
+    "iztro-hook": "^1.2.3",
     "lunar-lite": "^0.0.3"
@@ -74,0 +74,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

72258

increased by2.98%

Lines of code

1444

increased by3%

Dependency changes

• Updatediztro@^2.0.5

• Updatediztro-hook@^1.2.3