klun-ui 0.3.0 → 0.4.0

package/dist/templates/index.d.cts

@@ -58,13 +58,24 @@ interface MetronicNavItem {
     children?: MetronicNavChild[];
     /** Render a hairline above this item (section break). */
     dividerBefore?: boolean;
+    /** The current role can't open this screen — shown with a lock and routed to a 403. */
+    locked?: boolean;
 }
 interface MetronicSidebarProps {
     /** Active item key. */
     active: string;
     onNavigate: (key: string) => void;
-}
-declare function MetronicSidebar({ active, onNavigate }: MetronicSidebarProps): react.JSX.Element;
+    /** Live badges overriding the static ones, e.g. `{ messages: "3" }`. */
+    badges?: Record<string, string | number | undefined>;
+    /** Keys the current role can't access — rendered with a lock. */
+    lockedKeys?: string[];
+    /** Icon-only rail. */
+    collapsed?: boolean;
+    onToggleCollapsed?: () => void;
+    /** Role shown in the user card. */
+    roleLabel?: string;
+}
+declare function MetronicSidebar({ active, onNavigate, badges, lockedKeys, collapsed, onToggleCollapsed, roleLabel }: MetronicSidebarProps): react.JSX.Element;
 
 /** Accent skins shipped by the design system (`data-mode`). */
 declare const DEMO_SKINS: readonly ["metronic", "blue", "purple", "orange", "green", "slate"];
@@ -192,6 +203,94 @@ interface AuditScreenProps {
 }
 declare function AuditScreen({ initialActor }?: AuditScreenProps): react.JSX.Element;
 
