@kyro-cms/admin 0.11.1 → 0.11.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyro-cms/admin",
-  "version": "0.11.1",
+  "version": "0.11.2",
   "engines": {
     "node": ">=22"
   },

package/src/components/fields/BlocksField.tsx

@@ -18,6 +18,7 @@ import {
   DndContext,
   closestCenter,
   PointerSensor,
+  TouchSensor,
   useSensor,
   useSensors,
   KeyboardSensor,
@@ -131,7 +132,7 @@ const SortableBlockComponent = ({
             }`}
         >
           <div
-            className="absolute left-0.5 top-1/2 -translate-y-1/2 p-0.5 cursor-grab active:cursor-grabbing text-[var(--kyro-text-muted)] opacity-0 group-hover:opacity-100 transition-opacity hover:bg-[var(--kyro-surface-accent)] rounded"
+            className="absolute left-0.5 top-1/2 -translate-y-1/2 p-0.5 cursor-grab active:cursor-grabbing text-[var(--kyro-text-muted)] opacity-0 group-hover:opacity-100 transition-opacity hover:bg-[var(--kyro-surface-accent)] rounded touch-none"
             {...attributes}
             {...listeners}
             onClick={(e) => e.stopPropagation()}
@@ -244,7 +245,7 @@ const SortableBlockComponent = ({
           }`}
       >
         <div
-          className="p-1 cursor-grab active:cursor-grabbing text-[var(--kyro-text-muted)] hover:bg-[var(--kyro-surface-accent)] rounded flex-shrink-0"
+          className="p-1 cursor-grab active:cursor-grabbing text-[var(--kyro-text-muted)] hover:bg-[var(--kyro-surface-accent)] rounded flex-shrink-0 touch-none"
           {...attributes}
           {...listeners}
           onClick={(e) => e.stopPropagation()}
@@ -549,6 +550,12 @@ export const BlocksField: React.FC<BlocksFieldProps> = ({
         distance: 3,
       },
     }),
+    useSensor(TouchSensor, {
+      activationConstraint: {
+        delay: 250,
+        tolerance: 5,
+      },
+    }),
     useSensor(KeyboardSensor),
   );
 

package/dist/index.d.cts

