@forgedevstack/bear 1.0.8 → 1.1.0

package/dist/components/Transition/Transition.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=300,e="cubic-bezier(0.4, 0, 0.2, 1)",a={fade:{enter:{opacity:0},enterActive:{opacity:1},exit:{opacity:1},exitActive:{opacity:0}},"slide-up":{enter:{opacity:0,transform:"translateY(16px)"},enterActive:{opacity:1,transform:"translateY(0)"},exit:{opacity:1,transform:"translateY(0)"},exitActive:{opacity:0,transform:"translateY(16px)"}},"slide-down":{enter:{opacity:0,transform:"translateY(-16px)"},enterActive:{opacity:1,transform:"translateY(0)"},exit:{opacity:1,transform:"translateY(0)"},exitActive:{opacity:0,transform:"translateY(-16px)"}},"slide-left":{enter:{opacity:0,transform:"translateX(-16px)"},enterActive:{opacity:1,transform:"translateX(0)"},exit:{opacity:1,transform:"translateX(0)"},exitActive:{opacity:0,transform:"translateX(-16px)"}},"slide-right":{enter:{opacity:0,transform:"translateX(16px)"},enterActive:{opacity:1,transform:"translateX(0)"},exit:{opacity:1,transform:"translateX(0)"},exitActive:{opacity:0,transform:"translateX(16px)"}},scale:{enter:{opacity:0,transform:"scale(0.9)"},enterActive:{opacity:1,transform:"scale(1)"},exit:{opacity:1,transform:"scale(1)"},exitActive:{opacity:0,transform:"scale(0.9)"}},"scale-y":{enter:{opacity:0,transform:"scaleY(0)"},enterActive:{opacity:1,transform:"scaleY(1)"},exit:{opacity:1,transform:"scaleY(1)"},exitActive:{opacity:0,transform:"scaleY(0)"}},"scale-x":{enter:{opacity:0,transform:"scaleX(0)"},enterActive:{opacity:1,transform:"scaleX(1)"},exit:{opacity:1,transform:"scaleX(1)"},exitActive:{opacity:0,transform:"scaleX(0)"}},rotate:{enter:{opacity:0,transform:"rotate(-90deg)"},enterActive:{opacity:1,transform:"rotate(0)"},exit:{opacity:1,transform:"rotate(0)"},exitActive:{opacity:0,transform:"rotate(90deg)"}},flip:{enter:{opacity:0,transform:"perspective(400px) rotateY(-90deg)"},enterActive:{opacity:1,transform:"perspective(400px) rotateY(0)"},exit:{opacity:1,transform:"perspective(400px) rotateY(0)"},exitActive:{opacity:0,transform:"perspective(400px) rotateY(90deg)"}},collapse:{enter:{height:"0px",overflow:"hidden",opacity:0},enterActive:{height:"auto",overflow:"hidden",opacity:1},exit:{height:"auto",overflow:"hidden",opacity:1},exitActive:{height:"0px",overflow:"hidden",opacity:0}}};exports.DEFAULT_DURATION=t;exports.DEFAULT_EASING=e;exports.TRANSITION_PRESETS=a;

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

@@ -0,0 +1,15 @@
+import { CSSProperties } from 'react';
+import { TransitionName } from './Transition.types';
+/** Default transition duration (ms) */
+export declare const DEFAULT_DURATION = 300;
+/** Default easing */
+export declare const DEFAULT_EASING = "cubic-bezier(0.4, 0, 0.2, 1)";
+interface TransitionStyles {
+    enter: CSSProperties;
+    enterActive: CSSProperties;
+    exit: CSSProperties;
+    exitActive: CSSProperties;
+}
+/** Built-in transition presets */
+export declare const TRANSITION_PRESETS: Record<TransitionName, TransitionStyles>;
+export {};

package/dist/components/Transition/Transition.const.js

