@vef-framework/starter 2.0.11 → 2.1.0

package/dist/types/src/components/layout/components/menu.d.ts

@@ -0,0 +1,7 @@
+import { Orientation } from '@vef-framework/components';
+interface MenuProps {
+    layout: Orientation;
+    isSidebarCollapsed?: boolean;
+}
+export declare function Menu({ layout, isSidebarCollapsed }: MenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/src/components/layout/components/search/index.d.ts

@@ -0,0 +1 @@
+export declare function Search(): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-arrow-down-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardArrowDownIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-arrow-up-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardArrowUpIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-control-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardControlIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-esc-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardEscIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-help.d.ts

@@ -0,0 +1 @@
+export declare function KeyboardHelp(): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-return-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardReturnIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard-shift-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function KeyboardShiftIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/keyboard.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren, ReactNode, default as React } from 'react';
+interface KeyboardProps extends PropsWithChildren {
+    icon: ReactNode;
+}
+export declare function Keyboard({ icon, children }: KeyboardProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/search/letter-s-icon.d.ts

@@ -0,0 +1,2 @@
+import { LucideProps } from 'lucide-react';
+export declare function LetterSIcon({ size, ...props }: LucideProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/search/search-result-item.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps } from 'react';
+interface SearchResultItemProps extends ComponentProps<"div"> {
+    active?: boolean;
+    icon?: string;
+    label: string;
+}
+export declare function SearchResultItem({ active, icon, label, ...props }: SearchResultItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/src/components/layout/components/search/search-result.d.ts

@@ -0,0 +1,5 @@
+interface SearchResultProps {
+    keyword: string;
+}
+export declare function SearchResult({ keyword }: SearchResultProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/src/components/layout/components/sidebar.d.ts

@@ -0,0 +1,6 @@
+import { LayoutProps } from '../props';
+interface SidebarProps extends Pick<LayoutProps, "logo" | "title"> {
+    isSidebarCollapsed?: boolean;
+}
+export declare function Sidebar({ isSidebarCollapsed, logo, title }: SidebarProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/tabs/context-menu.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+interface ContextMenuProps extends PropsWithChildren {
+    tabId: string;
+}
+export declare function ContextMenu({ children, tabId }: ContextMenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/src/components/layout/components/tabs/index.d.ts

@@ -0,0 +1 @@
+export declare function Tabs(): React.JSX.Element;

package/dist/types/src/components/layout/components/tabs/main-content-maximum.d.ts

@@ -0,0 +1,5 @@
+interface MainContentMaximumProps {
+    className?: string;
+}
+export declare function MainContentMaximum({ className }: MainContentMaximumProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/tabs/reload.d.ts

@@ -0,0 +1,5 @@
+interface ReloadProps {
+    className?: string;
+}
+export declare function Reload({ className }: ReloadProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/tabs/tab-item.d.ts

@@ -0,0 +1,10 @@
+import { ComponentProps, ReactNode } from 'react';
+import { motion } from '@vef-framework/core';
+interface TabItemProps extends ComponentProps<typeof motion.div> {
+    index: number;
+    tabId: string;
+    label: ReactNode;
+    onClose?: () => void;
+}
+export declare function TabItem({ ref, index, tabId, label, onClose, ...props }: TabItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/src/components/layout/components/tabs/tab-list.d.ts

@@ -0,0 +1 @@
+export declare function TabList(): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/layout/components/tabs/tabs-container.d.ts

@@ -0,0 +1 @@
+export declare function TabsContainer(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/color-scheme-switcher.d.ts

@@ -0,0 +1 @@
+export declare function ColorSchemeSwitcher(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/color-scheme.d.ts

@@ -0,0 +1 @@
+export declare function ColorScheme(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/config-item.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren, ReactNode } from 'react';
+interface ConfigItemProps extends PropsWithChildren {
+    className?: string;
+    label: ReactNode;
+}
+export declare function ConfigItem({ className, label, children }: ConfigItemProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/theme-config/index.d.ts

@@ -0,0 +1 @@
+export declare function ThemeConfig(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/menu-layout-card.d.ts

@@ -0,0 +1,7 @@
+import { Orientation } from '@vef-framework/components';
+import { ComponentProps } from 'react';
+interface MenuLayoutCardProps extends ComponentProps<"div"> {
+    mode: Orientation;
+}
+export declare function MenuLayoutCard({ mode, ...props }: MenuLayoutCardProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/theme-config/menu-layout.d.ts

@@ -0,0 +1 @@
+export declare function MenuLayout(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/operations.d.ts

@@ -0,0 +1 @@
+export declare function Operations(): React.JSX.Element;

package/dist/types/src/components/layout/components/theme-config/theme-color-picker.d.ts

@@ -0,0 +1,6 @@
+import { SemanticColor } from '@vef-framework/components';
+interface ThemeColorPickerProps {
+    color: SemanticColor;
+}
+export declare function ThemeColorPicker({ color }: ThemeColorPickerProps): React.JSX.Element;
+export {};

package/dist/types/src/components/layout/components/theme-config/theme-colors.d.ts

@@ -0,0 +1 @@
+export declare function ThemeColors(): React.JSX.Element;

package/dist/types/src/components/layout/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { useColorSchemeUpdater } from './use-color-scheme-updater';
+export { useMenuNavigate } from './use-menu-navigate';
+export { useTabNavigate } from './use-tab-navigate';

package/dist/types/src/components/layout/hooks/use-color-scheme-updater.d.ts

@@ -0,0 +1,13 @@
+import { Position } from '@vef-framework/components';
+import { ColorScheme } from '../../../stores';
+declare function getNextColorScheme(colorScheme: ColorScheme): ColorScheme;
+/**
+ * A hook to update the color scheme of the application.
+ *
+ * @returns A function to update the color scheme of the application.
+ */
+export declare function useColorSchemeUpdater(): {
+    getNextColorScheme: typeof getNextColorScheme;
+    updateColorScheme: (nextColorScheme: ColorScheme, position: Position, isLoop?: boolean) => void;
+};
+export {};

package/dist/types/src/components/layout/hooks/use-menu-navigate.d.ts

@@ -0,0 +1,7 @@
+import { UserMenu } from '../../../types';
+/**
+ * Use the navigate function for the menu
+ *
+ * @returns The navigate function for the menu
+ */
+export declare function useMenuNavigate(): ({ path, meta }: UserMenu) => Promise<void>;

package/dist/types/src/components/layout/hooks/use-tab-navigate.d.ts

@@ -0,0 +1,11 @@
+import { Tab } from '../../../stores';
+interface UseTabNavigateOptions {
+    async?: boolean;
+}
+/**
+ * Use the navigate function for the tab
+ *
+ * @returns The navigate function for the tab
+ */
+export declare function useTabNavigate({ async }?: UseTabNavigateOptions): (tab?: Tab) => void;
+export {};

package/dist/types/src/components/layout/index.d.ts

@@ -0,0 +1,3 @@
+import { LayoutProps } from './props';
+export declare function Layout({ title, logo, headerActions, userMenuItems, onLogout, children }: LayoutProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export { type LayoutProps } from './props';

package/dist/types/src/components/layout/props.d.ts

@@ -0,0 +1,28 @@
+import { DropdownMenuProps } from '@vef-framework/components';
+import { Awaitable } from '@vef-framework/shared';
+import { PropsWithChildren, ReactNode } from 'react';
+/**
+ * The props for the Layout component.
+ */
+export interface LayoutProps extends PropsWithChildren {
+    /**
+     * The title of the layout.
+     */
+    title?: ReactNode;
+    /**
+     * The logo of the layout.
+     */
+    logo?: ReactNode;
+    /**
+     * The actions of the header.
+     */
+    headerActions?: ReactNode;
+    /**
+     * The user menu items of the layout.
+     */
+    userMenuItems?: DropdownMenuProps["items"];
+    /**
+     * The logout api function.
+     */
+    onLogout?: () => Awaitable<void>;
+}

package/dist/types/src/components/layout/store.d.ts

@@ -0,0 +1,17 @@
+import { ComponentType } from 'react';
+import { StoreProviderProps, UseStore } from '@vef-framework/core';
+/**
+ * The state of the layout.
+ */
+export interface LayoutState {
+    /**
+     * Whether the search modal is visible.
+     */
+    isSearchVisible: boolean;
+    /**
+     * Set the search modal visibility.
+     */
+    setIsSearchVisible: (isSearchVisible: boolean) => void;
+}
+declare const LayoutStoreProvider: ComponentType<StoreProviderProps<never>>, useLayoutStore: UseStore<LayoutState>;
+export { LayoutStoreProvider, useLayoutStore };

package/dist/types/src/components/layout/styles.d.ts

@@ -0,0 +1,2 @@
+import { SerializedStyles } from '@emotion/serialize';
+export declare const sidebar: SerializedStyles;

package/dist/types/src/components/login/icon-login.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare function IconLogin(props: SVGProps<SVGSVGElement>): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/login/index.d.ts

@@ -0,0 +1,4 @@
+import { LoginProps } from './props';
+export declare function Login({ logo, title, description, publicKey, onLogin }: LoginProps): React.ReactNode;
+export { type LoginParams, type LoginResult } from './payload';
+export { type LoginProps } from './props';

package/dist/types/src/components/login/payload.d.ts

@@ -0,0 +1,45 @@
+import { AuthTokens } from '../../models';
+/**
+ * The payload for login
+ */
+export type LoginParams = PasswordLoginParams;
+/**
+ * The base payload for authentication
+ */
+interface BaseLoginParams<T = unknown> {
+    /**
+     * The authentication kind
+     */
+    kind: string;
+    /**
+     * The user identifier (username, email, phone, etc.)
+     */
+    principal: string;
+    /**
+     * The authentication credentials
+     */
+    credentials: T;
+}
+/**
+ * The payload for password-based login
+ */
+export interface PasswordLoginParams extends BaseLoginParams<string> {
+    /**
+     * The authentication kind
+     */
+    kind: "password";
+}
+/**
+ * The result of a login operation
+ */
+export interface LoginResult {
+    /**
+     * Optional message to display to the user
+     */
+    message?: string;
+    /**
+     * Authentication tokens returned on successful login
+     */
+    tokens?: AuthTokens;
+}
+export {};

package/dist/types/src/components/login/props.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+import { LoginParams, LoginResult } from './payload';
+/**
+ * The props of the Login component.
+ */
+export interface LoginProps {
+    /**
+     * The logo of the login page.
+     */
+    logo?: ReactNode;
+    /**
+     * The title of the login page.
+     */
+    title?: string;
+    /**
+     * The description of the login page.
+     */
+    description?: string;
+    /**
+     * The public key for encrypting the password.
+     */
+    publicKey?: string;
+    /**
+     * The callback function for the login.
+     */
+    onLogin: (params: LoginParams) => Promise<LoginResult>;
+}

package/dist/types/src/components/login/styles.d.ts

@@ -0,0 +1,21 @@
+import { SerializedStyles } from '@emotion/serialize';
+export declare const login: SerializedStyles;
+export declare const backgroundOrbs: SerializedStyles;
+export declare const orb: SerializedStyles;
+export declare const orbPrimary: SerializedStyles;
+export declare const orbSecondary: SerializedStyles;
+export declare const orbAccent: SerializedStyles;
+export declare const logo: SerializedStyles;
+export declare const title: SerializedStyles;
+export declare const icon: SerializedStyles;
+export declare const leftContent: SerializedStyles;
+export declare const rightContent: SerializedStyles;
+export declare const formHeader: SerializedStyles;
+export declare const formControl: SerializedStyles;
+export declare const submitButton: SerializedStyles;
+export declare const date: SerializedStyles;
+export declare const copyright: SerializedStyles;
+export declare const description: SerializedStyles;
+export declare const formSubtitle: SerializedStyles;
+export declare const dateHighlight: SerializedStyles;
+export declare const formIcon: SerializedStyles;

package/dist/types/src/components/login/welcome-messages.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Welcome messages for successful login
+ * These messages are displayed randomly when users log in successfully
+ */
+export declare const welcomeMessages: string[];
+/**
+ * Get a random welcome message
+ *
+ * @returns A randomly selected welcome message
+ */
+export declare function getRandomWelcomeMessage(): string;

package/dist/types/src/components/logo-icon/index.d.ts

@@ -0,0 +1,3 @@
+import { LogoIconProps } from './props.js';
+export declare function LogoIcon({ primaryColor, ...props }: LogoIconProps): React.ReactElement;
+export type { LogoIconProps } from './props.js';

package/dist/types/src/components/logo-icon/props.d.ts

@@ -0,0 +1,4 @@
+import { SVGProps } from 'react';
+export interface LogoIconProps extends SVGProps<SVGSVGElement> {
+    primaryColor?: string;
+}

package/dist/types/src/components/n-progress/components/bar.d.ts

@@ -0,0 +1,5 @@
+interface BarProps {
+    progress: number;
+}
+export declare function Bar({ progress }: BarProps): React.ReactNode;
+export {};

package/dist/types/src/components/n-progress/components/container.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+interface ContainerProps {
+    animationDuration: number;
+    isFinished: boolean;
+}
+export declare function Container({ animationDuration, children, isFinished }: PropsWithChildren<ContainerProps>): React.ReactNode;
+export {};

package/dist/types/src/components/n-progress/components/index.d.ts

@@ -0,0 +1,2 @@
+export { Bar } from './bar';
+export { Container } from './container';

package/dist/types/src/components/n-progress/event.d.ts

@@ -0,0 +1,7 @@
+import { EventEmitter } from '@vef-framework/shared';
+interface NProgressEvent {
+    complete: void;
+    start: void;
+}
+export declare const nProgressEventEmitter: EventEmitter<NProgressEvent>;
+export {};

package/dist/types/src/components/n-progress/index.d.ts

@@ -0,0 +1,2 @@
+export declare function NProgress(): React.ReactNode;
+export { nProgressEventEmitter } from './event';

package/dist/types/src/components/not-found/index.d.ts

@@ -0,0 +1 @@
+export declare function NotFound(): React.ReactNode;

package/dist/types/src/components/not-found/not-found-icon.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare function NotFoundIcon(props: SVGProps<SVGSVGElement>): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/page/components/aside-panel.d.ts

@@ -0,0 +1,11 @@
+import { SerializedStyles } from '@emotion/react';
+import { ReactNode } from 'react';
+import { AsideWidth } from '../props';
+export interface AsidePanelProps {
+    children: ReactNode;
+    className?: string;
+    containerStyle: SerializedStyles;
+    position: "left" | "right";
+    width?: AsideWidth;
+}
+export declare function AsidePanel({ children, className, containerStyle, position, width }: AsidePanelProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/src/components/page/components/index.d.ts

@@ -0,0 +1,3 @@
+export { AsidePanel } from './aside-panel';
+export { ResizeHandle } from './resize-handle';
+export { ScrollContent } from './scroll-content';

package/dist/types/src/components/page/components/resize-handle.d.ts

@@ -0,0 +1,7 @@
+import { MouseEvent, default as React } from 'react';
+export interface ResizeHandleProps {
+    isDragging: boolean;
+    position: "left" | "right";
+    onMouseDown: (event: MouseEvent) => void;
+}
+export declare function ResizeHandle({ isDragging, position, onMouseDown }: ResizeHandleProps): React.JSX.Element;

package/dist/types/src/components/page/components/scroll-content.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren, ReactNode } from 'react';
+interface ScrollContentProps extends PropsWithChildren {
+    className?: string;
+    actionBar?: ReactNode;
+    actionBarClassName?: string;
+}
+export declare function ScrollContent({ className, actionBar, actionBarClassName, children }: ScrollContentProps): React.JSX.Element;
+export {};

package/dist/types/src/components/page/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { usePageKey } from './use-page-key';
+export { useResize } from './use-resize';

package/dist/types/src/components/page/hooks/use-page-key.d.ts

@@ -0,0 +1 @@
+export declare function usePageKey(): number;

package/dist/types/src/components/page/hooks/use-resize.d.ts

@@ -0,0 +1,15 @@
+import { MouseEvent as ReactMouseEvent } from 'react';
+export interface UseResizeOptions {
+    defaultWidth: number;
+    minWidth?: number;
+    maxWidth?: number;
+    /**
+     * true for left panel (drag right to increase), false for right panel (drag left to increase)
+     */
+    isLeftPanel?: boolean;
+}
+export declare function useResize(options: UseResizeOptions): {
+    width: number;
+    isDragging: boolean;
+    handleMouseDown: (event: ReactMouseEvent) => void;
+};

package/dist/types/src/components/page/index.d.ts

@@ -0,0 +1,4 @@
+import { PageProps } from './props';
+export declare function Page({ className, mainClassName, leftAside, leftAsideClassName, leftAsideWidth, rightAside, rightAsideClassName, rightAsideWidth, header, headerClassName, headerPosition, footer, footerClassName, footerPosition, actionBar, actionBarClassName, scrollable, scrollMargin, margin, gap, children }: PageProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export { type AsideWidth, type PageProps, type Position, type ResizableWidth } from './props';
+export { useViewportHeight } from './viewport-context';