@krpkg/ui 0.0.0-stage → 0.3.0

package/dist/tokens.d.ts

@@ -0,0 +1,183 @@
+/**
+ * Raw design tokens - source of truth across Web, Tauri Desktop, and React Native
+ */
+declare const colors: {
+    readonly bg: "#0a0a0c";
+    readonly bg0: "#0a0a0c";
+    readonly bg1: "#111114";
+    readonly bg2: "#18181c";
+    readonly bg3: "#1f1f24";
+    readonly bgCard: "#121215";
+    readonly bgCardHover: "#18181d";
+    readonly bgCardActive: "#222228";
+    readonly border: "#2a2a30";
+    readonly borderSubtle: "#1e1e24";
+    readonly borderLight: "#3f3f46";
+    readonly text: "#f4f4f5";
+    readonly text0: "#e2ded6";
+    readonly text1: "#b0aca4";
+    readonly text2: "#706c66";
+    readonly text3: "#4a4844";
+    readonly textMuted: "#a1a1aa";
+    readonly textDim: "#71717a";
+    readonly accent: "#c49368";
+    readonly accentHover: "#d4a478";
+    readonly accentDim: "rgba(196, 147, 104, 0.12)";
+    readonly accentMuted: "rgba(224, 169, 109, 0.15)";
+    readonly teal: "#6a9e9e";
+    readonly tealDim: "rgba(106, 158, 158, 0.12)";
+    readonly warm: "#a08060";
+    readonly redSoft: "#b05050";
+    readonly greenSoft: "#6a9a6a";
+    readonly danger: "#ef4444";
+    readonly success: "#22c55e";
+    readonly blue: "#3b82f6";
+    readonly purple: "#a855f7";
+    readonly sticky1: "#e8e0b8";
+    readonly sticky2: "#e0c8c0";
+    readonly sticky3: "#c0d0d8";
+    readonly sticky4: "#c8d8c0";
+};
+declare const themePalettes: {
+    readonly default: {
+        readonly name: "Amber Baseline";
+        readonly accent: "#c49368";
+        readonly bg0: "#0a0a0c";
+        readonly bg1: "#111114";
+        readonly bg2: "#18181c";
+        readonly border: "#2a2a30";
+    };
+    readonly citlali: {
+        readonly name: "Citlali Star-Gaze";
+        readonly accent: "#f2a9c8";
+        readonly bg0: "#090d1d";
+        readonly bg1: "#10172d";
+        readonly bg2: "#172343";
+        readonly border: "#334879";
+    };
+    readonly furina: {
+        readonly name: "Furina Hydro-Overture";
+        readonly accent: "#5ab2ff";
+        readonly bg0: "#060d16";
+        readonly bg1: "#0b1624";
+        readonly bg2: "#122238";
+        readonly border: "#1f3c5e";
+    };
+    readonly alley: {
+        readonly name: "Alley Neon-Noir";
+        readonly accent: "#b066ff";
+        readonly bg0: "#050409";
+        readonly bg1: "#0b0914";
+        readonly bg2: "#141021";
+        readonly border: "#382c54";
+    };
+};
+declare const typography: {
+    readonly fontMono: "IBMPlexMono_400Regular";
+    readonly fontMonoLight: "IBMPlexMono_300Light";
+    readonly fontMonoMedium: "IBMPlexMono_500Medium";
+    readonly fontMonoBold: "IBMPlexMono_600SemiBold";
+    readonly fontSans: "IBMPlexSans_400Regular";
+    readonly fontSansLight: "IBMPlexSans_300Light";
+    readonly fontSansMedium: "IBMPlexSans_500Medium";
+    readonly fontSansBold: "IBMPlexSans_600SemiBold";
+    readonly fontJp: "NotoSansJP_400Regular";
+    readonly fontJpMedium: "NotoSansJP_500Medium";
+    readonly fontJpBold: "NotoSansJP_700Bold";
+    readonly webMono: "'IBM Plex Mono', monospace";
+    readonly webSans: "'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif";
+    readonly webJp: "'Noto Sans JP', sans-serif";
+};
+declare const spacing: {
+    readonly none: 0;
+    readonly xs: 4;
+    readonly sm: 8;
+    readonly md: 12;
+    readonly lg: 16;
+    readonly xl: 24;
+    readonly xxl: 32;
+    readonly xxxl: 48;
+};
+declare const borderRadius: {
+    readonly none: 0;
+    readonly sm: 4;
+    readonly md: 6;
+    readonly lg: 10;
+    readonly full: 9999;
+};
+/**
+ * CSS Variable references for DOM & Tauri Webview contexts
+ */
+declare const cssTokens: {
+    readonly colors: {
+        readonly bg0: "var(--kz-bg-0)";
+        readonly bg1: "var(--kz-bg-1)";
+        readonly bg2: "var(--kz-bg-2)";
+        readonly bg3: "var(--kz-bg-3)";
+        readonly border: "var(--kz-border)";
+        readonly borderSubtle: "var(--kz-border-subtle)";
+        readonly borderLight: "var(--kz-border-light)";
+        readonly text0: "var(--kz-text-0)";
+        readonly text1: "var(--kz-text-1)";
+        readonly text2: "var(--kz-text-2)";
+        readonly text3: "var(--kz-text-3)";
+        readonly accent: "var(--kz-accent)";
+        readonly accentHover: "var(--kz-accent-hover)";
+        readonly accentDim: "var(--kz-accent-dim)";
+        readonly teal: "var(--kz-teal)";
+        readonly tealDim: "var(--kz-teal-dim)";
+        readonly warm: "var(--kz-warm)";
+        readonly redSoft: "var(--kz-red-soft)";
+        readonly greenSoft: "var(--kz-green-soft)";
+        readonly blue: "var(--kz-blue)";
+        readonly purple: "var(--kz-purple)";
+    };
+    readonly typography: {
+        readonly mono: "var(--kz-mono)";
+        readonly sans: "var(--kz-sans)";
+        readonly jp: "var(--kz-jp)";
+    };
+    readonly radius: {
+        readonly sm: "var(--kz-radius-sm)";
+        readonly md: "var(--kz-radius-md)";
+        readonly lg: "var(--kz-radius-lg)";
+    };
+};
+declare const tokens: {
+    readonly colors: {
+        readonly bg0: "var(--kz-bg-0)";
+        readonly bg1: "var(--kz-bg-1)";
+        readonly bg2: "var(--kz-bg-2)";
+        readonly bg3: "var(--kz-bg-3)";
+        readonly border: "var(--kz-border)";
+        readonly borderSubtle: "var(--kz-border-subtle)";
+        readonly borderLight: "var(--kz-border-light)";
+        readonly text0: "var(--kz-text-0)";
+        readonly text1: "var(--kz-text-1)";
+        readonly text2: "var(--kz-text-2)";
+        readonly text3: "var(--kz-text-3)";
+        readonly accent: "var(--kz-accent)";
+        readonly accentHover: "var(--kz-accent-hover)";
+        readonly accentDim: "var(--kz-accent-dim)";
+        readonly teal: "var(--kz-teal)";
+        readonly tealDim: "var(--kz-teal-dim)";
+        readonly warm: "var(--kz-warm)";
+        readonly redSoft: "var(--kz-red-soft)";
+        readonly greenSoft: "var(--kz-green-soft)";
+        readonly blue: "var(--kz-blue)";
+        readonly purple: "var(--kz-purple)";
+    };
+    readonly typography: {
+        readonly mono: "var(--kz-mono)";
+        readonly sans: "var(--kz-sans)";
+        readonly jp: "var(--kz-jp)";
+    };
+    readonly radius: {
+        readonly sm: "var(--kz-radius-sm)";
+        readonly md: "var(--kz-radius-md)";
+        readonly lg: "var(--kz-radius-lg)";
+    };
+};
+type ThemeName = 'default' | 'citlali' | 'furina' | 'alley';
+
+export { type ThemeName, borderRadius, colors, cssTokens, spacing, themePalettes, tokens, typography };