+interface MessagesScreenProps {
+    /** Total unread in the inbox — drives the sidebar badge. */
+    onUnreadChange?: (unread: number) => void;
+}
+declare function MessagesScreen({ onUnreadChange }?: MessagesScreenProps): react.JSX.Element;
+
+interface ApprovalsScreenProps {
+    /** Jump to the audit log filtered by the requester of the decision. */
+    onOpenAudit?: (requester: string) => void;
+}
+declare function ApprovalsScreen({ onOpenAudit }?: ApprovalsScreenProps): react.JSX.Element;
+
+interface TicketsScreenProps {
+    /** Quick jump into the audit log for this requester. */
+    onOpenAudit?: (actor: string) => void;
+}
+declare function TicketsScreen({ onOpenAudit }?: TicketsScreenProps): react.JSX.Element;
+
+declare function CalendarScreen(): react.JSX.Element;
+
+interface SearchScreenProps {
+    /** Jump to the screen owning a hit. */
+    onNavigate?: (key: string) => void;
+}
+declare function SearchScreen({ onNavigate }?: SearchScreenProps): react.JSX.Element;
+
+interface WorkspaceSecurityScreenProps {
+    /** Forward the admin to the audit log filtered by this actor. */
+    onOpenAudit?: (actor: string) => void;
+}
+declare function WorkspaceSecurityScreen({ onOpenAudit }?: WorkspaceSecurityScreenProps): react.JSX.Element;
+
+interface IntegrationsScreenProps {
+    onOpenAudit?: (actor: string) => void;
+}
+declare function IntegrationsScreen({ onOpenAudit }?: IntegrationsScreenProps): react.JSX.Element;
+
+declare function FeatureFlagsScreen(): react.JSX.Element;
+
+declare function TemplatesScreen(): react.JSX.Element;
+
+declare function ImportExportScreen(): react.JSX.Element;
+
+type MailFolder = "inbox" | "sent" | "drafts" | "archived";
+type MailView = MailFolder | "starred";
+declare const FOLDER_LABELS: Record<MailFolder, string>;
+declare const FOLDER_ICONS: Record<MailFolder, string>;
+declare const MAIL_LABELS: readonly ["Finance", "Design", "Support", "Engineering", "Alerts", "Product"];
+type MailLabel = (typeof MAIL_LABELS)[number];
+declare const LABEL_COLOR: Record<MailLabel, "blue" | "purple" | "orange" | "teal" | "red" | "green">;
+interface MailAttachment {
+    id: string;
+    name: string;
+    size: string;
+    icon: string;
+}
+interface MailMessage {
+    id: string;
+    /** Sender display name — `"You"` for the signed-in user. */
+    from: string;
+    to: string[];
+    cc?: string[];
+    at: string;
+    body: string;
+    attachments?: MailAttachment[];
+}
+interface MailThread {
+    id: string;
+    subject: string;
+    folder: MailFolder;
+    labels: MailLabel[];
+    starred: boolean;
+    priority: "normal" | "high";
+    updatedAt: string;
+    /** Unread messages for the signed-in user. */
+    unread: number;
+    messages: MailMessage[];
+}
+/** Teammates you can write to (everyone except yourself). */
+declare const RECIPIENTS: {
+    name: string;
+    email: string;
+    title: string;
+    department: string;
+}[];
+declare const INITIAL_THREADS: MailThread[];
+declare const totalUnread: (threads: MailThread[]) => number;
+
 type UserStatus = "Active" | "Invited" | "Suspended" | "Locked";
 type RoleId = "Owner" | "Admin" | "Manager" | "Editor" | "Viewer" | "Support";
 interface UserSession {
@@ -434,4 +533,4 @@ interface MetronicSettingsTemplateProps {
 }
 declare function MetronicSettingsTemplate({ section, defaultSection, onSectionChange, maxWidth, }?: MetronicSettingsTemplateProps): react.JSX.Element;
 
-export { AIAssistantTemplate, ALL_PERMISSIONS, AccountSection, AgentChatTemplate, ApiKeysSection, AreaChart, type AreaChartProps, AuditScreen, type AuditScreenProps, BarChart, type BarChartProps, BillingSection, CATEGORIES, CalendarTemplate, type ChartTone, CryptoTemplate, CustomersScreen, DEMO_SKINS, DEMO_TEXT, DEPARTMENTS, DashboardScreen, type DashboardScreenProps, DashboardTemplate, type DemoNotification, type DemoPageCopy, type DemoSkin, type DemoText, type DemoUser, DepartmentFilter, type DepartmentFilterProps, type DepartmentOption, DepartmentsScreen, type DepartmentsScreenProps, DonutChart, type DonutChartProps, INITIAL_USERS, Kpi, type KpiProps, LOCALE_OPTIONS, MarketingTemplate, MetronicDashboardTemplate, type MetronicNavChild, type MetronicNavItem, MetronicSettingsTemplate, type MetronicSettingsTemplateProps, MetronicSidebar, type MetronicSidebarProps, MetronicTopBar, type MetronicTopBarProps, MiniStat, type MiniStatProps, NotificationsSection, type NotificationsSectionProps, OrdersScreen, type OrdersScreenProps, OverviewScreen, PageHeader, type PageHeaderProps, type PermissionOverride, PricingTemplate, type Product, type ProductDraft, type ProductStatus, ProductWizardPage, type ProductWizardPageProps, ProductsScreen, ProfileSection, type ProfileSectionProps, ROLE_COLOR, ROLE_IDS, ROLE_PERMISSIONS, RTL_LOCALES, ReportsScreen, type ReportsView, type RoleId, RoleTreeScreen, type RoleTreeScreenProps, RolesScreen, SETTINGS_NAV, STATUS_COLOR, type SettingsNavItem, SettingsScreen, type SettingsSectionKey, SettingsTemplate, Sidebar, type SidebarProps, type SidebarUser, Sparkline, type SparklineProps, TasksScreen, TopBar, type TopBarProps, USER_STATUSES, USER_STATUS_COLOR, type UserActivity, UserDetailDrawer, type UserDetailDrawerProps, type UserSession, type UserStatus, UsersScreen, demoTextFor, departmentChildren, departmentDepth, departmentIdsWithChildren, departmentName, departmentPath, deriveStatus, effectivePermissions, emptyDraft, rolePermissions, useDemoText };
+export { AIAssistantTemplate, ALL_PERMISSIONS, AccountSection, AgentChatTemplate, ApiKeysSection, ApprovalsScreen, type ApprovalsScreenProps, AreaChart, type AreaChartProps, AuditScreen, type AuditScreenProps, BarChart, type BarChartProps, BillingSection, CATEGORIES, CalendarScreen, CalendarTemplate, type ChartTone, CryptoTemplate, CustomersScreen, DEMO_SKINS, DEMO_TEXT, DEPARTMENTS, DashboardScreen, type DashboardScreenProps, DashboardTemplate, type DemoNotification, type DemoPageCopy, type DemoSkin, type DemoText, type DemoUser, DepartmentFilter, type DepartmentFilterProps, type DepartmentOption, DepartmentsScreen, type DepartmentsScreenProps, DonutChart, type DonutChartProps, FOLDER_ICONS, FOLDER_LABELS, FeatureFlagsScreen, INITIAL_THREADS, INITIAL_USERS, ImportExportScreen, IntegrationsScreen, type IntegrationsScreenProps, Kpi, type KpiProps, LABEL_COLOR, LOCALE_OPTIONS, MAIL_LABELS, type MailAttachment, type MailFolder, type MailLabel, type MailMessage, type MailThread, type MailView, MarketingTemplate, MessagesScreen, type MessagesScreenProps, MetronicDashboardTemplate, type MetronicNavChild, type MetronicNavItem, MetronicSettingsTemplate, type MetronicSettingsTemplateProps, MetronicSidebar, type MetronicSidebarProps, MetronicTopBar, type MetronicTopBarProps, MiniStat, type MiniStatProps, NotificationsSection, type NotificationsSectionProps, OrdersScreen, type OrdersScreenProps, OverviewScreen, PageHeader, type PageHeaderProps, type PermissionOverride, PricingTemplate, type Product, type ProductDraft, type ProductStatus, ProductWizardPage, type ProductWizardPageProps, ProductsScreen, ProfileSection, type ProfileSectionProps, RECIPIENTS, ROLE_COLOR, ROLE_IDS, ROLE_PERMISSIONS, RTL_LOCALES, ReportsScreen, type ReportsView, type RoleId, RoleTreeScreen, type RoleTreeScreenProps, RolesScreen, SETTINGS_NAV, STATUS_COLOR, SearchScreen, type SearchScreenProps, type SettingsNavItem, SettingsScreen, type SettingsSectionKey, SettingsTemplate, Sidebar, type SidebarProps, type SidebarUser, Sparkline, type SparklineProps, TasksScreen, TemplatesScreen, TicketsScreen, type TicketsScreenProps, TopBar, type TopBarProps, USER_STATUSES, USER_STATUS_COLOR, type UserActivity, UserDetailDrawer, type UserDetailDrawerProps, type UserSession, type UserStatus, UsersScreen, WorkspaceSecurityScreen, type WorkspaceSecurityScreenProps, demoTextFor, departmentChildren, departmentDepth, departmentIdsWithChildren, departmentName, departmentPath, deriveStatus, effectivePermissions, emptyDraft, rolePermissions, totalUnread, useDemoText };

package/dist/templates/index.d.ts

@@ -58,13 +58,24 @@ interface MetronicNavItem {
     children?: MetronicNavChild[];
     /** Render a hairline above this item (section break). */
     dividerBefore?: boolean;
+    /** The current role can't open this screen — shown with a lock and routed to a 403. */
+    locked?: boolean;
 }
 interface MetronicSidebarProps {
     /** Active item key. */
     active: string;
     onNavigate: (key: string) => void;
-}
-declare function MetronicSidebar({ active, onNavigate }: MetronicSidebarProps): react.JSX.Element;
+    /** Live badges overriding the static ones, e.g. `{ messages: "3" }`. */
+    badges?: Record<string, string | number | undefined>;
+    /** Keys the current role can't access — rendered with a lock. */
+    lockedKeys?: string[];
+    /** Icon-only rail. */
+    collapsed?: boolean;
+    onToggleCollapsed?: () => void;
+    /** Role shown in the user card. */
+    roleLabel?: string;
+}
+declare function MetronicSidebar({ active, onNavigate, badges, lockedKeys, collapsed, onToggleCollapsed, roleLabel }: MetronicSidebarProps): react.JSX.Element;
 
 /** Accent skins shipped by the design system (`data-mode`). */
 declare const DEMO_SKINS: readonly ["metronic", "blue", "purple", "orange", "green", "slate"];
