@forgedevstack/bear 1.0.7 → 1.0.9

package/dist/components/CodeEditor/CodeEditor.js

@@ -0,0 +1,250 @@
+import { jsxs as L, jsx as d } from "react/jsx-runtime";
+import { useRef as de, useState as x, useMemo as N, useCallback as b } from "react";
+import { cn as be } from "../../utils/cn.js";
+import { DARK_THEME as pe, LIGHT_THEME as fe, DEFAULT_TAB_SIZE as ue, AUTO_CLOSE_PAIRS as G, LINE_HEIGHT as D, DEFAULT_FONT_SIZE as me, DEFAULT_FONT_FAMILY as ke, GUTTER_WIDTH as Ee } from "./CodeEditor.const.js";
+import { tokenizeLine as ge } from "./CodeEditor.utils.js";
+const Te = ({
+  value: s,
+  onChange: r,
+  language: A = "typescript",
+  theme: F = "dark",
+  customTheme: p,
+  placeholder: J = "Start typing...",
+  showLineNumbers: T = !0,
+  showGutter: h = !0,
+  highlightActiveLine: O = !0,
+  readOnly: f = !1,
+  fontSize: _ = me,
+  fontFamily: H = ke,
+  tabSize: u = ue,
+  autoIndent: I = !0,
+  autoCloseBrackets: R = !0,
+  wordWrap: E = !1,
+  minHeight: U,
+  maxHeight: q,
+  height: K,
+  className: Q,
+  style: X,
+  testId: W,
+  onFocus: g,
+  onBlur: v
+}) => {
+  const y = de(null), [M, V] = x(!1), [S, z] = x(0), [$, C] = x(0), [ee, te] = x(0), B = F === "dark" ? pe : fe, n = N(
+    () => ({
+      ...B,
+      ...p,
+      tokens: { ...B.tokens, ...p == null ? void 0 : p.tokens }
+    }),
+    [F, p]
+  ), w = N(() => s.split(`
+`), [s]), re = N(
+    () => w.map((e) => ge(e, A)),
+    [w, A]
+  ), j = b(() => {
+    const e = y.current;
+    if (!e) return;
+    const t = e.value.substring(0, e.selectionStart);
+    z(t.split(`
+`).length - 1);
+  }, []), se = b(
+    (e) => {
+      var Y;
+      if (f) return;
+      const t = y.current;
+      if (!t) return;
+      const { selectionStart: i, selectionEnd: o } = t;
+      if (e.key === "Tab") {
+        e.preventDefault();
+        const a = " ".repeat(u), c = s.substring(0, i), m = s.substring(o), l = c + a + m;
+        r == null || r(l), requestAnimationFrame(() => {
+          t.selectionStart = t.selectionEnd = i + u;
+        });
+        return;
+      }
+      if (e.key === "Enter" && I) {
+        e.preventDefault();
+        const a = s.substring(0, i), c = s.substring(o), l = ((Y = (a.split(`
+`).pop() ?? "").match(/^\s*/)) == null ? void 0 : Y[0]) ?? "", k = a.trim().slice(-1), Z = ["{", "(", "[", ":"].includes(k) ? " ".repeat(u) : "", le = a + `
+` + l + Z + c;
+        r == null || r(le), requestAnimationFrame(() => {
+          const ce = i + 1 + l.length + Z.length;
+          t.selectionStart = t.selectionEnd = ce;
+        });
+        return;
+      }
+      if (R && G[e.key]) {
+        e.preventDefault();
+        const a = G[e.key], c = s.substring(0, i), m = s.substring(i, o), l = s.substring(o);
+        if (m) {
+          const k = c + e.key + m + a + l;
+          r == null || r(k), requestAnimationFrame(() => {
+            t.selectionStart = i + 1, t.selectionEnd = o + 1;
+          });
+        } else {
+          const k = c + e.key + a + l;
+          r == null || r(k), requestAnimationFrame(() => {
+            t.selectionStart = t.selectionEnd = i + 1;
+          });
+        }
+        return;
+      }
+    },
+    [s, r, f, u, I, R]
+  ), ne = b(
+    (e) => {
+      f || r == null || r(e.target.value);
+    },
+    [r, f]
+  ), ie = b(() => {
+    const e = y.current;
+    e && (C(e.scrollTop), te(e.scrollLeft));
+  }, []), ae = b(() => {
+    V(!0), g == null || g();
+  }, [g]), oe = b(() => {
+    V(!1), v == null || v();
+  }, [v]), P = _ * D;
+  return /* @__PURE__ */ L(
+    "div",
+    {
+      className: be(
+        "bear-relative bear-overflow-hidden bear-rounded-lg bear-font-mono",
+        "bear-border",
+        M ? "bear-ring-2 bear-ring-offset-1" : "",
+        Q
+      ),
+      style: {
+        background: n.background,
+        borderColor: n.gutterBorder,
+        fontFamily: H,
+        fontSize: _,
+        lineHeight: D,
+        minHeight: U,
+        maxHeight: q,
+        height: K,
+        "--bear-editor-ring": "var(--bear-primary-500)",
+        ...X
+      },
+      "data-testid": W,
+      children: [
+        /* @__PURE__ */ L("div", { className: "bear-relative bear-flex bear-h-full", children: [
+          h && T && /* @__PURE__ */ d(
+            "div",
+            {
+              className: "bear-flex-shrink-0 bear-select-none bear-text-right bear-pr-3 bear-overflow-hidden",
+              style: {
+                width: Ee,
+                background: n.gutterBackground,
+                borderRight: `1px solid ${n.gutterBorder}`,
+                paddingTop: 12,
+                transform: `translateY(-${$}px)`
+              },
+              "aria-hidden": "true",
+              children: w.map((e, t) => /* @__PURE__ */ d(
+                "div",
+                {
+                  style: {
+                    height: P,
+                    color: t === S ? n.lineNumberActive : n.lineNumber,
+                    fontWeight: t === S ? 600 : 400
+                  },
+                  children: t + 1
+                },
+                t
+              ))
+            }
+          ),
+          /* @__PURE__ */ L("div", { className: "bear-relative bear-flex-1 bear-overflow-hidden", children: [
+            /* @__PURE__ */ d(
+              "div",
+              {
+                className: "bear-absolute bear-inset-0 bear-pointer-events-none bear-overflow-hidden",
+                style: {
+                  padding: 12,
+                  paddingLeft: h && !T ? 12 : 16,
+                  transform: `translate(-${ee}px, -${$}px)`,
+                  whiteSpace: E ? "pre-wrap" : "pre",
+                  wordBreak: E ? "break-all" : "normal"
+                },
+                "aria-hidden": "true",
+                children: re.map((e, t) => /* @__PURE__ */ L(
+                  "div",
+                  {
+                    style: {
+                      height: P,
+                      background: O && t === S && M ? n.selection : "transparent"
+                    },
+                    children: [
+                      e.map((i, o) => /* @__PURE__ */ d(
+                        "span",
+                        {
+                          style: {
+                            color: n.tokens[i.type] ?? n.foreground
+                          },
+                          children: i.value
+                        },
+                        o
+                      )),
+                      e.length === 0 && " "
+                    ]
+                  },
+                  t
+                ))
+              }
+            ),
+            /* @__PURE__ */ d(
+              "textarea",
+              {
+                ref: y,
+                value: s,
+                onChange: ne,
+                onKeyDown: se,
+                onScroll: ie,
+                onFocus: ae,
+                onBlur: oe,
+                onClick: j,
+                onKeyUp: j,
+                readOnly: f,
+                placeholder: s ? void 0 : J,
+                spellCheck: !1,
+                autoComplete: "off",
+                autoCorrect: "off",
+                autoCapitalize: "off",
+                className: "bear-w-full bear-h-full bear-resize-none bear-outline-none",
+                style: {
+                  padding: 12,
+                  paddingLeft: h && !T ? 12 : 16,
+                  background: "transparent",
+                  color: "transparent",
+                  caretColor: n.cursor,
+                  fontFamily: H,
+                  fontSize: _,
+                  lineHeight: D,
+                  tabSize: u,
+                  whiteSpace: E ? "pre-wrap" : "pre",
+                  wordBreak: E ? "break-all" : "normal",
+                  minHeight: U ?? 100,
+                  maxHeight: q,
+                  height: K ?? "auto"
+                }
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ d(
+          "div",
+          {
+            className: "bear-absolute bear-bottom-2 bear-right-3 bear-text-xs bear-font-medium bear-px-2 bear-py-0.5 bear-rounded bear-select-none",
+            style: {
+              color: n.lineNumber,
+              background: n.gutterBackground
+            },
+            children: A
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  Te as CodeEditor
+};

package/dist/components/CodeEditor/CodeEditor.types.d.ts

@@ -0,0 +1,80 @@
+import { CSSProperties } from 'react';
+/**
+ * Supported programming languages
+ */
+export type CodeEditorLanguage = 'javascript' | 'typescript' | 'jsx' | 'tsx' | 'html' | 'css' | 'json' | 'python' | 'markdown' | 'sql' | 'shell' | 'yaml' | 'xml' | 'plaintext';
+/**
+ * Syntax token type for highlighting
+ */
+export type TokenType = 'keyword' | 'string' | 'number' | 'comment' | 'operator' | 'punctuation' | 'function' | 'variable' | 'tag' | 'attribute' | 'property' | 'builtin' | 'regex' | 'boolean' | 'null' | 'type' | 'default';
+/**
+ * Token from syntax analysis
+ */
+export interface SyntaxToken {
+    type: TokenType;
+    value: string;
+}
+/**
+ * Theme colors for the editor
+ */
+export interface CodeEditorTheme {
+    background: string;
+    foreground: string;
+    cursor: string;
+    selection: string;
+    lineNumber: string;
+    lineNumberActive: string;
+    gutterBackground: string;
+    gutterBorder: string;
+    tokens: Partial<Record<TokenType, string>>;
+}
+export interface CodeEditorProps {
+    /** Current value */
+    value: string;
+    /** Called on value change */
+    onChange?: (value: string) => void;
+    /** Programming language for syntax highlighting */
+    language?: CodeEditorLanguage;
+    /** Editor theme ('dark' | 'light') */
+    theme?: 'dark' | 'light';
+    /** Custom theme overrides */
+    customTheme?: Partial<CodeEditorTheme>;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Show line numbers */
+    showLineNumbers?: boolean;
+    /** Show gutter (line number area) */
+    showGutter?: boolean;
+    /** Highlight active line */
+    highlightActiveLine?: boolean;
+    /** Read-only mode */
+    readOnly?: boolean;
+    /** Font size in px */
+    fontSize?: number;
+    /** Font family */
+    fontFamily?: string;
+    /** Tab size (spaces) */
+    tabSize?: number;
+    /** Auto-indent on new line */
+    autoIndent?: boolean;
+    /** Auto-close brackets */
+    autoCloseBrackets?: boolean;
+    /** Word wrap */
+    wordWrap?: boolean;
+    /** Min height */
+    minHeight?: string | number;
+    /** Max height */
+    maxHeight?: string | number;
+    /** Height */
+    height?: string | number;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Test ID */
+    testId?: string;
+    /** Called on focus */
+    onFocus?: () => void;
+    /** Called on blur */
+    onBlur?: () => void;
+}

package/dist/components/CodeEditor/CodeEditor.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./CodeEditor.const.cjs"),u=(e,f)=>{if(f==="plaintext"||f==="markdown")return[{type:"default",value:e}];const r=[],h=i.LANGUAGE_KEYWORDS[f]??[];let t=0;const c=(s,o)=>{o&&r.push({type:s,value:o})};for(;t<e.length;){if(e[t]==="/"&&e[t+1]==="/"){c("comment",e.slice(t));break}if(e[t]==="/"&&e[t+1]==="*"){const s=e.indexOf("*/",t+2),o=s===-1?e.slice(t):e.slice(t,s+2);c("comment",o),t+=o.length;continue}if(e[t]==="#"&&(f==="python"||f==="shell"||f==="yaml")){c("comment",e.slice(t));break}if(e[t]==='"'||e[t]==="'"||e[t]==="`"){const s=e[t];let o=t+1;for(;o<e.length&&e[o]!==s;)e[o]==="\\"&&o++,o++;c("string",e.slice(t,o+1)),t=o+1;continue}if(/[0-9]/.test(e[t])&&(t===0||/[^a-zA-Z_$]/.test(e[t-1]))){let s=t;for(;s<e.length&&/[0-9.xXa-fA-F_eEn]/.test(e[s]);)s++;c("number",e.slice(t,s)),t=s;continue}if(/[a-zA-Z_$]/.test(e[t])){let s=t;for(;s<e.length&&/[a-zA-Z0-9_$]/.test(e[s]);)s++;const o=e.slice(t,s);o==="true"||o==="false"?c("boolean",o):o==="null"||o==="undefined"||o==="None"||o==="NaN"?c("null",o):h.includes(o)?c("keyword",o):i.BUILTIN_FUNCTIONS.includes(o)?c("builtin",o):s<e.length&&e[s]==="("?c("function",o):t>0&&e[t-1]==="."?c("property",o):c("variable",o),t=s;continue}if(e[t]==="<"&&(f==="html"||f==="jsx"||f==="tsx"||f==="xml")){e[t+1]==="/"?(c("tag","</"),t+=2):(c("tag","<"),t+=1);continue}if(e[t]===">"&&(f==="html"||f==="jsx"||f==="tsx"||f==="xml")){c("tag",">"),t+=1;continue}if(/[+\-*/%=!<>&|^~?:]/.test(e[t])){let s=t;for(;s<e.length&&/[+\-*/%=!<>&|^~?:]/.test(e[s]);)s++;c("operator",e.slice(t,s)),t=s;continue}if(/[(){}[\],;.]/.test(e[t])){c("punctuation",e[t]),t++;continue}if(/\s/.test(e[t])){let s=t;for(;s<e.length&&/\s/.test(e[s]);)s++;c("default",e.slice(t,s)),t=s;continue}c("default",e[t]),t++}return r};exports.tokenizeLine=u;

package/dist/components/CodeEditor/CodeEditor.utils.d.ts

@@ -0,0 +1,6 @@
+import { CodeEditorLanguage, SyntaxToken } from './CodeEditor.types';
+/**
+ * Simple tokenizer for syntax highlighting
+ * Produces tokens for a single line of code
+ */
+export declare const tokenizeLine: (line: string, language: CodeEditorLanguage) => SyntaxToken[];

package/dist/components/CodeEditor/CodeEditor.utils.js

@@ -0,0 +1,75 @@
+import { LANGUAGE_KEYWORDS as i, BUILTIN_FUNCTIONS as m } from "./CodeEditor.const.js";
+const d = (s, f) => {
+  if (f === "plaintext" || f === "markdown")
+    return [{ type: "default", value: s }];
+  const r = [], h = i[f] ?? [];
+  let t = 0;
+  const c = (e, o) => {
+    o && r.push({ type: e, value: o });
+  };
+  for (; t < s.length; ) {
+    if (s[t] === "/" && s[t + 1] === "/") {
+      c("comment", s.slice(t));
+      break;
+    }
+    if (s[t] === "/" && s[t + 1] === "*") {
+      const e = s.indexOf("*/", t + 2), o = e === -1 ? s.slice(t) : s.slice(t, e + 2);
+      c("comment", o), t += o.length;
+      continue;
+    }
+    if (s[t] === "#" && (f === "python" || f === "shell" || f === "yaml")) {
+      c("comment", s.slice(t));
+      break;
+    }
+    if (s[t] === '"' || s[t] === "'" || s[t] === "`") {
+      const e = s[t];
+      let o = t + 1;
+      for (; o < s.length && s[o] !== e; )
+        s[o] === "\\" && o++, o++;
+      c("string", s.slice(t, o + 1)), t = o + 1;
+      continue;
+    }
+    if (/[0-9]/.test(s[t]) && (t === 0 || /[^a-zA-Z_$]/.test(s[t - 1]))) {
+      let e = t;
+      for (; e < s.length && /[0-9.xXa-fA-F_eEn]/.test(s[e]); ) e++;
+      c("number", s.slice(t, e)), t = e;
+      continue;
+    }
+    if (/[a-zA-Z_$]/.test(s[t])) {
+      let e = t;
+      for (; e < s.length && /[a-zA-Z0-9_$]/.test(s[e]); ) e++;
+      const o = s.slice(t, e);
+      o === "true" || o === "false" ? c("boolean", o) : o === "null" || o === "undefined" || o === "None" || o === "NaN" ? c("null", o) : h.includes(o) ? c("keyword", o) : m.includes(o) ? c("builtin", o) : e < s.length && s[e] === "(" ? c("function", o) : t > 0 && s[t - 1] === "." ? c("property", o) : c("variable", o), t = e;
+      continue;
+    }
+    if (s[t] === "<" && (f === "html" || f === "jsx" || f === "tsx" || f === "xml")) {
+      s[t + 1] === "/" ? (c("tag", "</"), t += 2) : (c("tag", "<"), t += 1);
+      continue;
+    }
+    if (s[t] === ">" && (f === "html" || f === "jsx" || f === "tsx" || f === "xml")) {
+      c("tag", ">"), t += 1;
+      continue;
+    }
+    if (/[+\-*/%=!<>&|^~?:]/.test(s[t])) {
+      let e = t;
+      for (; e < s.length && /[+\-*/%=!<>&|^~?:]/.test(s[e]); ) e++;
+      c("operator", s.slice(t, e)), t = e;
+      continue;
+    }
+    if (/[(){}[\],;.]/.test(s[t])) {
+      c("punctuation", s[t]), t++;
+      continue;
+    }
+    if (/\s/.test(s[t])) {
+      let e = t;
+      for (; e < s.length && /\s/.test(s[e]); ) e++;
+      c("default", s.slice(t, e)), t = e;
+      continue;
+    }
+    c("default", s[t]), t++;
+  }
+  return r;
+};
+export {
+  d as tokenizeLine
+};

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

@@ -0,0 +1,2 @@
+export { CodeEditor } from './CodeEditor';
+export type { CodeEditorProps, CodeEditorLanguage, CodeEditorTheme, SyntaxToken, TokenType, } from './CodeEditor.types';

package/dist/components/Columns/Columns.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("../../utils/cn.cjs"),c={none:"0",xs:"0.5rem",sm:"1rem",md:"1.5rem",lg:"2rem",xl:"3rem"},b=({children:l,count:e="auto",gap:n="md",fill:r=!1,minWidth:o,className:s,style:m})=>{const t={columnCount:e==="auto"?"auto":e,columnGap:c[n],columnFill:r?"balance":"auto",...o&&{columnWidth:typeof o=="number"?`${o}px`:o},...m};return u.jsx("div",{className:a.cn("bear-w-full",s),style:t,children:l})},i=({children:l,span:e="avoid",className:n,style:r})=>u.jsx("div",{className:a.cn("bear-inline-block bear-w-full bear-mb-4",e==="avoid"&&"bear-break-inside-avoid",n),style:r,children:l});exports.Column=i;exports.Columns=b;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("../../utils/cn.cjs");require("react");const c={none:"0",xs:"0.5rem",sm:"1rem",md:"1.5rem",lg:"2rem",xl:"3rem"},b=({children:l,count:e="auto",gap:n="md",fill:r=!1,minWidth:o,className:s,style:m})=>{const t={columnCount:e==="auto"?"auto":e,columnGap:c[n],columnFill:r?"balance":"auto",...o&&{columnWidth:typeof o=="number"?`${o}px`:o},...m};return u.jsx("div",{className:a.cn("bear-w-full",s),style:t,children:l})},i=({children:l,span:e="avoid",className:n,style:r})=>u.jsx("div",{className:a.cn("bear-inline-block bear-w-full bear-mb-4",e==="avoid"&&"bear-break-inside-avoid",n),style:r,children:l});exports.Column=i;exports.Columns=b;

package/dist/components/Columns/Columns.js

@@ -1,5 +1,6 @@
 import { jsx as m } from "react/jsx-runtime";
 import { cn as n } from "../../utils/cn.js";
+import "react";
 const c = {
   none: "0",
   xs: "0.5rem",
@@ -10,16 +11,16 @@ const c = {
 }, d = ({
   children: l,
   count: o = "auto",
-  gap: a = "md",
-  fill: r = !1,
+  gap: r = "md",
+  fill: a = !1,
   minWidth: e,
   className: u,
   style: s
 }) => {
   const t = {
     columnCount: o === "auto" ? "auto" : o,
-    columnGap: c[a],
-    columnFill: r ? "balance" : "auto",
+    columnGap: c[r],
+    columnFill: a ? "balance" : "auto",
     ...e && { columnWidth: typeof e == "number" ? `${e}px` : e },
     ...s
   };
@@ -34,17 +35,17 @@ const c = {
 }, f = ({
   children: l,
   span: o = "avoid",
-  className: a,
-  style: r
+  className: r,
+  style: a
 }) => /* @__PURE__ */ m(
   "div",
   {
     className: n(
       "bear-inline-block bear-w-full bear-mb-4",
       o === "avoid" && "bear-break-inside-avoid",
-      a
+      r
     ),
-    style: r,
+    style: a,
     children: l
   }
 );

package/dist/components/Confetti/Confetti.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react/jsx-runtime"),n=require("react"),g=require("../../utils/cn.cjs"),r=require("./Confetti.const.cjs"),v=({active:E=!1,count:c=r.CONFETTI_DEFAULTS.COUNT,duration:h=r.CONFETTI_DEFAULTS.DURATION,colors:T=r.CONFETTI_COLORS,originX:I=r.CONFETTI_DEFAULTS.ORIGIN_X,originY:f=r.CONFETTI_DEFAULTS.ORIGIN_Y,spread:F=r.CONFETTI_DEFAULTS.SPREAD,velocity:S=r.CONFETTI_DEFAULTS.VELOCITY,gravity:O=r.CONFETTI_DEFAULTS.GRAVITY,autoHide:N=r.CONFETTI_DEFAULTS.AUTO_HIDE,onComplete:o,className:x,testId:y})=>{const[m,d]=n.useState([]),[b,A]=n.useState(!1),a=n.useRef(),i=n.useRef(0),_=n.useCallback(()=>{const t=[],l=F*Math.PI/180;for(let s=0;s<c;s++){const e=-Math.PI/2+(Math.random()-.5)*l,C=S*(.5+Math.random()*.5);t.push({id:s,x:I*100,y:f*100,rotation:Math.random()*360,color:T[Math.floor(Math.random()*T.length)],size:r.CONFETTI_SIZE_RANGE.min+Math.random()*(r.CONFETTI_SIZE_RANGE.max-r.CONFETTI_SIZE_RANGE.min),velocity:{x:Math.cos(e)*C,y:Math.sin(e)*C},rotationSpeed:(Math.random()-.5)*20,shape:r.CONFETTI_SHAPES[Math.floor(Math.random()*r.CONFETTI_SHAPES.length)]})}return t},[c,T,I,f,F,S]),u=n.useCallback(t=>{if(i.current||(i.current=t),t-i.current>=h&&N){A(!1),d([]),o==null||o();return}d(s=>s.map(e=>({...e,x:e.x+e.velocity.x*.1,y:e.y+e.velocity.y*.1,rotation:e.rotation+e.rotationSpeed,velocity:{x:e.velocity.x*.99,y:e.velocity.y+O}}))),a.current=requestAnimationFrame(u)},[h,O,N,o]);n.useEffect(()=>(E?(A(!0),d(_()),i.current=0,a.current=requestAnimationFrame(u)):a.current&&cancelAnimationFrame(a.current),()=>{a.current&&cancelAnimationFrame(a.current)}),[E,_,u]);const M=t=>{const l={position:"absolute",left:`${t.x}%`,top:`${t.y}%`,width:t.size,height:t.size,transform:`rotate(${t.rotation}deg)`,backgroundColor:t.shape!=="triangle"?t.color:"transparent",borderRadius:t.shape==="circle"?"50%":0,borderLeft:t.shape==="triangle"?`${t.size/2}px solid transparent`:void 0,borderRight:t.shape==="triangle"?`${t.size/2}px solid transparent`:void 0,borderBottom:t.shape==="triangle"?`${t.size}px solid ${t.color}`:void 0,opacity:.9};return R.jsx("div",{style:l},t.id)};return!b||m.length===0?null:R.jsx("div",{className:g.cn("Bear-Confetti","bear-fixed bear-inset-0 bear-pointer-events-none bear-overflow-hidden",x),style:{zIndex:99999},"data-testid":y,children:m.map(M)})};exports.Confetti=v;

package/dist/components/Confetti/Confetti.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T={COUNT:100,DURATION:3e3,ORIGIN_X:.5,ORIGIN_Y:.5,SPREAD:60,VELOCITY:30,GRAVITY:.5,AUTO_HIDE:!0},E=["#ec4899","#8b5cf6","#3b82f6","#10b981","#f59e0b","#ef4444","#06b6d4","#f97316"],O=["square","circle","triangle"],I={min:8,max:14};exports.CONFETTI_COLORS=E;exports.CONFETTI_DEFAULTS=T;exports.CONFETTI_SHAPES=O;exports.CONFETTI_SIZE_RANGE=I;

package/dist/components/Confetti/Confetti.const.d.ts

@@ -0,0 +1,16 @@
+export declare const CONFETTI_DEFAULTS: {
+    readonly COUNT: 100;
+    readonly DURATION: 3000;
+    readonly ORIGIN_X: 0.5;
+    readonly ORIGIN_Y: 0.5;
+    readonly SPREAD: 60;
+    readonly VELOCITY: 30;
+    readonly GRAVITY: 0.5;
+    readonly AUTO_HIDE: true;
+};
+export declare const CONFETTI_COLORS: readonly ["#ec4899", "#8b5cf6", "#3b82f6", "#10b981", "#f59e0b", "#ef4444", "#06b6d4", "#f97316"];
+export declare const CONFETTI_SHAPES: readonly ["square", "circle", "triangle"];
+export declare const CONFETTI_SIZE_RANGE: {
+    readonly min: 8;
+    readonly max: 14;
+};

package/dist/components/Confetti/Confetti.const.js

@@ -0,0 +1,36 @@
+const T = {
+  COUNT: 100,
+  DURATION: 3e3,
+  ORIGIN_X: 0.5,
+  ORIGIN_Y: 0.5,
+  SPREAD: 60,
+  VELOCITY: 30,
+  GRAVITY: 0.5,
+  AUTO_HIDE: !0
+}, I = [
+  "#ec4899",
+  // Pink (Bear primary)
+  "#8b5cf6",
+  // Purple
+  "#3b82f6",
+  // Blue
+  "#10b981",
+  // Green
+  "#f59e0b",
+  // Amber
+  "#ef4444",
+  // Red
+  "#06b6d4",
+  // Cyan
+  "#f97316"
+  // Orange
+], O = ["square", "circle", "triangle"], E = {
+  min: 8,
+  max: 14
+};
+export {
+  I as CONFETTI_COLORS,
+  T as CONFETTI_DEFAULTS,
+  O as CONFETTI_SHAPES,
+  E as CONFETTI_SIZE_RANGE
+};

package/dist/components/Confetti/Confetti.d.ts

@@ -0,0 +1,23 @@
+import { FC } from 'react';
+import { ConfettiProps } from './Confetti.types';
+/**
+ * Confetti - Celebration confetti effect 🎉
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * const [showConfetti, setShowConfetti] = useState(false);
+ * <Confetti active={showConfetti} onComplete={() => setShowConfetti(false)} />
+ * <Button onClick={() => setShowConfetti(true)}>Celebrate!</Button>
+ *
+ * // Custom colors and position
+ * <Confetti
+ *   active={true}
+ *   colors={['#ff0000', '#00ff00', '#0000ff']}
+ *   originX={0.5}
+ *   originY={0.3}
+ * />
+ * ```
+ */
+export declare const Confetti: FC<ConfettiProps>;
+export default Confetti;

package/dist/components/Confetti/Confetti.js

@@ -0,0 +1,94 @@
+import { jsx as g } from "react/jsx-runtime";
+import { useState as v, useRef as N, useCallback as S, useEffect as C } from "react";
+import { cn as D } from "../../utils/cn.js";
+import { CONFETTI_DEFAULTS as a, CONFETTI_SHAPES as F, CONFETTI_COLORS as G, CONFETTI_SIZE_RANGE as f } from "./Confetti.const.js";
+const k = ({
+  active: m = !1,
+  count: u = a.COUNT,
+  duration: c = a.DURATION,
+  colors: l = G,
+  originX: I = a.ORIGIN_X,
+  originY: x = a.ORIGIN_Y,
+  spread: y = a.SPREAD,
+  velocity: T = a.VELOCITY,
+  gravity: b = a.GRAVITY,
+  autoHide: M = a.AUTO_HIDE,
+  onComplete: o,
+  className: _,
+  testId: z
+}) => {
+  const [R, d] = v([]), [P, E] = v(!1), n = N(), s = N(0), O = S(() => {
+    const t = [], i = y * Math.PI / 180;
+    for (let e = 0; e < u; e++) {
+      const r = -Math.PI / 2 + (Math.random() - 0.5) * i, A = T * (0.5 + Math.random() * 0.5);
+      t.push({
+        id: e,
+        x: I * 100,
+        y: x * 100,
+        rotation: Math.random() * 360,
+        color: l[Math.floor(Math.random() * l.length)],
+        size: f.min + Math.random() * (f.max - f.min),
+        velocity: {
+          x: Math.cos(r) * A,
+          y: Math.sin(r) * A
+        },
+        rotationSpeed: (Math.random() - 0.5) * 20,
+        shape: F[Math.floor(Math.random() * F.length)]
+      });
+    }
+    return t;
+  }, [u, l, I, x, y, T]), h = S((t) => {
+    if (s.current || (s.current = t), t - s.current >= c && M) {
+      E(!1), d([]), o == null || o();
+      return;
+    }
+    d(
+      (e) => e.map((r) => ({
+        ...r,
+        x: r.x + r.velocity.x * 0.1,
+        y: r.y + r.velocity.y * 0.1,
+        rotation: r.rotation + r.rotationSpeed,
+        velocity: {
+          x: r.velocity.x * 0.99,
+          y: r.velocity.y + b
+        }
+      }))
+    ), n.current = requestAnimationFrame(h);
+  }, [c, b, M, o]);
+  C(() => (m ? (E(!0), d(O()), s.current = 0, n.current = requestAnimationFrame(h)) : n.current && cancelAnimationFrame(n.current), () => {
+    n.current && cancelAnimationFrame(n.current);
+  }), [m, O, h]);
+  const $ = (t) => {
+    const i = {
+      position: "absolute",
+      left: `${t.x}%`,
+      top: `${t.y}%`,
+      width: t.size,
+      height: t.size,
+      transform: `rotate(${t.rotation}deg)`,
+      backgroundColor: t.shape !== "triangle" ? t.color : "transparent",
+      borderRadius: t.shape === "circle" ? "50%" : 0,
+      borderLeft: t.shape === "triangle" ? `${t.size / 2}px solid transparent` : void 0,
+      borderRight: t.shape === "triangle" ? `${t.size / 2}px solid transparent` : void 0,
+      borderBottom: t.shape === "triangle" ? `${t.size}px solid ${t.color}` : void 0,
+      opacity: 0.9
+    };
+    return /* @__PURE__ */ g("div", { style: i }, t.id);
+  };
+  return !P || R.length === 0 ? null : /* @__PURE__ */ g(
+    "div",
+    {
+      className: D(
+        "Bear-Confetti",
+        "bear-fixed bear-inset-0 bear-pointer-events-none bear-overflow-hidden",
+        _
+      ),
+      style: { zIndex: 99999 },
+      "data-testid": z,
+      children: R.map($)
+    }
+  );
+};
+export {
+  k as Confetti
+};