@@ -0,0 +1,73 @@
+const t = 300, e = "cubic-bezier(0.4, 0, 0.2, 1)", a = {
+  fade: {
+    enter: { opacity: 0 },
+    enterActive: { opacity: 1 },
+    exit: { opacity: 1 },
+    exitActive: { opacity: 0 }
+  },
+  "slide-up": {
+    enter: { opacity: 0, transform: "translateY(16px)" },
+    enterActive: { opacity: 1, transform: "translateY(0)" },
+    exit: { opacity: 1, transform: "translateY(0)" },
+    exitActive: { opacity: 0, transform: "translateY(16px)" }
+  },
+  "slide-down": {
+    enter: { opacity: 0, transform: "translateY(-16px)" },
+    enterActive: { opacity: 1, transform: "translateY(0)" },
+    exit: { opacity: 1, transform: "translateY(0)" },
+    exitActive: { opacity: 0, transform: "translateY(-16px)" }
+  },
+  "slide-left": {
+    enter: { opacity: 0, transform: "translateX(-16px)" },
+    enterActive: { opacity: 1, transform: "translateX(0)" },
+    exit: { opacity: 1, transform: "translateX(0)" },
+    exitActive: { opacity: 0, transform: "translateX(-16px)" }
+  },
+  "slide-right": {
+    enter: { opacity: 0, transform: "translateX(16px)" },
+    enterActive: { opacity: 1, transform: "translateX(0)" },
+    exit: { opacity: 1, transform: "translateX(0)" },
+    exitActive: { opacity: 0, transform: "translateX(16px)" }
+  },
+  scale: {
+    enter: { opacity: 0, transform: "scale(0.9)" },
+    enterActive: { opacity: 1, transform: "scale(1)" },
+    exit: { opacity: 1, transform: "scale(1)" },
+    exitActive: { opacity: 0, transform: "scale(0.9)" }
+  },
+  "scale-y": {
+    enter: { opacity: 0, transform: "scaleY(0)" },
+    enterActive: { opacity: 1, transform: "scaleY(1)" },
+    exit: { opacity: 1, transform: "scaleY(1)" },
+    exitActive: { opacity: 0, transform: "scaleY(0)" }
+  },
+  "scale-x": {
+    enter: { opacity: 0, transform: "scaleX(0)" },
+    enterActive: { opacity: 1, transform: "scaleX(1)" },
+    exit: { opacity: 1, transform: "scaleX(1)" },
+    exitActive: { opacity: 0, transform: "scaleX(0)" }
+  },
+  rotate: {
+    enter: { opacity: 0, transform: "rotate(-90deg)" },
+    enterActive: { opacity: 1, transform: "rotate(0)" },
+    exit: { opacity: 1, transform: "rotate(0)" },
+    exitActive: { opacity: 0, transform: "rotate(90deg)" }
+  },
+  flip: {
+    enter: { opacity: 0, transform: "perspective(400px) rotateY(-90deg)" },
+    enterActive: { opacity: 1, transform: "perspective(400px) rotateY(0)" },
+    exit: { opacity: 1, transform: "perspective(400px) rotateY(0)" },
+    exitActive: { opacity: 0, transform: "perspective(400px) rotateY(90deg)" }
+  },
+  collapse: {
+    enter: { height: "0px", overflow: "hidden", opacity: 0 },
+    enterActive: { height: "auto", overflow: "hidden", opacity: 1 },
+    exit: { height: "auto", overflow: "hidden", opacity: 1 },
+    exitActive: { height: "0px", overflow: "hidden", opacity: 0 }
+  }
+};
+export {
+  t as DEFAULT_DURATION,
+  e as DEFAULT_EASING,
+  a as TRANSITION_PRESETS
+};

package/dist/components/Transition/Transition.d.ts

@@ -0,0 +1,37 @@
+import { FC } from 'react';
+import { TransitionProps, MotionProps } from './Transition.types';
+/**
+ * Transition - Declarative enter/leave transitions
+ *
+ * @description
+ * Wraps children with CSS transitions for show/hide animations.
+ * Supports built-in presets and custom enter/leave styles.
+ *
+ * @example
+ * ```tsx
+ * <Transition show={isOpen} name="slide-up" duration={300}>
+ *   <div>Content</div>
+ * </Transition>
+ * ```
+ */
+export declare const Transition: FC<TransitionProps>;
+/**
+ * Motion - Framer Motion-inspired declarative animation component
+ *
+ * @description
+ * Animates between initial, animate, and exit states with
+ * optional hover and tap interactions.
+ *
+ * @example
+ * ```tsx
+ * <Motion
+ *   initial={{ opacity: 0, y: 20 }}
+ *   animate={{ opacity: 1, y: 0 }}
+ *   whileHover={{ scale: 1.05 }}
+ *   transition={{ duration: 500 }}
+ * >
+ *   <Card>Content</Card>
+ * </Motion>
+ * ```
+ */
+export declare const Motion: FC<MotionProps>;

package/dist/components/Transition/Transition.js

