@cryptlex/web-components 6.4.4 → 6.5.0-alpha00

package/dist/components/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","sources":["../../lib/components/sidebar.tsx"],"sourcesContent":["'use client';\nimport { PanelLeftClose, PanelLeftOpen } from 'lucide-react';\n\nimport { Button } from 'lib/components/button';\nimport { DialogContent, DialogOverlay, DialogTrigger } from 'lib/components/dialog';\nimport { Skeleton } from 'lib/components/skeleton';\nimport { Tooltip, TooltipTrigger } from 'lib/components/tooltip';\nimport { classNames } from 'lib/utils/primitives';\nimport { useIsMobile } from 'lib/utils/use-mobile';\nimport { createContext, forwardRef, use, useCallback, useEffect, useMemo, useState } from 'react';\n\n// TODO use tailwind variables\nconst SIDEBAR_WIDTH = '16rem';\nconst SIDEBAR_WIDTH_MOBILE = '18rem';\nconst SIDEBAR_WIDTH_ICON = '3rem';\nconst SIDEBAR_KEYBOARD_SHORTCUT = 'b';\n\ntype SidebarContextProps = {\n    state: 'expanded' | 'collapsed';\n    open: boolean;\n    setOpen: (open: boolean) => void;\n    openMobile: boolean;\n    setOpenMobile: (open: boolean) => void;\n    isMobile: boolean;\n    toggleSidebar: () => void;\n};\n\nexport const SidebarContext = createContext<SidebarContextProps | null>(null);\n\nexport function useSidebar() {\n    const context = use(SidebarContext);\n    if (!context) {\n        throw new Error('useSidebar must be used within a SidebarProvider.');\n    }\n\n    return context;\n}\n\nexport function SidebarProvider({\n    defaultOpen = true,\n    open: openProp,\n    onOpenChange: setOpenProp,\n    className,\n    style,\n    children,\n    ...props\n}: React.ComponentProps<'div'> & {\n    defaultOpen?: boolean;\n    open?: boolean;\n    onOpenChange?: (open: boolean) => void;\n}) {\n    const isMobile = useIsMobile();\n    const [openMobile, setOpenMobile] = useState(false);\n\n    // This is the internal state of the sidebar.\n    // We use openProp and setOpenProp for control from outside the component.\n    const [_open, _setOpen] = useState(defaultOpen);\n    const open = openProp ?? _open;\n    const setOpen = useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const openState = typeof value === 'function' ? value(open) : value;\n            if (setOpenProp) {\n                setOpenProp(openState);\n            } else {\n                _setOpen(openState);\n            }\n\n            // TODO, use different model for persistence\n            // This sets the cookie to keep the sidebar state.\n            // document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`\n        },\n        [setOpenProp, open]\n    );\n\n    // Helper to toggle the sidebar.\n    const toggleSidebar = useCallback(() => {\n        return isMobile ? setOpenMobile(open => !open) : setOpen(open => !open);\n    }, [isMobile, setOpen, setOpenMobile]);\n\n    // Adds a keyboard shortcut to toggle the sidebar.\n    useEffect(() => {\n        const handleKeyDown = (event: KeyboardEvent) => {\n            if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {\n                event.preventDefault();\n                toggleSidebar();\n            }\n        };\n\n        window.addEventListener('keydown', handleKeyDown);\n        return () => window.removeEventListener('keydown', handleKeyDown);\n    }, [toggleSidebar]);\n\n    // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n    // This makes it easier to style the sidebar with Tailwind classes.\n    const state = open ? 'expanded' : 'collapsed';\n\n    const contextValue = useMemo<SidebarContextProps>(\n        () => ({\n            state,\n            open,\n            setOpen,\n            isMobile,\n            openMobile,\n            setOpenMobile,\n            toggleSidebar,\n        }),\n        [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]\n    );\n\n    return (\n        <SidebarContext.Provider value={contextValue}>\n            <div\n                style={\n                    {\n                        '--sidebar-width': SIDEBAR_WIDTH,\n                        '--sidebar-width-icon': SIDEBAR_WIDTH_ICON,\n                        ...style,\n                    } as React.CSSProperties\n                }\n                className={classNames(\n                    'group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-sidebar-background',\n                    className\n                )}\n                {...props}\n            >\n                {children}\n            </div>\n        </SidebarContext.Provider>\n    );\n}\n\nexport function Sidebar({\n    side = 'left',\n    variant = 'sidebar',\n    collapsible = 'offcanvas',\n    className,\n    children,\n    ...props\n}: React.ComponentProps<'div'> & {\n    side?: 'left' | 'right';\n    variant?: 'sidebar' | 'floating' | 'inset';\n    collapsible?: 'offcanvas' | 'icon' | 'none';\n}) {\n    const { isMobile, state, openMobile, setOpenMobile } = useSidebar();\n\n    if (collapsible === 'none') {\n        return (\n            <div\n                className={classNames(\n                    'flex h-full w-[--sidebar-width] flex-col bg-sidebar-background text-sidebar-foreground',\n                    className\n                )}\n                {...props}\n            >\n                {children}\n            </div>\n        );\n    }\n\n    if (isMobile) {\n        return (\n            <DialogTrigger\n                style={{ '--sidebar-width': SIDEBAR_WIDTH_MOBILE } as React.CSSProperties}\n                isOpen={openMobile}\n                onOpenChange={setOpenMobile}\n                {...props}\n            >\n                <DialogOverlay>\n                    <DialogContent\n                        data-sidebar=\"sidebar\"\n                        data-mobile=\"true\"\n                        className=\"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden\"\n                        side=\"left\"\n                    >\n                        {() => <>{children}</>}\n                    </DialogContent>\n                </DialogOverlay>\n            </DialogTrigger>\n        );\n    }\n\n    return (\n        <div\n            className=\"group peer hidden text-sidebar-foreground md:block\"\n            data-state={state}\n            data-collapsible={state === 'collapsed' ? collapsible : ''}\n            data-variant={variant}\n            data-side={side}\n        >\n            {/* This is what handles the sidebar gap on desktop */}\n            <div\n                className={classNames(\n                    'relative w-(--sidebar-width) bg-sidebar-background transition-[width] duration-200 ease-linear',\n                    'group-data-[collapsible=offcanvas]:w-0',\n                    'group-data-[side=right]:rotate-180',\n                    variant === 'floating' || variant === 'inset'\n                        ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]'\n                        : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon]'\n                )}\n            />\n            <div\n                className={classNames(\n                    'absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n                    side === 'left'\n                        ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n                        : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n                    // Adjust the padding for floating and inset variants.\n                    variant === 'floating' || variant === 'inset'\n                        ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]'\n                        : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l',\n                    className\n                )}\n                {...props}\n            >\n                <div\n                    data-sidebar=\"sidebar\"\n                    className=\"flex h-full w-full flex-col bg-sidebar-background group-data-[variant=floating]:border group-data-[variant=floating]:border-border group-data-[variant=floating]:shadow\"\n                >\n                    {children}\n                </div>\n            </div>\n        </div>\n    );\n}\n\nexport function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {\n    const { toggleSidebar, open } = useSidebar();\n\n    return (\n        <Button\n            data-sidebar=\"trigger\"\n            variant=\"neutral\"\n            size=\"icon\"\n            onClick={event => {\n                onClick?.(event);\n                toggleSidebar();\n            }}\n            {...props}\n        >\n            {open ? <PanelLeftClose /> : <PanelLeftOpen />}\n        </Button>\n    );\n}\n\n// TODO, evaluate if we need this??\nexport const SidebarRail = forwardRef<HTMLButtonElement, React.ComponentProps<'button'>>(\n    ({ className, ...props }, ref) => {\n        const { toggleSidebar } = useSidebar();\n\n        return (\n            <button\n                ref={ref}\n                data-sidebar=\"rail\"\n                aria-label=\"Toggle Sidebar\"\n                tabIndex={-1}\n                onClick={toggleSidebar}\n                title=\"Toggle Sidebar\"\n                className={classNames(\n                    'absolute inset-y-0 z-20 hidden w-icon -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-border group-data-[side=left]:-right-icon group-data-[side=right]:left-0 sm:flex',\n                    '[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize',\n                    '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',\n                    'group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar-background',\n                    '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',\n                    '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',\n                    className\n                )}\n                {...props}\n            />\n        );\n    }\n);\nSidebarRail.displayName = 'SidebarRail';\n\nexport function SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {\n    return (\n        <main\n            className={classNames(\n                'relative flex w-full flex-1 flex-col bg-background',\n                'md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarHeader({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"header\" className={classNames('flex flex-col gap-2 p-2', className)} {...props} />;\n}\n\nexport function SidebarFooter({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"footer\" className={classNames('flex flex-col gap-2 p-2', className)} {...props} />;\n}\n\nexport function SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"content\"\n            className={classNames(\n                'flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"group\"\n            className={classNames('relative flex w-full min-w-0 flex-col p-2', className)}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroupLabel({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"group-label\"\n            className={classNames(\n                'flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n                'group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0',\n                className\n            )}\n            {...props}\n        />\n    );\n}\nexport function SidebarGroupAction({ className, ...props }: React.ComponentProps<'button'>) {\n    return (\n        <button\n            data-sidebar=\"group-action\"\n            className={classNames(\n                'absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-ring transition-transform hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n                // Increases the hit area of the button on mobile.\n                'after:absolute after:-inset-2 after:md:hidden',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroupContent({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"group-content\" className={classNames('w-full body-sm', className)} {...props} />;\n}\n\nexport function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n    return (\n        <ul data-sidebar=\"menu\" className={classNames('flex w-full min-w-0 flex-col gap-1', className)} {...props} />\n    );\n}\n\nexport function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return (\n        <li\n            data-sidebar=\"menu-item\"\n            className={classNames('group/menu-item relative list-none', className)}\n            {...props}\n        />\n    );\n}\n\n/// TODO fix positioning\nexport function SidebarMenuAction({\n    className,\n    showOnHover = false,\n    ...props\n}: React.ComponentProps<'button'> & {\n    showOnHover?: boolean;\n}) {\n    return (\n        <button\n            data-sidebar=\"menu-action\"\n            className={classNames(\n                'absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-ring transition-transform hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-accent-foreground [&>svg]:size-icon [&>svg]:shrink-0',\n                // Increases the hit area of the button on mobile.\n                'after:absolute after:-inset-2 after:md:hidden',\n                'peer-data-[size=sm]/menu-button:top-1',\n                'peer-data-[size=default]/menu-button:top-1.5',\n                'peer-data-[size=lg]/menu-button:top-2.5',\n                'group-data-[collapsible=icon]:hidden',\n                showOnHover &&\n                    'group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-accent-foreground md:opacity-0',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuBadge({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"menu-badge\"\n            className={classNames(\n                'pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 body-sm font-medium tabular-nums text-sidebar-foreground',\n                'peer-hover/menu-button:text-accent-foreground peer-data-[active=true]/menu-button:text-accent-foreground',\n                'peer-data-[size=sm]/menu-button:top-1',\n                'peer-data-[size=default]/menu-button:top-1.5',\n                'peer-data-[size=lg]/menu-button:top-2.5',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuSkeleton({\n    className,\n    showIcon = false,\n    ...props\n}: React.ComponentProps<'div'> & {\n    showIcon?: boolean;\n}) {\n    // Random width between 50 to 90%.\n    const width = useMemo(() => {\n        return `${Math.floor(Math.random() * 40) + 50}%`;\n    }, []);\n\n    return (\n        <div\n            data-sidebar=\"menu-skeleton\"\n            className={classNames('flex h-input items-center gap-2 px-2', className)}\n            {...props}\n        >\n            {showIcon && <Skeleton className=\"size-icon\" data-sidebar=\"menu-skeleton-icon\" />}\n            <Skeleton\n                className=\"h-icon max-w-[--skeleton-width] flex-1\"\n                data-sidebar=\"menu-skeleton-text\"\n                style={\n                    {\n                        '--skeleton-width': width,\n                    } as React.CSSProperties\n                }\n            />\n        </div>\n    );\n}\n\nexport function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n    return (\n        <ul\n            data-sidebar=\"menu-sub\"\n            className={classNames(\n                'mx-2 flex min-w-0 flex-col border-l border-border',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return <li className={classNames('list-none ms-0', className)} {...props} />;\n}\n\n// Common interaction logic for SidebarMenuButton and SidebarMenuSubButton\n// TODO, this is similar to the tab pattern, standardize the two.\nconst Cs_SidebarButton =\n    'w-full truncate btn btn-primary bg-transparent border-0 input-dim font-normal text-accent justify-start data-[active=true]:bg-primary/20 data-[active=true]:font-medium data-[active=true]:text-primary [&>span:last-child]:truncate';\nexport function SidebarMenuButton({\n    isActive = false,\n    tooltip,\n    className,\n    ...props\n}: React.ComponentProps<'button'> & {\n    isActive?: boolean;\n    tooltip?: React.ComponentProps<typeof Tooltip>;\n}) {\n    const { isMobile, state } = useSidebar();\n\n    const button = (\n        <button\n            data-sidebar=\"menu-button\"\n            data-active={isActive}\n            className={classNames(\n                'peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ',\n                Cs_SidebarButton,\n                className\n            )}\n            {...props}\n        />\n    );\n\n    if (!tooltip) {\n        return button;\n    }\n\n    return (\n        <TooltipTrigger>\n            {button}\n            <Tooltip hidden={state !== 'collapsed' || isMobile} {...tooltip} />\n        </TooltipTrigger>\n    );\n}\n\nexport function SidebarMenuSubButton({\n    isActive,\n    className,\n    ...props\n}: React.ComponentProps<'button'> & {\n    isActive?: boolean;\n}) {\n    return (\n        <button\n            data-sidebar=\"menu-sub-button\"\n            data-active={isActive}\n            className={classNames(\n                '-translate-x-px [&>svg]:text-accent-foreground',\n                'group-data-[collapsible=icon]:hidden',\n                Cs_SidebarButton,\n                className\n            )}\n            {...props}\n        />\n    );\n}\n// TODO, standardize heights here\n"],"names":["SIDEBAR_WIDTH","SIDEBAR_WIDTH_MOBILE","SIDEBAR_WIDTH_ICON","SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","createContext","useSidebar","context","use","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","useState","_open","_setOpen","open","setOpen","useCallback","value","openState","toggleSidebar","useEffect","handleKeyDown","event","state","contextValue","useMemo","jsx","classNames","Sidebar","side","variant","collapsible","DialogTrigger","DialogOverlay","DialogContent","jsxs","SidebarTrigger","onClick","Button","PanelLeftClose","PanelLeftOpen","SidebarRail","forwardRef","ref","SidebarInset","SidebarHeader","SidebarFooter","SidebarContent","SidebarGroup","SidebarGroupLabel","SidebarGroupAction","SidebarGroupContent","SidebarMenu","SidebarMenuItem","SidebarMenuAction","showOnHover","SidebarMenuBadge","SidebarMenuSkeleton","showIcon","width","Skeleton","SidebarMenuSub","SidebarMenuSubItem","Cs_SidebarButton","SidebarMenuButton","isActive","tooltip","button","TooltipTrigger","Tooltip","SidebarMenuSubButton"],"mappings":"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"}
+{"version":3,"file":"sidebar.js","sources":["../../lib/components/sidebar.tsx"],"sourcesContent":["'use client';\nimport { PanelLeftClose, PanelLeftOpen } from 'lucide-react';\n\nimport { createContext, forwardRef, use, useCallback, useEffect, useMemo, useState } from 'react';\nimport { Button } from '../components/button';\nimport { DialogContent, DialogOverlay, DialogTrigger } from '../components/dialog';\nimport { Skeleton } from '../components/skeleton';\nimport { Tooltip, TooltipTrigger } from '../components/tooltip';\nimport { classNames } from '../utils/primitives';\nimport { useIsMobile } from '../utils/use-mobile';\n\n// TODO use tailwind variables\nconst SIDEBAR_WIDTH = '16rem';\nconst SIDEBAR_WIDTH_MOBILE = '18rem';\nconst SIDEBAR_WIDTH_ICON = '3rem';\nconst SIDEBAR_KEYBOARD_SHORTCUT = 'b';\n\ntype SidebarContextProps = {\n    state: 'expanded' | 'collapsed';\n    open: boolean;\n    setOpen: (open: boolean) => void;\n    openMobile: boolean;\n    setOpenMobile: (open: boolean) => void;\n    isMobile: boolean;\n    toggleSidebar: () => void;\n};\n\nexport const SidebarContext = createContext<SidebarContextProps | null>(null);\n\nexport function useSidebar() {\n    const context = use(SidebarContext);\n    if (!context) {\n        throw new Error('useSidebar must be used within a SidebarProvider.');\n    }\n\n    return context;\n}\n\nexport function SidebarProvider({\n    defaultOpen = true,\n    open: openProp,\n    onOpenChange: setOpenProp,\n    className,\n    style,\n    children,\n    ...props\n}: React.ComponentProps<'div'> & {\n    defaultOpen?: boolean;\n    open?: boolean;\n    onOpenChange?: (open: boolean) => void;\n}) {\n    const isMobile = useIsMobile();\n    const [openMobile, setOpenMobile] = useState(false);\n\n    // This is the internal state of the sidebar.\n    // We use openProp and setOpenProp for control from outside the component.\n    const [_open, _setOpen] = useState(defaultOpen);\n    const open = openProp ?? _open;\n    const setOpen = useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const openState = typeof value === 'function' ? value(open) : value;\n            if (setOpenProp) {\n                setOpenProp(openState);\n            } else {\n                _setOpen(openState);\n            }\n\n            // TODO, use different model for persistence\n            // This sets the cookie to keep the sidebar state.\n            // document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`\n        },\n        [setOpenProp, open]\n    );\n\n    // Helper to toggle the sidebar.\n    const toggleSidebar = useCallback(() => {\n        return isMobile ? setOpenMobile(open => !open) : setOpen(open => !open);\n    }, [isMobile, setOpen, setOpenMobile]);\n\n    // Adds a keyboard shortcut to toggle the sidebar.\n    useEffect(() => {\n        const handleKeyDown = (event: KeyboardEvent) => {\n            if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {\n                event.preventDefault();\n                toggleSidebar();\n            }\n        };\n\n        window.addEventListener('keydown', handleKeyDown);\n        return () => window.removeEventListener('keydown', handleKeyDown);\n    }, [toggleSidebar]);\n\n    // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n    // This makes it easier to style the sidebar with Tailwind classes.\n    const state = open ? 'expanded' : 'collapsed';\n\n    const contextValue = useMemo<SidebarContextProps>(\n        () => ({\n            state,\n            open,\n            setOpen,\n            isMobile,\n            openMobile,\n            setOpenMobile,\n            toggleSidebar,\n        }),\n        [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]\n    );\n\n    return (\n        <SidebarContext.Provider value={contextValue}>\n            <div\n                style={\n                    {\n                        '--sidebar-width': SIDEBAR_WIDTH,\n                        '--sidebar-width-icon': SIDEBAR_WIDTH_ICON,\n                        ...style,\n                    } as React.CSSProperties\n                }\n                className={classNames(\n                    'group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-sidebar-background',\n                    className\n                )}\n                {...props}\n            >\n                {children}\n            </div>\n        </SidebarContext.Provider>\n    );\n}\n\nexport function Sidebar({\n    side = 'left',\n    variant = 'sidebar',\n    collapsible = 'offcanvas',\n    className,\n    children,\n    ...props\n}: React.ComponentProps<'div'> & {\n    side?: 'left' | 'right';\n    variant?: 'sidebar' | 'floating' | 'inset';\n    collapsible?: 'offcanvas' | 'icon' | 'none';\n}) {\n    const { isMobile, state, openMobile, setOpenMobile } = useSidebar();\n\n    if (collapsible === 'none') {\n        return (\n            <div\n                className={classNames(\n                    'flex h-full w-[--sidebar-width] flex-col bg-sidebar-background text-sidebar-foreground',\n                    className\n                )}\n                {...props}\n            >\n                {children}\n            </div>\n        );\n    }\n\n    if (isMobile) {\n        return (\n            <DialogTrigger\n                style={{ '--sidebar-width': SIDEBAR_WIDTH_MOBILE } as React.CSSProperties}\n                isOpen={openMobile}\n                onOpenChange={setOpenMobile}\n                {...props}\n            >\n                <DialogOverlay>\n                    <DialogContent\n                        data-sidebar=\"sidebar\"\n                        data-mobile=\"true\"\n                        className=\"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden\"\n                        side=\"left\"\n                    >\n                        {() => <>{children}</>}\n                    </DialogContent>\n                </DialogOverlay>\n            </DialogTrigger>\n        );\n    }\n\n    return (\n        <div\n            className=\"group peer hidden text-sidebar-foreground md:block\"\n            data-state={state}\n            data-collapsible={state === 'collapsed' ? collapsible : ''}\n            data-variant={variant}\n            data-side={side}\n        >\n            {/* This is what handles the sidebar gap on desktop */}\n            <div\n                className={classNames(\n                    'relative w-(--sidebar-width) bg-sidebar-background transition-[width] duration-200 ease-linear',\n                    'group-data-[collapsible=offcanvas]:w-0',\n                    'group-data-[side=right]:rotate-180',\n                    variant === 'floating' || variant === 'inset'\n                        ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]'\n                        : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon]'\n                )}\n            />\n            <div\n                className={classNames(\n                    'absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n                    side === 'left'\n                        ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n                        : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n                    // Adjust the padding for floating and inset variants.\n                    variant === 'floating' || variant === 'inset'\n                        ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]'\n                        : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l',\n                    className\n                )}\n                {...props}\n            >\n                <div\n                    data-sidebar=\"sidebar\"\n                    className=\"flex h-full w-full flex-col bg-sidebar-background group-data-[variant=floating]:border group-data-[variant=floating]:border-border group-data-[variant=floating]:shadow\"\n                >\n                    {children}\n                </div>\n            </div>\n        </div>\n    );\n}\n\nexport function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {\n    const { toggleSidebar, open } = useSidebar();\n\n    return (\n        <Button\n            data-sidebar=\"trigger\"\n            variant=\"neutral\"\n            size=\"icon\"\n            onClick={event => {\n                onClick?.(event);\n                toggleSidebar();\n            }}\n            {...props}\n        >\n            {open ? <PanelLeftClose /> : <PanelLeftOpen />}\n        </Button>\n    );\n}\n\n// TODO, evaluate if we need this??\nexport const SidebarRail = forwardRef<HTMLButtonElement, React.ComponentProps<'button'>>(\n    ({ className, ...props }, ref) => {\n        const { toggleSidebar } = useSidebar();\n\n        return (\n            <button\n                ref={ref}\n                data-sidebar=\"rail\"\n                aria-label=\"Toggle Sidebar\"\n                tabIndex={-1}\n                onClick={toggleSidebar}\n                title=\"Toggle Sidebar\"\n                className={classNames(\n                    'absolute inset-y-0 z-20 hidden w-icon -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-border group-data-[side=left]:-right-icon group-data-[side=right]:left-0 sm:flex',\n                    '[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize',\n                    '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',\n                    'group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar-background',\n                    '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',\n                    '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',\n                    className\n                )}\n                {...props}\n            />\n        );\n    }\n);\nSidebarRail.displayName = 'SidebarRail';\n\nexport function SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {\n    return (\n        <main\n            className={classNames(\n                'relative flex w-full flex-1 flex-col bg-background',\n                'md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarHeader({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"header\" className={classNames('flex flex-col gap-2 p-2', className)} {...props} />;\n}\n\nexport function SidebarFooter({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"footer\" className={classNames('flex flex-col gap-2 p-2', className)} {...props} />;\n}\n\nexport function SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"content\"\n            className={classNames(\n                'flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"group\"\n            className={classNames('relative flex w-full min-w-0 flex-col p-2', className)}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroupLabel({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"group-label\"\n            className={classNames(\n                'flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n                'group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0',\n                className\n            )}\n            {...props}\n        />\n    );\n}\nexport function SidebarGroupAction({ className, ...props }: React.ComponentProps<'button'>) {\n    return (\n        <button\n            data-sidebar=\"group-action\"\n            className={classNames(\n                'absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-ring transition-transform hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n                // Increases the hit area of the button on mobile.\n                'after:absolute after:-inset-2 after:md:hidden',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarGroupContent({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div data-sidebar=\"group-content\" className={classNames('w-full body-sm', className)} {...props} />;\n}\n\nexport function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n    return <ul data-sidebar=\"menu\" className={classNames('flex w-full min-w-0 flex-col', className)} {...props} />;\n}\n\nexport function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return (\n        <li\n            data-sidebar=\"menu-item\"\n            className={classNames('group/menu-item relative list-none', className)}\n            {...props}\n        />\n    );\n}\n\n/// TODO fix positioning\nexport function SidebarMenuAction({\n    className,\n    showOnHover = false,\n    ...props\n}: React.ComponentProps<'button'> & {\n    showOnHover?: boolean;\n}) {\n    return (\n        <button\n            data-sidebar=\"menu-action\"\n            className={classNames(\n                'absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-ring transition-transform hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-accent-foreground [&>svg]:size-icon [&>svg]:shrink-0',\n                // Increases the hit area of the button on mobile.\n                'after:absolute after:-inset-2 after:md:hidden',\n                'peer-data-[size=sm]/menu-button:top-1',\n                'peer-data-[size=default]/menu-button:top-1.5',\n                'peer-data-[size=lg]/menu-button:top-2.5',\n                'group-data-[collapsible=icon]:hidden',\n                showOnHover &&\n                    'group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-accent-foreground md:opacity-0',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuBadge({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-sidebar=\"menu-badge\"\n            className={classNames(\n                'pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 body-sm font-medium tabular-nums text-sidebar-foreground',\n                'peer-hover/menu-button:text-accent-foreground peer-data-[active=true]/menu-button:text-accent-foreground',\n                'peer-data-[size=sm]/menu-button:top-1',\n                'peer-data-[size=default]/menu-button:top-1.5',\n                'peer-data-[size=lg]/menu-button:top-2.5',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuSkeleton({\n    className,\n    showIcon = false,\n    ...props\n}: React.ComponentProps<'div'> & {\n    showIcon?: boolean;\n}) {\n    // Random width between 50 to 90%.\n    const width = useMemo(() => {\n        return `${Math.floor(Math.random() * 40) + 50}%`;\n    }, []);\n\n    return (\n        <div\n            data-sidebar=\"menu-skeleton\"\n            className={classNames('flex h-input items-center gap-2 px-2', className)}\n            {...props}\n        >\n            {showIcon && <Skeleton className=\"size-icon\" data-sidebar=\"menu-skeleton-icon\" />}\n            <Skeleton\n                className=\"h-icon max-w-[--skeleton-width] flex-1\"\n                data-sidebar=\"menu-skeleton-text\"\n                style={\n                    {\n                        '--skeleton-width': width,\n                    } as React.CSSProperties\n                }\n            />\n        </div>\n    );\n}\n\nexport function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n    return (\n        <ul\n            data-sidebar=\"menu-sub\"\n            className={classNames(\n                'mx-2 flex min-w-0 flex-col border-l border-border',\n                'group-data-[collapsible=icon]:hidden',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return <li className={classNames('list-none ms-0', className)} {...props} />;\n}\n\n// Common interaction logic for SidebarMenuButton and SidebarMenuSubButton\n// TODO, this is similar to the tab pattern, standardize the two.\nconst Cs_SidebarButton =\n    'w-full truncate btn btn-primary bg-transparent border-0 input-dim font-normal text-accent justify-start data-[active=true]:bg-primary/20 data-[active=true]:font-medium data-[active=true]:text-primary [&>span:last-child]:truncate';\nexport function SidebarMenuButton({\n    isActive = false,\n    tooltip,\n    className,\n    ...props\n}: React.ComponentProps<'button'> & {\n    isActive?: boolean;\n    tooltip?: React.ComponentProps<typeof Tooltip>;\n}) {\n    const { isMobile, state } = useSidebar();\n\n    const button = (\n        <button\n            data-sidebar=\"menu-button\"\n            data-active={isActive}\n            className={classNames(\n                'peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ',\n                Cs_SidebarButton,\n                className\n            )}\n            {...props}\n        />\n    );\n\n    if (!tooltip) {\n        return button;\n    }\n\n    return (\n        <TooltipTrigger>\n            {button}\n            <Tooltip hidden={state !== 'collapsed' || isMobile} {...tooltip} />\n        </TooltipTrigger>\n    );\n}\n\nexport function SidebarMenuSubButton({\n    isActive,\n    className,\n    ...props\n}: React.ComponentProps<'button'> & {\n    isActive?: boolean;\n}) {\n    return (\n        <button\n            data-sidebar=\"menu-sub-button\"\n            data-active={isActive}\n            className={classNames(\n                '-translate-x-px [&>svg]:text-accent-foreground',\n                'group-data-[collapsible=icon]:hidden',\n                Cs_SidebarButton,\n                className\n            )}\n            {...props}\n        />\n    );\n}\n// TODO, standardize heights here\n"],"names":["SIDEBAR_WIDTH","SIDEBAR_WIDTH_MOBILE","SIDEBAR_WIDTH_ICON","SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","createContext","useSidebar","context","use","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","useState","_open","_setOpen","open","setOpen","useCallback","value","openState","toggleSidebar","useEffect","handleKeyDown","event","state","contextValue","useMemo","jsx","classNames","Sidebar","side","variant","collapsible","DialogTrigger","DialogOverlay","DialogContent","jsxs","SidebarTrigger","onClick","Button","PanelLeftClose","PanelLeftOpen","SidebarRail","forwardRef","ref","SidebarInset","SidebarHeader","SidebarFooter","SidebarContent","SidebarGroup","SidebarGroupLabel","SidebarGroupAction","SidebarGroupContent","SidebarMenu","SidebarMenuItem","SidebarMenuAction","showOnHover","SidebarMenuBadge","SidebarMenuSkeleton","showIcon","width","Skeleton","SidebarMenuSub","SidebarMenuSubItem","Cs_SidebarButton","SidebarMenuButton","isActive","tooltip","button","TooltipTrigger","Tooltip","SidebarMenuSubButton"],"mappings":"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"}

