@dyrected/admin 2.4.0 → 2.4.2

package/src/components/ui/skeleton.tsx

@@ -1,15 +0,0 @@
-import { cn } from "../../lib/utils"
-
-function Skeleton({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) {
-  return (
-    <div
-      className={cn("dy-animate-pulse dy-rounded-md dy-bg-muted", className)}
-      {...props}
-    />
-  )
-}
-
-export { Skeleton }

package/src/components/ui/sonner.tsx

@@ -1,27 +0,0 @@
-import { Toaster as Sonner } from "sonner"
-
-type ToasterProps = React.ComponentProps<typeof Sonner>
-
-const Toaster = ({ ...props }: ToasterProps) => {
-  return (
-    <Sonner
-      className="dy-toaster dy-group"
-      toastOptions={{
-        classNames: {
-          toast:
-            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg group-[.toaster]:rounded-xl",
-          description: "group-[.toast]:text-muted-foreground",
-          actionButton:
-            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
-          cancelButton:
-            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
-          success: "group-[.toaster]:border-emerald-500/20 group-[.toaster]:bg-emerald-50 group-[.toaster]:text-emerald-900",
-          error: "group-[.toaster]:border-red-500/20 group-[.toaster]:bg-red-50 group-[.toaster]:text-red-900",
-        },
-      }}
-      {...props}
-    />
-  )
-}
-
-export { Toaster }

package/src/components/ui/switch.tsx

@@ -1,27 +0,0 @@
-import * as React from "react"
-import * as SwitchPrimitives from "@radix-ui/react-switch"
-
-import { cn } from "../../lib/utils"
-
-const Switch = React.forwardRef<
-  React.ElementRef<typeof SwitchPrimitives.Root>,
-  React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>
->(({ className, ...props }, ref) => (
-  <SwitchPrimitives.Root
-    className={cn(
-      "dy-peer dy-inline-flex dy-h-6 dy-w-11 dy-shrink-0 dy-cursor-pointer dy-items-center dy-rounded-full dy-border-2 dy-border-transparent dy-transition-colors focus-visible:dy-outline-none focus-visible:dy-ring-2 focus-visible:dy-ring-ring focus-visible:dy-ring-offset-2 focus-visible:dy-ring-offset-background disabled:dy-cursor-not-allowed disabled:dy-opacity-50 data-[state=checked]:dy-bg-primary data-[state=unchecked]:dy-bg-input",
-      className
-    )}
-    {...props}
-    ref={ref}
-  >
-    <SwitchPrimitives.Thumb
-      className={cn(
-        "dy-pointer-events-none dy-block dy-h-5 dy-w-5 dy-rounded-full dy-bg-background dy-shadow-lg dy-ring-0 dy-transition-transform data-[state=checked]:dy-translate-x-5 data-[state=unchecked]:dy-translate-x-0"
-      )}
-    />
-  </SwitchPrimitives.Root>
-))
-Switch.displayName = SwitchPrimitives.Root.displayName
-
-export { Switch }

package/src/components/ui/table.tsx

@@ -1,117 +0,0 @@
-import * as React from "react"
-
-import { cn } from "../../lib/utils"
-
-const Table = React.forwardRef<
-  HTMLTableElement,
-  React.HTMLAttributes<HTMLTableElement>
->(({ className, ...props }, ref) => (
-  <div className="dy-relative dy-w-full dy-overflow-auto">
-    <table
-      ref={ref}
-      className={cn("dy-w-full dy-caption-bottom dy-text-sm", className)}
-      {...props}
-    />
-  </div>
-))
-Table.displayName = "Table"
-
-const TableHeader = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:dy-border-b", className)} {...props} />
-))
-TableHeader.displayName = "TableHeader"
-
-const TableBody = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tbody
-    ref={ref}
-    className={cn("[&_tr:last-child]:dy-border-0", className)}
-    {...props}
-  />
-))
-TableBody.displayName = "TableBody"
-
-const TableFooter = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tfoot
-    ref={ref}
-    className={cn(
-      "dy-border-t dy-bg-muted/50 dy-font-medium [&>tr]:last:dy-border-b-0",
-      className
-    )}
-    {...props}
-  />
-))
-TableFooter.displayName = "TableFooter"
-
-const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "dy-border-b dy-border-border/30 dy-transition-colors hover:dy-bg-muted/30 data-[state=selected]:dy-bg-muted",
-      className
-    )}
-    {...props}
-  />
-))
-TableRow.displayName = "TableRow"
-
-const TableHead = React.forwardRef<
-  HTMLTableCellElement,
-  React.ThHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <th
-    ref={ref}
-    className={cn(
-      "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
-      className
-    )}
-    {...props}
-  />
-))
-TableHead.displayName = "TableHead"
-
-const TableCell = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td
-    ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
-    {...props}
-  />
-))
-TableCell.displayName = "TableCell"
-
-const TableCaption = React.forwardRef<
-  HTMLTableCaptionElement,
-  React.HTMLAttributes<HTMLTableCaptionElement>
->(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("dy-mt-4 dy-text-sm dy-text-muted-foreground", className)}
-    {...props}
-  />
-))
-TableCaption.displayName = "TableCaption"
-
-export {
-  Table,
-  TableHeader,
-  TableBody,
-  TableFooter,
-  TableHead,
-  TableRow,
-  TableCell,
-  TableCaption,
-}