@@ -0,0 +1,107 @@
+import { useState as v, useRef as y, useEffect as P, createElement as R } from "react";
+import { cn as b } from "../../utils/cn.js";
+import { DEFAULT_EASING as k, DEFAULT_DURATION as D, TRANSITION_PRESETS as U } from "./Transition.const.js";
+const G = ({
+  show: u,
+  name: I = "fade",
+  duration: r = D,
+  delay: a = 0,
+  easing: M = k,
+  enterFrom: n,
+  enterTo: l,
+  leaveFrom: m,
+  leaveTo: N,
+  unmountOnHide: S = !0,
+  onEnter: o,
+  onEntered: f,
+  onLeave: i,
+  onLeft: d,
+  children: T,
+  className: $,
+  as: A = "div"
+}) => {
+  const [x, F] = v(u), [q, c] = v(
+    u ? "idle" : "exit-active"
+  ), e = y(null);
+  if (P(() => (e.current && clearTimeout(e.current), u ? (F(!0), c("enter"), o == null || o(), requestAnimationFrame(() => {
+    requestAnimationFrame(() => {
+      c("enter-active"), e.current = setTimeout(() => {
+        c("idle"), f == null || f();
+      }, r + a);
+    });
+  })) : (c("exit"), i == null || i(), requestAnimationFrame(() => {
+    requestAnimationFrame(() => {
+      c("exit-active"), e.current = setTimeout(() => {
+        S && F(!1), d == null || d();
+      }, r + a);
+    });
+  })), () => {
+    e.current && clearTimeout(e.current);
+  }), [u]), !x && S) return null;
+  const t = U[I];
+  let s = {
+    transition: `all ${r}ms ${M} ${a}ms`
+  };
+  switch (q) {
+    case "enter":
+      s = { ...s, ...n ?? (t == null ? void 0 : t.enter) };
+      break;
+    case "enter-active":
+    case "idle":
+      s = { ...s, ...l ?? (t == null ? void 0 : t.enterActive) };
+      break;
+    case "exit":
+      s = { ...s, ...m ?? (t == null ? void 0 : t.exit) };
+      break;
+    case "exit-active":
+      s = { ...s, ...N ?? (t == null ? void 0 : t.exitActive) };
+      break;
+  }
+  return R(
+    A,
+    { className: b($), style: s },
+    T
+  );
+}, O = ({
+  children: u,
+  initial: I,
+  animate: r,
+  exit: a,
+  transition: M = {},
+  whileHover: n,
+  whileTap: l,
+  inView: m = !0,
+  as: N = "div",
+  className: S,
+  testId: o
+}) => {
+  const [f, i] = v(I ?? {}), [d, T] = v(!1), [$, A] = v(!1), x = y(!1), { duration: F = 300, delay: q = 0, easing: c = k } = M;
+  P(() => {
+    x.current ? m && r ? i(r) : !m && a && i(a) : (x.current = !0, requestAnimationFrame(() => {
+      m && r && i(r);
+    }));
+  }, [m]);
+  let e = {
+    ...f,
+    transition: `all ${F}ms ${c} ${q}ms`
+  };
+  return $ && l ? e = { ...e, ...l } : d && n && (e = { ...e, ...n }), R(
+    N,
+    {
+      className: b(S),
+      style: e,
+      "data-testid": o,
+      onMouseEnter: n ? () => T(!0) : void 0,
+      onMouseLeave: n ? () => {
+        T(!1), A(!1);
+      } : void 0,
+      onMouseDown: l ? () => A(!0) : void 0,
+      onMouseUp: l ? () => A(!1) : void 0
+    },
+    u
+  );
+};
+export {
+  O as Motion,
+  G as Transition
+};

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

@@ -0,0 +1,69 @@
+import { ReactNode, CSSProperties } from 'react';
+/**
+ * Built-in transition names
+ */
+export type TransitionName = 'fade' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'scale' | 'scale-y' | 'scale-x' | 'rotate' | 'flip' | 'collapse';
+export interface TransitionProps {
+    /** Whether the child is visible */
+    show: boolean;
+    /** Transition name or custom styles */
+    name?: TransitionName;
+    /** Duration in ms */
+    duration?: number;
+    /** Delay in ms */
+    delay?: number;
+    /** Easing function */
+    easing?: string;
+    /** Custom enter styles */
+    enterFrom?: CSSProperties;
+    /** Custom enter-to styles */
+    enterTo?: CSSProperties;
+    /** Custom leave styles */
+    leaveFrom?: CSSProperties;
+    /** Custom leave-to styles */
+    leaveTo?: CSSProperties;
+    /** Unmount when hidden */
+    unmountOnHide?: boolean;
+    /** Called when enter transition starts */
+    onEnter?: () => void;
+    /** Called when enter transition ends */
+    onEntered?: () => void;
+    /** Called when leave transition starts */
+    onLeave?: () => void;
+    /** Called when leave transition ends */
+    onLeft?: () => void;
+    /** Children to animate */
+    children: ReactNode;
+    /** Custom class name */
+    className?: string;
+    /** As which HTML element */
+    as?: keyof JSX.IntrinsicElements;
+}
+export interface MotionProps {
+    /** Children to render */
+    children: ReactNode;
+    /** Initial styles (on mount) */
+    initial?: CSSProperties;
+    /** Target styles (after mount) */
+    animate?: CSSProperties;
+    /** Exit styles */
+    exit?: CSSProperties;
+    /** Transition configuration */
+    transition?: {
+        duration?: number;
+        delay?: number;
+        easing?: string;
+    };
+    /** Hover styles */
+    whileHover?: CSSProperties;
+    /** Press/active styles */
+    whileTap?: CSSProperties;
+    /** Whether in view (trigger animation) */
+    inView?: boolean;
+    /** As which HTML element */
+    as?: keyof JSX.IntrinsicElements;
+    /** Custom class name */
+    className?: string;
+    /** Test ID */
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Transition, Motion } from './Transition';
+export type { TransitionProps, MotionProps, TransitionName } from './Transition.types';