package/dist/components/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","sources":["../../lib/components/skeleton.tsx"],"sourcesContent":["import { classNames } from 'lib/utils/primitives';\n\nexport function Skeleton({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div className={classNames('animate-pulse bg-primary/10', className)} {...props} />;\n}\n"],"names":["Skeleton","className","props","jsx","classNames"],"mappings":"yGAEO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAsC,CAC3E,OAAOC,EAAC,OAAI,UAAWC,EAAW,8BAA+BH,CAAS,EAAI,GAAGC,EAAO,CAC5F"}
+{"version":3,"file":"skeleton.js","sources":["../../lib/components/skeleton.tsx"],"sourcesContent":["import { classNames } from '../utils/primitives';\n\nexport function Skeleton({ className, ...props }: React.ComponentProps<'div'>) {\n    return <div className={classNames('animate-pulse bg-primary/10', className)} {...props} />;\n}\n"],"names":["Skeleton","className","props","jsx","classNames"],"mappings":"yGAEO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAsC,CAC3E,OAAOC,EAAC,OAAI,UAAWC,EAAW,8BAA+BH,CAAS,EAAI,GAAGC,EAAO,CAC5F"}

package/dist/components/table-of-contents.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as m,jsx as l}from"react/jsx-runtime";import{classNames as p}from"../utils/primitives.js";import{useMemo as h,useRef as i,useEffect as f,useState as v}from"react";import"clsx";function g(o){const[c,a]=v(null);return f(()=>{const r=new IntersectionObserver(n=>{for(const e of n)e.isIntersecting&&a(e.target.id)},{rootMargin:"0% 0% -80% 0%"});for(const n of o??[]){const e=document.getElementById(n);e&&r.observe(e)}return()=>{for(const n of o??[]){const e=document.getElementById(n);e&&r.unobserve(e)}}},[o]),c}function I({toc:o,className:c}){const a=h(()=>o.map(t=>t.url.replace("#","")),[o]),r=g(a),n=i({}),e=i(null);return f(()=>{const t=n.current[`#${r}`],s=e.current;if(t&&s){const d=t.offsetTop,u=s.clientHeight;s.scrollTo({top:d-u/2,behavior:"smooth"})}},[r]),o.length?m("div",{ref:e,className:p("hidden lg:block p-icon overflow-auto sticky top-header mask-b-from-popover mask-b-from-85% mask-b-to-100% mask-b-to-transparent",c),children:[l("p",{className:"text-muted-foreground body mb-1 uppercase font-mono select-none",children:"On This Page"}),l("div",{className:"flex flex-col gap-1",children:o.map(t=>l("a",{href:t.url,ref:s=>{n.current[t.url]=s},className:"text-muted-foreground hover:text-foreground data-[active=true]:text-foreground body-sm no-underline transition-colors data-[depth=3]:pl-4 data-[depth=4]:pl-6","data-active":t.url===`#${r}`,"data-depth":t.depth,children:t.title},t.url))})]}):null}export{I as TableOfContents};
+"use client";import{jsxs as m,jsx as l}from"react/jsx-runtime";import{useMemo as p,useRef as i,useEffect as f,useState as h}from"react";import{classNames as v}from"../utils/primitives.js";import"clsx";function g(o){const[c,a]=h(null);return f(()=>{const r=new IntersectionObserver(n=>{for(const e of n)e.isIntersecting&&a(e.target.id)},{rootMargin:"0% 0% -80% 0%"});for(const n of o??[]){const e=document.getElementById(n);e&&r.observe(e)}return()=>{for(const n of o??[]){const e=document.getElementById(n);e&&r.unobserve(e)}}},[o]),c}function I({toc:o,className:c}){const a=p(()=>o.map(t=>t.url.replace("#","")),[o]),r=g(a),n=i({}),e=i(null);return f(()=>{const t=n.current[`#${r}`],s=e.current;if(t&&s){const d=t.offsetTop,u=s.clientHeight;s.scrollTo({top:d-u/2,behavior:"smooth"})}},[r]),o.length?m("div",{ref:e,className:v("hidden lg:block p-icon overflow-auto sticky top-header mask-b-from-popover mask-b-from-85% mask-b-to-100% mask-b-to-transparent",c),children:[l("p",{className:"text-muted-foreground body mb-1 uppercase font-mono select-none",children:"On This Page"}),l("div",{className:"flex flex-col gap-1",children:o.map(t=>l("a",{href:t.url,ref:s=>{n.current[t.url]=s},className:"text-muted-foreground hover:text-foreground data-[active=true]:text-foreground body-sm no-underline transition-colors data-[depth=3]:pl-4 data-[depth=4]:pl-6","data-active":t.url===`#${r}`,"data-depth":t.depth,children:t.title},t.url))})]}):null}export{I as TableOfContents};
 //# sourceMappingURL=table-of-contents.js.map

