@drawnagency/primitives 0.1.25 → 0.1.26

package/dist/components/shared/HistoryPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HistoryPopover.d.ts","sourceRoot":"","sources":["../../../src/components/shared/HistoryPopover.tsx"],"names":[],"mappings":"AAUA,UAAU,mBAAmB;IAC3B,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAiCD,wBAAgB,cAAc,CAAC,EAAE,cAAc,EAAE,EAAE,mBAAmB,2CAyFrE"}
+{"version":3,"file":"HistoryPopover.d.ts","sourceRoot":"","sources":["../../../src/components/shared/HistoryPopover.tsx"],"names":[],"mappings":"AAWA,UAAU,mBAAmB;IAC3B,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,wBAAgB,cAAc,CAAC,EAAE,cAAc,EAAE,EAAE,mBAAmB,2CAwFrE"}

package/dist/components/shared/Navigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../src/components/shared/Navigation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAM7C,UAAU,KAAK;IACb,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,CAAC;IACxC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,KAAK,2CAkOvG"}
+{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../src/components/shared/Navigation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAO7C,UAAU,KAAK;IACb,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,CAAC;IACxC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,KAAK,2CA8NvG"}

package/dist/components/shell/HistoryToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HistoryToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/shell/HistoryToolbar.tsx"],"names":[],"mappings":"AAEA,UAAU,mBAAmB;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,SAAS,EAAE,EAAE,mBAAmB,2CA4BvF"}
+{"version":3,"file":"HistoryToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/shell/HistoryToolbar.tsx"],"names":[],"mappings":"AAGA,UAAU,mBAAmB;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,SAAS,EAAE,EAAE,mBAAmB,2CAsBvF"}

package/dist/components/shell/RestoreModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RestoreModal.d.ts","sourceRoot":"","sources":["../../../src/components/shell/RestoreModal.tsx"],"names":[],"mappings":"AAGA,UAAU,iBAAiB;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,iBAAiB,2CAuBhG"}
+{"version":3,"file":"RestoreModal.d.ts","sourceRoot":"","sources":["../../../src/components/shell/RestoreModal.tsx"],"names":[],"mappings":"AAIA,UAAU,iBAAiB;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,iBAAiB,2CAiBhG"}

package/dist/index.js

@@ -27,7 +27,7 @@ import {
   safeRedirect,
   sanitizeHtml,
   toSectionId
-} from "./chunk-KX7NRYQD.js";
+} from "./chunk-FSVPD7TW.js";
 import {
   ColorItemSchema,
   ColorSpaceSchema,

package/dist/lib/index.js

@@ -17,7 +17,7 @@ import {
   safeRedirect,
   sanitizeHtml,
   toSectionId
-} from "../chunk-KX7NRYQD.js";
+} from "../chunk-FSVPD7TW.js";
 import {
   clearRegistry,
   createRegistry,

package/dist/lib/timestamp.d.ts

@@ -1,2 +1,4 @@
+export declare function formatDate(iso: string): string;
+export declare function formatDateTime(iso: string): string;
 export declare function formatTimestamp(iso: string): string;
 //# sourceMappingURL=timestamp.d.ts.map

package/dist/lib/timestamp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"timestamp.d.ts","sourceRoot":"","sources":["../../src/lib/timestamp.ts"],"names":[],"mappings":"AAAA,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CA8BnD"}
+{"version":3,"file":"timestamp.d.ts","sourceRoot":"","sources":["../../src/lib/timestamp.ts"],"names":[],"mappings":"AAAA,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAM9C;AAED,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAalD;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CA8BnD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawnagency/primitives",
-  "version": "0.1.25",
+  "version": "0.1.26",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",

package/src/components/shared/HistoryPopover.tsx

@@ -1,5 +1,6 @@
 import { useState, useCallback, useEffect } from "react";
 import { cn } from "../../lib/cn";
+import { formatDateTime } from "../../lib/timestamp";
 import { Button } from "./Button";
 
 interface CommitItem {
@@ -12,37 +13,6 @@ interface HistoryPopoverProps {
   onSelectCommit: (sha: string, date: string) => void;
 }
 
-function formatRelativeDate(dateStr: string): string {
-  const date = new Date(dateStr);
-  const now = new Date();
-  const diffMs = now.getTime() - date.getTime();
-  const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));
-
-  if (diffDays === 0) return "Today";
-  if (diffDays === 1) return "Yesterday";
-  if (diffDays < 7) return `${diffDays} days ago`;
-  if (diffDays < 30) {
-    const weeks = Math.floor(diffDays / 7);
-    return `${weeks} ${weeks === 1 ? "week" : "weeks"} ago`;
-  }
-  if (diffDays < 365) {
-    const months = Math.floor(diffDays / 30);
-    return `${months} ${months === 1 ? "month" : "months"} ago`;
-  }
-  const years = Math.floor(diffDays / 365);
-  return `${years} ${years === 1 ? "year" : "years"} ago`;
-}
-
-function formatAbsoluteDate(dateStr: string): string {
-  return new Date(dateStr).toLocaleDateString("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-  });
-}
-
 export function HistoryPopover({ onSelectCommit }: HistoryPopoverProps) {
   const [commits, setCommits] = useState<CommitItem[]>([]);
   const [loading, setLoading] = useState(true);
@@ -111,9 +81,8 @@ export function HistoryPopover({ onSelectCommit }: HistoryPopoverProps) {
                 "w-full cursor-pointer px-4 py-2 text-left text-xs transition-colors",
                 "hover:bg-base-accent text-base-contrast-light hover:text-base-contrast",
               )}
-              title={formatAbsoluteDate(commit.date)}
             >
-              {formatRelativeDate(commit.date)}
+              {formatDateTime(commit.date)}
             </button>
           </li>
         ))}