package/dist/components/Typewriter/Typewriter.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),t=require("react"),R=require("../../utils/cn.cjs"),r=require("./Typewriter.const.cjs"),X=b=>{const{text:f,speed:i=r.DEFAULT_SPEED,startDelay:N=r.DEFAULT_START_DELAY,deleteDelay:x=r.DEFAULT_DELETE_DELAY,deleteSpeed:d=r.DEFAULT_DELETE_SPEED,loop:_=!1,cursor:I=!0,cursorChar:h=r.DEFAULT_CURSOR_CHAR,cursorBlinkSpeed:A=r.DEFAULT_CURSOR_BLINK_SPEED,onComplete:n,onWordComplete:o,as:g="span",className:U,style:j,testId:w}=b,u=Array.isArray(f)?f:[f],[F,m]=t.useState(""),[a,p]=t.useState(r.INITIAL_TEXT_INDEX),[l,S]=t.useState(r.INITIAL_CHAR_INDEX),[E,L]=t.useState(!1),[v,B]=t.useState(!0),e=t.useRef(),D=t.useRef(!1);t.useEffect(()=>{if(!I)return;const T=setInterval(()=>B(s=>!s),A);return()=>clearInterval(T)},[I,A]);const c=t.useCallback(()=>{const T=u[a];if(E)if(l>0)S(s=>s-1),m(T.slice(0,l-1)),e.current=setTimeout(c,d);else{L(!1);const s=a+1;s>=u.length?_?(p(r.INITIAL_TEXT_INDEX),e.current=setTimeout(c,i)):n==null||n():(p(s),e.current=setTimeout(c,i))}else if(l<T.length)m(T.slice(0,l+1)),S(s=>s+1),e.current=setTimeout(c,i);else{if(o==null||o(a),u.length===1&&!_){n==null||n();return}e.current=setTimeout(()=>{L(!0),c()},x)}},[u,a,l,E,i,d,x,_,n,o]);return t.useEffect(()=>{if(!D.current)return D.current=!0,e.current=setTimeout(c,N),()=>{e.current&&clearTimeout(e.current)}},[]),t.useEffect(()=>{if(D.current)return e.current&&clearTimeout(e.current),e.current=setTimeout(c,E?d:i),()=>{e.current&&clearTimeout(e.current)}},[E,a]),y.jsxs(g,{className:R.cn("Bear-Typewriter","bear-inline",U),style:j,"data-testid":w,"aria-label":u.join(", "),children:[y.jsx("span",{className:"Bear-Typewriter__text",children:F}),I&&y.jsx("span",{className:R.cn("Bear-Typewriter__cursor","bear-inline-block bear-ml-0.5","bear-text-[var(--bear-primary-500)]"),style:{opacity:v?1:0},"aria-hidden":"true",children:h})]})};exports.Typewriter=X;

package/dist/components/Typewriter/Typewriter.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=80,_=500,D=1500,T=40,A="|",L=530,I=0,U=0;exports.DEFAULT_CURSOR_BLINK_SPEED=L;exports.DEFAULT_CURSOR_CHAR=A;exports.DEFAULT_DELETE_DELAY=D;exports.DEFAULT_DELETE_SPEED=T;exports.DEFAULT_SPEED=E;exports.DEFAULT_START_DELAY=_;exports.INITIAL_CHAR_INDEX=U;exports.INITIAL_TEXT_INDEX=I;

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

@@ -0,0 +1,22 @@
+/** Default typing speed in ms per character */
+export declare const DEFAULT_SPEED = 80;
+/** Default start delay in ms */
+export declare const DEFAULT_START_DELAY = 500;
+/** Default delay before deleting in ms */
+export declare const DEFAULT_DELETE_DELAY = 1500;
+/** Default delete speed in ms per character */
+export declare const DEFAULT_DELETE_SPEED = 40;
+/** Default cursor character */
+export declare const DEFAULT_CURSOR_CHAR = "|";
+/** Default cursor blink speed in ms */
+export declare const DEFAULT_CURSOR_BLINK_SPEED = 530;
+/** Cursor opacity visible */
+export declare const CURSOR_OPACITY_ON = 1;
+/** Cursor opacity hidden */
+export declare const CURSOR_OPACITY_OFF = 0;
+/** Cursor transition duration */
+export declare const CURSOR_TRANSITION = "0.1s";
+/** Starting text index */
+export declare const INITIAL_TEXT_INDEX = 0;
+/** Starting char index */
+export declare const INITIAL_CHAR_INDEX = 0;

package/dist/components/Typewriter/Typewriter.const.js

