@forgedevstack/bear 1.0.6 → 1.0.8

package/dist/components/Terminal/Terminal.const.js

@@ -0,0 +1,42 @@
+const e = {
+  HEIGHT: 400,
+  USER: "user",
+  HOST: "localhost",
+  CWD: "~",
+  TITLE: "Terminal"
+}, a = {
+  input: "inherit",
+  output: "inherit",
+  error: "#ef4444",
+  success: "#22c55e",
+  warning: "#f59e0b",
+  info: "#3b82f6",
+  system: "#a855f7"
+}, r = {
+  dark: {
+    bg: "#1a1a2e",
+    text: "#eaeaea",
+    prompt: "#22c55e",
+    border: "#2d2d44",
+    header: "#16162a"
+  },
+  light: {
+    bg: "#fafafa",
+    text: "#1a1a2e",
+    prompt: "#16a34a",
+    border: "#e5e5e5",
+    header: "#f0f0f0"
+  },
+  matrix: {
+    bg: "#0d0d0d",
+    text: "#00ff00",
+    prompt: "#00ff00",
+    border: "#003300",
+    header: "#0a0a0a"
+  }
+};
+export {
+  a as LINE_TYPE_COLORS,
+  e as TERMINAL_DEFAULTS,
+  r as TERMINAL_THEMES
+};

package/dist/components/Terminal/Terminal.d.ts

@@ -0,0 +1,27 @@
+import { FC } from 'react';
+import { TerminalProps } from './Terminal.types';
+/**
+ * Terminal - Console/terminal emulator component
+ *
+ * @example
+ * ```tsx
+ * const [lines, setLines] = useState<TerminalLine[]>([
+ *   { id: '1', type: 'output', content: 'Welcome to Bear Terminal!' },
+ * ]);
+ *
+ * <Terminal
+ *   lines={lines}
+ *   onCommand={(cmd) => {
+ *     setLines([
+ *       ...lines,
+ *       { id: Date.now().toString(), type: 'input', content: cmd },
+ *       { id: (Date.now() + 1).toString(), type: 'output', content: `Executed: ${cmd}` },
+ *     ]);
+ *   }}
+ *   user="bear"
+ *   host="forge"
+ * />
+ * ```
+ */
+export declare const Terminal: FC<TerminalProps>;
+export default Terminal;

package/dist/components/Terminal/Terminal.js

