@startdownnotez404/ui 1.0.0 → 1.3.5

package/dist/alert.d.mts

@@ -0,0 +1,202 @@
+import * as React$1 from 'react';
+import React__default from 'react';
+import * as notistack from 'notistack';
+import { SnackbarKey, CustomContentProps } from 'notistack';
+import * as _mui_material_styles from '@mui/material/styles';
+import { Theme, SxProps } from '@mui/material/styles';
+import * as _mui_material_Alert from '@mui/material/Alert';
+
+/**
+ * AlertProvider - Context provider for the alert system
+ * Sets up notistack with all custom alert variant components
+ * Should wrap the entire application or specific sections that need alerts
+ */
+declare const AlertProvider: React__default.NamedExoticComponent<{
+    children: React__default.ReactNode;
+}>;
+
+declare const ALERT_VARIANTs: {
+    readonly info: "myInfo";
+    readonly warning: "myWarning";
+    readonly success: "mySuccess";
+    readonly error: "myError";
+    readonly system: "mySystem";
+    readonly insight: "myInsight";
+    readonly collapsable: "myCollapsable";
+};
+declare const DEFAULTs: {
+    readonly AUTO_HIDE_DURATION: 3000;
+    readonly ANCHOR_ORIGIN: {
+        readonly horizontal: "right";
+        readonly vertical: "top";
+    };
+    readonly PROVIDER_CONFIGs: {
+        readonly maxSnack: 3;
+        readonly dense: true;
+        readonly preventDuplicate: true;
+        readonly autoHideDuration: 3000;
+    };
+};
+declare const ERRORs: {
+    readonly invalid_variant: "Invalid alert variant provided";
+    readonly enqueue_failed: "Failed to enqueue alert";
+    readonly missing_message: "Message is required for alert";
+    readonly missing_component_props: "Component props are required for collapsible alert";
+};
+
+type ValueOf<T> = T[keyof T];
+
+type AlertVariant = ValueOf<typeof ALERT_VARIANTs>;
+interface AlertOptions {
+    message: string | React.ReactNode;
+    variant: AlertVariant;
+    id?: SnackbarKey;
+    autoHideDuration?: number | null;
+    anchorOrigin?: {
+        horizontal: "left" | "center" | "right";
+        vertical: "top" | "bottom";
+    };
+    icon?: React.ReactNode | null;
+}
+/**
+ * Props forwarded to the `Renderer` component inside a collapsable alert.
+ * `title` and `children` are used by the default fallback layout; any
+ * additional fields are forwarded as-is to a custom Renderer.
+ */
+interface CollapsableAlertComponentProps {
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    [key: string]: unknown;
+}
+interface CollapsableAlertOptions {
+    id?: SnackbarKey;
+    autoHideDuration?: number | null;
+    anchorOrigin?: {
+        horizontal: "left" | "center" | "right";
+        vertical: "top" | "bottom";
+    };
+    componentProps?: CollapsableAlertComponentProps;
+    componentWrapperProps?: {
+        Renderer?: React.FC<CollapsableAlertComponentProps>;
+        [key: string]: unknown;
+    };
+    title?: React.ReactNode;
+    actions?: React.ReactNode;
+}
+type AlertOperationResult<T> = {
+    success: true;
+    data: T;
+} | {
+    success: false;
+    error: string;
+};
+
+declare function useAlert(): {
+    enqueueAlert: (options: AlertOptions) => AlertOperationResult<string>;
+    enqueueCollapsable: (options: CollapsableAlertOptions) => AlertOperationResult<string>;
+    enqueueError: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueSuccess: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueWarning: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueInfo: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueSystem: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueInsight: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    closeSnackbar: (key?: notistack.SnackbarKey) => void;
+};
+declare function enqueueAlert({ message, variant, id, autoHideDuration, anchorOrigin, icon, ...rest }: AlertOptions): AlertOperationResult<string>;
+declare function enqueueCollapsable({ id, autoHideDuration, anchorOrigin, componentProps, componentWrapperProps, ...rest }: CollapsableAlertOptions): AlertOperationResult<string>;
+declare function enqueueError(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueSuccess(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueWarning(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueInfo(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueSystem(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueInsight(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+
+declare const CollapsableAlert: React$1.ForwardRefExoticComponent<CustomContentProps & CollapsableAlertOptions & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Root-level CSS variable aliases for the CollapsableAlert compound element.
+ * Declare here once — all child elements consume via `var(--*)`.
+ */
+declare const collapsableAlertRootSx: SxProps<Theme>;
+declare const alertTheme: {
+    readonly styleOverrides: {
+        readonly root: ({ theme }: _mui_material_Alert.AlertProps & Record<string, unknown> & {
+            ownerState: _mui_material_Alert.AlertProps & Record<string, unknown>;
+        } & {
+            theme: Omit<Theme, "components" | "palette"> & _mui_material_styles.CssVarsTheme;
+        }) => {
+            '--alert-bgc': string;
+            '--alert-color': string;
+            whiteSpace: "normal";
+            alignItems: "center";
+            borderRadius: string;
+            backgroundColor: "var(--alert-bgc)";
+            color: "var(--alert-color)";
+            border: string;
+            "& .MuiAlert-icon": {
+                color: string;
+                padding: string;
+            };
+            "& .MuiAlert-message": {
+                flex: number;
+                width: string;
+                padding: string;
+            };
+            "& .MuiButtonBase-root": {
+                '--button-color': string;
+            };
+            "&.MuiAlert-standardError": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardSuccess": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardWarning": {
+                '--alert-bgc': string;
+                '--alert-color': string;
+                "--alert-icon-color": string;
+            };
+            "&.MuiAlert-standardInfo": {
+                '--alert-bgc': string;
+                '--alert-color': string;
+                "--alert-icon-color": string;
+            };
+            "&.MuiAlert-standardSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-filledSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-filledInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-outlinedSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-outlinedInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+        };
+    };
+};
+
+export { ALERT_VARIANTs, type AlertOperationResult, type AlertOptions, AlertProvider, type AlertVariant, CollapsableAlert, type CollapsableAlertComponentProps, type CollapsableAlertOptions, DEFAULTs, ERRORs, alertTheme, collapsableAlertRootSx, enqueueAlert, enqueueCollapsable, enqueueError, enqueueInfo, enqueueInsight, enqueueSuccess, enqueueSystem, enqueueWarning, useAlert };

package/dist/alert.d.ts

@@ -0,0 +1,202 @@
+import * as React$1 from 'react';
+import React__default from 'react';
+import * as notistack from 'notistack';
+import { SnackbarKey, CustomContentProps } from 'notistack';
+import * as _mui_material_styles from '@mui/material/styles';
+import { Theme, SxProps } from '@mui/material/styles';
+import * as _mui_material_Alert from '@mui/material/Alert';
+
+/**
+ * AlertProvider - Context provider for the alert system
+ * Sets up notistack with all custom alert variant components
+ * Should wrap the entire application or specific sections that need alerts
+ */
+declare const AlertProvider: React__default.NamedExoticComponent<{
+    children: React__default.ReactNode;
+}>;
+
+declare const ALERT_VARIANTs: {
+    readonly info: "myInfo";
+    readonly warning: "myWarning";
+    readonly success: "mySuccess";
+    readonly error: "myError";
+    readonly system: "mySystem";
+    readonly insight: "myInsight";
+    readonly collapsable: "myCollapsable";
+};
+declare const DEFAULTs: {
+    readonly AUTO_HIDE_DURATION: 3000;
+    readonly ANCHOR_ORIGIN: {
+        readonly horizontal: "right";
+        readonly vertical: "top";
+    };
+    readonly PROVIDER_CONFIGs: {
+        readonly maxSnack: 3;
+        readonly dense: true;
+        readonly preventDuplicate: true;
+        readonly autoHideDuration: 3000;
+    };
+};
+declare const ERRORs: {
+    readonly invalid_variant: "Invalid alert variant provided";
+    readonly enqueue_failed: "Failed to enqueue alert";
+    readonly missing_message: "Message is required for alert";
+    readonly missing_component_props: "Component props are required for collapsible alert";
+};
+
+type ValueOf<T> = T[keyof T];
+
+type AlertVariant = ValueOf<typeof ALERT_VARIANTs>;
+interface AlertOptions {
+    message: string | React.ReactNode;
+    variant: AlertVariant;
+    id?: SnackbarKey;
+    autoHideDuration?: number | null;
+    anchorOrigin?: {
+        horizontal: "left" | "center" | "right";
+        vertical: "top" | "bottom";
+    };
+    icon?: React.ReactNode | null;
+}
+/**
+ * Props forwarded to the `Renderer` component inside a collapsable alert.
+ * `title` and `children` are used by the default fallback layout; any
+ * additional fields are forwarded as-is to a custom Renderer.
+ */
+interface CollapsableAlertComponentProps {
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    [key: string]: unknown;
+}
+interface CollapsableAlertOptions {
+    id?: SnackbarKey;
+    autoHideDuration?: number | null;
+    anchorOrigin?: {
+        horizontal: "left" | "center" | "right";
+        vertical: "top" | "bottom";
+    };
+    componentProps?: CollapsableAlertComponentProps;
+    componentWrapperProps?: {
+        Renderer?: React.FC<CollapsableAlertComponentProps>;
+        [key: string]: unknown;
+    };
+    title?: React.ReactNode;
+    actions?: React.ReactNode;
+}
+type AlertOperationResult<T> = {
+    success: true;
+    data: T;
+} | {
+    success: false;
+    error: string;
+};
+
+declare function useAlert(): {
+    enqueueAlert: (options: AlertOptions) => AlertOperationResult<string>;
+    enqueueCollapsable: (options: CollapsableAlertOptions) => AlertOperationResult<string>;
+    enqueueError: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueSuccess: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueWarning: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueInfo: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueSystem: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    enqueueInsight: (message: string | React.ReactNode, options?: Omit<AlertOptions, "message" | "variant">) => AlertOperationResult<string>;
+    closeSnackbar: (key?: notistack.SnackbarKey) => void;
+};
+declare function enqueueAlert({ message, variant, id, autoHideDuration, anchorOrigin, icon, ...rest }: AlertOptions): AlertOperationResult<string>;
+declare function enqueueCollapsable({ id, autoHideDuration, anchorOrigin, componentProps, componentWrapperProps, ...rest }: CollapsableAlertOptions): AlertOperationResult<string>;
+declare function enqueueError(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueSuccess(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueWarning(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueInfo(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueSystem(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+declare function enqueueInsight(message: string | React.ReactNode, options?: Omit<AlertOptions, 'message' | 'variant'>): AlertOperationResult<string>;
+
+declare const CollapsableAlert: React$1.ForwardRefExoticComponent<CustomContentProps & CollapsableAlertOptions & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Root-level CSS variable aliases for the CollapsableAlert compound element.
+ * Declare here once — all child elements consume via `var(--*)`.
+ */
+declare const collapsableAlertRootSx: SxProps<Theme>;
+declare const alertTheme: {
+    readonly styleOverrides: {
+        readonly root: ({ theme }: _mui_material_Alert.AlertProps & Record<string, unknown> & {
+            ownerState: _mui_material_Alert.AlertProps & Record<string, unknown>;
+        } & {
+            theme: Omit<Theme, "components" | "palette"> & _mui_material_styles.CssVarsTheme;
+        }) => {
+            '--alert-bgc': string;
+            '--alert-color': string;
+            whiteSpace: "normal";
+            alignItems: "center";
+            borderRadius: string;
+            backgroundColor: "var(--alert-bgc)";
+            color: "var(--alert-color)";
+            border: string;
+            "& .MuiAlert-icon": {
+                color: string;
+                padding: string;
+            };
+            "& .MuiAlert-message": {
+                flex: number;
+                width: string;
+                padding: string;
+            };
+            "& .MuiButtonBase-root": {
+                '--button-color': string;
+            };
+            "&.MuiAlert-standardError": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardSuccess": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardWarning": {
+                '--alert-bgc': string;
+                '--alert-color': string;
+                "--alert-icon-color": string;
+            };
+            "&.MuiAlert-standardInfo": {
+                '--alert-bgc': string;
+                '--alert-color': string;
+                "--alert-icon-color": string;
+            };
+            "&.MuiAlert-standardSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-standardInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-filledSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-filledInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-outlinedSystem": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+            "&.MuiAlert-outlinedInsight": {
+                '--alert-icon-color': string;
+                '--alert-bgc': string;
+                '--alert-color': string;
+            };
+        };
+    };
+};
+
+export { ALERT_VARIANTs, type AlertOperationResult, type AlertOptions, AlertProvider, type AlertVariant, CollapsableAlert, type CollapsableAlertComponentProps, type CollapsableAlertOptions, DEFAULTs, ERRORs, alertTheme, collapsableAlertRootSx, enqueueAlert, enqueueCollapsable, enqueueError, enqueueInfo, enqueueInsight, enqueueSuccess, enqueueSystem, enqueueWarning, useAlert };