@makolabs/ripple 0.0.1 → 0.0.3

package/dist/header/breadcrumbs.d.ts

@@ -0,0 +1,226 @@
+type BreadcrumbItem = {
+    label: string;
+    href: string;
+    current?: boolean;
+};
+export declare const breadcrumbs: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+        base: {
+            base: string;
+        };
+        lg: {
+            base: string;
+        };
+    };
+    weight: {
+        normal: {
+            item: string;
+        };
+        medium: {
+            item: string;
+        };
+        semibold: {
+            item: string;
+        };
+        bold: {
+            item: string;
+        };
+    };
+    color: {
+        default: {
+            item: string;
+            wrapper: string;
+        };
+        primary: {
+            item: string;
+            wrapper: string;
+        };
+        secondary: {
+            item: string;
+            wrapper: string;
+        };
+        info: {
+            item: string;
+            wrapper: string;
+        };
+        success: {
+            item: string;
+            wrapper: string;
+        };
+        warning: {
+            item: string;
+            wrapper: string;
+        };
+        danger: {
+            item: string;
+            wrapper: string;
+        };
+    };
+    active: {
+        true: {
+            item: string;
+        };
+        false: {
+            item: string;
+        };
+    };
+}, {
+    base: string;
+    list: string;
+    item: string;
+    separator: string;
+    wrapper: string;
+}, undefined, {
+    size: {
+        xs: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+        base: {
+            base: string;
+        };
+        lg: {
+            base: string;
+        };
+    };
+    weight: {
+        normal: {
+            item: string;
+        };
+        medium: {
+            item: string;
+        };
+        semibold: {
+            item: string;
+        };
+        bold: {
+            item: string;
+        };
+    };
+    color: {
+        default: {
+            item: string;
+            wrapper: string;
+        };
+        primary: {
+            item: string;
+            wrapper: string;
+        };
+        secondary: {
+            item: string;
+            wrapper: string;
+        };
+        info: {
+            item: string;
+            wrapper: string;
+        };
+        success: {
+            item: string;
+            wrapper: string;
+        };
+        warning: {
+            item: string;
+            wrapper: string;
+        };
+        danger: {
+            item: string;
+            wrapper: string;
+        };
+    };
+    active: {
+        true: {
+            item: string;
+        };
+        false: {
+            item: string;
+        };
+    };
+}, {
+    base: string;
+    list: string;
+    item: string;
+    separator: string;
+    wrapper: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+        base: {
+            base: string;
+        };
+        lg: {
+            base: string;
+        };
+    };
+    weight: {
+        normal: {
+            item: string;
+        };
+        medium: {
+            item: string;
+        };
+        semibold: {
+            item: string;
+        };
+        bold: {
+            item: string;
+        };
+    };
+    color: {
+        default: {
+            item: string;
+            wrapper: string;
+        };
+        primary: {
+            item: string;
+            wrapper: string;
+        };
+        secondary: {
+            item: string;
+            wrapper: string;
+        };
+        info: {
+            item: string;
+            wrapper: string;
+        };
+        success: {
+            item: string;
+            wrapper: string;
+        };
+        warning: {
+            item: string;
+            wrapper: string;
+        };
+        danger: {
+            item: string;
+            wrapper: string;
+        };
+    };
+    active: {
+        true: {
+            item: string;
+        };
+        false: {
+            item: string;
+        };
+    };
+}, {
+    base: string;
+    list: string;
+    item: string;
+    separator: string;
+    wrapper: string;
+}, undefined, unknown, unknown, undefined>>;
+export type { BreadcrumbItem };

package/dist/header/breadcrumbs.js

