@tsingroc/tsingroc-components 5.0.1 → 5.1.0

package/dist/utils/ui.js

@@ -0,0 +1,171 @@
+/**
+ * Presentation utilities for consistent null/undefined handling in components.
+ *
+ * These utilities handle how null/undefined values are displayed in the UI.
+ * Use these in components to apply consistent design tokens for missing data.
+ *
+ * @example
+ * ```tsx
+ * import { presentCardValue, presentTableValue } from './ui';
+ * import { formatPrice, formatVolume } from './formatters';
+ *
+ * // In a card (shows "-" for null)
+ * <Statistic title="Price" value={presentCardValue(formatPrice(data.price))} />
+ *
+ * // In a table (shows "" for null)
+ * <Table.Column render={() => presentTableValue(formatVolume(data.volume))} />
+ * ```
+ */
+
+/**
+ * Presentation options for null/undefined values.
+ */
+
+// Show "0" (for numeric fields)
+
+/**
+ * Default null presentation for different contexts.
+ */
+export const NULL_PRESENTATION_DEFAULTS = {
+  /** Default for tables: show empty string */
+  table: "empty",
+  /** Default for cards: show dash */
+  card: "dash",
+  /** Default for charts: show dash */
+  chart: "dash",
+  /** Default for form inputs: show empty */
+  form: "empty"
+};
+
+/**
+ * Present a nullable value with consistent null handling.
+ *
+ * This is the core presenter function that handles how null/undefined values
+ * are displayed in the UI. Use the convenience wrappers (presentCardValue,
+ * presentTableValue) for common cases.
+ *
+ * @param value - The formatted value (could be null from formatters)
+ * @param options - How to present null values
+ * @returns Display string
+ *
+ * @example
+ * ```tsx
+ * // Custom presentation
+ * <span>{presentValue(formatPrice(price), { nullAs: "na" })}</span>
+ *
+ * // Show N/A for null values
+ * <span>{presentValue(formatVolume(volume), { nullAs: "na" })}</span>
+ *
+ * // Use non-breaking space to prevent layout shift
+ * <span>{presentValue(formatProfit(profit), { nullAs: "nbsp" })}</span>
+ * ```
+ */
+export function presentValue(value, options = {}) {
+  const {
+    nullAs = "empty",
+    zeroAs
+  } = options;
+
+  // Handle null/undefined
+  if (value === null || value === undefined) {
+    switch (nullAs) {
+      case "dash":
+        return "-";
+      case "nbsp":
+        return "\u00A0";
+      case "na":
+        return "N/A";
+      case "zero":
+        return "0";
+      case "empty":
+      default:
+        return "";
+    }
+  }
+
+  // Handle zero if specified
+  if (zeroAs !== undefined && value === 0) {
+    switch (zeroAs) {
+      case "dash":
+        return "-";
+      case "nbsp":
+        return "\u00A0";
+      case "na":
+        return "N/A";
+      case "zero":
+      case "empty":
+      default:
+        return zeroAs === "zero" ? "0" : "";
+    }
+  }
+
+  // Return the value as string
+  return String(value);
+}
+
+/**
+ * Convenience presenter for card values (shows "-" for null).
+ *
+ * Use this in cards, statistics, and other UI elements where a dash "-".
+ *
+ * @example
+ * ```tsx
+ * import { presentCardValue } from './ui';
+ * import { formatPrice } from './formatters';
+ *
+ * <Statistic
+ *   title="Current Price"
+ *   value={presentCardValue(formatPrice(data.price))}
+ * />
+ * // null → "-", 0 → "0.00", 123.45 → "123.45"
+ * ```
+ */
+export function presentCardValue(value) {
+  return presentValue(value, {
+    nullAs: "dash"
+  });
+}
+
+/**
+ * Convenience presenter for table cells (shows "" for null).
+ *
+ * Use this in table cells and other compact UI elements where an empty string.
+ *
+ * @example
+ * ```tsx
+ * import { presentTableValue } from './ui';
+ * import { formatVolume } from './formatters';
+ *
+ * <Table.Column
+ *   render={(_, record) => presentTableValue(formatVolume(record.volume))}
+ * />
+ * // null → "", 0 → "0.000", 123.456 → "123.456"
+ * ```
+ */
+export function presentTableValue(value) {
+  return presentValue(value, {
+    nullAs: "empty"
+  });
+}
+
+/**
+ * Convenience presenter for chart tooltips (shows "-" for null).
+ *
+ * Use this in chart tooltips, legends, and other data visualizations.
+ *
+ * @example
+ * ```tsx
+ * import { presentChartValue } from './ui';
+ * import { formatProfit } from './formatters';
+ *
+ * tooltip: {
+ *   formatter: (params) => presentChartValue(formatProfit(params.value))
+ * }
+ * // null → "-", 0 → "0.00", 123.45 → "123.45"
+ * ```
+ */
+export function presentChartValue(value) {
+  return presentValue(value, {
+    nullAs: "dash"
+  });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsingroc/tsingroc-components",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "author": "",
   "license": "ISC",
   "description": "",
@@ -19,6 +19,10 @@
       "types": "./dist/echarts/index.d.ts",
       "default": "./dist/echarts/index.js"
     },