@@ -0,0 +1,11 @@
+const E = 80, _ = 500, D = 1500, T = 40, A = "|", L = 530, o = 0, t = 0;
+export {
+  L as DEFAULT_CURSOR_BLINK_SPEED,
+  A as DEFAULT_CURSOR_CHAR,
+  D as DEFAULT_DELETE_DELAY,
+  T as DEFAULT_DELETE_SPEED,
+  E as DEFAULT_SPEED,
+  _ as DEFAULT_START_DELAY,
+  t as INITIAL_CHAR_INDEX,
+  o as INITIAL_TEXT_INDEX
+};

package/dist/components/Typewriter/Typewriter.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+import { TypewriterProps } from './Typewriter.types';
+/**
+ * Typewriter - Animated typing text effect.
+ * Supports multi-text looping, custom speeds, cursor, and theming via BearProvider.
+ */
+export declare const Typewriter: FC<TypewriterProps>;

package/dist/components/Typewriter/Typewriter.js

@@ -0,0 +1,88 @@
+import { jsxs as P, jsx as b } from "react/jsx-runtime";
+import { useState as l, useRef as h, useEffect as _, useCallback as X } from "react";
+import { cn as R } from "../../utils/cn.js";
+import { DEFAULT_SPEED as H, DEFAULT_START_DELAY as O, DEFAULT_DELETE_DELAY as V, DEFAULT_DELETE_SPEED as Y, DEFAULT_CURSOR_CHAR as K, DEFAULT_CURSOR_BLINK_SPEED as q, INITIAL_TEXT_INDEX as N, INITIAL_CHAR_INDEX as z } from "./Typewriter.const.js";
+const Z = (S) => {
+  const {
+    text: f,
+    speed: n = H,
+    startDelay: U = O,
+    deleteDelay: I = V,
+    deleteSpeed: E = Y,
+    loop: d = !1,
+    cursor: m = !0,
+    cursorChar: g = K,
+    cursorBlinkSpeed: p = q,
+    onComplete: t,
+    onWordComplete: o,
+    as: F = "span",
+    className: B,
+    style: v,
+    testId: w
+  } = S, i = Array.isArray(f) ? f : [f], [C, x] = l(""), [a, y] = l(N), [c, A] = l(z), [T, L] = l(!1), [j, k] = l(!0), e = h(), D = h(!1);
+  _(() => {
+    if (!m) return;
+    const u = setInterval(() => k((r) => !r), p);
+    return () => clearInterval(u);
+  }, [m, p]);
+  const s = X(() => {
+    const u = i[a];
+    if (T)
+      if (c > 0)
+        A((r) => r - 1), x(u.slice(0, c - 1)), e.current = setTimeout(s, E);
+      else {
+        L(!1);
+        const r = a + 1;
+        r >= i.length ? d ? (y(N), e.current = setTimeout(s, n)) : t == null || t() : (y(r), e.current = setTimeout(s, n));
+      }
+    else if (c < u.length)
+      x(u.slice(0, c + 1)), A((r) => r + 1), e.current = setTimeout(s, n);
+    else {
+      if (o == null || o(a), i.length === 1 && !d) {
+        t == null || t();
+        return;
+      }
+      e.current = setTimeout(() => {
+        L(!0), s();
+      }, I);
+    }
+  }, [i, a, c, T, n, E, I, d, t, o]);
+  return _(() => {
+    if (!D.current)
+      return D.current = !0, e.current = setTimeout(s, U), () => {
+        e.current && clearTimeout(e.current);
+      };
+  }, []), _(() => {
+    if (D.current)
+      return e.current && clearTimeout(e.current), e.current = setTimeout(s, T ? E : n), () => {
+        e.current && clearTimeout(e.current);
+      };
+  }, [T, a]), /* @__PURE__ */ P(
+    F,
+    {
+      className: R("Bear-Typewriter", "bear-inline", B),
+      style: v,
+      "data-testid": w,
+      "aria-label": i.join(", "),
+      children: [
+        /* @__PURE__ */ b("span", { className: "Bear-Typewriter__text", children: C }),
+        m && /* @__PURE__ */ b(
+          "span",
+          {
+            className: R(
+              "Bear-Typewriter__cursor",
+              "bear-inline-block bear-ml-0.5",
+              "bear-text-[var(--bear-primary-500)]"
+            ),
+            style: { opacity: j ? 1 : 0 },
+            "aria-hidden": "true",
+            children: g
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  Z as Typewriter
+};

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

@@ -0,0 +1,32 @@
+export interface TypewriterProps {
+    /** Text or array of texts to type */
+    text: string | string[];
+    /** Typing speed in ms per character */
+    speed?: number;
+    /** Delay before starting to type */
+    startDelay?: number;
+    /** Delay before deleting (when looping) */
+    deleteDelay?: number;
+    /** Delete speed in ms per character */
+    deleteSpeed?: number;
+    /** Whether to loop through texts */
+    loop?: boolean;
+    /** Whether to show cursor */
+    cursor?: boolean;
+    /** Cursor character */
+    cursorChar?: string;
+    /** Cursor blink speed in ms */
+    cursorBlinkSpeed?: number;
+    /** Called when typing is complete */
+    onComplete?: () => void;
+    /** Called when a word is complete (in multi-text mode) */
+    onWordComplete?: (index: number) => void;
+    /** HTML tag to render */
+    as?: 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';
+    /** Custom class name */
+    className?: string;
+    /** Custom style */
+    style?: React.CSSProperties;
+    /** Test ID */
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Typewriter } from './Typewriter';
+export type { TypewriterProps } from './Typewriter.types';

package/dist/components/Typography/Typography.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react/jsx-runtime"),i=require("react"),W=require("../../utils/cn.cjs"),L=require("../../context/BearProvider.cjs"),N={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",subtitle1:"h6",subtitle2:"h6",body1:"p",body2:"p",caption:"span",overline:"span",code:"code",inherit:"span"},H={h1:"bear-text-5xl bear-font-bold bear-tracking-tight",h2:"bear-text-4xl bear-font-bold bear-tracking-tight",h3:"bear-text-3xl bear-font-semibold",h4:"bear-text-2xl bear-font-semibold",h5:"bear-text-xl bear-font-medium",h6:"bear-text-lg bear-font-medium",subtitle1:"bear-text-lg bear-font-normal",subtitle2:"bear-text-base bear-font-medium",body1:"bear-text-base bear-font-normal",body2:"bear-text-sm bear-font-normal",caption:"bear-text-xs",overline:"bear-text-xs bear-uppercase bear-tracking-wider",code:"bear-text-sm bear-font-mono bear-bg-gray-100 dark:bear-bg-gray-800 bear-px-1.5 bear-py-0.5 bear-rounded",inherit:""},R={thin:"bear-font-thin",light:"bear-font-light",normal:"bear-font-normal",medium:"bear-font-medium",semibold:"bear-font-semibold",bold:"bear-font-bold",extrabold:"bear-font-extrabold"},j={thin:100,light:300,normal:400,medium:500,semibold:600,bold:700,extrabold:800},w={left:"bear-text-left",center:"bear-text-center",right:"bear-text-right",justify:"bear-text-justify"},y={primary:"bear-text-gray-900 dark:bear-text-gray-100",secondary:"bear-text-gray-600 dark:bear-text-gray-400",muted:"bear-text-gray-400 dark:bear-text-gray-500",success:"bear-text-green-600 dark:bear-text-green-400",danger:"bear-text-red-600 dark:bear-text-red-400",warning:"bear-text-amber-600 dark:bear-text-amber-400"},M={tight:"bear-leading-tight",normal:"bear-leading-normal",relaxed:"bear-leading-relaxed",loose:"bear-leading-loose"},q=["h1","h2","h3","h4","h5","h6","subtitle1","subtitle2","body1","body2","caption","overline","code","inherit"],G=({variant:t="body1",component:s,align:h,weight:d,color:o="primary",truncate:l=!1,maxLines:b,italic:m=!1,underline:u=!1,strikethrough:c=!1,noWrap:p=!1,inline:x=!1,paragraph:S=!1,lineHeight:f,children:T,className:k,style:A,testId:C,...B})=>{const r=i.useContext(L.BearContext),n=q.includes(t),e=i.useMemo(()=>{if(!(n||!(r!=null&&r.customTypography)))return r.customTypography[t]},[n,r==null?void 0:r.customTypography,t]),I=i.useMemo(()=>s||(e!=null&&e.component?e.component:n?N[t]:"span"),[s,e,n,t]),g=o&&!y[o],E=i.useMemo(()=>{if(!e)return{};const a={};return e.fontSize&&(a.fontSize=e.fontSize),e.lineHeight&&(a.lineHeight=e.lineHeight),e.letterSpacing&&(a.letterSpacing=e.letterSpacing),e.textTransform&&(a.textTransform=e.textTransform),e.fontFamily&&(a.fontFamily=e.fontFamily),e.fontWeight&&(a.fontWeight=typeof e.fontWeight=="number"?e.fontWeight:j[e.fontWeight]||400),a},[e]);return _.jsx(I,{className:W.cn("Bear-Typography",`Bear-Typography--${t}`,n&&H[t],d&&R[d],h&&w[h],!g&&o&&y[o],f&&M[f],m&&"Bear-Typography--italic bear-italic",u&&"Bear-Typography--underline bear-underline",c&&"Bear-Typography--strikethrough bear-line-through",p&&"bear-whitespace-nowrap",x&&"bear-inline",S&&"bear-mb-4",l&&!b&&"Bear-Typography--truncate bear-truncate",l&&b&&"bear-overflow-hidden",k),style:{...E,...A,...g&&{color:o},...l&&b&&{display:"-webkit-box",WebkitLineClamp:b,WebkitBoxOrient:"vertical"}},"data-testid":C,...B,children:T})};exports.Typography=G;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),c=require("react"),O=require("../../context/BearProvider.cjs"),q=require("../GradientText/GradientText.cjs"),v=require("../Typewriter/Typewriter.cjs"),r=require("./Typography.const.cjs"),G=require("../../utils/cn.cjs"),j=A=>{const{variant:t=r.DEFAULT_VARIANT,component:u,align:f,weight:g,color:a=r.DEFAULT_COLOR,truncate:y=!1,maxLines:l,italic:C=!1,underline:b=!1,strikethrough:L=!1,noWrap:_=!1,inline:S=!1,paragraph:x=!1,lineHeight:T,gradient:p,typewriter:n,children:E,className:I,style:B,testId:N,...W}=A,i=c.useContext(O.BearContext),s=r.BUILT_IN_VARIANTS.includes(t),e=c.useMemo(()=>{if(!(s||!(i!=null&&i.customTypography)))return i.customTypography[t]},[s,i==null?void 0:i.customTypography,t]),w=c.useMemo(()=>u||(e!=null&&e.component?e.component:s?r.VARIANT_MAP[t]:"span"),[u,e,s,t]),d=a&&!(a in r.COLOR_CLASSES),R=c.useMemo(()=>{if(!e)return{};const o={};return e.fontSize&&(o.fontSize=e.fontSize),e.lineHeight&&(o.lineHeight=e.lineHeight),e.letterSpacing&&(o.letterSpacing=e.letterSpacing),e.textTransform&&(o.textTransform=e.textTransform),e.fontFamily&&(o.fontFamily=e.fontFamily),e.fontWeight&&(o.fontWeight=typeof e.fontWeight=="number"?e.fontWeight:r.WEIGHT_VALUES[e.fontWeight]||400),o},[e]),m=n?h.jsx(v.Typewriter,{text:n.texts,loop:n.loop??!0,speed:n.speed,deleteSpeed:n.deleteSpeed,cursor:n.cursor??!0,cursorChar:n.cursorChar,as:"span"}):E,H=p&&Array.isArray(p)&&p.length>=2?h.jsx(q.GradientText,{colors:p,className:S?"bear-inline":void 0,children:m}):m;return h.jsx(w,{className:G.cn("Bear-Typography",`Bear-Typography--${t}`,s&&r.VARIANT_CLASSES[t],g&&r.WEIGHT_CLASSES[g],f&&r.ALIGN_CLASSES[f],!d&&a&&r.COLOR_CLASSES[a],T&&r.LINE_HEIGHT_CLASSES[T],C&&"Bear-Typography--italic bear-italic",b&&"Bear-Typography--underline bear-underline",L&&"Bear-Typography--strikethrough bear-line-through",_&&"bear-whitespace-nowrap",S&&"bear-inline",x&&"bear-mb-4",y&&!l&&"Bear-Typography--truncate bear-truncate",y&&l&&"bear-overflow-hidden",I),style:{...R,...B,...d&&{color:a},...y&&l&&{display:"-webkit-box",WebkitLineClamp:l,WebkitBoxOrient:"vertical"}},"data-testid":N,...W,children:H})};exports.Typography=j;

package/dist/components/Typography/Typography.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="body1",t="primary",r={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",subtitle1:"h6",subtitle2:"h6",body1:"p",body2:"p",caption:"span",overline:"span",code:"code",inherit:"span"},a={h1:"bear-text-5xl bear-font-bold bear-tracking-tight",h2:"bear-text-4xl bear-font-bold bear-tracking-tight",h3:"bear-text-3xl bear-font-semibold",h4:"bear-text-2xl bear-font-semibold",h5:"bear-text-xl bear-font-medium",h6:"bear-text-lg bear-font-medium",subtitle1:"bear-text-lg bear-font-normal",subtitle2:"bear-text-base bear-font-medium",body1:"bear-text-base bear-font-normal",body2:"bear-text-sm bear-font-normal",caption:"bear-text-xs",overline:"bear-text-xs bear-uppercase bear-tracking-wider",code:"bear-text-sm bear-font-mono bear-bg-gray-100 dark:bear-bg-gray-800 bear-px-1.5 bear-py-0.5 bear-rounded",inherit:""},b={thin:"bear-font-thin",light:"bear-font-light",normal:"bear-font-normal",medium:"bear-font-medium",semibold:"bear-font-semibold",bold:"bear-font-bold",extrabold:"bear-font-extrabold"},o={thin:100,light:300,normal:400,medium:500,semibold:600,bold:700,extrabold:800},n={left:"bear-text-left",center:"bear-text-center",right:"bear-text-right",justify:"bear-text-justify"},i={primary:"bear-text-gray-900 dark:bear-text-gray-100",secondary:"bear-text-gray-600 dark:bear-text-gray-400",muted:"bear-text-gray-400 dark:bear-text-gray-500",success:"bear-text-green-600 dark:bear-text-green-400",danger:"bear-text-red-600 dark:bear-text-red-400",warning:"bear-text-amber-600 dark:bear-text-amber-400"},d={tight:"bear-leading-tight",normal:"bear-leading-normal",relaxed:"bear-leading-relaxed",loose:"bear-leading-loose"},l=["h1","h2","h3","h4","h5","h6","subtitle1","subtitle2","body1","body2","caption","overline","code","inherit"];exports.ALIGN_CLASSES=n;exports.BUILT_IN_VARIANTS=l;exports.COLOR_CLASSES=i;exports.DEFAULT_COLOR=t;exports.DEFAULT_VARIANT=e;exports.LINE_HEIGHT_CLASSES=d;exports.VARIANT_CLASSES=a;exports.VARIANT_MAP=r;exports.WEIGHT_CLASSES=b;exports.WEIGHT_VALUES=o;

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

@@ -0,0 +1,22 @@
+import { ElementType } from 'react';
+import { BuiltInTypographyVariant } from './Typography.types';
+/** Default variant when not specified */
+export declare const DEFAULT_VARIANT: BuiltInTypographyVariant;
+/** Default color when not specified */
+export declare const DEFAULT_COLOR = "primary";
+/** Map from built-in variant to HTML element type */
+export declare const VARIANT_MAP: Record<BuiltInTypographyVariant, ElementType>;
+/** Tailwind classes per built-in variant (supports dark mode) */
+export declare const VARIANT_CLASSES: Record<BuiltInTypographyVariant, string>;
+/** Font weight class names */
+export declare const WEIGHT_CLASSES: Record<string, string>;
+/** Numeric font weight values */
+export declare const WEIGHT_VALUES: Record<string, number>;
+/** Text alignment classes */
+export declare const ALIGN_CLASSES: Record<string, string>;
+/** Text color classes (light and dark mode) */
+export declare const COLOR_CLASSES: Record<string, string>;
+/** Line height classes */
+export declare const LINE_HEIGHT_CLASSES: Record<string, string>;
+/** List of built-in variant names for validation */
+export declare const BUILT_IN_VARIANTS: BuiltInTypographyVariant[];

package/dist/components/Typography/Typography.const.js

@@ -0,0 +1,91 @@
+const e = "body1", t = "primary", r = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  caption: "span",
+  overline: "span",
+  code: "code",
+  inherit: "span"
+}, a = {
+  h1: "bear-text-5xl bear-font-bold bear-tracking-tight",
+  h2: "bear-text-4xl bear-font-bold bear-tracking-tight",
+  h3: "bear-text-3xl bear-font-semibold",
+  h4: "bear-text-2xl bear-font-semibold",
+  h5: "bear-text-xl bear-font-medium",
+  h6: "bear-text-lg bear-font-medium",
+  subtitle1: "bear-text-lg bear-font-normal",
+  subtitle2: "bear-text-base bear-font-medium",
+  body1: "bear-text-base bear-font-normal",
+  body2: "bear-text-sm bear-font-normal",
+  caption: "bear-text-xs",
+  overline: "bear-text-xs bear-uppercase bear-tracking-wider",
+  code: "bear-text-sm bear-font-mono bear-bg-gray-100 dark:bear-bg-gray-800 bear-px-1.5 bear-py-0.5 bear-rounded",
+  inherit: ""
+}, b = {
+  thin: "bear-font-thin",
+  light: "bear-font-light",
+  normal: "bear-font-normal",
+  medium: "bear-font-medium",
+  semibold: "bear-font-semibold",
+  bold: "bear-font-bold",
+  extrabold: "bear-font-extrabold"
+}, o = {
+  thin: 100,
+  light: 300,
+  normal: 400,
+  medium: 500,
+  semibold: 600,
+  bold: 700,
+  extrabold: 800
+}, n = {
+  left: "bear-text-left",
+  center: "bear-text-center",
+  right: "bear-text-right",
+  justify: "bear-text-justify"
+}, i = {
+  primary: "bear-text-gray-900 dark:bear-text-gray-100",
+  secondary: "bear-text-gray-600 dark:bear-text-gray-400",
+  muted: "bear-text-gray-400 dark:bear-text-gray-500",
+  success: "bear-text-green-600 dark:bear-text-green-400",
+  danger: "bear-text-red-600 dark:bear-text-red-400",
+  warning: "bear-text-amber-600 dark:bear-text-amber-400"
+}, d = {
+  tight: "bear-leading-tight",
+  normal: "bear-leading-normal",
+  relaxed: "bear-leading-relaxed",
+  loose: "bear-leading-loose"
+}, l = [
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "subtitle1",
+  "subtitle2",
+  "body1",
+  "body2",
+  "caption",
+  "overline",
+  "code",
+  "inherit"
+];
+export {
+  n as ALIGN_CLASSES,
+  l as BUILT_IN_VARIANTS,
+  i as COLOR_CLASSES,
+  t as DEFAULT_COLOR,
+  e as DEFAULT_VARIANT,
+  d as LINE_HEIGHT_CLASSES,
+  a as VARIANT_CLASSES,
+  r as VARIANT_MAP,
+  b as WEIGHT_CLASSES,
+  o as WEIGHT_VALUES
+};