@@ -0,0 +1,87 @@
+import { tv } from 'tailwind-variants';
+export const breadcrumbs = tv({
+    slots: {
+        base: 'flex',
+        list: 'flex flex-wrap items-center space-x-2.5',
+        item: 'flex items-center whitespace-nowrap',
+        separator: 'flex items-center',
+        wrapper: 'flex items-center gap-2.5'
+    },
+    variants: {
+        size: {
+            xs: {
+                base: 'items-center text-xs'
+            },
+            sm: {
+                base: 'items-center text-sm'
+            },
+            base: {
+                base: 'items-center text-base'
+            },
+            lg: {
+                base: 'items-center text-lg'
+            }
+        },
+        weight: {
+            normal: {
+                item: 'font-normal'
+            },
+            medium: {
+                item: 'font-medium'
+            },
+            semibold: {
+                item: 'font-semibold'
+            },
+            bold: {
+                item: 'font-bold'
+            }
+        },
+        color: {
+            default: {
+                item: 'hover:text-default-700',
+                wrapper: 'text-default-500'
+            },
+            primary: {
+                item: 'hover:text-primary-700',
+                wrapper: 'text-primary-500'
+            },
+            secondary: {
+                item: 'hover:text-secondary-700',
+                wrapper: 'text-secondary-500'
+            },
+            info: {
+                item: 'hover:text-info-700',
+                wrapper: 'text-info-500'
+            },
+            success: {
+                item: 'hover:text-success-700',
+                wrapper: 'text-success-500'
+            },
+            warning: {
+                item: 'hover:text-warning-700',
+                wrapper: 'text-warning-500'
+            },
+            danger: {
+                item: 'hover:text-danger-700',
+                wrapper: 'text-danger-500'
+            }
+        },
+        active: {
+            true: {
+                item: 'text-current font-semibold'
+            },
+            false: {
+                item: ''
+            }
+        }
+    },
+    compoundVariants: [
+    // Additional compound variants can be added here if needed
+    ],
+    defaultVariants: {
+        size: 'sm',
+        weight: 'medium',
+        color: 'default',
+        active: false
+    }
+});

package/dist/helper/cls.d.ts

@@ -1,2 +1,3 @@
 import { type ClassValue } from 'clsx';
 export declare function cn(...inputs: ClassValue[]): string;
+export declare const tv: import("tailwind-variants").CreateTV;

package/dist/helper/cls.js

@@ -1,5 +1,9 @@
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
+import { createTV } from 'tailwind-variants';
 export function cn(...inputs) {
     return twMerge(clsx(inputs));
 }
+export const tv = createTV({
+    twMerge: true
+});

package/dist/helper/date.d.ts

@@ -0,0 +1,7 @@
+export declare const DATE_FORMAT: {
+    ISO: string;
+    READABLE: string;
+    SHORT: string;
+};
+export declare function formatDateTime(time: Date | string, format?: string): string;
+export declare function getRelativeTime(time: Date | string): string;

package/dist/helper/date.js

@@ -0,0 +1,15 @@
+import dayjs from 'dayjs';
+import relativeTime from 'dayjs/plugin/relativeTime.js';
+dayjs.extend(relativeTime);
+export const DATE_FORMAT = {
+    ISO: 'YYYY-MM-DDTHH:mm:ssZ',
+    READABLE: 'MMM D, YYYY h:mm A',
+    SHORT: 'MM/DD/YYYY HH:mm'
+};
+export function formatDateTime(time, format = DATE_FORMAT.READABLE) {
+    return dayjs(time).format(format);
+}
+export function getRelativeTime(time) {
+    const date = dayjs(time);
+    return date.fromNow();
+}

package/dist/helper/nav.svelte.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Check if a URL matches the current route
+ * @param href - The URL to check
+ * @param exact - Whether to require an exact match
+ */
+export declare function isRouteActive(href: string, exact?: boolean): boolean;

package/dist/helper/nav.svelte.js

@@ -0,0 +1,23 @@
+import { page } from '$app/state';
+/**
+ * Check if a URL matches the current route
+ * @param href - The URL to check
+ * @param exact - Whether to require an exact match
+ */
+export function isRouteActive(href, exact = false) {
+    const currentPath = page.url.pathname;
+    if (exact) {
+        return currentPath === href;
+    }
+    // Home page special case
+    if (href === '/' && currentPath === '/') {
+        return true;
+    }
+    // Check if the current path starts with href, but ensure it's a complete segment
+    if (href !== '/' && currentPath.startsWith(href)) {
+        // Check if the next character after href is a slash or the end of the string
+        const nextChar = currentPath.charAt(href.length);
+        return nextChar === '' || nextChar === '/';
+    }
+    return false;
+}