package/dist/tokens.js

@@ -0,0 +1,185 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/tokens.ts
+var tokens_exports = {};
+__export(tokens_exports, {
+  borderRadius: () => borderRadius,
+  colors: () => colors,
+  cssTokens: () => cssTokens,
+  spacing: () => spacing,
+  themePalettes: () => themePalettes,
+  tokens: () => tokens,
+  typography: () => typography
+});
+module.exports = __toCommonJS(tokens_exports);
+var colors = {
+  // Baseline / Obsidian Dark
+  bg: "#0a0a0c",
+  bg0: "#0a0a0c",
+  bg1: "#111114",
+  bg2: "#18181c",
+  bg3: "#1f1f24",
+  bgCard: "#121215",
+  bgCardHover: "#18181d",
+  bgCardActive: "#222228",
+  border: "#2a2a30",
+  borderSubtle: "#1e1e24",
+  borderLight: "#3f3f46",
+  text: "#f4f4f5",
+  text0: "#e2ded6",
+  text1: "#b0aca4",
+  text2: "#706c66",
+  text3: "#4a4844",
+  textMuted: "#a1a1aa",
+  textDim: "#71717a",
+  // Accents & Signals
+  accent: "#c49368",
+  accentHover: "#d4a478",
+  accentDim: "rgba(196, 147, 104, 0.12)",
+  accentMuted: "rgba(224, 169, 109, 0.15)",
+  teal: "#6a9e9e",
+  tealDim: "rgba(106, 158, 158, 0.12)",
+  warm: "#a08060",
+  redSoft: "#b05050",
+  greenSoft: "#6a9a6a",
+  danger: "#ef4444",
+  success: "#22c55e",
+  blue: "#3b82f6",
+  purple: "#a855f7",
+  // Sticky Note Themes
+  sticky1: "#e8e0b8",
+  sticky2: "#e0c8c0",
+  sticky3: "#c0d0d8",
+  sticky4: "#c8d8c0"
+};
+var themePalettes = {
+  default: {
+    name: "Amber Baseline",
+    accent: "#c49368",
+    bg0: "#0a0a0c",
+    bg1: "#111114",
+    bg2: "#18181c",
+    border: "#2a2a30"
+  },
+  citlali: {
+    name: "Citlali Star-Gaze",
+    accent: "#f2a9c8",
+    bg0: "#090d1d",
+    bg1: "#10172d",
+    bg2: "#172343",
+    border: "#334879"
+  },
+  furina: {
+    name: "Furina Hydro-Overture",
+    accent: "#5ab2ff",
+    bg0: "#060d16",
+    bg1: "#0b1624",
+    bg2: "#122238",
+    border: "#1f3c5e"
+  },
+  alley: {
+    name: "Alley Neon-Noir",
+    accent: "#b066ff",
+    bg0: "#050409",
+    bg1: "#0b0914",
+    bg2: "#141021",
+    border: "#382c54"
+  }
+};
+var typography = {
+  fontMono: "IBMPlexMono_400Regular",
+  fontMonoLight: "IBMPlexMono_300Light",
+  fontMonoMedium: "IBMPlexMono_500Medium",
+  fontMonoBold: "IBMPlexMono_600SemiBold",
+  fontSans: "IBMPlexSans_400Regular",
+  fontSansLight: "IBMPlexSans_300Light",
+  fontSansMedium: "IBMPlexSans_500Medium",
+  fontSansBold: "IBMPlexSans_600SemiBold",
+  fontJp: "NotoSansJP_400Regular",
+  fontJpMedium: "NotoSansJP_500Medium",
+  fontJpBold: "NotoSansJP_700Bold",
+  webMono: "'IBM Plex Mono', monospace",
+  webSans: "'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
+  webJp: "'Noto Sans JP', sans-serif"
+};
+var spacing = {
+  none: 0,
+  xs: 4,
+  sm: 8,
+  md: 12,
+  lg: 16,
+  xl: 24,
+  xxl: 32,
+  xxxl: 48
+};
+var borderRadius = {
+  none: 0,
+  sm: 4,
+  md: 6,
+  lg: 10,
+  full: 9999
+};
+var cssTokens = {
+  colors: {
+    bg0: "var(--kz-bg-0)",
+    bg1: "var(--kz-bg-1)",
+    bg2: "var(--kz-bg-2)",
+    bg3: "var(--kz-bg-3)",
+    border: "var(--kz-border)",
+    borderSubtle: "var(--kz-border-subtle)",
+    borderLight: "var(--kz-border-light)",
+    text0: "var(--kz-text-0)",
+    text1: "var(--kz-text-1)",
+    text2: "var(--kz-text-2)",
+    text3: "var(--kz-text-3)",
+    accent: "var(--kz-accent)",
+    accentHover: "var(--kz-accent-hover)",
+    accentDim: "var(--kz-accent-dim)",
+    teal: "var(--kz-teal)",
+    tealDim: "var(--kz-teal-dim)",
+    warm: "var(--kz-warm)",
+    redSoft: "var(--kz-red-soft)",
+    greenSoft: "var(--kz-green-soft)",
+    blue: "var(--kz-blue)",
+    purple: "var(--kz-purple)"
+  },
+  typography: {
+    mono: "var(--kz-mono)",
+    sans: "var(--kz-sans)",
+    jp: "var(--kz-jp)"
+  },
+  radius: {
+    sm: "var(--kz-radius-sm)",
+    md: "var(--kz-radius-md)",
+    lg: "var(--kz-radius-lg)"
+  }
+};
+var tokens = cssTokens;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  borderRadius,
+  colors,
+  cssTokens,
+  spacing,
+  themePalettes,
+  tokens,
+  typography
+});
+//# sourceMappingURL=tokens.js.map