@@ -192,6 +203,94 @@ interface AuditScreenProps {
 }
 declare function AuditScreen({ initialActor }?: AuditScreenProps): react.JSX.Element;
 
+interface MessagesScreenProps {
+    /** Total unread in the inbox — drives the sidebar badge. */
+    onUnreadChange?: (unread: number) => void;
+}
+declare function MessagesScreen({ onUnreadChange }?: MessagesScreenProps): react.JSX.Element;
+
+interface ApprovalsScreenProps {
+    /** Jump to the audit log filtered by the requester of the decision. */
+    onOpenAudit?: (requester: string) => void;
+}
+declare function ApprovalsScreen({ onOpenAudit }?: ApprovalsScreenProps): react.JSX.Element;
+
+interface TicketsScreenProps {
+    /** Quick jump into the audit log for this requester. */
+    onOpenAudit?: (actor: string) => void;
+}
+declare function TicketsScreen({ onOpenAudit }?: TicketsScreenProps): react.JSX.Element;
+
+declare function CalendarScreen(): react.JSX.Element;
+
+interface SearchScreenProps {
+    /** Jump to the screen owning a hit. */
+    onNavigate?: (key: string) => void;
+}
+declare function SearchScreen({ onNavigate }?: SearchScreenProps): react.JSX.Element;
+
+interface WorkspaceSecurityScreenProps {
+    /** Forward the admin to the audit log filtered by this actor. */
+    onOpenAudit?: (actor: string) => void;
+}
+declare function WorkspaceSecurityScreen({ onOpenAudit }?: WorkspaceSecurityScreenProps): react.JSX.Element;
+
+interface IntegrationsScreenProps {
+    onOpenAudit?: (actor: string) => void;
+}
+declare function IntegrationsScreen({ onOpenAudit }?: IntegrationsScreenProps): react.JSX.Element;
+
+declare function FeatureFlagsScreen(): react.JSX.Element;
+
+declare function TemplatesScreen(): react.JSX.Element;
+
+declare function ImportExportScreen(): react.JSX.Element;
+
+type MailFolder = "inbox" | "sent" | "drafts" | "archived";
+type MailView = MailFolder | "starred";
+declare const FOLDER_LABELS: Record<MailFolder, string>;
+declare const FOLDER_ICONS: Record<MailFolder, string>;
+declare const MAIL_LABELS: readonly ["Finance", "Design", "Support", "Engineering", "Alerts", "Product"];
+type MailLabel = (typeof MAIL_LABELS)[number];
+declare const LABEL_COLOR: Record<MailLabel, "blue" | "purple" | "orange" | "teal" | "red" | "green">;
+interface MailAttachment {
+    id: string;
+    name: string;
+    size: string;
+    icon: string;
+}
+interface MailMessage {
+    id: string;
+    /** Sender display name — `"You"` for the signed-in user. */
+    from: string;
+    to: string[];
+    cc?: string[];
+    at: string;
+    body: string;
+    attachments?: MailAttachment[];
+}
+interface MailThread {
+    id: string;
+    subject: string;
+    folder: MailFolder;
+    labels: MailLabel[];
+    starred: boolean;
+    priority: "normal" | "high";
+    updatedAt: string;
+    /** Unread messages for the signed-in user. */
+    unread: number;
+    messages: MailMessage[];
+}
+/** Teammates you can write to (everyone except yourself). */
+declare const RECIPIENTS: {
+    name: string;
+    email: string;
+    title: string;
+    department: string;
+}[];
+declare const INITIAL_THREADS: MailThread[];
+declare const totalUnread: (threads: MailThread[]) => number;
+
 type UserStatus = "Active" | "Invited" | "Suspended" | "Locked";
 type RoleId = "Owner" | "Admin" | "Manager" | "Editor" | "Viewer" | "Support";
 interface UserSession {
@@ -434,4 +533,4 @@ interface MetronicSettingsTemplateProps {
 }
 declare function MetronicSettingsTemplate({ section, defaultSection, onSectionChange, maxWidth, }?: MetronicSettingsTemplateProps): react.JSX.Element;
 
-export { AIAssistantTemplate, ALL_PERMISSIONS, AccountSection, AgentChatTemplate, ApiKeysSection, AreaChart, type AreaChartProps, AuditScreen, type AuditScreenProps, BarChart, type BarChartProps, BillingSection, CATEGORIES, CalendarTemplate, type ChartTone, CryptoTemplate, CustomersScreen, DEMO_SKINS, DEMO_TEXT, DEPARTMENTS, DashboardScreen, type DashboardScreenProps, DashboardTemplate, type DemoNotification, type DemoPageCopy, type DemoSkin, type DemoText, type DemoUser, DepartmentFilter, type DepartmentFilterProps, type DepartmentOption, DepartmentsScreen, type DepartmentsScreenProps, DonutChart, type DonutChartProps, INITIAL_USERS, Kpi, type KpiProps, LOCALE_OPTIONS, MarketingTemplate, MetronicDashboardTemplate, type MetronicNavChild, type MetronicNavItem, MetronicSettingsTemplate, type MetronicSettingsTemplateProps, MetronicSidebar, type MetronicSidebarProps, MetronicTopBar, type MetronicTopBarProps, MiniStat, type MiniStatProps, NotificationsSection, type NotificationsSectionProps, OrdersScreen, type OrdersScreenProps, OverviewScreen, PageHeader, type PageHeaderProps, type PermissionOverride, PricingTemplate, type Product, type ProductDraft, type ProductStatus, ProductWizardPage, type ProductWizardPageProps, ProductsScreen, ProfileSection, type ProfileSectionProps, ROLE_COLOR, ROLE_IDS, ROLE_PERMISSIONS, RTL_LOCALES, ReportsScreen, type ReportsView, type RoleId, RoleTreeScreen, type RoleTreeScreenProps, RolesScreen, SETTINGS_NAV, STATUS_COLOR, type SettingsNavItem, SettingsScreen, type SettingsSectionKey, SettingsTemplate, Sidebar, type SidebarProps, type SidebarUser, Sparkline, type SparklineProps, TasksScreen, TopBar, type TopBarProps, USER_STATUSES, USER_STATUS_COLOR, type UserActivity, UserDetailDrawer, type UserDetailDrawerProps, type UserSession, type UserStatus, UsersScreen, demoTextFor, departmentChildren, departmentDepth, departmentIdsWithChildren, departmentName, departmentPath, deriveStatus, effectivePermissions, emptyDraft, rolePermissions, useDemoText };
+export { AIAssistantTemplate, ALL_PERMISSIONS, AccountSection, AgentChatTemplate, ApiKeysSection, ApprovalsScreen, type ApprovalsScreenProps, AreaChart, type AreaChartProps, AuditScreen, type AuditScreenProps, BarChart, type BarChartProps, BillingSection, CATEGORIES, CalendarScreen, CalendarTemplate, type ChartTone, CryptoTemplate, CustomersScreen, DEMO_SKINS, DEMO_TEXT, DEPARTMENTS, DashboardScreen, type DashboardScreenProps, DashboardTemplate, type DemoNotification, type DemoPageCopy, type DemoSkin, type DemoText, type DemoUser, DepartmentFilter, type DepartmentFilterProps, type DepartmentOption, DepartmentsScreen, type DepartmentsScreenProps, DonutChart, type DonutChartProps, FOLDER_ICONS, FOLDER_LABELS, FeatureFlagsScreen, INITIAL_THREADS, INITIAL_USERS, ImportExportScreen, IntegrationsScreen, type IntegrationsScreenProps, Kpi, type KpiProps, LABEL_COLOR, LOCALE_OPTIONS, MAIL_LABELS, type MailAttachment, type MailFolder, type MailLabel, type MailMessage, type MailThread, type MailView, MarketingTemplate, MessagesScreen, type MessagesScreenProps, MetronicDashboardTemplate, type MetronicNavChild, type MetronicNavItem, MetronicSettingsTemplate, type MetronicSettingsTemplateProps, MetronicSidebar, type MetronicSidebarProps, MetronicTopBar, type MetronicTopBarProps, MiniStat, type MiniStatProps, NotificationsSection, type NotificationsSectionProps, OrdersScreen, type OrdersScreenProps, OverviewScreen, PageHeader, type PageHeaderProps, type PermissionOverride, PricingTemplate, type Product, type ProductDraft, type ProductStatus, ProductWizardPage, type ProductWizardPageProps, ProductsScreen, ProfileSection, type ProfileSectionProps, RECIPIENTS, ROLE_COLOR, ROLE_IDS, ROLE_PERMISSIONS, RTL_LOCALES, ReportsScreen, type ReportsView, type RoleId, RoleTreeScreen, type RoleTreeScreenProps, RolesScreen, SETTINGS_NAV, STATUS_COLOR, SearchScreen, type SearchScreenProps, type SettingsNavItem, SettingsScreen, type SettingsSectionKey, SettingsTemplate, Sidebar, type SidebarProps, type SidebarUser, Sparkline, type SparklineProps, TasksScreen, TemplatesScreen, TicketsScreen, type TicketsScreenProps, TopBar, type TopBarProps, USER_STATUSES, USER_STATUS_COLOR, type UserActivity, UserDetailDrawer, type UserDetailDrawerProps, type UserSession, type UserStatus, UsersScreen, WorkspaceSecurityScreen, type WorkspaceSecurityScreenProps, demoTextFor, departmentChildren, departmentDepth, departmentIdsWithChildren, departmentName, departmentPath, deriveStatus, effectivePermissions, emptyDraft, rolePermissions, totalUnread, useDemoText };