@svelte-atoms/core 1.0.0-alpha.28 → 1.0.0-alpha.30

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@svelte-atoms/core",
-	"version": "1.0.0-alpha.28",
+	"version": "1.0.0-alpha.30",
 	"description": "A modular, accessible, and extensible Svelte UI component library.",
 	"repository": {
 		"type": "git",
@@ -357,11 +357,6 @@
 			"svelte": "./dist/components/tooltip/atoms.js",
 			"default": "./dist/components/tooltip/atoms.js"
 		},
-		"./components": {
-			"types": "./dist/components/index.d.ts",
-			"svelte": "./dist/components/index.js",
-			"default": "./dist/components/index.js"
-		},
 		"./utils": {
 			"types": "./dist/utils/index.d.ts",
 			"svelte": "./dist/utils/index.js",
@@ -372,6 +367,10 @@
 			"svelte": "./dist/shared/index.js",
 			"default": "./dist/shared/index.js"
 		},
+		"./tw": {
+			"svelte": "./dist/components/root/root.css",
+			"default": "./dist/components/root/root.css"
+		},
 		"./styles/root": {
 			"svelte": "./dist/components/root/root.css",
 			"default": "./dist/components/root/root.css"
@@ -452,13 +451,12 @@
 	},
 	"dependencies": {
 		"@floating-ui/dom": "^1.7.0",
+		"@qrcode-js/browser": "^1.2.0",
 		"clsx": "^2.1.1",
 		"date-fns": "^4.1.0",
 		"es-toolkit": "^1.37.2",
-		"gsap": "^3.13.0",
 		"motion": "^12.23.22",
 		"nanoid": "^5.1.5",
-		"tailwind-merge": "^3.2.0",
-		"uqr": "^0.1.2"
+		"tailwind-merge": "^3.2.0"
 	}
 }

package/dist/actions/animation.svelte.d.ts

@@ -1,6 +0,0 @@
-export declare function animate(node: HTMLElement | SVGElement, fn: () => gsap.TweenVars): void;
-export type GsapFromToParams = {
-    from: gsap.TweenVars;
-    to: gsap.TweenVars;
-};
-export declare function gsapFromTo(node: HTMLElement | SVGElement, fn: () => GsapFromToParams): void;

package/dist/actions/animation.svelte.js

@@ -1,14 +0,0 @@
-import { gsap } from 'gsap';
-export function animate(node, fn) {
-    gsap.set(node, fn());
-    $effect(() => {
-        gsap.to(node, fn());
-    });
-}
-export function gsapFromTo(node, fn) {
-    gsap.set(node, { ...fn().from });
-    $effect(() => {
-        const { from, to } = fn();
-        gsap.fromTo(node, { ...from }, { ...to });
-    });
-}

package/dist/actions/clickout.svelte.d.ts

@@ -1,2 +0,0 @@
-export declare function clickout(node: HTMLElement, onclick?: (ev: MouseEvent) => void): () => void;
-export declare function clickoutAction(node: HTMLElement, onclick?: (ev: MouseEvent) => void): void;

package/dist/actions/clickout.svelte.js

@@ -1,15 +0,0 @@
-export function clickout(node, onclick) {
-    const handler = (ev) => {
-        const target = ev.target;
-        if (!node.contains(target)) {
-            onclick?.(ev);
-        }
-    };
-    document.addEventListener('click', handler);
-    return () => {
-        document.removeEventListener('click', handler);
-    };
-}
-export function clickoutAction(node, onclick) {
-    $effect(() => clickout(node, onclick));
-}

package/dist/actions/popover.svelte.d.ts

@@ -1,19 +0,0 @@
-import { type AutoPlacementOptions, type ComputePositionReturn } from '@floating-ui/dom';
-type PopoverElement = HTMLElement;
-type OnChangeParams = ComputePositionReturn & {
-    dx: number;
-    dy: number;
-};
-type OnMountCallback = (p: OnChangeParams) => void;
-export type PopoverParams = AutoPlacementOptions & {
-    open?: boolean;
-    target?: HTMLElement;
-    reference?: HTMLElement;
-    offset?: number;
-    animate?: (node: PopoverElement, params: ComputePositionReturn) => void;
-    onMount?: () => void | (() => void);
-    onDestroy?: () => void;
-    onChange?: OnMountCallback;
-};
-export declare function popover(node: HTMLElement, fn: () => PopoverParams): void;
-export {};

package/dist/actions/popover.svelte.js