package/src/components/ui/tabs.tsx

@@ -1,53 +0,0 @@
-import * as React from "react"
-import * as TabsPrimitive from "@radix-ui/react-tabs"
-
-import { cn } from "../../lib/utils"
-
-const Tabs = TabsPrimitive.Root
-
-const TabsList = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.List
-    ref={ref}
-    className={cn(
-      "dy-inline-flex dy-h-10 dy-items-center dy-justify-center dy-rounded-md dy-bg-muted dy-p-1 dy-text-muted-foreground",
-      className
-    )}
-    {...props}
-  />
-))
-TabsList.displayName = TabsPrimitive.List.displayName
-
-const TabsTrigger = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Trigger
-    ref={ref}
-    className={cn(
-      "dy-inline-flex dy-items-center dy-justify-center dy-whitespace-nowrap dy-rounded-sm dy-px-3 dy-py-1.5 dy-text-sm dy-font-medium dy-ring-offset-background dy-transition-all focus-visible:dy-outline-none focus-visible:dy-ring-2 focus-visible:dy-ring-ring focus-visible:dy-ring-offset-2 disabled:dy-pointer-events-none disabled:dy-opacity-50 data-[state=active]:dy-bg-background data-[state=active]:dy-text-foreground data-[state=active]:dy-shadow-sm",
-      className
-    )}
-    {...props}
-  />
-))
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
-
-const TabsContent = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Content
-    ref={ref}
-    className={cn(
-      "dy-mt-2 dy-ring-offset-background focus-visible:dy-outline-none focus-visible:dy-ring-2 focus-visible:dy-ring-ring focus-visible:dy-ring-offset-2",
-      className
-    )}
-    {...props}
-  />
-))
-TabsContent.displayName = TabsPrimitive.Content.displayName
-
-export { Tabs, TabsList, TabsTrigger, TabsContent }

package/src/components/ui/textarea.tsx

@@ -1,22 +0,0 @@
-import * as React from "react"
-
-import { cn } from "../../lib/utils"
-
-const Textarea = React.forwardRef<
-  HTMLTextAreaElement,
-  React.ComponentProps<"textarea">
->(({ className, ...props }, ref) => {
-  return (
-    <textarea
-      className={cn(
-        "dy-flex dy-min-h-[80px] dy-w-full dy-rounded-md dy-border dy-border-input dy-bg-background dy-px-3 dy-py-2 dy-text-base dy-ring-offset-background placeholder:dy-text-muted-foreground focus-visible:dy-outline-none focus-visible:dy-ring-2 focus-visible:dy-ring-ring focus-visible:dy-ring-offset-2 disabled:dy-cursor-not-allowed disabled:dy-opacity-50 md:dy-text-sm",
-        className
-      )}
-      ref={ref}
-      {...props}
-    />
-  )
-})
-Textarea.displayName = "Textarea"
-
-export { Textarea }

package/src/components/ui/toggle.tsx