package/src/components/shared/Navigation.tsx

@@ -4,6 +4,7 @@ import { Toggle } from "./Toggle";
 import type { NavItem } from "../../lib/nav";
 import { editModeEvent, navChangeEvent, darkModeEvent, historySelectEvent } from "../../lib/events";
 import { useActiveHeadings } from "../../hooks/useActiveHeadings";
+import { formatDate } from "../../lib/timestamp";
 import { Popover } from "./Popover";
 import { HistoryPopover } from "./HistoryPopover";
 
@@ -205,11 +206,7 @@ export default function Navigation({ navLinks: initialNavLinks, siteName, darkMo
                     className="cursor-pointer text-xs text-base-contrast-light hover:text-primary transition-colors"
                     aria-label="View history"
                   >
-                    Last updated {new Date(lastUpdated).toLocaleDateString("en-US", {
-                      month: "short",
-                      day: "numeric",
-                      year: "numeric",
-                    })}
+                    Last updated {formatDate(lastUpdated)}
                   </button>
                   <Popover
                     isOpen={showHistory}

package/src/components/shell/HistoryToolbar.tsx

@@ -1,3 +1,4 @@
+import { formatDateTime } from "../../lib/timestamp";
 import { Button } from "../shared/Button";
 
 interface HistoryToolbarProps {
@@ -7,12 +8,6 @@ interface HistoryToolbarProps {
 }
 
 export function HistoryToolbar({ date, onBackToCurrent, onRestore }: HistoryToolbarProps) {
-  const formattedDate = new Date(date).toLocaleDateString("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric",
-  });
-
   return (
     <div className="fixed top-0 right-0 left-0 z-50 border-b border-base-200 bg-base">
       <div className="mx-auto max-w-screen-xl grid grid-cols-3 items-center px-4 py-2">
@@ -23,7 +18,7 @@ export function HistoryToolbar({ date, onBackToCurrent, onRestore }: HistoryTool
         </div>
         <div className="flex items-center justify-center">
           <span className="text-xs font-medium text-base-contrast-light">
-            Viewing {formattedDate}
+            Viewing {formatDateTime(date)}
           </span>
         </div>
         <div className="flex items-center justify-end">

package/src/components/shell/RestoreModal.tsx

@@ -1,3 +1,4 @@
+import { formatDateTime } from "../../lib/timestamp";
 import { EditorModal } from "./EditorModal";
 import { Button } from "../shared/Button";
 
@@ -10,16 +11,10 @@ interface RestoreModalProps {
 }
 
 export function RestoreModal({ isOpen, onClose, date, onConfirm, isRestoring }: RestoreModalProps) {
-  const formattedDate = new Date(date).toLocaleDateString("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric",
-  });
-
   return (
     <EditorModal isOpen={isOpen} onClose={onClose} title="Restore this version?">
       <p className="mb-4 text-sm text-base-contrast-light">
-        This will publish the content from {formattedDate} as a new update.
+        This will publish the content from {formatDateTime(date)} as a new update.
         Your current content will still be available in the history.
       </p>
       <div className="flex justify-end gap-3">

package/src/lib/timestamp.ts

@@ -1,3 +1,26 @@
+export function formatDate(iso: string): string {
+  return new Date(iso).toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+  });
+}
+
+export function formatDateTime(iso: string): string {
+  const date = new Date(iso);
+  const datePart = date.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+  });
+  const timePart = date.toLocaleTimeString("en-US", {
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true,
+  });
+  return `${datePart} | ${timePart}`;
+}
+
 export function formatTimestamp(iso: string): string {
   const date = new Date(iso);
   const now = new Date();