fancy-ui-svelte 0.4.1 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +40 -7
- package/dist/fancy-ui/dock/index.d.ts +1 -1
- package/dist/fancy-ui/dock/index.js +0 -1
- package/dist/fancy-ui/editorial-engine/EditorialEngine.svelte +181 -0
- package/dist/fancy-ui/editorial-engine/EditorialEngine.svelte.d.ts +26 -0
- package/dist/fancy-ui/editorial-engine/README.md +56 -0
- package/dist/fancy-ui/editorial-engine/engine.d.ts +7 -0
- package/dist/fancy-ui/editorial-engine/engine.js +581 -0
- package/dist/fancy-ui/editorial-engine/index.d.ts +2 -0
- package/dist/fancy-ui/editorial-engine/index.js +1 -0
- package/dist/fancy-ui/fluid-cursor/FluidCursor.svelte +168 -32
- package/dist/fancy-ui/fluid-cursor/FluidCursor.svelte.d.ts +7 -0
- package/dist/fancy-ui/fluid-cursor/FluidCursor.test.js +36 -9
- package/dist/fancy-ui/fluid-cursor/index.d.ts +4 -1
- package/dist/fancy-ui/fluid-cursor/index.js +4 -1
- package/dist/fancy-ui/index.d.ts +4 -0
- package/dist/fancy-ui/index.js +4 -0
- package/dist/fancy-ui/line-reveal/LineReveal.svelte +168 -0
- package/dist/fancy-ui/line-reveal/LineReveal.svelte.d.ts +33 -0
- package/dist/fancy-ui/line-reveal/README.md +42 -0
- package/dist/fancy-ui/line-reveal/index.d.ts +2 -0
- package/dist/fancy-ui/line-reveal/index.js +1 -0
- package/dist/fancy-ui/noise-reveal/NoiseReveal.svelte +323 -0
- package/dist/fancy-ui/noise-reveal/NoiseReveal.svelte.d.ts +19 -0
- package/dist/fancy-ui/noise-reveal/NoiseReveal.test.js +123 -0
- package/dist/fancy-ui/noise-reveal/index.d.ts +2 -0
- package/dist/fancy-ui/noise-reveal/index.js +1 -0
- package/dist/fancy-ui/registry.js +1589 -9
- package/dist/fancy-ui/shimmer-button/ShimmerButton.svelte +1 -1
- package/dist/fancy-ui/tailwind.css +2 -2
- package/dist/types.d.ts +37 -0
- package/package.json +10 -2
- package/dist/fancy-ui/fluid-cursor/FluidCursorAdvanced.svelte +0 -1556
- package/dist/fancy-ui/fluid-cursor/FluidCursorAdvanced.svelte.d.ts +0 -33
- package/dist/fancy-ui/fluid-cursor/FluidCursorAdvanced.test.js +0 -86
- /package/dist/fancy-ui/{fluid-cursor/FluidCursorAdvanced.test.d.ts → noise-reveal/NoiseReveal.test.d.ts} +0 -0
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
interface ColorRGB {
|
|
2
|
-
r: number;
|
|
3
|
-
g: number;
|
|
4
|
-
b: number;
|
|
5
|
-
}
|
|
6
|
-
interface Props {
|
|
7
|
-
simResolution?: number;
|
|
8
|
-
dyeResolution?: number;
|
|
9
|
-
captureResolution?: number;
|
|
10
|
-
densityDissipation?: number;
|
|
11
|
-
velocityDissipation?: number;
|
|
12
|
-
pressure?: number;
|
|
13
|
-
pressureIterations?: number;
|
|
14
|
-
curl?: number;
|
|
15
|
-
splatRadius?: number;
|
|
16
|
-
splatForce?: number;
|
|
17
|
-
shading?: boolean;
|
|
18
|
-
colorUpdateSpeed?: number;
|
|
19
|
-
backColor?: ColorRGB | string;
|
|
20
|
-
transparent?: boolean;
|
|
21
|
-
fluidColor?: string;
|
|
22
|
-
fluidColors?: string[];
|
|
23
|
-
colorIntensity?: number;
|
|
24
|
-
class?: string;
|
|
25
|
-
autoSplat?: boolean;
|
|
26
|
-
autoSplatInterval?: number;
|
|
27
|
-
interactive?: boolean;
|
|
28
|
-
pauseWhenHidden?: boolean;
|
|
29
|
-
splatOnMount?: boolean;
|
|
30
|
-
}
|
|
31
|
-
declare const FluidCursorAdvanced: import("svelte").Component<Props, {}, "">;
|
|
32
|
-
type FluidCursorAdvanced = ReturnType<typeof FluidCursorAdvanced>;
|
|
33
|
-
export default FluidCursorAdvanced;
|
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import { render, cleanup } from "@testing-library/svelte";
|
|
2
|
-
import { afterEach, beforeEach, describe, it, expect, vi } from "vitest";
|
|
3
|
-
import FluidCursorAdvanced from "./FluidCursorAdvanced.svelte";
|
|
4
|
-
describe("FluidCursorAdvanced", () => {
|
|
5
|
-
afterEach(cleanup);
|
|
6
|
-
it("renders a container div", () => {
|
|
7
|
-
const { container } = render(FluidCursorAdvanced);
|
|
8
|
-
const div = container.firstElementChild;
|
|
9
|
-
expect(div).toBeInTheDocument();
|
|
10
|
-
});
|
|
11
|
-
it("renders a canvas element", () => {
|
|
12
|
-
const { container } = render(FluidCursorAdvanced);
|
|
13
|
-
const canvas = container.querySelector("canvas");
|
|
14
|
-
expect(canvas).toBeInTheDocument();
|
|
15
|
-
});
|
|
16
|
-
it("canvas does not share the hard-coded id with FluidCursor", () => {
|
|
17
|
-
const { container } = render(FluidCursorAdvanced);
|
|
18
|
-
const canvas = container.querySelector("canvas");
|
|
19
|
-
expect(canvas?.id).not.toBe("fluid");
|
|
20
|
-
});
|
|
21
|
-
it("container has pointer-events-none class (contained mode)", () => {
|
|
22
|
-
const { container } = render(FluidCursorAdvanced);
|
|
23
|
-
const div = container.firstElementChild;
|
|
24
|
-
expect(div?.className).toContain("pointer-events-none");
|
|
25
|
-
});
|
|
26
|
-
it("container has absolute positioning in contained mode", () => {
|
|
27
|
-
const { container } = render(FluidCursorAdvanced);
|
|
28
|
-
const div = container.firstElementChild;
|
|
29
|
-
expect(div?.className).toContain("absolute");
|
|
30
|
-
expect(div?.className).toContain("inset-0");
|
|
31
|
-
});
|
|
32
|
-
it("canvas fills container in contained mode", () => {
|
|
33
|
-
const { container } = render(FluidCursorAdvanced);
|
|
34
|
-
const canvas = container.querySelector("canvas");
|
|
35
|
-
expect(canvas?.className).toContain("h-full");
|
|
36
|
-
expect(canvas?.className).toContain("w-full");
|
|
37
|
-
});
|
|
38
|
-
it("applies custom class names", () => {
|
|
39
|
-
const { container } = render(FluidCursorAdvanced, { props: { class: "my-advanced" } });
|
|
40
|
-
const div = container.firstElementChild;
|
|
41
|
-
expect(div?.className).toContain("my-advanced");
|
|
42
|
-
});
|
|
43
|
-
describe("interaction props", () => {
|
|
44
|
-
it("interactive={false} does not register mouse event listeners", () => {
|
|
45
|
-
const addSpy = vi.spyOn(window, "addEventListener");
|
|
46
|
-
render(FluidCursorAdvanced, { props: { interactive: false } });
|
|
47
|
-
const mousedownCalls = addSpy.mock.calls.filter(([event]) => event === "mousedown");
|
|
48
|
-
expect(mousedownCalls).toHaveLength(0);
|
|
49
|
-
const mousemoveCalls = addSpy.mock.calls.filter(([event]) => event === "mousemove");
|
|
50
|
-
expect(mousemoveCalls).toHaveLength(0);
|
|
51
|
-
addSpy.mockRestore();
|
|
52
|
-
});
|
|
53
|
-
it("mounts without error with autoSplat={true} and splatOnMount={true}", () => {
|
|
54
|
-
const { container } = render(FluidCursorAdvanced, {
|
|
55
|
-
props: { autoSplat: true, splatOnMount: true },
|
|
56
|
-
});
|
|
57
|
-
expect(container.querySelector("canvas")).toBeInTheDocument();
|
|
58
|
-
});
|
|
59
|
-
it("pauseWhenHidden={false} does not instantiate IntersectionObserver", () => {
|
|
60
|
-
const observeSpy = vi.fn();
|
|
61
|
-
const mockObserver = vi.fn(() => ({ observe: observeSpy, disconnect: vi.fn() }));
|
|
62
|
-
vi.stubGlobal("IntersectionObserver", mockObserver);
|
|
63
|
-
render(FluidCursorAdvanced, { props: { pauseWhenHidden: false } });
|
|
64
|
-
expect(mockObserver).not.toHaveBeenCalled();
|
|
65
|
-
vi.unstubAllGlobals();
|
|
66
|
-
});
|
|
67
|
-
});
|
|
68
|
-
describe("color props", () => {
|
|
69
|
-
it("renders without error when fluidColor is provided", () => {
|
|
70
|
-
const { container } = render(FluidCursorAdvanced, { props: { fluidColor: "#6366f1" } });
|
|
71
|
-
expect(container.querySelector("canvas")).toBeInTheDocument();
|
|
72
|
-
});
|
|
73
|
-
it("renders without error when fluidColors palette is provided", () => {
|
|
74
|
-
const { container } = render(FluidCursorAdvanced, {
|
|
75
|
-
props: { fluidColors: ["#6366f1", "#ec4899"] },
|
|
76
|
-
});
|
|
77
|
-
expect(container.querySelector("canvas")).toBeInTheDocument();
|
|
78
|
-
});
|
|
79
|
-
it("warns and falls back when an invalid hex color is passed", () => {
|
|
80
|
-
const warn = vi.spyOn(console, "warn").mockImplementation(() => { });
|
|
81
|
-
render(FluidCursorAdvanced, { props: { backColor: "not-a-color" } });
|
|
82
|
-
expect(warn).toHaveBeenCalledWith(expect.stringContaining("[FluidCursorAdvanced] Invalid hex color"));
|
|
83
|
-
warn.mockRestore();
|
|
84
|
-
});
|
|
85
|
-
});
|
|
86
|
-
});
|
|
File without changes
|