package/dist/components/table-of-contents.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-of-contents.js","sources":["../../lib/components/table-of-contents.tsx"],"sourcesContent":["'use client';\nimport { classNames } from 'lib/utils/primitives';\nimport { useEffect, useMemo, useRef, useState } from 'react';\n\nfunction useActiveItem(itemIds: string[]) {\n    const [activeId, setActiveId] = useState<string | null>(null);\n\n    useEffect(() => {\n        const observer = new IntersectionObserver(\n            entries => {\n                for (const entry of entries) {\n                    if (entry.isIntersecting) {\n                        setActiveId(entry.target.id);\n                    }\n                }\n            },\n            { rootMargin: '0% 0% -80% 0%' }\n        );\n\n        for (const id of itemIds ?? []) {\n            const element = document.getElementById(id);\n            if (element) {\n                observer.observe(element);\n            }\n        }\n\n        return () => {\n            for (const id of itemIds ?? []) {\n                const element = document.getElementById(id);\n                if (element) {\n                    observer.unobserve(element);\n                }\n            }\n        };\n    }, [itemIds]);\n\n    return activeId;\n}\n\nexport type Heading = {\n    title?: React.ReactNode;\n    url: string;\n    depth: number;\n};\n\nexport function TableOfContents({ toc, className }: { toc: Heading[]; className?: string }) {\n    const itemIds = useMemo(() => toc.map(item => item.url.replace('#', '')), [toc]);\n    const activeHeading = useActiveItem(itemIds);\n\n    const linkRefs = useRef<Record<string, HTMLAnchorElement | null>>({});\n    const containerRef = useRef<HTMLDivElement | null>(null);\n\n    // Scroll to active item\n    useEffect(() => {\n        const activeEl = linkRefs.current[`#${activeHeading}`];\n        const containerEl = containerRef.current;\n\n        if (activeEl && containerEl) {\n            const linkTop = activeEl.offsetTop;\n            const containerHeight = containerEl.clientHeight;\n            containerEl.scrollTo({\n                top: linkTop - containerHeight / 2,\n                behavior: 'smooth',\n            });\n        }\n    }, [activeHeading]);\n\n    if (!toc.length) {\n        return null;\n    }\n\n    return (\n        <div\n            ref={containerRef}\n            className={classNames(\n                'hidden lg:block p-icon overflow-auto sticky top-header mask-b-from-popover mask-b-from-85% mask-b-to-100% mask-b-to-transparent',\n                className\n            )}\n        >\n            <p className=\"text-muted-foreground body mb-1 uppercase font-mono select-none\">On This Page</p>\n            <div className=\"flex flex-col gap-1\">\n                {toc.map(item => (\n                    // It is okay to use plain <a hrefs> here because the links all point to IDs on the same page and does not impact any routers.\n                    <a\n                        key={item.url}\n                        href={item.url}\n                        ref={el => {\n                            linkRefs.current[item.url] = el;\n                        }}\n                        className=\"text-muted-foreground hover:text-foreground data-[active=true]:text-foreground body-sm no-underline transition-colors data-[depth=3]:pl-4 data-[depth=4]:pl-6\"\n                        data-active={item.url === `#${activeHeading}`}\n                        data-depth={item.depth}\n                    >\n                        {item.title}\n                    </a>\n                ))}\n            </div>\n        </div>\n    );\n}\n"],"names":["useActiveItem","itemIds","activeId","setActiveId","useState","useEffect","observer","entries","entry","id","element","TableOfContents","toc","className","useMemo","item","activeHeading","linkRefs","useRef","containerRef","activeEl","containerEl","linkTop","containerHeight","jsxs","classNames","jsx","el"],"mappings":"yMAIA,SAASA,EAAcC,EAAmB,CACtC,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAwB,IAAI,EAE5D,OAAAC,EAAU,IAAM,CACZ,MAAMC,EAAW,IAAI,qBACjBC,GAAW,CACP,UAAWC,KAASD,EACZC,EAAM,gBACNL,EAAYK,EAAM,OAAO,EAAE,CAGvC,EACA,CAAE,WAAY,eAAA,CAAgB,EAGlC,UAAWC,KAAMR,GAAW,GAAI,CAC5B,MAAMS,EAAU,SAAS,eAAeD,CAAE,EACtCC,GACAJ,EAAS,QAAQI,CAAO,CAEhC,CAEA,MAAO,IAAM,CACT,UAAWD,KAAMR,GAAW,GAAI,CAC5B,MAAMS,EAAU,SAAS,eAAeD,CAAE,EACtCC,GACAJ,EAAS,UAAUI,CAAO,CAElC,CACJ,CACJ,EAAG,CAACT,CAAO,CAAC,EAELC,CACX,CAQO,SAASS,EAAgB,CAAE,IAAAC,EAAK,UAAAC,GAAqD,CACxF,MAAMZ,EAAUa,EAAQ,IAAMF,EAAI,IAAIG,GAAQA,EAAK,IAAI,QAAQ,IAAK,EAAE,CAAC,EAAG,CAACH,CAAG,CAAC,EACzEI,EAAgBhB,EAAcC,CAAO,EAErCgB,EAAWC,EAAiD,EAAE,EAC9DC,EAAeD,EAA8B,IAAI,EAiBvD,OAdAb,EAAU,IAAM,CACZ,MAAMe,EAAWH,EAAS,QAAQ,IAAID,CAAa,EAAE,EAC/CK,EAAcF,EAAa,QAEjC,GAAIC,GAAYC,EAAa,CACzB,MAAMC,EAAUF,EAAS,UACnBG,EAAkBF,EAAY,aACpCA,EAAY,SAAS,CACjB,IAAKC,EAAUC,EAAkB,EACjC,SAAU,QAAA,CACb,CACL,CACJ,EAAG,CAACP,CAAa,CAAC,EAEbJ,EAAI,OAKLY,EAAC,MAAA,CACG,IAAKL,EACL,UAAWM,EACP,kIACAZ,CAAA,EAGJ,SAAA,CAAAa,EAAC,IAAA,CAAE,UAAU,kEAAkE,SAAA,eAAY,EAC3FA,EAAC,MAAA,CAAI,UAAU,sBACV,WAAI,IAAIX,GAELW,EAAC,IAAA,CAEG,KAAMX,EAAK,IACX,IAAKY,GAAM,CACPV,EAAS,QAAQF,EAAK,GAAG,EAAIY,CACjC,EACA,UAAU,gKACV,cAAaZ,EAAK,MAAQ,IAAIC,CAAa,GAC3C,aAAYD,EAAK,MAEhB,SAAAA,EAAK,KAAA,EATDA,EAAK,GAAA,CAWjB,CAAA,CACL,CAAA,CAAA,CAAA,EA5BG,IA+Bf"}
+{"version":3,"file":"table-of-contents.js","sources":["../../lib/components/table-of-contents.tsx"],"sourcesContent":["'use client';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { classNames } from '../utils/primitives';\n\nfunction useActiveItem(itemIds: string[]) {\n    const [activeId, setActiveId] = useState<string | null>(null);\n\n    useEffect(() => {\n        const observer = new IntersectionObserver(\n            entries => {\n                for (const entry of entries) {\n                    if (entry.isIntersecting) {\n                        setActiveId(entry.target.id);\n                    }\n                }\n            },\n            { rootMargin: '0% 0% -80% 0%' }\n        );\n\n        for (const id of itemIds ?? []) {\n            const element = document.getElementById(id);\n            if (element) {\n                observer.observe(element);\n            }\n        }\n\n        return () => {\n            for (const id of itemIds ?? []) {\n                const element = document.getElementById(id);\n                if (element) {\n                    observer.unobserve(element);\n                }\n            }\n        };\n    }, [itemIds]);\n\n    return activeId;\n}\n\nexport type Heading = {\n    title?: React.ReactNode;\n    url: string;\n    depth: number;\n};\n\nexport function TableOfContents({ toc, className }: { toc: Heading[]; className?: string }) {\n    const itemIds = useMemo(() => toc.map(item => item.url.replace('#', '')), [toc]);\n    const activeHeading = useActiveItem(itemIds);\n\n    const linkRefs = useRef<Record<string, HTMLAnchorElement | null>>({});\n    const containerRef = useRef<HTMLDivElement | null>(null);\n\n    // Scroll to active item\n    useEffect(() => {\n        const activeEl = linkRefs.current[`#${activeHeading}`];\n        const containerEl = containerRef.current;\n\n        if (activeEl && containerEl) {\n            const linkTop = activeEl.offsetTop;\n            const containerHeight = containerEl.clientHeight;\n            containerEl.scrollTo({\n                top: linkTop - containerHeight / 2,\n                behavior: 'smooth',\n            });\n        }\n    }, [activeHeading]);\n\n    if (!toc.length) {\n        return null;\n    }\n\n    return (\n        <div\n            ref={containerRef}\n            className={classNames(\n                'hidden lg:block p-icon overflow-auto sticky top-header mask-b-from-popover mask-b-from-85% mask-b-to-100% mask-b-to-transparent',\n                className\n            )}\n        >\n            <p className=\"text-muted-foreground body mb-1 uppercase font-mono select-none\">On This Page</p>\n            <div className=\"flex flex-col gap-1\">\n                {toc.map(item => (\n                    // It is okay to use plain <a hrefs> here because the links all point to IDs on the same page and does not impact any routers.\n                    <a\n                        key={item.url}\n                        href={item.url}\n                        ref={el => {\n                            linkRefs.current[item.url] = el;\n                        }}\n                        className=\"text-muted-foreground hover:text-foreground data-[active=true]:text-foreground body-sm no-underline transition-colors data-[depth=3]:pl-4 data-[depth=4]:pl-6\"\n                        data-active={item.url === `#${activeHeading}`}\n                        data-depth={item.depth}\n                    >\n                        {item.title}\n                    </a>\n                ))}\n            </div>\n        </div>\n    );\n}\n"],"names":["useActiveItem","itemIds","activeId","setActiveId","useState","useEffect","observer","entries","entry","id","element","TableOfContents","toc","className","useMemo","item","activeHeading","linkRefs","useRef","containerRef","activeEl","containerEl","linkTop","containerHeight","jsxs","classNames","jsx","el"],"mappings":"yMAIA,SAASA,EAAcC,EAAmB,CACtC,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAwB,IAAI,EAE5D,OAAAC,EAAU,IAAM,CACZ,MAAMC,EAAW,IAAI,qBACjBC,GAAW,CACP,UAAWC,KAASD,EACZC,EAAM,gBACNL,EAAYK,EAAM,OAAO,EAAE,CAGvC,EACA,CAAE,WAAY,eAAA,CAAgB,EAGlC,UAAWC,KAAMR,GAAW,GAAI,CAC5B,MAAMS,EAAU,SAAS,eAAeD,CAAE,EACtCC,GACAJ,EAAS,QAAQI,CAAO,CAEhC,CAEA,MAAO,IAAM,CACT,UAAWD,KAAMR,GAAW,GAAI,CAC5B,MAAMS,EAAU,SAAS,eAAeD,CAAE,EACtCC,GACAJ,EAAS,UAAUI,CAAO,CAElC,CACJ,CACJ,EAAG,CAACT,CAAO,CAAC,EAELC,CACX,CAQO,SAASS,EAAgB,CAAE,IAAAC,EAAK,UAAAC,GAAqD,CACxF,MAAMZ,EAAUa,EAAQ,IAAMF,EAAI,IAAIG,GAAQA,EAAK,IAAI,QAAQ,IAAK,EAAE,CAAC,EAAG,CAACH,CAAG,CAAC,EACzEI,EAAgBhB,EAAcC,CAAO,EAErCgB,EAAWC,EAAiD,EAAE,EAC9DC,EAAeD,EAA8B,IAAI,EAiBvD,OAdAb,EAAU,IAAM,CACZ,MAAMe,EAAWH,EAAS,QAAQ,IAAID,CAAa,EAAE,EAC/CK,EAAcF,EAAa,QAEjC,GAAIC,GAAYC,EAAa,CACzB,MAAMC,EAAUF,EAAS,UACnBG,EAAkBF,EAAY,aACpCA,EAAY,SAAS,CACjB,IAAKC,EAAUC,EAAkB,EACjC,SAAU,QAAA,CACb,CACL,CACJ,EAAG,CAACP,CAAa,CAAC,EAEbJ,EAAI,OAKLY,EAAC,MAAA,CACG,IAAKL,EACL,UAAWM,EACP,kIACAZ,CAAA,EAGJ,SAAA,CAAAa,EAAC,IAAA,CAAE,UAAU,kEAAkE,SAAA,eAAY,EAC3FA,EAAC,MAAA,CAAI,UAAU,sBACV,WAAI,IAAIX,GAELW,EAAC,IAAA,CAEG,KAAMX,EAAK,IACX,IAAKY,GAAM,CACPV,EAAS,QAAQF,EAAK,GAAG,EAAIY,CACjC,EACA,UAAU,gKACV,cAAaZ,EAAK,MAAQ,IAAIC,CAAa,GAC3C,aAAYD,EAAK,MAEhB,SAAAA,EAAK,KAAA,EATDA,EAAK,GAAA,CAWjB,CAAA,CACL,CAAA,CAAA,CAAA,EA5BG,IA+Bf"}

package/dist/components/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../lib/components/table.tsx"],"sourcesContent":["import { classNames } from 'lib/utils/primitives';\n\nexport function Table({ className, ...props }: React.ComponentProps<'table'>) {\n    return (\n        <table\n            className={classNames('caption-bottom [&_tr:last-child]:border-0 whitespace-nowrap', className)}\n            {...props}\n        />\n    );\n}\n\nexport function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {\n    return (\n        <thead\n            className={classNames('[&_tr]:border-b border-b', className)} // Added border-b to apply a bottom border\n            {...props}\n        />\n    );\n}\n\nexport function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {\n    return <tbody className={classNames(className)} {...props} />;\n}\n\nexport function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>) {\n    return <tfoot className={classNames('border-t font-medium last:[&>tr]:border-b-0', className)} {...props} />;\n}\n\nexport function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {\n    return <tr className={classNames('border-b border-border', className)} {...props} />;\n}\n\nexport function TableHead({ className, ...props }: React.ComponentProps<'th'>) {\n    return <th className={classNames('text-left align-middle font-medium', className)} {...props} />;\n}\n\nexport function TableCell({ className, ...props }: React.ComponentProps<'td'>) {\n    return <td className={classNames('[&_tr:last-child]:border-dotted', className)} {...props} />;\n}\n\nexport function TableCaption({ className, ...props }: React.ComponentProps<'caption'>) {\n    return <caption className={classNames('mt-icon text-muted-foreground', className)} {...props} />;\n}\n"],"names":["Table","className","props","jsx","classNames","TableHeader","TableBody","TableFooter","TableRow","TableHead","TableCell","TableCaption"],"mappings":"yGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAwC,CAC1E,OACIC,EAAC,QAAA,CACG,UAAWC,EAAW,8DAA+DH,CAAS,EAC7F,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASG,EAAY,CAAE,UAAAJ,EAAW,GAAGC,GAAwC,CAChF,OACIC,EAAC,QAAA,CACG,UAAWC,EAAW,2BAA4BH,CAAS,EAC1D,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASI,EAAU,CAAE,UAAAL,EAAW,GAAGC,GAAwC,CAC9E,SAAQ,QAAA,CAAM,UAAWE,EAAWH,CAAS,EAAI,GAAGC,EAAO,CAC/D,CAEO,SAASK,EAAY,CAAE,UAAAN,EAAW,GAAGC,GAAwC,CAChF,OAAOC,EAAC,SAAM,UAAWC,EAAW,8CAA+CH,CAAS,EAAI,GAAGC,EAAO,CAC9G,CAEO,SAASM,EAAS,CAAE,UAAAP,EAAW,GAAGC,GAAqC,CAC1E,OAAOC,EAAC,MAAG,UAAWC,EAAW,yBAA0BH,CAAS,EAAI,GAAGC,EAAO,CACtF,CAEO,SAASO,EAAU,CAAE,UAAAR,EAAW,GAAGC,GAAqC,CAC3E,OAAOC,EAAC,MAAG,UAAWC,EAAW,qCAAsCH,CAAS,EAAI,GAAGC,EAAO,CAClG,CAEO,SAASQ,EAAU,CAAE,UAAAT,EAAW,GAAGC,GAAqC,CAC3E,OAAOC,EAAC,MAAG,UAAWC,EAAW,kCAAmCH,CAAS,EAAI,GAAGC,EAAO,CAC/F,CAEO,SAASS,EAAa,CAAE,UAAAV,EAAW,GAAGC,GAA0C,CACnF,OAAOC,EAAC,WAAQ,UAAWC,EAAW,gCAAiCH,CAAS,EAAI,GAAGC,EAAO,CAClG"}
+{"version":3,"file":"table.js","sources":["../../lib/components/table.tsx"],"sourcesContent":["import { classNames } from '../utils/primitives';\n\nexport function Table({ className, ...props }: React.ComponentProps<'table'>) {\n    return (\n        <table\n            className={classNames('caption-bottom [&_tr:last-child]:border-0 whitespace-nowrap', className)}\n            {...props}\n        />\n    );\n}\n\nexport function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {\n    return (\n        <thead\n            className={classNames('[&_tr]:border-b border-b', className)} // Added border-b to apply a bottom border\n            {...props}\n        />\n    );\n}\n\nexport function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {\n    return <tbody className={classNames(className)} {...props} />;\n}\n\nexport function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>) {\n    return <tfoot className={classNames('border-t font-medium last:[&>tr]:border-b-0', className)} {...props} />;\n}\n\nexport function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {\n    return <tr className={classNames('border-b border-border', className)} {...props} />;\n}\n\nexport function TableHead({ className, ...props }: React.ComponentProps<'th'>) {\n    return <th className={classNames('text-left align-middle font-medium', className)} {...props} />;\n}\n\nexport function TableCell({ className, ...props }: React.ComponentProps<'td'>) {\n    return <td className={classNames('[&_tr:last-child]:border-dotted', className)} {...props} />;\n}\n\nexport function TableCaption({ className, ...props }: React.ComponentProps<'caption'>) {\n    return <caption className={classNames('mt-icon text-muted-foreground', className)} {...props} />;\n}\n"],"names":["Table","className","props","jsx","classNames","TableHeader","TableBody","TableFooter","TableRow","TableHead","TableCell","TableCaption"],"mappings":"yGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAwC,CAC1E,OACIC,EAAC,QAAA,CACG,UAAWC,EAAW,8DAA+DH,CAAS,EAC7F,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASG,EAAY,CAAE,UAAAJ,EAAW,GAAGC,GAAwC,CAChF,OACIC,EAAC,QAAA,CACG,UAAWC,EAAW,2BAA4BH,CAAS,EAC1D,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASI,EAAU,CAAE,UAAAL,EAAW,GAAGC,GAAwC,CAC9E,SAAQ,QAAA,CAAM,UAAWE,EAAWH,CAAS,EAAI,GAAGC,EAAO,CAC/D,CAEO,SAASK,EAAY,CAAE,UAAAN,EAAW,GAAGC,GAAwC,CAChF,OAAOC,EAAC,SAAM,UAAWC,EAAW,8CAA+CH,CAAS,EAAI,GAAGC,EAAO,CAC9G,CAEO,SAASM,EAAS,CAAE,UAAAP,EAAW,GAAGC,GAAqC,CAC1E,OAAOC,EAAC,MAAG,UAAWC,EAAW,yBAA0BH,CAAS,EAAI,GAAGC,EAAO,CACtF,CAEO,SAASO,EAAU,CAAE,UAAAR,EAAW,GAAGC,GAAqC,CAC3E,OAAOC,EAAC,MAAG,UAAWC,EAAW,qCAAsCH,CAAS,EAAI,GAAGC,EAAO,CAClG,CAEO,SAASQ,EAAU,CAAE,UAAAT,EAAW,GAAGC,GAAqC,CAC3E,OAAOC,EAAC,MAAG,UAAWC,EAAW,kCAAmCH,CAAS,EAAI,GAAGC,EAAO,CAC/F,CAEO,SAASS,EAAa,CAAE,UAAAV,EAAW,GAAGC,GAA0C,CACnF,OAAOC,EAAC,WAAQ,UAAWC,EAAW,gCAAiCH,CAAS,EAAI,GAAGC,EAAO,CAClG"}

package/dist/components/tabs.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as n}from"react/jsx-runtime";import{Tabs as i,composeRenderProps as r,TabList as s,Tab as l,TabPanel as c}from"react-aria-components";import{classNames as o}from"../utils/primitives.js";import"clsx";function d({className:t,...a}){return n(i,{className:r(t,e=>o("group flex flex-col gap-2","data-[orientation=vertical]:flex-row",e)),...a})}function p({className:t,...a}){return n(s,{className:r(t,e=>o("inline-flex items-center text-muted-foreground overflow-auto","data-[orientation=horizontal]:border-b data-[orientation=vertical]:h-auto data-[orientation=vertical]:border-e data-[orientation=vertical]:flex-col",e)),...a})}function x({className:t,...a}){return n(l,{className:r(t,e=>o("btn btn-ghost leading-none text-accent h-input truncate inline-flex items-center px-3 body-sm font-medium transition-all","data-[selected]:bg-primary/20 data-[selected]:text-primary","group-data-[orientation=vertical]:w-full",e)),...a})}function T({className:t,...a}){return n(c,{className:r(t,e=>o("ring-offset-background","focus-ring",e)),...a})}export{x as Tab,p as TabList,T as TabPanel,d as Tabs};
+"use client";import{jsx as n}from"react/jsx-runtime";import{useRef as c,useEffect as u}from"react";import{Tabs as b,composeRenderProps as o,TabList as f,Tab as m,TabPanel as d}from"react-aria-components";import{classNames as i}from"../utils/primitives.js";import"clsx";function h({className:t,...a}){return n(b,{className:o(t,e=>i("group flex flex-col gap-2","data-[orientation=vertical]:flex-row",e)),...a})}function w({className:t,...a}){const e=c(null);return u(()=>{const r=e.current;if(!r)return;const s=new MutationObserver(()=>{const l=r.querySelector("[data-selected]");l&&requestAnimationFrame(()=>{l.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})})});return s.observe(r,{attributes:!0,subtree:!0,attributeFilter:["data-selected"]}),()=>s.disconnect()},[]),n(f,{ref:e,className:o(t,r=>i("inline-flex items-center text-muted-foreground overflow-auto","data-[orientation=horizontal]:border-b data-[orientation=vertical]:h-auto data-[orientation=vertical]:border-e data-[orientation=vertical]:flex-col",r)),...a})}function N({className:t,...a}){return n(m,{className:o(t,e=>i("btn btn-ghost leading-none text-accent h-input truncate inline-flex items-center px-3 body-sm font-medium transition-all","data-[selected]:bg-primary/20 data-[selected]:text-primary","group-data-[orientation=vertical]:w-full",e)),...a})}function y({className:t,...a}){return n(d,{className:o(t,e=>i("ring-offset-background","focus-ring",e)),...a})}export{N as Tab,w as TabList,y as TabPanel,h as Tabs};
 //# sourceMappingURL=tabs.js.map

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../lib/components/tabs.tsx"],"sourcesContent":["'use client';\nimport {\n    Tab as AriaTab,\n    TabList as AriaTabList,\n    TabListProps as AriaTabListProps,\n    TabPanel as AriaTabPanel,\n    TabPanelProps as AriaTabPanelProps,\n    TabProps as AriaTabProps,\n    Tabs as AriaTabs,\n    TabsProps as AriaTabsProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from 'lib/utils/primitives';\n\nexport function Tabs({ className, ...props }: AriaTabsProps) {\n    return (\n        <AriaTabs\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'group flex flex-col gap-2',\n                    /* Orientation */\n                    'data-[orientation=vertical]:flex-row',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\n// TODO @mudasirpandith scroll to active tab, scrolling\nexport function TabList<T extends object>({ className, ...props }: AriaTabListProps<T>) {\n    return (\n        <AriaTabList\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'inline-flex items-center text-muted-foreground overflow-auto',\n                    /* Orientation */\n                    'data-[orientation=horizontal]:border-b data-[orientation=vertical]:h-auto data-[orientation=vertical]:border-e data-[orientation=vertical]:flex-col',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function Tab({ className, ...props }: AriaTabProps) {\n    return (\n        <AriaTab\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost leading-none text-accent h-input truncate inline-flex items-center px-3 body-sm font-medium transition-all',\n                    /* Selected */\n                    'data-[selected]:bg-primary/20 data-[selected]:text-primary',\n                    /* Orientation */\n                    'group-data-[orientation=vertical]:w-full',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function TabPanel({ className, ...props }: AriaTabPanelProps) {\n    return (\n        <AriaTabPanel\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'ring-offset-background',\n                    /* Focus Visible */\n                    'focus-ring',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n"],"names":["Tabs","className","props","jsx","AriaTabs","composeRenderProps","classNames","TabList","AriaTabList","Tab","AriaTab","TabPanel","AriaTabPanel"],"mappings":"+NAeO,SAASA,EAAK,CAAE,UAAAC,EAAW,GAAGC,GAAwB,CACzD,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,4BAEA,uCACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAGO,SAASK,EAA0B,CAAE,UAAAN,EAAW,GAAGC,GAA8B,CACpF,OACIC,EAACK,EAAA,CACG,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,+DAEA,sJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASO,EAAI,CAAE,UAAAR,EAAW,GAAGC,GAAuB,CACvD,OACIC,EAACO,EAAA,CACG,UAAWL,EAAmBJ,EAAWA,GACrCK,EACI,2HAEA,6DAEA,2CACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASS,EAAS,CAAE,UAAAV,EAAW,GAAGC,GAA4B,CACjE,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBJ,EAAWA,GACrCK,EACI,yBAEA,aACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB"}
+{"version":3,"file":"tabs.js","sources":["../../lib/components/tabs.tsx"],"sourcesContent":["'use client';\nimport { useEffect, useRef } from 'react';\nimport {\n    Tab as AriaTab,\n    TabList as AriaTabList,\n    TabListProps as AriaTabListProps,\n    TabPanel as AriaTabPanel,\n    TabPanelProps as AriaTabPanelProps,\n    TabProps as AriaTabProps,\n    Tabs as AriaTabs,\n    TabsProps as AriaTabsProps,\n    composeRenderProps,\n} from 'react-aria-components';\nimport { classNames } from '../utils/primitives';\n\nexport function Tabs({ className, ...props }: AriaTabsProps) {\n    return (\n        <AriaTabs\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'group flex flex-col gap-2',\n                    /* Orientation */\n                    'data-[orientation=vertical]:flex-row',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function TabList<T extends object>({ className, ...props }: AriaTabListProps<T>) {\n    const listRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const tabList = listRef.current;\n        if (!tabList) return;\n\n        const observer = new MutationObserver(() => {\n            const activeTab = tabList.querySelector<HTMLElement>('[data-selected]');\n\n            if (activeTab) {\n                requestAnimationFrame(() => {\n                    activeTab.scrollIntoView({\n                        behavior: 'smooth',\n                        inline: 'center',\n                        block: 'nearest',\n                    });\n                });\n            }\n        });\n\n        observer.observe(tabList, {\n            attributes: true,\n            subtree: true,\n            attributeFilter: ['data-selected'],\n        });\n\n        return () => observer.disconnect();\n    }, []);\n\n    return (\n        <AriaTabList\n            ref={listRef}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'inline-flex items-center text-muted-foreground overflow-auto',\n                    /* Orientation */\n                    'data-[orientation=horizontal]:border-b data-[orientation=vertical]:h-auto data-[orientation=vertical]:border-e data-[orientation=vertical]:flex-col',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function Tab({ className, ...props }: AriaTabProps) {\n    return (\n        <AriaTab\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost leading-none text-accent h-input truncate inline-flex items-center px-3 body-sm font-medium transition-all',\n                    /* Selected */\n                    'data-[selected]:bg-primary/20 data-[selected]:text-primary',\n                    /* Orientation */\n                    'group-data-[orientation=vertical]:w-full',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function TabPanel({ className, ...props }: AriaTabPanelProps) {\n    return (\n        <AriaTabPanel\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'ring-offset-background',\n                    /* Focus Visible */\n                    'focus-ring',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n"],"names":["Tabs","className","props","jsx","AriaTabs","composeRenderProps","classNames","TabList","listRef","useRef","useEffect","tabList","observer","activeTab","AriaTabList","Tab","AriaTab","TabPanel","AriaTabPanel"],"mappings":"6QAeO,SAASA,EAAK,CAAE,UAAAC,EAAW,GAAGC,GAAwB,CACzD,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,4BAEA,uCACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASK,EAA0B,CAAE,UAAAN,EAAW,GAAGC,GAA8B,CACpF,MAAMM,EAAUC,EAAuB,IAAI,EAE3C,OAAAC,EAAU,IAAM,CACZ,MAAMC,EAAUH,EAAQ,QACxB,GAAI,CAACG,EAAS,OAEd,MAAMC,EAAW,IAAI,iBAAiB,IAAM,CACxC,MAAMC,EAAYF,EAAQ,cAA2B,iBAAiB,EAElEE,GACA,sBAAsB,IAAM,CACxBA,EAAU,eAAe,CACrB,SAAU,SACV,OAAQ,SACR,MAAO,SAAA,CACV,CACL,CAAC,CAET,CAAC,EAED,OAAAD,EAAS,QAAQD,EAAS,CACtB,WAAY,GACZ,QAAS,GACT,gBAAiB,CAAC,eAAe,CAAA,CACpC,EAEM,IAAMC,EAAS,WAAA,CAC1B,EAAG,CAAA,CAAE,EAGDT,EAACW,EAAA,CACG,IAAKN,EACL,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,+DAEA,sJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASa,EAAI,CAAE,UAAAd,EAAW,GAAGC,GAAuB,CACvD,OACIC,EAACa,EAAA,CACG,UAAWX,EAAmBJ,EAAWA,GACrCK,EACI,2HAEA,6DAEA,2CACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASe,EAAS,CAAE,UAAAhB,EAAW,GAAGC,GAA4B,CACjE,OACIC,EAACe,EAAA,CACG,UAAWb,EAAmBJ,EAAWA,GACrCK,EACI,yBAEA,aACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB"}

package/dist/components/textfield.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import{TextField as u,composeRenderProps as i,TextArea as f,Input as p}from"react-aria-components";import{useTfFieldContext as c}from"../utils/form-utils.js";import{getFieldErrorMessage as d,classNames as n}from"../utils/primitives.js";import{FormField as g}from"./field.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";import"clsx";import"class-variance-authority";import"lucide-react";const b=u;function x({className:r,...o}){return t(p,{className:i(r,e=>n("flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:body-sm file:font-medium placeholder:text-muted-foreground","disabled-muted","focus-ring",e)),...o})}function T({className:r,...o}){return t(f,{className:i(r,e=>n("flex min-h-32 w-full border border-input bg-popover px-3 py-2 body-sm ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted",e)),...o})}function h({label:r,description:o,errorMessage:e,textArea:l,className:m,...a}){return t(b,{className:i(m,s=>n("group form-field",s)),...a,children:t(g,{label:r,errorMessage:e,description:o,children:l?t(T,{}):t(x,{})})})}function M({isDisabled:r,...o}){const e=c({disabled:r});return t(h,{isDisabled:r||e.form.state.isSubmitting,value:e.state.value,id:e.name,name:e.name,onBlur:e.handleBlur,onChange:e.handleChange,isInvalid:!!d(e),errorMessage:d(e),...o})}export{h as TextField,M as TfTextField};
+import{jsx as t}from"react/jsx-runtime";import{TextField as u,composeRenderProps as i,TextArea as f,Input as p}from"react-aria-components";import{useTfFieldContext as c}from"../utils/form-utils.js";import{getFieldErrorMessage as d,classNames as n}from"../utils/primitives.js";import{FormField as g}from"./field.js";import"react";import"../utils/form-context.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"lucide-react";const b=u;function x({className:r,...o}){return t(p,{className:i(r,e=>n("flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:body-sm file:font-medium placeholder:text-muted-foreground","disabled-muted","focus-ring",e)),...o})}function T({className:r,...o}){return t(f,{className:i(r,e=>n("flex min-h-32 w-full border border-input bg-popover px-3 py-2 body-sm ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted",e)),...o})}function h({label:r,description:o,errorMessage:e,textArea:l,className:m,...a}){return t(b,{className:i(m,s=>n("group form-field",s)),...a,children:t(g,{label:r,errorMessage:e,description:o,children:l?t(T,{}):t(x,{})})})}function M({isDisabled:r,...o}){const e=c({disabled:r});return t(h,{isDisabled:r||e.form.state.isSubmitting,value:e.state.value,id:e.name,name:e.name,onBlur:e.handleBlur,onChange:e.handleChange,isInvalid:!!d(e),errorMessage:d(e),...o})}export{h as TextField,M as TfTextField};
 //# sourceMappingURL=textfield.js.map

package/dist/components/textfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    TextArea as AriaTextArea,\n    TextAreaProps as AriaTextAreaProps,\n    TextField as AriaTextField,\n    TextFieldProps as AriaTextFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { useTfFieldContext } from 'lib/utils/form-utils';\nimport { classNames, getFieldErrorMessage } from 'lib/utils/primitives';\nimport { FormField, type FormFieldProps } from './field';\n\nconst ATextField = AriaTextField;\n\nfunction Input({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:body-sm file:font-medium placeholder:text-muted-foreground',\n                    /* Disabled */\n                    'disabled-muted',\n                    /* Focused */\n                    'focus-ring',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction TextArea({ className, ...props }: AriaTextAreaProps) {\n    return (\n        <AriaTextArea\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'flex min-h-32 w-full border border-input bg-popover px-3 py-2 body-sm ring-offset-background placeholder:text-muted-foreground',\n                    /* Focused */\n                    'focus-ring',\n                    /* Disabled */\n                    'disabled-muted',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {\n    textArea?: boolean;\n}\n\nexport function TextField({ label, description, errorMessage, textArea, className, ...props }: TextFieldProps) {\n    return (\n        <ATextField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                {textArea ? <TextArea /> : <Input />}\n            </FormField>\n        </ATextField>\n    );\n}\n\nexport function TfTextField({ isDisabled, ...props }: React.ComponentProps<typeof TextField>) {\n    const field = useTfFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <TextField\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            id={field.name}\n            name={field.name}\n            onBlur={field.handleBlur}\n            onChange={field.handleChange}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["ATextField","AriaTextField","Input","className","props","jsx","AriaInput","composeRenderProps","classNames","TextArea","AriaTextArea","TextField","label","description","errorMessage","textArea","FormField","TfTextField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"0cAcA,MAAMA,EAAaC,EAEnB,SAASC,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACpD,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,gLAEA,iBAEA,aACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAS,CAAE,UAAAN,EAAW,GAAGC,GAA4B,CAC1D,OACIC,EAACK,EAAA,CACG,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,iIAEA,aAEA,iBACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAMO,SAASO,EAAU,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,SAAAC,EAAU,UAAAZ,EAAW,GAAGC,GAAyB,CAC3G,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAC,EAACW,EAAA,CAAU,MAAAJ,EAAc,aAAAE,EAA4B,YAAAD,EAChD,SAAAE,EAAWV,EAACI,EAAA,CAAA,CAAS,EAAKJ,EAACH,EAAA,CAAA,CAAM,CAAA,CACtC,CAAA,CAAA,CAGZ,CAEO,SAASe,EAAY,CAAE,WAAAC,EAAY,GAAGd,GAAiD,CAC1F,MAAMe,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACIb,EAACM,EAAA,CACG,WAAYO,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,KAAMA,EAAM,KACZ,OAAQA,EAAM,WACd,SAAUA,EAAM,aAChB,UAAW,CAAC,CAACE,EAAqBF,CAAK,EACvC,aAAcE,EAAqBF,CAAK,EACvC,GAAGf,CAAA,CAAA,CAGhB"}
+{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    TextArea as AriaTextArea,\n    TextAreaProps as AriaTextAreaProps,\n    TextField as AriaTextField,\n    TextFieldProps as AriaTextFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { useTfFieldContext } from '../utils/form-utils';\nimport { classNames, getFieldErrorMessage } from '../utils/primitives';\nimport { FormField, type FormFieldProps } from './field';\n\nconst ATextField = AriaTextField;\n\nfunction Input({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:body-sm file:font-medium placeholder:text-muted-foreground',\n                    /* Disabled */\n                    'disabled-muted',\n                    /* Focused */\n                    'focus-ring',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction TextArea({ className, ...props }: AriaTextAreaProps) {\n    return (\n        <AriaTextArea\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'flex min-h-32 w-full border border-input bg-popover px-3 py-2 body-sm ring-offset-background placeholder:text-muted-foreground',\n                    /* Focused */\n                    'focus-ring',\n                    /* Disabled */\n                    'disabled-muted',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {\n    textArea?: boolean;\n}\n\nexport function TextField({ label, description, errorMessage, textArea, className, ...props }: TextFieldProps) {\n    return (\n        <ATextField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                {textArea ? <TextArea /> : <Input />}\n            </FormField>\n        </ATextField>\n    );\n}\n\nexport function TfTextField({ isDisabled, ...props }: React.ComponentProps<typeof TextField>) {\n    const field = useTfFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <TextField\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            id={field.name}\n            name={field.name}\n            onBlur={field.handleBlur}\n            onChange={field.handleChange}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["ATextField","AriaTextField","Input","className","props","jsx","AriaInput","composeRenderProps","classNames","TextArea","AriaTextArea","TextField","label","description","errorMessage","textArea","FormField","TfTextField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"0cAcA,MAAMA,EAAaC,EAEnB,SAASC,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACpD,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,gLAEA,iBAEA,aACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAS,CAAE,UAAAN,EAAW,GAAGC,GAA4B,CAC1D,OACIC,EAACK,EAAA,CACG,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,iIAEA,aAEA,iBACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAMO,SAASO,EAAU,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,SAAAC,EAAU,UAAAZ,EAAW,GAAGC,GAAyB,CAC3G,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAC,EAACW,EAAA,CAAU,MAAAJ,EAAc,aAAAE,EAA4B,YAAAD,EAChD,SAAAE,EAAWV,EAACI,EAAA,CAAA,CAAS,EAAKJ,EAACH,EAAA,CAAA,CAAM,CAAA,CACtC,CAAA,CAAA,CAGZ,CAEO,SAASe,EAAY,CAAE,WAAAC,EAAY,GAAGd,GAAiD,CAC1F,MAAMe,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACIb,EAACM,EAAA,CACG,WAAYO,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,KAAMA,EAAM,KACZ,OAAQA,EAAM,WACd,SAAUA,EAAM,aAChB,UAAW,CAAC,CAACE,EAAqBF,CAAK,EACvC,aAAcE,EAAqBF,CAAK,EACvC,GAAGf,CAAA,CAAA,CAGhB"}

package/dist/components/timeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.js","sources":["../../lib/components/timeline.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { classNames } from 'lib/utils/primitives';\nimport type { LucideIcon } from 'lucide-react';\n\nexport function Timeline({ className, ...props }: React.ComponentProps<'ol'>) {\n    return <ol className={classNames('grid grid-col-1 gap-icon', className)} {...props} />;\n}\n\nexport function TimelineItem({ className, ...props }: React.ComponentProps<'li'> & {}) {\n    return (\n        <li\n            className={classNames('grid grid-cols-[4rem_2rem_1fr] grid-rows-subgrid list-none gap-icon', className)}\n            {...props}\n        />\n    );\n}\n\nexport const timelineIconVariants = cva(`p-1 rounded-full`, {\n    variants: {\n        variant: {\n            destructive: 'text-destructive-foreground bg-destructive',\n            success: 'text-success-foreground bg-success',\n            muted: 'text-muted-foreground bg-muted',\n        },\n    },\n    defaultVariants: {\n        variant: 'muted',\n    },\n});\n\nexport function TimelineIcon({\n    icon: Icon,\n    className,\n    variant,\n    ...props\n}: Omit<React.ComponentProps<'div'>, 'children'> &\n    VariantProps<typeof timelineIconVariants> & {\n        icon: LucideIcon;\n    }) {\n    return (\n        <div {...props} className=\"flex flex-col items-center gap-2\">\n            <div className={classNames(timelineIconVariants({ variant, className }))}>\n                <Icon className=\"size-icon \" />\n            </div>\n            <div className=\"h-full w-[1px]\" />\n        </div>\n    );\n}\n\nexport function TimelineDate({\n    className,\n    date,\n    dateFormatter,\n    ...props\n}: Omit<React.ComponentProps<'time'>, 'dateTime' | 'children'> & {\n    date: Date;\n    dateFormatter?: (d: Date) => string;\n}) {\n    const defaultDateDisplay = `${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getFullYear()}`;\n    return (\n        <time\n            {...props}\n            dateTime={date.toISOString()}\n            className={classNames('font-mono leading-none text-muted', className)}\n        >\n            {dateFormatter ? dateFormatter(date) : defaultDateDisplay}\n        </time>\n    );\n}\n\nexport function TimelineContent({ className, ...props }: React.ComponentProps<'section'>) {\n    return <section className={classNames('', className)} {...props} />;\n}\n"],"names":["Timeline","className","props","jsx","classNames","TimelineItem","timelineIconVariants","cva","TimelineIcon","Icon","variant","jsxs","TimelineDate","date","dateFormatter","defaultDateDisplay","TimelineContent"],"mappings":"kKAIO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAqC,CAC1E,OAAOC,EAAC,MAAG,UAAWC,EAAW,2BAA4BH,CAAS,EAAI,GAAGC,EAAO,CACxF,CAEO,SAASG,EAAa,CAAE,UAAAJ,EAAW,GAAGC,GAA0C,CACnF,OACIC,EAAC,KAAA,CACG,UAAWC,EAAW,sEAAuEH,CAAS,EACrG,GAAGC,CAAA,CAAA,CAGhB,CAEO,MAAMI,EAAuBC,EAAI,mBAAoB,CACxD,SAAU,CACN,QAAS,CACL,YAAa,6CACb,QAAS,qCACT,MAAO,gCAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,OAAA,CAEjB,CAAC,EAEM,SAASC,EAAa,CACzB,KAAMC,EACN,UAAAR,EACA,QAAAS,EACA,GAAGR,CACP,EAGO,CACH,OACIS,EAAC,MAAA,CAAK,GAAGT,EAAO,UAAU,mCACtB,SAAA,CAAAC,EAAC,MAAA,CAAI,UAAWC,EAAWE,EAAqB,CAAE,QAAAI,EAAS,UAAAT,CAAA,CAAW,CAAC,EACnE,SAAAE,EAACM,EAAA,CAAK,UAAU,aAAa,EACjC,EACAN,EAAC,MAAA,CAAI,UAAU,gBAAA,CAAiB,CAAA,EACpC,CAER,CAEO,SAASS,EAAa,CACzB,UAAAX,EACA,KAAAY,EACA,cAAAC,EACA,GAAGZ,CACP,EAGG,CACC,MAAMa,EAAqB,IAAIF,EAAK,SAAA,EAAa,GAAG,SAAA,EAAW,SAAS,EAAG,GAAG,CAAC,IAAIA,EAAK,aAAa,GACrG,OACIV,EAAC,OAAA,CACI,GAAGD,EACJ,SAAUW,EAAK,YAAA,EACf,UAAWT,EAAW,oCAAqCH,CAAS,EAEnE,SAAAa,EAAgBA,EAAcD,CAAI,EAAIE,CAAA,CAAA,CAGnD,CAEO,SAASC,EAAgB,CAAE,UAAAf,EAAW,GAAGC,GAA0C,CACtF,OAAOC,EAAC,WAAQ,UAAWC,EAAW,GAAIH,CAAS,EAAI,GAAGC,EAAO,CACrE"}
+{"version":3,"file":"timeline.js","sources":["../../lib/components/timeline.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport type { LucideIcon } from 'lucide-react';\nimport { classNames } from '../utils/primitives';\n\nexport function Timeline({ className, ...props }: React.ComponentProps<'ol'>) {\n    return <ol className={classNames('grid grid-col-1 gap-icon', className)} {...props} />;\n}\n\nexport function TimelineItem({ className, ...props }: React.ComponentProps<'li'> & {}) {\n    return (\n        <li\n            className={classNames('grid grid-cols-[4rem_2rem_1fr] grid-rows-subgrid list-none gap-icon', className)}\n            {...props}\n        />\n    );\n}\n\nexport const timelineIconVariants = cva(`p-1 rounded-full`, {\n    variants: {\n        variant: {\n            destructive: 'text-destructive-foreground bg-destructive',\n            success: 'text-success-foreground bg-success',\n            muted: 'text-muted-foreground bg-muted',\n        },\n    },\n    defaultVariants: {\n        variant: 'muted',\n    },\n});\n\nexport function TimelineIcon({\n    icon: Icon,\n    className,\n    variant,\n    ...props\n}: Omit<React.ComponentProps<'div'>, 'children'> &\n    VariantProps<typeof timelineIconVariants> & {\n        icon: LucideIcon;\n    }) {\n    return (\n        <div {...props} className=\"flex flex-col items-center gap-2\">\n            <div className={classNames(timelineIconVariants({ variant, className }))}>\n                <Icon className=\"size-icon \" />\n            </div>\n            <div className=\"h-full w-[1px]\" />\n        </div>\n    );\n}\n\nexport function TimelineDate({\n    className,\n    date,\n    dateFormatter,\n    ...props\n}: Omit<React.ComponentProps<'time'>, 'dateTime' | 'children'> & {\n    date: Date;\n    dateFormatter?: (d: Date) => string;\n}) {\n    const defaultDateDisplay = `${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getFullYear()}`;\n    return (\n        <time\n            {...props}\n            dateTime={date.toISOString()}\n            className={classNames('font-mono leading-none text-muted', className)}\n        >\n            {dateFormatter ? dateFormatter(date) : defaultDateDisplay}\n        </time>\n    );\n}\n\nexport function TimelineContent({ className, ...props }: React.ComponentProps<'section'>) {\n    return <section className={classNames('', className)} {...props} />;\n}\n"],"names":["Timeline","className","props","jsx","classNames","TimelineItem","timelineIconVariants","cva","TimelineIcon","Icon","variant","jsxs","TimelineDate","date","dateFormatter","defaultDateDisplay","TimelineContent"],"mappings":"kKAIO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAqC,CAC1E,OAAOC,EAAC,MAAG,UAAWC,EAAW,2BAA4BH,CAAS,EAAI,GAAGC,EAAO,CACxF,CAEO,SAASG,EAAa,CAAE,UAAAJ,EAAW,GAAGC,GAA0C,CACnF,OACIC,EAAC,KAAA,CACG,UAAWC,EAAW,sEAAuEH,CAAS,EACrG,GAAGC,CAAA,CAAA,CAGhB,CAEO,MAAMI,EAAuBC,EAAI,mBAAoB,CACxD,SAAU,CACN,QAAS,CACL,YAAa,6CACb,QAAS,qCACT,MAAO,gCAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,OAAA,CAEjB,CAAC,EAEM,SAASC,EAAa,CACzB,KAAMC,EACN,UAAAR,EACA,QAAAS,EACA,GAAGR,CACP,EAGO,CACH,OACIS,EAAC,MAAA,CAAK,GAAGT,EAAO,UAAU,mCACtB,SAAA,CAAAC,EAAC,MAAA,CAAI,UAAWC,EAAWE,EAAqB,CAAE,QAAAI,EAAS,UAAAT,CAAA,CAAW,CAAC,EACnE,SAAAE,EAACM,EAAA,CAAK,UAAU,aAAa,EACjC,EACAN,EAAC,MAAA,CAAI,UAAU,gBAAA,CAAiB,CAAA,EACpC,CAER,CAEO,SAASS,EAAa,CACzB,UAAAX,EACA,KAAAY,EACA,cAAAC,EACA,GAAGZ,CACP,EAGG,CACC,MAAMa,EAAqB,IAAIF,EAAK,SAAA,EAAa,GAAG,SAAA,EAAW,SAAS,EAAG,GAAG,CAAC,IAAIA,EAAK,aAAa,GACrG,OACIV,EAAC,OAAA,CACI,GAAGD,EACJ,SAAUW,EAAK,YAAA,EACf,UAAWT,EAAW,oCAAqCH,CAAS,EAEnE,SAAAa,EAAgBA,EAAcD,CAAI,EAAIE,CAAA,CAAA,CAGnD,CAEO,SAASC,EAAgB,CAAE,UAAAf,EAAW,GAAGC,GAA0C,CACtF,OAAOC,EAAC,WAAQ,UAAWC,EAAW,GAAIH,CAAS,EAAI,GAAGC,EAAO,CACrE"}

package/dist/components/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../lib/components/tooltip.tsx"],"sourcesContent":["import {\n    Tooltip as AriaTooltip,\n    TooltipTrigger as AriaTooltipTrigger,\n    composeRenderProps,\n    type TooltipProps as AriaTooltipProps,\n} from 'react-aria-components';\n\nimport { classNames } from 'lib/utils/primitives';\n\nconst TooltipTrigger = AriaTooltipTrigger;\nconst Tooltip = ({ className, offset = 4, ...props }: AriaTooltipProps) => (\n    <AriaTooltip\n        offset={offset}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'z-50 overflow-hidden border bg-popover px-3 py-1.5 body-sm text-popover-foreground shadow-md animate-in fade-in-0',\n                /* Entering */\n                'data-[entering]:zoom-in-95',\n                /* Exiting */\n                'data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95',\n                /* Placement */\n                'data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n\nexport { Tooltip, TooltipTrigger };\n"],"names":["TooltipTrigger","AriaTooltipTrigger","Tooltip","className","offset","props","jsx","AriaTooltip","composeRenderProps","classNames"],"mappings":"qMASA,MAAMA,EAAiBC,EACjBC,EAAU,CAAC,CAAE,UAAAC,EAAW,OAAAC,EAAS,EAAG,GAAGC,KACzCC,EAACC,EAAA,CACG,OAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,oHAEA,6BAEA,kFAEA,kLACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR"}
+{"version":3,"file":"tooltip.js","sources":["../../lib/components/tooltip.tsx"],"sourcesContent":["import {\n    Tooltip as AriaTooltip,\n    TooltipTrigger as AriaTooltipTrigger,\n    composeRenderProps,\n    type TooltipProps as AriaTooltipProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utils/primitives';\n\nconst TooltipTrigger = AriaTooltipTrigger;\nconst Tooltip = ({ className, offset = 4, ...props }: AriaTooltipProps) => (\n    <AriaTooltip\n        offset={offset}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'z-50 overflow-hidden border bg-popover px-3 py-1.5 body-sm text-popover-foreground shadow-md animate-in fade-in-0',\n                /* Entering */\n                'data-[entering]:zoom-in-95',\n                /* Exiting */\n                'data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95',\n                /* Placement */\n                'data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n\nexport { Tooltip, TooltipTrigger };\n"],"names":["TooltipTrigger","AriaTooltipTrigger","Tooltip","className","offset","props","jsx","AriaTooltip","composeRenderProps","classNames"],"mappings":"qMASA,MAAMA,EAAiBC,EACjBC,EAAU,CAAC,CAAE,UAAAC,EAAW,OAAAC,EAAS,EAAG,GAAGC,KACzCC,EAACC,EAAA,CACG,OAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,oHAEA,6BAEA,kFAEA,kLACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR"}

package/dist/utils/form-hook.d.ts

@@ -1,9 +1,9 @@
-import { Button } from 'lib/components/button';
-import { TfCheckbox } from 'lib/components/checkbox';
-import { TfMultiSelect } from 'lib/components/multi-select';
-import { TfNumberField } from 'lib/components/numberfield';
-import { TfSingleSelect } from 'lib/components/select';
-import { TfTextField } from 'lib/components/textfield';
+import { Button } from '../components/button';
+import { TfCheckbox } from '../components/checkbox';
+import { TfMultiSelect } from '../components/multi-select';
+import { TfNumberField } from '../components/numberfield';
+import { TfSingleSelect } from '../components/select';
+import { TfTextField } from '../components/textfield';
 /** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */
 /** TODO, lazy loading when fieldComponents are large */
 /**

package/dist/utils/form-hook.js

@@ -1,2 +1,2 @@
-import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"./primitives.js";import"clsx";import"react-aria-components";import"../components/loader.js";import"lucide-react";import"../components/field.js";import"./form-utils.js";import"react";import"../components/menu.js";import"../components/list-box.js";import"../components/popover.js";const{useAppForm:q}=o({fieldComponents:{TfTextField:e,TfNumberField:i,TfMultiSelect:t,TfSingleSelect:p,TfCheckbox:r},formComponents:{Button:m},fieldContext:n,formContext:f});export{q as useAppForm};
+import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"react-aria-components";import"./primitives.js";import"clsx";import"../components/loader.js";import"lucide-react";import"../components/field.js";import"./form-utils.js";import"react";import"../components/menu.js";import"../components/list-box.js";import"../components/popover.js";const{useAppForm:q}=o({fieldComponents:{TfTextField:e,TfNumberField:i,TfMultiSelect:t,TfSingleSelect:p,TfCheckbox:r},formComponents:{Button:m},fieldContext:n,formContext:f});export{q as useAppForm};
 //# sourceMappingURL=form-hook.js.map

package/dist/utils/form-hook.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-hook.js","sources":["../../lib/utils/form-hook.tsx"],"sourcesContent":["import { createFormHook } from '@tanstack/react-form';\nimport { Button } from 'lib/components/button';\nimport { TfCheckbox } from 'lib/components/checkbox';\nimport { TfMultiSelect } from 'lib/components/multi-select';\nimport { TfNumberField } from 'lib/components/numberfield';\nimport { TfSingleSelect } from 'lib/components/select';\nimport { TfTextField } from 'lib/components/textfield';\nimport { fieldContext, formContext } from 'lib/utils/form-context';\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\nexport const { useAppForm } = createFormHook({\n    fieldComponents: {\n        TfTextField,\n        TfNumberField,\n        TfMultiSelect,\n        TfSingleSelect,\n        TfCheckbox,\n    },\n    formComponents: {\n        Button,\n    },\n    fieldContext,\n    formContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"syBAcO,KAAM,CAAE,WAAAA,CAAA,EAAeC,EAAe,CACzC,gBAAiB,CACb,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAEJ,eAAgB,CACZ,OAAAC,CAAA,EAEJ,aAAAC,EACA,YAAAC,CACJ,CAAC"}
+{"version":3,"file":"form-hook.js","sources":["../../lib/utils/form-hook.tsx"],"sourcesContent":["import { createFormHook } from '@tanstack/react-form';\nimport { Button } from '../components/button';\nimport { TfCheckbox } from '../components/checkbox';\nimport { TfMultiSelect } from '../components/multi-select';\nimport { TfNumberField } from '../components/numberfield';\nimport { TfSingleSelect } from '../components/select';\nimport { TfTextField } from '../components/textfield';\nimport { fieldContext, formContext } from '../utils/form-context';\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\nexport const { useAppForm } = createFormHook({\n    fieldComponents: {\n        TfTextField,\n        TfNumberField,\n        TfMultiSelect,\n        TfSingleSelect,\n        TfCheckbox,\n    },\n    formComponents: {\n        Button,\n    },\n    fieldContext,\n    formContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"syBAcO,KAAM,CAAE,WAAAA,CAAA,EAAeC,EAAe,CACzC,gBAAiB,CACb,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAEJ,eAAgB,CACZ,OAAAC,CAAA,EAEJ,aAAAC,EACA,YAAAC,CACJ,CAAC"}

package/dist/utils/form-utils.js

@@ -1,2 +1,2 @@
-import{useFieldContext as o}from"./form-context.js";import i from"react";import"@tanstack/react-form";const l=({disabled:e})=>{const t=o();return i.useEffect(()=>{t.setMeta(n=>({...n,disabled:!!e}))},[e,t]),t};function d(e){return async({formApi:t})=>{const n=c(t.state.values,t);await e({values:n,formApi:t})}}function c(e,t){const n={};for(const s in e)t.getFieldMeta(s)?.disabled||(n[s]=e[s]);return n}export{d as tfOnSubmit,l as useTfFieldContext};
+import o from"react";import{useFieldContext as i}from"./form-context.js";import"@tanstack/react-form";const l=({disabled:e})=>{const t=i();return o.useEffect(()=>{t.setMeta(n=>({...n,disabled:!!e}))},[e,t]),t};function d(e){return async({formApi:t})=>{const n=c(t.state.values,t);await e({values:n,formApi:t})}}function c(e,t){const n={};for(const s in e)t.getFieldMeta(s)?.disabled||(n[s]=e[s]);return n}export{d as tfOnSubmit,l as useTfFieldContext};
 //# sourceMappingURL=form-utils.js.map

package/dist/utils/form-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-utils.js","sources":["../../lib/utils/form-utils.tsx"],"sourcesContent":["import { type AnyFieldMeta, type FormApi } from '@tanstack/react-form';\nimport { useFieldContext } from 'lib/utils/form-context';\nimport React from 'react';\n\ntype FieldContextProps = {\n    disabled?: boolean;\n};\n\n/**\n * Custom hook to handle disabled state for form fields\n * @param {boolean} disabled - The disabled prop passed to the component\n * @returns The field context with disabled state properly managed\n */\nexport const useTfFieldContext = <T,>({ disabled }: FieldContextProps) => {\n    const field = useFieldContext<T>();\n\n    React.useEffect(() => {\n        field.setMeta(meta => ({\n            ...meta,\n            disabled: !!disabled,\n        }));\n    }, [disabled, field]);\n\n    return field;\n};\n\n/** Utility type to simplify FormApi usage */\nexport type AppFormApi<TValues> = FormApi<TValues, any, any, any, any, any, any, any, any, any>;\n\n/**\n * Utility function to submit a form with a handler that receives the values and the formApi.\n * @param onSubmit - The handler function to call with the values and the formApi.\n * @returns A function that can be used to submit the form. It will filter out disabled fields from the values.\n */\nexport function tfOnSubmit<TValues>(\n    onSubmit: ({ values, formApi }: { values: TValues; formApi: AppFormApi<TValues> }) => Promise<any> | any\n) {\n    return async ({ formApi }: { formApi: AppFormApi<TValues> }): Promise<any> => {\n        const values = pickEnabledFields(formApi.state.values, formApi);\n\n        await onSubmit({ values, formApi });\n    };\n}\nfunction pickEnabledFields<TValues>(rawValues: TValues, formApi: AppFormApi<TValues>): TValues {\n    const result: TValues = {} as TValues;\n\n    //TODO: Nested objects are not supported yet\n    for (const key in rawValues) {\n        const meta = formApi.getFieldMeta(key) as AnyFieldMeta & {\n            disabled?: boolean;\n        };\n        if (!meta?.disabled) {\n            result[key] = rawValues[key];\n        }\n    }\n\n    return result;\n}\n"],"names":["useTfFieldContext","disabled","field","useFieldContext","React","meta","tfOnSubmit","onSubmit","formApi","values","pickEnabledFields","rawValues","result","key"],"mappings":"sGAaO,MAAMA,EAAoB,CAAK,CAAE,SAAAC,KAAkC,CACtE,MAAMC,EAAQC,EAAA,EAEd,OAAAC,EAAM,UAAU,IAAM,CAClBF,EAAM,QAAQG,IAAS,CACnB,GAAGA,EACH,SAAU,CAAC,CAACJ,CAAA,EACd,CACN,EAAG,CAACA,EAAUC,CAAK,CAAC,EAEbA,CACX,EAUO,SAASI,EACZC,EACF,CACE,MAAO,OAAO,CAAE,QAAAC,KAA8D,CAC1E,MAAMC,EAASC,EAAkBF,EAAQ,MAAM,OAAQA,CAAO,EAE9D,MAAMD,EAAS,CAAE,OAAAE,EAAQ,QAAAD,EAAS,CACtC,CACJ,CACA,SAASE,EAA2BC,EAAoBH,EAAuC,CAC3F,MAAMI,EAAkB,CAAA,EAGxB,UAAWC,KAAOF,EACDH,EAAQ,aAAaK,CAAG,GAG1B,WACPD,EAAOC,CAAG,EAAIF,EAAUE,CAAG,GAInC,OAAOD,CACX"}
+{"version":3,"file":"form-utils.js","sources":["../../lib/utils/form-utils.tsx"],"sourcesContent":["import { type AnyFieldMeta, type FormApi } from '@tanstack/react-form';\nimport React from 'react';\nimport { useFieldContext } from './form-context';\n\ntype FieldContextProps = {\n    disabled?: boolean;\n};\n\n/**\n * Custom hook to handle disabled state for form fields\n * @param {boolean} disabled - The disabled prop passed to the component\n * @returns The field context with disabled state properly managed\n */\nexport const useTfFieldContext = <T,>({ disabled }: FieldContextProps) => {\n    const field = useFieldContext<T>();\n\n    React.useEffect(() => {\n        field.setMeta(meta => ({\n            ...meta,\n            disabled: !!disabled,\n        }));\n    }, [disabled, field]);\n\n    return field;\n};\n\n/** Utility type to simplify FormApi usage */\nexport type AppFormApi<TValues> = FormApi<TValues, any, any, any, any, any, any, any, any, any>;\n\n/**\n * Utility function to submit a form with a handler that receives the values and the formApi.\n * @param onSubmit - The handler function to call with the values and the formApi.\n * @returns A function that can be used to submit the form. It will filter out disabled fields from the values.\n */\nexport function tfOnSubmit<TValues>(\n    onSubmit: ({ values, formApi }: { values: TValues; formApi: AppFormApi<TValues> }) => Promise<any> | any\n) {\n    return async ({ formApi }: { formApi: AppFormApi<TValues> }): Promise<any> => {\n        const values = pickEnabledFields(formApi.state.values, formApi);\n\n        await onSubmit({ values, formApi });\n    };\n}\nfunction pickEnabledFields<TValues>(rawValues: TValues, formApi: AppFormApi<TValues>): TValues {\n    const result: TValues = {} as TValues;\n\n    //TODO: Nested objects are not supported yet\n    for (const key in rawValues) {\n        const meta = formApi.getFieldMeta(key) as AnyFieldMeta & {\n            disabled?: boolean;\n        };\n        if (!meta?.disabled) {\n            result[key] = rawValues[key];\n        }\n    }\n\n    return result;\n}\n"],"names":["useTfFieldContext","disabled","field","useFieldContext","React","meta","tfOnSubmit","onSubmit","formApi","values","pickEnabledFields","rawValues","result","key"],"mappings":"sGAaO,MAAMA,EAAoB,CAAK,CAAE,SAAAC,KAAkC,CACtE,MAAMC,EAAQC,EAAA,EAEd,OAAAC,EAAM,UAAU,IAAM,CAClBF,EAAM,QAAQG,IAAS,CACnB,GAAGA,EACH,SAAU,CAAC,CAACJ,CAAA,EACd,CACN,EAAG,CAACA,EAAUC,CAAK,CAAC,EAEbA,CACX,EAUO,SAASI,EACZC,EACF,CACE,MAAO,OAAO,CAAE,QAAAC,KAA8D,CAC1E,MAAMC,EAASC,EAAkBF,EAAQ,MAAM,OAAQA,CAAO,EAE9D,MAAMD,EAAS,CAAE,OAAAE,EAAQ,QAAAD,EAAS,CACtC,CACJ,CACA,SAASE,EAA2BC,EAAoBH,EAAuC,CAC3F,MAAMI,EAAkB,CAAA,EAGxB,UAAWC,KAAOF,EACDH,EAAQ,aAAaK,CAAG,GAG1B,WACPD,EAAOC,CAAG,EAAIF,EAAUE,CAAG,GAInC,OAAOD,CACX"}

package/dist/utils/resource-names.d.ts

@@ -1,4 +1,4 @@
-import { CtxPortals } from 'lib/utils/primitives';
+import { CtxPortals } from './primitives';
 /** Resource Name should ALWAYS be in singular form */
 export declare const RESOURCE_NAMES: readonly ["access-token", "account", "activation", "activation-log", "admin-role", "audit-log", "automated-email", "automated-email-event-log", "card", "feature-flag", "invoice", "license", "license-template", "maintenance-policy", "organization", "plan", "product", "product-version", "profile", "release", "release-channel", "release-file", "release-platform", "report", "role", "role-claim", "saml-configuration", "segment", "sending-domain", "setting", "tag", "team-member", "trial", "trial-policy", "user", "user-group", "webhook", "webhook-event-log", "webhook-trigger", "reseller", "oidc-configuration", "organization-claim", "reseller-claim"];
 export type ResourceName = (typeof RESOURCE_NAMES)[number];

package/dist/utils/resource-names.js

@@ -1,2 +1,2 @@
-import{jsx as s}from"react/jsx-runtime";import{convertCamelCaseToTitleCase as n}from"./primitives.js";import{createContext as i,use as l}from"react";import"clsx";const t={"product.displayName":"Product"},f=["access-token","account","activation","activation-log","admin-role","audit-log","automated-email","automated-email-event-log","card","feature-flag","invoice","license","license-template","maintenance-policy","organization","plan","product","product-version","profile","release","release-channel","release-file","release-platform","report","role","role-claim","saml-configuration","segment","sending-domain","setting","tag","team-member","trial","trial-policy","user","user-group","webhook","webhook-event-log","webhook-trigger","reseller","oidc-configuration","organization-claim","reseller-claim"],y={account:"Your organization account.",product:"Products are the software products you want to license",license:"Licenses represent a purchase of your software. These can be linked to customers, and the license key is required to use the product.","access-token":"Access Tokens are used to authenticate your API requests.",activation:"Activations, also known as devices/machines/seats are the devices consuming licenses.","activation-log":"Activation Log is a log entry of activation/deactivation of a particular license.",trial:"Trial/Trial Activation is a device that has activated a trial of your product.","audit-log":"Audit logs contain all the changes made to your account.","automated-email":"Automated Email allow you to send marketing emails based on events on the linked product.","automated-email-event-log":"Automated email event log is the log of all the automated email events for your product.",card:"The payment card for your account.","feature-flag":"Feature flags define features that make up tiers for your products.",invoice:"","license-template":"License templates are a blueprint for the licenses you create for your customers and prevent repetition when creating licenses.","maintenance-policy":"Maintenance policies represent support contracts and can be linked to licenses.",plan:"","product-version":"Product Versions are sets of Feature Flags that define the tiers of your products.","release-channel":"Release channel is the release channel for your product.","release-file":"Release files are files within your created releases.","release-platform":'Release Platforms differentiate the target platform for your release. Common platforms include "Windows", "macOS", and "Linux".',release:"Releases help you to manage different versions of your app, and secure distribute it to licensed users.",report:"Analytics data for your account","role-claim":"",role:"Roles define permissions for your team.","saml-configuration":"",segment:"Sets of filters that can be saved to filter resources.","trial-policy":"Trial policies are templates for creating trials for your products.","webhook-event-log":"Webhook Event Logs are logs of events that have occured on webhooks.","webhook-trigger":"",webhook:"Webhooks are HTTP callbacks which are triggered by specific events.",organization:"",profile:"",setting:"",tag:"Tags allow you to manage your licenses and customers on the dashboard.","team-member":"Team members can access the account based on their roles.",user:"A user refers to your customer whom you want to license your product.","sending-domain":"Allows Cryptlex to send emails on your behalf using your From Email address","admin-role":"Roles that have type admin","user-group":"Groups of users that you can assign licenses to.",reseller:"Resellers allow you to delegate user management to third parties or partners","oidc-configuration":"","organization-claim":"","reseller-claim":""},a={id:"ID",createdAt:"Creation Date",scopes:"Permissions",updatedAt:"Last Updated",expiresAt:"Expiration Date",lastSeenAt:"Last Seen",os:"OS",osVersion:"OS Version",key:"License Key",vmName:"VM Name",container:"Container",allowedIpRange:"Allowed IP Range",allowedIpRanges:"Allowed IP Ranges",allowedIpAddresses:"Allowed IP Addresses",disallowedIpAddresses:"Disallowed IP Addresses",allowVmActivation:"Allow VM Activation",disableGeoLocation:"Disable Geolocation","user.id":"User ID",userId:"User",productId:"Product",downloads:"Total Downloads",claims:"Permissions",googleSsoEnabled:"Google Login Enabled",lastAttemptedAt:"Last Attempt Date",url:"URL","trialPolicy.name":"Trial Policy Name","licensePolicy.name":"License Template Name",licensePolicy:"License Template",eventLog:"Audit Log",cc:"CC Recepients",bcc:"BCC Recepients",ipAddress:"IP Address",resellerId:"Reseller",productVersionId:"Product Version",releaseId:"Release",maintenancePolicyId:"Maintenance Policy",webhookId:"Webhook",automatedEmailId:"Automated Email","location.countryName":"Country","location.ipAddress":"IP Address","location.countryCode":"Country",organizationId:"Organization","address.country":"Country","address.addressLine1":"Address Line 1","address.addressLine2":"Address Line 2",responseStatusCode:"HTTP Status Code",resourceId:"Resource ID",Sso:"SAML SSO 2.0","reseller.name":"Reseller",sendingDomain:"Email Sending Domain"};function c(e,o){return o!=="admin-portal"&&e in t?t[e]:e in a?a[e]:n(e)}const r=i("admin-portal");function h({projectName:e,children:o}){return s(r.Provider,{value:e,children:o})}function d(){return l(r)}function A(){const e=d();return o=>c(o,e)}export{h as ProjectProvider,y as RESOURCE_DEFINITIONS,f as RESOURCE_NAMES,d as useProjectName,A as useResourceFormatter};
+import{jsx as s}from"react/jsx-runtime";import{createContext as n,use as i}from"react";import{convertCamelCaseToTitleCase as l}from"./primitives.js";import"clsx";const t={"product.displayName":"Product"},f=["access-token","account","activation","activation-log","admin-role","audit-log","automated-email","automated-email-event-log","card","feature-flag","invoice","license","license-template","maintenance-policy","organization","plan","product","product-version","profile","release","release-channel","release-file","release-platform","report","role","role-claim","saml-configuration","segment","sending-domain","setting","tag","team-member","trial","trial-policy","user","user-group","webhook","webhook-event-log","webhook-trigger","reseller","oidc-configuration","organization-claim","reseller-claim"],y={account:"Your organization account.",product:"Products are the software products you want to license",license:"Licenses represent a purchase of your software. These can be linked to customers, and the license key is required to use the product.","access-token":"Access Tokens are used to authenticate your API requests.",activation:"Activations, also known as devices/machines/seats are the devices consuming licenses.","activation-log":"Activation Log is a log entry of activation/deactivation of a particular license.",trial:"Trial/Trial Activation is a device that has activated a trial of your product.","audit-log":"Audit logs contain all the changes made to your account.","automated-email":"Automated Email allow you to send marketing emails based on events on the linked product.","automated-email-event-log":"Automated email event log is the log of all the automated email events for your product.",card:"The payment card for your account.","feature-flag":"Feature flags define features that make up tiers for your products.",invoice:"","license-template":"License templates are a blueprint for the licenses you create for your customers and prevent repetition when creating licenses.","maintenance-policy":"Maintenance policies represent support contracts and can be linked to licenses.",plan:"","product-version":"Product Versions are sets of Feature Flags that define the tiers of your products.","release-channel":"Release channel is the release channel for your product.","release-file":"Release files are files within your created releases.","release-platform":'Release Platforms differentiate the target platform for your release. Common platforms include "Windows", "macOS", and "Linux".',release:"Releases help you to manage different versions of your app, and secure distribute it to licensed users.",report:"Analytics data for your account","role-claim":"",role:"Roles define permissions for your team.","saml-configuration":"",segment:"Sets of filters that can be saved to filter resources.","trial-policy":"Trial policies are templates for creating trials for your products.","webhook-event-log":"Webhook Event Logs are logs of events that have occured on webhooks.","webhook-trigger":"",webhook:"Webhooks are HTTP callbacks which are triggered by specific events.",organization:"",profile:"",setting:"",tag:"Tags allow you to manage your licenses and customers on the dashboard.","team-member":"Team members can access the account based on their roles.",user:"A user refers to your customer whom you want to license your product.","sending-domain":"Allows Cryptlex to send emails on your behalf using your From Email address","admin-role":"Roles that have type admin","user-group":"Groups of users that you can assign licenses to.",reseller:"Resellers allow you to delegate user management to third parties or partners","oidc-configuration":"","organization-claim":"","reseller-claim":""},a={id:"ID",createdAt:"Creation Date",scopes:"Permissions",updatedAt:"Last Updated",expiresAt:"Expiration Date",lastSeenAt:"Last Seen",os:"OS",osVersion:"OS Version",key:"License Key",vmName:"VM Name",container:"Container",allowedIpRange:"Allowed IP Range",allowedIpRanges:"Allowed IP Ranges",allowedIpAddresses:"Allowed IP Addresses",disallowedIpAddresses:"Disallowed IP Addresses",allowVmActivation:"Allow VM Activation",disableGeoLocation:"Disable Geolocation","user.id":"User ID",userId:"User",productId:"Product",downloads:"Total Downloads",claims:"Permissions",googleSsoEnabled:"Google Login Enabled",lastAttemptedAt:"Last Attempt Date",url:"URL","trialPolicy.name":"Trial Policy Name","licensePolicy.name":"License Template Name",licensePolicy:"License Template",eventLog:"Audit Log",cc:"CC Recepients",bcc:"BCC Recepients",ipAddress:"IP Address",resellerId:"Reseller",productVersionId:"Product Version",releaseId:"Release",maintenancePolicyId:"Maintenance Policy",webhookId:"Webhook",automatedEmailId:"Automated Email","location.countryName":"Country","location.ipAddress":"IP Address","location.countryCode":"Country",organizationId:"Organization","address.country":"Country","address.addressLine1":"Address Line 1","address.addressLine2":"Address Line 2",responseStatusCode:"HTTP Status Code",resourceId:"Resource ID",Sso:"SAML SSO 2.0","reseller.name":"Reseller",sendingDomain:"Email Sending Domain"};function c(e,o){return o!=="admin-portal"&&e in t?t[e]:e in a?a[e]:l(e)}const r=n("admin-portal");function h({projectName:e,children:o}){return s(r.Provider,{value:e,children:o})}function d(){return i(r)}function A(){const e=d();return o=>c(o,e)}export{h as ProjectProvider,y as RESOURCE_DEFINITIONS,f as RESOURCE_NAMES,d as useProjectName,A as useResourceFormatter};
 //# sourceMappingURL=resource-names.js.map

package/dist/utils/resource-names.js.map

@@ -1 +1 @@
-{"version":3,"file":"resource-names.js","sources":["../../lib/utils/resource-names.tsx"],"sourcesContent":["import { convertCamelCaseToTitleCase, type CtxPortals } from 'lib/utils/primitives';\nimport { createContext, use } from 'react';\n\n// Display names specific to customer and reseller portal\nconst OTHER_PORTALS_DISPLAY_NAME: Record<string, string> = {\n    'product.displayName': 'Product',\n};\n\n/** Resource Name should ALWAYS be in singular form */\nexport const RESOURCE_NAMES = [\n    'access-token',\n    'account',\n    'activation',\n    'activation-log',\n    'admin-role',\n    'audit-log',\n    'automated-email',\n    'automated-email-event-log',\n    'card',\n    'feature-flag',\n    'invoice',\n    'license',\n    'license-template',\n    'maintenance-policy',\n    'organization',\n    'plan',\n    'product',\n    'product-version',\n    'profile',\n    'release',\n    'release-channel',\n    'release-file',\n    'release-platform',\n    'report',\n    'role',\n    'role-claim',\n    'saml-configuration',\n    'segment',\n    'sending-domain',\n    'setting',\n    'tag',\n    'team-member',\n    'trial',\n    'trial-policy',\n    'user',\n    'user-group',\n    'webhook',\n    'webhook-event-log',\n    'webhook-trigger',\n    'reseller',\n    'oidc-configuration',\n    'organization-claim',\n    'reseller-claim',\n] as const;\nexport type ResourceName = (typeof RESOURCE_NAMES)[number];\nexport const RESOURCE_DEFINITIONS: Record<ResourceName, string> = {\n    account: 'Your organization account.',\n    product: 'Products are the software products you want to license',\n    license:\n        'Licenses represent a purchase of your software. These can be linked to customers, and the license key is required to use the product.',\n    'access-token': 'Access Tokens are used to authenticate your API requests.',\n    activation: 'Activations, also known as devices/machines/seats are the devices consuming licenses.',\n    'activation-log': 'Activation Log is a log entry of activation/deactivation of a particular license.',\n    trial: 'Trial/Trial Activation is a device that has activated a trial of your product.',\n    'audit-log': 'Audit logs contain all the changes made to your account.',\n    'automated-email': 'Automated Email allow you to send marketing emails based on events on the linked product.',\n    'automated-email-event-log':\n        'Automated email event log is the log of all the automated email events for your product.',\n    card: 'The payment card for your account.',\n    'feature-flag': 'Feature flags define features that make up tiers for your products.',\n    invoice: '',\n    'license-template':\n        'License templates are a blueprint for the licenses you create for your customers and prevent repetition when creating licenses.',\n    'maintenance-policy': 'Maintenance policies represent support contracts and can be linked to licenses.',\n    plan: '',\n    'product-version': 'Product Versions are sets of Feature Flags that define the tiers of your products.',\n    'release-channel': 'Release channel is the release channel for your product.',\n    'release-file': 'Release files are files within your created releases.',\n    'release-platform':\n        'Release Platforms differentiate the target platform for your release. Common platforms include \"Windows\", \"macOS\", and \"Linux\".',\n    release: 'Releases help you to manage different versions of your app, and secure distribute it to licensed users.',\n    report: 'Analytics data for your account',\n    'role-claim': '',\n    role: 'Roles define permissions for your team.',\n    'saml-configuration': '',\n    segment: 'Sets of filters that can be saved to filter resources.',\n    'trial-policy': 'Trial policies are templates for creating trials for your products.',\n    'webhook-event-log': 'Webhook Event Logs are logs of events that have occured on webhooks.',\n    'webhook-trigger': '',\n    webhook: 'Webhooks are HTTP callbacks which are triggered by specific events.',\n    organization: '',\n    profile: '',\n    setting: '',\n    tag: 'Tags allow you to manage your licenses and customers on the dashboard.',\n    'team-member': 'Team members can access the account based on their roles.',\n    user: 'A user refers to your customer whom you want to license your product.',\n    'sending-domain': 'Allows Cryptlex to send emails on your behalf using your From Email address',\n    'admin-role': 'Roles that have type admin',\n    'user-group': 'Groups of users that you can assign licenses to.',\n    reseller: 'Resellers allow you to delegate user management to third parties or partners',\n    'oidc-configuration': '',\n    'organization-claim': '',\n    'reseller-claim': '',\n};\n\nconst RESOURCE_DISPLAY_NAMES: Record<string, string> = {\n    id: 'ID',\n    createdAt: 'Creation Date',\n    scopes: 'Permissions',\n    updatedAt: 'Last Updated',\n    expiresAt: 'Expiration Date',\n    lastSeenAt: 'Last Seen',\n    os: 'OS',\n    osVersion: 'OS Version',\n    key: 'License Key',\n    vmName: 'VM Name',\n    container: 'Container',\n    allowedIpRange: 'Allowed IP Range',\n    allowedIpRanges: 'Allowed IP Ranges',\n    allowedIpAddresses: 'Allowed IP Addresses',\n    disallowedIpAddresses: 'Disallowed IP Addresses',\n    allowVmActivation: 'Allow VM Activation',\n    disableGeoLocation: 'Disable Geolocation',\n    'user.id': 'User ID',\n    userId: 'User',\n    productId: 'Product',\n    downloads: 'Total Downloads',\n    claims: 'Permissions',\n    googleSsoEnabled: 'Google Login Enabled',\n    lastAttemptedAt: 'Last Attempt Date',\n    url: 'URL',\n    'trialPolicy.name': 'Trial Policy Name',\n    'licensePolicy.name': 'License Template Name',\n    licensePolicy: 'License Template',\n    eventLog: 'Audit Log',\n    cc: 'CC Recepients',\n    bcc: 'BCC Recepients',\n    ipAddress: 'IP Address',\n    resellerId: 'Reseller',\n    productVersionId: 'Product Version',\n    releaseId: 'Release',\n    maintenancePolicyId: 'Maintenance Policy',\n    webhookId: 'Webhook',\n    automatedEmailId: 'Automated Email',\n    'location.countryName': 'Country',\n    'location.ipAddress': 'IP Address',\n    'location.countryCode': 'Country',\n    organizationId: 'Organization',\n    'address.country': 'Country',\n    'address.addressLine1': 'Address Line 1',\n    'address.addressLine2': 'Address Line 2',\n    responseStatusCode: 'HTTP Status Code',\n    resourceId: 'Resource ID',\n    Sso: 'SAML SSO 2.0',\n    'reseller.name': 'Reseller',\n    sendingDomain: 'Email Sending Domain',\n};\n\nfunction getResourceDisplayName(resourceName: string, portal: CtxPortals) {\n    if (portal !== 'admin-portal' && resourceName in OTHER_PORTALS_DISPLAY_NAME) {\n        return OTHER_PORTALS_DISPLAY_NAME[resourceName];\n    } else if (resourceName in RESOURCE_DISPLAY_NAMES) {\n        return RESOURCE_DISPLAY_NAMES[resourceName];\n    } else {\n        return convertCamelCaseToTitleCase(resourceName);\n    }\n}\n\nconst ProjectContext = createContext<CtxPortals>('admin-portal');\n\nexport function ProjectProvider({ projectName, children }: { projectName: CtxPortals; children: React.ReactNode }) {\n    return <ProjectContext.Provider value={projectName}>{children}</ProjectContext.Provider>;\n}\n\nexport function useProjectName(): CtxPortals {\n    return use(ProjectContext);\n}\n\nexport function useResourceFormatter(): (resourceName: string) => string {\n    const portal = useProjectName();\n    return (resourceName: string) => getResourceDisplayName(resourceName, portal);\n}\n"],"names":["OTHER_PORTALS_DISPLAY_NAME","RESOURCE_NAMES","RESOURCE_DEFINITIONS","RESOURCE_DISPLAY_NAMES","getResourceDisplayName","resourceName","portal","convertCamelCaseToTitleCase","ProjectContext","createContext","ProjectProvider","projectName","children","useProjectName","use","useResourceFormatter"],"mappings":"kKAIA,MAAMA,EAAqD,CACvD,sBAAuB,SAC3B,EAGaC,EAAiB,CAC1B,eACA,UACA,aACA,iBACA,aACA,YACA,kBACA,4BACA,OACA,eACA,UACA,UACA,mBACA,qBACA,eACA,OACA,UACA,kBACA,UACA,UACA,kBACA,eACA,mBACA,SACA,OACA,aACA,qBACA,UACA,iBACA,UACA,MACA,cACA,QACA,eACA,OACA,aACA,UACA,oBACA,kBACA,WACA,qBACA,qBACA,gBACJ,EAEaC,EAAqD,CAC9D,QAAS,6BACT,QAAS,yDACT,QACI,wIACJ,eAAgB,4DAChB,WAAY,wFACZ,iBAAkB,oFAClB,MAAO,iFACP,YAAa,2DACb,kBAAmB,4FACnB,4BACI,2FACJ,KAAM,qCACN,eAAgB,sEAChB,QAAS,GACT,mBACI,kIACJ,qBAAsB,kFACtB,KAAM,GACN,kBAAmB,qFACnB,kBAAmB,2DACnB,eAAgB,wDAChB,mBACI,kIACJ,QAAS,0GACT,OAAQ,kCACR,aAAc,GACd,KAAM,0CACN,qBAAsB,GACtB,QAAS,yDACT,eAAgB,sEAChB,oBAAqB,uEACrB,kBAAmB,GACnB,QAAS,sEACT,aAAc,GACd,QAAS,GACT,QAAS,GACT,IAAK,yEACL,cAAe,4DACf,KAAM,wEACN,iBAAkB,8EAClB,aAAc,6BACd,aAAc,mDACd,SAAU,+EACV,qBAAsB,GACtB,qBAAsB,GACtB,iBAAkB,EACtB,EAEMC,EAAiD,CACnD,GAAI,KACJ,UAAW,gBACX,OAAQ,cACR,UAAW,eACX,UAAW,kBACX,WAAY,YACZ,GAAI,KACJ,UAAW,aACX,IAAK,cACL,OAAQ,UACR,UAAW,YACX,eAAgB,mBAChB,gBAAiB,oBACjB,mBAAoB,uBACpB,sBAAuB,0BACvB,kBAAmB,sBACnB,mBAAoB,sBACpB,UAAW,UACX,OAAQ,OACR,UAAW,UACX,UAAW,kBACX,OAAQ,cACR,iBAAkB,uBAClB,gBAAiB,oBACjB,IAAK,MACL,mBAAoB,oBACpB,qBAAsB,wBACtB,cAAe,mBACf,SAAU,YACV,GAAI,gBACJ,IAAK,iBACL,UAAW,aACX,WAAY,WACZ,iBAAkB,kBAClB,UAAW,UACX,oBAAqB,qBACrB,UAAW,UACX,iBAAkB,kBAClB,uBAAwB,UACxB,qBAAsB,aACtB,uBAAwB,UACxB,eAAgB,eAChB,kBAAmB,UACnB,uBAAwB,iBACxB,uBAAwB,iBACxB,mBAAoB,mBACpB,WAAY,cACZ,IAAK,eACL,gBAAiB,WACjB,cAAe,sBACnB,EAEA,SAASC,EAAuBC,EAAsBC,EAAoB,CACtE,OAAIA,IAAW,gBAAkBD,KAAgBL,EACtCA,EAA2BK,CAAY,EACvCA,KAAgBF,EAChBA,EAAuBE,CAAY,EAEnCE,EAA4BF,CAAY,CAEvD,CAEA,MAAMG,EAAiBC,EAA0B,cAAc,EAExD,SAASC,EAAgB,CAAE,YAAAC,EAAa,SAAAC,GAAoE,CAC/G,SAAQJ,EAAe,SAAf,CAAwB,MAAOG,EAAc,SAAAC,EAAS,CAClE,CAEO,SAASC,GAA6B,CACzC,OAAOC,EAAIN,CAAc,CAC7B,CAEO,SAASO,GAAyD,CACrE,MAAMT,EAASO,EAAA,EACf,OAAQR,GAAyBD,EAAuBC,EAAcC,CAAM,CAChF"}
+{"version":3,"file":"resource-names.js","sources":["../../lib/utils/resource-names.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport { convertCamelCaseToTitleCase, type CtxPortals } from './primitives';\n\n// Display names specific to customer and reseller portal\nconst OTHER_PORTALS_DISPLAY_NAME: Record<string, string> = {\n    'product.displayName': 'Product',\n};\n\n/** Resource Name should ALWAYS be in singular form */\nexport const RESOURCE_NAMES = [\n    'access-token',\n    'account',\n    'activation',\n    'activation-log',\n    'admin-role',\n    'audit-log',\n    'automated-email',\n    'automated-email-event-log',\n    'card',\n    'feature-flag',\n    'invoice',\n    'license',\n    'license-template',\n    'maintenance-policy',\n    'organization',\n    'plan',\n    'product',\n    'product-version',\n    'profile',\n    'release',\n    'release-channel',\n    'release-file',\n    'release-platform',\n    'report',\n    'role',\n    'role-claim',\n    'saml-configuration',\n    'segment',\n    'sending-domain',\n    'setting',\n    'tag',\n    'team-member',\n    'trial',\n    'trial-policy',\n    'user',\n    'user-group',\n    'webhook',\n    'webhook-event-log',\n    'webhook-trigger',\n    'reseller',\n    'oidc-configuration',\n    'organization-claim',\n    'reseller-claim',\n] as const;\nexport type ResourceName = (typeof RESOURCE_NAMES)[number];\nexport const RESOURCE_DEFINITIONS: Record<ResourceName, string> = {\n    account: 'Your organization account.',\n    product: 'Products are the software products you want to license',\n    license:\n        'Licenses represent a purchase of your software. These can be linked to customers, and the license key is required to use the product.',\n    'access-token': 'Access Tokens are used to authenticate your API requests.',\n    activation: 'Activations, also known as devices/machines/seats are the devices consuming licenses.',\n    'activation-log': 'Activation Log is a log entry of activation/deactivation of a particular license.',\n    trial: 'Trial/Trial Activation is a device that has activated a trial of your product.',\n    'audit-log': 'Audit logs contain all the changes made to your account.',\n    'automated-email': 'Automated Email allow you to send marketing emails based on events on the linked product.',\n    'automated-email-event-log':\n        'Automated email event log is the log of all the automated email events for your product.',\n    card: 'The payment card for your account.',\n    'feature-flag': 'Feature flags define features that make up tiers for your products.',\n    invoice: '',\n    'license-template':\n        'License templates are a blueprint for the licenses you create for your customers and prevent repetition when creating licenses.',\n    'maintenance-policy': 'Maintenance policies represent support contracts and can be linked to licenses.',\n    plan: '',\n    'product-version': 'Product Versions are sets of Feature Flags that define the tiers of your products.',\n    'release-channel': 'Release channel is the release channel for your product.',\n    'release-file': 'Release files are files within your created releases.',\n    'release-platform':\n        'Release Platforms differentiate the target platform for your release. Common platforms include \"Windows\", \"macOS\", and \"Linux\".',\n    release: 'Releases help you to manage different versions of your app, and secure distribute it to licensed users.',\n    report: 'Analytics data for your account',\n    'role-claim': '',\n    role: 'Roles define permissions for your team.',\n    'saml-configuration': '',\n    segment: 'Sets of filters that can be saved to filter resources.',\n    'trial-policy': 'Trial policies are templates for creating trials for your products.',\n    'webhook-event-log': 'Webhook Event Logs are logs of events that have occured on webhooks.',\n    'webhook-trigger': '',\n    webhook: 'Webhooks are HTTP callbacks which are triggered by specific events.',\n    organization: '',\n    profile: '',\n    setting: '',\n    tag: 'Tags allow you to manage your licenses and customers on the dashboard.',\n    'team-member': 'Team members can access the account based on their roles.',\n    user: 'A user refers to your customer whom you want to license your product.',\n    'sending-domain': 'Allows Cryptlex to send emails on your behalf using your From Email address',\n    'admin-role': 'Roles that have type admin',\n    'user-group': 'Groups of users that you can assign licenses to.',\n    reseller: 'Resellers allow you to delegate user management to third parties or partners',\n    'oidc-configuration': '',\n    'organization-claim': '',\n    'reseller-claim': '',\n};\n\nconst RESOURCE_DISPLAY_NAMES: Record<string, string> = {\n    id: 'ID',\n    createdAt: 'Creation Date',\n    scopes: 'Permissions',\n    updatedAt: 'Last Updated',\n    expiresAt: 'Expiration Date',\n    lastSeenAt: 'Last Seen',\n    os: 'OS',\n    osVersion: 'OS Version',\n    key: 'License Key',\n    vmName: 'VM Name',\n    container: 'Container',\n    allowedIpRange: 'Allowed IP Range',\n    allowedIpRanges: 'Allowed IP Ranges',\n    allowedIpAddresses: 'Allowed IP Addresses',\n    disallowedIpAddresses: 'Disallowed IP Addresses',\n    allowVmActivation: 'Allow VM Activation',\n    disableGeoLocation: 'Disable Geolocation',\n    'user.id': 'User ID',\n    userId: 'User',\n    productId: 'Product',\n    downloads: 'Total Downloads',\n    claims: 'Permissions',\n    googleSsoEnabled: 'Google Login Enabled',\n    lastAttemptedAt: 'Last Attempt Date',\n    url: 'URL',\n    'trialPolicy.name': 'Trial Policy Name',\n    'licensePolicy.name': 'License Template Name',\n    licensePolicy: 'License Template',\n    eventLog: 'Audit Log',\n    cc: 'CC Recepients',\n    bcc: 'BCC Recepients',\n    ipAddress: 'IP Address',\n    resellerId: 'Reseller',\n    productVersionId: 'Product Version',\n    releaseId: 'Release',\n    maintenancePolicyId: 'Maintenance Policy',\n    webhookId: 'Webhook',\n    automatedEmailId: 'Automated Email',\n    'location.countryName': 'Country',\n    'location.ipAddress': 'IP Address',\n    'location.countryCode': 'Country',\n    organizationId: 'Organization',\n    'address.country': 'Country',\n    'address.addressLine1': 'Address Line 1',\n    'address.addressLine2': 'Address Line 2',\n    responseStatusCode: 'HTTP Status Code',\n    resourceId: 'Resource ID',\n    Sso: 'SAML SSO 2.0',\n    'reseller.name': 'Reseller',\n    sendingDomain: 'Email Sending Domain',\n};\n\nfunction getResourceDisplayName(resourceName: string, portal: CtxPortals) {\n    if (portal !== 'admin-portal' && resourceName in OTHER_PORTALS_DISPLAY_NAME) {\n        return OTHER_PORTALS_DISPLAY_NAME[resourceName];\n    } else if (resourceName in RESOURCE_DISPLAY_NAMES) {\n        return RESOURCE_DISPLAY_NAMES[resourceName];\n    } else {\n        return convertCamelCaseToTitleCase(resourceName);\n    }\n}\n\nconst ProjectContext = createContext<CtxPortals>('admin-portal');\n\nexport function ProjectProvider({ projectName, children }: { projectName: CtxPortals; children: React.ReactNode }) {\n    return <ProjectContext.Provider value={projectName}>{children}</ProjectContext.Provider>;\n}\n\nexport function useProjectName(): CtxPortals {\n    return use(ProjectContext);\n}\n\n// TODO, create story with complete map of resource -> formatter output\nexport function useResourceFormatter(): (resourceName: string) => string {\n    const portal = useProjectName();\n    return (resourceName: string) => getResourceDisplayName(resourceName, portal);\n}\n"],"names":["OTHER_PORTALS_DISPLAY_NAME","RESOURCE_NAMES","RESOURCE_DEFINITIONS","RESOURCE_DISPLAY_NAMES","getResourceDisplayName","resourceName","portal","convertCamelCaseToTitleCase","ProjectContext","createContext","ProjectProvider","projectName","children","useProjectName","use","useResourceFormatter"],"mappings":"kKAIA,MAAMA,EAAqD,CACvD,sBAAuB,SAC3B,EAGaC,EAAiB,CAC1B,eACA,UACA,aACA,iBACA,aACA,YACA,kBACA,4BACA,OACA,eACA,UACA,UACA,mBACA,qBACA,eACA,OACA,UACA,kBACA,UACA,UACA,kBACA,eACA,mBACA,SACA,OACA,aACA,qBACA,UACA,iBACA,UACA,MACA,cACA,QACA,eACA,OACA,aACA,UACA,oBACA,kBACA,WACA,qBACA,qBACA,gBACJ,EAEaC,EAAqD,CAC9D,QAAS,6BACT,QAAS,yDACT,QACI,wIACJ,eAAgB,4DAChB,WAAY,wFACZ,iBAAkB,oFAClB,MAAO,iFACP,YAAa,2DACb,kBAAmB,4FACnB,4BACI,2FACJ,KAAM,qCACN,eAAgB,sEAChB,QAAS,GACT,mBACI,kIACJ,qBAAsB,kFACtB,KAAM,GACN,kBAAmB,qFACnB,kBAAmB,2DACnB,eAAgB,wDAChB,mBACI,kIACJ,QAAS,0GACT,OAAQ,kCACR,aAAc,GACd,KAAM,0CACN,qBAAsB,GACtB,QAAS,yDACT,eAAgB,sEAChB,oBAAqB,uEACrB,kBAAmB,GACnB,QAAS,sEACT,aAAc,GACd,QAAS,GACT,QAAS,GACT,IAAK,yEACL,cAAe,4DACf,KAAM,wEACN,iBAAkB,8EAClB,aAAc,6BACd,aAAc,mDACd,SAAU,+EACV,qBAAsB,GACtB,qBAAsB,GACtB,iBAAkB,EACtB,EAEMC,EAAiD,CACnD,GAAI,KACJ,UAAW,gBACX,OAAQ,cACR,UAAW,eACX,UAAW,kBACX,WAAY,YACZ,GAAI,KACJ,UAAW,aACX,IAAK,cACL,OAAQ,UACR,UAAW,YACX,eAAgB,mBAChB,gBAAiB,oBACjB,mBAAoB,uBACpB,sBAAuB,0BACvB,kBAAmB,sBACnB,mBAAoB,sBACpB,UAAW,UACX,OAAQ,OACR,UAAW,UACX,UAAW,kBACX,OAAQ,cACR,iBAAkB,uBAClB,gBAAiB,oBACjB,IAAK,MACL,mBAAoB,oBACpB,qBAAsB,wBACtB,cAAe,mBACf,SAAU,YACV,GAAI,gBACJ,IAAK,iBACL,UAAW,aACX,WAAY,WACZ,iBAAkB,kBAClB,UAAW,UACX,oBAAqB,qBACrB,UAAW,UACX,iBAAkB,kBAClB,uBAAwB,UACxB,qBAAsB,aACtB,uBAAwB,UACxB,eAAgB,eAChB,kBAAmB,UACnB,uBAAwB,iBACxB,uBAAwB,iBACxB,mBAAoB,mBACpB,WAAY,cACZ,IAAK,eACL,gBAAiB,WACjB,cAAe,sBACnB,EAEA,SAASC,EAAuBC,EAAsBC,EAAoB,CACtE,OAAIA,IAAW,gBAAkBD,KAAgBL,EACtCA,EAA2BK,CAAY,EACvCA,KAAgBF,EAChBA,EAAuBE,CAAY,EAEnCE,EAA4BF,CAAY,CAEvD,CAEA,MAAMG,EAAiBC,EAA0B,cAAc,EAExD,SAASC,EAAgB,CAAE,YAAAC,EAAa,SAAAC,GAAoE,CAC/G,SAAQJ,EAAe,SAAf,CAAwB,MAAOG,EAAc,SAAAC,EAAS,CAClE,CAEO,SAASC,GAA6B,CACzC,OAAOC,EAAIN,CAAc,CAC7B,CAGO,SAASO,GAAyD,CACrE,MAAMT,EAASO,EAAA,EACf,OAAQR,GAAyBD,EAAuBC,EAAcC,CAAM,CAChF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cryptlex/web-components",
-  "version": "6.4.4",
+  "version": "6.5.0-alpha00",
   "description": "React component library for Cryptlex web applications",
   "author": "Cryptlex",
   "type": "module",
@@ -51,6 +51,7 @@
     "@tanstack/react-form": "1.6.3",
     "@tanstack/react-query": "5.62.3",
     "@tanstack/react-table": "8.20.5",
+    "@uidotdev/usehooks": "2.4.1",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
     "date-fns": "3.0.0",