feat: taichi palaces

SylarLong · Mar 10, 2024 · 8c70fb4 · 8c70fb4
1 parent 84784d5
commit 8c70fb4
Show file tree

Hide file tree

Showing 6 changed files with 80 additions and 27 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "react-iztro",
- "version": "1.2.7",
+ "version": "1.3.0",
  "description": "基于iztro实现的react紫微斗数星盘组件。A react component used to generate an astrolabe of ziweidoushu based on iztro.",
  "main": "lib/index.js",
  "types": "lib/index.d.ts",
@@ -67,9 +67,9 @@
  },
  "dependencies": {
  "classnames": "^2.3.2",
- "iztro": "2.2.3",
- "iztro-hook": "1.2.11",
- "lunar-lite": "^0.1.1"
+ "iztro": "2.3.0",
+ "iztro-hook": "1.2.12",
+ "lunar-lite": "^0.1.2"
  },
  "resolutions": {
  "jackspeak": "2.1.1"

diff --git a/src/Izpalace/Izpalace.css b/src/Izpalace/Izpalace.css
@@ -98,6 +98,21 @@
  cursor: pointer;
  text-wrap: nowrap;
 }
+.iztro-palace-name .iztro-palace-name-wrapper {
+ position: relative;
+}
+.iztro-palace-name .iztro-palace-name-taichi {
+ position: absolute;
+ font-size: 12px;
+ line-height: 14px;
+ background-color: var(--iztro-color-major);
+ padding: 0 2px;
+ color: #fff;
+ z-index: 2;
+ border-radius: 0 4px 4px 0;
+ font-weight: normal !important;
+ margin-top: 2px;
+}
 .iztro-palace-gz {
  text-align: right;
  cursor: pointer;

diff --git a/src/Izpalace/Izpalace.tsx b/src/Izpalace/Izpalace.tsx
@@ -3,12 +3,13 @@ import { HoroscopeForPalace, IzpalaceProps } from "./Izpalace.type";
 import classNames from "classnames";
 import "./Izpalace.css";
 import { Izstar } from "../Izstar";
-import { HeavenlyStemKey, kot, t } from "iztro/lib/i18n";
+import { HeavenlyStemKey, PalaceKey, kot, t } from "iztro/lib/i18n";
 import { fixIndex } from "iztro/lib/utils";
 import { Scope } from "iztro/lib/data/types";
 
 export const Izpalace = ({
  index,
+ taichiPalace,
  focusedIndex,
  onFocused,
  horoscope,
@@ -22,6 +23,7 @@ export const Izpalace = ({
  showDailyScope = false,
  showHourlyScope = false,
  toggleScope,
+ toggleTaichiPoint,
  ...palace
 }: IzpalaceProps) => {
  const horoscopeNames = useMemo<HoroscopeForPalace[]>(() => {
@@ -220,8 +222,19 @@ export const Izpalace = ({
  <div>{palace.changsheng12}</div>
  <div>{palace.boshi12}</div>
  </div>
- <div className={classNames("iztro-palace-name")}>
- {palace.name}
+ <div
+ className={classNames("iztro-palace-name")}
+ onClick={() => toggleTaichiPoint?.(index)}
+ >
+ <span className="iztro-palace-name-wrapper">
+ {palace.name}
+ <span className="iztro-palace-name-taichi">
+ {taichiPalace &&
+ (kot<PalaceKey>(taichiPalace) === kot<PalaceKey>("命宫")
+ ? "☯"
+ : taichiPalace)}
+ </span>
+ </span>
  {palace.isBodyPalace && (
  <span className={classNames("iztro-palace-name-body")}>
  ·{t("bodyPalace")}
@@ -232,7 +245,7 @@ export const Izpalace = ({
  <div>
  <div className={classNames("iztro-palace-scope")}>
  <div className={classNames("iztro-palace-scope-age")}>
- {palace.ages.join(" ")}
+ {palace.ages.slice(0, 7).join(" ")}
  </div>
  <div className={classNames("iztro-palace-scope-decadal")}>
  {palace.decadal.range.join(" - ")}

diff --git a/src/Izpalace/Izpalace.type.ts b/src/Izpalace/Izpalace.type.ts
@@ -5,6 +5,7 @@ import { HeavenlyStemKey } from "iztro/lib/i18n";
 
 export type IzpalaceProps = {
  index: number;
+ taichiPalace?: string;
  focusedIndex?: number;
  horoscope?: IFunctionalHoroscope;
  showDecadalScope?: boolean;
@@ -18,6 +19,7 @@ export type IzpalaceProps = {
  toggleActiveHeavenlyStem?: (heavenlyStem: HeavenlyStemKey) => void;
  toggleScope?: (scope: Scope) => void;
  onFocused?: (index?: number) => void;
+ toggleTaichiPoint?: (index: number) => void;
 } & IFunctionalPalace;
 
 export type HoroscopeForPalace = {

diff --git a/src/Iztrolabe/Iztrolabe.tsx b/src/Iztrolabe/Iztrolabe.tsx
@@ -8,8 +8,11 @@ import "./Iztrolabe.css";
 import "../theme/default.css";
 import { Scope } from "iztro/lib/data/types";
 import { HeavenlyStemKey } from "iztro/lib/i18n";
+import { getPalaceNames } from "iztro/lib/astro";
 
 export const Iztrolabe: React.FC<IztrolabeProps> = (props) => {
+ const [taichiPoint, setTaichiPoint] = useState(-1);
+ const [taichiPalaces, setTaichiPalaces] = useState<undefined | string[]>();
  const [activeHeavenlyStem, setActiveHeavenlyStem] =
  useState<HeavenlyStemKey>();
  const [hoverHeavenlyStem, setHoverHeavenlyStem] = useState<HeavenlyStemKey>();
@@ -105,6 +108,24 @@ export const Iztrolabe: React.FC<IztrolabeProps> = (props) => {
  setHoroscope(horoscopeDate ?? new Date(), horoscopeHour);
  }, [horoscopeDate, horoscopeHour]);
 
+ useEffect(() => {
+ if (taichiPoint < 0) {
+ setTaichiPalaces(undefined);
+ } else {
+ const palaces = getPalaceNames(taichiPoint);
+
+ setTaichiPalaces(palaces);
+ }
+ }, [taichiPoint]);
+
+ const toggleTaichiPoint = (index: number) => {
+ if (taichiPoint === index) {
+ setTaichiPoint(-1);
+ } else {
+ setTaichiPoint(index);
+ }
+ };
+
  return (
  <div
  className={classNames("iztro-astrolabe", "iztro-astrolabe-theme-default")}
@@ -121,11 +142,13 @@ export const Iztrolabe: React.FC<IztrolabeProps> = (props) => {
  showMonthlyScope={showMonthly}
  showDailyScope={showDaily}
  showHourlyScope={showHourly}
+ taichiPalace={taichiPalaces?.[palace.index]}
  toggleScope={toggleShowScope}
  activeHeavenlyStem={activeHeavenlyStem}
  toggleActiveHeavenlyStem={toggleActiveHeavenlyStem}
  hoverHeavenlyStem={hoverHeavenlyStem}
  setHoverHeavenlyStem={setHoverHeavenlyStem}
+ toggleTaichiPoint={toggleTaichiPoint}
  {...palace}
  />
  );

diff --git a/yarn.lock b/yarn.lock
@@ -5761,21 +5761,21 @@ istanbul-reports@^3.1.4:
  html-escaper "^2.0.0"
  istanbul-lib-report "^3.0.0"
 
-[email protected].11:
- version "1.2.11"
- resolved "https://registry.npmjs.org/iztro-hook/-/iztro-hook-1.2.11.tgz#638de4302b910ceb8bdc9345063085a3ad98dafc"
- integrity sha512-qRIf4d3hHOQIxiY8ebru7KXgkJ5ZYM5ElmPeXGyvloNEwU5YrVNodV47HSj0HEoV5rd2eNtou7bsHjSY7lrUGA==
+[email protected].12:
+ version "1.2.12"
+ resolved "https://registry.npmjs.org/iztro-hook/-/iztro-hook-1.2.12.tgz#8042851275d9d08228537c1d0079bdc2b5f86fe7"
+ integrity sha512-tZAFK3H5GnDTVuaR0bnfAzQBjLsenKfc2cxx5A00TNSgq84wEwxNrsTGpGSodbfVXo5kn4e2aU2hNxuWm8pcew==
  dependencies:
- iztro "2.2.3"
+ iztro "2.3.0"
 
-iztro@2.2.3:
- version "2.2.3"
- resolved "https://registry.npmjs.org/iztro/-/iztro-2.2.3.tgz#28202d77c05ce8c80d17b5b47fe35018d5f40b81"
- integrity sha512-xQvlfMvFY5l+l7Ljn5OWM/aiIECAc2w3j121rug+6eteooGo1AuJkrF1EM7p8dV8N6dgov80R/ClxVlauw4Hhw==
+iztro@2.3.0:
+ version "2.3.0"
+ resolved "https://registry.npmjs.org/iztro/-/iztro-2.3.0.tgz#21dab74fc647b913c3f9d5b2117fa680e561ce51"
+ integrity sha512-vs+bqSbqBYDZWKUO0GXop1WRltkrqVbjnvpNCmzisAT/iGLgXnbiIQHmZ0M19a5hFbhBswxvSHuBU0PTf8F73g==
  dependencies:
  dayjs "^1.11.10"
  i18next "^23.5.1"
- lunar-lite "^0.1.1"
+ lunar-lite "^0.1.2"
 
 [email protected], jackspeak@^2.0.3:
  version "2.1.1"
@@ -6096,17 +6096,17 @@ lru-cache@^6.0.0:
  resolved "https://registry.npmjs.org/lru-cache/-/lru-cache-10.0.1.tgz#0a3be479df549cca0e5d693ac402ff19537a6b7a"
  integrity sha512-IJ4uwUTi2qCccrioU6g9g/5rvvVl13bsdczUUcqbciD9iLr095yj8DQKdObriEvuNSx325N1rV1O0sJFszx75g==
 
-lunar-lite@^0.1.1:
- version "0.1.1"
- resolved "https://registry.npmjs.org/lunar-lite/-/lunar-lite-0.1.1.tgz#c2c114b95eae24b84ebc0702f616ed573772c244"
- integrity sha512-ttdkDY4uZg6LtE8r4m/Vt+z48ReT8StYXPY2eXqJ6tOG3C4I11g/f/gAJXplJIRTZd+F1xOFa52tUiP2UIkqzQ==
+lunar-lite@^0.1.2:
+ version "0.1.2"
+ resolved "https://registry.npmjs.org/lunar-lite/-/lunar-lite-0.1.2.tgz#a66b08cbc6c8df3a31d4e166052593662f489144"
+ integrity sha512-3SKo8zTDdbS1Ynn4qHUPNOW9oviqL8d2qdHSMS9jfNbmIdh6DbYKaY9dnXpMS5I1dzG9ztAuwVJ8MBAupv89aA==
  dependencies:
- lunar-typescript "^1.6.13"
+ lunar-typescript "^1.7.3"
 
-lunar-typescript@^1.6.13:
- version "1.6.13"
- resolved "https://registry.npmjs.org/lunar-typescript/-/lunar-typescript-1.6.13.tgz#99c9975f8ba4bc43af813e0155db0926d024cbcf"
- integrity sha512-6gBJepWWRiCvpbxxeiogsd/ZIggBbH1xmS090Kat/FiM0AGFnso0bmYXL1q/opr8qrMdnjsBlMZqBvNiRKACGA==
+lunar-typescript@^1.7.3:
+ version "1.7.4"
+ resolved "https://registry.npmjs.org/lunar-typescript/-/lunar-typescript-1.7.4.tgz#f088696814d8563a140cec20a73a9c61dfcac090"
+ integrity sha512-HvcWP92UoodW5YYa6thj7EdYULXY9xtmjVH+TUbvWb6SXJ813W6WfhlFUlzotv227vuCkCJb5ZzdmgIcL6M73w==
 
 lz-string@^1.5.0:
  version "1.5.0"