@@ -0,0 +1,155 @@
+import { jsxs as r, jsx as t, Fragment as z } from "react/jsx-runtime";
+import { useState as u, useRef as I, useEffect as G, useCallback as y } from "react";
+import { cn as O } from "../../utils/cn.js";
+import { Typography as W } from "../Typography/Typography.js";
+import { Spinner as Y } from "../Spinner/Spinner.js";
+import { TERMINAL_DEFAULTS as p, TERMINAL_THEMES as q, LINE_TYPE_COLORS as J } from "./Terminal.const.js";
+const se = ({
+  lines: x,
+  onCommand: m,
+  cwd: C = p.CWD,
+  user: H = p.USER,
+  host: S = p.HOST,
+  prompt: g,
+  title: D = p.TITLE,
+  showHeader: N = !0,
+  showLineNumbers: L = !1,
+  showTimestamps: R = !1,
+  readOnly: f = !1,
+  height: h = p.HEIGHT,
+  theme: A = "dark",
+  history: M,
+  onHistoryChange: _,
+  autoScroll: v = !0,
+  className: $,
+  testId: K,
+  isLoading: b = !1
+}) => {
+  const l = q[A], [o, a] = u(""), [c, i] = u(-1), [U, j] = u([]), n = M ?? U, w = _ ?? j, T = I(null), d = I(null);
+  G(() => {
+    v && d.current && (d.current.scrollTop = d.current.scrollHeight);
+  }, [x, v]);
+  const B = y(() => {
+    var e;
+    f || (e = T.current) == null || e.focus();
+  }, [f]), E = y(() => {
+    o.trim() && m && (m(o.trim()), w([...n, o.trim()]), i(-1), a(""));
+  }, [o, m, n, w]), F = y((e) => {
+    if (e.key === "Enter")
+      E();
+    else if (e.key === "ArrowUp") {
+      if (e.preventDefault(), n.length > 0) {
+        const s = c === -1 ? n.length - 1 : Math.max(0, c - 1);
+        i(s), a(n[s]);
+      }
+    } else if (e.key === "ArrowDown") {
+      if (e.preventDefault(), c !== -1) {
+        const s = c + 1;
+        s >= n.length ? (i(-1), a("")) : (i(s), a(n[s]));
+      }
+    } else e.key === "c" && e.ctrlKey && (a(""), i(-1));
+  }, [E, n, c]), k = () => g || /* @__PURE__ */ r(z, { children: [
+    /* @__PURE__ */ r("span", { style: { color: l.prompt }, children: [
+      H,
+      "@",
+      S
+    ] }),
+    /* @__PURE__ */ t("span", { className: "opacity-50", children: ":" }),
+    /* @__PURE__ */ t("span", { className: "text-blue-400", children: C }),
+    /* @__PURE__ */ t("span", { className: "opacity-50", children: "$" })
+  ] }), P = (e, s) => {
+    const V = J[e.type];
+    return /* @__PURE__ */ r(
+      "div",
+      {
+        className: "flex gap-2 py-0.5 hover:bg-white/5",
+        children: [
+          L && /* @__PURE__ */ t("span", { className: "opacity-30 w-8 text-right select-none", children: s + 1 }),
+          R && e.timestamp && /* @__PURE__ */ r("span", { className: "opacity-30 select-none", children: [
+            "[",
+            e.timestamp.toLocaleTimeString(),
+            "]"
+          ] }),
+          e.type === "input" ? /* @__PURE__ */ r("div", { className: "flex gap-2", children: [
+            /* @__PURE__ */ t("span", { className: "flex gap-1 select-none", children: e.prefix || k() }),
+            /* @__PURE__ */ t("span", { children: e.content })
+          ] }) : /* @__PURE__ */ t("span", { style: { color: V }, children: e.content })
+        ]
+      },
+      e.id
+    );
+  };
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: O(
+        "Bear-Terminal",
+        "rounded-lg overflow-hidden font-mono text-sm",
+        $
+      ),
+      style: {
+        backgroundColor: l.bg,
+        color: l.text,
+        border: `1px solid ${l.border}`,
+        height: typeof h == "number" ? `${h}px` : h
+      },
+      "data-testid": K,
+      onClick: B,
+      children: [
+        N && /* @__PURE__ */ r(
+          "div",
+          {
+            className: "flex items-center gap-2 px-4 py-2",
+            style: { backgroundColor: l.header, borderBottom: `1px solid ${l.border}` },
+            children: [
+              /* @__PURE__ */ r("div", { className: "flex gap-1.5", children: [
+                /* @__PURE__ */ t("div", { className: "w-3 h-3 rounded-full bg-red-500" }),
+                /* @__PURE__ */ t("div", { className: "w-3 h-3 rounded-full bg-yellow-500" }),
+                /* @__PURE__ */ t("div", { className: "w-3 h-3 rounded-full bg-green-500" })
+              ] }),
+              /* @__PURE__ */ t(W, { variant: "caption", className: "flex-1 text-center opacity-60", children: D }),
+              /* @__PURE__ */ t("div", { className: "w-14" }),
+              " "
+            ]
+          }
+        ),
+        /* @__PURE__ */ r(
+          "div",
+          {
+            ref: d,
+            className: "overflow-y-auto p-4",
+            style: { height: N ? "calc(100% - 40px)" : "100%" },
+            children: [
+              x.map((e, s) => P(e, s)),
+              b && /* @__PURE__ */ r("div", { className: "flex items-center gap-2 py-0.5", children: [
+                /* @__PURE__ */ t(Y, { size: "sm" }),
+                /* @__PURE__ */ t("span", { className: "opacity-50", children: "Processing..." })
+              ] }),
+              !f && /* @__PURE__ */ r("div", { className: "flex gap-2 py-0.5", children: [
+                /* @__PURE__ */ t("span", { className: "flex gap-1 select-none", children: k() }),
+                /* @__PURE__ */ t(
+                  "input",
+                  {
+                    ref: T,
+                    type: "text",
+                    value: o,
+                    onChange: (e) => a(e.target.value),
+                    onKeyDown: F,
+                    className: "flex-1 bg-transparent outline-none caret-current",
+                    style: { color: "inherit" },
+                    autoComplete: "off",
+                    spellCheck: !1,
+                    disabled: b
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  se as Terminal
+};

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

@@ -0,0 +1,49 @@
+import { ReactNode } from 'react';
+export type TerminalLineType = 'input' | 'output' | 'error' | 'success' | 'warning' | 'info' | 'system';
+export interface TerminalLine {
+    id: string;
+    type: TerminalLineType;
+    content: string | ReactNode;
+    timestamp?: Date;
+    prefix?: string;
+}
+export interface TerminalProps {
+    /** Array of terminal lines */
+    lines: TerminalLine[];
+    /** Callback when user submits a command */
+    onCommand?: (command: string) => void;
+    /** Current working directory to display */
+    cwd?: string;
+    /** Username to display */
+    user?: string;
+    /** Hostname to display */
+    host?: string;
+    /** Shell prompt prefix (overrides user@host) */
+    prompt?: string | ReactNode;
+    /** Title in the header */
+    title?: string;
+    /** Show header with controls */
+    showHeader?: boolean;
+    /** Show line numbers */
+    showLineNumbers?: boolean;
+    /** Show timestamps */
+    showTimestamps?: boolean;
+    /** Read-only mode (no input) */
+    readOnly?: boolean;
+    /** Height of the terminal */
+    height?: number | string;
+    /** Theme variant */
+    theme?: 'dark' | 'light' | 'matrix';
+    /** Command history */
+    history?: string[];
+    /** Callback when history changes */
+    onHistoryChange?: (history: string[]) => void;
+    /** Auto-scroll to bottom */
+    autoScroll?: boolean;
+    /** Custom class name */
+    className?: string;
+    /** Test ID */
+    testId?: string;
+    /** Loading state */
+    isLoading?: boolean;
+}

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

@@ -0,0 +1,2 @@
+export { Terminal } from './Terminal';
+export type { TerminalProps, TerminalLine, TerminalLineType } from './Terminal.types';

package/dist/components/Tour/Tour.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("react"),L=require("../../utils/cn.cjs"),U=require("../Button/Button.cjs"),v=require("../Typography/Typography.cjs"),a=require("./Tour.const.cjs"),G=({steps:T,open:u=!1,current:A,onClose:d,onStepChange:b,onFinish:f,showIndicators:N=a.TOUR_DEFAULTS.SHOW_INDICATORS,showCloseButton:I=a.TOUR_DEFAULTS.SHOW_CLOSE_BUTTON,showSkipButton:w=a.TOUR_DEFAULTS.SHOW_SKIP_BUTTON,showPrevButton:P=a.TOUR_DEFAULTS.SHOW_PREV_BUTTON,finishText:D=a.TOUR_DEFAULTS.FINISH_TEXT,skipText:y=a.TOUR_DEFAULTS.SKIP_TEXT,maskOpacity:g=a.TOUR_DEFAULTS.MASK_OPACITY,maskColor:m=a.TOUR_DEFAULTS.MASK_COLOR,animated:E=a.TOUR_DEFAULTS.ANIMATED,className:k,testId:j})=>{const[B,x]=s.useState(0),[r,F]=s.useState(null),[R,M]=s.useState({top:0,left:0}),z=s.useRef(null),c=A??B,e=T[c],_=c===T.length-1,H=c===0,O=s.useCallback(()=>e?typeof e.target=="function"?e.target():document.querySelector(e.target):null,[e]),S=s.useCallback(()=>{const t=O();if(t){const i=t.getBoundingClientRect();F(i)}},[O]);s.useEffect(()=>{if(!r||!e)return;const t=e.placement||a.TOUR_DEFAULTS.PLACEMENT,i=e.spotlightPadding??a.TOUR_DEFAULTS.SPOTLIGHT_PADDING;let l=0,n=0;switch(t){case"top":case"top-start":case"top-end":l=r.top-a.TOUR_TOOLTIP_OFFSET-i,n=t==="top"?r.left+r.width/2:t==="top-start"?r.left:r.right;break;case"bottom":case"bottom-start":case"bottom-end":l=r.bottom+a.TOUR_TOOLTIP_OFFSET+i,n=t==="bottom"?r.left+r.width/2:t==="bottom-start"?r.left:r.right;break;case"left":case"left-start":case"left-end":n=r.left-a.TOUR_TOOLTIP_OFFSET-i,l=t==="left"?r.top+r.height/2:t==="left-start"?r.top:r.bottom;break;case"right":case"right-start":case"right-end":n=r.right+a.TOUR_TOOLTIP_OFFSET+i,l=t==="right"?r.top+r.height/2:t==="right-start"?r.top:r.bottom;break}M({top:l,left:n})},[r,e]),s.useEffect(()=>{if(!u)return;S();const t=()=>S();return window.addEventListener("resize",t),window.addEventListener("scroll",t,!0),()=>{window.removeEventListener("resize",t),window.removeEventListener("scroll",t,!0)}},[u,c,S]),s.useEffect(()=>{if(!u)return;const t=O();t&&t.scrollIntoView({behavior:"smooth",block:"center"})},[u,c,O]);const X=s.useCallback(async()=>{var t,i,l;if(e!=null&&e.onAfterStep&&await e.onAfterStep(),_)f==null||f(),d==null||d();else{const n=c+1;x(n),b==null||b(n),(t=T[n])!=null&&t.onBeforeStep&&await((l=(i=T[n]).onBeforeStep)==null?void 0:l.call(i))}},[c,_,e,T,f,d,b]),q=s.useCallback(async()=>{var i,l,n;e!=null&&e.onAfterStep&&await e.onAfterStep();const t=c-1;x(t),b==null||b(t),(i=T[t])!=null&&i.onBeforeStep&&await((n=(l=T[t]).onBeforeStep)==null?void 0:n.call(l))},[c,e,T,b]),p=s.useCallback(()=>{d==null||d()},[d]),W=(e==null?void 0:e.placement)||a.TOUR_DEFAULTS.PLACEMENT,h=(e==null?void 0:e.spotlightPadding)??a.TOUR_DEFAULTS.SPOTLIGHT_PADDING;return!u||!e?null:o.jsxs("div",{className:L.cn("Bear-Tour",k),"data-testid":j,children:[o.jsx("div",{className:"Bear-Tour__overlay bear-fixed bear-inset-0",style:{zIndex:a.TOUR_Z_INDEX.OVERLAY,backgroundColor:m,opacity:g,transition:E?"opacity 0.3s":"none"},onClick:p}),r&&o.jsx("div",{className:"Bear-Tour__spotlight bear-fixed bear-pointer-events-none",style:{zIndex:a.TOUR_Z_INDEX.SPOTLIGHT,top:r.top-h,left:r.left-h,width:r.width+h*2,height:r.height+h*2,borderRadius:8,boxShadow:`0 0 0 9999px ${m}`,opacity:g,transition:E?"all 0.3s ease":"none"}}),o.jsxs("div",{ref:z,className:"Bear-Tour__tooltip bear-fixed bear-bg-white dark:bear-bg-neutral-800 bear-rounded-lg bear-shadow-xl bear-p-4",style:{zIndex:a.TOUR_Z_INDEX.TOOLTIP,top:R.top,left:R.left,minWidth:280,maxWidth:360,...a.TOUR_PLACEMENT_STYLES[W],transition:E?"all 0.3s ease":"none"},children:[I&&o.jsx("button",{className:"Bear-Tour__close bear-absolute bear-top-2 bear-right-2 bear-p-1 bear-text-neutral-400 hover:bear-text-neutral-600 dark:hover:bear-text-neutral-300 bear-cursor-pointer bear-bg-transparent bear-border-none",onClick:p,"aria-label":"Close tour",children:o.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:o.jsx("path",{d:"M18 6L6 18M6 6l12 12"})})}),o.jsxs("div",{className:"Bear-Tour__content bear-pr-6",children:[e.title&&o.jsx(v.Typography,{variant:"h6",className:"bear-mb-2",children:e.title}),e.description&&o.jsx(v.Typography,{variant:"body2",color:"secondary",className:"bear-mb-4",children:e.description}),e.content]}),o.jsxs("div",{className:"Bear-Tour__footer bear-flex bear-items-center bear-justify-between bear-mt-4 bear-pt-3 bear-border-t bear-border-neutral-200 dark:bear-border-neutral-700",children:[N&&o.jsx("div",{className:"bear-flex bear-gap-1.5",children:T.map((t,i)=>o.jsx("div",{className:L.cn("bear-w-2 bear-h-2 bear-rounded-full bear-transition-colors",i===c?"bear-bg-[var(--bear-primary-500)]":"bear-bg-neutral-300 dark:bear-bg-neutral-600")},i))}),o.jsxs("div",{className:"bear-flex bear-gap-2 bear-ml-auto",children:[w&&!_&&o.jsx(U.Button,{variant:"ghost",size:"sm",onClick:p,children:y}),P&&!H&&o.jsx(U.Button,{variant:"outline",size:"sm",onClick:q,children:e.prevText||a.TOUR_DEFAULTS.PREV_TEXT}),o.jsx(U.Button,{variant:"primary",size:"sm",onClick:X,children:_?D:e.nextText||a.TOUR_DEFAULTS.NEXT_TEXT})]})]})]})]})};exports.Tour=G;

package/dist/components/Tour/Tour.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={SHOW_INDICATORS:!0,SHOW_CLOSE_BUTTON:!0,SHOW_SKIP_BUTTON:!0,SHOW_PREV_BUTTON:!0,FINISH_TEXT:"Finish",SKIP_TEXT:"Skip",NEXT_TEXT:"Next",PREV_TEXT:"Back",MASK_OPACITY:.5,MASK_COLOR:"#000000",SPOTLIGHT_PADDING:8,ANIMATED:!0,PLACEMENT:"bottom"},r={OVERLAY:99990,SPOTLIGHT:99991,TOOLTIP:99992},T=12,a={top:{transform:"translate(-50%, -100%)"},"top-start":{transform:"translate(0, -100%)"},"top-end":{transform:"translate(-100%, -100%)"},bottom:{transform:"translate(-50%, 0)"},"bottom-start":{transform:"translate(0, 0)"},"bottom-end":{transform:"translate(-100%, 0)"},left:{transform:"translate(-100%, -50%)"},"left-start":{transform:"translate(-100%, 0)"},"left-end":{transform:"translate(-100%, -100%)"},right:{transform:"translate(0, -50%)"},"right-start":{transform:"translate(0, 0)"},"right-end":{transform:"translate(0, -100%)"}};exports.TOUR_DEFAULTS=t;exports.TOUR_PLACEMENT_STYLES=a;exports.TOUR_TOOLTIP_OFFSET=T;exports.TOUR_Z_INDEX=r;

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

@@ -0,0 +1,25 @@
+import { TourPlacement } from './Tour.types';
+export declare const TOUR_DEFAULTS: {
+    readonly SHOW_INDICATORS: true;
+    readonly SHOW_CLOSE_BUTTON: true;
+    readonly SHOW_SKIP_BUTTON: true;
+    readonly SHOW_PREV_BUTTON: true;
+    readonly FINISH_TEXT: "Finish";
+    readonly SKIP_TEXT: "Skip";
+    readonly NEXT_TEXT: "Next";
+    readonly PREV_TEXT: "Back";
+    readonly MASK_OPACITY: 0.5;
+    readonly MASK_COLOR: "#000000";
+    readonly SPOTLIGHT_PADDING: 8;
+    readonly ANIMATED: true;
+    readonly PLACEMENT: TourPlacement;
+};
+export declare const TOUR_Z_INDEX: {
+    readonly OVERLAY: 99990;
+    readonly SPOTLIGHT: 99991;
+    readonly TOOLTIP: 99992;
+};
+export declare const TOUR_TOOLTIP_OFFSET = 12;
+export declare const TOUR_PLACEMENT_STYLES: Record<TourPlacement, {
+    transform: string;
+}>;

package/dist/components/Tour/Tour.const.js

@@ -0,0 +1,38 @@
+const t = {
+  SHOW_INDICATORS: !0,
+  SHOW_CLOSE_BUTTON: !0,
+  SHOW_SKIP_BUTTON: !0,
+  SHOW_PREV_BUTTON: !0,
+  FINISH_TEXT: "Finish",
+  SKIP_TEXT: "Skip",
+  NEXT_TEXT: "Next",
+  PREV_TEXT: "Back",
+  MASK_OPACITY: 0.5,
+  MASK_COLOR: "#000000",
+  SPOTLIGHT_PADDING: 8,
+  ANIMATED: !0,
+  PLACEMENT: "bottom"
+}, r = {
+  OVERLAY: 99990,
+  SPOTLIGHT: 99991,
+  TOOLTIP: 99992
+}, a = 12, T = {
+  top: { transform: "translate(-50%, -100%)" },
+  "top-start": { transform: "translate(0, -100%)" },
+  "top-end": { transform: "translate(-100%, -100%)" },
+  bottom: { transform: "translate(-50%, 0)" },
+  "bottom-start": { transform: "translate(0, 0)" },
+  "bottom-end": { transform: "translate(-100%, 0)" },
+  left: { transform: "translate(-100%, -50%)" },
+  "left-start": { transform: "translate(-100%, 0)" },
+  "left-end": { transform: "translate(-100%, -100%)" },
+  right: { transform: "translate(0, -50%)" },
+  "right-start": { transform: "translate(0, 0)" },
+  "right-end": { transform: "translate(0, -100%)" }
+};
+export {
+  t as TOUR_DEFAULTS,
+  T as TOUR_PLACEMENT_STYLES,
+  a as TOUR_TOOLTIP_OFFSET,
+  r as TOUR_Z_INDEX
+};

package/dist/components/Tour/Tour.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+import { TourProps } from './Tour.types';
+/**
+ * Tour - Feature tour/onboarding walkthrough
+ *
+ * @example
+ * ```tsx
+ * const steps = [
+ *   { target: '#welcome-btn', title: 'Welcome!', description: 'Click here to start' },
+ *   { target: '#settings', title: 'Settings', description: 'Configure your preferences' },
+ * ];
+ *
+ * <Tour steps={steps} open={showTour} onClose={() => setShowTour(false)} />
+ * ```
+ */
+export declare const Tour: FC<TourProps>;
+export default Tour;

package/dist/components/Tour/Tour.js

@@ -0,0 +1,179 @@
+import { jsxs as u, jsx as n } from "react/jsx-runtime";
+import { useState as w, useRef as F, useCallback as T, useEffect as x } from "react";
+import { cn as y } from "../../utils/cn.js";
+import { Button as O } from "../Button/Button.js";
+import { Typography as A } from "../Typography/Typography.js";
+import { TOUR_DEFAULTS as o, TOUR_TOOLTIP_OFFSET as _, TOUR_Z_INDEX as S, TOUR_PLACEMENT_STYLES as J } from "./Tour.const.js";
+const ot = ({
+  steps: s,
+  open: f = !1,
+  current: B,
+  onClose: d,
+  onStepChange: b,
+  onFinish: m,
+  showIndicators: R = o.SHOW_INDICATORS,
+  showCloseButton: U = o.SHOW_CLOSE_BUTTON,
+  showSkipButton: z = o.SHOW_SKIP_BUTTON,
+  showPrevButton: D = o.SHOW_PREV_BUTTON,
+  finishText: H = o.FINISH_TEXT,
+  skipText: M = o.SKIP_TEXT,
+  maskOpacity: I = o.MASK_OPACITY,
+  maskColor: P = o.MASK_COLOR,
+  animated: v = o.ANIMATED,
+  className: W,
+  testId: X
+}) => {
+  const [G, L] = w(0), [r, K] = w(null), [k, V] = w({ top: 0, left: 0 }), j = F(null), c = B ?? G, t = s[c], h = c === s.length - 1, Y = c === 0, p = T(() => t ? typeof t.target == "function" ? t.target() : document.querySelector(t.target) : null, [t]), E = T(() => {
+    const e = p();
+    if (e) {
+      const a = e.getBoundingClientRect();
+      K(a);
+    }
+  }, [p]);
+  x(() => {
+    if (!r || !t) return;
+    const e = t.placement || o.PLACEMENT, a = t.spotlightPadding ?? o.SPOTLIGHT_PADDING;
+    let l = 0, i = 0;
+    switch (e) {
+      case "top":
+      case "top-start":
+      case "top-end":
+        l = r.top - _ - a, i = e === "top" ? r.left + r.width / 2 : e === "top-start" ? r.left : r.right;
+        break;
+      case "bottom":
+      case "bottom-start":
+      case "bottom-end":
+        l = r.bottom + _ + a, i = e === "bottom" ? r.left + r.width / 2 : e === "bottom-start" ? r.left : r.right;
+        break;
+      case "left":
+      case "left-start":
+      case "left-end":
+        i = r.left - _ - a, l = e === "left" ? r.top + r.height / 2 : e === "left-start" ? r.top : r.bottom;
+        break;
+      case "right":
+      case "right-start":
+      case "right-end":
+        i = r.right + _ + a, l = e === "right" ? r.top + r.height / 2 : e === "right-start" ? r.top : r.bottom;
+        break;
+    }
+    V({ top: l, left: i });
+  }, [r, t]), x(() => {
+    if (!f) return;
+    E();
+    const e = () => E();
+    return window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [f, c, E]), x(() => {
+    if (!f) return;
+    const e = p();
+    e && e.scrollIntoView({ behavior: "smooth", block: "center" });
+  }, [f, c, p]);
+  const q = T(async () => {
+    var e, a, l;
+    if (t != null && t.onAfterStep && await t.onAfterStep(), h)
+      m == null || m(), d == null || d();
+    else {
+      const i = c + 1;
+      L(i), b == null || b(i), (e = s[i]) != null && e.onBeforeStep && await ((l = (a = s[i]).onBeforeStep) == null ? void 0 : l.call(a));
+    }
+  }, [c, h, t, s, m, d, b]), Z = T(async () => {
+    var a, l, i;
+    t != null && t.onAfterStep && await t.onAfterStep();
+    const e = c - 1;
+    L(e), b == null || b(e), (a = s[e]) != null && a.onBeforeStep && await ((i = (l = s[e]).onBeforeStep) == null ? void 0 : i.call(l));
+  }, [c, t, s, b]), N = T(() => {
+    d == null || d();
+  }, [d]), $ = (t == null ? void 0 : t.placement) || o.PLACEMENT, g = (t == null ? void 0 : t.spotlightPadding) ?? o.SPOTLIGHT_PADDING;
+  return !f || !t ? null : /* @__PURE__ */ u(
+    "div",
+    {
+      className: y("Bear-Tour", W),
+      "data-testid": X,
+      children: [
+        /* @__PURE__ */ n(
+          "div",
+          {
+            className: "Bear-Tour__overlay bear-fixed bear-inset-0",
+            style: {
+              zIndex: S.OVERLAY,
+              backgroundColor: P,
+              opacity: I,
+              transition: v ? "opacity 0.3s" : "none"
+            },
+            onClick: N
+          }
+        ),
+        r && /* @__PURE__ */ n(
+          "div",
+          {
+            className: "Bear-Tour__spotlight bear-fixed bear-pointer-events-none",
+            style: {
+              zIndex: S.SPOTLIGHT,
+              top: r.top - g,
+              left: r.left - g,
+              width: r.width + g * 2,
+              height: r.height + g * 2,
+              borderRadius: 8,
+              boxShadow: `0 0 0 9999px ${P}`,
+              opacity: I,
+              transition: v ? "all 0.3s ease" : "none"
+            }
+          }
+        ),
+        /* @__PURE__ */ u(
+          "div",
+          {
+            ref: j,
+            className: "Bear-Tour__tooltip bear-fixed bear-bg-white dark:bear-bg-neutral-800 bear-rounded-lg bear-shadow-xl bear-p-4",
+            style: {
+              zIndex: S.TOOLTIP,
+              top: k.top,
+              left: k.left,
+              minWidth: 280,
+              maxWidth: 360,
+              ...J[$],
+              transition: v ? "all 0.3s ease" : "none"
+            },
+            children: [
+              U && /* @__PURE__ */ n(
+                "button",
+                {
+                  className: "Bear-Tour__close bear-absolute bear-top-2 bear-right-2 bear-p-1 bear-text-neutral-400 hover:bear-text-neutral-600 dark:hover:bear-text-neutral-300 bear-cursor-pointer bear-bg-transparent bear-border-none",
+                  onClick: N,
+                  "aria-label": "Close tour",
+                  children: /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ n("path", { d: "M18 6L6 18M6 6l12 12" }) })
+                }
+              ),
+              /* @__PURE__ */ u("div", { className: "Bear-Tour__content bear-pr-6", children: [
+                t.title && /* @__PURE__ */ n(A, { variant: "h6", className: "bear-mb-2", children: t.title }),
+                t.description && /* @__PURE__ */ n(A, { variant: "body2", color: "secondary", className: "bear-mb-4", children: t.description }),
+                t.content
+              ] }),
+              /* @__PURE__ */ u("div", { className: "Bear-Tour__footer bear-flex bear-items-center bear-justify-between bear-mt-4 bear-pt-3 bear-border-t bear-border-neutral-200 dark:bear-border-neutral-700", children: [
+                R && /* @__PURE__ */ n("div", { className: "bear-flex bear-gap-1.5", children: s.map((e, a) => /* @__PURE__ */ n(
+                  "div",
+                  {
+                    className: y(
+                      "bear-w-2 bear-h-2 bear-rounded-full bear-transition-colors",
+                      a === c ? "bear-bg-[var(--bear-primary-500)]" : "bear-bg-neutral-300 dark:bear-bg-neutral-600"
+                    )
+                  },
+                  a
+                )) }),
+                /* @__PURE__ */ u("div", { className: "bear-flex bear-gap-2 bear-ml-auto", children: [
+                  z && !h && /* @__PURE__ */ n(O, { variant: "ghost", size: "sm", onClick: N, children: M }),
+                  D && !Y && /* @__PURE__ */ n(O, { variant: "outline", size: "sm", onClick: Z, children: t.prevText || o.PREV_TEXT }),
+                  /* @__PURE__ */ n(O, { variant: "primary", size: "sm", onClick: q, children: h ? H : t.nextText || o.NEXT_TEXT })
+                ] })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  ot as Tour
+};

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

@@ -0,0 +1,80 @@
+import { ReactNode } from 'react';
+export interface TourStep {
+    /** Target element selector or ref */
+    target: string | (() => HTMLElement | null);
+    /** Step title */
+    title?: ReactNode;
+    /** Step description */
+    description?: ReactNode;
+    /** Custom content */
+    content?: ReactNode;
+    /** Placement of the tooltip */
+    placement?: TourPlacement;
+    /** Disable interaction with target */
+    disableInteraction?: boolean;
+    /** Show spotlight on target */
+    spotlightPadding?: number;
+    /** Custom next button text */
+    nextText?: string;
+    /** Custom prev button text */
+    prevText?: string;
+    /** Before step callback */
+    onBeforeStep?: () => Promise<void> | void;
+    /** After step callback */
+    onAfterStep?: () => Promise<void> | void;
+}
+export type TourPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+export interface TourProps {
+    /** Array of tour steps */
+    steps: TourStep[];
+    /** Whether tour is open */
+    open?: boolean;
+    /** Current step index */
+    current?: number;
+    /** Called when tour closes */
+    onClose?: () => void;
+    /** Called when step changes */
+    onStepChange?: (current: number) => void;
+    /** Called when tour finishes */
+    onFinish?: () => void;
+    /** Show step indicators */
+    showIndicators?: boolean;
+    /** Show close button */
+    showCloseButton?: boolean;
+    /** Show skip button */
+    showSkipButton?: boolean;
+    /** Show prev button */
+    showPrevButton?: boolean;
+    /** Finish button text */
+    finishText?: string;
+    /** Skip button text */
+    skipText?: string;
+    /** Custom class name */
+    className?: string;
+    /** Mask/overlay opacity */
+    maskOpacity?: number;
+    /** Mask color */
+    maskColor?: string;
+    /** Animation enabled */
+    animated?: boolean;
+    /** Test ID */
+    testId?: string;
+}
+export interface UseTourReturn {
+    /** Start the tour */
+    start: () => void;
+    /** Stop the tour */
+    stop: () => void;
+    /** Go to next step */
+    next: () => void;
+    /** Go to previous step */
+    prev: () => void;
+    /** Go to specific step */
+    goTo: (step: number) => void;
+    /** Whether tour is active */
+    isActive: boolean;
+    /** Current step index */
+    currentStep: number;
+    /** Total steps count */
+    totalSteps: number;
+}

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

@@ -0,0 +1,4 @@
+export { Tour, default } from './Tour';
+export { useTour } from './useTour';
+export * from './Tour.types';
+export * from './Tour.const';

package/dist/components/Tour/useTour.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),b=l=>{const[o,a]=t.useState(!1),[c,n]=t.useState(0),u=t.useCallback(()=>{n(0),a(!0)},[]),s=t.useCallback(()=>{a(!1),n(0)},[]),r=t.useCallback(()=>{c<l.length-1?n(e=>e+1):s()},[c,l.length,s]),i=t.useCallback(()=>{c>0&&n(e=>e-1)},[c]),g=t.useCallback(e=>{e>=0&&e<l.length&&n(e)},[l.length]);return{start:u,stop:s,next:r,prev:i,goTo:g,isActive:o,currentStep:c,totalSteps:l.length}};exports.useTour=b;

package/dist/components/Tour/useTour.d.ts

@@ -0,0 +1,14 @@
+import { UseTourReturn, TourStep } from './Tour.types';
+/**
+ * useTour - Hook to control tour programmatically
+ *
+ * @example
+ * ```tsx
+ * const steps = [...];
+ * const { start, stop, next, prev, isActive, currentStep } = useTour(steps);
+ *
+ * <Tour steps={steps} open={isActive} current={currentStep} onClose={stop} />
+ * <Button onClick={start}>Start Tour</Button>
+ * ```
+ */
+export declare const useTour: (steps: TourStep[]) => UseTourReturn;