@@ -1,43 +0,0 @@
-import * as React from "react"
-import * as TogglePrimitive from "@radix-ui/react-toggle"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "../../lib/utils"
-
-const toggleVariants = cva(
-  "dy-inline-flex dy-items-center dy-justify-center dy-rounded-md dy-text-sm dy-font-medium dy-ring-offset-background dy-transition-colors hover:dy-bg-muted hover:dy-text-muted-foreground focus-visible:dy-outline-none focus-visible:dy-ring-2 focus-visible:dy-ring-ring focus-visible:dy-ring-offset-2 disabled:dy-pointer-events-none disabled:dy-opacity-50 data-[state=on]:dy-bg-accent data-[state=on]:dy-text-accent-foreground [&_svg]:dy-pointer-events-none [&_svg]:dy-size-4 [&_svg]:dy-shrink-0 dy-gap-2",
-  {
-    variants: {
-      variant: {
-        default: "dy-bg-transparent",
-        outline:
-          "dy-border dy-border-input dy-bg-transparent hover:dy-bg-accent hover:dy-text-accent-foreground",
-      },
-      size: {
-        default: "dy-h-10 dy-px-3 dy-min-w-10",
-        sm: "dy-h-9 dy-px-2.5 dy-min-w-9",
-        lg: "dy-h-11 dy-px-5 dy-min-w-11",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  }
-)
-
-const Toggle = React.forwardRef<
-  React.ElementRef<typeof TogglePrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> &
-    VariantProps<typeof toggleVariants>
->(({ className, variant, size, ...props }, ref) => (
-  <TogglePrimitive.Root
-    ref={ref}
-    className={cn(toggleVariants({ variant, size, className }))}
-    {...props}
-  />
-))
-
-Toggle.displayName = TogglePrimitive.Root.displayName
-
-export { Toggle, toggleVariants }

package/src/components/ui/tooltip.tsx

@@ -1,28 +0,0 @@
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
-
-import { cn } from "../../lib/utils"
-
-const TooltipProvider = TooltipPrimitive.Provider
-
-const Tooltip = TooltipPrimitive.Root
-
-const TooltipTrigger = TooltipPrimitive.Trigger
-
-const TooltipContent = React.forwardRef<
-  React.ElementRef<typeof TooltipPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
->(({ className, sideOffset = 4, ...props }, ref) => (
-  <TooltipPrimitive.Content
-    ref={ref}
-    sideOffset={sideOffset}
-    className={cn(
-      "dy-z-50 dy-overflow-hidden dy-rounded-md dy-border dy-bg-popover dy-px-3 dy-py-1.5 dy-text-sm dy-text-popover-foreground dy-shadow-md dy-animate-in dy-fade-in-0 dy-zoom-in-95 data-[state=closed]:dy-animate-out data-[state=closed]:dy-fade-out-0 data-[state=closed]:dy-zoom-out-95 data-[side=bottom]:dy-slide-in-from-top-2 data-[side=left]:dy-slide-in-from-right-2 data-[side=right]:dy-slide-in-from-left-2 data-[side=top]:dy-slide-in-from-bottom-2 dy-origin-[--radix-tooltip-content-transform-origin]",
-      className
-    )}
-    {...props}
-  />
-))
-TooltipContent.displayName = TooltipPrimitive.Content.displayName
-
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }

package/src/hooks/use-mobile.tsx

@@ -1,19 +0,0 @@
-import * as React from "react"
-
-const MOBILE_BREAKPOINT = 768
-
-export function useIsMobile() {
-  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)
-
-  React.useEffect(() => {
-    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
-    const onChange = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
-    }
-    mql.addEventListener("change", onChange)
-    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
-    return () => mql.removeEventListener("change", onChange)
-  }, [])
-
-  return !!isMobile
-}

package/src/hooks/use-preferences.ts

@@ -1,56 +0,0 @@
-import * as React from "react"
-
-export type Updater<T> = T | ((old: T) => T);
-
-/**
- * A hook to manage and persist user preferences in the Admin UI.
- * Currently uses localStorage for persistence.
- */
-export function usePreferences<T>(key: string, defaultValue: T): [T, (updater: Updater<T>) => void] {
-  const [value, setValue] = React.useState<T>(() => {
-    if (typeof window === "undefined") return defaultValue
-
-    try {
-      const stored = window.localStorage.getItem(`dyrected_pref_${key}`)
-      return stored ? JSON.parse(stored) : defaultValue
-    } catch (e) {
-      console.warn(`[usePreferences] Error loading key "${key}":`, e)
-      return defaultValue
-    }
-  })
-
-  // Sync state if key changes (e.g. navigating between collections)
-  React.useEffect(() => {
-    if (typeof window === "undefined") return
-
-    try {
-      const stored = window.localStorage.getItem(`dyrected_pref_${key}`)
-      if (stored) {
-        setValue(JSON.parse(stored))
-      } else {
-        setValue(defaultValue)
-      }
-    } catch (e) {
-      console.warn(`[usePreferences] Error syncing key "${key}":`, e)
-    }
-  }, [key, defaultValue])
-
-  const updateValue = React.useCallback((updater: Updater<T>) => {
-    setValue((prev) => {
-      const newValue = typeof updater === 'function' 
-        ? (updater as (old: T) => T)(prev) 
-        : updater;
-      
-      if (typeof window !== "undefined") {
-        try {
-          window.localStorage.setItem(`dyrected_pref_${key}`, JSON.stringify(newValue))
-        } catch (e) {
-          console.warn(`[usePreferences] Error saving key "${key}":`, e)
-        }
-      }
-      return newValue;
-    });
-  }, [key]);
-
-  return [value, updateValue]
-}