@@ -1,567 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { CollectionConfig, GlobalConfig, KyroConfig } from '@kyro-cms/core/client';
-import * as React$1 from 'react';
-import React__default, { ReactNode, ComponentType, SVGAttributes, ButtonHTMLAttributes } from 'react';
-import { CollectionConfig as CollectionConfig$1, Block, Field, FieldType } from '@kyro-cms/core';
-import { AstroIntegration } from 'astro';
-
-interface ThemeColors {
-    primary?: string;
-    secondary?: string;
-    accent?: string;
-    background?: string;
-    surface?: string;
-    text?: string;
-    textMuted?: string;
-    border?: string;
-    success?: string;
-    error?: string;
-    warning?: string;
-    info?: string;
-}
-interface ThemeTypography {
-    fontFamily?: string;
-    fontFamilyMono?: string;
-    fontSize?: {
-        xs?: string;
-        sm?: string;
-        md?: string;
-        lg?: string;
-        xl?: string;
-        "2xl"?: string;
-        "3xl"?: string;
-        "4xl"?: string;
-    };
-    fontWeight?: {
-        normal?: number;
-        medium?: number;
-        semibold?: number;
-        bold?: number;
-    };
-}
-interface ThemeSpacing {
-    xs?: string;
-    sm?: string;
-    md?: string;
-    lg?: string;
-    xl?: string;
-    "2xl"?: string;
-}
-interface ThemeRadius {
-    sm?: string;
-    md?: string;
-    lg?: string;
-    full?: string;
-}
-interface ThemeShadows {
-    sm?: string;
-    md?: string;
-    lg?: string;
-    xl?: string;
-}
-interface BlockThemeOverrides {
-    card?: {
-        background?: string;
-        borderRadius?: string;
-        padding?: string;
-        shadow?: string;
-    };
-    hero?: {
-        background?: string;
-        textAlign?: "left" | "center" | "right";
-    };
-    gallery?: {
-        gridColumns?: number;
-        gap?: string;
-    };
-    code?: {
-        fontFamily?: string;
-        fontSize?: string;
-        background?: string;
-    };
-}
-interface FieldThemeOverrides {
-    input?: {
-        background?: string;
-        border?: string;
-        borderRadius?: string;
-        padding?: string;
-        focusRing?: string;
-    };
-    select?: {
-        background?: string;
-        border?: string;
-    };
-    textarea?: {
-        background?: string;
-        minHeight?: string;
-    };
-    richText?: {
-        toolbarBackground?: string;
-        buttonActive?: string;
-    };
-    upload?: {
-        dropzoneBackground?: string;
-        dropzoneActive?: string;
-    };
-}
-interface KyroTheme {
-    id?: string;
-    label?: string;
-    colors?: ThemeColors;
-    typography?: ThemeTypography;
-    spacing?: ThemeSpacing;
-    borderRadius?: ThemeRadius;
-    shadows?: ThemeShadows;
-    blocks?: BlockThemeOverrides;
-    fields?: FieldThemeOverrides;
-}
-declare const LIGHT_THEME: KyroTheme;
-declare const DARK_THEME: KyroTheme;
-declare function mergeThemes(base: KyroTheme, overrides: Partial<KyroTheme>): KyroTheme;
-
-type ThemeMode = "light" | "dark" | "system";
-interface ThemeContextValue {
-    mode: ThemeMode;
-    theme: KyroTheme;
-    lightTheme: KyroTheme;
-    darkTheme: KyroTheme;
-    setMode: (mode: ThemeMode) => void;
-    updateTheme: (overrides: Partial<KyroTheme>) => void;
-    getCssVar: (key: string) => string;
-}
-declare function useTheme(): ThemeContextValue;
-interface ThemeProviderProps {
-    children: ReactNode;
-    defaultMode?: ThemeMode;
-    light?: Partial<KyroTheme>;
-    dark?: Partial<KyroTheme>;
-}
-declare function ThemeProvider({ children, defaultMode, light: lightOverrides, dark: darkOverrides, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
-declare const LightThemeProvider: (props: Omit<ThemeProviderProps, "defaultMode">) => react_jsx_runtime.JSX.Element;
-declare const DarkThemeProvider: (props: Omit<ThemeProviderProps, "defaultMode">) => react_jsx_runtime.JSX.Element;
-
-interface KyroAdminConfig {
-    collections?: CollectionConfig[] | Record<string, CollectionConfig>;
-    globals?: GlobalConfig[] | Record<string, GlobalConfig>;
-    adapter?: unknown;
-    name?: string;
-}
-interface AdminProps {
-    config: KyroAdminConfig;
-    theme?: ThemeMode;
-    onThemeChange?: (mode: ThemeMode) => void;
-}
-declare function Admin({ config, theme, onThemeChange }: AdminProps): react_jsx_runtime.JSX.Element;
-
-interface LoginPageProps {
-    onAuth: (token: string, user: Record<string, unknown>) => void;
-    theme?: ThemeMode;
-}
-declare function LoginPage({ onAuth, theme }: LoginPageProps): react_jsx_runtime.JSX.Element;
-
-interface ListViewProps {
-    collection: CollectionConfig$1;
-    collectionSlug?: string;
-    initialDocs?: any[];
-    initialTotal?: number;
-    onCreate?: () => void;
-    onEdit?: (id: string) => void;
-    config?: any;
-}
-/**
- * Unified ListView component used across both SPA (Admin.tsx) and MPA (Astro pages) modes.
- */
-declare function ListView({ collection, collectionSlug: providedSlug, initialDocs, initialTotal, onCreate: providedOnCreate, onEdit: providedOnEdit, config, }: ListViewProps): react_jsx_runtime.JSX.Element;
-
-interface DetailViewProps {
-    config: KyroConfig;
-    collection?: CollectionConfig;
-    global?: GlobalConfig;
-    documentId?: string;
-    onBack: () => void;
-    onSave: () => void;
-    onDelete?: () => void;
-    onError: (message: string) => void;
-    mode?: "collection" | "global";
-}
-declare function DetailView({ config, collection, global, documentId, onBack, onSave, onDelete, onError, mode, }: DetailViewProps): react_jsx_runtime.JSX.Element;
-
-interface CreateViewProps {
-    config: KyroConfig;
-    collection: CollectionConfig;
-    onCancel: () => void;
-    onSuccess: () => void;
-    onError: (message: string) => void;
-}
-declare function CreateView({ config, collection, onCancel, onSuccess, onError, }: CreateViewProps): react_jsx_runtime.JSX.Element;
-
-interface AutoFormProps {
-    config: CollectionConfig | GlobalConfig;
-    data?: Record<string, unknown>;
-    errors?: Record<string, string>;
-    onChange?: (data: Record<string, unknown>) => void;
-    disabled?: boolean;
-    collectionSlug?: string;
-    globalSlug?: string;
-    documentId?: string;
-    documentName?: string;
-    layout?: "split" | "single";
-    onActionSuccess?: (message: string) => void;
-    onActionError?: (message: string) => void;
-    justSaved?: boolean;
-    documentStatus?: string;
-}
-declare function AutoForm({ config: propConfig, data: initialData, errors, onChange, disabled: propDisabled, collectionSlug, globalSlug, documentId, documentName, layout, onActionSuccess, onActionError, justSaved, }: AutoFormProps): react_jsx_runtime.JSX.Element;
-
-type DocumentStatus = "draft" | "published" | "scheduled" | "archived";
-type SaveStatus = "idle" | "saving" | "saved" | "error";
-interface ActionBarProps {
-    status: DocumentStatus;
-    saveStatus: SaveStatus;
-    hasChanges: boolean;
-    onSave: () => void;
-    onPublish?: () => void;
-    onUnpublish?: () => void;
-    onDuplicate?: () => void;
-    onViewHistory?: () => void;
-    onPreview?: () => void;
-    onDelete?: () => void;
-    onBack?: () => void;
-    onToggleSidebar?: () => void;
-    publishedAt?: string | null;
-    updatedAt?: string | null;
-}
-declare function ActionBar({ status, saveStatus, hasChanges, onSave, onPublish, onUnpublish, onDuplicate, onViewHistory, onPreview, onDelete, onBack, onToggleSidebar, publishedAt, updatedAt, }: ActionBarProps): react_jsx_runtime.JSX.Element;
-
-interface BulkAction {
-    label: string;
-    onClick: () => void;
-    icon?: React__default.ReactNode;
-    danger?: boolean;
-}
-interface BulkActionsBarProps {
-    selectedCount: number;
-    onClearSelection: () => void;
-    actions: BulkAction[];
-    onSelectAll?: () => void;
-}
-declare function BulkActionsBar({ selectedCount, onClearSelection, actions, onSelectAll, }: BulkActionsBarProps): react_jsx_runtime.JSX.Element | null;
-
-type BadgeVariant = "default" | "success" | "warning" | "danger" | "info" | "outline" | "draft" | "published" | "scheduled" | "archived" | "active" | "inactive" | "pending" | "completed" | "cancelled";
-interface BadgeProps {
-    variant?: BadgeVariant;
-    status?: BadgeVariant;
-    className?: string;
-    children?: ReactNode;
-    dot?: boolean;
-}
-declare function Badge({ variant, status, className, children, dot, }: BadgeProps): react_jsx_runtime.JSX.Element;
-declare function CountBadge({ count, max }: {
-    count: number;
-    max?: number;
-}): react_jsx_runtime.JSX.Element | null;
-
-interface Breadcrumb {
-    label: string;
-    href?: string;
-    onClick?: () => void;
-}
-interface Action {
-    label: string;
-    onClick: () => void;
-    icon?: ComponentType<SVGAttributes<SVGSVGElement>>;
-    variant?: "primary" | "outline" | "ghost";
-    className?: string;
-}
-interface PageHeaderProps {
-    title?: string;
-    description?: string;
-    icon?: ComponentType<SVGAttributes<SVGSVGElement>>;
-    breadcrumbs?: Breadcrumb[];
-    metadata?: ReactNode[];
-    back?: {
-        label?: string;
-        href?: string;
-        onClick?: () => void;
-    };
-    action?: Action;
-    actions?: ReactNode | Action[];
-    children?: ReactNode;
-}
-declare function PageHeader({ title, description, icon: Icon, breadcrumbs, metadata, back, action, actions, children, }: PageHeaderProps): react_jsx_runtime.JSX.Element;
-
-interface Version {
-    id: string;
-    version: number;
-    createdAt: string;
-    updatedAt: string;
-    createdBy?: {
-        id: string;
-        name: string;
-        email?: string;
-    };
-    status: "draft" | "published";
-    changelog?: string;
-}
-interface VersionHistoryPanelProps {
-    open: boolean;
-    onClose: () => void;
-    versions: Version[];
-    currentVersionId?: string;
-    onPreview: (version: Version) => void;
-    onRestore: (version: Version) => void;
-    onCompare?: (v1: Version, v2: Version) => void;
-    loading?: boolean;
-}
-declare function VersionHistoryPanel({ open, onClose, versions, currentVersionId, onPreview, onRestore, onCompare, loading, }: VersionHistoryPanelProps): react_jsx_runtime.JSX.Element;
-
-interface HeaderProps {
-    title: string;
-    onMenuClick: () => void;
-    actions?: ReactNode;
-}
-declare function Header({ title, onMenuClick, actions }: HeaderProps): react_jsx_runtime.JSX.Element;
-
-interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
-    size?: 'sm' | 'md' | 'lg';
-    loading?: boolean;
-    children: ReactNode;
-}
-declare function Button({ variant, size, loading, children, className, disabled, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
-
-interface SpinnerProps {
-    size?: "sm" | "md" | "lg";
-    className?: string;
-}
-declare function Spinner({ size, className }: SpinnerProps): react_jsx_runtime.JSX.Element;
-
-interface Toast$1 {
-    id: string;
-    type: "success" | "error" | "warning" | "info";
-    message: string;
-}
-
-type ToastType = "success" | "error" | "warning" | "info";
-interface ToastProps {
-    type: ToastType;
-    message: string;
-    onClose: () => void;
-}
-declare function Toast({ type, message, onClose }: ToastProps): react_jsx_runtime.JSX.Element;
-interface ToastProviderProps {
-    children: ReactNode;
-}
-declare function ToastProvider({ children }: ToastProviderProps): react_jsx_runtime.JSX.Element;
-declare function useToast(): {
-    toasts: Toast$1[];
-    addToast: (type: Toast$1["type"], message: string) => void;
-    removeToast: (id: string) => void;
-};
-
-interface DropdownProps {
-    trigger: ReactNode;
-    children: ReactNode;
-    align?: "left" | "right";
-    direction?: "up" | "down";
-}
-declare function Dropdown({ trigger, children, align, direction, }: DropdownProps): react_jsx_runtime.JSX.Element;
-interface DropdownItemProps {
-    children: ReactNode;
-    onClick?: () => void;
-    icon?: ReactNode;
-    danger?: boolean;
-    disabled?: boolean;
-    className?: string;
-}
-declare function DropdownItem({ children, onClick, icon, danger, disabled, className, }: DropdownItemProps): react_jsx_runtime.JSX.Element;
-declare function DropdownSeparator(): react_jsx_runtime.JSX.Element;
-
-interface ModalProps {
-    open: boolean;
-    onClose: () => void;
-    title: string;
-    children: ReactNode;
-    footer?: ReactNode;
-    size?: "sm" | "md" | "lg" | "full";
-    variant?: "default" | "danger" | "lightbox";
-}
-declare function Modal({ open, onClose, title, children, footer, size, variant, }: ModalProps): React__default.ReactPortal | null;
-interface ConfirmModalProps {
-    open: boolean;
-    onClose: () => void;
-    onConfirm: () => void;
-    title: string;
-    message: string;
-    confirmLabel?: string;
-    cancelLabel?: string;
-    variant?: "default" | "danger";
-    loading?: boolean;
-}
-declare function ConfirmModal({ open, onClose, onConfirm, title, message, confirmLabel, cancelLabel, variant, loading, }: ConfirmModalProps): react_jsx_runtime.JSX.Element;
-
-interface SlidePanelProps {
-    open: boolean;
-    onClose: () => void;
-    title: string;
-    subtitle?: string;
-    size?: "sm" | "md" | "lg" | "xl";
-    children: ReactNode;
-    width?: "sm" | "md" | "lg" | "xl";
-    showOverlay?: boolean;
-    accentClass?: string;
-}
-declare function SlidePanel({ open, onClose, title, children, width, showOverlay, accentClass, }: SlidePanelProps): React__default.ReactPortal | null;
-
-interface AuthUser {
-    id: string;
-    email: string;
-    role: string;
-    tenantId?: string;
-}
-interface TenantInfo {
-    id: string;
-    slug: string;
-    name: string;
-}
-interface AdminContext {
-    user: AuthUser | null;
-    tenant: TenantInfo | null;
-    config: Record<string, unknown>;
-    api: {
-        baseUrl: string;
-        token: string | null;
-    };
-}
-interface HookResult {
-    success: boolean;
-    error?: string;
-}
-type LifecycleHook = (ctx: AdminContext) => void | HookResult | Promise<void | HookResult>;
-
-declare function onAdminReady(hook: LifecycleHook): () => void;
-declare function beforeDeploy(hook: LifecycleHook): () => void;
-declare function afterDeploy(hook: (ctx: AdminContext, result: HookResult) => void): () => void;
-declare function emitAdminReady(ctx: AdminContext): Promise<HookResult[]>;
-declare function emitBeforeDeploy(ctx: AdminContext): Promise<HookResult[]>;
-declare function emitAfterDeploy(ctx: AdminContext, result: HookResult): Promise<void>;
-
-interface QueryOptions {
-    page?: number;
-    limit?: number;
-    filter?: Record<string, unknown>;
-    sort?: string;
-    order?: "asc" | "desc";
-}
-interface QueryResult<T> {
-    data: T | null;
-    loading: boolean;
-    error: string | null;
-    refetch: () => Promise<void>;
-}
-interface MutationResult {
-    mutate: (data?: Record<string, unknown>) => Promise<Record<string, unknown> | null>;
-    loading: boolean;
-    error: string | null;
-}
-declare function useKyroQuery<T = Record<string, unknown>>(slug: string, options?: QueryOptions): QueryResult<T>;
-declare function useKyroMutation(slug: string, method?: "POST" | "PATCH" | "DELETE"): MutationResult;
-
-interface KyroPlugin {
-    name: string;
-    version: string;
-    description?: string;
-    apply?: (config: Record<string, unknown>) => void;
-    hooks?: {
-        onAdminReady?: (ctx: AdminContext) => void | HookResult | Promise<void | HookResult>;
-        beforeDeploy?: (ctx: AdminContext) => void | HookResult | Promise<void | HookResult>;
-        afterDeploy?: (ctx: AdminContext, result: HookResult) => void | Promise<void>;
-        beforeRender?: (ctx: AdminContext) => void;
-        afterRender?: (ctx: AdminContext) => void;
-    };
-}
-
-declare function registerPlugin(plugin: KyroPlugin): void;
-declare function unregisterPlugin(name: string): void;
-declare function getPlugin(name: string): KyroPlugin | undefined;
-declare function getPlugins(): KyroPlugin[];
-declare function getPluginsWithHook<K extends keyof NonNullable<KyroPlugin["hooks"]>>(hookName: K): KyroPlugin[];
-
-interface BlockRenderProps {
-    data: Record<string, unknown>;
-    context: {
-        theme: KyroTheme;
-        locale: string;
-        isPreview: boolean;
-    };
-}
-interface KyroBlock extends Omit<Block, "fields" | "slug"> {
-    id: string;
-    label: string;
-    category?: string;
-    icon?: ReactNode;
-    schema: Field[];
-    render: (props: BlockRenderProps) => ReactNode;
-    preview?: (props: BlockRenderProps) => ReactNode;
-    settings?: Record<string, unknown>;
-}
-
-declare function registerBlock(block: KyroBlock): void;
-declare function unregisterBlock(id: string): void;
-declare function getBlock(id: string): KyroBlock | undefined;
-declare function getBlocks(): KyroBlock[];
-declare function getBlocksByCategory(category: string): KyroBlock[];
-declare function useBlockRenderer(id: string): ((props: BlockRenderProps) => React$1.ReactNode) | null;
-
-interface FieldEditorProps {
-    name: string;
-    label: string;
-    value: unknown;
-    onChange: (value: unknown) => void;
-    onBlur?: () => void;
-    error?: string;
-    required?: boolean;
-    disabled?: boolean;
-    schema?: Record<string, unknown>;
-}
-interface KyroField {
-    id: string;
-    type: FieldType;
-    label?: string;
-    editor: React.ComponentType<FieldEditorProps>;
-    schema?: Record<string, unknown>;
-    defaultValue?: unknown;
-    validate?: (value: unknown) => string | null;
-}
-
-declare function registerField(field: KyroField): void;
-declare function unregisterField(id: string): void;
-declare function getField(id: string): KyroField | undefined;
-declare function getFields(): KyroField[];
-declare function getFieldByType(type: FieldType): KyroField | undefined;
-declare function useFieldRenderer(fieldId: string, props: Omit<FieldEditorProps, "onChange"> & {
-    onChange?: (value: unknown) => void;
-}): ReactNode | null;
-
-interface KyroAdminOptions {
-    basePath?: string;
-    apiPath?: string;
-    configPath?: string;
-}
-declare function kyroAdmin(options?: KyroAdminOptions): AstroIntegration;
-
-declare const adminPath: string;
-declare const apiPath: string;
-declare function resolveApi(url: string): string;
-declare function resolveAdmin(url: string): string;
-declare function resolveMedia(url: unknown): string;
-declare const paths: {
-    readonly admin: string;
-    readonly api: string;
-    readonly resolveApi: typeof resolveApi;
-    readonly resolveAdmin: typeof resolveAdmin;
-    readonly resolveMedia: typeof resolveMedia;
-};
-
-export { ActionBar, type ActionBarProps, Admin, type AdminContext, type AuthUser, AutoForm, Badge, type BadgeVariant, type BlockRenderProps, type BlockThemeOverrides, BulkActionsBar, Button, ConfirmModal, CountBadge, CreateView, DARK_THEME, DarkThemeProvider, DetailView, type DocumentStatus, Dropdown, DropdownItem, DropdownSeparator, DarkThemeProvider as ExtDarkThemeProvider, LightThemeProvider as ExtLightThemeProvider, type ThemeMode as ExtThemeMode, ThemeProvider as ExtThemeProvider, type FieldEditorProps, type FieldThemeOverrides, Header, type HookResult, type KyroAdminOptions, type KyroBlock, type KyroField, type KyroPlugin, type KyroTheme, LIGHT_THEME, type LifecycleHook, LightThemeProvider, ListView, LoginPage, Modal, type MutationResult, PageHeader, type QueryOptions, type QueryResult, type SaveStatus, SlidePanel, Spinner, type TenantInfo, type ThemeColors, type ThemeMode, ThemeProvider, type ThemeRadius, type ThemeShadows, type ThemeSpacing, type ThemeTypography, Toast, ToastProvider, VersionHistoryPanel, adminPath, afterDeploy, apiPath, beforeDeploy, emitAdminReady, emitAfterDeploy, emitBeforeDeploy, getBlock, getBlocks, getBlocksByCategory, getField, getFieldByType, getFields, getPlugin, getPlugins, getPluginsWithHook, kyroAdmin, mergeThemes, onAdminReady, paths, registerBlock, registerField, registerPlugin, resolveAdmin, resolveApi, unregisterBlock, unregisterField, unregisterPlugin, useBlockRenderer, useTheme as useExtTheme, useFieldRenderer, useKyroMutation, useKyroQuery, useTheme, useToast };