@makolabs/ripple 0.0.1-dev.4 → 0.0.1-dev.40

package/dist/layout/sidebar/Sidebar.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { SidebarProps } from './sidebar.js';
+import type { SidebarProps } from '../../index.js';
 declare const Sidebar: import("svelte").Component<SidebarProps, {}, "">;
 type Sidebar = ReturnType<typeof Sidebar>;
 export default Sidebar;

package/dist/layout/table/Table.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { cn } from '../../helper/cls.js';
-	import { table, type TableProps, type SortDirection, type SortState } from './table.js';
-
+	import { table } from './table.js';
+	import type { TableProps, SortDirection, SortState } from '../../index.js';
 	let {
 		data = [],
 		columns = [],

package/dist/layout/table/Table.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type TableProps } from './table.js';
+import type { TableProps } from '../../index.js';
 declare const Table: import("svelte").Component<TableProps<any>, {}, "selected">;
 type Table = ReturnType<typeof Table>;
 export default Table;

package/dist/layout/table/table.d.ts

@@ -1,24 +1,5 @@
 import type { ClassValue } from 'tailwind-variants';
-import type { Snippet } from 'svelte';
-import type { VariantColors, VariantSizes } from '../../types/variants.js';
-export type DataRow = Record<string, any>;
-export type KeyType = keyof DataRow;
-export type StatusType = 'active' | 'inactive' | 'pending' | 'error' | 'default';
-export type TableColumn<T extends DataRow = any> = {
-    key: KeyType;
-    header: string;
-    cell?: Snippet<[row: T, key: KeyType, index?: number]>;
-    sortable?: boolean;
-    sortKey?: string;
-    align?: 'left' | 'center' | 'right';
-    width?: string;
-    class?: ClassValue;
-};
-export type SortDirection = 'asc' | 'desc' | null;
-export type SortState = {
-    column: string | null;
-    direction: SortDirection;
-};
+import type { VariantColors, VariantSizes } from '../../index.js';
 export declare const table: import("tailwind-variants").TVReturnType<{
     size: {
         xs: {

package/dist/layout/table/table.js

@@ -1,12 +1,4 @@
 import { tv } from 'tailwind-variants';
-// Prebuild Cell rendering options
-// Snippet 1 - Date
-// Snippet 2 - Currency
-// Snippet 3 - Percentage
-// Snippet 4 - Phone Number
-// Snippet 5 - Email
-// Snippet 6 - Status
-// Snippet 7 - Time
 export const table = tv({
     slots: {
         base: 'w-full',

package/dist/layout/tabs/TabGroup.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { cn } from '../../helper/cls.js';
 	import Tab from './Tab.svelte';
-	import { tabs, type TabsProps } from './tabs.js';
+	import { tabs, type TabsGroupProps } from './tabs.js';
 	import { setContext } from 'svelte';
 
 	let {
@@ -14,7 +14,7 @@
 		panelClass = '',
 		onchange = () => {},
 		children
-	}: TabsProps = $props();
+	}: TabsGroupProps = $props();
 
 	const { base, list, panel } = $derived(
 		tabs({

package/dist/layout/tabs/TabGroup.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type TabsProps } from './tabs.js';
-declare const TabGroup: import("svelte").Component<TabsProps, {}, "selected">;
+import { type TabsGroupProps } from './tabs.js';
+declare const TabGroup: import("svelte").Component<TabsGroupProps, {}, "selected">;
 type TabGroup = ReturnType<typeof TabGroup>;
 export default TabGroup;

package/dist/layout/tabs/tabs.d.ts

@@ -1,6 +1,6 @@
 import type { ClassValue } from 'tailwind-variants';
 import type { Component, Snippet } from 'svelte';
-import type { VariantColors, VariantSizes } from '../../types/variants.js';
+import type { VariantColors, VariantSizes } from '../../index.js';
 export type TabItem = {
     value: string;
     label: string;
@@ -17,7 +17,7 @@ export type TabProps = {
     size?: VariantSizes;
     onclick?: (event: Event) => void;
 };
-export type TabsProps = {
+export type TabsGroupProps = {
     tabs: TabItem[];
     selected?: string;
     color?: VariantColors;

package/dist/modal/Modal.svelte

@@ -4,7 +4,8 @@
 	import { fade, scale } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 	import { cn } from '../helper/cls.js';
-	import { modal, type MakeModalProps } from './modal.js';
+	import { modal } from './modal.js';
+	import type { MakeModalProps } from '../index.js';
 
 	let {
 		open = $bindable(false),

package/dist/modal/Modal.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type MakeModalProps } from './modal.js';
+import type { MakeModalProps } from '../index.js';
 declare const Modal: import("svelte").Component<MakeModalProps, {}, "open">;
 type Modal = ReturnType<typeof Modal>;
 export default Modal;

package/dist/modal/modal.d.ts

@@ -1,5 +1,3 @@
-import type { VariantSizes } from '../types/variants.js';
-import type { Snippet } from 'svelte';
 export declare const modal: import("tailwind-variants").TVReturnType<{
     open: {
         true: {
@@ -211,24 +209,3 @@ export declare const modal: import("tailwind-variants").TVReturnType<{
     title: string;
     closeButton: string;
 }, undefined, unknown, unknown, undefined>>;
-export type MakeModalProps = {
-    open?: boolean;
-    onclose?: () => void;
-    title?: string;
-    description?: string;
-    hideCloseButton?: boolean;
-    closeOnBackdropClick?: boolean;
-    closeOnEsc?: boolean;
-    position?: keyof typeof modal.variants.position;
-    size?: VariantSizes;
-    class?: string;
-    backdropclass?: string;
-    contentclass?: string;
-    headerclass?: string;
-    bodyclass?: string;
-    titleclass?: string;
-    children?: Snippet;
-    header?: Snippet;
-    footer?: Snippet;
-    custom?: Snippet;
-};

package/dist/modal/modal.js

@@ -5,10 +5,10 @@ export const modal = tv({
         backdrop: 'fixed inset-0 transition-opacity bg-black/50',
         contentWrapper: 'absolute transform overflow-hidden transition-all px-2',
         content: 'bg-white overflow-hidden rounded-lg',
-        header: 'px-4 py-3 flex items-center justify-between border-b border-gray-200',
+        header: 'px-4 py-3 flex items-center justify-between border-b border-default-200',
         body: 'px-3 py-2 max-h-[70dvh] overflow-y-auto',
         title: 'text-default-900 leading-6 text-base font-semibold',
-        closeButton: 'text-gray-400 hover:text-gray-500 rounded-md cursor-pointer'
+        closeButton: 'text-default-400 hover:text-default-500 rounded-md cursor-pointer'
     },
     variants: {
         open: {
@@ -65,7 +65,7 @@ export const modal = tv({
                 content: 'border-0'
             },
             default: {
-                content: 'border border-gray-200'
+                content: 'border border-default-200'
             },
             colored: {
                 content: 'border'

package/dist/sonner/sonner.svelte

@@ -0,0 +1,13 @@
+<script lang="ts">
+	import { Toaster as Sonner, type ToasterProps as SonnerProps } from 'svelte-sonner';
+
+	let restProps: SonnerProps = $props();
+</script>
+
+<Sonner
+	class="toaster group"
+	toastOptions={{
+
+  }}
+	{...restProps}
+/>

package/dist/sonner/sonner.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Toaster as Sonner, type ToasterProps as SonnerProps } from 'svelte-sonner';
+declare const Sonner: import("svelte").Component<SonnerProps, {}, "">;
+type Sonner = ReturnType<typeof Sonner>;
+export default Sonner;

package/dist/types/variants.d.ts

@@ -1,21 +1 @@
-export declare const Color: {
-    readonly DEFAULT: "default";
-    readonly PRIMARY: "primary";
-    readonly SECONDARY: "secondary";
-    readonly INFO: "info";
-    readonly SUCCESS: "success";
-    readonly WARNING: "warning";
-    readonly DANGER: "danger";
-};
-export type VariantColors = (typeof Color)[keyof typeof Color];
-export declare const Size: {
-    readonly XS: "xs";
-    readonly SM: "sm";
-    readonly BASE: "base";
-    readonly LG: "lg";
-    readonly XL: "xl";
-    readonly XXL: "2xl";
-};
-export type VariantSizes = (typeof Size)[keyof typeof Size];
-export declare const colors: VariantColors[];
-export declare const sizes: VariantSizes[];
+export {};

package/dist/types/variants.js

@@ -1,19 +1 @@
-export const Color = {
-    DEFAULT: 'default',
-    PRIMARY: 'primary',
-    SECONDARY: 'secondary',
-    INFO: 'info',
-    SUCCESS: 'success',
-    WARNING: 'warning',
-    DANGER: 'danger'
-};
-export const Size = {
-    XS: 'xs',
-    SM: 'sm',
-    BASE: 'base',
-    LG: 'lg',
-    XL: 'xl',
-    XXL: '2xl'
-};
-export const colors = Object.values(Color);
-export const sizes = Object.values(Size);
+"use strict";

package/dist/variants.d.ts

@@ -0,0 +1,30 @@
+import type { ChartColors, VariantColors, VariantSizes } from './index.js';
+export declare const Color: {
+    DEFAULT: string;
+    PRIMARY: string;
+    SECONDARY: string;
+    INFO: string;
+    SUCCESS: string;
+    WARNING: string;
+    DANGER: string;
+};
+export declare const Size: {
+    XS: string;
+    SM: string;
+    BASE: string;
+    LG: string;
+    XL: string;
+    XXL: string;
+};
+export declare const ChartColor: {
+    readonly HEALTH: "health";
+    readonly PROPERTY: "property";
+    readonly AUTO: "auto";
+    readonly LIFE: "life";
+    readonly OTHER: "other";
+    readonly DEFAULT: "default";
+};
+export declare const defaultChartColors: ChartColors;
+export declare const colors: VariantColors[];
+export declare const sizes: VariantSizes[];
+export declare const chartColors: ("default" | "health" | "property" | "auto" | "life" | "other")[];

package/dist/variants.js

@@ -0,0 +1,36 @@
+export const Color = {
+    DEFAULT: 'default',
+    PRIMARY: 'primary',
+    SECONDARY: 'secondary',
+    INFO: 'info',
+    SUCCESS: 'success',
+    WARNING: 'warning',
+    DANGER: 'danger'
+};
+export const Size = {
+    XS: 'xs',
+    SM: 'sm',
+    BASE: 'base',
+    LG: 'lg',
+    XL: 'xl',
+    XXL: '2xl'
+};
+export const ChartColor = {
+    HEALTH: 'health',
+    PROPERTY: 'property',
+    AUTO: 'auto',
+    LIFE: 'life',
+    OTHER: 'other',
+    DEFAULT: 'default'
+};
+export const defaultChartColors = {
+    [ChartColor.HEALTH]: '#1F69FF',
+    [ChartColor.PROPERTY]: '#2D9D78',
+    [ChartColor.AUTO]: '#E8A317',
+    [ChartColor.LIFE]: '#E34974',
+    [ChartColor.OTHER]: '#7B3FE4',
+    [ChartColor.DEFAULT]: '#6B7280'
+};
+export const colors = Object.values(Color);
+export const sizes = Object.values(Size);
+export const chartColors = Object.values(ChartColor);

package/package.json

@@ -1,10 +1,10 @@
 {
 	"name": "@makolabs/ripple",
-	"version": "0.0.1-dev.4",
+	"version": "0.0.1-dev.40",
 	"description": "Simple Svelte 5 powered component library ✨",
 	"repository": {
 		"type": "git",
-		"url": "https://github.com/makolabsai/mako-ui-components.git"
+		"url": "https://github.com/makolabsai/ripple-ui.git"
 	},
 	"scripts": {
 		"dev": "vite dev",
@@ -63,11 +63,13 @@
 		"publint": "^0.3.2",
 		"svelte": "^5.0.0",
 		"svelte-check": "^4.0.0",
+		"sveltekit-superforms": "^2.24.0",
 		"tailwindcss": "^4.0.0",
 		"typescript": "^5.0.0",
 		"typescript-eslint": "^8.20.0",
 		"vite": "^6.0.0",
-		"vitest": "^3.0.0"
+		"vitest": "^3.0.0",
+		"zod": "^3.24.2"
 	},
 	"keywords": [
 		"svelte",
@@ -95,7 +97,9 @@
 		"toast"
 	],
 	"dependencies": {
+		"dayjs": "^1.11.13",
 		"echarts": "^5.6.0",
+		"svelte-sonner": "^0.3.28",
 		"tailwind-merge": "^3.0.2",
 		"tailwind-variants": "^1.0.0"
 	}

package/dist/button/index.d.ts

@@ -1 +0,0 @@
-export { default as Button } from './Button.svelte';

package/dist/button/index.js

@@ -1 +0,0 @@
-export { default as Button } from './Button.svelte';

package/dist/drawer/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Drawer } from './Drawer.svelte';
-export type { DrawerProps } from './drawer.js';

package/dist/drawer/index.js

@@ -1 +0,0 @@
-export { default as Drawer } from './Drawer.svelte';

package/dist/elements/badge/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Badge } from './Badge.svelte';
-export { badge, type BadgeProps } from './badge.js';

package/dist/elements/badge/index.js

@@ -1,2 +0,0 @@
-export { default as Badge } from './Badge.svelte';
-export { badge } from './badge.js';

package/dist/elements/dropdown/index.d.ts

@@ -1,3 +0,0 @@
-export { default as Select } from './Select.svelte';
-export { default as Dropdown } from './Dropdown.svelte';
-export type { SelectItem, SelectProps } from './select.js';

package/dist/elements/dropdown/index.js

@@ -1,2 +0,0 @@
-export { default as Select } from './Select.svelte';
-export { default as Dropdown } from './Dropdown.svelte';

package/dist/header/index.d.ts

@@ -1,4 +0,0 @@
-export { default as PageHeader } from './PageHeader.svelte';
-export type { PageHeaderProps } from './pageheaders.js';
-export { default as Breadcrumbs } from './Breadcrumbs.svelte';
-export type { BreadcrumbsProps } from './breadcrumbs.js';

package/dist/header/index.js

@@ -1,2 +0,0 @@
-export { default as PageHeader } from './PageHeader.svelte';
-export { default as Breadcrumbs } from './Breadcrumbs.svelte';

package/dist/header/pageheaders.d.ts

@@ -1,10 +0,0 @@
-import { type ClassValue } from 'tailwind-variants';
-import type { BreadcrumbItem } from './breadcrumbs.js';
-import type { Snippet } from 'svelte';
-export type PageHeaderProps = {
-    title: string;
-    breadcrumbs?: BreadcrumbItem[];
-    children?: Snippet;
-    class?: ClassValue;
-    titleclass?: ClassValue;
-};

package/dist/header/pageheaders.js

@@ -1 +0,0 @@
-import {} from 'tailwind-variants';

package/dist/layout/card/index.d.ts

@@ -1,4 +0,0 @@
-export { default as Card } from './Card.svelte';
-export type { CardProps } from './card.js';
-export { default as StatsCard } from './StatsCard.svelte';
-export type { StatsCardProps } from './stats-card.js';

package/dist/layout/card/index.js

@@ -1,2 +0,0 @@
-export { default as Card } from './Card.svelte';
-export { default as StatsCard } from './StatsCard.svelte';

package/dist/layout/index.d.ts

@@ -1,7 +0,0 @@
-export { default as Card } from './card/Card.svelte';
-export { default as Tab } from './tabs/Tab.svelte';
-export { default as TabGroup } from './tabs/TabGroup.svelte';
-export { default as Table } from './table/Table.svelte';
-export { tabs, type TabItem, type TabProps, type TabsProps } from './tabs/tabs.js';
-export { default as Cell } from './table/Cells.svelte';
-export { default as StatsCard } from './card/StatsCard.svelte';

package/dist/layout/index.js

@@ -1,7 +0,0 @@
-export { default as Card } from './card/Card.svelte';
-export { default as Tab } from './tabs/Tab.svelte';
-export { default as TabGroup } from './tabs/TabGroup.svelte';
-export { default as Table } from './table/Table.svelte';
-export { tabs } from './tabs/tabs.js';
-export { default as Cell } from './table/Cells.svelte';
-export { default as StatsCard } from './card/StatsCard.svelte';

package/dist/layout/navbar/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Navbar } from './Navbar.svelte';
-export { navbar, type NavbarProps, type NavbarLinkItem } from './navbar.js';

package/dist/layout/navbar/index.js

@@ -1,2 +0,0 @@
-export { default as Navbar } from './Navbar.svelte';
-export { navbar } from './navbar.js';

package/dist/layout/sidebar/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Sidebar } from './Sidebar.svelte';
-export type { SidebarProps } from './sidebar.js';

package/dist/layout/sidebar/index.js

@@ -1 +0,0 @@
-export { default as Sidebar } from './Sidebar.svelte';

package/dist/layout/sidebar/sidebar.d.ts

@@ -1,46 +0,0 @@
-import type { Component } from 'svelte';
-import type { ClassValue } from 'tailwind-variants';
-import type { Snippet } from 'svelte';
-export type MenuBar = {
-    collapsed: boolean;
-};
-export interface BaseNavigationItem {
-    label: string;
-}
-export interface WithIcon {
-    Icon?: Component;
-}
-export interface Activatable {
-    active?: boolean;
-}
-export interface LinkItem extends BaseNavigationItem, WithIcon, Activatable {
-    href: string;
-    meta?: string;
-}
-export interface ParentItem extends BaseNavigationItem, WithIcon, Activatable {
-    children: LinkItem[];
-}
-export interface DividerItem {
-    type: 'horizontal-divider';
-}
-export type NavigationItem = LinkItem | ParentItem | DividerItem;
-export type LogoType = {
-    src?: string;
-    title: string;
-};
-export interface NavGroupProps {
-    labelArea: Snippet<[ClassValue]>;
-    active?: boolean;
-    children?: Snippet;
-    class?: ClassValue;
-}
-export interface NavItemProps {
-    href: string;
-    active?: boolean;
-    children: Snippet<[ClassValue]>;
-    class?: ClassValue;
-}
-export interface SidebarProps {
-    items?: NavigationItem[];
-    logo: LogoType;
-}

package/dist/layout/sidebar/sidebar.js

@@ -1 +0,0 @@
-export {};

package/dist/layout/table/index.d.ts

@@ -1,3 +0,0 @@
-export { default as Table } from './Table.svelte';
-export type { TableProps, KeyType, DataRow, StatusType, TableColumn, SortState, SortDirection } from './table.js';
-export { default as Cells } from './Cells.svelte';

package/dist/layout/table/index.js

@@ -1,2 +0,0 @@
-export { default as Table } from './Table.svelte';
-export { default as Cells } from './Cells.svelte';

package/dist/layout/tabs/index.d.ts

@@ -1,3 +0,0 @@
-export { default as Tab } from './Tab.svelte';
-export { default as TabContent } from './TabContent.svelte';
-export { default as TabGroup } from './TabGroup.svelte';

package/dist/layout/tabs/index.js

@@ -1,3 +0,0 @@
-export { default as Tab } from './Tab.svelte';
-export { default as TabContent } from './TabContent.svelte';
-export { default as TabGroup } from './TabGroup.svelte';

package/dist/modal/index.d.ts

@@ -1 +0,0 @@
-export { default as Modal } from './Modal.svelte';

package/dist/modal/index.js

@@ -1 +0,0 @@
-export { default as Modal } from './Modal.svelte';