@shipfox/react-ui 0.13.0 → 0.15.0

package/dist/components/command/command.stories.js

@@ -0,0 +1,228 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Icon } from '../icon/index.js';
+import { Popover, PopoverContent, PopoverTrigger } from '../popover/index.js';
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CommandTrigger } from './command.js';
+const meta = {
+    title: 'Components/Command',
+    component: Command,
+    tags: [
+        'autodocs'
+    ]
+};
+export default meta;
+export const Default = {
+    render: ()=>/*#__PURE__*/ _jsxs(Command, {
+            className: "rounded-10 shadow-tooltip max-w-400",
+            children: [
+                /*#__PURE__*/ _jsx(CommandInput, {
+                    placeholder: "Type a command or search..."
+                }),
+                /*#__PURE__*/ _jsxs(CommandList, {
+                    children: [
+                        /*#__PURE__*/ _jsx(CommandEmpty, {
+                            children: "No results found."
+                        }),
+                        /*#__PURE__*/ _jsxs(CommandGroup, {
+                            heading: "Suggestions",
+                            children: [
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "calendar2Line",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Calendar"
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "emotion2Line",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Search Emoji"
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "calculatorLine",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Calculator"
+                                        })
+                                    ]
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx(CommandSeparator, {}),
+                        /*#__PURE__*/ _jsxs(CommandGroup, {
+                            heading: "Settings",
+                            children: [
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "user3Line",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Profile"
+                                        }),
+                                        /*#__PURE__*/ _jsx(CommandShortcut, {
+                                            children: "⌘P"
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "mailLine",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Mail"
+                                        }),
+                                        /*#__PURE__*/ _jsx(CommandShortcut, {
+                                            children: "⌘M"
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ _jsxs(CommandItem, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Icon, {
+                                            name: "settings3Line",
+                                            className: "size-16 mr-8"
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            children: "Settings"
+                                        }),
+                                        /*#__PURE__*/ _jsx(CommandShortcut, {
+                                            children: "⌘S"
+                                        })
+                                    ]
+                                })
+                            ]
+                        })
+                    ]
+                })
+            ]
+        })
+};
+export const Combobox = {
+    render: ()=>{
+        const frameworks = [
+            {
+                value: 'next.js',
+                label: 'Next.js',
+                icon: 'reactjsLine'
+            },
+            {
+                value: 'sveltekit',
+                label: 'SvelteKit',
+                icon: 'svelteLine'
+            },
+            {
+                value: 'nuxt.js',
+                label: 'Nuxt.js',
+                icon: 'vuejsLine'
+            },
+            {
+                value: 'remix',
+                label: 'Remix',
+                icon: 'reactjsLine'
+            },
+            {
+                value: 'astro',
+                label: 'Astro',
+                icon: 'rocketLine'
+            },
+            {
+                value: 'vue',
+                label: 'Vue',
+                icon: 'vuejsLine'
+            },
+            {
+                value: 'react',
+                label: 'React',
+                icon: 'reactjsLine'
+            }
+        ];
+        function ComboboxDemo() {
+            const [open, setOpen] = useState(false);
+            const [value, setValue] = useState('');
+            return /*#__PURE__*/ _jsxs("div", {
+                className: "flex flex-col gap-16",
+                children: [
+                    /*#__PURE__*/ _jsxs(Popover, {
+                        open: open,
+                        onOpenChange: setOpen,
+                        children: [
+                            /*#__PURE__*/ _jsx(PopoverTrigger, {
+                                asChild: true,
+                                children: /*#__PURE__*/ _jsx(CommandTrigger, {
+                                    className: "w-280",
+                                    placeholder: "Select framework...",
+                                    children: value ? frameworks.find((framework)=>framework.value === value)?.label : null
+                                })
+                            }),
+                            /*#__PURE__*/ _jsx(PopoverContent, {
+                                className: "w-280 p-0",
+                                align: "start",
+                                children: /*#__PURE__*/ _jsxs(Command, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(CommandInput, {
+                                            placeholder: "Search framework..."
+                                        }),
+                                        /*#__PURE__*/ _jsxs(CommandList, {
+                                            children: [
+                                                /*#__PURE__*/ _jsx(CommandEmpty, {
+                                                    children: "No framework found."
+                                                }),
+                                                /*#__PURE__*/ _jsx(CommandGroup, {
+                                                    children: frameworks.map((framework)=>/*#__PURE__*/ _jsxs(CommandItem, {
+                                                            value: framework.value,
+                                                            onSelect: (currentValue)=>{
+                                                                setValue(currentValue === value ? '' : currentValue);
+                                                                setOpen(false);
+                                                            },
+                                                            children: [
+                                                                /*#__PURE__*/ _jsx(Icon, {
+                                                                    name: "check",
+                                                                    className: `size-16 mr-8 ${value === framework.value ? 'opacity-100' : 'opacity-0'}`
+                                                                }),
+                                                                /*#__PURE__*/ _jsx(Icon, {
+                                                                    name: framework.icon,
+                                                                    className: "size-16 mr-8"
+                                                                }),
+                                                                framework.label
+                                                            ]
+                                                        }, framework.value))
+                                                })
+                                            ]
+                                        })
+                                    ]
+                                })
+                            })
+                        ]
+                    }),
+                    value && /*#__PURE__*/ _jsxs("p", {
+                        className: "text-sm text-foreground-neutral-muted",
+                        children: [
+                            "Selected: ",
+                            frameworks.find((f)=>f.value === value)?.label
+                        ]
+                    })
+                ]
+            });
+        }
+        return /*#__PURE__*/ _jsx(ComboboxDemo, {});
+    }
+};
+
+//# sourceMappingURL=command.stories.js.map

