@medialane/ui 0.62.0 → 0.63.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/nav-command-menu.cjs +2 -3
- package/dist/components/nav-command-menu.cjs.map +1 -1
- package/dist/components/nav-command-menu.js +2 -3
- package/dist/components/nav-command-menu.js.map +1 -1
- package/dist/components/nav-shell.cjs +4 -31
- package/dist/components/nav-shell.cjs.map +1 -1
- package/dist/components/nav-shell.d.cts +4 -12
- package/dist/components/nav-shell.d.ts +4 -12
- package/dist/components/nav-shell.js +4 -30
- package/dist/components/nav-shell.js.map +1 -1
- package/dist/index.cjs +0 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -202,7 +202,7 @@ function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }) {
|
|
|
202
202
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
203
203
|
import_framer_motion.motion.div,
|
|
204
204
|
{
|
|
205
|
-
className: "fixed inset-0 z-[101] flex items-end justify-center sm:items-center sm:p-4",
|
|
205
|
+
className: "fixed inset-0 z-[101] flex items-end justify-center p-3 pb-4 sm:items-center sm:p-4",
|
|
206
206
|
initial: { opacity: 0, y: 24, scale: 1 },
|
|
207
207
|
animate: { opacity: 1, y: 0, scale: 1 },
|
|
208
208
|
exit: { opacity: 0, y: 24 },
|
|
@@ -212,8 +212,7 @@ function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }) {
|
|
|
212
212
|
"div",
|
|
213
213
|
{
|
|
214
214
|
className: (0, import_cn.cn)(
|
|
215
|
-
"flex w-full max-h-[
|
|
216
|
-
"rounded-t-[20px] sm:rounded-[20px]",
|
|
215
|
+
"flex w-full max-h-[85dvh] flex-col overflow-hidden rounded-[20px] sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]",
|
|
217
216
|
"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150"
|
|
218
217
|
),
|
|
219
218
|
onClick: (e) => e.stopPropagation(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/nav-command-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Command } from \"cmdk\";\nimport { useRouter } from \"next/navigation\";\nimport { Search, X, ArrowRight } from \"lucide-react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport interface NavCommand {\n id: string;\n label: string;\n icon: React.ComponentType<{ className?: string }>;\n href?: string;\n action?: () => void;\n /** Extra search terms beyond the label */\n keywords?: string[];\n /** Optional one-line description shown under the label */\n description?: string;\n}\n\nexport interface NavCommandGroup {\n /**\n * Optional group heading. Omit it for the primary group so its items\n * read as the top-level menu — they render first, emphasized, with no\n * label, separated from the headed groups below.\n */\n heading?: string;\n items: NavCommand[];\n}\n\nexport interface NavCommandMenuProps {\n commands: NavCommandGroup[];\n /**\n * Optional trigger element rendered inline at the component's mount point.\n * For most apps, omit this and call `useNavCommandMenu().open()` from a\n * separate button — that keeps the trigger in the right place in the layout.\n */\n trigger?: React.ReactNode;\n /**\n * Optional pinned account/connect area rendered below command results.\n * Apps own the auth implementation here (Clerk, ChipiPay, wallet connectors,\n * Privy, Cartridge, etc.) so the shared nav stays framework-agnostic.\n */\n accountSlot?: React.ReactNode;\n /**\n * Optional control rendered in the footer row (e.g. a theme toggle).\n * Apps own theme state (next-themes etc.) so the shared nav stays\n * framework-agnostic — same pattern as `accountSlot`.\n */\n footerSlot?: React.ReactNode;\n}\n\n// ── Singleton hook ─────────────────────────────────────────────────────────────\n\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavCommandMenu() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_NAV_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE)),\n };\n}\n\n// ── Recents (localStorage) ─────────────────────────────────────────────────────\n\nconst RECENT_KEY = \"ml.nav.recent\";\nconst RECENT_MAX = 3;\n\nfunction readRecents(): string[] {\n try {\n const raw = localStorage.getItem(RECENT_KEY);\n const ids = raw ? (JSON.parse(raw) as unknown) : [];\n return Array.isArray(ids) ? ids.filter((x): x is string => typeof x === \"string\") : [];\n } catch {\n return [];\n }\n}\n\nfunction pushRecent(id: string) {\n try {\n const next = [id, ...readRecents().filter((x) => x !== id)].slice(0, RECENT_MAX);\n localStorage.setItem(RECENT_KEY, JSON.stringify(next));\n } catch {\n /* storage unavailable — recents are a nicety, never an error */\n }\n}\n\n// ── Small primitives ──────────────────────────────────────────────────────────\n\nfunction Kbd({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <kbd\n className={cn(\n \"inline-flex min-w-[18px] items-center justify-center rounded-md bg-muted/60 px-1.5 py-0.5\",\n \"font-sans text-[10px] leading-none text-muted-foreground\",\n className\n )}\n >\n {children}\n </kbd>\n );\n}\n\nfunction CommandRow({ item, primary, onSelect }: { item: NavCommand; primary: boolean; onSelect: () => void }) {\n return (\n <Command.Item\n value={[item.label, ...(item.keywords ?? [])].join(\" \")}\n onSelect={onSelect}\n className={cn(\n \"group/item flex cursor-pointer items-center gap-3 rounded-xl\",\n \"transition-colors duration-150 aria-selected:bg-primary/10\",\n primary ? \"px-2.5 py-2.5\" : \"px-2.5 py-2\"\n )}\n >\n <span\n className={cn(\n \"flex shrink-0 items-center justify-center rounded-lg transition-colors\",\n \"bg-muted/50 group-aria-selected/item:bg-primary/15\",\n primary ? \"h-9 w-9\" : \"h-8 w-8\"\n )}\n >\n <item.icon\n className={cn(\n \"text-foreground/80 transition-colors group-aria-selected/item:text-primary\",\n primary ? \"h-[18px] w-[18px]\" : \"h-4 w-4\"\n )}\n />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span\n className={cn(\n \"block truncate leading-tight\",\n primary ? \"text-[15px] font-medium\" : \"text-sm\"\n )}\n >\n {item.label}\n </span>\n {item.description && (\n <span className=\"mt-0.5 block truncate text-[11.5px] leading-tight text-muted-foreground\">\n {item.description}\n </span>\n )}\n </span>\n <ArrowRight className=\"h-3.5 w-3.5 shrink-0 text-muted-foreground/30 transition-colors group-aria-selected/item:text-primary/70\" />\n </Command.Item>\n );\n}\n\nconst GROUP_HEADING_CLASSES = cn(\n \"[&_[cmdk-group-heading]]:px-2.5\",\n \"[&_[cmdk-group-heading]]:pt-2\",\n \"[&_[cmdk-group-heading]]:pb-1\",\n \"[&_[cmdk-group-heading]]:text-[10.5px]\",\n \"[&_[cmdk-group-heading]]:font-semibold\",\n \"[&_[cmdk-group-heading]]:uppercase\",\n \"[&_[cmdk-group-heading]]:tracking-[0.08em]\",\n \"[&_[cmdk-group-heading]]:text-muted-foreground/60\"\n);\n\n// ── Component ─────────────────────────────────────────────────────────────────\n\nexport function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }: NavCommandMenuProps) {\n const [open, setOpen] = React.useState(false);\n const [query, setQuery] = React.useState(\"\");\n const [recentIds, setRecentIds] = React.useState<string[]>([]);\n const router = useRouter();\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n React.useEffect(() => {\n if (!open) return;\n setQuery(\"\");\n setRecentIds(readRecents());\n const t = setTimeout(() => inputRef.current?.focus(), 60);\n return () => clearTimeout(t);\n }, [open]);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"k\" && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n setOpen((prev) => !prev);\n }\n if (e.key === \"Escape\") setOpen(false);\n };\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n document.addEventListener(\"keydown\", onKey);\n document.addEventListener(ML_NAV_OPEN, onOpen);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n return () => {\n document.removeEventListener(\"keydown\", onKey);\n document.removeEventListener(ML_NAV_OPEN, onOpen);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n };\n }, []);\n\n const runCommand = React.useCallback(\n (cmd: NavCommand) => {\n pushRecent(cmd.id);\n setOpen(false);\n if (cmd.href) router.push(cmd.href);\n else cmd.action?.();\n },\n [router]\n );\n\n // Recents only render while the query is empty (search results replace them).\n const recentItems = React.useMemo(() => {\n if (recentIds.length === 0) return [];\n const all = new Map(commands.flatMap((g) => g.items.map((it) => [it.id, it] as const)));\n return recentIds.map((id) => all.get(id)).filter((it): it is NavCommand => Boolean(it));\n }, [recentIds, commands]);\n const showRecents = query === \"\" && recentItems.length > 0;\n\n return (\n <>\n {trigger}\n\n <AnimatePresence>\n {open && (\n <>\n {/* Backdrop blur */}\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n\n {/* Command panel — centered on desktop, bottom sheet on mobile */}\n <motion.div\n className=\"fixed inset-0 z-[101] flex items-end justify-center sm:items-center sm:p-4\"\n initial={{ opacity: 0, y: 24, scale: 1 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n onClick={() => setOpen(false)}\n >\n <div\n className={cn(\n \"flex w-full max-h-[88dvh] flex-col overflow-hidden sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]\",\n \"rounded-t-[20px] sm:rounded-[20px]\",\n \"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\"\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <Command shouldFilter label=\"Medialane navigation\" className=\"flex min-h-0 flex-1 flex-col\">\n {/* Drag handle (mobile) */}\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n\n {/* Search bar */}\n <div className=\"flex items-center gap-3 border-b border-border/40 px-4 py-3.5\">\n <Search\n className={cn(\n \"h-[18px] w-[18px] shrink-0 transition-colors\",\n query ? \"text-primary\" : \"text-muted-foreground\"\n )}\n />\n <Command.Input\n ref={inputRef}\n value={query}\n onValueChange={setQuery}\n placeholder=\"Search or run a command…\"\n className=\"flex-1 bg-transparent text-[15px] outline-none placeholder:text-muted-foreground\"\n />\n <Kbd className=\"hidden sm:inline-flex\">esc</Kbd>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 transition-colors hover:bg-muted/50 sm:hidden\"\n aria-label=\"Close\"\n >\n <X className=\"h-4 w-4 text-muted-foreground\" />\n </button>\n </div>\n\n {/* Results */}\n <Command.List className=\"min-h-0 flex-1 overflow-y-auto overscroll-contain p-2\">\n <Command.Empty className=\"py-8 text-center text-sm text-muted-foreground\">\n No results found.\n </Command.Empty>\n\n {showRecents && (\n <Command.Group heading=\"Recent\" className={GROUP_HEADING_CLASSES}>\n {recentItems.map((item) => (\n <CommandRow\n key={`recent-${item.id}`}\n item={item}\n primary={false}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n )}\n\n {commands.map((group, i) => {\n const primary = !group.heading;\n return (\n <React.Fragment key={group.heading ?? `__primary-${i}`}>\n {(i > 0 || showRecents) && (\n <Command.Separator className=\"my-1.5 h-px bg-border/40\" />\n )}\n <Command.Group heading={group.heading} className={GROUP_HEADING_CLASSES}>\n {group.items.map((item) => (\n <CommandRow\n key={item.id}\n item={item}\n primary={primary}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n </React.Fragment>\n );\n })}\n </Command.List>\n\n {accountSlot && (\n <div className=\"border-t border-border/40 bg-muted/20 px-3 py-3\">\n {accountSlot}\n </div>\n )}\n\n {/* Footer */}\n <div className=\"flex items-center justify-between gap-3 border-t border-border/40 bg-muted/20 px-3 py-2\">\n <div className=\"flex items-center gap-3\">\n {footerSlot}\n <span className=\"hidden items-center gap-3 text-[10.5px] text-muted-foreground/70 sm:flex\">\n <span className=\"flex items-center gap-1\"><Kbd>↑</Kbd><Kbd>↓</Kbd> Navigate</span>\n <span className=\"flex items-center gap-1\"><Kbd>↵</Kbd> Open</span>\n </span>\n </div>\n <span className=\"flex shrink-0 items-center gap-2 text-[10px] text-muted-foreground/50\">\n medialane\n <Kbd className=\"hidden sm:inline-flex\">⌘K</Kbd>\n </span>\n </div>\n </Command>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n </>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/nav-command-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Command } from \"cmdk\";\nimport { useRouter } from \"next/navigation\";\nimport { Search, X, ArrowRight } from \"lucide-react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport interface NavCommand {\n id: string;\n label: string;\n icon: React.ComponentType<{ className?: string }>;\n href?: string;\n action?: () => void;\n /** Extra search terms beyond the label */\n keywords?: string[];\n /** Optional one-line description shown under the label */\n description?: string;\n}\n\nexport interface NavCommandGroup {\n /**\n * Optional group heading. Omit it for the primary group so its items\n * read as the top-level menu — they render first, emphasized, with no\n * label, separated from the headed groups below.\n */\n heading?: string;\n items: NavCommand[];\n}\n\nexport interface NavCommandMenuProps {\n commands: NavCommandGroup[];\n /**\n * Optional trigger element rendered inline at the component's mount point.\n * For most apps, omit this and call `useNavCommandMenu().open()` from a\n * separate button — that keeps the trigger in the right place in the layout.\n */\n trigger?: React.ReactNode;\n /**\n * Optional pinned account/connect area rendered below command results.\n * Apps own the auth implementation here (Clerk, ChipiPay, wallet connectors,\n * Privy, Cartridge, etc.) so the shared nav stays framework-agnostic.\n */\n accountSlot?: React.ReactNode;\n /**\n * Optional control rendered in the footer row (e.g. a theme toggle).\n * Apps own theme state (next-themes etc.) so the shared nav stays\n * framework-agnostic — same pattern as `accountSlot`.\n */\n footerSlot?: React.ReactNode;\n}\n\n// ── Singleton hook ─────────────────────────────────────────────────────────────\n\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavCommandMenu() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_NAV_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE)),\n };\n}\n\n// ── Recents (localStorage) ─────────────────────────────────────────────────────\n\nconst RECENT_KEY = \"ml.nav.recent\";\nconst RECENT_MAX = 3;\n\nfunction readRecents(): string[] {\n try {\n const raw = localStorage.getItem(RECENT_KEY);\n const ids = raw ? (JSON.parse(raw) as unknown) : [];\n return Array.isArray(ids) ? ids.filter((x): x is string => typeof x === \"string\") : [];\n } catch {\n return [];\n }\n}\n\nfunction pushRecent(id: string) {\n try {\n const next = [id, ...readRecents().filter((x) => x !== id)].slice(0, RECENT_MAX);\n localStorage.setItem(RECENT_KEY, JSON.stringify(next));\n } catch {\n /* storage unavailable — recents are a nicety, never an error */\n }\n}\n\n// ── Small primitives ──────────────────────────────────────────────────────────\n\nfunction Kbd({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <kbd\n className={cn(\n \"inline-flex min-w-[18px] items-center justify-center rounded-md bg-muted/60 px-1.5 py-0.5\",\n \"font-sans text-[10px] leading-none text-muted-foreground\",\n className\n )}\n >\n {children}\n </kbd>\n );\n}\n\nfunction CommandRow({ item, primary, onSelect }: { item: NavCommand; primary: boolean; onSelect: () => void }) {\n return (\n <Command.Item\n value={[item.label, ...(item.keywords ?? [])].join(\" \")}\n onSelect={onSelect}\n className={cn(\n \"group/item flex cursor-pointer items-center gap-3 rounded-xl\",\n \"transition-colors duration-150 aria-selected:bg-primary/10\",\n primary ? \"px-2.5 py-2.5\" : \"px-2.5 py-2\"\n )}\n >\n <span\n className={cn(\n \"flex shrink-0 items-center justify-center rounded-lg transition-colors\",\n \"bg-muted/50 group-aria-selected/item:bg-primary/15\",\n primary ? \"h-9 w-9\" : \"h-8 w-8\"\n )}\n >\n <item.icon\n className={cn(\n \"text-foreground/80 transition-colors group-aria-selected/item:text-primary\",\n primary ? \"h-[18px] w-[18px]\" : \"h-4 w-4\"\n )}\n />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span\n className={cn(\n \"block truncate leading-tight\",\n primary ? \"text-[15px] font-medium\" : \"text-sm\"\n )}\n >\n {item.label}\n </span>\n {item.description && (\n <span className=\"mt-0.5 block truncate text-[11.5px] leading-tight text-muted-foreground\">\n {item.description}\n </span>\n )}\n </span>\n <ArrowRight className=\"h-3.5 w-3.5 shrink-0 text-muted-foreground/30 transition-colors group-aria-selected/item:text-primary/70\" />\n </Command.Item>\n );\n}\n\nconst GROUP_HEADING_CLASSES = cn(\n \"[&_[cmdk-group-heading]]:px-2.5\",\n \"[&_[cmdk-group-heading]]:pt-2\",\n \"[&_[cmdk-group-heading]]:pb-1\",\n \"[&_[cmdk-group-heading]]:text-[10.5px]\",\n \"[&_[cmdk-group-heading]]:font-semibold\",\n \"[&_[cmdk-group-heading]]:uppercase\",\n \"[&_[cmdk-group-heading]]:tracking-[0.08em]\",\n \"[&_[cmdk-group-heading]]:text-muted-foreground/60\"\n);\n\n// ── Component ─────────────────────────────────────────────────────────────────\n\nexport function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }: NavCommandMenuProps) {\n const [open, setOpen] = React.useState(false);\n const [query, setQuery] = React.useState(\"\");\n const [recentIds, setRecentIds] = React.useState<string[]>([]);\n const router = useRouter();\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n React.useEffect(() => {\n if (!open) return;\n setQuery(\"\");\n setRecentIds(readRecents());\n const t = setTimeout(() => inputRef.current?.focus(), 60);\n return () => clearTimeout(t);\n }, [open]);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"k\" && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n setOpen((prev) => !prev);\n }\n if (e.key === \"Escape\") setOpen(false);\n };\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n document.addEventListener(\"keydown\", onKey);\n document.addEventListener(ML_NAV_OPEN, onOpen);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n return () => {\n document.removeEventListener(\"keydown\", onKey);\n document.removeEventListener(ML_NAV_OPEN, onOpen);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n };\n }, []);\n\n const runCommand = React.useCallback(\n (cmd: NavCommand) => {\n pushRecent(cmd.id);\n setOpen(false);\n if (cmd.href) router.push(cmd.href);\n else cmd.action?.();\n },\n [router]\n );\n\n // Recents only render while the query is empty (search results replace them).\n const recentItems = React.useMemo(() => {\n if (recentIds.length === 0) return [];\n const all = new Map(commands.flatMap((g) => g.items.map((it) => [it.id, it] as const)));\n return recentIds.map((id) => all.get(id)).filter((it): it is NavCommand => Boolean(it));\n }, [recentIds, commands]);\n const showRecents = query === \"\" && recentItems.length > 0;\n\n return (\n <>\n {trigger}\n\n <AnimatePresence>\n {open && (\n <>\n {/* Backdrop blur */}\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n\n {/* Command panel — centered on desktop, bottom sheet on mobile */}\n <motion.div\n className=\"fixed inset-0 z-[101] flex items-end justify-center p-3 pb-4 sm:items-center sm:p-4\"\n initial={{ opacity: 0, y: 24, scale: 1 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n onClick={() => setOpen(false)}\n >\n <div\n className={cn(\n \"flex w-full max-h-[85dvh] flex-col overflow-hidden rounded-[20px] sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]\",\n \"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\"\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <Command shouldFilter label=\"Medialane navigation\" className=\"flex min-h-0 flex-1 flex-col\">\n {/* Drag handle (mobile) */}\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n\n {/* Search bar */}\n <div className=\"flex items-center gap-3 border-b border-border/40 px-4 py-3.5\">\n <Search\n className={cn(\n \"h-[18px] w-[18px] shrink-0 transition-colors\",\n query ? \"text-primary\" : \"text-muted-foreground\"\n )}\n />\n <Command.Input\n ref={inputRef}\n value={query}\n onValueChange={setQuery}\n placeholder=\"Search or run a command…\"\n className=\"flex-1 bg-transparent text-[15px] outline-none placeholder:text-muted-foreground\"\n />\n <Kbd className=\"hidden sm:inline-flex\">esc</Kbd>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 transition-colors hover:bg-muted/50 sm:hidden\"\n aria-label=\"Close\"\n >\n <X className=\"h-4 w-4 text-muted-foreground\" />\n </button>\n </div>\n\n {/* Results */}\n <Command.List className=\"min-h-0 flex-1 overflow-y-auto overscroll-contain p-2\">\n <Command.Empty className=\"py-8 text-center text-sm text-muted-foreground\">\n No results found.\n </Command.Empty>\n\n {showRecents && (\n <Command.Group heading=\"Recent\" className={GROUP_HEADING_CLASSES}>\n {recentItems.map((item) => (\n <CommandRow\n key={`recent-${item.id}`}\n item={item}\n primary={false}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n )}\n\n {commands.map((group, i) => {\n const primary = !group.heading;\n return (\n <React.Fragment key={group.heading ?? `__primary-${i}`}>\n {(i > 0 || showRecents) && (\n <Command.Separator className=\"my-1.5 h-px bg-border/40\" />\n )}\n <Command.Group heading={group.heading} className={GROUP_HEADING_CLASSES}>\n {group.items.map((item) => (\n <CommandRow\n key={item.id}\n item={item}\n primary={primary}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n </React.Fragment>\n );\n })}\n </Command.List>\n\n {accountSlot && (\n <div className=\"border-t border-border/40 bg-muted/20 px-3 py-3\">\n {accountSlot}\n </div>\n )}\n\n {/* Footer */}\n <div className=\"flex items-center justify-between gap-3 border-t border-border/40 bg-muted/20 px-3 py-2\">\n <div className=\"flex items-center gap-3\">\n {footerSlot}\n <span className=\"hidden items-center gap-3 text-[10.5px] text-muted-foreground/70 sm:flex\">\n <span className=\"flex items-center gap-1\"><Kbd>↑</Kbd><Kbd>↓</Kbd> Navigate</span>\n <span className=\"flex items-center gap-1\"><Kbd>↵</Kbd> Open</span>\n </span>\n </div>\n <span className=\"flex shrink-0 items-center gap-2 text-[10px] text-muted-foreground/50\">\n medialane\n <Kbd className=\"hidden sm:inline-flex\">⌘K</Kbd>\n </span>\n </div>\n </Command>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n </>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -168,7 +168,7 @@ function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }) {
|
|
|
168
168
|
/* @__PURE__ */ jsx(
|
|
169
169
|
motion.div,
|
|
170
170
|
{
|
|
171
|
-
className: "fixed inset-0 z-[101] flex items-end justify-center sm:items-center sm:p-4",
|
|
171
|
+
className: "fixed inset-0 z-[101] flex items-end justify-center p-3 pb-4 sm:items-center sm:p-4",
|
|
172
172
|
initial: { opacity: 0, y: 24, scale: 1 },
|
|
173
173
|
animate: { opacity: 1, y: 0, scale: 1 },
|
|
174
174
|
exit: { opacity: 0, y: 24 },
|
|
@@ -178,8 +178,7 @@ function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }) {
|
|
|
178
178
|
"div",
|
|
179
179
|
{
|
|
180
180
|
className: cn(
|
|
181
|
-
"flex w-full max-h-[
|
|
182
|
-
"rounded-t-[20px] sm:rounded-[20px]",
|
|
181
|
+
"flex w-full max-h-[85dvh] flex-col overflow-hidden rounded-[20px] sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]",
|
|
183
182
|
"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150"
|
|
184
183
|
),
|
|
185
184
|
onClick: (e) => e.stopPropagation(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/nav-command-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Command } from \"cmdk\";\nimport { useRouter } from \"next/navigation\";\nimport { Search, X, ArrowRight } from \"lucide-react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport interface NavCommand {\n id: string;\n label: string;\n icon: React.ComponentType<{ className?: string }>;\n href?: string;\n action?: () => void;\n /** Extra search terms beyond the label */\n keywords?: string[];\n /** Optional one-line description shown under the label */\n description?: string;\n}\n\nexport interface NavCommandGroup {\n /**\n * Optional group heading. Omit it for the primary group so its items\n * read as the top-level menu — they render first, emphasized, with no\n * label, separated from the headed groups below.\n */\n heading?: string;\n items: NavCommand[];\n}\n\nexport interface NavCommandMenuProps {\n commands: NavCommandGroup[];\n /**\n * Optional trigger element rendered inline at the component's mount point.\n * For most apps, omit this and call `useNavCommandMenu().open()` from a\n * separate button — that keeps the trigger in the right place in the layout.\n */\n trigger?: React.ReactNode;\n /**\n * Optional pinned account/connect area rendered below command results.\n * Apps own the auth implementation here (Clerk, ChipiPay, wallet connectors,\n * Privy, Cartridge, etc.) so the shared nav stays framework-agnostic.\n */\n accountSlot?: React.ReactNode;\n /**\n * Optional control rendered in the footer row (e.g. a theme toggle).\n * Apps own theme state (next-themes etc.) so the shared nav stays\n * framework-agnostic — same pattern as `accountSlot`.\n */\n footerSlot?: React.ReactNode;\n}\n\n// ── Singleton hook ─────────────────────────────────────────────────────────────\n\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavCommandMenu() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_NAV_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE)),\n };\n}\n\n// ── Recents (localStorage) ─────────────────────────────────────────────────────\n\nconst RECENT_KEY = \"ml.nav.recent\";\nconst RECENT_MAX = 3;\n\nfunction readRecents(): string[] {\n try {\n const raw = localStorage.getItem(RECENT_KEY);\n const ids = raw ? (JSON.parse(raw) as unknown) : [];\n return Array.isArray(ids) ? ids.filter((x): x is string => typeof x === \"string\") : [];\n } catch {\n return [];\n }\n}\n\nfunction pushRecent(id: string) {\n try {\n const next = [id, ...readRecents().filter((x) => x !== id)].slice(0, RECENT_MAX);\n localStorage.setItem(RECENT_KEY, JSON.stringify(next));\n } catch {\n /* storage unavailable — recents are a nicety, never an error */\n }\n}\n\n// ── Small primitives ──────────────────────────────────────────────────────────\n\nfunction Kbd({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <kbd\n className={cn(\n \"inline-flex min-w-[18px] items-center justify-center rounded-md bg-muted/60 px-1.5 py-0.5\",\n \"font-sans text-[10px] leading-none text-muted-foreground\",\n className\n )}\n >\n {children}\n </kbd>\n );\n}\n\nfunction CommandRow({ item, primary, onSelect }: { item: NavCommand; primary: boolean; onSelect: () => void }) {\n return (\n <Command.Item\n value={[item.label, ...(item.keywords ?? [])].join(\" \")}\n onSelect={onSelect}\n className={cn(\n \"group/item flex cursor-pointer items-center gap-3 rounded-xl\",\n \"transition-colors duration-150 aria-selected:bg-primary/10\",\n primary ? \"px-2.5 py-2.5\" : \"px-2.5 py-2\"\n )}\n >\n <span\n className={cn(\n \"flex shrink-0 items-center justify-center rounded-lg transition-colors\",\n \"bg-muted/50 group-aria-selected/item:bg-primary/15\",\n primary ? \"h-9 w-9\" : \"h-8 w-8\"\n )}\n >\n <item.icon\n className={cn(\n \"text-foreground/80 transition-colors group-aria-selected/item:text-primary\",\n primary ? \"h-[18px] w-[18px]\" : \"h-4 w-4\"\n )}\n />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span\n className={cn(\n \"block truncate leading-tight\",\n primary ? \"text-[15px] font-medium\" : \"text-sm\"\n )}\n >\n {item.label}\n </span>\n {item.description && (\n <span className=\"mt-0.5 block truncate text-[11.5px] leading-tight text-muted-foreground\">\n {item.description}\n </span>\n )}\n </span>\n <ArrowRight className=\"h-3.5 w-3.5 shrink-0 text-muted-foreground/30 transition-colors group-aria-selected/item:text-primary/70\" />\n </Command.Item>\n );\n}\n\nconst GROUP_HEADING_CLASSES = cn(\n \"[&_[cmdk-group-heading]]:px-2.5\",\n \"[&_[cmdk-group-heading]]:pt-2\",\n \"[&_[cmdk-group-heading]]:pb-1\",\n \"[&_[cmdk-group-heading]]:text-[10.5px]\",\n \"[&_[cmdk-group-heading]]:font-semibold\",\n \"[&_[cmdk-group-heading]]:uppercase\",\n \"[&_[cmdk-group-heading]]:tracking-[0.08em]\",\n \"[&_[cmdk-group-heading]]:text-muted-foreground/60\"\n);\n\n// ── Component ─────────────────────────────────────────────────────────────────\n\nexport function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }: NavCommandMenuProps) {\n const [open, setOpen] = React.useState(false);\n const [query, setQuery] = React.useState(\"\");\n const [recentIds, setRecentIds] = React.useState<string[]>([]);\n const router = useRouter();\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n React.useEffect(() => {\n if (!open) return;\n setQuery(\"\");\n setRecentIds(readRecents());\n const t = setTimeout(() => inputRef.current?.focus(), 60);\n return () => clearTimeout(t);\n }, [open]);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"k\" && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n setOpen((prev) => !prev);\n }\n if (e.key === \"Escape\") setOpen(false);\n };\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n document.addEventListener(\"keydown\", onKey);\n document.addEventListener(ML_NAV_OPEN, onOpen);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n return () => {\n document.removeEventListener(\"keydown\", onKey);\n document.removeEventListener(ML_NAV_OPEN, onOpen);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n };\n }, []);\n\n const runCommand = React.useCallback(\n (cmd: NavCommand) => {\n pushRecent(cmd.id);\n setOpen(false);\n if (cmd.href) router.push(cmd.href);\n else cmd.action?.();\n },\n [router]\n );\n\n // Recents only render while the query is empty (search results replace them).\n const recentItems = React.useMemo(() => {\n if (recentIds.length === 0) return [];\n const all = new Map(commands.flatMap((g) => g.items.map((it) => [it.id, it] as const)));\n return recentIds.map((id) => all.get(id)).filter((it): it is NavCommand => Boolean(it));\n }, [recentIds, commands]);\n const showRecents = query === \"\" && recentItems.length > 0;\n\n return (\n <>\n {trigger}\n\n <AnimatePresence>\n {open && (\n <>\n {/* Backdrop blur */}\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n\n {/* Command panel — centered on desktop, bottom sheet on mobile */}\n <motion.div\n className=\"fixed inset-0 z-[101] flex items-end justify-center sm:items-center sm:p-4\"\n initial={{ opacity: 0, y: 24, scale: 1 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n onClick={() => setOpen(false)}\n >\n <div\n className={cn(\n \"flex w-full max-h-[88dvh] flex-col overflow-hidden sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]\",\n \"rounded-t-[20px] sm:rounded-[20px]\",\n \"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\"\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <Command shouldFilter label=\"Medialane navigation\" className=\"flex min-h-0 flex-1 flex-col\">\n {/* Drag handle (mobile) */}\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n\n {/* Search bar */}\n <div className=\"flex items-center gap-3 border-b border-border/40 px-4 py-3.5\">\n <Search\n className={cn(\n \"h-[18px] w-[18px] shrink-0 transition-colors\",\n query ? \"text-primary\" : \"text-muted-foreground\"\n )}\n />\n <Command.Input\n ref={inputRef}\n value={query}\n onValueChange={setQuery}\n placeholder=\"Search or run a command…\"\n className=\"flex-1 bg-transparent text-[15px] outline-none placeholder:text-muted-foreground\"\n />\n <Kbd className=\"hidden sm:inline-flex\">esc</Kbd>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 transition-colors hover:bg-muted/50 sm:hidden\"\n aria-label=\"Close\"\n >\n <X className=\"h-4 w-4 text-muted-foreground\" />\n </button>\n </div>\n\n {/* Results */}\n <Command.List className=\"min-h-0 flex-1 overflow-y-auto overscroll-contain p-2\">\n <Command.Empty className=\"py-8 text-center text-sm text-muted-foreground\">\n No results found.\n </Command.Empty>\n\n {showRecents && (\n <Command.Group heading=\"Recent\" className={GROUP_HEADING_CLASSES}>\n {recentItems.map((item) => (\n <CommandRow\n key={`recent-${item.id}`}\n item={item}\n primary={false}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n )}\n\n {commands.map((group, i) => {\n const primary = !group.heading;\n return (\n <React.Fragment key={group.heading ?? `__primary-${i}`}>\n {(i > 0 || showRecents) && (\n <Command.Separator className=\"my-1.5 h-px bg-border/40\" />\n )}\n <Command.Group heading={group.heading} className={GROUP_HEADING_CLASSES}>\n {group.items.map((item) => (\n <CommandRow\n key={item.id}\n item={item}\n primary={primary}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n </React.Fragment>\n );\n })}\n </Command.List>\n\n {accountSlot && (\n <div className=\"border-t border-border/40 bg-muted/20 px-3 py-3\">\n {accountSlot}\n </div>\n )}\n\n {/* Footer */}\n <div className=\"flex items-center justify-between gap-3 border-t border-border/40 bg-muted/20 px-3 py-2\">\n <div className=\"flex items-center gap-3\">\n {footerSlot}\n <span className=\"hidden items-center gap-3 text-[10.5px] text-muted-foreground/70 sm:flex\">\n <span className=\"flex items-center gap-1\"><Kbd>↑</Kbd><Kbd>↓</Kbd> Navigate</span>\n <span className=\"flex items-center gap-1\"><Kbd>↵</Kbd> Open</span>\n </span>\n </div>\n <span className=\"flex shrink-0 items-center gap-2 text-[10px] text-muted-foreground/50\">\n medialane\n <Kbd className=\"hidden sm:inline-flex\">⌘K</Kbd>\n </span>\n </div>\n </Command>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n </>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/nav-command-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Command } from \"cmdk\";\nimport { useRouter } from \"next/navigation\";\nimport { Search, X, ArrowRight } from \"lucide-react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport interface NavCommand {\n id: string;\n label: string;\n icon: React.ComponentType<{ className?: string }>;\n href?: string;\n action?: () => void;\n /** Extra search terms beyond the label */\n keywords?: string[];\n /** Optional one-line description shown under the label */\n description?: string;\n}\n\nexport interface NavCommandGroup {\n /**\n * Optional group heading. Omit it for the primary group so its items\n * read as the top-level menu — they render first, emphasized, with no\n * label, separated from the headed groups below.\n */\n heading?: string;\n items: NavCommand[];\n}\n\nexport interface NavCommandMenuProps {\n commands: NavCommandGroup[];\n /**\n * Optional trigger element rendered inline at the component's mount point.\n * For most apps, omit this and call `useNavCommandMenu().open()` from a\n * separate button — that keeps the trigger in the right place in the layout.\n */\n trigger?: React.ReactNode;\n /**\n * Optional pinned account/connect area rendered below command results.\n * Apps own the auth implementation here (Clerk, ChipiPay, wallet connectors,\n * Privy, Cartridge, etc.) so the shared nav stays framework-agnostic.\n */\n accountSlot?: React.ReactNode;\n /**\n * Optional control rendered in the footer row (e.g. a theme toggle).\n * Apps own theme state (next-themes etc.) so the shared nav stays\n * framework-agnostic — same pattern as `accountSlot`.\n */\n footerSlot?: React.ReactNode;\n}\n\n// ── Singleton hook ─────────────────────────────────────────────────────────────\n\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavCommandMenu() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_NAV_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE)),\n };\n}\n\n// ── Recents (localStorage) ─────────────────────────────────────────────────────\n\nconst RECENT_KEY = \"ml.nav.recent\";\nconst RECENT_MAX = 3;\n\nfunction readRecents(): string[] {\n try {\n const raw = localStorage.getItem(RECENT_KEY);\n const ids = raw ? (JSON.parse(raw) as unknown) : [];\n return Array.isArray(ids) ? ids.filter((x): x is string => typeof x === \"string\") : [];\n } catch {\n return [];\n }\n}\n\nfunction pushRecent(id: string) {\n try {\n const next = [id, ...readRecents().filter((x) => x !== id)].slice(0, RECENT_MAX);\n localStorage.setItem(RECENT_KEY, JSON.stringify(next));\n } catch {\n /* storage unavailable — recents are a nicety, never an error */\n }\n}\n\n// ── Small primitives ──────────────────────────────────────────────────────────\n\nfunction Kbd({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <kbd\n className={cn(\n \"inline-flex min-w-[18px] items-center justify-center rounded-md bg-muted/60 px-1.5 py-0.5\",\n \"font-sans text-[10px] leading-none text-muted-foreground\",\n className\n )}\n >\n {children}\n </kbd>\n );\n}\n\nfunction CommandRow({ item, primary, onSelect }: { item: NavCommand; primary: boolean; onSelect: () => void }) {\n return (\n <Command.Item\n value={[item.label, ...(item.keywords ?? [])].join(\" \")}\n onSelect={onSelect}\n className={cn(\n \"group/item flex cursor-pointer items-center gap-3 rounded-xl\",\n \"transition-colors duration-150 aria-selected:bg-primary/10\",\n primary ? \"px-2.5 py-2.5\" : \"px-2.5 py-2\"\n )}\n >\n <span\n className={cn(\n \"flex shrink-0 items-center justify-center rounded-lg transition-colors\",\n \"bg-muted/50 group-aria-selected/item:bg-primary/15\",\n primary ? \"h-9 w-9\" : \"h-8 w-8\"\n )}\n >\n <item.icon\n className={cn(\n \"text-foreground/80 transition-colors group-aria-selected/item:text-primary\",\n primary ? \"h-[18px] w-[18px]\" : \"h-4 w-4\"\n )}\n />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span\n className={cn(\n \"block truncate leading-tight\",\n primary ? \"text-[15px] font-medium\" : \"text-sm\"\n )}\n >\n {item.label}\n </span>\n {item.description && (\n <span className=\"mt-0.5 block truncate text-[11.5px] leading-tight text-muted-foreground\">\n {item.description}\n </span>\n )}\n </span>\n <ArrowRight className=\"h-3.5 w-3.5 shrink-0 text-muted-foreground/30 transition-colors group-aria-selected/item:text-primary/70\" />\n </Command.Item>\n );\n}\n\nconst GROUP_HEADING_CLASSES = cn(\n \"[&_[cmdk-group-heading]]:px-2.5\",\n \"[&_[cmdk-group-heading]]:pt-2\",\n \"[&_[cmdk-group-heading]]:pb-1\",\n \"[&_[cmdk-group-heading]]:text-[10.5px]\",\n \"[&_[cmdk-group-heading]]:font-semibold\",\n \"[&_[cmdk-group-heading]]:uppercase\",\n \"[&_[cmdk-group-heading]]:tracking-[0.08em]\",\n \"[&_[cmdk-group-heading]]:text-muted-foreground/60\"\n);\n\n// ── Component ─────────────────────────────────────────────────────────────────\n\nexport function NavCommandMenu({ commands, trigger, accountSlot, footerSlot }: NavCommandMenuProps) {\n const [open, setOpen] = React.useState(false);\n const [query, setQuery] = React.useState(\"\");\n const [recentIds, setRecentIds] = React.useState<string[]>([]);\n const router = useRouter();\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n React.useEffect(() => {\n if (!open) return;\n setQuery(\"\");\n setRecentIds(readRecents());\n const t = setTimeout(() => inputRef.current?.focus(), 60);\n return () => clearTimeout(t);\n }, [open]);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"k\" && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n setOpen((prev) => !prev);\n }\n if (e.key === \"Escape\") setOpen(false);\n };\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n document.addEventListener(\"keydown\", onKey);\n document.addEventListener(ML_NAV_OPEN, onOpen);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n return () => {\n document.removeEventListener(\"keydown\", onKey);\n document.removeEventListener(ML_NAV_OPEN, onOpen);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n };\n }, []);\n\n const runCommand = React.useCallback(\n (cmd: NavCommand) => {\n pushRecent(cmd.id);\n setOpen(false);\n if (cmd.href) router.push(cmd.href);\n else cmd.action?.();\n },\n [router]\n );\n\n // Recents only render while the query is empty (search results replace them).\n const recentItems = React.useMemo(() => {\n if (recentIds.length === 0) return [];\n const all = new Map(commands.flatMap((g) => g.items.map((it) => [it.id, it] as const)));\n return recentIds.map((id) => all.get(id)).filter((it): it is NavCommand => Boolean(it));\n }, [recentIds, commands]);\n const showRecents = query === \"\" && recentItems.length > 0;\n\n return (\n <>\n {trigger}\n\n <AnimatePresence>\n {open && (\n <>\n {/* Backdrop blur */}\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n\n {/* Command panel — centered on desktop, bottom sheet on mobile */}\n <motion.div\n className=\"fixed inset-0 z-[101] flex items-end justify-center p-3 pb-4 sm:items-center sm:p-4\"\n initial={{ opacity: 0, y: 24, scale: 1 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n onClick={() => setOpen(false)}\n >\n <div\n className={cn(\n \"flex w-full max-h-[85dvh] flex-col overflow-hidden rounded-[20px] sm:max-h-[min(680px,88dvh)] sm:max-w-[620px]\",\n \"border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\"\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <Command shouldFilter label=\"Medialane navigation\" className=\"flex min-h-0 flex-1 flex-col\">\n {/* Drag handle (mobile) */}\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n\n {/* Search bar */}\n <div className=\"flex items-center gap-3 border-b border-border/40 px-4 py-3.5\">\n <Search\n className={cn(\n \"h-[18px] w-[18px] shrink-0 transition-colors\",\n query ? \"text-primary\" : \"text-muted-foreground\"\n )}\n />\n <Command.Input\n ref={inputRef}\n value={query}\n onValueChange={setQuery}\n placeholder=\"Search or run a command…\"\n className=\"flex-1 bg-transparent text-[15px] outline-none placeholder:text-muted-foreground\"\n />\n <Kbd className=\"hidden sm:inline-flex\">esc</Kbd>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 transition-colors hover:bg-muted/50 sm:hidden\"\n aria-label=\"Close\"\n >\n <X className=\"h-4 w-4 text-muted-foreground\" />\n </button>\n </div>\n\n {/* Results */}\n <Command.List className=\"min-h-0 flex-1 overflow-y-auto overscroll-contain p-2\">\n <Command.Empty className=\"py-8 text-center text-sm text-muted-foreground\">\n No results found.\n </Command.Empty>\n\n {showRecents && (\n <Command.Group heading=\"Recent\" className={GROUP_HEADING_CLASSES}>\n {recentItems.map((item) => (\n <CommandRow\n key={`recent-${item.id}`}\n item={item}\n primary={false}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n )}\n\n {commands.map((group, i) => {\n const primary = !group.heading;\n return (\n <React.Fragment key={group.heading ?? `__primary-${i}`}>\n {(i > 0 || showRecents) && (\n <Command.Separator className=\"my-1.5 h-px bg-border/40\" />\n )}\n <Command.Group heading={group.heading} className={GROUP_HEADING_CLASSES}>\n {group.items.map((item) => (\n <CommandRow\n key={item.id}\n item={item}\n primary={primary}\n onSelect={() => runCommand(item)}\n />\n ))}\n </Command.Group>\n </React.Fragment>\n );\n })}\n </Command.List>\n\n {accountSlot && (\n <div className=\"border-t border-border/40 bg-muted/20 px-3 py-3\">\n {accountSlot}\n </div>\n )}\n\n {/* Footer */}\n <div className=\"flex items-center justify-between gap-3 border-t border-border/40 bg-muted/20 px-3 py-2\">\n <div className=\"flex items-center gap-3\">\n {footerSlot}\n <span className=\"hidden items-center gap-3 text-[10.5px] text-muted-foreground/70 sm:flex\">\n <span className=\"flex items-center gap-1\"><Kbd>↑</Kbd><Kbd>↓</Kbd> Navigate</span>\n <span className=\"flex items-center gap-1\"><Kbd>↵</Kbd> Open</span>\n </span>\n </div>\n <span className=\"flex shrink-0 items-center gap-2 text-[10px] text-muted-foreground/50\">\n medialane\n <Kbd className=\"hidden sm:inline-flex\">⌘K</Kbd>\n </span>\n </div>\n </Command>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n </>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -29,7 +29,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
29
29
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
30
30
|
var nav_shell_exports = {};
|
|
31
31
|
__export(nav_shell_exports, {
|
|
32
|
-
MedialaneMark: () => MedialaneMark,
|
|
33
32
|
NavAccountSheet: () => NavAccountSheet,
|
|
34
33
|
NavBrandButton: () => NavBrandButton,
|
|
35
34
|
NavIconButton: () => NavIconButton,
|
|
@@ -40,32 +39,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
40
39
|
var React = __toESM(require("react"), 1);
|
|
41
40
|
var import_framer_motion = require("framer-motion");
|
|
42
41
|
var import_cn = require("../utils/cn.js");
|
|
43
|
-
function
|
|
44
|
-
const gradId = React.useId();
|
|
45
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
46
|
-
"svg",
|
|
47
|
-
{
|
|
48
|
-
width: size,
|
|
49
|
-
height: size,
|
|
50
|
-
viewBox: "0 0 32 32",
|
|
51
|
-
fill: "none",
|
|
52
|
-
className,
|
|
53
|
-
"aria-hidden": "true",
|
|
54
|
-
children: [
|
|
55
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("linearGradient", { id: gradId, x1: "20", y1: "20", x2: "27", y2: "27", gradientUnits: "userSpaceOnUse", children: [
|
|
56
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "0", stopColor: "#f6608f" }),
|
|
57
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "1", stopColor: "#fb8b46" })
|
|
58
|
-
] }) }),
|
|
59
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "2", width: "28", height: "28", rx: "9", fill: "#1a17ff" }),
|
|
60
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 6.2 9.9 8.4 12.1 9.3 9.9 10.2 9 12.4 8.1 10.2 5.9 9.3 8.1 8.4Z", fill: "#fff" }),
|
|
61
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "14.1", y: "4.5", width: "1.9", height: "23", rx: "0.9", fill: "#fff" }),
|
|
62
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "17.3", y: "4.5", width: "1.9", height: "23", rx: "0.9", fill: "#fff" }),
|
|
63
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "23.4", cy: "22.6", r: "2.7", fill: `url(#${gradId})` })
|
|
64
|
-
]
|
|
65
|
-
}
|
|
66
|
-
);
|
|
67
|
-
}
|
|
68
|
-
function NavBrandButton({ onClick, className, ...rest }) {
|
|
42
|
+
function NavBrandButton({ onClick, className, iconSrc = "/icon.png", ...rest }) {
|
|
69
43
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
70
44
|
"button",
|
|
71
45
|
{
|
|
@@ -80,7 +54,7 @@ function NavBrandButton({ onClick, className, ...rest }) {
|
|
|
80
54
|
className
|
|
81
55
|
),
|
|
82
56
|
children: [
|
|
83
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
57
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: iconSrc, alt: "Medialane", width: 30, height: 30, className: "h-[30px] w-[30px] shrink-0" }),
|
|
84
58
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex flex-col gap-[5px]", "aria-hidden": "true", children: [
|
|
85
59
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground" }),
|
|
86
60
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground" })
|
|
@@ -159,12 +133,12 @@ function NavAccountSheet({ children, title = "Account" }) {
|
|
|
159
133
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
160
134
|
import_framer_motion.motion.div,
|
|
161
135
|
{
|
|
162
|
-
className: "fixed inset-x-
|
|
136
|
+
className: "fixed inset-x-3 bottom-3 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8",
|
|
163
137
|
initial: { opacity: 0, y: 24 },
|
|
164
138
|
animate: { opacity: 1, y: 0 },
|
|
165
139
|
exit: { opacity: 0, y: 24 },
|
|
166
140
|
transition: { duration: 0.18, ease: "easeOut" },
|
|
167
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "overflow-hidden rounded-
|
|
141
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "overflow-hidden rounded-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150", children: [
|
|
168
142
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex justify-center pt-2.5 sm:hidden", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-1 w-9 rounded-full bg-muted-foreground/30" }) }),
|
|
169
143
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3", children: [
|
|
170
144
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70", children: title }),
|
|
@@ -186,7 +160,6 @@ function NavAccountSheet({ children, title = "Account" }) {
|
|
|
186
160
|
}
|
|
187
161
|
// Annotate the CommonJS export names for ESM import in node:
|
|
188
162
|
0 && (module.exports = {
|
|
189
|
-
MedialaneMark,
|
|
190
163
|
NavAccountSheet,
|
|
191
164
|
NavBrandButton,
|
|
192
165
|
NavIconButton,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/nav-shell.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Brand mark ────────────────────────────────────────────────────────────────\n\nexport interface MedialaneMarkProps {\n size?: number;\n className?: string;\n}\n\n/**\n * The Medialane symbol as an inline SVG — electric-blue squircle, sparkle,\n * twin bars, rose→orange dot. Replaces `<img src=\"/icon.png\">` triggers so the\n * mark renders crisp at any size, in any host, with no asset path to break.\n */\nexport function MedialaneMark({ size = 32, className }: MedialaneMarkProps) {\n const gradId = React.useId();\n return (\n <svg\n width={size}\n height={size}\n viewBox=\"0 0 32 32\"\n fill=\"none\"\n className={className}\n aria-hidden=\"true\"\n >\n <defs>\n <linearGradient id={gradId} x1=\"20\" y1=\"20\" x2=\"27\" y2=\"27\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stopColor=\"#f6608f\" />\n <stop offset=\"1\" stopColor=\"#fb8b46\" />\n </linearGradient>\n </defs>\n <rect x=\"2\" y=\"2\" width=\"28\" height=\"28\" rx=\"9\" fill=\"#1a17ff\" />\n <path d=\"M9 6.2 9.9 8.4 12.1 9.3 9.9 10.2 9 12.4 8.1 10.2 5.9 9.3 8.1 8.4Z\" fill=\"#fff\" />\n <rect x=\"14.1\" y=\"4.5\" width=\"1.9\" height=\"23\" rx=\"0.9\" fill=\"#fff\" />\n <rect x=\"17.3\" y=\"4.5\" width=\"1.9\" height=\"23\" rx=\"0.9\" fill=\"#fff\" />\n <circle cx=\"23.4\" cy=\"22.6\" r=\"2.7\" fill={`url(#${gradId})`} />\n </svg>\n );\n}\n\n// ── Header buttons ────────────────────────────────────────────────────────────\n\nexport interface NavBrandButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\"?: string;\n}\n\n/**\n * The main header trigger: brand mark + menu glyph in one quiet glass pill.\n * Mobile-first — a single ≥44px tap target instead of two small adjacent icons.\n */\nexport function NavBrandButton({ onClick, className, ...rest }: NavBrandButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"] ?? \"Open navigation\"}\n className={cn(\n \"group flex h-11 items-center gap-2 rounded-full border border-border/40\",\n \"bg-background/70 pl-1.5 pr-3 backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n <MedialaneMark size={30} className=\"shrink-0\" />\n <span className=\"flex flex-col gap-[5px]\" aria-hidden=\"true\">\n <span className=\"h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n <span className=\"h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n </span>\n </button>\n );\n}\n\nexport interface NavIconButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\": string;\n /** Show a small brand-colored status dot (e.g. wallet connected). */\n indicator?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * Circular glass header button — the right-side counterpart to NavBrandButton\n * (wallet / account trigger).\n */\nexport function NavIconButton({ onClick, className, indicator, children, ...rest }: NavIconButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"]}\n className={cn(\n \"relative flex h-11 w-11 items-center justify-center rounded-full border border-border/40\",\n \"bg-background/70 text-muted-foreground backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 hover:text-foreground active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {children}\n {indicator && (\n <span className=\"absolute right-[3px] top-[3px] h-2.5 w-2.5 rounded-full border-2 border-background bg-brand-blue\" />\n )}\n </button>\n );\n}\n\n// ── Account sheet ─────────────────────────────────────────────────────────────\n\nconst ML_ACCOUNT_OPEN = \"ml:account-open\";\nconst ML_ACCOUNT_CLOSE = \"ml:account-close\";\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavAccountSheet() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_CLOSE)),\n };\n}\n\nexport interface NavAccountSheetProps {\n /** The app's account/connect panel (Clerk, wallet connectors, …). */\n children: React.ReactNode;\n /** Optional heading above the panel. */\n title?: string;\n}\n\n/**\n * The wallet-side surface: a compact glass sheet anchored to the top-right\n * header button (bottom sheet on mobile). Content is app-owned — pass the same\n * account panel the command menu uses in its accountSlot.\n *\n * Opens via `useNavAccountSheet().open()`. Mutually exclusive with the command\n * menu: opening one closes the other, and the shared `ml:nav-close` event\n * (fired by `useNavCommandMenu().close()`) closes this sheet too, so account\n * panels behave identically in both hosts.\n */\nexport function NavAccountSheet({ children, title = \"Account\" }: NavAccountSheetProps) {\n const [open, setOpen] = React.useState(false);\n\n React.useEffect(() => {\n const onOpen = () => {\n document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE));\n setOpen(true);\n };\n const onClose = () => setOpen(false);\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.addEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.addEventListener(ML_NAV_OPEN, onClose);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.removeEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.removeEventListener(ML_NAV_OPEN, onClose);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, []);\n\n return (\n <AnimatePresence>\n {open && (\n <>\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n <motion.div\n className=\"fixed inset-x-0 bottom-0 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8\"\n initial={{ opacity: 0, y: 24 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n >\n <div className=\"overflow-hidden rounded-t-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150 sm:rounded-[20px]\">\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n <div className=\"flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3\">\n <span className=\"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70\">\n {title}\n </span>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted/50\"\n aria-label=\"Close\"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n <path d=\"M18 6 6 18M6 6l12 12\" />\n </svg>\n </button>\n </div>\n <div className=\"px-3 pb-4 pt-1 sm:pb-3\">{children}</div>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/nav-shell.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Header buttons ────────────────────────────────────────────────────────────\n\nexport interface NavBrandButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\"?: string;\n /** Path to the brand icon image (the app's real icon asset). */\n iconSrc?: string;\n}\n\n/**\n * The main header trigger: brand mark + menu glyph in one quiet glass pill.\n * Mobile-first — a single ≥44px tap target instead of two small adjacent icons.\n */\nexport function NavBrandButton({ onClick, className, iconSrc = \"/icon.png\", ...rest }: NavBrandButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"] ?? \"Open navigation\"}\n className={cn(\n \"group flex h-11 items-center gap-2 rounded-full border border-border/40\",\n \"bg-background/70 pl-1.5 pr-3 backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {/* eslint-disable-next-line @next/next/no-img-element */}\n <img src={iconSrc} alt=\"Medialane\" width={30} height={30} className=\"h-[30px] w-[30px] shrink-0\" />\n <span className=\"flex flex-col gap-[5px]\" aria-hidden=\"true\">\n <span className=\"h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n <span className=\"h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n </span>\n </button>\n );\n}\n\nexport interface NavIconButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\": string;\n /** Show a small brand-colored status dot (e.g. wallet connected). */\n indicator?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * Circular glass header button — the right-side counterpart to NavBrandButton\n * (wallet / account trigger).\n */\nexport function NavIconButton({ onClick, className, indicator, children, ...rest }: NavIconButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"]}\n className={cn(\n \"relative flex h-11 w-11 items-center justify-center rounded-full border border-border/40\",\n \"bg-background/70 text-muted-foreground backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 hover:text-foreground active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {children}\n {indicator && (\n <span className=\"absolute right-[3px] top-[3px] h-2.5 w-2.5 rounded-full border-2 border-background bg-brand-blue\" />\n )}\n </button>\n );\n}\n\n// ── Account sheet ─────────────────────────────────────────────────────────────\n\nconst ML_ACCOUNT_OPEN = \"ml:account-open\";\nconst ML_ACCOUNT_CLOSE = \"ml:account-close\";\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavAccountSheet() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_CLOSE)),\n };\n}\n\nexport interface NavAccountSheetProps {\n /** The app's account/connect panel (Clerk, wallet connectors, …). */\n children: React.ReactNode;\n /** Optional heading above the panel. */\n title?: string;\n}\n\n/**\n * The wallet-side surface: a compact glass sheet anchored to the top-right\n * header button (bottom sheet on mobile). Content is app-owned — pass the same\n * account panel the command menu uses in its accountSlot.\n *\n * Opens via `useNavAccountSheet().open()`. Mutually exclusive with the command\n * menu: opening one closes the other, and the shared `ml:nav-close` event\n * (fired by `useNavCommandMenu().close()`) closes this sheet too, so account\n * panels behave identically in both hosts.\n */\nexport function NavAccountSheet({ children, title = \"Account\" }: NavAccountSheetProps) {\n const [open, setOpen] = React.useState(false);\n\n React.useEffect(() => {\n const onOpen = () => {\n document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE));\n setOpen(true);\n };\n const onClose = () => setOpen(false);\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.addEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.addEventListener(ML_NAV_OPEN, onClose);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.removeEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.removeEventListener(ML_NAV_OPEN, onClose);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, []);\n\n return (\n <AnimatePresence>\n {open && (\n <>\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n <motion.div\n className=\"fixed inset-x-3 bottom-3 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8\"\n initial={{ opacity: 0, y: 24 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n >\n <div className=\"overflow-hidden rounded-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\">\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n <div className=\"flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3\">\n <span className=\"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70\">\n {title}\n </span>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted/50\"\n aria-label=\"Close\"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n <path d=\"M18 6 6 18M6 6l12 12\" />\n </svg>\n </button>\n </div>\n <div className=\"px-3 pb-4 pt-1 sm:pb-3\">{children}</div>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,26 +1,18 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
|
|
4
|
-
interface MedialaneMarkProps {
|
|
5
|
-
size?: number;
|
|
6
|
-
className?: string;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* The Medialane symbol as an inline SVG — electric-blue squircle, sparkle,
|
|
10
|
-
* twin bars, rose→orange dot. Replaces `<img src="/icon.png">` triggers so the
|
|
11
|
-
* mark renders crisp at any size, in any host, with no asset path to break.
|
|
12
|
-
*/
|
|
13
|
-
declare function MedialaneMark({ size, className }: MedialaneMarkProps): react_jsx_runtime.JSX.Element;
|
|
14
4
|
interface NavBrandButtonProps {
|
|
15
5
|
onClick?: () => void;
|
|
16
6
|
className?: string;
|
|
17
7
|
"aria-label"?: string;
|
|
8
|
+
/** Path to the brand icon image (the app's real icon asset). */
|
|
9
|
+
iconSrc?: string;
|
|
18
10
|
}
|
|
19
11
|
/**
|
|
20
12
|
* The main header trigger: brand mark + menu glyph in one quiet glass pill.
|
|
21
13
|
* Mobile-first — a single ≥44px tap target instead of two small adjacent icons.
|
|
22
14
|
*/
|
|
23
|
-
declare function NavBrandButton({ onClick, className, ...rest }: NavBrandButtonProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
declare function NavBrandButton({ onClick, className, iconSrc, ...rest }: NavBrandButtonProps): react_jsx_runtime.JSX.Element;
|
|
24
16
|
interface NavIconButtonProps {
|
|
25
17
|
onClick?: () => void;
|
|
26
18
|
className?: string;
|
|
@@ -56,4 +48,4 @@ interface NavAccountSheetProps {
|
|
|
56
48
|
*/
|
|
57
49
|
declare function NavAccountSheet({ children, title }: NavAccountSheetProps): react_jsx_runtime.JSX.Element;
|
|
58
50
|
|
|
59
|
-
export {
|
|
51
|
+
export { NavAccountSheet, type NavAccountSheetProps, NavBrandButton, type NavBrandButtonProps, NavIconButton, type NavIconButtonProps, useNavAccountSheet };
|
|
@@ -1,26 +1,18 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
|
|
4
|
-
interface MedialaneMarkProps {
|
|
5
|
-
size?: number;
|
|
6
|
-
className?: string;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* The Medialane symbol as an inline SVG — electric-blue squircle, sparkle,
|
|
10
|
-
* twin bars, rose→orange dot. Replaces `<img src="/icon.png">` triggers so the
|
|
11
|
-
* mark renders crisp at any size, in any host, with no asset path to break.
|
|
12
|
-
*/
|
|
13
|
-
declare function MedialaneMark({ size, className }: MedialaneMarkProps): react_jsx_runtime.JSX.Element;
|
|
14
4
|
interface NavBrandButtonProps {
|
|
15
5
|
onClick?: () => void;
|
|
16
6
|
className?: string;
|
|
17
7
|
"aria-label"?: string;
|
|
8
|
+
/** Path to the brand icon image (the app's real icon asset). */
|
|
9
|
+
iconSrc?: string;
|
|
18
10
|
}
|
|
19
11
|
/**
|
|
20
12
|
* The main header trigger: brand mark + menu glyph in one quiet glass pill.
|
|
21
13
|
* Mobile-first — a single ≥44px tap target instead of two small adjacent icons.
|
|
22
14
|
*/
|
|
23
|
-
declare function NavBrandButton({ onClick, className, ...rest }: NavBrandButtonProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
declare function NavBrandButton({ onClick, className, iconSrc, ...rest }: NavBrandButtonProps): react_jsx_runtime.JSX.Element;
|
|
24
16
|
interface NavIconButtonProps {
|
|
25
17
|
onClick?: () => void;
|
|
26
18
|
className?: string;
|
|
@@ -56,4 +48,4 @@ interface NavAccountSheetProps {
|
|
|
56
48
|
*/
|
|
57
49
|
declare function NavAccountSheet({ children, title }: NavAccountSheetProps): react_jsx_runtime.JSX.Element;
|
|
58
50
|
|
|
59
|
-
export {
|
|
51
|
+
export { NavAccountSheet, type NavAccountSheetProps, NavBrandButton, type NavBrandButtonProps, NavIconButton, type NavIconButtonProps, useNavAccountSheet };
|
|
@@ -3,32 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { AnimatePresence, motion } from "framer-motion";
|
|
5
5
|
import { cn } from "../utils/cn.js";
|
|
6
|
-
function
|
|
7
|
-
const gradId = React.useId();
|
|
8
|
-
return /* @__PURE__ */ jsxs(
|
|
9
|
-
"svg",
|
|
10
|
-
{
|
|
11
|
-
width: size,
|
|
12
|
-
height: size,
|
|
13
|
-
viewBox: "0 0 32 32",
|
|
14
|
-
fill: "none",
|
|
15
|
-
className,
|
|
16
|
-
"aria-hidden": "true",
|
|
17
|
-
children: [
|
|
18
|
-
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gradId, x1: "20", y1: "20", x2: "27", y2: "27", gradientUnits: "userSpaceOnUse", children: [
|
|
19
|
-
/* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "#f6608f" }),
|
|
20
|
-
/* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#fb8b46" })
|
|
21
|
-
] }) }),
|
|
22
|
-
/* @__PURE__ */ jsx("rect", { x: "2", y: "2", width: "28", height: "28", rx: "9", fill: "#1a17ff" }),
|
|
23
|
-
/* @__PURE__ */ jsx("path", { d: "M9 6.2 9.9 8.4 12.1 9.3 9.9 10.2 9 12.4 8.1 10.2 5.9 9.3 8.1 8.4Z", fill: "#fff" }),
|
|
24
|
-
/* @__PURE__ */ jsx("rect", { x: "14.1", y: "4.5", width: "1.9", height: "23", rx: "0.9", fill: "#fff" }),
|
|
25
|
-
/* @__PURE__ */ jsx("rect", { x: "17.3", y: "4.5", width: "1.9", height: "23", rx: "0.9", fill: "#fff" }),
|
|
26
|
-
/* @__PURE__ */ jsx("circle", { cx: "23.4", cy: "22.6", r: "2.7", fill: `url(#${gradId})` })
|
|
27
|
-
]
|
|
28
|
-
}
|
|
29
|
-
);
|
|
30
|
-
}
|
|
31
|
-
function NavBrandButton({ onClick, className, ...rest }) {
|
|
6
|
+
function NavBrandButton({ onClick, className, iconSrc = "/icon.png", ...rest }) {
|
|
32
7
|
return /* @__PURE__ */ jsxs(
|
|
33
8
|
"button",
|
|
34
9
|
{
|
|
@@ -43,7 +18,7 @@ function NavBrandButton({ onClick, className, ...rest }) {
|
|
|
43
18
|
className
|
|
44
19
|
),
|
|
45
20
|
children: [
|
|
46
|
-
/* @__PURE__ */ jsx(
|
|
21
|
+
/* @__PURE__ */ jsx("img", { src: iconSrc, alt: "Medialane", width: 30, height: 30, className: "h-[30px] w-[30px] shrink-0" }),
|
|
47
22
|
/* @__PURE__ */ jsxs("span", { className: "flex flex-col gap-[5px]", "aria-hidden": "true", children: [
|
|
48
23
|
/* @__PURE__ */ jsx("span", { className: "h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground" }),
|
|
49
24
|
/* @__PURE__ */ jsx("span", { className: "h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground" })
|
|
@@ -122,12 +97,12 @@ function NavAccountSheet({ children, title = "Account" }) {
|
|
|
122
97
|
/* @__PURE__ */ jsx(
|
|
123
98
|
motion.div,
|
|
124
99
|
{
|
|
125
|
-
className: "fixed inset-x-
|
|
100
|
+
className: "fixed inset-x-3 bottom-3 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8",
|
|
126
101
|
initial: { opacity: 0, y: 24 },
|
|
127
102
|
animate: { opacity: 1, y: 0 },
|
|
128
103
|
exit: { opacity: 0, y: 24 },
|
|
129
104
|
transition: { duration: 0.18, ease: "easeOut" },
|
|
130
|
-
children: /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-
|
|
105
|
+
children: /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150", children: [
|
|
131
106
|
/* @__PURE__ */ jsx("div", { className: "flex justify-center pt-2.5 sm:hidden", "aria-hidden": "true", children: /* @__PURE__ */ jsx("span", { className: "h-1 w-9 rounded-full bg-muted-foreground/30" }) }),
|
|
132
107
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3", children: [
|
|
133
108
|
/* @__PURE__ */ jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70", children: title }),
|
|
@@ -148,7 +123,6 @@ function NavAccountSheet({ children, title = "Account" }) {
|
|
|
148
123
|
] }) });
|
|
149
124
|
}
|
|
150
125
|
export {
|
|
151
|
-
MedialaneMark,
|
|
152
126
|
NavAccountSheet,
|
|
153
127
|
NavBrandButton,
|
|
154
128
|
NavIconButton,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/nav-shell.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Brand mark ────────────────────────────────────────────────────────────────\n\nexport interface MedialaneMarkProps {\n size?: number;\n className?: string;\n}\n\n/**\n * The Medialane symbol as an inline SVG — electric-blue squircle, sparkle,\n * twin bars, rose→orange dot. Replaces `<img src=\"/icon.png\">` triggers so the\n * mark renders crisp at any size, in any host, with no asset path to break.\n */\nexport function MedialaneMark({ size = 32, className }: MedialaneMarkProps) {\n const gradId = React.useId();\n return (\n <svg\n width={size}\n height={size}\n viewBox=\"0 0 32 32\"\n fill=\"none\"\n className={className}\n aria-hidden=\"true\"\n >\n <defs>\n <linearGradient id={gradId} x1=\"20\" y1=\"20\" x2=\"27\" y2=\"27\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stopColor=\"#f6608f\" />\n <stop offset=\"1\" stopColor=\"#fb8b46\" />\n </linearGradient>\n </defs>\n <rect x=\"2\" y=\"2\" width=\"28\" height=\"28\" rx=\"9\" fill=\"#1a17ff\" />\n <path d=\"M9 6.2 9.9 8.4 12.1 9.3 9.9 10.2 9 12.4 8.1 10.2 5.9 9.3 8.1 8.4Z\" fill=\"#fff\" />\n <rect x=\"14.1\" y=\"4.5\" width=\"1.9\" height=\"23\" rx=\"0.9\" fill=\"#fff\" />\n <rect x=\"17.3\" y=\"4.5\" width=\"1.9\" height=\"23\" rx=\"0.9\" fill=\"#fff\" />\n <circle cx=\"23.4\" cy=\"22.6\" r=\"2.7\" fill={`url(#${gradId})`} />\n </svg>\n );\n}\n\n// ── Header buttons ────────────────────────────────────────────────────────────\n\nexport interface NavBrandButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\"?: string;\n}\n\n/**\n * The main header trigger: brand mark + menu glyph in one quiet glass pill.\n * Mobile-first — a single ≥44px tap target instead of two small adjacent icons.\n */\nexport function NavBrandButton({ onClick, className, ...rest }: NavBrandButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"] ?? \"Open navigation\"}\n className={cn(\n \"group flex h-11 items-center gap-2 rounded-full border border-border/40\",\n \"bg-background/70 pl-1.5 pr-3 backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n <MedialaneMark size={30} className=\"shrink-0\" />\n <span className=\"flex flex-col gap-[5px]\" aria-hidden=\"true\">\n <span className=\"h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n <span className=\"h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n </span>\n </button>\n );\n}\n\nexport interface NavIconButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\": string;\n /** Show a small brand-colored status dot (e.g. wallet connected). */\n indicator?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * Circular glass header button — the right-side counterpart to NavBrandButton\n * (wallet / account trigger).\n */\nexport function NavIconButton({ onClick, className, indicator, children, ...rest }: NavIconButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"]}\n className={cn(\n \"relative flex h-11 w-11 items-center justify-center rounded-full border border-border/40\",\n \"bg-background/70 text-muted-foreground backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 hover:text-foreground active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {children}\n {indicator && (\n <span className=\"absolute right-[3px] top-[3px] h-2.5 w-2.5 rounded-full border-2 border-background bg-brand-blue\" />\n )}\n </button>\n );\n}\n\n// ── Account sheet ─────────────────────────────────────────────────────────────\n\nconst ML_ACCOUNT_OPEN = \"ml:account-open\";\nconst ML_ACCOUNT_CLOSE = \"ml:account-close\";\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavAccountSheet() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_CLOSE)),\n };\n}\n\nexport interface NavAccountSheetProps {\n /** The app's account/connect panel (Clerk, wallet connectors, …). */\n children: React.ReactNode;\n /** Optional heading above the panel. */\n title?: string;\n}\n\n/**\n * The wallet-side surface: a compact glass sheet anchored to the top-right\n * header button (bottom sheet on mobile). Content is app-owned — pass the same\n * account panel the command menu uses in its accountSlot.\n *\n * Opens via `useNavAccountSheet().open()`. Mutually exclusive with the command\n * menu: opening one closes the other, and the shared `ml:nav-close` event\n * (fired by `useNavCommandMenu().close()`) closes this sheet too, so account\n * panels behave identically in both hosts.\n */\nexport function NavAccountSheet({ children, title = \"Account\" }: NavAccountSheetProps) {\n const [open, setOpen] = React.useState(false);\n\n React.useEffect(() => {\n const onOpen = () => {\n document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE));\n setOpen(true);\n };\n const onClose = () => setOpen(false);\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.addEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.addEventListener(ML_NAV_OPEN, onClose);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.removeEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.removeEventListener(ML_NAV_OPEN, onClose);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, []);\n\n return (\n <AnimatePresence>\n {open && (\n <>\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n <motion.div\n className=\"fixed inset-x-0 bottom-0 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8\"\n initial={{ opacity: 0, y: 24 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n >\n <div className=\"overflow-hidden rounded-t-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150 sm:rounded-[20px]\">\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n <div className=\"flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3\">\n <span className=\"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70\">\n {title}\n </span>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted/50\"\n aria-label=\"Close\"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n <path d=\"M18 6 6 18M6 6l12 12\" />\n </svg>\n </button>\n </div>\n <div className=\"px-3 pb-4 pt-1 sm:pb-3\">{children}</div>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n );\n}\n"],"mappings":";AA8BQ,SAgJA,UA/IE,KADF;AA5BR,YAAY,WAAW;AACvB,SAAS,iBAAiB,cAAc;AACxC,SAAS,UAAU;AAcZ,SAAS,cAAc,EAAE,OAAO,IAAI,UAAU,GAAuB;AAC1E,QAAM,SAAS,MAAM,MAAM;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAQ;AAAA,MACR,MAAK;AAAA,MACL;AAAA,MACA,eAAY;AAAA,MAEZ;AAAA,4BAAC,UACC,+BAAC,oBAAe,IAAI,QAAQ,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,eAAc,kBACxE;AAAA,8BAAC,UAAK,QAAO,KAAI,WAAU,WAAU;AAAA,UACrC,oBAAC,UAAK,QAAO,KAAI,WAAU,WAAU;AAAA,WACvC,GACF;AAAA,QACA,oBAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI,MAAK,WAAU;AAAA,QAC/D,oBAAC,UAAK,GAAE,qEAAoE,MAAK,QAAO;AAAA,QACxF,oBAAC,UAAK,GAAE,QAAO,GAAE,OAAM,OAAM,OAAM,QAAO,MAAK,IAAG,OAAM,MAAK,QAAO;AAAA,QACpE,oBAAC,UAAK,GAAE,QAAO,GAAE,OAAM,OAAM,OAAM,QAAO,MAAK,IAAG,OAAM,MAAK,QAAO;AAAA,QACpE,oBAAC,YAAO,IAAG,QAAO,IAAG,QAAO,GAAE,OAAM,MAAM,QAAQ,MAAM,KAAK;AAAA;AAAA;AAAA,EAC/D;AAEJ;AAcO,SAAS,eAAe,EAAE,SAAS,WAAW,GAAG,KAAK,GAAwB;AACnF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL;AAAA,MACA,cAAY,KAAK,YAAY,KAAK;AAAA,MAClC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,4BAAC,iBAAc,MAAM,IAAI,WAAU,YAAW;AAAA,QAC9C,qBAAC,UAAK,WAAU,2BAA0B,eAAY,QACpD;AAAA,8BAAC,UAAK,WAAU,2GAA0G;AAAA,UAC1H,oBAAC,UAAK,WAAU,6GAA4G;AAAA,WAC9H;AAAA;AAAA;AAAA,EACF;AAEJ;AAeO,SAAS,cAAc,EAAE,SAAS,WAAW,WAAW,UAAU,GAAG,KAAK,GAAuB;AACtG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL;AAAA,MACA,cAAY,KAAK,YAAY;AAAA,MAC7B,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,QACA,aACC,oBAAC,UAAK,WAAU,oGAAmG;AAAA;AAAA;AAAA,EAEvH;AAEJ;AAIA,MAAM,kBAAkB;AACxB,MAAM,mBAAmB;AACzB,MAAM,cAAc;AACpB,MAAM,eAAe;AAEd,SAAS,qBAAqB;AACnC,SAAO;AAAA,IACL,MAAM,MAAM,SAAS,cAAc,IAAI,YAAY,eAAe,CAAC;AAAA,IACnE,OAAO,MAAM,SAAS,cAAc,IAAI,YAAY,gBAAgB,CAAC;AAAA,EACvE;AACF;AAmBO,SAAS,gBAAgB,EAAE,UAAU,QAAQ,UAAU,GAAyB;AACrF,QAAM,CAAC,MAAM,OAAO,IAAI,MAAM,SAAS,KAAK;AAE5C,QAAM,UAAU,MAAM;AACpB,UAAM,SAAS,MAAM;AACnB,eAAS,cAAc,IAAI,YAAY,YAAY,CAAC;AACpD,cAAQ,IAAI;AAAA,IACd;AACA,UAAM,UAAU,MAAM,QAAQ,KAAK;AACnC,UAAM,QAAQ,CAAC,MAAqB;AAClC,UAAI,EAAE,QAAQ,SAAU,SAAQ,KAAK;AAAA,IACvC;AACA,aAAS,iBAAiB,iBAAiB,MAAM;AACjD,aAAS,iBAAiB,kBAAkB,OAAO;AACnD,aAAS,iBAAiB,aAAa,OAAO;AAC9C,aAAS,iBAAiB,cAAc,OAAO;AAC/C,aAAS,iBAAiB,WAAW,KAAK;AAC1C,WAAO,MAAM;AACX,eAAS,oBAAoB,iBAAiB,MAAM;AACpD,eAAS,oBAAoB,kBAAkB,OAAO;AACtD,eAAS,oBAAoB,aAAa,OAAO;AACjD,eAAS,oBAAoB,cAAc,OAAO;AAClD,eAAS,oBAAoB,WAAW,KAAK;AAAA,IAC/C;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,mBACE,kBACC,iCACE;AAAA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,MAAM,EAAE,SAAS,EAAE;AAAA,QACnB,YAAY,EAAE,UAAU,KAAK;AAAA,QAC7B,SAAS,MAAM,QAAQ,KAAK;AAAA;AAAA,IAC9B;AAAA,IACA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,MAAM,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC1B,YAAY,EAAE,UAAU,MAAM,MAAM,UAAU;AAAA,QAE9C,+BAAC,SAAI,WAAU,kJACb;AAAA,8BAAC,SAAI,WAAU,wCAAuC,eAAY,QAChE,8BAAC,UAAK,WAAU,+CAA8C,GAChE;AAAA,UACA,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,UAAK,WAAU,+EACb,iBACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,SAAS,MAAM,QAAQ,KAAK;AAAA,gBAC5B,WAAU;AAAA,gBACV,cAAW;AAAA,gBAEX,8BAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAC9G,8BAAC,UAAK,GAAE,wBAAuB,GACjC;AAAA;AAAA,YACF;AAAA,aACF;AAAA,UACA,oBAAC,SAAI,WAAU,0BAA0B,UAAS;AAAA,WACpD;AAAA;AAAA,IACF;AAAA,KACF,GAEJ;AAEJ;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/nav-shell.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\n\n// ── Header buttons ────────────────────────────────────────────────────────────\n\nexport interface NavBrandButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\"?: string;\n /** Path to the brand icon image (the app's real icon asset). */\n iconSrc?: string;\n}\n\n/**\n * The main header trigger: brand mark + menu glyph in one quiet glass pill.\n * Mobile-first — a single ≥44px tap target instead of two small adjacent icons.\n */\nexport function NavBrandButton({ onClick, className, iconSrc = \"/icon.png\", ...rest }: NavBrandButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"] ?? \"Open navigation\"}\n className={cn(\n \"group flex h-11 items-center gap-2 rounded-full border border-border/40\",\n \"bg-background/70 pl-1.5 pr-3 backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {/* eslint-disable-next-line @next/next/no-img-element */}\n <img src={iconSrc} alt=\"Medialane\" width={30} height={30} className=\"h-[30px] w-[30px] shrink-0\" />\n <span className=\"flex flex-col gap-[5px]\" aria-hidden=\"true\">\n <span className=\"h-[1.5px] w-4 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n <span className=\"h-[1.5px] w-2.5 rounded-full bg-muted-foreground transition-all group-hover:w-4 group-hover:bg-foreground\" />\n </span>\n </button>\n );\n}\n\nexport interface NavIconButtonProps {\n onClick?: () => void;\n className?: string;\n \"aria-label\": string;\n /** Show a small brand-colored status dot (e.g. wallet connected). */\n indicator?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * Circular glass header button — the right-side counterpart to NavBrandButton\n * (wallet / account trigger).\n */\nexport function NavIconButton({ onClick, className, indicator, children, ...rest }: NavIconButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={rest[\"aria-label\"]}\n className={cn(\n \"relative flex h-11 w-11 items-center justify-center rounded-full border border-border/40\",\n \"bg-background/70 text-muted-foreground backdrop-blur-xl backdrop-saturate-150 shadow-sm\",\n \"transition-colors hover:bg-background/90 hover:text-foreground active:scale-[0.97]\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60\",\n className\n )}\n >\n {children}\n {indicator && (\n <span className=\"absolute right-[3px] top-[3px] h-2.5 w-2.5 rounded-full border-2 border-background bg-brand-blue\" />\n )}\n </button>\n );\n}\n\n// ── Account sheet ─────────────────────────────────────────────────────────────\n\nconst ML_ACCOUNT_OPEN = \"ml:account-open\";\nconst ML_ACCOUNT_CLOSE = \"ml:account-close\";\nconst ML_NAV_OPEN = \"ml:nav-open\";\nconst ML_NAV_CLOSE = \"ml:nav-close\";\n\nexport function useNavAccountSheet() {\n return {\n open: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_OPEN)),\n close: () => document.dispatchEvent(new CustomEvent(ML_ACCOUNT_CLOSE)),\n };\n}\n\nexport interface NavAccountSheetProps {\n /** The app's account/connect panel (Clerk, wallet connectors, …). */\n children: React.ReactNode;\n /** Optional heading above the panel. */\n title?: string;\n}\n\n/**\n * The wallet-side surface: a compact glass sheet anchored to the top-right\n * header button (bottom sheet on mobile). Content is app-owned — pass the same\n * account panel the command menu uses in its accountSlot.\n *\n * Opens via `useNavAccountSheet().open()`. Mutually exclusive with the command\n * menu: opening one closes the other, and the shared `ml:nav-close` event\n * (fired by `useNavCommandMenu().close()`) closes this sheet too, so account\n * panels behave identically in both hosts.\n */\nexport function NavAccountSheet({ children, title = \"Account\" }: NavAccountSheetProps) {\n const [open, setOpen] = React.useState(false);\n\n React.useEffect(() => {\n const onOpen = () => {\n document.dispatchEvent(new CustomEvent(ML_NAV_CLOSE));\n setOpen(true);\n };\n const onClose = () => setOpen(false);\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.addEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.addEventListener(ML_NAV_OPEN, onClose);\n document.addEventListener(ML_NAV_CLOSE, onClose);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(ML_ACCOUNT_OPEN, onOpen);\n document.removeEventListener(ML_ACCOUNT_CLOSE, onClose);\n document.removeEventListener(ML_NAV_OPEN, onClose);\n document.removeEventListener(ML_NAV_CLOSE, onClose);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, []);\n\n return (\n <AnimatePresence>\n {open && (\n <>\n <motion.div\n className=\"nav-canvas-overlay\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.15 }}\n onClick={() => setOpen(false)}\n />\n <motion.div\n className=\"fixed inset-x-3 bottom-3 z-[101] sm:inset-auto sm:right-4 sm:top-4 sm:w-[360px] lg:right-8\"\n initial={{ opacity: 0, y: 24 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 24 }}\n transition={{ duration: 0.18, ease: \"easeOut\" }}\n >\n <div className=\"overflow-hidden rounded-[20px] border border-border/40 bg-background/90 shadow-2xl backdrop-blur-2xl backdrop-saturate-150\">\n <div className=\"flex justify-center pt-2.5 sm:hidden\" aria-hidden=\"true\">\n <span className=\"h-1 w-9 rounded-full bg-muted-foreground/30\" />\n </div>\n <div className=\"flex items-center justify-between px-4 pb-1 pt-2 sm:pt-3\">\n <span className=\"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70\">\n {title}\n </span>\n <button\n onClick={() => setOpen(false)}\n className=\"rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted/50\"\n aria-label=\"Close\"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n <path d=\"M18 6 6 18M6 6l12 12\" />\n </svg>\n </button>\n </div>\n <div className=\"px-3 pb-4 pt-1 sm:pb-3\">{children}</div>\n </div>\n </motion.div>\n </>\n )}\n </AnimatePresence>\n );\n}\n"],"mappings":"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","names":[]}
|
package/dist/index.cjs
CHANGED
|
@@ -96,7 +96,6 @@ __export(index_exports, {
|
|
|
96
96
|
MedialaneCollectionCard: () => import_medialane_collection_card.MedialaneCollectionCard,
|
|
97
97
|
MedialaneIcon: () => import_brand_icon.MedialaneIcon,
|
|
98
98
|
MedialaneLogoFull: () => import_brand_logo.MedialaneLogoFull,
|
|
99
|
-
MedialaneMark: () => import_nav_shell.MedialaneMark,
|
|
100
99
|
MotionCard: () => import_motion_primitives.MotionCard,
|
|
101
100
|
NavAccountSheet: () => import_nav_shell.NavAccountSheet,
|
|
102
101
|
NavBrandButton: () => import_nav_shell.NavBrandButton,
|
|
@@ -302,7 +301,6 @@ var import_action_dialog = require("./components/action-dialog.js");
|
|
|
302
301
|
MedialaneCollectionCard,
|
|
303
302
|
MedialaneIcon,
|
|
304
303
|
MedialaneLogoFull,
|
|
305
|
-
MedialaneMark,
|
|
306
304
|
MotionCard,
|
|
307
305
|
NavAccountSheet,
|
|
308
306
|
NavBrandButton,
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// ── Utils ─────────────────────────────────────────────────────────────────────\nexport { cn } from \"./utils/cn.js\";\nexport { formatDisplayPrice, parsePriceDisplay } from \"./utils/format.js\";\nexport { shortenAddress } from \"./utils/address.js\";\nexport { ipfsToHttp } from \"./utils/ipfs.js\";\nexport { licenseSummary } from \"./utils/license-summary.js\";\n\n// ── Data (server-safe — no React, safe in Server Components) ──────────────────\nexport { IP_TYPE_DATA, IP_TYPE_DATA_MAP } from \"./data/ip-types.js\";\nexport type { IpTypeData } from \"./data/ip-types.js\";\nexport {\n IP_TYPES, LICENSE_TYPES, GEOGRAPHIC_SCOPES, AI_POLICIES,\n DERIVATIVES_OPTIONS, LICENSE_TRAIT_TYPES,\n} from \"./data/ip.js\";\nexport type { IPType, LicenseType } from \"./data/ip.js\";\nexport {\n IP_TEMPLATES, EMBED_PLATFORM_META, SOCIAL_PLATFORM_META, TEMPLATE_TRAIT_TYPES, DOC_UPLOAD,\n} from \"./data/ip-templates.js\";\nexport type { EmbedPlatform, SocialPlatform, TraitSuggestion, IPTemplate, DocUploadConfig } from \"./data/ip-templates.js\";\nexport { IPTypeDisplay } from \"./components/ip-type-display.js\";\nexport { AssetOverviewContent } from \"./components/asset-overview-content.js\";\nexport { AssetLicenseSummary } from \"./components/asset-license-summary.js\";\nexport { AssetMarketsTab } from \"./components/asset-markets-tab.js\";\nexport { ParentAttributionBanner } from \"./components/parent-attribution-banner.js\";\nexport type { ParentBannerProps } from \"./components/parent-attribution-banner.js\";\nexport { AssetMediaColumn, AssetHeaderBlock, AssetOwnerRow, buildEditionStats } from \"./components/asset-top-sections.js\";\nexport type { AssetOwnerRowProps } from \"./components/asset-top-sections.js\";\nexport { AssetCollectionBar } from \"./components/asset-collection-bar.js\";\nexport type { AssetCollectionBarProps, AssetCollectionBarSibling } from \"./components/asset-collection-bar.js\";\nexport { AssetUtilityIcons } from \"./components/asset-utility-icons.js\";\nexport type { AssetUtilityIconsProps } from \"./components/asset-utility-icons.js\";\nexport { AssetMarketplacePanel } from \"./components/asset-marketplace-panel.js\";\nexport type { AssetMarketplacePanelProps, ApiOrderLike } from \"./components/asset-marketplace-panel.js\";\nexport { BRAND } from \"./data/brand.js\";\n\n// ── Components (client-only — all have \"use client\") ─────────────────────────\nexport { CurrencyIcon, CurrencyAmount } from \"./components/currency-icon.js\";\nexport type { CurrencyIconProps, CurrencyAmountProps } from \"./components/currency-icon.js\";\n\nexport { IpTypeBadge, IP_TYPE_CONFIG, IP_TYPE_MAP } from \"./components/ip-type-badge.js\";\nexport type { IpTypeBadgeProps, IpTypeConfig } from \"./components/ip-type-badge.js\";\n\nexport { AddressDisplay } from \"./components/address-display.js\";\nexport type { AddressDisplayProps } from \"./components/address-display.js\";\n\nexport { MedialaneIcon } from \"./components/brand-icon.js\";\nexport type { MedialaneIconProps } from \"./components/brand-icon.js\";\nexport { MedialaneLogoFull } from \"./components/brand-logo.js\";\nexport type { MedialaneLogoFullProps } from \"./components/brand-logo.js\";\n\n// ── v0.2 additions ────────────────────────────────────────────────────────────\nexport { MotionCard, FadeIn, Stagger, StaggerItem, KineticWords, SPRING, EASE_OUT } from \"./components/motion-primitives.js\";\nexport { PageContainer } from \"./components/page-container.js\";\nexport type { PageContainerProps } from \"./components/page-container.js\";\nexport { ScrollSection } from \"./components/scroll-section.js\";\nexport type { ScrollSectionProps } from \"./components/scroll-section.js\";\nexport { ShareButton } from \"./components/share-button.js\";\nexport type { ShareButtonProps } from \"./components/share-button.js\";\nexport { CollectionCard, CollectionCardSkeleton } from \"./components/collection-card.js\";\nexport type { CollectionCardProps } from \"./components/collection-card.js\";\nexport { TokenCard, TokenCardSkeleton } from \"./components/token-card.js\";\nexport type { TokenCardProps, RarityTier } from \"./components/token-card.js\";\nexport { AssetCard, AssetCardSkeleton } from \"./components/asset-card.js\";\nexport type { AssetCardProps, AssetCardPrice } from \"./components/asset-card.js\";\n// ── Coin discovery (chain-agnostic; price/data/href injected by the app) ─────\nexport {\n coinKind, formatCoinPrice, formatFdv,\n type CoinKind, type CoinCollectionLike, type CoinPriceLike,\n} from \"./data/coins.js\";\nexport { CoinCard, CoinRow, CoinCardSkeleton, type UseCoinPrice, type CoinTileProps } from \"./components/coin-card.js\";\nexport {\n CoinsExplorer,\n type CoinsExplorerProps, type CoinFilter, type CoinSort, type UseCoins,\n} from \"./components/coins-explorer.js\";\n\n// ── v0.3 additions ────────────────────────────────────────────────────────────\nexport { timeAgo, timeUntil } from \"./utils/time.js\";\nexport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"./data/activity.js\";\nexport type { ActivityTypeConfig } from \"./data/activity.js\";\nexport { HeroSlider, HeroSliderSkeleton } from \"./components/hero-slider.js\";\nexport type { HeroSliderProps } from \"./components/hero-slider.js\";\nexport { ActivityTicker } from \"./components/activity-ticker.js\";\nexport type { ActivityTickerProps } from \"./components/activity-ticker.js\";\nexport { ListingCard, ListingCardSkeleton } from \"./components/listing-card.js\";\nexport type { ListingCardProps } from \"./components/listing-card.js\";\nexport { ActivityRow } from \"./components/activity-row.js\";\nexport type { ActivityRowProps } from \"./components/activity-row.js\";\nexport { ActivityFeedShell } from \"./components/activity-feed-shell.js\";\nexport type { ActivityFeedShellProps } from \"./components/activity-feed-shell.js\";\nexport { CtaCardGrid } from \"./components/cta-card-grid.js\";\nexport type { CtaCardGridProps, CtaCardItem } from \"./components/cta-card-grid.js\";\n\n// ── v0.3.2 additions ─────────────────────────────────────────────────────────\nexport { DiscoverHero } from \"./components/discover-hero.js\";\nexport type { DiscoverHeroProps } from \"./components/discover-hero.js\";\nexport { FeaturedCarousel, FeaturedCarouselSkeleton } from \"./components/featured-carousel.js\";\nexport type { FeaturedCarouselProps } from \"./components/featured-carousel.js\";\nexport { DiscoverCollectionsStrip } from \"./components/discover-collections-strip.js\";\nexport type { DiscoverCollectionsStripProps } from \"./components/discover-collections-strip.js\";\nexport { DiscoverCreatorsStrip } from \"./components/discover-creators-strip.js\";\nexport type { DiscoverCreatorsStripProps } from \"./components/discover-creators-strip.js\";\nexport { DiscoverFeedSection, DiscoverActivityStrip } from \"./components/discover-feed-section.js\";\nexport type { DiscoverFeedSectionProps, DiscoverActivityStripProps } from \"./components/discover-feed-section.js\";\nexport { ActivityCard, ActivityCardSkeleton, ACTIVITY_MESSAGES } from \"./components/activity-card.js\";\nexport type { ActivityCardProps } from \"./components/activity-card.js\";\n\n// ── Launchpad (grouped sections — single page-UI source since 0.8.0) ─────────\nexport { LaunchpadGroupedSections, LaunchpadServiceCard, SERVICE_HUES, useLaunchpadFilter } from \"./components/launchpad-services.js\";\nexport { LaunchpadFilterBar } from \"./components/launchpad-filter-bar.js\";\nexport type { LaunchpadFilterBarProps } from \"./components/launchpad-filter-bar.js\";\nexport { LaunchpadStrip } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadStripProps } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadGroupedSectionsProps, LaunchpadServiceCardProps, ServiceOverride, ServiceOverrides } from \"./components/launchpad-services.js\";\nexport { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS } from \"./data/launchpad-services.js\";\nexport type { ServiceDefinition, ServiceStatus, ServiceCategory, ServiceGroup, ServiceGroupDefinition } from \"./data/launchpad-services.js\";\n\n// ── v0.5.0 additions ─────────────────────────────────────────────────────────\nexport { NavCommandMenu, useNavCommandMenu } from \"./components/nav-command-menu.js\";\nexport type { NavCommand, NavCommandGroup, NavCommandMenuProps } from \"./components/nav-command-menu.js\";\n\n// ── v0.62.0 — nav shell (brand mark trigger + header buttons + account sheet) ─\nexport {\n MedialaneMark,\n NavBrandButton,\n NavIconButton,\n NavAccountSheet,\n useNavAccountSheet,\n} from \"./components/nav-shell.js\";\nexport type {\n MedialaneMarkProps,\n NavBrandButtonProps,\n NavIconButtonProps,\n NavAccountSheetProps,\n} from \"./components/nav-shell.js\";\n\n// ── v0.59.0 — portfolio shell (two-level nav + header + overview) ────────────\nexport { PortfolioNav } from \"./components/portfolio-nav.js\";\nexport type {\n PortfolioNavProps,\n PortfolioNavSection,\n PortfolioNavChild,\n PortfolioBadgeVariant,\n} from \"./components/portfolio-nav.js\";\nexport { PortfolioHeader } from \"./components/portfolio-header.js\";\nexport type {\n PortfolioHeaderProps,\n PortfolioHeaderScore,\n} from \"./components/portfolio-header.js\";\nexport { PortfolioOverview } from \"./components/portfolio-overview.js\";\nexport type {\n PortfolioOverviewProps,\n PortfolioOverviewStat,\n PortfolioAttentionItem,\n PortfolioQuickAction,\n} from \"./components/portfolio-overview.js\";\nexport { derivePortfolioCounts } from \"./utils/portfolio-counts.js\";\nexport type { PortfolioCounts, CountableOrder } from \"./utils/portfolio-counts.js\";\n\n// ── v0.22.0 additions — launchpad/claim form template primitives ─────────────\n// Pure-presentation header + rail shared by every launchpad/claim form. The\n// app supplies its own gate, back button, and form logic. Requires the\n// `.btn-border-animated` class (in @medialane/ui/styles) for the form shell.\nexport { ServiceHeader } from \"./components/service-header.js\";\nexport type { ServiceHeaderProps } from \"./components/service-header.js\";\nexport { ClaimRail } from \"./components/claim-rail.js\";\nexport type { ClaimRailProps } from \"./components/claim-rail.js\";\n\n// ── v0.23.0 additions — slot-based form shell ────────────────────────────────\n// Pure layout (back slot + header + animated-border compartment + 8/4 bento).\n// No auth/router — the app injects its own gate (around children) + back button.\nexport { ServiceFormShell } from \"./components/service-form-shell.js\";\nexport type { ServiceFormShellProps } from \"./components/service-form-shell.js\";\nexport { StepNav } from \"./components/step-nav.js\";\nexport type { StepNavProps, StepNavStep } from \"./components/step-nav.js\";\n\n// Rewards score kit (v0.36.0)\nexport { LevelBadge } from \"./components/rewards/level-badge.js\";\nexport type { LevelBadgeProps } from \"./components/rewards/level-badge.js\";\nexport { XpProgress } from \"./components/rewards/xp-progress.js\";\nexport type { XpProgressProps } from \"./components/rewards/xp-progress.js\";\nexport { BadgeShelf } from \"./components/rewards/badge-shelf.js\";\nexport type { BadgeShelfProps, BadgeShelfBadge } from \"./components/rewards/badge-shelf.js\";\nexport { ScoreSummaryCard } from \"./components/rewards/score-summary-card.js\";\nexport type { ScoreSummaryCardProps } from \"./components/rewards/score-summary-card.js\";\nexport { LeaderboardTable, LeaderboardWidget } from \"./components/rewards/leaderboard-table.js\";\nexport type { LeaderboardTableProps, LeaderboardWidgetProps, LeaderboardEntryLike } from \"./components/rewards/leaderboard-table.js\";\nexport { LevelLadder } from \"./components/rewards/level-ladder.js\";\nexport type { LevelLadderProps } from \"./components/rewards/level-ladder.js\";\nexport { XpToastContent } from \"./components/rewards/xp-toast-content.js\";\nexport type { XpToastContentProps } from \"./components/rewards/xp-toast-content.js\";\n\n// ── v0.37.0 additions — infinite-scroll trigger ──────────────────────────────\nexport { LoadMoreSentinel } from \"./components/load-more-sentinel.js\";\nexport type { LoadMoreSentinelProps } from \"./components/load-more-sentinel.js\";\n\n// ── v0.47.0 additions — community rewards section ────────────────────────────\nexport { CommunityRewardsSection } from \"./components/community-rewards-section.js\";\nexport type { CommunityRewardsSectionProps, CommunityRewardsEntry } from \"./components/community-rewards-section.js\";\n\n// ── Design system primitives — action-focus pattern, tokens, data display ────\nexport { ActionButton } from \"./components/action-button.js\";\nexport type { ActionButtonProps, ActionKey, ToneKey } from \"./components/action-button.js\";\n\nexport { CoinLaunchPreview } from \"./components/coin-launch-preview.js\";\nexport type { CoinPreviewData } from \"./components/coin-launch-preview.js\";\nexport { MedialaneCollectionCard } from \"./components/medialane-collection-card.js\";\nexport type { MedialaneCollectionCardProps } from \"./components/medialane-collection-card.js\";\nexport { TokenGlyph, TokenAmount } from \"./components/token-glyph.js\";\nexport type { TokenGlyphProps, TokenAmountProps, TokenSymbol } from \"./components/token-glyph.js\";\n\nexport { StatTile, StatPill } from \"./components/stat-tile.js\";\nexport type { StatTileProps, StatPillProps } from \"./components/stat-tile.js\";\n\nexport { ActionDialog } from \"./components/action-dialog.js\";\nexport type { ActionDialogProps } from \"./components/action-dialog.js\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gBAAmB;AACnB,oBAAsD;AACtD,qBAA+B;AAC/B,kBAA2B;AAC3B,6BAA+B;AAG/B,sBAA+C;AAE/C,gBAGO;AAEP,0BAEO;AAEP,6BAA8B;AAC9B,oCAAqC;AACrC,mCAAoC;AACpC,+BAAgC;AAChC,uCAAwC;AAExC,gCAAqF;AAErF,kCAAmC;AAEnC,iCAAkC;AAElC,qCAAsC;AAEtC,mBAAsB;AAGtB,2BAA6C;AAG7C,2BAAyD;AAGzD,6BAA+B;AAG/B,wBAA8B;AAE9B,wBAAkC;AAIlC,+BAAyF;AACzF,4BAA8B;AAE9B,4BAA8B;AAE9B,0BAA4B;AAE5B,6BAAuD;AAEvD,wBAA6C;AAE7C,wBAA6C;AAG7C,mBAGO;AACP,uBAA2F;AAC3F,4BAGO;AAGP,kBAAmC;AACnC,sBAAmD;AAEnD,yBAA+C;AAE/C,6BAA+B;AAE/B,0BAAiD;AAEjD,0BAA4B;AAE5B,iCAAkC;AAElC,2BAA4B;AAI5B,2BAA6B;AAE7B,+BAA2D;AAE3D,wCAAyC;AAEzC,qCAAsC;AAEtC,mCAA2D;AAE3D,2BAAsE;AAItE,gCAAiG;AACjG,kCAAmC;AAEnC,6BAA+B;AAG/B,IAAAA,6BAAwE;AAIxE,8BAAkD;AAIlD,uBAMO;AASP,2BAA6B;AAO7B,8BAAgC;AAKhC,gCAAkC;AAOlC,8BAAsC;AAOtC,4BAA8B;AAE9B,wBAA0B;AAM1B,gCAAiC;AAEjC,sBAAwB;AAIxB,yBAA2B;AAE3B,yBAA2B;AAE3B,yBAA2B;AAE3B,gCAAiC;AAEjC,+BAAoD;AAEpD,0BAA4B;AAE5B,8BAA+B;AAI/B,gCAAiC;AAIjC,uCAAwC;AAIxC,2BAA6B;AAG7B,iCAAkC;AAElC,uCAAwC;AAExC,yBAAwC;AAGxC,uBAAmC;AAGnC,2BAA6B;","names":["import_launchpad_services"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// ── Utils ─────────────────────────────────────────────────────────────────────\nexport { cn } from \"./utils/cn.js\";\nexport { formatDisplayPrice, parsePriceDisplay } from \"./utils/format.js\";\nexport { shortenAddress } from \"./utils/address.js\";\nexport { ipfsToHttp } from \"./utils/ipfs.js\";\nexport { licenseSummary } from \"./utils/license-summary.js\";\n\n// ── Data (server-safe — no React, safe in Server Components) ──────────────────\nexport { IP_TYPE_DATA, IP_TYPE_DATA_MAP } from \"./data/ip-types.js\";\nexport type { IpTypeData } from \"./data/ip-types.js\";\nexport {\n IP_TYPES, LICENSE_TYPES, GEOGRAPHIC_SCOPES, AI_POLICIES,\n DERIVATIVES_OPTIONS, LICENSE_TRAIT_TYPES,\n} from \"./data/ip.js\";\nexport type { IPType, LicenseType } from \"./data/ip.js\";\nexport {\n IP_TEMPLATES, EMBED_PLATFORM_META, SOCIAL_PLATFORM_META, TEMPLATE_TRAIT_TYPES, DOC_UPLOAD,\n} from \"./data/ip-templates.js\";\nexport type { EmbedPlatform, SocialPlatform, TraitSuggestion, IPTemplate, DocUploadConfig } from \"./data/ip-templates.js\";\nexport { IPTypeDisplay } from \"./components/ip-type-display.js\";\nexport { AssetOverviewContent } from \"./components/asset-overview-content.js\";\nexport { AssetLicenseSummary } from \"./components/asset-license-summary.js\";\nexport { AssetMarketsTab } from \"./components/asset-markets-tab.js\";\nexport { ParentAttributionBanner } from \"./components/parent-attribution-banner.js\";\nexport type { ParentBannerProps } from \"./components/parent-attribution-banner.js\";\nexport { AssetMediaColumn, AssetHeaderBlock, AssetOwnerRow, buildEditionStats } from \"./components/asset-top-sections.js\";\nexport type { AssetOwnerRowProps } from \"./components/asset-top-sections.js\";\nexport { AssetCollectionBar } from \"./components/asset-collection-bar.js\";\nexport type { AssetCollectionBarProps, AssetCollectionBarSibling } from \"./components/asset-collection-bar.js\";\nexport { AssetUtilityIcons } from \"./components/asset-utility-icons.js\";\nexport type { AssetUtilityIconsProps } from \"./components/asset-utility-icons.js\";\nexport { AssetMarketplacePanel } from \"./components/asset-marketplace-panel.js\";\nexport type { AssetMarketplacePanelProps, ApiOrderLike } from \"./components/asset-marketplace-panel.js\";\nexport { BRAND } from \"./data/brand.js\";\n\n// ── Components (client-only — all have \"use client\") ─────────────────────────\nexport { CurrencyIcon, CurrencyAmount } from \"./components/currency-icon.js\";\nexport type { CurrencyIconProps, CurrencyAmountProps } from \"./components/currency-icon.js\";\n\nexport { IpTypeBadge, IP_TYPE_CONFIG, IP_TYPE_MAP } from \"./components/ip-type-badge.js\";\nexport type { IpTypeBadgeProps, IpTypeConfig } from \"./components/ip-type-badge.js\";\n\nexport { AddressDisplay } from \"./components/address-display.js\";\nexport type { AddressDisplayProps } from \"./components/address-display.js\";\n\nexport { MedialaneIcon } from \"./components/brand-icon.js\";\nexport type { MedialaneIconProps } from \"./components/brand-icon.js\";\nexport { MedialaneLogoFull } from \"./components/brand-logo.js\";\nexport type { MedialaneLogoFullProps } from \"./components/brand-logo.js\";\n\n// ── v0.2 additions ────────────────────────────────────────────────────────────\nexport { MotionCard, FadeIn, Stagger, StaggerItem, KineticWords, SPRING, EASE_OUT } from \"./components/motion-primitives.js\";\nexport { PageContainer } from \"./components/page-container.js\";\nexport type { PageContainerProps } from \"./components/page-container.js\";\nexport { ScrollSection } from \"./components/scroll-section.js\";\nexport type { ScrollSectionProps } from \"./components/scroll-section.js\";\nexport { ShareButton } from \"./components/share-button.js\";\nexport type { ShareButtonProps } from \"./components/share-button.js\";\nexport { CollectionCard, CollectionCardSkeleton } from \"./components/collection-card.js\";\nexport type { CollectionCardProps } from \"./components/collection-card.js\";\nexport { TokenCard, TokenCardSkeleton } from \"./components/token-card.js\";\nexport type { TokenCardProps, RarityTier } from \"./components/token-card.js\";\nexport { AssetCard, AssetCardSkeleton } from \"./components/asset-card.js\";\nexport type { AssetCardProps, AssetCardPrice } from \"./components/asset-card.js\";\n// ── Coin discovery (chain-agnostic; price/data/href injected by the app) ─────\nexport {\n coinKind, formatCoinPrice, formatFdv,\n type CoinKind, type CoinCollectionLike, type CoinPriceLike,\n} from \"./data/coins.js\";\nexport { CoinCard, CoinRow, CoinCardSkeleton, type UseCoinPrice, type CoinTileProps } from \"./components/coin-card.js\";\nexport {\n CoinsExplorer,\n type CoinsExplorerProps, type CoinFilter, type CoinSort, type UseCoins,\n} from \"./components/coins-explorer.js\";\n\n// ── v0.3 additions ────────────────────────────────────────────────────────────\nexport { timeAgo, timeUntil } from \"./utils/time.js\";\nexport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"./data/activity.js\";\nexport type { ActivityTypeConfig } from \"./data/activity.js\";\nexport { HeroSlider, HeroSliderSkeleton } from \"./components/hero-slider.js\";\nexport type { HeroSliderProps } from \"./components/hero-slider.js\";\nexport { ActivityTicker } from \"./components/activity-ticker.js\";\nexport type { ActivityTickerProps } from \"./components/activity-ticker.js\";\nexport { ListingCard, ListingCardSkeleton } from \"./components/listing-card.js\";\nexport type { ListingCardProps } from \"./components/listing-card.js\";\nexport { ActivityRow } from \"./components/activity-row.js\";\nexport type { ActivityRowProps } from \"./components/activity-row.js\";\nexport { ActivityFeedShell } from \"./components/activity-feed-shell.js\";\nexport type { ActivityFeedShellProps } from \"./components/activity-feed-shell.js\";\nexport { CtaCardGrid } from \"./components/cta-card-grid.js\";\nexport type { CtaCardGridProps, CtaCardItem } from \"./components/cta-card-grid.js\";\n\n// ── v0.3.2 additions ─────────────────────────────────────────────────────────\nexport { DiscoverHero } from \"./components/discover-hero.js\";\nexport type { DiscoverHeroProps } from \"./components/discover-hero.js\";\nexport { FeaturedCarousel, FeaturedCarouselSkeleton } from \"./components/featured-carousel.js\";\nexport type { FeaturedCarouselProps } from \"./components/featured-carousel.js\";\nexport { DiscoverCollectionsStrip } from \"./components/discover-collections-strip.js\";\nexport type { DiscoverCollectionsStripProps } from \"./components/discover-collections-strip.js\";\nexport { DiscoverCreatorsStrip } from \"./components/discover-creators-strip.js\";\nexport type { DiscoverCreatorsStripProps } from \"./components/discover-creators-strip.js\";\nexport { DiscoverFeedSection, DiscoverActivityStrip } from \"./components/discover-feed-section.js\";\nexport type { DiscoverFeedSectionProps, DiscoverActivityStripProps } from \"./components/discover-feed-section.js\";\nexport { ActivityCard, ActivityCardSkeleton, ACTIVITY_MESSAGES } from \"./components/activity-card.js\";\nexport type { ActivityCardProps } from \"./components/activity-card.js\";\n\n// ── Launchpad (grouped sections — single page-UI source since 0.8.0) ─────────\nexport { LaunchpadGroupedSections, LaunchpadServiceCard, SERVICE_HUES, useLaunchpadFilter } from \"./components/launchpad-services.js\";\nexport { LaunchpadFilterBar } from \"./components/launchpad-filter-bar.js\";\nexport type { LaunchpadFilterBarProps } from \"./components/launchpad-filter-bar.js\";\nexport { LaunchpadStrip } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadStripProps } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadGroupedSectionsProps, LaunchpadServiceCardProps, ServiceOverride, ServiceOverrides } from \"./components/launchpad-services.js\";\nexport { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS } from \"./data/launchpad-services.js\";\nexport type { ServiceDefinition, ServiceStatus, ServiceCategory, ServiceGroup, ServiceGroupDefinition } from \"./data/launchpad-services.js\";\n\n// ── v0.5.0 additions ─────────────────────────────────────────────────────────\nexport { NavCommandMenu, useNavCommandMenu } from \"./components/nav-command-menu.js\";\nexport type { NavCommand, NavCommandGroup, NavCommandMenuProps } from \"./components/nav-command-menu.js\";\n\n// ── v0.62.0 — nav shell (brand trigger + header buttons + account sheet) ─────\nexport {\n NavBrandButton,\n NavIconButton,\n NavAccountSheet,\n useNavAccountSheet,\n} from \"./components/nav-shell.js\";\nexport type {\n NavBrandButtonProps,\n NavIconButtonProps,\n NavAccountSheetProps,\n} from \"./components/nav-shell.js\";\n\n// ── v0.59.0 — portfolio shell (two-level nav + header + overview) ────────────\nexport { PortfolioNav } from \"./components/portfolio-nav.js\";\nexport type {\n PortfolioNavProps,\n PortfolioNavSection,\n PortfolioNavChild,\n PortfolioBadgeVariant,\n} from \"./components/portfolio-nav.js\";\nexport { PortfolioHeader } from \"./components/portfolio-header.js\";\nexport type {\n PortfolioHeaderProps,\n PortfolioHeaderScore,\n} from \"./components/portfolio-header.js\";\nexport { PortfolioOverview } from \"./components/portfolio-overview.js\";\nexport type {\n PortfolioOverviewProps,\n PortfolioOverviewStat,\n PortfolioAttentionItem,\n PortfolioQuickAction,\n} from \"./components/portfolio-overview.js\";\nexport { derivePortfolioCounts } from \"./utils/portfolio-counts.js\";\nexport type { PortfolioCounts, CountableOrder } from \"./utils/portfolio-counts.js\";\n\n// ── v0.22.0 additions — launchpad/claim form template primitives ─────────────\n// Pure-presentation header + rail shared by every launchpad/claim form. The\n// app supplies its own gate, back button, and form logic. Requires the\n// `.btn-border-animated` class (in @medialane/ui/styles) for the form shell.\nexport { ServiceHeader } from \"./components/service-header.js\";\nexport type { ServiceHeaderProps } from \"./components/service-header.js\";\nexport { ClaimRail } from \"./components/claim-rail.js\";\nexport type { ClaimRailProps } from \"./components/claim-rail.js\";\n\n// ── v0.23.0 additions — slot-based form shell ────────────────────────────────\n// Pure layout (back slot + header + animated-border compartment + 8/4 bento).\n// No auth/router — the app injects its own gate (around children) + back button.\nexport { ServiceFormShell } from \"./components/service-form-shell.js\";\nexport type { ServiceFormShellProps } from \"./components/service-form-shell.js\";\nexport { StepNav } from \"./components/step-nav.js\";\nexport type { StepNavProps, StepNavStep } from \"./components/step-nav.js\";\n\n// Rewards score kit (v0.36.0)\nexport { LevelBadge } from \"./components/rewards/level-badge.js\";\nexport type { LevelBadgeProps } from \"./components/rewards/level-badge.js\";\nexport { XpProgress } from \"./components/rewards/xp-progress.js\";\nexport type { XpProgressProps } from \"./components/rewards/xp-progress.js\";\nexport { BadgeShelf } from \"./components/rewards/badge-shelf.js\";\nexport type { BadgeShelfProps, BadgeShelfBadge } from \"./components/rewards/badge-shelf.js\";\nexport { ScoreSummaryCard } from \"./components/rewards/score-summary-card.js\";\nexport type { ScoreSummaryCardProps } from \"./components/rewards/score-summary-card.js\";\nexport { LeaderboardTable, LeaderboardWidget } from \"./components/rewards/leaderboard-table.js\";\nexport type { LeaderboardTableProps, LeaderboardWidgetProps, LeaderboardEntryLike } from \"./components/rewards/leaderboard-table.js\";\nexport { LevelLadder } from \"./components/rewards/level-ladder.js\";\nexport type { LevelLadderProps } from \"./components/rewards/level-ladder.js\";\nexport { XpToastContent } from \"./components/rewards/xp-toast-content.js\";\nexport type { XpToastContentProps } from \"./components/rewards/xp-toast-content.js\";\n\n// ── v0.37.0 additions — infinite-scroll trigger ──────────────────────────────\nexport { LoadMoreSentinel } from \"./components/load-more-sentinel.js\";\nexport type { LoadMoreSentinelProps } from \"./components/load-more-sentinel.js\";\n\n// ── v0.47.0 additions — community rewards section ────────────────────────────\nexport { CommunityRewardsSection } from \"./components/community-rewards-section.js\";\nexport type { CommunityRewardsSectionProps, CommunityRewardsEntry } from \"./components/community-rewards-section.js\";\n\n// ── Design system primitives — action-focus pattern, tokens, data display ────\nexport { ActionButton } from \"./components/action-button.js\";\nexport type { ActionButtonProps, ActionKey, ToneKey } from \"./components/action-button.js\";\n\nexport { CoinLaunchPreview } from \"./components/coin-launch-preview.js\";\nexport type { CoinPreviewData } from \"./components/coin-launch-preview.js\";\nexport { MedialaneCollectionCard } from \"./components/medialane-collection-card.js\";\nexport type { MedialaneCollectionCardProps } from \"./components/medialane-collection-card.js\";\nexport { TokenGlyph, TokenAmount } from \"./components/token-glyph.js\";\nexport type { TokenGlyphProps, TokenAmountProps, TokenSymbol } from \"./components/token-glyph.js\";\n\nexport { StatTile, StatPill } from \"./components/stat-tile.js\";\nexport type { StatTileProps, StatPillProps } from \"./components/stat-tile.js\";\n\nexport { ActionDialog } from \"./components/action-dialog.js\";\nexport type { ActionDialogProps } from \"./components/action-dialog.js\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gBAAmB;AACnB,oBAAsD;AACtD,qBAA+B;AAC/B,kBAA2B;AAC3B,6BAA+B;AAG/B,sBAA+C;AAE/C,gBAGO;AAEP,0BAEO;AAEP,6BAA8B;AAC9B,oCAAqC;AACrC,mCAAoC;AACpC,+BAAgC;AAChC,uCAAwC;AAExC,gCAAqF;AAErF,kCAAmC;AAEnC,iCAAkC;AAElC,qCAAsC;AAEtC,mBAAsB;AAGtB,2BAA6C;AAG7C,2BAAyD;AAGzD,6BAA+B;AAG/B,wBAA8B;AAE9B,wBAAkC;AAIlC,+BAAyF;AACzF,4BAA8B;AAE9B,4BAA8B;AAE9B,0BAA4B;AAE5B,6BAAuD;AAEvD,wBAA6C;AAE7C,wBAA6C;AAG7C,mBAGO;AACP,uBAA2F;AAC3F,4BAGO;AAGP,kBAAmC;AACnC,sBAAmD;AAEnD,yBAA+C;AAE/C,6BAA+B;AAE/B,0BAAiD;AAEjD,0BAA4B;AAE5B,iCAAkC;AAElC,2BAA4B;AAI5B,2BAA6B;AAE7B,+BAA2D;AAE3D,wCAAyC;AAEzC,qCAAsC;AAEtC,mCAA2D;AAE3D,2BAAsE;AAItE,gCAAiG;AACjG,kCAAmC;AAEnC,6BAA+B;AAG/B,IAAAA,6BAAwE;AAIxE,8BAAkD;AAIlD,uBAKO;AAQP,2BAA6B;AAO7B,8BAAgC;AAKhC,gCAAkC;AAOlC,8BAAsC;AAOtC,4BAA8B;AAE9B,wBAA0B;AAM1B,gCAAiC;AAEjC,sBAAwB;AAIxB,yBAA2B;AAE3B,yBAA2B;AAE3B,yBAA2B;AAE3B,gCAAiC;AAEjC,+BAAoD;AAEpD,0BAA4B;AAE5B,8BAA+B;AAI/B,gCAAiC;AAIjC,uCAAwC;AAIxC,2BAA6B;AAG7B,iCAAkC;AAElC,uCAAwC;AAExC,yBAAwC;AAGxC,uBAAmC;AAGnC,2BAA6B;","names":["import_launchpad_services"]}
|
package/dist/index.d.cts
CHANGED
|
@@ -50,7 +50,7 @@ export { LaunchpadFilterBar, LaunchpadFilterBarProps } from './components/launch
|
|
|
50
50
|
export { LaunchpadStrip, LaunchpadStripProps } from './components/launchpad-strip.cjs';
|
|
51
51
|
export { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS, ServiceCategory, ServiceDefinition, ServiceGroup, ServiceGroupDefinition, ServiceStatus } from './data/launchpad-services.cjs';
|
|
52
52
|
export { NavCommand, NavCommandGroup, NavCommandMenu, NavCommandMenuProps, useNavCommandMenu } from './components/nav-command-menu.cjs';
|
|
53
|
-
export {
|
|
53
|
+
export { NavAccountSheet, NavAccountSheetProps, NavBrandButton, NavBrandButtonProps, NavIconButton, NavIconButtonProps, useNavAccountSheet } from './components/nav-shell.cjs';
|
|
54
54
|
export { PortfolioBadgeVariant, PortfolioNav, PortfolioNavChild, PortfolioNavProps, PortfolioNavSection } from './components/portfolio-nav.cjs';
|
|
55
55
|
export { PortfolioHeader, PortfolioHeaderProps, PortfolioHeaderScore } from './components/portfolio-header.cjs';
|
|
56
56
|
export { PortfolioAttentionItem, PortfolioOverview, PortfolioOverviewProps, PortfolioOverviewStat, PortfolioQuickAction } from './components/portfolio-overview.cjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -50,7 +50,7 @@ export { LaunchpadFilterBar, LaunchpadFilterBarProps } from './components/launch
|
|
|
50
50
|
export { LaunchpadStrip, LaunchpadStripProps } from './components/launchpad-strip.js';
|
|
51
51
|
export { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS, ServiceCategory, ServiceDefinition, ServiceGroup, ServiceGroupDefinition, ServiceStatus } from './data/launchpad-services.js';
|
|
52
52
|
export { NavCommand, NavCommandGroup, NavCommandMenu, NavCommandMenuProps, useNavCommandMenu } from './components/nav-command-menu.js';
|
|
53
|
-
export {
|
|
53
|
+
export { NavAccountSheet, NavAccountSheetProps, NavBrandButton, NavBrandButtonProps, NavIconButton, NavIconButtonProps, useNavAccountSheet } from './components/nav-shell.js';
|
|
54
54
|
export { PortfolioBadgeVariant, PortfolioNav, PortfolioNavChild, PortfolioNavProps, PortfolioNavSection } from './components/portfolio-nav.js';
|
|
55
55
|
export { PortfolioHeader, PortfolioHeaderProps, PortfolioHeaderScore } from './components/portfolio-header.js';
|
|
56
56
|
export { PortfolioAttentionItem, PortfolioOverview, PortfolioOverviewProps, PortfolioOverviewStat, PortfolioQuickAction } from './components/portfolio-overview.js';
|
package/dist/index.js
CHANGED
|
@@ -70,7 +70,6 @@ import { LaunchpadStrip } from "./components/launchpad-strip.js";
|
|
|
70
70
|
import { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS } from "./data/launchpad-services.js";
|
|
71
71
|
import { NavCommandMenu, useNavCommandMenu } from "./components/nav-command-menu.js";
|
|
72
72
|
import {
|
|
73
|
-
MedialaneMark,
|
|
74
73
|
NavBrandButton,
|
|
75
74
|
NavIconButton,
|
|
76
75
|
NavAccountSheet,
|
|
@@ -178,7 +177,6 @@ export {
|
|
|
178
177
|
MedialaneCollectionCard,
|
|
179
178
|
MedialaneIcon,
|
|
180
179
|
MedialaneLogoFull,
|
|
181
|
-
MedialaneMark,
|
|
182
180
|
MotionCard,
|
|
183
181
|
NavAccountSheet,
|
|
184
182
|
NavBrandButton,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// ── Utils ─────────────────────────────────────────────────────────────────────\nexport { cn } from \"./utils/cn.js\";\nexport { formatDisplayPrice, parsePriceDisplay } from \"./utils/format.js\";\nexport { shortenAddress } from \"./utils/address.js\";\nexport { ipfsToHttp } from \"./utils/ipfs.js\";\nexport { licenseSummary } from \"./utils/license-summary.js\";\n\n// ── Data (server-safe — no React, safe in Server Components) ──────────────────\nexport { IP_TYPE_DATA, IP_TYPE_DATA_MAP } from \"./data/ip-types.js\";\nexport type { IpTypeData } from \"./data/ip-types.js\";\nexport {\n IP_TYPES, LICENSE_TYPES, GEOGRAPHIC_SCOPES, AI_POLICIES,\n DERIVATIVES_OPTIONS, LICENSE_TRAIT_TYPES,\n} from \"./data/ip.js\";\nexport type { IPType, LicenseType } from \"./data/ip.js\";\nexport {\n IP_TEMPLATES, EMBED_PLATFORM_META, SOCIAL_PLATFORM_META, TEMPLATE_TRAIT_TYPES, DOC_UPLOAD,\n} from \"./data/ip-templates.js\";\nexport type { EmbedPlatform, SocialPlatform, TraitSuggestion, IPTemplate, DocUploadConfig } from \"./data/ip-templates.js\";\nexport { IPTypeDisplay } from \"./components/ip-type-display.js\";\nexport { AssetOverviewContent } from \"./components/asset-overview-content.js\";\nexport { AssetLicenseSummary } from \"./components/asset-license-summary.js\";\nexport { AssetMarketsTab } from \"./components/asset-markets-tab.js\";\nexport { ParentAttributionBanner } from \"./components/parent-attribution-banner.js\";\nexport type { ParentBannerProps } from \"./components/parent-attribution-banner.js\";\nexport { AssetMediaColumn, AssetHeaderBlock, AssetOwnerRow, buildEditionStats } from \"./components/asset-top-sections.js\";\nexport type { AssetOwnerRowProps } from \"./components/asset-top-sections.js\";\nexport { AssetCollectionBar } from \"./components/asset-collection-bar.js\";\nexport type { AssetCollectionBarProps, AssetCollectionBarSibling } from \"./components/asset-collection-bar.js\";\nexport { AssetUtilityIcons } from \"./components/asset-utility-icons.js\";\nexport type { AssetUtilityIconsProps } from \"./components/asset-utility-icons.js\";\nexport { AssetMarketplacePanel } from \"./components/asset-marketplace-panel.js\";\nexport type { AssetMarketplacePanelProps, ApiOrderLike } from \"./components/asset-marketplace-panel.js\";\nexport { BRAND } from \"./data/brand.js\";\n\n// ── Components (client-only — all have \"use client\") ─────────────────────────\nexport { CurrencyIcon, CurrencyAmount } from \"./components/currency-icon.js\";\nexport type { CurrencyIconProps, CurrencyAmountProps } from \"./components/currency-icon.js\";\n\nexport { IpTypeBadge, IP_TYPE_CONFIG, IP_TYPE_MAP } from \"./components/ip-type-badge.js\";\nexport type { IpTypeBadgeProps, IpTypeConfig } from \"./components/ip-type-badge.js\";\n\nexport { AddressDisplay } from \"./components/address-display.js\";\nexport type { AddressDisplayProps } from \"./components/address-display.js\";\n\nexport { MedialaneIcon } from \"./components/brand-icon.js\";\nexport type { MedialaneIconProps } from \"./components/brand-icon.js\";\nexport { MedialaneLogoFull } from \"./components/brand-logo.js\";\nexport type { MedialaneLogoFullProps } from \"./components/brand-logo.js\";\n\n// ── v0.2 additions ────────────────────────────────────────────────────────────\nexport { MotionCard, FadeIn, Stagger, StaggerItem, KineticWords, SPRING, EASE_OUT } from \"./components/motion-primitives.js\";\nexport { PageContainer } from \"./components/page-container.js\";\nexport type { PageContainerProps } from \"./components/page-container.js\";\nexport { ScrollSection } from \"./components/scroll-section.js\";\nexport type { ScrollSectionProps } from \"./components/scroll-section.js\";\nexport { ShareButton } from \"./components/share-button.js\";\nexport type { ShareButtonProps } from \"./components/share-button.js\";\nexport { CollectionCard, CollectionCardSkeleton } from \"./components/collection-card.js\";\nexport type { CollectionCardProps } from \"./components/collection-card.js\";\nexport { TokenCard, TokenCardSkeleton } from \"./components/token-card.js\";\nexport type { TokenCardProps, RarityTier } from \"./components/token-card.js\";\nexport { AssetCard, AssetCardSkeleton } from \"./components/asset-card.js\";\nexport type { AssetCardProps, AssetCardPrice } from \"./components/asset-card.js\";\n// ── Coin discovery (chain-agnostic; price/data/href injected by the app) ─────\nexport {\n coinKind, formatCoinPrice, formatFdv,\n type CoinKind, type CoinCollectionLike, type CoinPriceLike,\n} from \"./data/coins.js\";\nexport { CoinCard, CoinRow, CoinCardSkeleton, type UseCoinPrice, type CoinTileProps } from \"./components/coin-card.js\";\nexport {\n CoinsExplorer,\n type CoinsExplorerProps, type CoinFilter, type CoinSort, type UseCoins,\n} from \"./components/coins-explorer.js\";\n\n// ── v0.3 additions ────────────────────────────────────────────────────────────\nexport { timeAgo, timeUntil } from \"./utils/time.js\";\nexport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"./data/activity.js\";\nexport type { ActivityTypeConfig } from \"./data/activity.js\";\nexport { HeroSlider, HeroSliderSkeleton } from \"./components/hero-slider.js\";\nexport type { HeroSliderProps } from \"./components/hero-slider.js\";\nexport { ActivityTicker } from \"./components/activity-ticker.js\";\nexport type { ActivityTickerProps } from \"./components/activity-ticker.js\";\nexport { ListingCard, ListingCardSkeleton } from \"./components/listing-card.js\";\nexport type { ListingCardProps } from \"./components/listing-card.js\";\nexport { ActivityRow } from \"./components/activity-row.js\";\nexport type { ActivityRowProps } from \"./components/activity-row.js\";\nexport { ActivityFeedShell } from \"./components/activity-feed-shell.js\";\nexport type { ActivityFeedShellProps } from \"./components/activity-feed-shell.js\";\nexport { CtaCardGrid } from \"./components/cta-card-grid.js\";\nexport type { CtaCardGridProps, CtaCardItem } from \"./components/cta-card-grid.js\";\n\n// ── v0.3.2 additions ─────────────────────────────────────────────────────────\nexport { DiscoverHero } from \"./components/discover-hero.js\";\nexport type { DiscoverHeroProps } from \"./components/discover-hero.js\";\nexport { FeaturedCarousel, FeaturedCarouselSkeleton } from \"./components/featured-carousel.js\";\nexport type { FeaturedCarouselProps } from \"./components/featured-carousel.js\";\nexport { DiscoverCollectionsStrip } from \"./components/discover-collections-strip.js\";\nexport type { DiscoverCollectionsStripProps } from \"./components/discover-collections-strip.js\";\nexport { DiscoverCreatorsStrip } from \"./components/discover-creators-strip.js\";\nexport type { DiscoverCreatorsStripProps } from \"./components/discover-creators-strip.js\";\nexport { DiscoverFeedSection, DiscoverActivityStrip } from \"./components/discover-feed-section.js\";\nexport type { DiscoverFeedSectionProps, DiscoverActivityStripProps } from \"./components/discover-feed-section.js\";\nexport { ActivityCard, ActivityCardSkeleton, ACTIVITY_MESSAGES } from \"./components/activity-card.js\";\nexport type { ActivityCardProps } from \"./components/activity-card.js\";\n\n// ── Launchpad (grouped sections — single page-UI source since 0.8.0) ─────────\nexport { LaunchpadGroupedSections, LaunchpadServiceCard, SERVICE_HUES, useLaunchpadFilter } from \"./components/launchpad-services.js\";\nexport { LaunchpadFilterBar } from \"./components/launchpad-filter-bar.js\";\nexport type { LaunchpadFilterBarProps } from \"./components/launchpad-filter-bar.js\";\nexport { LaunchpadStrip } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadStripProps } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadGroupedSectionsProps, LaunchpadServiceCardProps, ServiceOverride, ServiceOverrides } from \"./components/launchpad-services.js\";\nexport { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS } from \"./data/launchpad-services.js\";\nexport type { ServiceDefinition, ServiceStatus, ServiceCategory, ServiceGroup, ServiceGroupDefinition } from \"./data/launchpad-services.js\";\n\n// ── v0.5.0 additions ─────────────────────────────────────────────────────────\nexport { NavCommandMenu, useNavCommandMenu } from \"./components/nav-command-menu.js\";\nexport type { NavCommand, NavCommandGroup, NavCommandMenuProps } from \"./components/nav-command-menu.js\";\n\n// ── v0.62.0 — nav shell (brand mark trigger + header buttons + account sheet) ─\nexport {\n MedialaneMark,\n NavBrandButton,\n NavIconButton,\n NavAccountSheet,\n useNavAccountSheet,\n} from \"./components/nav-shell.js\";\nexport type {\n MedialaneMarkProps,\n NavBrandButtonProps,\n NavIconButtonProps,\n NavAccountSheetProps,\n} from \"./components/nav-shell.js\";\n\n// ── v0.59.0 — portfolio shell (two-level nav + header + overview) ────────────\nexport { PortfolioNav } from \"./components/portfolio-nav.js\";\nexport type {\n PortfolioNavProps,\n PortfolioNavSection,\n PortfolioNavChild,\n PortfolioBadgeVariant,\n} from \"./components/portfolio-nav.js\";\nexport { PortfolioHeader } from \"./components/portfolio-header.js\";\nexport type {\n PortfolioHeaderProps,\n PortfolioHeaderScore,\n} from \"./components/portfolio-header.js\";\nexport { PortfolioOverview } from \"./components/portfolio-overview.js\";\nexport type {\n PortfolioOverviewProps,\n PortfolioOverviewStat,\n PortfolioAttentionItem,\n PortfolioQuickAction,\n} from \"./components/portfolio-overview.js\";\nexport { derivePortfolioCounts } from \"./utils/portfolio-counts.js\";\nexport type { PortfolioCounts, CountableOrder } from \"./utils/portfolio-counts.js\";\n\n// ── v0.22.0 additions — launchpad/claim form template primitives ─────────────\n// Pure-presentation header + rail shared by every launchpad/claim form. The\n// app supplies its own gate, back button, and form logic. Requires the\n// `.btn-border-animated` class (in @medialane/ui/styles) for the form shell.\nexport { ServiceHeader } from \"./components/service-header.js\";\nexport type { ServiceHeaderProps } from \"./components/service-header.js\";\nexport { ClaimRail } from \"./components/claim-rail.js\";\nexport type { ClaimRailProps } from \"./components/claim-rail.js\";\n\n// ── v0.23.0 additions — slot-based form shell ────────────────────────────────\n// Pure layout (back slot + header + animated-border compartment + 8/4 bento).\n// No auth/router — the app injects its own gate (around children) + back button.\nexport { ServiceFormShell } from \"./components/service-form-shell.js\";\nexport type { ServiceFormShellProps } from \"./components/service-form-shell.js\";\nexport { StepNav } from \"./components/step-nav.js\";\nexport type { StepNavProps, StepNavStep } from \"./components/step-nav.js\";\n\n// Rewards score kit (v0.36.0)\nexport { LevelBadge } from \"./components/rewards/level-badge.js\";\nexport type { LevelBadgeProps } from \"./components/rewards/level-badge.js\";\nexport { XpProgress } from \"./components/rewards/xp-progress.js\";\nexport type { XpProgressProps } from \"./components/rewards/xp-progress.js\";\nexport { BadgeShelf } from \"./components/rewards/badge-shelf.js\";\nexport type { BadgeShelfProps, BadgeShelfBadge } from \"./components/rewards/badge-shelf.js\";\nexport { ScoreSummaryCard } from \"./components/rewards/score-summary-card.js\";\nexport type { ScoreSummaryCardProps } from \"./components/rewards/score-summary-card.js\";\nexport { LeaderboardTable, LeaderboardWidget } from \"./components/rewards/leaderboard-table.js\";\nexport type { LeaderboardTableProps, LeaderboardWidgetProps, LeaderboardEntryLike } from \"./components/rewards/leaderboard-table.js\";\nexport { LevelLadder } from \"./components/rewards/level-ladder.js\";\nexport type { LevelLadderProps } from \"./components/rewards/level-ladder.js\";\nexport { XpToastContent } from \"./components/rewards/xp-toast-content.js\";\nexport type { XpToastContentProps } from \"./components/rewards/xp-toast-content.js\";\n\n// ── v0.37.0 additions — infinite-scroll trigger ──────────────────────────────\nexport { LoadMoreSentinel } from \"./components/load-more-sentinel.js\";\nexport type { LoadMoreSentinelProps } from \"./components/load-more-sentinel.js\";\n\n// ── v0.47.0 additions — community rewards section ────────────────────────────\nexport { CommunityRewardsSection } from \"./components/community-rewards-section.js\";\nexport type { CommunityRewardsSectionProps, CommunityRewardsEntry } from \"./components/community-rewards-section.js\";\n\n// ── Design system primitives — action-focus pattern, tokens, data display ────\nexport { ActionButton } from \"./components/action-button.js\";\nexport type { ActionButtonProps, ActionKey, ToneKey } from \"./components/action-button.js\";\n\nexport { CoinLaunchPreview } from \"./components/coin-launch-preview.js\";\nexport type { CoinPreviewData } from \"./components/coin-launch-preview.js\";\nexport { MedialaneCollectionCard } from \"./components/medialane-collection-card.js\";\nexport type { MedialaneCollectionCardProps } from \"./components/medialane-collection-card.js\";\nexport { TokenGlyph, TokenAmount } from \"./components/token-glyph.js\";\nexport type { TokenGlyphProps, TokenAmountProps, TokenSymbol } from \"./components/token-glyph.js\";\n\nexport { StatTile, StatPill } from \"./components/stat-tile.js\";\nexport type { StatTileProps, StatPillProps } from \"./components/stat-tile.js\";\n\nexport { ActionDialog } from \"./components/action-dialog.js\";\nexport type { ActionDialogProps } from \"./components/action-dialog.js\";\n"],"mappings":"AACA,SAAS,UAAU;AACnB,SAAS,oBAAoB,yBAAyB;AACtD,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAG/B,SAAS,cAAc,wBAAwB;AAE/C;AAAA,EACE;AAAA,EAAU;AAAA,EAAe;AAAA,EAAmB;AAAA,EAC5C;AAAA,EAAqB;AAAA,OAChB;AAEP;AAAA,EACE;AAAA,EAAc;AAAA,EAAqB;AAAA,EAAsB;AAAA,EAAsB;AAAA,OAC1E;AAEP,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAExC,SAAS,kBAAkB,kBAAkB,eAAe,yBAAyB;AAErF,SAAS,0BAA0B;AAEnC,SAAS,yBAAyB;AAElC,SAAS,6BAA6B;AAEtC,SAAS,aAAa;AAGtB,SAAS,cAAc,sBAAsB;AAG7C,SAAS,aAAa,gBAAgB,mBAAmB;AAGzD,SAAS,sBAAsB;AAG/B,SAAS,qBAAqB;AAE9B,SAAS,yBAAyB;AAIlC,SAAS,YAAY,QAAQ,SAAS,aAAa,cAAc,QAAQ,gBAAgB;AACzF,SAAS,qBAAqB;AAE9B,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB,8BAA8B;AAEvD,SAAS,WAAW,yBAAyB;AAE7C,SAAS,WAAW,yBAAyB;AAG7C;AAAA,EACE;AAAA,EAAU;AAAA,EAAiB;AAAA,OAEtB;AACP,SAAS,UAAU,SAAS,wBAA+D;AAC3F;AAAA,EACE;AAAA,OAEK;AAGP,SAAS,SAAS,iBAAiB;AACnC,SAAS,sBAAsB,oBAAoB;AAEnD,SAAS,YAAY,0BAA0B;AAE/C,SAAS,sBAAsB;AAE/B,SAAS,aAAa,2BAA2B;AAEjD,SAAS,mBAAmB;AAE5B,SAAS,yBAAyB;AAElC,SAAS,mBAAmB;AAI5B,SAAS,oBAAoB;AAE7B,SAAS,kBAAkB,gCAAgC;AAE3D,SAAS,gCAAgC;AAEzC,SAAS,6BAA6B;AAEtC,SAAS,qBAAqB,6BAA6B;AAE3D,SAAS,cAAc,sBAAsB,yBAAyB;AAItE,SAAS,0BAA0B,sBAAsB,cAAc,0BAA0B;AACjG,SAAS,0BAA0B;AAEnC,SAAS,sBAAsB;AAG/B,SAAS,+BAA+B,gCAAgC;AAIxE,SAAS,gBAAgB,yBAAyB;AAIlD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASP,SAAS,oBAAoB;AAO7B,SAAS,uBAAuB;AAKhC,SAAS,yBAAyB;AAOlC,SAAS,6BAA6B;AAOtC,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB;AAM1B,SAAS,wBAAwB;AAEjC,SAAS,eAAe;AAIxB,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,wBAAwB;AAEjC,SAAS,kBAAkB,yBAAyB;AAEpD,SAAS,mBAAmB;AAE5B,SAAS,sBAAsB;AAI/B,SAAS,wBAAwB;AAIjC,SAAS,+BAA+B;AAIxC,SAAS,oBAAoB;AAG7B,SAAS,yBAAyB;AAElC,SAAS,+BAA+B;AAExC,SAAS,YAAY,mBAAmB;AAGxC,SAAS,UAAU,gBAAgB;AAGnC,SAAS,oBAAoB;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// ── Utils ─────────────────────────────────────────────────────────────────────\nexport { cn } from \"./utils/cn.js\";\nexport { formatDisplayPrice, parsePriceDisplay } from \"./utils/format.js\";\nexport { shortenAddress } from \"./utils/address.js\";\nexport { ipfsToHttp } from \"./utils/ipfs.js\";\nexport { licenseSummary } from \"./utils/license-summary.js\";\n\n// ── Data (server-safe — no React, safe in Server Components) ──────────────────\nexport { IP_TYPE_DATA, IP_TYPE_DATA_MAP } from \"./data/ip-types.js\";\nexport type { IpTypeData } from \"./data/ip-types.js\";\nexport {\n IP_TYPES, LICENSE_TYPES, GEOGRAPHIC_SCOPES, AI_POLICIES,\n DERIVATIVES_OPTIONS, LICENSE_TRAIT_TYPES,\n} from \"./data/ip.js\";\nexport type { IPType, LicenseType } from \"./data/ip.js\";\nexport {\n IP_TEMPLATES, EMBED_PLATFORM_META, SOCIAL_PLATFORM_META, TEMPLATE_TRAIT_TYPES, DOC_UPLOAD,\n} from \"./data/ip-templates.js\";\nexport type { EmbedPlatform, SocialPlatform, TraitSuggestion, IPTemplate, DocUploadConfig } from \"./data/ip-templates.js\";\nexport { IPTypeDisplay } from \"./components/ip-type-display.js\";\nexport { AssetOverviewContent } from \"./components/asset-overview-content.js\";\nexport { AssetLicenseSummary } from \"./components/asset-license-summary.js\";\nexport { AssetMarketsTab } from \"./components/asset-markets-tab.js\";\nexport { ParentAttributionBanner } from \"./components/parent-attribution-banner.js\";\nexport type { ParentBannerProps } from \"./components/parent-attribution-banner.js\";\nexport { AssetMediaColumn, AssetHeaderBlock, AssetOwnerRow, buildEditionStats } from \"./components/asset-top-sections.js\";\nexport type { AssetOwnerRowProps } from \"./components/asset-top-sections.js\";\nexport { AssetCollectionBar } from \"./components/asset-collection-bar.js\";\nexport type { AssetCollectionBarProps, AssetCollectionBarSibling } from \"./components/asset-collection-bar.js\";\nexport { AssetUtilityIcons } from \"./components/asset-utility-icons.js\";\nexport type { AssetUtilityIconsProps } from \"./components/asset-utility-icons.js\";\nexport { AssetMarketplacePanel } from \"./components/asset-marketplace-panel.js\";\nexport type { AssetMarketplacePanelProps, ApiOrderLike } from \"./components/asset-marketplace-panel.js\";\nexport { BRAND } from \"./data/brand.js\";\n\n// ── Components (client-only — all have \"use client\") ─────────────────────────\nexport { CurrencyIcon, CurrencyAmount } from \"./components/currency-icon.js\";\nexport type { CurrencyIconProps, CurrencyAmountProps } from \"./components/currency-icon.js\";\n\nexport { IpTypeBadge, IP_TYPE_CONFIG, IP_TYPE_MAP } from \"./components/ip-type-badge.js\";\nexport type { IpTypeBadgeProps, IpTypeConfig } from \"./components/ip-type-badge.js\";\n\nexport { AddressDisplay } from \"./components/address-display.js\";\nexport type { AddressDisplayProps } from \"./components/address-display.js\";\n\nexport { MedialaneIcon } from \"./components/brand-icon.js\";\nexport type { MedialaneIconProps } from \"./components/brand-icon.js\";\nexport { MedialaneLogoFull } from \"./components/brand-logo.js\";\nexport type { MedialaneLogoFullProps } from \"./components/brand-logo.js\";\n\n// ── v0.2 additions ────────────────────────────────────────────────────────────\nexport { MotionCard, FadeIn, Stagger, StaggerItem, KineticWords, SPRING, EASE_OUT } from \"./components/motion-primitives.js\";\nexport { PageContainer } from \"./components/page-container.js\";\nexport type { PageContainerProps } from \"./components/page-container.js\";\nexport { ScrollSection } from \"./components/scroll-section.js\";\nexport type { ScrollSectionProps } from \"./components/scroll-section.js\";\nexport { ShareButton } from \"./components/share-button.js\";\nexport type { ShareButtonProps } from \"./components/share-button.js\";\nexport { CollectionCard, CollectionCardSkeleton } from \"./components/collection-card.js\";\nexport type { CollectionCardProps } from \"./components/collection-card.js\";\nexport { TokenCard, TokenCardSkeleton } from \"./components/token-card.js\";\nexport type { TokenCardProps, RarityTier } from \"./components/token-card.js\";\nexport { AssetCard, AssetCardSkeleton } from \"./components/asset-card.js\";\nexport type { AssetCardProps, AssetCardPrice } from \"./components/asset-card.js\";\n// ── Coin discovery (chain-agnostic; price/data/href injected by the app) ─────\nexport {\n coinKind, formatCoinPrice, formatFdv,\n type CoinKind, type CoinCollectionLike, type CoinPriceLike,\n} from \"./data/coins.js\";\nexport { CoinCard, CoinRow, CoinCardSkeleton, type UseCoinPrice, type CoinTileProps } from \"./components/coin-card.js\";\nexport {\n CoinsExplorer,\n type CoinsExplorerProps, type CoinFilter, type CoinSort, type UseCoins,\n} from \"./components/coins-explorer.js\";\n\n// ── v0.3 additions ────────────────────────────────────────────────────────────\nexport { timeAgo, timeUntil } from \"./utils/time.js\";\nexport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"./data/activity.js\";\nexport type { ActivityTypeConfig } from \"./data/activity.js\";\nexport { HeroSlider, HeroSliderSkeleton } from \"./components/hero-slider.js\";\nexport type { HeroSliderProps } from \"./components/hero-slider.js\";\nexport { ActivityTicker } from \"./components/activity-ticker.js\";\nexport type { ActivityTickerProps } from \"./components/activity-ticker.js\";\nexport { ListingCard, ListingCardSkeleton } from \"./components/listing-card.js\";\nexport type { ListingCardProps } from \"./components/listing-card.js\";\nexport { ActivityRow } from \"./components/activity-row.js\";\nexport type { ActivityRowProps } from \"./components/activity-row.js\";\nexport { ActivityFeedShell } from \"./components/activity-feed-shell.js\";\nexport type { ActivityFeedShellProps } from \"./components/activity-feed-shell.js\";\nexport { CtaCardGrid } from \"./components/cta-card-grid.js\";\nexport type { CtaCardGridProps, CtaCardItem } from \"./components/cta-card-grid.js\";\n\n// ── v0.3.2 additions ─────────────────────────────────────────────────────────\nexport { DiscoverHero } from \"./components/discover-hero.js\";\nexport type { DiscoverHeroProps } from \"./components/discover-hero.js\";\nexport { FeaturedCarousel, FeaturedCarouselSkeleton } from \"./components/featured-carousel.js\";\nexport type { FeaturedCarouselProps } from \"./components/featured-carousel.js\";\nexport { DiscoverCollectionsStrip } from \"./components/discover-collections-strip.js\";\nexport type { DiscoverCollectionsStripProps } from \"./components/discover-collections-strip.js\";\nexport { DiscoverCreatorsStrip } from \"./components/discover-creators-strip.js\";\nexport type { DiscoverCreatorsStripProps } from \"./components/discover-creators-strip.js\";\nexport { DiscoverFeedSection, DiscoverActivityStrip } from \"./components/discover-feed-section.js\";\nexport type { DiscoverFeedSectionProps, DiscoverActivityStripProps } from \"./components/discover-feed-section.js\";\nexport { ActivityCard, ActivityCardSkeleton, ACTIVITY_MESSAGES } from \"./components/activity-card.js\";\nexport type { ActivityCardProps } from \"./components/activity-card.js\";\n\n// ── Launchpad (grouped sections — single page-UI source since 0.8.0) ─────────\nexport { LaunchpadGroupedSections, LaunchpadServiceCard, SERVICE_HUES, useLaunchpadFilter } from \"./components/launchpad-services.js\";\nexport { LaunchpadFilterBar } from \"./components/launchpad-filter-bar.js\";\nexport type { LaunchpadFilterBarProps } from \"./components/launchpad-filter-bar.js\";\nexport { LaunchpadStrip } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadStripProps } from \"./components/launchpad-strip.js\";\nexport type { LaunchpadGroupedSectionsProps, LaunchpadServiceCardProps, ServiceOverride, ServiceOverrides } from \"./components/launchpad-services.js\";\nexport { LAUNCHPAD_SERVICE_DEFINITIONS, LAUNCHPAD_SERVICE_GROUPS } from \"./data/launchpad-services.js\";\nexport type { ServiceDefinition, ServiceStatus, ServiceCategory, ServiceGroup, ServiceGroupDefinition } from \"./data/launchpad-services.js\";\n\n// ── v0.5.0 additions ─────────────────────────────────────────────────────────\nexport { NavCommandMenu, useNavCommandMenu } from \"./components/nav-command-menu.js\";\nexport type { NavCommand, NavCommandGroup, NavCommandMenuProps } from \"./components/nav-command-menu.js\";\n\n// ── v0.62.0 — nav shell (brand trigger + header buttons + account sheet) ─────\nexport {\n NavBrandButton,\n NavIconButton,\n NavAccountSheet,\n useNavAccountSheet,\n} from \"./components/nav-shell.js\";\nexport type {\n NavBrandButtonProps,\n NavIconButtonProps,\n NavAccountSheetProps,\n} from \"./components/nav-shell.js\";\n\n// ── v0.59.0 — portfolio shell (two-level nav + header + overview) ────────────\nexport { PortfolioNav } from \"./components/portfolio-nav.js\";\nexport type {\n PortfolioNavProps,\n PortfolioNavSection,\n PortfolioNavChild,\n PortfolioBadgeVariant,\n} from \"./components/portfolio-nav.js\";\nexport { PortfolioHeader } from \"./components/portfolio-header.js\";\nexport type {\n PortfolioHeaderProps,\n PortfolioHeaderScore,\n} from \"./components/portfolio-header.js\";\nexport { PortfolioOverview } from \"./components/portfolio-overview.js\";\nexport type {\n PortfolioOverviewProps,\n PortfolioOverviewStat,\n PortfolioAttentionItem,\n PortfolioQuickAction,\n} from \"./components/portfolio-overview.js\";\nexport { derivePortfolioCounts } from \"./utils/portfolio-counts.js\";\nexport type { PortfolioCounts, CountableOrder } from \"./utils/portfolio-counts.js\";\n\n// ── v0.22.0 additions — launchpad/claim form template primitives ─────────────\n// Pure-presentation header + rail shared by every launchpad/claim form. The\n// app supplies its own gate, back button, and form logic. Requires the\n// `.btn-border-animated` class (in @medialane/ui/styles) for the form shell.\nexport { ServiceHeader } from \"./components/service-header.js\";\nexport type { ServiceHeaderProps } from \"./components/service-header.js\";\nexport { ClaimRail } from \"./components/claim-rail.js\";\nexport type { ClaimRailProps } from \"./components/claim-rail.js\";\n\n// ── v0.23.0 additions — slot-based form shell ────────────────────────────────\n// Pure layout (back slot + header + animated-border compartment + 8/4 bento).\n// No auth/router — the app injects its own gate (around children) + back button.\nexport { ServiceFormShell } from \"./components/service-form-shell.js\";\nexport type { ServiceFormShellProps } from \"./components/service-form-shell.js\";\nexport { StepNav } from \"./components/step-nav.js\";\nexport type { StepNavProps, StepNavStep } from \"./components/step-nav.js\";\n\n// Rewards score kit (v0.36.0)\nexport { LevelBadge } from \"./components/rewards/level-badge.js\";\nexport type { LevelBadgeProps } from \"./components/rewards/level-badge.js\";\nexport { XpProgress } from \"./components/rewards/xp-progress.js\";\nexport type { XpProgressProps } from \"./components/rewards/xp-progress.js\";\nexport { BadgeShelf } from \"./components/rewards/badge-shelf.js\";\nexport type { BadgeShelfProps, BadgeShelfBadge } from \"./components/rewards/badge-shelf.js\";\nexport { ScoreSummaryCard } from \"./components/rewards/score-summary-card.js\";\nexport type { ScoreSummaryCardProps } from \"./components/rewards/score-summary-card.js\";\nexport { LeaderboardTable, LeaderboardWidget } from \"./components/rewards/leaderboard-table.js\";\nexport type { LeaderboardTableProps, LeaderboardWidgetProps, LeaderboardEntryLike } from \"./components/rewards/leaderboard-table.js\";\nexport { LevelLadder } from \"./components/rewards/level-ladder.js\";\nexport type { LevelLadderProps } from \"./components/rewards/level-ladder.js\";\nexport { XpToastContent } from \"./components/rewards/xp-toast-content.js\";\nexport type { XpToastContentProps } from \"./components/rewards/xp-toast-content.js\";\n\n// ── v0.37.0 additions — infinite-scroll trigger ──────────────────────────────\nexport { LoadMoreSentinel } from \"./components/load-more-sentinel.js\";\nexport type { LoadMoreSentinelProps } from \"./components/load-more-sentinel.js\";\n\n// ── v0.47.0 additions — community rewards section ────────────────────────────\nexport { CommunityRewardsSection } from \"./components/community-rewards-section.js\";\nexport type { CommunityRewardsSectionProps, CommunityRewardsEntry } from \"./components/community-rewards-section.js\";\n\n// ── Design system primitives — action-focus pattern, tokens, data display ────\nexport { ActionButton } from \"./components/action-button.js\";\nexport type { ActionButtonProps, ActionKey, ToneKey } from \"./components/action-button.js\";\n\nexport { CoinLaunchPreview } from \"./components/coin-launch-preview.js\";\nexport type { CoinPreviewData } from \"./components/coin-launch-preview.js\";\nexport { MedialaneCollectionCard } from \"./components/medialane-collection-card.js\";\nexport type { MedialaneCollectionCardProps } from \"./components/medialane-collection-card.js\";\nexport { TokenGlyph, TokenAmount } from \"./components/token-glyph.js\";\nexport type { TokenGlyphProps, TokenAmountProps, TokenSymbol } from \"./components/token-glyph.js\";\n\nexport { StatTile, StatPill } from \"./components/stat-tile.js\";\nexport type { StatTileProps, StatPillProps } from \"./components/stat-tile.js\";\n\nexport { ActionDialog } from \"./components/action-dialog.js\";\nexport type { ActionDialogProps } from \"./components/action-dialog.js\";\n"],"mappings":"AACA,SAAS,UAAU;AACnB,SAAS,oBAAoB,yBAAyB;AACtD,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAG/B,SAAS,cAAc,wBAAwB;AAE/C;AAAA,EACE;AAAA,EAAU;AAAA,EAAe;AAAA,EAAmB;AAAA,EAC5C;AAAA,EAAqB;AAAA,OAChB;AAEP;AAAA,EACE;AAAA,EAAc;AAAA,EAAqB;AAAA,EAAsB;AAAA,EAAsB;AAAA,OAC1E;AAEP,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAExC,SAAS,kBAAkB,kBAAkB,eAAe,yBAAyB;AAErF,SAAS,0BAA0B;AAEnC,SAAS,yBAAyB;AAElC,SAAS,6BAA6B;AAEtC,SAAS,aAAa;AAGtB,SAAS,cAAc,sBAAsB;AAG7C,SAAS,aAAa,gBAAgB,mBAAmB;AAGzD,SAAS,sBAAsB;AAG/B,SAAS,qBAAqB;AAE9B,SAAS,yBAAyB;AAIlC,SAAS,YAAY,QAAQ,SAAS,aAAa,cAAc,QAAQ,gBAAgB;AACzF,SAAS,qBAAqB;AAE9B,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB,8BAA8B;AAEvD,SAAS,WAAW,yBAAyB;AAE7C,SAAS,WAAW,yBAAyB;AAG7C;AAAA,EACE;AAAA,EAAU;AAAA,EAAiB;AAAA,OAEtB;AACP,SAAS,UAAU,SAAS,wBAA+D;AAC3F;AAAA,EACE;AAAA,OAEK;AAGP,SAAS,SAAS,iBAAiB;AACnC,SAAS,sBAAsB,oBAAoB;AAEnD,SAAS,YAAY,0BAA0B;AAE/C,SAAS,sBAAsB;AAE/B,SAAS,aAAa,2BAA2B;AAEjD,SAAS,mBAAmB;AAE5B,SAAS,yBAAyB;AAElC,SAAS,mBAAmB;AAI5B,SAAS,oBAAoB;AAE7B,SAAS,kBAAkB,gCAAgC;AAE3D,SAAS,gCAAgC;AAEzC,SAAS,6BAA6B;AAEtC,SAAS,qBAAqB,6BAA6B;AAE3D,SAAS,cAAc,sBAAsB,yBAAyB;AAItE,SAAS,0BAA0B,sBAAsB,cAAc,0BAA0B;AACjG,SAAS,0BAA0B;AAEnC,SAAS,sBAAsB;AAG/B,SAAS,+BAA+B,gCAAgC;AAIxE,SAAS,gBAAgB,yBAAyB;AAIlD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQP,SAAS,oBAAoB;AAO7B,SAAS,uBAAuB;AAKhC,SAAS,yBAAyB;AAOlC,SAAS,6BAA6B;AAOtC,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB;AAM1B,SAAS,wBAAwB;AAEjC,SAAS,eAAe;AAIxB,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,wBAAwB;AAEjC,SAAS,kBAAkB,yBAAyB;AAEpD,SAAS,mBAAmB;AAE5B,SAAS,sBAAsB;AAI/B,SAAS,wBAAwB;AAIjC,SAAS,+BAA+B;AAIxC,SAAS,oBAAoB;AAG7B,SAAS,yBAAyB;AAElC,SAAS,+BAA+B;AAExC,SAAS,YAAY,mBAAmB;AAGxC,SAAS,UAAU,gBAAgB;AAGnC,SAAS,oBAAoB;","names":[]}
|