@@ -1,81 +0,0 @@
-import { tick, untrack } from 'svelte';
-import { autoPlacement, autoUpdate, computePosition, offset } from '@floating-ui/dom';
-import { port } from './portal.svelte';
-// This function is responsible of applying position calculation on the element and notify caller
-const positionate = async (node, params) => {
-    const d = await calculatePosition(node, params);
-    params?.onChange?.({ ...d, ...direction(d.placement) });
-    params?.animate(node, d);
-};
-export function popover(node, fn) {
-    node.hidden = true;
-    // if (!fn.target) {
-    // 	return;
-    // }
-    // $effect(() => )
-    // This function is used to keep a reference of the `autoUpdate` cleanup function
-    let cleanups = [];
-    const { target } = fn();
-    if (!target) {
-        return;
-    }
-    const unport = port(node, target);
-    $effect(() => unport);
-    $effect(() => {
-        const { target, reference, animate = defaultAnimate, open = false, ...restParams } = fn();
-        if (!target) {
-            return;
-        }
-        if (!reference) {
-            return;
-        }
-        if (!reference) {
-            return;
-        }
-        if (open) {
-            // Keep position updated
-            const cleanup = autoUpdate(reference, node, () => {
-                // positionate(node, { ...restParams, target, reference, animate })
-            }, {});
-            cleanups.push(cleanup);
-        }
-        else {
-            positionate(node, { ...restParams, target, reference, animate });
-        }
-        return () => {
-            try {
-                cleanups.forEach((fn) => fn());
-                cleanups = [];
-            }
-            catch (err) {
-                //
-            }
-        };
-    });
-}
-async function calculatePosition(node, { alignment, allowedPlacements, offset: off, reference }) {
-    if (!reference) {
-        throw new Error('Reference element is not found');
-    }
-    return computePosition(reference, node, {
-        middleware: [
-            offset(off),
-            autoPlacement({
-                autoAlignment: true,
-                crossAxis: true,
-                allowedPlacements: allowedPlacements,
-                alignment: alignment
-            })
-        ]
-    });
-}
-function direction(placement) {
-    const dy = placement.startsWith('top') ? 1 : placement.startsWith('bottom') ? -1 : 0;
-    const dx = placement.startsWith('left') ? 1 : placement.startsWith('right') ? -1 : 0;
-    return { dx, dy };
-}
-function defaultAnimate(node, params) {
-    requestAnimationFrame(() => {
-        node.style.transform = `translate(${params.x}px, ${params.y}px)`;
-    });
-}

package/dist/actions/portal.svelte.d.ts

@@ -1,8 +0,0 @@
-export type PortalParams = {
-    target: HTMLElement;
-    onMount?: () => void;
-    onUpdate?: () => void;
-    onDestroy?: () => void;
-};
-export declare function portal(node: HTMLElement, fn: () => PortalParams): void;
-export declare function port(node: HTMLElement, target?: HTMLElement): () => void;

package/dist/actions/portal.svelte.js

@@ -1,32 +0,0 @@
-export function portal(node, fn) {
-    let unport = () => { };
-    const { onMount = () => { } } = fn();
-    onMount?.();
-    $effect(() => {
-        const { target = document.body, onUpdate = () => { }, onDestroy = () => { } } = fn();
-        if (!target) {
-            return;
-        }
-        unport = port(node, target);
-        onUpdate();
-        return () => {
-            onDestroy();
-            unport?.();
-        };
-    });
-}
-export function port(node, target = document.body) {
-    if (!target) {
-        throw Error('[actions] portal: Target element is undefined !');
-    }
-    node.hidden = true;
-    // Check if element is already mounted on target
-    if (node.parentElement !== target) {
-        target.appendChild(node);
-        node.hidden = false;
-    }
-    return () => {
-        node.hidden = true;
-        node.remove();
-    };
-}

package/dist/attachments/gsap.svelte.d.ts

@@ -1,2 +0,0 @@
-export declare function animate<T extends Element>(callback: (node: T, parentTween?: gsap.core.Tween) => gsap.core.Tween): (node: T) => () => void;
-export declare function timeline<T>(callback: (node: T, parentTimeline?: gsap.core.Timeline) => gsap.core.Timeline, id?: string, parentId?: string): (node: T) => () => void;

package/dist/attachments/gsap.svelte.js

@@ -1,26 +0,0 @@
-import { getContext, setContext } from 'svelte';
-const ELEMENT_CONTEXT_KEY = '@atom-ui/context/gsap/element';
-export function animate(callback) {
-    return (node) => {
-        const parentTween = getContext(ELEMENT_CONTEXT_KEY);
-        const tween = callback(node, parentTween);
-        setContext(ELEMENT_CONTEXT_KEY, tween);
-        return () => { };
-    };
-}
-const TIMELINE_CONTEXT_KEY = '@atom-ui/context/gsap/timeline';
-function timelineIdKey(id) {
-    return [TIMELINE_CONTEXT_KEY, id].join('/');
-}
-export function timeline(callback, id, parentId) {
-    return (node) => {
-        const parentKey = parentId ? timelineIdKey(parentId) : TIMELINE_CONTEXT_KEY;
-        const parentTimeline = getContext(parentKey);
-        const timeline = callback(node, parentTimeline);
-        if (id) {
-            setContext(timelineIdKey(id), timeline);
-        }
-        setContext(TIMELINE_CONTEXT_KEY, timeline);
-        return () => { };
-    };
-}