@cryptlex/web-components 1.3.2 → 1.3.4

package/dist/index.es.d.ts

@@ -1,3 +1,4 @@
+import { AccessorKeyColumnDef } from '@tanstack/react-table';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { AllowInDimension } from 'recharts/types/util/types';
 import { AnimationDuration } from 'recharts/types/util/types';
@@ -8,10 +9,14 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { ClassProp } from 'class-variance-authority/types';
 import { ClassValue } from 'clsx';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import { ColumnDef } from '@tanstack/react-table';
+import { components } from '@cryptlex/web-api-types';
 import { ContentType } from 'recharts/types/component/Tooltip';
 import { ControllerProps } from 'react-hook-form';
 import { Coordinate } from 'recharts/types/util/types';
 import { DayPicker } from 'react-day-picker';
+import { default as default_2 } from 'react';
+import { default as default_3 } from 'openapi-fetch';
 import { DialogCloseProps } from '@radix-ui/react-dialog';
 import { DialogContentProps } from '@radix-ui/react-dialog';
 import { DialogDescriptionProps } from '@radix-ui/react-dialog';
@@ -32,6 +37,9 @@ import * as LabelPrimitive from '@radix-ui/react-label';
 import { LucideIcon } from 'lucide-react';
 import { NameType } from 'recharts/types/component/DefaultTooltipContent';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import { PaginationState } from '@tanstack/react-table';
+import { ParamsOption } from 'openapi-fetch';
+import { paths } from '@cryptlex/web-api-types';
 import { Payload } from 'recharts/types/component/DefaultTooltipContent';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
@@ -43,12 +51,14 @@ import * as SelectPrimitive from '@radix-ui/react-select';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import { SeparatorProps } from '@radix-ui/react-separator';
 import { SlotProps } from '@radix-ui/react-slot';
+import { SortingState } from '@tanstack/react-table';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import { Toaster as Toaster_2 } from 'sonner';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { UniqueOption } from 'recharts/types/util/payload/getUniqPayload';
 import { ValueType } from 'recharts/types/component/DefaultTooltipContent';
 import { VariantProps } from 'class-variance-authority';
+import { VisibilityState as VisibilityState_2 } from '@tanstack/react-table';
 
 export declare const Accordion: React_2.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React_2.RefAttributes<HTMLDivElement>>;
 
@@ -58,6 +68,17 @@ export declare const AccordionItem: React_2.ForwardRefExoticComponent<Omit<Accor
 
 export declare const AccordionTrigger: React_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
 
+export declare function AppLayout({ data, user }: AppLayoutProps): JSX_2.Element;
+
+export declare interface AppLayoutProps {
+    data: NavItem[];
+    user?: {
+        firstName?: string;
+        lastName?: string;
+        logoUrl?: string;
+    };
+}
+
 export declare const Avatar: React_2.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React_2.RefAttributes<HTMLSpanElement>, "ref"> & React_2.RefAttributes<HTMLSpanElement>>;
 
 export declare const AvatarFallback: React_2.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React_2.RefAttributes<HTMLSpanElement>, "ref"> & React_2.RefAttributes<HTMLSpanElement>>;
@@ -188,8 +209,12 @@ export declare const ChartTooltipContent: React_2.ForwardRefExoticComponent<Omit
     labelKey?: string;
 }, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
 
+export declare const CHECK_BOX: AccessorKeyColumnDef<any, any>[];
+
 export declare const Checkbox: React_2.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
 
+declare type Client = ReturnType<typeof default_3<paths>>;
+
 export declare function cn(...inputs: ClassValue[]): string;
 
 export declare const Collapsible: ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & RefAttributes<HTMLDivElement>>;
@@ -287,6 +312,50 @@ export declare const CommandShortcut: {
     displayName: string;
 };
 