+    "./pages/DayAheadReviewPage": {
+      "types": "./dist/pages/DayAheadReviewPage/index.d.ts",
+      "default": "./dist/pages/DayAheadReviewPage/index.js"
+    },
     "./utils": {
       "types": "./dist/utils/index.d.ts",
       "default": "./dist/utils/index.js"
@@ -36,55 +40,53 @@
     "build": "rm -rf dist && (npx babel src --out-dir dist --extensions .ts,.tsx & tsc -p tsconfig.lib.json & copyfiles src/**/*.css dist --up 1 & wait)"
   },
   "dependencies": {
+    "@e965/xlsx": "^0.20.3",
     "antd-style": "^4.1.0",
     "casdoor-js-sdk": "^0.18.0",
     "dayjs": "^1.11.20",
     "jwt-decode": "^4.0.0"
   },
   "peerDependencies": {
-    "@ant-design/icons": "^6.1.0",
-    "antd": "^6.3.3",
+    "@ant-design/icons": "^6.1.1",
+    "antd": "^6.3.5",
     "echarts": "^6.0.0",
     "echarts-gl": "^2.0.9",
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4"
-  },
-  "peerDependenciesMeta": {
-    "echarts-gl": {
-      "optional": true
-    }
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5"
   },
   "devDependencies": {
-    "@ant-design/icons": "^6.1.0",
+    "@ant-design/icons": "^6.1.1",
     "@babel/cli": "^7.28.6",
     "@babel/core": "^7.29.0",
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
-    "@storybook/addon-a11y": "^10.3.3",
-    "@storybook/addon-docs": "^10.3.3",
-    "@storybook/addon-mcp": "^0.4.2",
-    "@storybook/addon-vitest": "^10.3.3",
-    "@storybook/react-vite": "^10.3.3",
-    "@types/node": "^22.19.15",
+    "@storybook/addon-a11y": "^10.3.5",
+    "@storybook/addon-docs": "^10.3.5",
+    "@storybook/addon-mcp": "^0.5.0",
+    "@storybook/addon-vitest": "^10.3.5",
+    "@storybook/react-vite": "^10.3.5",
+    "@types/node": "^22.19.17",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react": "^5.2.0",
     "@vitest/browser-playwright": "^4.1.1",
     "@vitest/coverage-v8": "^4.1.1",
-    "antd": "^6.3.4",
+    "antd": "^6.3.5",
     "babel-plugin-react-compiler": "^1.0.0",
     "copyfiles": "^2.4.1",
-    "dprint": "^0.53.0",
+    "dprint": "^0.54.0",
     "echarts": "^6.0.0",
     "echarts-gl": "^2.0.9",
     "eslint-plugin-react-hooks": "^7.0.1",
-    "oxlint": "^1.57.0",
-    "oxlint-tsgolint": "^0.17.3",
-    "playwright": "^1.58.2",
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4",
-    "storybook": "^10.3.3",
+    "lightningcss": "^1.32.0",
+    "oxlint": "^1.59.0",
+    "oxlint-tsgolint": "^0.18.1",
+    "playwright": "^1.59.1",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "storybook": "^10.3.5",
     "typescript": "^6.0.2",
+    "vite-plugin-svgr": "^5.2.0",
     "vitest": "^4.1.1"
   },
   "overrides": {
@@ -93,12 +95,11 @@
     }
   },
   "imports": {
-    "#*": [
-      "./*",
-      "./*.ts",
-      "./*.tsx",
-      "./*/index.ts",
-      "./*/index.tsx"
+    "#.storybook/preview": "./.storybook/preview.tsx",
+    "#src/*": [
+      "./dist/*",
+      "./dist/*.js",
+      "./dist/*/index.js"
     ]
   }
 }