package/src/index.css

@@ -1,111 +0,0 @@
-@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
-
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-  /* Design Tokens — Light Foundation, Amber Accent */
-  :root {
-    /* Fonts */
-    --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
-    --font-serif: "Instrument Serif", ui-serif, Georgia, serif;
-
-    /* Backgrounds */
-    --background: 60 17% 97%;          /* #FAFAF8 warm white */
-    --foreground: 60 3% 6%;            /* #111110 near-black, warm undertone */
-
-    --card: 60 10% 95%;                /* #F2F2EF soft grey surface */
-    --card-foreground: 60 3% 6%;
-
-    --popover: 60 17% 97%;
-    --popover-foreground: 60 3% 6%;
-
-    /* Primary — Amber (overridable via branding.primaryColor) */
-    --primary: 38 92% 50%;             /* #F59E0B amber */
-    --primary-foreground: 60 3% 6%;   /* dark text on amber */
-
-    /* Secondary — surface tones */
-    --secondary: 60 10% 95%;           /* #F2F2EF */
-    --secondary-foreground: 60 3% 6%;
-
-    /* Muted — for placeholders, subtle labels */
-    --muted: 60 10% 95%;
-    --muted-foreground: 60 4% 40%;    /* #6B6B63 brown-grey */
-
-    /* Accent — very subtle hover tint */
-    --accent: 60 10% 95%;
-    --accent-foreground: 60 3% 6%;
-
-    /* Destructive */
-    --destructive: 0 84% 60%;
-    --destructive-foreground: 60 17% 97%;
-
-    /* Borders & inputs */
-    --border: 60 7% 89%;               /* #E4E4E0 */
-    --input: 60 7% 89%;
-    --ring: 38 92% 50% / 0.15;        /* amber ring */
-
-    --radius: 0.5rem;
-
-    /* Sidebar */
-    --sidebar-background: 60 17% 97%;
-    --sidebar-foreground: 60 3% 6%;
-    --sidebar-primary: 38 92% 50%;
-    --sidebar-primary-foreground: 60 3% 6%;
-    --sidebar-accent: 60 10% 95%;
-    --sidebar-accent-foreground: 38 92% 50%;  /* amber for active items */
-    --sidebar-border: 60 7% 89%;
-    --sidebar-ring: 38 92% 50%;
-  }
-
-  .dy-admin-ui {
-    color-scheme: light;
-    @apply dy-font-sans;
-  }
-
-  .dy-admin-ui h1,
-  .dy-admin-ui h2,
-  .dy-admin-ui h3,
-  .dy-admin-ui h4,
-  .dy-admin-ui h5,
-  .dy-admin-ui h6 {
-    @apply dy-font-serif;
-  }
-}
-
-@layer utilities {
-  .dy-admin-ui .left-accent {
-    @apply dy-border-l-2 dy-border-primary/10 dy-px-4 dy--mx-8 dy-py-4 dy-transition-all dy-duration-200 dy-bg-transparent;
-  }
-
-  .dy-admin-ui .left-accent:hover {
-    @apply dy-border-l-primary dy-bg-primary/[0.04];
-  }
-
-  .dy-admin-ui .left-accent .left-accent {
-    @apply dy-px-4 dy--mx-4;
-  }
-
-  .dy-admin-ui .left-accent .left-accent .left-accent{
-    @apply dy-px-4 dy-mx-0;
-  }
-
-  .dy-admin-ui .flat-container {
-    @apply dy-bg-transparent dy-border-none dy-shadow-none dy-p-0;
-  }
-}
-
-@layer components {
-  .dy-admin-ui input,
-  .dy-admin-ui select,
-  .dy-admin-ui textarea {
-    @apply focus-visible:dy-ring-0 focus-visible:dy-ring-offset-0 focus-visible:dy-outline-none focus:dy-outline-none dy-border-border/60 dy-bg-transparent dy-transition-all;
-  }
-
-  .dy-admin-ui input:focus,
-  .dy-admin-ui select:focus,
-  .dy-admin-ui textarea:focus {
-    @apply dy-border-primary/50;
-  }
-}