+export declare const COMPARISON_OPERATOR_LABELS: Record<FilterComparisonOperator, string>;
+
+/**
+ * Converts a string from 'camelCase' to 'Title Case'
+ * @param string String to convert to `Title Case`
+ */
+export declare function convertCamelCaseToTitleCase(string: string): string;
+
+/**
+ *
+ * @param input camelCase
+ * @returns title case for the camelCase string
+ */
+export declare function convertToTitleCase(input: string): string;
+
+export declare function createTableFetchFn<_any, Return>(ctxclient: Client, path: GetPaths, params?: ParamsOption<any>): TableFetchFn<Return>;
+
+export declare type CtxPortals = 'customer-portal' | 'system-portal' | 'reseller-portal' | 'admin-portal';
+
+/** Application Names */
+export declare type CtxProjectName = 'admin-portal' | 'customer-portal' | 'internal-portal' | 'reseller-portal';
+
+export declare function DataTable<TData extends Record<string, any>, TValue = any>({ columns, fetchFn, tableName, tableActions, columnsToHideByDefault, }: DataTableProps<TData, TValue>): JSX_2.Element;
+
+export declare interface DataTableProps<TData, TValue = any> {
+    columns: ColumnDef<TData, TValue>[];
+    tableName: string;
+    fetchFn: TableFetchFn<TData>;
+    tableActions: TableActions;
+    filterableFields: FilterableProperties;
+    columnsToHideByDefault: VisibilityState_2;
+}
+
+export declare const DEFAULT_DATE_COLUMNS: AccessorKeyColumnDef<any, any>[];
+
+export declare const DEFAULT_FILTERABLE_FIELDS: FilterableProperties;
+
+/*** Type for hide some of the columns based on the dto of the particular page
+ ** `id`, `updatedAt` are by default hidden
+ */
+export declare type DefaultVisibilityState<T> = {
+    [K in keyof T]?: boolean;
+};
+
 export declare const Dialog: React_2.FC<DialogPrimitive.DialogProps>;
 
 export declare const DialogClose: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React_2.RefAttributes<HTMLButtonElement>>;
@@ -313,6 +382,13 @@ export declare const DialogTitle: React_2.ForwardRefExoticComponent<Omit<DialogP
 
 export declare const DialogTrigger: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