package/dist/components/command/command.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/command/command.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {useState} from 'react';\nimport {Icon} from '../icon';\nimport {Popover, PopoverContent, PopoverTrigger} from '../popover';\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n  CommandShortcut,\n  CommandTrigger,\n} from './command';\n\nconst meta = {\n  title: 'Components/Command',\n  component: Command,\n  tags: ['autodocs'],\n} satisfies Meta<typeof Command>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n  render: () => (\n    <Command className=\"rounded-10 shadow-tooltip max-w-400\">\n      <CommandInput placeholder=\"Type a command or search...\" />\n      <CommandList>\n        <CommandEmpty>No results found.</CommandEmpty>\n        <CommandGroup heading=\"Suggestions\">\n          <CommandItem>\n            <Icon name=\"calendar2Line\" className=\"size-16 mr-8\" />\n            <span>Calendar</span>\n          </CommandItem>\n          <CommandItem>\n            <Icon name=\"emotion2Line\" className=\"size-16 mr-8\" />\n            <span>Search Emoji</span>\n          </CommandItem>\n          <CommandItem>\n            <Icon name=\"calculatorLine\" className=\"size-16 mr-8\" />\n            <span>Calculator</span>\n          </CommandItem>\n        </CommandGroup>\n        <CommandSeparator />\n        <CommandGroup heading=\"Settings\">\n          <CommandItem>\n            <Icon name=\"user3Line\" className=\"size-16 mr-8\" />\n            <span>Profile</span>\n            <CommandShortcut>⌘P</CommandShortcut>\n          </CommandItem>\n          <CommandItem>\n            <Icon name=\"mailLine\" className=\"size-16 mr-8\" />\n            <span>Mail</span>\n            <CommandShortcut>⌘M</CommandShortcut>\n          </CommandItem>\n          <CommandItem>\n            <Icon name=\"settings3Line\" className=\"size-16 mr-8\" />\n            <span>Settings</span>\n            <CommandShortcut>⌘S</CommandShortcut>\n          </CommandItem>\n        </CommandGroup>\n      </CommandList>\n    </Command>\n  ),\n};\n\nexport const Combobox: Story = {\n  render: () => {\n    const frameworks = [\n      {value: 'next.js', label: 'Next.js', icon: 'reactjsLine' as const},\n      {value: 'sveltekit', label: 'SvelteKit', icon: 'svelteLine' as const},\n      {value: 'nuxt.js', label: 'Nuxt.js', icon: 'vuejsLine' as const},\n      {value: 'remix', label: 'Remix', icon: 'reactjsLine' as const},\n      {value: 'astro', label: 'Astro', icon: 'rocketLine' as const},\n      {value: 'vue', label: 'Vue', icon: 'vuejsLine' as const},\n      {value: 'react', label: 'React', icon: 'reactjsLine' as const},\n    ];\n\n    function ComboboxDemo() {\n      const [open, setOpen] = useState(false);\n      const [value, setValue] = useState('');\n\n      return (\n        <div className=\"flex flex-col gap-16\">\n          <Popover open={open} onOpenChange={setOpen}>\n            <PopoverTrigger asChild>\n              <CommandTrigger className=\"w-280\" placeholder=\"Select framework...\">\n                {value ? frameworks.find((framework) => framework.value === value)?.label : null}\n              </CommandTrigger>\n            </PopoverTrigger>\n            <PopoverContent className=\"w-280 p-0\" align=\"start\">\n              <Command>\n                <CommandInput placeholder=\"Search framework...\" />\n                <CommandList>\n                  <CommandEmpty>No framework found.</CommandEmpty>\n                  <CommandGroup>\n                    {frameworks.map((framework) => (\n                      <CommandItem\n                        key={framework.value}\n                        value={framework.value}\n                        onSelect={(currentValue) => {\n                          setValue(currentValue === value ? '' : currentValue);\n                          setOpen(false);\n                        }}\n                      >\n                        <Icon\n                          name=\"check\"\n                          className={`size-16 mr-8 ${value === framework.value ? 'opacity-100' : 'opacity-0'}`}\n                        />\n                        <Icon name={framework.icon} className=\"size-16 mr-8\" />\n                        {framework.label}\n                      </CommandItem>\n                    ))}\n                  </CommandGroup>\n                </CommandList>\n              </Command>\n            </PopoverContent>\n          </Popover>\n          {value && (\n            <p className=\"text-sm text-foreground-neutral-muted\">\n              Selected: {frameworks.find((f) => f.value === value)?.label}\n            </p>\n          )}\n        </div>\n      );\n    }\n\n    return <ComboboxDemo />;\n  },\n};\n"],"names":["useState","Icon","Popover","PopoverContent","PopoverTrigger","Command","CommandEmpty","CommandGroup","CommandInput","CommandItem","CommandList","CommandSeparator","CommandShortcut","CommandTrigger","meta","title","component","tags","Default","render","className","placeholder","heading","name","span","Combobox","frameworks","value","label","icon","ComboboxDemo","open","setOpen","setValue","div","onOpenChange","asChild","find","framework","align","map","onSelect","currentValue","p","f"],"mappings":"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"}

