svelora 3.0.7 → 3.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "svelora",
-    "version": "3.0.7",
+    "version": "3.0.8",
     "description": "Modern primitive-based UI component library for Svelte 5",
     "packageManager": "bun@1.3.14",
     "author": "asphum",
@@ -126,7 +126,8 @@
         "tiptap-markdown": "^0.9.0",
         "valibot": "^1.0.0",
         "yup": "^1.7.0",
-        "zod": "^3.24.0 || ^4.0.0"
+        "zod": "^3.24.0 || ^4.0.0",
+        "mode-watcher": "^1.1.0"
     },
     "peerDependenciesMeta": {
         "@tiptap/core": {
@@ -259,16 +260,14 @@
         "@internationalized/date": "^3.12.2",
         "@modelcontextprotocol/sdk": "^1.29.0",
         "@standard-schema/spec": "^1.1.0",
+        "apexcharts": "^5.15.2",
         "bits-ui": "^2.18.1",
-        "chart.js": "^4.5.1",
         "embla-carousel": "9.0.0-rc02",
         "embla-carousel-autoplay": "9.0.0-rc02",
         "embla-carousel-class-names": "9.0.0-rc02",
         "embla-carousel-fade": "9.0.0-rc02",
         "embla-carousel-svelte": "9.0.0-rc02",
-        "mode-watcher": "^1.1.0",
         "shiki": "^4.3.0",
-        "svelte-chartjs": "^4.0.1",
         "svelte-sonner": "^1.1.1",
         "tailwind-merge": "^3.6.0",
         "tailwind-variants": "^3.2.2",

package/dist/Chart/chart.variants.d.ts

@@ -1,3 +0,0 @@
-import { type VariantProps } from 'tailwind-variants';
-export declare const chartVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "w-full h-full relative", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "w-full h-full relative", unknown, unknown, undefined>>;
-export type ChartVariantProps = VariantProps<typeof chartVariants>;

package/dist/Chart/chart.variants.js

@@ -1,4 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const chartVariants = tv({
-    base: 'w-full h-full relative'
-});

package/dist/Menu/Menu.svelte

@@ -1,134 +0,0 @@
-<script lang="ts">import { twMerge } from "tailwind-merge";
-import Icon from "../Icon/Icon.svelte";
-import { menuVariants } from "./menu.variants.js";
-let { items = [], variant = "default", accordion = false, autoActive = false, class: className, children } = $props();
-let styles = $derived(menuVariants({ variant }));
-// Track open state for groups
-let openGroupLabel = $state(null);
-let openGroups = $state(new Set());
-// Initialize open groups based on prop
-$effect(() => {
-	if (!accordion) {
-		items.forEach((item) => {
-			if (item.type === "group" && item.open && item.label) {
-				openGroups.add(item.label);
-			}
-		});
-		openGroups = new Set(openGroups);
-	}
-});
-function handleGroupToggle(groupItem) {
-	if (accordion) {
-		if (openGroupLabel === groupItem.label) {
-			openGroupLabel = null;
-		} else {
-			openGroupLabel = groupItem.label || null;
-		}
-	} else {
-		toggleGroup(groupItem);
-	}
-}
-function toggleGroup(groupItem) {
-	if (!groupItem.label) return;
-	if (openGroups.has(groupItem.label)) {
-		openGroups.delete(groupItem.label);
-	} else {
-		openGroups.add(groupItem.label);
-	}
-	openGroups = new Set(openGroups);
-}
-function isGroupOpen(groupItem) {
-	if (accordion) {
-		return openGroupLabel === groupItem.label;
-	}
-	if (!groupItem.label) return false;
-	return openGroups.has(groupItem.label);
-}
-// Auto active logic
-let currentPath = $state("");
-$effect(() => {
-	if (autoActive && typeof window !== "undefined") {
-		currentPath = window.location.pathname;
-		// Optionally listen to popstate for SPA navigation if not using SvelteKit stores
-		const onPopState = () => {
-			currentPath = window.location.pathname;
-		};
-		window.addEventListener("popstate", onPopState);
-		return () => window.removeEventListener("popstate", onPopState);
-	}
-});
-function isActive(item) {
-	if (item.active) return true;
-	if (autoActive && item.type !== "group" && item.href) {
-		return currentPath === item.href || currentPath.startsWith(item.href + "/");
-	}
-	return false;
-}
-</script>
-
-{#snippet renderActionItem(item: MenuItemType)}
-    <li>
-        <!-- svelte-ignore a11y_no_static_element_interactions -->
-        <svelte:element 
-            this={item.type !== 'group' && item.href ? 'a' : 'button'}
-            href={item.type !== 'group' ? item.href : undefined}
-            type={item.type !== 'group' && !item.href ? 'button' : undefined}
-            target={item.type !== 'group' ? item.target : undefined}
-            class={twMerge(styles.item(), isActive(item) ? styles.itemActive() : '', item.class)}
-            disabled={item.disabled}
-            onclick={item.type !== 'group' ? item.onClick : undefined}
-        >
-            {#if item.icon}
-                <Icon name={item.icon} class={styles.icon()} />
-            {/if}
-            <span class="truncate">{item.label}</span>
-        </svelte:element>
-    </li>
-{/snippet}
-
-{#snippet renderGroupItem(item: MenuGroupItem)}
-    <li class={styles.group()}>
-        <button
-            type="button"
-            class={twMerge(styles.groupTrigger(), isGroupOpen(item) ? styles.groupTriggerActive() : '', item.class)}
-            disabled={item.disabled}
-            onclick={() => handleGroupToggle(item)}
-        >
-            <div class="flex items-center truncate">
-                {#if item.icon}
-                    <Icon name={item.icon} class={styles.icon()} />
-                {/if}
-                <span class="truncate">{item.label}</span>
-            </div>
-            <Icon 
-                name="lucide:chevron-down" 
-                class={twMerge(styles.chevron(), isGroupOpen(item) ? 'rotate-180' : '')} 
-            />
-        </button>
-        {#if isGroupOpen(item)}
-            <ul class={styles.groupContent()}>
-                {#each item.items as subItem}
-                    {#if subItem.type === 'group'}
-                        {@render renderGroupItem(subItem)}
-                    {:else}
-                        {@render renderActionItem(subItem)}
-                    {/if}
-                {/each}
-            </ul>
-        {/if}
-    </li>
-{/snippet}
-
-<ul class={twMerge(styles.base(), className)}>
-    {#if children}
-        {@render children()}
-    {:else}
-        {#each items as item}
-            {#if item.type === 'group'}
-                {@render renderGroupItem(item)}
-            {:else}
-                {@render renderActionItem(item)}
-            {/if}
-        {/each}
-    {/if}
-</ul>

package/dist/Menu/Menu.svelte.d.ts

@@ -1,4 +0,0 @@
-import type { MenuProps } from './menu.types.js';
-declare const Menu: import("svelte").Component<MenuProps, {}, "">;
-type Menu = ReturnType<typeof Menu>;
-export default Menu;

package/dist/Menu/index.d.ts

@@ -1,4 +0,0 @@
-import Menu from './Menu.svelte';
-export { Menu };
-export * from './menu.types.js';
-export * from './menu.variants.js';

package/dist/Menu/index.js

@@ -1,4 +0,0 @@
-import Menu from './Menu.svelte';
-export { Menu };
-export * from './menu.types.js';
-export * from './menu.variants.js';

package/dist/Menu/menu.types.d.ts

@@ -1,82 +0,0 @@
-import type { Snippet } from 'svelte';
-import type { ClassNameValue } from 'tailwind-merge';
-import type { MenuVariantProps } from './menu.variants.js';
-export interface MenuItemBase {
-    /**
-     * Text to display in the menu item.
-     */
-    label?: string;
-    /**
-     * Icon to display before the label.
-     */
-    icon?: string;
-    /**
-     * Whether the menu item is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * Whether the menu item is active/selected.
-     */
-    active?: boolean;
-    /**
-     * Additional CSS classes.
-     */
-    class?: ClassNameValue;
-}
-export interface MenuActionItem extends MenuItemBase {
-    type?: 'action' | 'item';
-    /**
-     * The URL to navigate to when the item is clicked.
-     */
-    href?: string;
-    /**
-     * Click handler for the item.
-     */
-    onClick?: (event: MouseEvent) => void;
-    /**
-     * Target attribute for link items.
-     */
-    target?: string;
-}
-export interface MenuGroupItem extends MenuItemBase {
-    type: 'group';
-    /**
-     * Child items to display when the group is expanded.
-     */
-    items: MenuItems;
-    /**
-     * Whether the group is currently open/expanded.
-     */
-    open?: boolean;
-}
-export type MenuItemType = MenuActionItem | MenuGroupItem;
-export type MenuItems = MenuItemType[];
-export interface MenuProps {
-    /**
-     * The array of menu items to render.
-     */
-    items?: MenuItems;
-    /**
-     * Style variant of the menu.
-     */
-    variant?: MenuVariantProps['variant'];
-    /**
-     * Whether the menu allows multiple groups to be open at once (false)
-     * or acts as an accordion, closing other groups when one opens (true).
-     * @default false
-     */
-    accordion?: boolean;
-    /**
-     * Auto-detect active state from current URL if using SvelteKit.
-     * @default false
-     */
-    autoActive?: boolean;
-    /**
-     * Additional CSS classes.
-     */
-    class?: ClassNameValue;
-    /**
-     * Custom slot for completely custom rendering of items.
-     */
-    children?: Snippet;
-}

package/dist/Menu/menu.variants.d.ts

@@ -1,46 +0,0 @@
-import { type VariantProps } from 'tailwind-variants';
-export declare const menuVariants: import("tailwind-variants").TVReturnType<{
-    variant: {
-        default: {};
-    };
-}, {
-    base: string;
-    group: string;
-    groupTrigger: string[];
-    groupTriggerActive: string;
-    groupContent: string;
-    item: string[];
-    itemActive: string;
-    icon: string;
-    chevron: string;
-}, undefined, {
-    variant: {
-        default: {};
-    };
-}, {
-    base: string;
-    group: string;
-    groupTrigger: string[];
-    groupTriggerActive: string;
-    groupContent: string;
-    item: string[];
-    itemActive: string;
-    icon: string;
-    chevron: string;
-}, import("tailwind-variants").TVReturnType<{
-    variant: {
-        default: {};
-    };
-}, {
-    base: string;
-    group: string;
-    groupTrigger: string[];
-    groupTriggerActive: string;
-    groupContent: string;
-    item: string[];
-    itemActive: string;
-    icon: string;
-    chevron: string;
-}, undefined, unknown, unknown, undefined>>;
-export type MenuVariantProps = VariantProps<typeof menuVariants>;
-export type MenuSlots = keyof typeof menuVariants.slots;

package/dist/Menu/menu.variants.js

@@ -1,32 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const menuVariants = tv({
-    slots: {
-        base: 'flex flex-col gap-1 w-full',
-        group: 'flex flex-col w-full',
-        groupTrigger: [
-            'flex items-center justify-between w-full px-3 py-2 text-sm font-medium rounded-md',
-            'transition-colors duration-200 outline-none focus-visible:ring-2 focus-visible:ring-outline',
-            'text-on-surface hover:bg-surface-container-highest',
-            'disabled:opacity-50 disabled:cursor-not-allowed'
-        ],
-        groupTriggerActive: 'bg-primary-container text-on-primary-container',
-        groupContent: 'flex flex-col gap-1 pl-4 mt-1',
-        item: [
-            'flex items-center w-full px-3 py-2 text-sm font-medium rounded-md',
-            'transition-colors duration-200 outline-none focus-visible:ring-2 focus-visible:ring-outline',
-            'text-on-surface hover:bg-surface-container-highest',
-            'disabled:opacity-50 disabled:cursor-not-allowed'
-        ],
-        itemActive: 'bg-primary-container text-on-primary-container hover:bg-primary-container/90',
-        icon: 'size-5 mr-3 shrink-0',
-        chevron: 'size-4 shrink-0 transition-transform duration-200'
-    },
-    variants: {
-        variant: {
-            default: {}
-        }
-    },
-    defaultVariants: {
-        variant: 'default'
-    }
-});