+export declare type DisplayField = {
+    display: string;
+    accessor: string;
+    type?: 'text' | 'badge' | 'boolean';
+    transform?: (value: any) => React.ReactNode;
+};
+
 export declare const Drawer: {
     ({ shouldScaleBackground, ...props }: React_2.ComponentProps<typeof Drawer_2.Root>): JSX_2.Element;
     displayName: string;
@@ -381,8 +457,33 @@ export declare const DropdownMenuSubTrigger: React_2.ForwardRefExoticComponent<O
 
 export declare const DropdownMenuTrigger: React_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
+export declare enum DYNAMIC_INPUT_TARGET {
+    USER = 0,
+    ORGANIZATION = 1,
+    RESELLER = 2
+}
+
+export declare type fieldsToDisplay = {
+    display: string;
+    accessor: string;
+};
+
+export declare const FILTER_COMPARISON_OPERATORS: readonly ["eq", "ne", "cn", "nc", "sw", "ew", "in", "nin", "gt", "gte", "lt", "lte"];
+
+export declare const FILTERABLE_PROPERTY_TYPES: readonly ["objectString", "string", "number", "objectNumber", "boolean", "objectDate", "licenseType", "product", "product-version", "user", "webhook", "automated-email", "organization", "country", "tag", "resource", "resourceId", "reseller", "role"];
+
+export declare type FilterableProperties = {
+    [filterProperty: string]: FilterablePropertyType;
+};
+
+export declare type FilterablePropertyType = (typeof FILTERABLE_PROPERTY_TYPES)[number];
+
+export declare type FilterComparisonOperator = (typeof FILTER_COMPARISON_OPERATORS)[number];
+
 export declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues extends FieldValues | undefined = undefined>(props: FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React_2.JSX.Element;
 
+export declare function FormatDate(date: string | null | undefined): string | null;
+
 export declare const FormControl: React_2.ForwardRefExoticComponent<Omit<SlotProps & React_2.RefAttributes<HTMLElement>, "ref"> & React_2.RefAttributes<HTMLElement>>;
 
 export declare const FormDescription: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLParagraphElement> & React_2.RefAttributes<HTMLParagraphElement>>;
@@ -395,12 +496,49 @@ export declare const FormLabel: React_2.ForwardRefExoticComponent<Omit<LabelPrim
 
 export declare const FormMessage: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLParagraphElement> & React_2.RefAttributes<HTMLParagraphElement>>;
 
+/**
+ * Format multiple license parameters (expired, suspended, revoked) into a single status
+ */
+export declare function getLicenseStatus(license: any): string;
+
+/**
+ * This helps in passing the state data from one page to another, showing different text for a link
+ * @param display String that needs to be displayed
+ * @param url actual url for the a tag
+ * @param stateData data to be passed to the next page
+ * @returns
+ */
+export declare function getLinkDisplay(display: string, url: string, stateData?: any): JSX_2.Element;
+
+declare type GetPaths = {
+    [P in keyof paths]: paths[P] extends {
+        get: any;
+    } ? P : never;
+}[keyof paths];
+
+export declare function getResourceDisplayName(resourceName: string, portal: CtxProjectName): string;
+
 /**
  *
  * @returns
  */
 export declare function getThemeHue(): string;
 
+export declare function getValidityDisplay(validity: number | undefined): string;
+
+export declare function getValueFromData(data: any, accessor: string | number | symbol): any;
+
+export declare const ID_COLUMN: AccessorKeyColumnDef<any, any>[];
+
+export declare const InfoCard: React.FC<InfoCardProps>;
+
+export declare interface InfoCardProps {
+    data: Record<string, any>;
+    label: string;
+    fields: DisplayField[];
+    className?: string;
+}
+
 export declare const Input: React_2.ForwardRefExoticComponent<InputProps & React_2.RefAttributes<HTMLInputElement>>;
 
 export declare const InputOTP: React_2.ForwardRefExoticComponent<(Omit<Omit<React_2.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "pasteTransformer" | "containerClassName" | "noScriptCSSFallback"> & {
@@ -442,6 +580,23 @@ export declare const InputOTPSlot: React_2.ForwardRefExoticComponent<Omit<React_
 export declare interface InputProps extends React_2.InputHTMLAttributes<HTMLInputElement> {
 }
 
+export declare type JwtDecode = {
+    aud: string;
+    email: string;
+    exp: number;
+    iat: number;
+    jti: string;
+    region: string;
+    role: string;
+    role_type: string;
+    scope: string[];
+    sub: string;
+    teat: number;
+    tenantid: string;
+    token_usage: string;
+    sadmin?: string;
+};
+
 export declare const Label: React_2.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React_2.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: ClassProp | undefined) => string> & React_2.RefAttributes<HTMLLabelElement>>;
 
 export declare function Loader({ className }: LoaderProps): JSX_2.Element;
@@ -450,6 +605,10 @@ declare interface LoaderProps {
     className?: string;
 }
 
+export declare function logout(): void;
+
+export declare type MetadataDto = components['schemas']['MetadataDto'];
+
 export declare const NavigationMenu: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuProps & React_2.RefAttributes<HTMLElement>, "ref"> & React_2.RefAttributes<HTMLElement>>;
 
 export declare const NavigationMenuContent: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
@@ -470,6 +629,27 @@ export declare const navigationMenuTriggerStyle: (props?: ClassProp | undefined)
 
 export declare const NavigationMenuViewport: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuViewportProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
 
+export declare type NavItem = {
+    path: string;
+    label: string;
+    display: boolean;
+    icon: LucideIcon;
+    chidren?: {
+        path: string;
+        label: string;
+        icon: LucideIcon;
+        display: boolean;
+    }[];
+};
+
+export declare function NavMain({ items }: {
+    items: NavItem[];
+}): JSX_2.Element;
+
+export declare const OPERATORS_FOR_FILTER_TYPE: OperatorsForFilterType;
+
+export declare type OperatorsForFilterType = Record<FilterablePropertyType, FilterComparisonOperator[]>;
+
 export declare const Pagination: {
     ({ className, ...props }: React_2.ComponentProps<"nav">): JSX_2.Element;
     displayName: string;
@@ -505,6 +685,8 @@ export declare const PaginationPrevious: {
 
 export declare const PasswordInput: React_2.ForwardRefExoticComponent<InputProps & React_2.RefAttributes<HTMLInputElement>>;
 
+export declare function pluralizeTimes(resourceName: string, count: number): string;
+
 export declare const Popover: React_2.FC<PopoverPrimitive.PopoverProps>;
 
 export declare const PopoverAnchor: React_2.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React_2.RefAttributes<HTMLDivElement>>;
@@ -517,6 +699,21 @@ export declare const RadioGroup: React_2.ForwardRefExoticComponent<Omit<RadioGro
 
 export declare const RadioGroupItem: React_2.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
 
+export declare const RESOURCE_DEFINITIONS: Record<ResourceName, string>;
+
+/** 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 declare type ResourceName = (typeof RESOURCE_NAMES)[number];
+
+export declare const SearchInput: default_2.FC<SearchInputProps>;
+
+declare interface SearchInputProps extends Omit<InputProps, 'onChange'> {
+    onChange?: (value: string) => void;
+}
+
+export declare function secondsToDuration(seconds: number): string;
+
 export declare const Select: React_2.FC<SelectPrimitive.SelectProps>;
 
 export declare const SelectContent: React_2.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
@@ -574,9 +771,11 @@ export declare const SheetTitle: React_2.ForwardRefExoticComponent<Omit<DialogPr
 export declare const SheetTrigger: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
 declare const sheetVariants: (props?: ({
-    side?: "top" | "bottom" | "right" | "left" | null | undefined;
+    side?: "top" | "bottom" | "left" | "right" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+export declare function SideBar({ data, ...props }: SidebarProps): JSX_2.Element;
+
 export declare const Sidebar: React_2.ForwardRefExoticComponent<Omit<React_2.ClassAttributes<HTMLDivElement> & React_2.HTMLAttributes<HTMLDivElement> & {
     side?: "left" | "right";
     variant?: "sidebar" | "floating" | "inset";
@@ -586,7 +785,7 @@ export declare const Sidebar: React_2.ForwardRefExoticComponent<Omit<React_2.Cla
 export declare const SidebarContent: React_2.ForwardRefExoticComponent<Omit<React_2.DetailedHTMLProps<React_2.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
 
 declare type SidebarContext = {
-    state: "expanded" | "collapsed";
+    state: 'expanded' | 'collapsed';
     open: boolean;
     setOpen: (open: boolean) => void;
     openMobile: boolean;
@@ -651,6 +850,10 @@ export declare const SidebarMenuSubButton: React_2.ForwardRefExoticComponent<Omi
 
 export declare const SidebarMenuSubItem: React_2.ForwardRefExoticComponent<Omit<React_2.DetailedHTMLProps<React_2.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React_2.RefAttributes<HTMLLIElement>>;
 
+declare interface SidebarProps extends React_2.ComponentProps<typeof Sidebar> {
+    data: NavItem[];
+}
+
 export declare const SidebarProvider: React_2.ForwardRefExoticComponent<Omit<React_2.ClassAttributes<HTMLDivElement> & React_2.HTMLAttributes<HTMLDivElement> & {
     defaultOpen?: boolean;
     open?: boolean;
@@ -665,20 +868,59 @@ export declare const SidebarTrigger: React_2.ForwardRefExoticComponent<Omit<Butt
 
 export declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): JSX_2.Element;
 
+export declare function StaticDataTable<T>({ accessors, data, affectedData }: StaticDataTableProps<T>): JSX_2.Element;
+
+export declare interface StaticDataTableProps<T> {
+    accessors: (keyof T)[];
+    data: T[];
+    affectedData?: T[];
+}
+
 export declare const Table: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableElement> & React_2.RefAttributes<HTMLTableElement>>;
 
+export declare type TableActions = {
+    /** True if reading this resource is allowed. */
+    read: boolean;
+    /** True if creation of resource from dashboard is allowed. */
+    create: boolean;
+    /** True if the resource can be updated */
+    update: boolean;
+    /** True if the resource can be deleted */
+    delete: boolean;
+    /** True if the resource can be exported */
+    export: boolean;
+    /** True if the resource can be linked to tags. */
+    tag: boolean;
+    /** True if searching is supported. Search is defined by the `query` QueryParameter in the Web API */
+    search: boolean;
+    /** True if selection using checkboxes is allowed */
+    selection: boolean;
+    /** True if the resource has support for segments */
+    segments: boolean;
+};
+
 export declare const TableBody: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableSectionElement> & React_2.RefAttributes<HTMLTableSectionElement>>;
 
 export declare const TableCaption: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableCaptionElement> & React_2.RefAttributes<HTMLTableCaptionElement>>;
 
 export declare const TableCell: React_2.ForwardRefExoticComponent<React_2.TdHTMLAttributes<HTMLTableCellElement> & React_2.RefAttributes<HTMLTableCellElement>>;
 
+export declare type TableFetchFn<TData> = (p: PaginationState, s: SortingState, q: string, f: any) => Promise<{
+    total: number;
+    data: TData[] | undefined;
+}>;
+
 export declare const TableFooter: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableSectionElement> & React_2.RefAttributes<HTMLTableSectionElement>>;
 
 export declare const TableHead: React_2.ForwardRefExoticComponent<React_2.ThHTMLAttributes<HTMLTableCellElement> & React_2.RefAttributes<HTMLTableCellElement>>;
 
 export declare const TableHeader: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableSectionElement> & React_2.RefAttributes<HTMLTableSectionElement>>;
 
+export declare function TablePageLayout({ resourceName, children, }: {
+    resourceName: string;
+    children?: React.ReactNode;
+}): JSX_2.Element;
+
 export declare const TableRow: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLTableRowElement> & React_2.RefAttributes<HTMLTableRowElement>>;
 
 export declare const Tabs: React_2.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React_2.RefAttributes<HTMLDivElement>>;
@@ -723,4 +965,8 @@ export declare function useIsMobile(): boolean;
 
 export declare function useSidebar(): SidebarContext;
 
+export declare type VisibilityState<T> = {
+    [K in keyof T]?: boolean;
+};
+
 export { }