package/dist/components/command/index.d.ts

@@ -0,0 +1,2 @@
+export * from './command';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/command/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/command/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}

package/dist/components/command/index.js

@@ -0,0 +1,3 @@
+export * from './command.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/command/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/command/index.ts"],"sourcesContent":["export * from './command';\n"],"names":[],"mappings":"AAAA,cAAc,YAAY"}

package/dist/components/confetti/confetti.d.ts

@@ -0,0 +1,21 @@
+import type { GlobalOptions as ConfettiGlobalOptions, Options as ConfettiOptions } from 'canvas-confetti';
+import type { ComponentProps, ReactNode } from 'react';
+type ConfettiApi = {
+    fire: (options?: ConfettiOptions) => Promise<void>;
+};
+export type ConfettiRef = ConfettiApi | null;
+export type ConfettiProps = ComponentProps<'canvas'> & {
+    options?: ConfettiOptions;
+    globalOptions?: ConfettiGlobalOptions;
+    manualstart?: boolean;
+    children?: ReactNode;
+};
+export declare const Confetti: import("react").ForwardRefExoticComponent<Omit<ConfettiProps, "ref"> & import("react").RefAttributes<ConfettiRef>>;
+export type ConfettiButtonProps = ComponentProps<'button'> & {
+    options?: ConfettiOptions & ConfettiGlobalOptions & {
+        canvas?: HTMLCanvasElement;
+    };
+};
+export declare function ConfettiButton({ options, onClick, children, ...props }: ConfettiButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=confetti.d.ts.map

package/dist/components/confetti/confetti.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"confetti.d.ts","sourceRoot":"","sources":["../../../src/components/confetti/confetti.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,IAAI,qBAAqB,EAEtC,OAAO,IAAI,eAAe,EAC3B,MAAM,iBAAiB,CAAC;AAGzB,OAAO,KAAK,EAAC,cAAc,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAWrD,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACpD,CAAC;AAIF,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,IAAI,CAAC;AAE7C,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACrD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AA4EF,eAAO,MAAM,QAAQ,oHAAoB,CAAC;AAE1C,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IAC3D,OAAO,CAAC,EAAE,eAAe,GAAG,qBAAqB,GAAG;QAAC,MAAM,CAAC,EAAE,iBAAiB,CAAA;KAAC,CAAC;CAClF,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,mBAAmB,2CA0BzF"}

package/dist/components/confetti/confetti.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import confetti from 'canvas-confetti';
+import { Button } from '../../components/button/index.js';
+import { createContext, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
+const ConfettiContext = /*#__PURE__*/ createContext(null);
+const ConfettiComponent = /*#__PURE__*/ forwardRef(({ options, globalOptions = {
+    resize: true,
+    useWorker: true
+}, manualstart = false, children, ...props }, ref)=>{
+    const instanceRef = useRef(null);
+    const hasAutoFiredRef = useRef(false);
+    const optionsRef = useRef(options);
+    useEffect(()=>{
+        optionsRef.current = options;
+    }, [
+        options
+    ]);
+    const canvasRef = useCallback((node)=>{
+        if (node !== null) {
+            if (instanceRef.current) {
+                instanceRef.current.reset();
+            }
+            instanceRef.current = confetti.create(node, {
+                ...globalOptions
+            });
+        } else {
+            if (instanceRef.current) {
+                instanceRef.current.reset();
+                instanceRef.current = null;
+            }
+        }
+    }, [
+        globalOptions
+    ]);
+    const fire = useCallback(async (opts = {})=>{
+        try {
+            await instanceRef.current?.({
+                ...optionsRef.current,
+                ...opts
+            });
+        } catch (error) {
+            // biome-ignore lint/suspicious/noConsole: we need to log the error
+            console.error('Confetti error:', error);
+        }
+    }, []);
+    const api = useMemo(()=>({
+            fire
+        }), [
+        fire
+    ]);
+    useImperativeHandle(ref, ()=>api, [
+        api
+    ]);
+    useEffect(()=>{
+        if (!manualstart && !hasAutoFiredRef.current && instanceRef.current) {
+            hasAutoFiredRef.current = true;
+            void instanceRef.current(optionsRef.current);
+        }
+    }, [
+        manualstart
+    ]);
+    return /*#__PURE__*/ _jsxs(ConfettiContext.Provider, {
+        value: api,
+        children: [
+            /*#__PURE__*/ _jsx("canvas", {
+                ref: canvasRef,
+                ...props
+            }),
+            children
+        ]
+    });
+});
+ConfettiComponent.displayName = 'Confetti';
+export const Confetti = ConfettiComponent;
+export function ConfettiButton({ options, onClick, children, ...props }) {
+    const handleClick = async (event)=>{
+        try {
+            const rect = event.currentTarget.getBoundingClientRect();
+            const x = rect.left + rect.width / 2;
+            const y = rect.top + rect.height / 2;
+            await confetti({
+                ...options,
+                origin: {
+                    x: x / window.innerWidth,
+                    y: y / window.innerHeight
+                }
+            });
+        } catch (error) {
+            // biome-ignore lint/suspicious/noConsole: we need to log the error
+            console.error('Confetti button error:', error);
+        }
+        onClick?.(event);
+    };
+    return /*#__PURE__*/ _jsx(Button, {
+        onClick: handleClick,
+        ...props,
+        children: children
+    });
+}
+
+//# sourceMappingURL=confetti.js.map

package/dist/components/confetti/confetti.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/confetti/confetti.tsx"],"sourcesContent":["import type {\n  GlobalOptions as ConfettiGlobalOptions,\n  CreateTypes as ConfettiInstance,\n  Options as ConfettiOptions,\n} from 'canvas-confetti';\nimport confetti from 'canvas-confetti';\nimport {Button} from 'components/button';\nimport type {ComponentProps, ReactNode} from 'react';\nimport {\n  createContext,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react';\n\ntype ConfettiApi = {\n  fire: (options?: ConfettiOptions) => Promise<void>;\n};\n\nconst ConfettiContext = createContext<ConfettiApi | null>(null);\n\nexport type ConfettiRef = ConfettiApi | null;\n\nexport type ConfettiProps = ComponentProps<'canvas'> & {\n  options?: ConfettiOptions;\n  globalOptions?: ConfettiGlobalOptions;\n  manualstart?: boolean;\n  children?: ReactNode;\n};\n\nconst ConfettiComponent = forwardRef<ConfettiRef, ConfettiProps>(\n  (\n    {\n      options,\n      globalOptions = {resize: true, useWorker: true},\n      manualstart = false,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const instanceRef = useRef<ConfettiInstance | null>(null);\n    const hasAutoFiredRef = useRef<boolean>(false);\n    const optionsRef = useRef<ConfettiOptions | undefined>(options);\n\n    useEffect(() => {\n      optionsRef.current = options;\n    }, [options]);\n\n    const canvasRef = useCallback(\n      (node: HTMLCanvasElement | null) => {\n        if (node !== null) {\n          if (instanceRef.current) {\n            instanceRef.current.reset();\n          }\n          instanceRef.current = confetti.create(node, {\n            ...globalOptions,\n          });\n        } else {\n          if (instanceRef.current) {\n            instanceRef.current.reset();\n            instanceRef.current = null;\n          }\n        }\n      },\n      [globalOptions],\n    );\n\n    const fire = useCallback(async (opts: ConfettiOptions = {}) => {\n      try {\n        await instanceRef.current?.({...optionsRef.current, ...opts});\n      } catch (error) {\n        // biome-ignore lint/suspicious/noConsole: we need to log the error\n        console.error('Confetti error:', error);\n      }\n    }, []);\n\n    const api = useMemo<ConfettiApi>(\n      () => ({\n        fire,\n      }),\n      [fire],\n    );\n\n    useImperativeHandle(ref, () => api, [api]);\n\n    useEffect(() => {\n      if (!manualstart && !hasAutoFiredRef.current && instanceRef.current) {\n        hasAutoFiredRef.current = true;\n        void instanceRef.current(optionsRef.current);\n      }\n    }, [manualstart]);\n\n    return (\n      <ConfettiContext.Provider value={api}>\n        <canvas ref={canvasRef} {...props} />\n        {children}\n      </ConfettiContext.Provider>\n    );\n  },\n);\n\nConfettiComponent.displayName = 'Confetti';\n\nexport const Confetti = ConfettiComponent;\n\nexport type ConfettiButtonProps = ComponentProps<'button'> & {\n  options?: ConfettiOptions & ConfettiGlobalOptions & {canvas?: HTMLCanvasElement};\n};\n\nexport function ConfettiButton({options, onClick, children, ...props}: ConfettiButtonProps) {\n  const handleClick: ComponentProps<'button'>['onClick'] = async (event) => {\n    try {\n      const rect = event.currentTarget.getBoundingClientRect();\n      const x = rect.left + rect.width / 2;\n      const y = rect.top + rect.height / 2;\n      await confetti({\n        ...options,\n        origin: {\n          x: x / window.innerWidth,\n          y: y / window.innerHeight,\n        },\n      });\n    } catch (error) {\n      // biome-ignore lint/suspicious/noConsole: we need to log the error\n      console.error('Confetti button error:', error);\n    }\n\n    onClick?.(event);\n  };\n\n  return (\n    <Button onClick={handleClick} {...props}>\n      {children}\n    </Button>\n  );\n}\n"],"names":["confetti","Button","createContext","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","ConfettiContext","ConfettiComponent","options","globalOptions","resize","useWorker","manualstart","children","props","ref","instanceRef","hasAutoFiredRef","optionsRef","current","canvasRef","node","reset","create","fire","opts","error","console","api","Provider","value","canvas","displayName","Confetti","ConfettiButton","onClick","handleClick","event","rect","currentTarget","getBoundingClientRect","x","left","width","y","top","height","origin","window","innerWidth","innerHeight"],"mappings":";AAKA,OAAOA,cAAc,kBAAkB;AACvC,SAAQC,MAAM,QAAO,oBAAoB;AAEzC,SACEC,aAAa,EACbC,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,mBAAmB,EACnBC,OAAO,EACPC,MAAM,QACD,QAAQ;AAMf,MAAMC,gCAAkBP,cAAkC;AAW1D,MAAMQ,kCAAoBP,WACxB,CACE,EACEQ,OAAO,EACPC,gBAAgB;IAACC,QAAQ;IAAMC,WAAW;AAAI,CAAC,EAC/CC,cAAc,KAAK,EACnBC,QAAQ,EACR,GAAGC,OACJ,EACDC;IAEA,MAAMC,cAAcX,OAAgC;IACpD,MAAMY,kBAAkBZ,OAAgB;IACxC,MAAMa,aAAab,OAAoCG;IAEvDN,UAAU;QACRgB,WAAWC,OAAO,GAAGX;IACvB,GAAG;QAACA;KAAQ;IAEZ,MAAMY,YAAYnB,YAChB,CAACoB;QACC,IAAIA,SAAS,MAAM;YACjB,IAAIL,YAAYG,OAAO,EAAE;gBACvBH,YAAYG,OAAO,CAACG,KAAK;YAC3B;YACAN,YAAYG,OAAO,GAAGtB,SAAS0B,MAAM,CAACF,MAAM;gBAC1C,GAAGZ,aAAa;YAClB;QACF,OAAO;YACL,IAAIO,YAAYG,OAAO,EAAE;gBACvBH,YAAYG,OAAO,CAACG,KAAK;gBACzBN,YAAYG,OAAO,GAAG;YACxB;QACF;IACF,GACA;QAACV;KAAc;IAGjB,MAAMe,OAAOvB,YAAY,OAAOwB,OAAwB,CAAC,CAAC;QACxD,IAAI;YACF,MAAMT,YAAYG,OAAO,GAAG;gBAAC,GAAGD,WAAWC,OAAO;gBAAE,GAAGM,IAAI;YAAA;QAC7D,EAAE,OAAOC,OAAO;YACd,mEAAmE;YACnEC,QAAQD,KAAK,CAAC,mBAAmBA;QACnC;IACF,GAAG,EAAE;IAEL,MAAME,MAAMxB,QACV,IAAO,CAAA;YACLoB;QACF,CAAA,GACA;QAACA;KAAK;IAGRrB,oBAAoBY,KAAK,IAAMa,KAAK;QAACA;KAAI;IAEzC1B,UAAU;QACR,IAAI,CAACU,eAAe,CAACK,gBAAgBE,OAAO,IAAIH,YAAYG,OAAO,EAAE;YACnEF,gBAAgBE,OAAO,GAAG;YAC1B,KAAKH,YAAYG,OAAO,CAACD,WAAWC,OAAO;QAC7C;IACF,GAAG;QAACP;KAAY;IAEhB,qBACE,MAACN,gBAAgBuB,QAAQ;QAACC,OAAOF;;0BAC/B,KAACG;gBAAOhB,KAAKK;gBAAY,GAAGN,KAAK;;YAChCD;;;AAGP;AAGFN,kBAAkByB,WAAW,GAAG;AAEhC,OAAO,MAAMC,WAAW1B,kBAAkB;AAM1C,OAAO,SAAS2B,eAAe,EAAC1B,OAAO,EAAE2B,OAAO,EAAEtB,QAAQ,EAAE,GAAGC,OAA2B;IACxF,MAAMsB,cAAmD,OAAOC;QAC9D,IAAI;YACF,MAAMC,OAAOD,MAAME,aAAa,CAACC,qBAAqB;YACtD,MAAMC,IAAIH,KAAKI,IAAI,GAAGJ,KAAKK,KAAK,GAAG;YACnC,MAAMC,IAAIN,KAAKO,GAAG,GAAGP,KAAKQ,MAAM,GAAG;YACnC,MAAMjD,SAAS;gBACb,GAAGW,OAAO;gBACVuC,QAAQ;oBACNN,GAAGA,IAAIO,OAAOC,UAAU;oBACxBL,GAAGA,IAAII,OAAOE,WAAW;gBAC3B;YACF;QACF,EAAE,OAAOxB,OAAO;YACd,mEAAmE;YACnEC,QAAQD,KAAK,CAAC,0BAA0BA;QAC1C;QAEAS,UAAUE;IACZ;IAEA,qBACE,KAACvC;QAAOqC,SAASC;QAAc,GAAGtB,KAAK;kBACpCD;;AAGP"}

package/dist/components/confetti/confetti.stories.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Confetti, ConfettiButton } from './confetti.js';
+const meta = {
+    title: 'Components/Confetti',
+    component: Confetti,
+    tags: [
+        'autodocs'
+    ],
+    parameters: {
+        layout: 'centered'
+    }
+};
+export default meta;
+export const Default = {
+    render: ()=>/*#__PURE__*/ _jsx("div", {
+            className: "flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base",
+            children: /*#__PURE__*/ _jsx(ConfettiButton, {
+                children: "Click for Confetti!"
+            })
+        })
+};
+export const WithOptions = {
+    render: ()=>/*#__PURE__*/ _jsx("div", {
+            className: "flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base",
+            children: /*#__PURE__*/ _jsx(ConfettiButton, {
+                options: {
+                    particleCount: 150,
+                    spread: 60,
+                    colors: [
+                        '#ff6b6b',
+                        '#4ecdc4',
+                        '#ffe66d',
+                        '#95e1d3'
+                    ]
+                },
+                children: "Custom Confetti Button"
+            })
+        })
+};
+
+//# sourceMappingURL=confetti.stories.js.map

package/dist/components/confetti/confetti.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/confetti/confetti.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Confetti, ConfettiButton} from './confetti';\n\nconst meta = {\n  title: 'Components/Confetti',\n  component: Confetti,\n  tags: ['autodocs'],\n  parameters: {\n    layout: 'centered',\n  },\n} satisfies Meta<typeof Confetti>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n  render: () => (\n    <div className=\"flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base\">\n      <ConfettiButton>Click for Confetti!</ConfettiButton>\n    </div>\n  ),\n};\n\nexport const WithOptions: Story = {\n  render: () => (\n    <div className=\"flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base\">\n      <ConfettiButton\n        options={{\n          particleCount: 150,\n          spread: 60,\n          colors: ['#ff6b6b', '#4ecdc4', '#ffe66d', '#95e1d3'],\n        }}\n      >\n        Custom Confetti Button\n      </ConfettiButton>\n    </div>\n  ),\n};\n"],"names":["Confetti","ConfettiButton","meta","title","component","tags","parameters","layout","Default","render","div","className","WithOptions","options","particleCount","spread","colors"],"mappings":";AACA,SAAQA,QAAQ,EAAEC,cAAc,QAAO,aAAa;AAEpD,MAAMC,OAAO;IACXC,OAAO;IACPC,WAAWJ;IACXK,MAAM;QAAC;KAAW;IAClBC,YAAY;QACVC,QAAQ;IACV;AACF;AAEA,eAAeL,KAAK;AAGpB,OAAO,MAAMM,UAAiB;IAC5BC,QAAQ,kBACN,KAACC;YAAIC,WAAU;sBACb,cAAA,KAACV;0BAAe;;;AAGtB,EAAE;AAEF,OAAO,MAAMW,cAAqB;IAChCH,QAAQ,kBACN,KAACC;YAAIC,WAAU;sBACb,cAAA,KAACV;gBACCY,SAAS;oBACPC,eAAe;oBACfC,QAAQ;oBACRC,QAAQ;wBAAC;wBAAW;wBAAW;wBAAW;qBAAU;gBACtD;0BACD;;;AAKP,EAAE"}

package/dist/components/confetti/index.d.ts

@@ -0,0 +1,2 @@
+export * from './confetti';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/confetti/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/confetti/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/components/confetti/index.js

@@ -0,0 +1,3 @@
+export * from './confetti.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/confetti/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/confetti/index.ts"],"sourcesContent":["export * from './confetti';\n"],"names":[],"mappings":"AAAA,cAAc,aAAa"}

package/dist/components/dashboard/components/analytics-content.d.ts

@@ -0,0 +1,2 @@
+export declare function AnalyticsContent(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=analytics-content.d.ts.map

package/dist/components/dashboard/components/analytics-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"analytics-content.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/analytics-content.tsx"],"names":[],"mappings":"AAIA,wBAAgB,gBAAgB,4CAiG/B"}