package/dist/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tokens.ts"],"sourcesContent":["/**\n * Raw design tokens - source of truth across Web, Tauri Desktop, and React Native\n */\n\nexport const colors = {\n  // Baseline / Obsidian Dark\n  bg: '#0a0a0c',\n  bg0: '#0a0a0c',\n  bg1: '#111114',\n  bg2: '#18181c',\n  bg3: '#1f1f24',\n  bgCard: '#121215',\n  bgCardHover: '#18181d',\n  bgCardActive: '#222228',\n  border: '#2a2a30',\n  borderSubtle: '#1e1e24',\n  borderLight: '#3f3f46',\n  text: '#f4f4f5',\n  text0: '#e2ded6',\n  text1: '#b0aca4',\n  text2: '#706c66',\n  text3: '#4a4844',\n  textMuted: '#a1a1aa',\n  textDim: '#71717a',\n\n  // Accents & Signals\n  accent: '#c49368',\n  accentHover: '#d4a478',\n  accentDim: 'rgba(196, 147, 104, 0.12)',\n  accentMuted: 'rgba(224, 169, 109, 0.15)',\n  teal: '#6a9e9e',\n  tealDim: 'rgba(106, 158, 158, 0.12)',\n  warm: '#a08060',\n  redSoft: '#b05050',\n  greenSoft: '#6a9a6a',\n  danger: '#ef4444',\n  success: '#22c55e',\n  blue: '#3b82f6',\n  purple: '#a855f7',\n\n  // Sticky Note Themes\n  sticky1: '#e8e0b8',\n  sticky2: '#e0c8c0',\n  sticky3: '#c0d0d8',\n  sticky4: '#c8d8c0',\n} as const;\n\nexport const themePalettes = {\n  default: {\n    name: 'Amber Baseline',\n    accent: '#c49368',\n    bg0: '#0a0a0c',\n    bg1: '#111114',\n    bg2: '#18181c',\n    border: '#2a2a30',\n  },\n  citlali: {\n    name: 'Citlali Star-Gaze',\n    accent: '#f2a9c8',\n    bg0: '#090d1d',\n    bg1: '#10172d',\n    bg2: '#172343',\n    border: '#334879',\n  },\n  furina: {\n    name: 'Furina Hydro-Overture',\n    accent: '#5ab2ff',\n    bg0: '#060d16',\n    bg1: '#0b1624',\n    bg2: '#122238',\n    border: '#1f3c5e',\n  },\n  alley: {\n    name: 'Alley Neon-Noir',\n    accent: '#b066ff',\n    bg0: '#050409',\n    bg1: '#0b0914',\n    bg2: '#141021',\n    border: '#382c54',\n  },\n} as const;\n\nexport const typography = {\n  fontMono: 'IBMPlexMono_400Regular',\n  fontMonoLight: 'IBMPlexMono_300Light',\n  fontMonoMedium: 'IBMPlexMono_500Medium',\n  fontMonoBold: 'IBMPlexMono_600SemiBold',\n  fontSans: 'IBMPlexSans_400Regular',\n  fontSansLight: 'IBMPlexSans_300Light',\n  fontSansMedium: 'IBMPlexSans_500Medium',\n  fontSansBold: 'IBMPlexSans_600SemiBold',\n  fontJp: 'NotoSansJP_400Regular',\n  fontJpMedium: 'NotoSansJP_500Medium',\n  fontJpBold: 'NotoSansJP_700Bold',\n\n  webMono: \"'IBM Plex Mono', monospace\",\n  webSans: \"'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif\",\n  webJp: \"'Noto Sans JP', sans-serif\",\n} as const;\n\nexport const spacing = {\n  none: 0,\n  xs: 4,\n  sm: 8,\n  md: 12,\n  lg: 16,\n  xl: 24,\n  xxl: 32,\n  xxxl: 48,\n} as const;\n\nexport const borderRadius = {\n  none: 0,\n  sm: 4,\n  md: 6,\n  lg: 10,\n  full: 9999,\n} as const;\n\n/**\n * CSS Variable references for DOM & Tauri Webview contexts\n */\nexport const cssTokens = {\n  colors: {\n    bg0: 'var(--kz-bg-0)',\n    bg1: 'var(--kz-bg-1)',\n    bg2: 'var(--kz-bg-2)',\n    bg3: 'var(--kz-bg-3)',\n    border: 'var(--kz-border)',\n    borderSubtle: 'var(--kz-border-subtle)',\n    borderLight: 'var(--kz-border-light)',\n    text0: 'var(--kz-text-0)',\n    text1: 'var(--kz-text-1)',\n    text2: 'var(--kz-text-2)',\n    text3: 'var(--kz-text-3)',\n    accent: 'var(--kz-accent)',\n    accentHover: 'var(--kz-accent-hover)',\n    accentDim: 'var(--kz-accent-dim)',\n    teal: 'var(--kz-teal)',\n    tealDim: 'var(--kz-teal-dim)',\n    warm: 'var(--kz-warm)',\n    redSoft: 'var(--kz-red-soft)',\n    greenSoft: 'var(--kz-green-soft)',\n    blue: 'var(--kz-blue)',\n    purple: 'var(--kz-purple)',\n  },\n  typography: {\n    mono: 'var(--kz-mono)',\n    sans: 'var(--kz-sans)',\n    jp: 'var(--kz-jp)',\n  },\n  radius: {\n    sm: 'var(--kz-radius-sm)',\n    md: 'var(--kz-radius-md)',\n    lg: 'var(--kz-radius-lg)',\n  },\n} as const;\n\nexport const tokens = cssTokens;\n\nexport type ThemeName = 'default' | 'citlali' | 'furina' | 'alley';\n"],"mappings":"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","names":[]}

package/dist/tokens.mjs

@@ -0,0 +1,19 @@
+import {
+  borderRadius,
+  colors,
+  cssTokens,
+  spacing,
+  themePalettes,
+  tokens,
+  typography
+} from "./chunk-HAD2NPEW.mjs";
+export {
+  borderRadius,
+  colors,
+  cssTokens,
+  spacing,
+  themePalettes,
+  tokens,
+  typography
+};
+//# sourceMappingURL=tokens.mjs.map

package/dist/tokens.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/utils.d.mts

@@ -0,0 +1,13 @@
+/**
+ * Shared Formatting Utilities for Web, Desktop (Tauri), and Mobile
+ */
+/**
+ * Format timestamp into relative display string (e.g. 12s, 5m, 3h, 2d, or formatted date)
+ */
+declare function formatRelativeTime(dateInput: string | Date | number): string;
+/**
+ * Format duration in seconds to M:SS or H:MM:SS
+ */
+declare function formatDuration(seconds: number): string;
+
+export { formatDuration, formatRelativeTime };

package/dist/utils.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Shared Formatting Utilities for Web, Desktop (Tauri), and Mobile
+ */
+/**
+ * Format timestamp into relative display string (e.g. 12s, 5m, 3h, 2d, or formatted date)
+ */
+declare function formatRelativeTime(dateInput: string | Date | number): string;
+/**
+ * Format duration in seconds to M:SS or H:MM:SS
+ */
+declare function formatDuration(seconds: number): string;
+
+export { formatDuration, formatRelativeTime };

package/dist/utils.js

@@ -0,0 +1,65 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/utils/index.ts
+var utils_exports = {};
+__export(utils_exports, {
+  formatDuration: () => formatDuration,
+  formatRelativeTime: () => formatRelativeTime
+});
+module.exports = __toCommonJS(utils_exports);
+
+// src/utils/format.ts
+function formatRelativeTime(dateInput) {
+  const date = new Date(dateInput);
+  const now = /* @__PURE__ */ new Date();
+  const diffSec = Math.floor((now.getTime() - date.getTime()) / 1e3);
+  if (isNaN(diffSec)) return "";
+  if (diffSec < 60) return `${Math.max(1, diffSec)}s`;
+  const diffMin = Math.floor(diffSec / 60);
+  if (diffMin < 60) return `${diffMin}m`;
+  const diffHours = Math.floor(diffMin / 60);
+  if (diffHours < 24) return `${diffHours}h`;
+  const diffDays = Math.floor(diffHours / 24);
+  if (diffDays < 7) return `${diffDays}d`;
+  return date.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: date.getFullYear() !== now.getFullYear() ? "numeric" : void 0
+  });
+}
+function formatDuration(seconds) {
+  if (!seconds || seconds <= 0) return "0:00";
+  const mins = Math.floor(seconds / 60);
+  const secs = Math.floor(seconds % 60);
+  const padSecs = secs < 10 ? `0${secs}` : `${secs}`;
+  if (mins >= 60) {
+    const hours = Math.floor(mins / 60);
+    const remMins = mins % 60;
+    const padMins = remMins < 10 ? `0${remMins}` : `${remMins}`;
+    return `${hours}:${padMins}:${padSecs}`;
+  }
+  return `${mins}:${padSecs}`;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  formatDuration,
+  formatRelativeTime
+});
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/index.ts","../src/utils/format.ts"],"sourcesContent":["export * from './format';\n","/**\n * Shared Formatting Utilities for Web, Desktop (Tauri), and Mobile\n */\n\n/**\n * Format timestamp into relative display string (e.g. 12s, 5m, 3h, 2d, or formatted date)\n */\nexport function formatRelativeTime(dateInput: string | Date | number): string {\n  const date = new Date(dateInput);\n  const now = new Date();\n  const diffSec = Math.floor((now.getTime() - date.getTime()) / 1000);\n\n  if (isNaN(diffSec)) return '';\n  if (diffSec < 60) return `${Math.max(1, diffSec)}s`;\n  const diffMin = Math.floor(diffSec / 60);\n  if (diffMin < 60) return `${diffMin}m`;\n  const diffHours = Math.floor(diffMin / 60);\n  if (diffHours < 24) return `${diffHours}h`;\n  const diffDays = Math.floor(diffHours / 24);\n  if (diffDays < 7) return `${diffDays}d`;\n\n  return date.toLocaleDateString('en-US', {\n    month: 'short',\n    day: 'numeric',\n    year: date.getFullYear() !== now.getFullYear() ? 'numeric' : undefined,\n  });\n}\n\n/**\n * Format duration in seconds to M:SS or H:MM:SS\n */\nexport function formatDuration(seconds: number): string {\n  if (!seconds || seconds <= 0) return '0:00';\n  const mins = Math.floor(seconds / 60);\n  const secs = Math.floor(seconds % 60);\n  const padSecs = secs < 10 ? `0${secs}` : `${secs}`;\n  if (mins >= 60) {\n    const hours = Math.floor(mins / 60);\n    const remMins = mins % 60;\n    const padMins = remMins < 10 ? `0${remMins}` : `${remMins}`;\n    return `${hours}:${padMins}:${padSecs}`;\n  }\n  return `${mins}:${padSecs}`;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACOO,SAAS,mBAAmB,WAA2C;AAC5E,QAAM,OAAO,IAAI,KAAK,SAAS;AAC/B,QAAM,MAAM,oBAAI,KAAK;AACrB,QAAM,UAAU,KAAK,OAAO,IAAI,QAAQ,IAAI,KAAK,QAAQ,KAAK,GAAI;AAElE,MAAI,MAAM,OAAO,EAAG,QAAO;AAC3B,MAAI,UAAU,GAAI,QAAO,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC;AAChD,QAAM,UAAU,KAAK,MAAM,UAAU,EAAE;AACvC,MAAI,UAAU,GAAI,QAAO,GAAG,OAAO;AACnC,QAAM,YAAY,KAAK,MAAM,UAAU,EAAE;AACzC,MAAI,YAAY,GAAI,QAAO,GAAG,SAAS;AACvC,QAAM,WAAW,KAAK,MAAM,YAAY,EAAE;AAC1C,MAAI,WAAW,EAAG,QAAO,GAAG,QAAQ;AAEpC,SAAO,KAAK,mBAAmB,SAAS;AAAA,IACtC,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM,KAAK,YAAY,MAAM,IAAI,YAAY,IAAI,YAAY;AAAA,EAC/D,CAAC;AACH;AAKO,SAAS,eAAe,SAAyB;AACtD,MAAI,CAAC,WAAW,WAAW,EAAG,QAAO;AACrC,QAAM,OAAO,KAAK,MAAM,UAAU,EAAE;AACpC,QAAM,OAAO,KAAK,MAAM,UAAU,EAAE;AACpC,QAAM,UAAU,OAAO,KAAK,IAAI,IAAI,KAAK,GAAG,IAAI;AAChD,MAAI,QAAQ,IAAI;AACd,UAAM,QAAQ,KAAK,MAAM,OAAO,EAAE;AAClC,UAAM,UAAU,OAAO;AACvB,UAAM,UAAU,UAAU,KAAK,IAAI,OAAO,KAAK,GAAG,OAAO;AACzD,WAAO,GAAG,KAAK,IAAI,OAAO,IAAI,OAAO;AAAA,EACvC;AACA,SAAO,GAAG,IAAI,IAAI,OAAO;AAC3B;","names":[]}

package/dist/utils.mjs

@@ -0,0 +1,9 @@
+import {
+  formatDuration,
+  formatRelativeTime
+} from "./chunk-ZJSL4I3W.mjs";
+export {
+  formatDuration,
+  formatRelativeTime
+};
+//# sourceMappingURL=utils.mjs.map

package/dist/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/package.json

@@ -1,6 +1,73 @@
 {
   "name": "@krpkg/ui",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.3.0",
+  "description": "krpkg Cyber-Minimalist UI Design System & Component Library (Web, Tauri Desktop, & React Native / Expo)",
+  "license": "Apache-2.0",
+  "author": "krpkg",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/krpkg/ui.git"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "style": "./dist/index.css",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./native": {
+      "types": "./dist/native.d.ts",
+      "import": "./dist/native.mjs",
+      "require": "./dist/native.js"
+    },
+    "./tokens": {
+      "types": "./dist/tokens.d.ts",
+      "import": "./dist/tokens.mjs",
+      "require": "./dist/tokens.js"
+    },
+    "./utils": {
+      "types": "./dist/utils.d.ts",
+      "import": "./dist/utils.mjs",
+      "require": "./dist/utils.js"
+    },
+    "./styles.css": "./dist/index.css",
+    "./assets/*": "./assets/*"
+  },
+  "files": [
+    "dist",
+    "assets"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0",
+    "react-native": ">=0.70.0"
+  },
+  "peerDependenciesMeta": {
+    "react-dom": {
+      "optional": true
+    },
+    "react-native": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@types/react-native": "^0.72.8",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-native": "^0.88.1",
+    "tsup": "^8.3.6",
+    "typescript": "^5.8.2",
+    "vitest": "^3.0.7"
+  }
+}