@forgedevstack/bear 1.0.6 → 1.0.8

package/dist/components/EmojiPicker/EmojiPicker.js

@@ -0,0 +1,63 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { useState as x } from "react";
+import { cn as t } from "../../utils/cn.js";
+import { BEAR_EMOJIS as d } from "./EmojiPicker.const.js";
+const h = {
+  sm: "bear-w-8 bear-h-8 bear-text-lg",
+  md: "bear-w-10 bear-h-10 bear-text-xl",
+  lg: "bear-w-12 bear-h-12 bear-text-2xl"
+}, i = Object.keys(d), u = ({
+  onSelect: a,
+  size: s = "md",
+  maxHeight: b = 280,
+  className: n
+}) => {
+  const [o, c] = x(i[0]), g = d[o] ?? [];
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      className: t(
+        "Bear-EmojiPicker bear-flex bear-flex-col bear-rounded-lg bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-shadow-lg bear-overflow-hidden",
+        n
+      ),
+      children: [
+        /* @__PURE__ */ e("div", { className: "bear-flex bear-gap-1 bear-p-2 bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-overflow-x-auto", children: i.map((r) => /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: () => c(r),
+            className: t(
+              "bear-px-3 bear-py-1.5 bear-rounded-md bear-text-sm bear-font-medium bear-transition-colors bear-shrink-0",
+              o === r ? "bear-bg-gray-200 dark:bear-bg-zinc-700 bear-text-gray-900 dark:bear-text-white" : "bear-text-gray-600 dark:bear-text-zinc-400 hover:bear-text-gray-900 dark:hover:bear-text-white hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700/50"
+            ),
+            children: r
+          },
+          r
+        )) }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "bear-p-2 bear-overflow-y-auto bear-grid bear-grid-cols-8 bear-gap-1 bear-bg-gray-50 dark:bear-bg-zinc-900/50",
+            style: { maxHeight: typeof b == "number" ? `${b}px` : b },
+            children: g.map((r, l) => /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                onClick: () => a == null ? void 0 : a(r),
+                className: t(
+                  "bear-flex bear-items-center bear-justify-center bear-rounded-lg bear-transition-colors hover:bear-bg-gray-200 dark:hover:bear-bg-zinc-700",
+                  h[s]
+                ),
+                children: r
+              },
+              `${r}-${l}`
+            ))
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  u as EmojiPicker
+};

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

@@ -0,0 +1,6 @@
+export interface EmojiPickerProps {
+    onSelect?: (emoji: string) => void;
+    size?: 'sm' | 'md' | 'lg';
+    maxHeight?: string | number;
+    className?: string;
+}

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

@@ -0,0 +1,3 @@
+export { EmojiPicker } from './EmojiPicker';
+export { BEAR_EMOJIS } from './EmojiPicker.const';
+export type { EmojiPickerProps } from './EmojiPicker.types';

package/dist/components/FloatingChat/FloatingChat.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),G=require("react-dom"),r=require("../../utils/cn.cjs"),U=require("../../context/BearProvider.cjs"),g=require("../Button/Button.cjs"),P=require("../Avatar/Avatar.cjs"),o=require("../Typography/Typography.cjs"),M=require("../Badge/Badge.cjs"),l=require("../Icon/index.cjs"),$=require("../Chat/Chat.cjs"),t=require("./FloatingChat.const.cjs"),Z=({messages:d,onSend:j,isLoading:b=!1,isTyping:S=!1,title:h=t.FLOATING_CHAT_DEFAULTS.TITLE,subtitle:_=t.FLOATING_CHAT_DEFAULTS.SUBTITLE,avatar:w,position:m=t.FLOATING_CHAT_DEFAULTS.POSITION,bottom:x=t.FLOATING_CHAT_DEFAULTS.BOTTOM,side:u=t.FLOATING_CHAT_DEFAULTS.SIDE,defaultOpen:E=!1,open:F,onOpenChange:s,trigger:T,badgeCount:i,header:y,welcomeMessage:p=t.FLOATING_CHAT_DEFAULTS.WELCOME_MESSAGE,poweredBy:A,className:L,testId:D})=>{const{mode:q}=U.useBear(),B=q==="dark",[C,v]=c.useState(E),[N,n]=c.useState(!1),a=F??C,I=c.useCallback(()=>{const f=!a;n(!0),v(f),s==null||s(f),setTimeout(()=>n(!1),300)},[a,s]),H=c.useCallback(()=>{n(!0),v(!1),s==null||s(!1),setTimeout(()=>n(!1),300)},[s]),k=d.length===0&&p?[{id:"welcome",content:p,sender:"bot",timestamp:new Date}]:d,z={bottom:`${x}px`,[m==="bottom-right"?"right":"left"]:`${u}px`},O={bottom:`${x+70}px`,[m==="bottom-right"?"right":"left"]:`${u}px`,width:t.CHAT_WINDOW_SIZE.width,height:t.CHAT_WINDOW_SIZE.height},W=e.jsxs("div",{className:r.cn("Bear-FloatingChat",L),"data-testid":D,children:[(a||N)&&e.jsxs("div",{className:r.cn("fixed z-50 rounded-2xl overflow-hidden shadow-2xl","transition-all duration-300 ease-out",a&&!N?"opacity-100 translate-y-0 scale-100":"opacity-0 translate-y-4 scale-95 pointer-events-none"),style:O,children:[y?e.jsx("div",{className:r.cn("px-4 py-3",B?"bg-gray-800":"bg-[var(--bear-primary-500)]"),children:y}):e.jsxs("div",{className:r.cn("px-4 py-3 flex items-center gap-3","bg-[var(--bear-primary-500)] text-white"),children:[e.jsx(P.Avatar,{src:w,initials:h[0],size:"sm",className:"ring-2 ring-white/20"}),e.jsxs("div",{className:"flex-1",children:[e.jsx(o.Typography,{variant:"subtitle2",className:"text-white font-semibold",children:h}),e.jsx(o.Typography,{variant:"caption",className:"text-white/70",children:_})]}),e.jsx(g.Button,{variant:"ghost",size:"sm",onClick:H,className:"!text-white hover:!bg-white/10",children:e.jsx(l.BearIcons.XIcon,{size:18})})]}),e.jsx($.Chat,{messages:k,onSend:j,isLoading:b,isTyping:S,showAvatars:!1,height:t.CHAT_WINDOW_SIZE.height-140,className:"!rounded-none !border-0"}),A&&e.jsx("div",{className:"px-3 py-2 text-center border-t border-gray-200 dark:border-gray-700",children:e.jsxs(o.Typography,{variant:"caption",className:"opacity-50",children:["Powered by ",A]})})]}),e.jsx("div",{className:"fixed z-50",style:z,children:T?e.jsx("div",{onClick:I,children:T}):e.jsxs("div",{className:"relative",children:[e.jsx(g.Button,{variant:"primary",onClick:I,className:r.cn("!w-14 !h-14 !rounded-full !p-0 shadow-lg","transition-transform duration-200",a&&"rotate-180"),children:a?e.jsx(l.BearIcons.XIcon,{size:24}):e.jsx(l.BearIcons.ChatIcon,{size:24})}),!a&&i&&i>0&&e.jsx(M.Badge,{variant:"danger",size:"sm",className:"absolute -top-1 -right-1 !min-w-[20px] !h-5",children:i>99?"99+":i})]})})]});return typeof document>"u"?null:G.createPortal(W,document.body)};exports.FloatingChat=Z;

package/dist/components/FloatingChat/FloatingChat.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={POSITION:"bottom-right",BOTTOM:20,SIDE:20,TITLE:"Chat",SUBTITLE:"We typically reply in a few minutes",WELCOME_MESSAGE:"Hi! How can we help you today?"},T={width:380,height:520};exports.CHAT_WINDOW_SIZE=T;exports.FLOATING_CHAT_DEFAULTS=t;

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

@@ -0,0 +1,12 @@
+export declare const FLOATING_CHAT_DEFAULTS: {
+    readonly POSITION: "bottom-right";
+    readonly BOTTOM: 20;
+    readonly SIDE: 20;
+    readonly TITLE: "Chat";
+    readonly SUBTITLE: "We typically reply in a few minutes";
+    readonly WELCOME_MESSAGE: "Hi! How can we help you today?";
+};
+export declare const CHAT_WINDOW_SIZE: {
+    readonly width: 380;
+    readonly height: 520;
+};

package/dist/components/FloatingChat/FloatingChat.const.js

@@ -0,0 +1,15 @@
+const t = {
+  POSITION: "bottom-right",
+  BOTTOM: 20,
+  SIDE: 20,
+  TITLE: "Chat",
+  SUBTITLE: "We typically reply in a few minutes",
+  WELCOME_MESSAGE: "Hi! How can we help you today?"
+}, T = {
+  width: 380,
+  height: 520
+};
+export {
+  T as CHAT_WINDOW_SIZE,
+  t as FLOATING_CHAT_DEFAULTS
+};

package/dist/components/FloatingChat/FloatingChat.d.ts

@@ -0,0 +1,19 @@
+import { FC } from 'react';
+import { FloatingChatProps } from './FloatingChat.types';
+/**
+ * FloatingChat - Floating chat widget bubble
+ *
+ * @example
+ * ```tsx
+ * <FloatingChat
+ *   messages={messages}
+ *   onSend={handleSend}
+ *   title="Support"
+ *   subtitle="We're here to help!"
+ *   position="bottom-right"
+ *   badgeCount={2}
+ * />
+ * ```
+ */
+export declare const FloatingChat: FC<FloatingChatProps>;
+export default FloatingChat;

package/dist/components/FloatingChat/FloatingChat.js

@@ -0,0 +1,144 @@
+import { jsxs as r, jsx as t } from "react/jsx-runtime";
+import { useState as I, useCallback as S } from "react";
+import { createPortal as Z } from "react-dom";
+import { cn as s } from "../../utils/cn.js";
+import { useBear as q } from "../../context/BearProvider.js";
+import { Button as A } from "../Button/Button.js";
+import { Avatar as J } from "../Avatar/Avatar.js";
+import { Typography as c } from "../Typography/Typography.js";
+import { Badge as K } from "../Badge/Badge.js";
+import { BearIcons as n } from "../Icon/index.js";
+import { Chat as O } from "../Chat/Chat.js";
+import { FLOATING_CHAT_DEFAULTS as a, CHAT_WINDOW_SIZE as m } from "./FloatingChat.const.js";
+const lt = ({
+  messages: d,
+  onSend: E,
+  isLoading: z = !1,
+  isTyping: k = !1,
+  title: h = a.TITLE,
+  subtitle: B = a.SUBTITLE,
+  avatar: D,
+  position: f = a.POSITION,
+  bottom: p = a.BOTTOM,
+  side: v = a.SIDE,
+  defaultOpen: L = !1,
+  open: _,
+  onOpenChange: e,
+  trigger: y,
+  badgeCount: o,
+  header: x,
+  welcomeMessage: u = a.WELCOME_MESSAGE,
+  poweredBy: N,
+  className: F,
+  testId: W
+}) => {
+  const { mode: $ } = q(), M = $ === "dark", [P, b] = I(L), [w, l] = I(!1), i = _ ?? P, g = S(() => {
+    const T = !i;
+    l(!0), b(T), e == null || e(T), setTimeout(() => l(!1), 300);
+  }, [i, e]), j = S(() => {
+    l(!0), b(!1), e == null || e(!1), setTimeout(() => l(!1), 300);
+  }, [e]), G = d.length === 0 && u ? [{ id: "welcome", content: u, sender: "bot", timestamp: /* @__PURE__ */ new Date() }] : d, H = {
+    bottom: `${p}px`,
+    [f === "bottom-right" ? "right" : "left"]: `${v}px`
+  }, U = {
+    bottom: `${p + 70}px`,
+    [f === "bottom-right" ? "right" : "left"]: `${v}px`,
+    width: m.width,
+    height: m.height
+  }, X = /* @__PURE__ */ r("div", { className: s("Bear-FloatingChat", F), "data-testid": W, children: [
+    (i || w) && /* @__PURE__ */ r(
+      "div",
+      {
+        className: s(
+          "fixed z-50 rounded-2xl overflow-hidden shadow-2xl",
+          "transition-all duration-300 ease-out",
+          i && !w ? "opacity-100 translate-y-0 scale-100" : "opacity-0 translate-y-4 scale-95 pointer-events-none"
+        ),
+        style: U,
+        children: [
+          x ? /* @__PURE__ */ t("div", { className: s(
+            "px-4 py-3",
+            M ? "bg-gray-800" : "bg-[var(--bear-primary-500)]"
+          ), children: x }) : /* @__PURE__ */ r(
+            "div",
+            {
+              className: s(
+                "px-4 py-3 flex items-center gap-3",
+                "bg-[var(--bear-primary-500)] text-white"
+              ),
+              children: [
+                /* @__PURE__ */ t(
+                  J,
+                  {
+                    src: D,
+                    initials: h[0],
+                    size: "sm",
+                    className: "ring-2 ring-white/20"
+                  }
+                ),
+                /* @__PURE__ */ r("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ t(c, { variant: "subtitle2", className: "text-white font-semibold", children: h }),
+                  /* @__PURE__ */ t(c, { variant: "caption", className: "text-white/70", children: B })
+                ] }),
+                /* @__PURE__ */ t(
+                  A,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: j,
+                    className: "!text-white hover:!bg-white/10",
+                    children: /* @__PURE__ */ t(n.XIcon, { size: 18 })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ t(
+            O,
+            {
+              messages: G,
+              onSend: E,
+              isLoading: z,
+              isTyping: k,
+              showAvatars: !1,
+              height: m.height - 140,
+              className: "!rounded-none !border-0"
+            }
+          ),
+          N && /* @__PURE__ */ t("div", { className: "px-3 py-2 text-center border-t border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ r(c, { variant: "caption", className: "opacity-50", children: [
+            "Powered by ",
+            N
+          ] }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ t("div", { className: "fixed z-50", style: H, children: y ? /* @__PURE__ */ t("div", { onClick: g, children: y }) : /* @__PURE__ */ r("div", { className: "relative", children: [
+      /* @__PURE__ */ t(
+        A,
+        {
+          variant: "primary",
+          onClick: g,
+          className: s(
+            "!w-14 !h-14 !rounded-full !p-0 shadow-lg",
+            "transition-transform duration-200",
+            i && "rotate-180"
+          ),
+          children: i ? /* @__PURE__ */ t(n.XIcon, { size: 24 }) : /* @__PURE__ */ t(n.ChatIcon, { size: 24 })
+        }
+      ),
+      !i && o && o > 0 && /* @__PURE__ */ t(
+        K,
+        {
+          variant: "danger",
+          size: "sm",
+          className: "absolute -top-1 -right-1 !min-w-[20px] !h-5",
+          children: o > 99 ? "99+" : o
+        }
+      )
+    ] }) })
+  ] });
+  return typeof document > "u" ? null : Z(X, document.body);
+};
+export {
+  lt as FloatingChat
+};

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

@@ -0,0 +1,44 @@
+import { ReactNode } from 'react';
+import { ChatMessage } from '../Chat/Chat.types';
+export interface FloatingChatProps {
+    /** Chat messages */
+    messages: ChatMessage[];
+    /** Callback when user sends a message */
+    onSend?: (message: string) => void;
+    /** Loading state */
+    isLoading?: boolean;
+    /** Typing indicator */
+    isTyping?: boolean;
+    /** Chat title */
+    title?: string;
+    /** Chat subtitle */
+    subtitle?: string;
+    /** Avatar URL */
+    avatar?: string;
+    /** Position on screen */
+    position?: 'bottom-right' | 'bottom-left';
+    /** Distance from bottom */
+    bottom?: number;
+    /** Distance from side */
+    side?: number;
+    /** Initial open state */
+    defaultOpen?: boolean;
+    /** Controlled open state */
+    open?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Custom trigger button */
+    trigger?: ReactNode;
+    /** Badge count (e.g., unread messages) */
+    badgeCount?: number;
+    /** Header content */
+    header?: ReactNode;
+    /** Welcome message */
+    welcomeMessage?: string;
+    /** Show powered by */
+    poweredBy?: string;
+    /** Custom class name */
+    className?: string;
+    /** Test ID */
+    testId?: string;
+}

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

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

package/dist/components/JsonViewer/JsonViewer.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),S=require("../../utils/cn.cjs"),v=require("../../context/BearProvider.cjs"),A=require("../Typography/Typography.cjs"),I=require("../Button/Button.cjs"),g=require("../Icon/index.cjs"),u=require("./JsonViewer.const.cjs"),T=({name:r,value:s,path:d,depth:h,defaultExpandDepth:y,showDataTypes:j,showArrayIndices:x,onValueClick:c})=>{const[o,b]=i.useState(h<y),{mode:N}=v.useBear(),n=N==="dark"?u.DARK_THEME:u.DEFAULT_THEME,t=i.useMemo(()=>s===null?"null":Array.isArray(s)?"array":typeof s,[s]),p=t==="object"||t==="array",a=p&&Object.keys(s).length===0,f=i.useCallback(()=>{b(l=>!l)},[]),m=i.useCallback(()=>{c==null||c(d,s)},[d,s,c]),w=()=>{switch(t){case"string":return e.jsxs("span",{style:{color:n.string},className:"cursor-pointer hover:underline",onClick:m,children:['"',s,'"']});case"number":return e.jsx("span",{style:{color:n.number},className:"cursor-pointer hover:underline",onClick:m,children:String(s)});case"boolean":return e.jsx("span",{style:{color:n.boolean},className:"cursor-pointer hover:underline",onClick:m,children:String(s)});case"null":return e.jsx("span",{style:{color:n.null},className:"cursor-pointer hover:underline",onClick:m,children:"null"});default:return null}},k=()=>{if(!j)return null;const l=t==="array"?`Array(${s.length})`:t==="object"?"Object":t;return e.jsx("span",{className:"text-[10px] opacity-50 ml-1",children:l})};if(!p)return e.jsxs("div",{className:"flex items-center gap-1 py-0.5",children:[e.jsx("span",{className:"w-4"})," ",(x||typeof r=="string")&&e.jsxs(e.Fragment,{children:[e.jsx("span",{style:{color:n.key},children:typeof r=="string"?`"${r}"`:r}),e.jsx("span",{style:{color:n.punctuation},children:":"})]}),w(),k()]});const B=Object.entries(s),q=t==="array"?"[":"{",E=t==="array"?"]":"}";return e.jsxs("div",{className:"py-0.5",children:[e.jsxs("div",{className:"flex items-center gap-1 cursor-pointer hover:bg-black/5 dark:hover:bg-white/5 rounded px-1 -mx-1",onClick:f,children:[e.jsx("span",{className:"w-4 flex items-center justify-center text-gray-400",children:a?null:o?e.jsx(g.BearIcons.ChevronDownIcon,{size:12}):e.jsx(g.BearIcons.ChevronRightIcon,{size:12})}),(x||typeof r=="string")&&r!==""&&e.jsxs(e.Fragment,{children:[e.jsx("span",{style:{color:n.key},children:typeof r=="string"?`"${r}"`:r}),e.jsx("span",{style:{color:n.punctuation},children:":"})]}),e.jsx("span",{style:{color:n.bracket},children:q}),!o&&!a&&e.jsx("span",{className:"text-gray-400 text-xs",children:"..."}),(!o||a)&&e.jsx("span",{style:{color:n.bracket},children:E}),k()]}),o&&!a&&e.jsx("div",{className:"ml-4 border-l border-gray-200 dark:border-gray-700 pl-2",children:B.map(([l,C],F)=>e.jsx(T,{name:t==="array"?F:l,value:C,path:[...d,l],depth:h+1,defaultExpandDepth:y,showDataTypes:j,showArrayIndices:x,onValueClick:c},l))}),o&&!a&&e.jsxs("div",{className:"flex items-center",children:[e.jsx("span",{className:"w-4"}),e.jsx("span",{style:{color:n.bracket},children:E})]})]})},J=({data:r,defaultExpandDepth:s=u.DEFAULT_EXPAND_DEPTH,showDataTypes:d=!1,showArrayIndices:h=!0,showCopyButton:y=!0,rootName:j="root",onValueClick:x,onCopy:c,className:o,testId:b})=>{const{mode:N}=v.useBear(),n=N==="dark"?u.DARK_THEME:u.DEFAULT_THEME,[t,p]=i.useState(!1),a=i.useCallback(async()=>{try{await navigator.clipboard.writeText(JSON.stringify(r,null,2)),p(!0),c==null||c(r),setTimeout(()=>p(!1),2e3)}catch(f){console.error("Failed to copy:",f)}},[r,c]);return e.jsxs("div",{className:S.cn("Bear-JsonViewer","rounded-lg overflow-hidden font-mono text-sm",o),style:{backgroundColor:n.background},"data-testid":b,children:[y&&e.jsxs("div",{className:"flex items-center justify-between px-3 py-2 border-b border-gray-200 dark:border-gray-700",children:[e.jsx(A.Typography,{variant:"caption",className:"opacity-60",children:"JSON"}),e.jsx(I.Button,{variant:"ghost",size:"sm",onClick:a,className:"!py-1 !px-2 !text-xs",children:t?e.jsxs(e.Fragment,{children:[e.jsx(g.BearIcons.CheckIcon,{size:12,className:"mr-1"}),"Copied!"]}):e.jsxs(e.Fragment,{children:[e.jsx(g.BearIcons.CopyIcon,{size:12,className:"mr-1"}),"Copy"]})})]}),e.jsx("div",{className:"p-3 overflow-x-auto",children:e.jsx(T,{name:j||"",value:r,path:[],depth:0,defaultExpandDepth:s,showDataTypes:d,showArrayIndices:h,onValueClick:x})})]})};exports.JsonViewer=J;

package/dist/components/JsonViewer/JsonViewer.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=2,e={background:"var(--bear-bg-secondary, #f5f5f5)",string:"#22c55e",number:"#3b82f6",boolean:"#f59e0b",null:"#ef4444",key:"#ec4899",bracket:"var(--bear-text-secondary, #737373)",punctuation:"var(--bear-text-tertiary, #a3a3a3)"},r={background:"var(--bear-bg-secondary, #262626)",string:"#4ade80",number:"#60a5fa",boolean:"#fbbf24",null:"#f87171",key:"#f472b6",bracket:"var(--bear-text-secondary, #a3a3a3)",punctuation:"var(--bear-text-tertiary, #737373)"};exports.DARK_THEME=r;exports.DEFAULT_EXPAND_DEPTH=a;exports.DEFAULT_THEME=e;

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

@@ -0,0 +1,4 @@
+import { JsonViewerTheme } from './JsonViewer.types';
+export declare const DEFAULT_EXPAND_DEPTH = 2;
+export declare const DEFAULT_THEME: JsonViewerTheme;
+export declare const DARK_THEME: JsonViewerTheme;

package/dist/components/JsonViewer/JsonViewer.const.js

@@ -0,0 +1,24 @@
+const a = 2, e = {
+  background: "var(--bear-bg-secondary, #f5f5f5)",
+  string: "#22c55e",
+  number: "#3b82f6",
+  boolean: "#f59e0b",
+  null: "#ef4444",
+  key: "#ec4899",
+  bracket: "var(--bear-text-secondary, #737373)",
+  punctuation: "var(--bear-text-tertiary, #a3a3a3)"
+}, r = {
+  background: "var(--bear-bg-secondary, #262626)",
+  string: "#4ade80",
+  number: "#60a5fa",
+  boolean: "#fbbf24",
+  null: "#f87171",
+  key: "#f472b6",
+  bracket: "var(--bear-text-secondary, #a3a3a3)",
+  punctuation: "var(--bear-text-tertiary, #737373)"
+};
+export {
+  r as DARK_THEME,
+  a as DEFAULT_EXPAND_DEPTH,
+  e as DEFAULT_THEME
+};

package/dist/components/JsonViewer/JsonViewer.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+import { JsonViewerProps } from './JsonViewer.types';
+/**
+ * JsonViewer - Pretty-print and explore JSON data
+ *
+ * @example
+ * ```tsx
+ * <JsonViewer
+ *   data={{ name: 'John', age: 30, active: true }}
+ *   defaultExpandDepth={3}
+ *   showDataTypes
+ *   showCopyButton
+ * />
+ * ```
+ */
+export declare const JsonViewer: FC<JsonViewerProps>;
+export default JsonViewer;

package/dist/components/JsonViewer/JsonViewer.js

@@ -0,0 +1,195 @@
+import { jsxs as o, jsx as e, Fragment as g } from "react/jsx-runtime";
+import { useState as j, useCallback as v, useMemo as F } from "react";
+import { cn as I } from "../../utils/cn.js";
+import { useBear as T } from "../../context/BearProvider.js";
+import { Typography as _ } from "../Typography/Typography.js";
+import { Button as H } from "../Button/Button.js";
+import { BearIcons as b } from "../Icon/index.js";
+import { DARK_THEME as B, DEFAULT_THEME as C, DEFAULT_EXPAND_DEPTH as L } from "./JsonViewer.const.js";
+const z = ({
+  name: r,
+  value: t,
+  path: d,
+  depth: h,
+  defaultExpandDepth: y,
+  showDataTypes: u,
+  showArrayIndices: p,
+  onValueClick: c
+}) => {
+  const [l, x] = j(h < y), { mode: N } = T(), n = N === "dark" ? B : C, s = F(() => t === null ? "null" : Array.isArray(t) ? "array" : typeof t, [t]), m = s === "object" || s === "array", a = m && Object.keys(t).length === 0, k = v(() => {
+    x((i) => !i);
+  }, []), f = v(() => {
+    c == null || c(d, t);
+  }, [d, t, c]), A = () => {
+    switch (s) {
+      case "string":
+        return /* @__PURE__ */ o(
+          "span",
+          {
+            style: { color: n.string },
+            className: "cursor-pointer hover:underline",
+            onClick: f,
+            children: [
+              '"',
+              t,
+              '"'
+            ]
+          }
+        );
+      case "number":
+        return /* @__PURE__ */ e(
+          "span",
+          {
+            style: { color: n.number },
+            className: "cursor-pointer hover:underline",
+            onClick: f,
+            children: String(t)
+          }
+        );
+      case "boolean":
+        return /* @__PURE__ */ e(
+          "span",
+          {
+            style: { color: n.boolean },
+            className: "cursor-pointer hover:underline",
+            onClick: f,
+            children: String(t)
+          }
+        );
+      case "null":
+        return /* @__PURE__ */ e(
+          "span",
+          {
+            style: { color: n.null },
+            className: "cursor-pointer hover:underline",
+            onClick: f,
+            children: "null"
+          }
+        );
+      default:
+        return null;
+    }
+  }, E = () => {
+    if (!u) return null;
+    const i = s === "array" ? `Array(${t.length})` : s === "object" ? "Object" : s;
+    return /* @__PURE__ */ e("span", { className: "text-[10px] opacity-50 ml-1", children: i });
+  };
+  if (!m)
+    return /* @__PURE__ */ o("div", { className: "flex items-center gap-1 py-0.5", children: [
+      /* @__PURE__ */ e("span", { className: "w-4" }),
+      " ",
+      (p || typeof r == "string") && /* @__PURE__ */ o(g, { children: [
+        /* @__PURE__ */ e("span", { style: { color: n.key }, children: typeof r == "string" ? `"${r}"` : r }),
+        /* @__PURE__ */ e("span", { style: { color: n.punctuation }, children: ":" })
+      ] }),
+      A(),
+      E()
+    ] });
+  const J = Object.entries(t), O = s === "array" ? "[" : "{", w = s === "array" ? "]" : "}";
+  return /* @__PURE__ */ o("div", { className: "py-0.5", children: [
+    /* @__PURE__ */ o(
+      "div",
+      {
+        className: "flex items-center gap-1 cursor-pointer hover:bg-black/5 dark:hover:bg-white/5 rounded px-1 -mx-1",
+        onClick: k,
+        children: [
+          /* @__PURE__ */ e("span", { className: "w-4 flex items-center justify-center text-gray-400", children: a ? null : l ? /* @__PURE__ */ e(b.ChevronDownIcon, { size: 12 }) : /* @__PURE__ */ e(b.ChevronRightIcon, { size: 12 }) }),
+          (p || typeof r == "string") && r !== "" && /* @__PURE__ */ o(g, { children: [
+            /* @__PURE__ */ e("span", { style: { color: n.key }, children: typeof r == "string" ? `"${r}"` : r }),
+            /* @__PURE__ */ e("span", { style: { color: n.punctuation }, children: ":" })
+          ] }),
+          /* @__PURE__ */ e("span", { style: { color: n.bracket }, children: O }),
+          !l && !a && /* @__PURE__ */ e("span", { className: "text-gray-400 text-xs", children: "..." }),
+          (!l || a) && /* @__PURE__ */ e("span", { style: { color: n.bracket }, children: w }),
+          E()
+        ]
+      }
+    ),
+    l && !a && /* @__PURE__ */ e("div", { className: "ml-4 border-l border-gray-200 dark:border-gray-700 pl-2", children: J.map(([i, S], D) => /* @__PURE__ */ e(
+      z,
+      {
+        name: s === "array" ? D : i,
+        value: S,
+        path: [...d, i],
+        depth: h + 1,
+        defaultExpandDepth: y,
+        showDataTypes: u,
+        showArrayIndices: p,
+        onValueClick: c
+      },
+      i
+    )) }),
+    l && !a && /* @__PURE__ */ o("div", { className: "flex items-center", children: [
+      /* @__PURE__ */ e("span", { className: "w-4" }),
+      /* @__PURE__ */ e("span", { style: { color: n.bracket }, children: w })
+    ] })
+  ] });
+}, G = ({
+  data: r,
+  defaultExpandDepth: t = L,
+  showDataTypes: d = !1,
+  showArrayIndices: h = !0,
+  showCopyButton: y = !0,
+  rootName: u = "root",
+  onValueClick: p,
+  onCopy: c,
+  className: l,
+  testId: x
+}) => {
+  const { mode: N } = T(), n = N === "dark" ? B : C, [s, m] = j(!1), a = v(async () => {
+    try {
+      await navigator.clipboard.writeText(JSON.stringify(r, null, 2)), m(!0), c == null || c(r), setTimeout(() => m(!1), 2e3);
+    } catch (k) {
+      console.error("Failed to copy:", k);
+    }
+  }, [r, c]);
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: I(
+        "Bear-JsonViewer",
+        "rounded-lg overflow-hidden font-mono text-sm",
+        l
+      ),
+      style: { backgroundColor: n.background },
+      "data-testid": x,
+      children: [
+        y && /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-3 py-2 border-b border-gray-200 dark:border-gray-700", children: [
+          /* @__PURE__ */ e(_, { variant: "caption", className: "opacity-60", children: "JSON" }),
+          /* @__PURE__ */ e(
+            H,
+            {
+              variant: "ghost",
+              size: "sm",
+              onClick: a,
+              className: "!py-1 !px-2 !text-xs",
+              children: s ? /* @__PURE__ */ o(g, { children: [
+                /* @__PURE__ */ e(b.CheckIcon, { size: 12, className: "mr-1" }),
+                "Copied!"
+              ] }) : /* @__PURE__ */ o(g, { children: [
+                /* @__PURE__ */ e(b.CopyIcon, { size: 12, className: "mr-1" }),
+                "Copy"
+              ] })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e("div", { className: "p-3 overflow-x-auto", children: /* @__PURE__ */ e(
+          z,
+          {
+            name: u || "",
+            value: r,
+            path: [],
+            depth: 0,
+            defaultExpandDepth: t,
+            showDataTypes: d,
+            showArrayIndices: h,
+            onValueClick: p
+          }
+        ) })
+      ]
+    }
+  );
+};
+export {
+  G as JsonViewer
+};

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

@@ -0,0 +1,54 @@
+/**
+ * JsonViewer component types
+ */
+export interface JsonViewerProps {
+    /** JSON data to display */
+    data: unknown;
+    /** Number of levels to expand by default (default: 2) */
+    defaultExpandDepth?: number;
+    /** Expand all nodes */
+    expandAll?: boolean;
+    /** Collapse all nodes */
+    collapseAll?: boolean;
+    /** Show data types */
+    showDataTypes?: boolean;
+    /** Show array indices */
+    showArrayIndices?: boolean;
+    /** Show copy button */
+    showCopyButton?: boolean;
+    /** Enable search */
+    enableSearch?: boolean;
+    /** Custom theme colors */
+    theme?: JsonViewerTheme;
+    /** Root name (default: 'root') */
+    rootName?: string | false;
+    /** Callback when a value is clicked */
+    onValueClick?: (path: string[], value: unknown) => void;
+    /** Callback when copied */
+    onCopy?: (value: unknown) => void;
+    /** Custom class name */
+    className?: string;
+    /** Test ID */
+    testId?: string;
+}
+export interface JsonViewerTheme {
+    background?: string;
+    text?: string;
+    string?: string;
+    number?: string;
+    boolean?: string;
+    null?: string;
+    key?: string;
+    bracket?: string;
+    punctuation?: string;
+}
+export interface JsonNodeProps {
+    name: string | number;
+    value: unknown;
+    path: string[];
+    depth: number;
+    defaultExpandDepth: number;
+    showDataTypes: boolean;
+    showArrayIndices: boolean;
+    onValueClick?: (path: string[], value: unknown) => void;
+}

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

@@ -0,0 +1,2 @@
+export { JsonViewer } from './JsonViewer';
+export type { JsonViewerProps, JsonViewerTheme } from './JsonViewer.types';

package/dist/components/Kanban/Kanban.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),K=require("react"),m=require("../../utils/cn.cjs");require("../../context/BearProvider.cjs");const P=require("../../hooks/useDragDrop/useDragDrop.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const S="bear-kanban",$=({columns:n,onColumnsChange:o,onCardMove:p,renderCard:h,renderColumnHeader:u,disabled:y=!1,className:v})=>{const w=K.useCallback((r,e,i,b,d)=>{const l=n.find(a=>a.id===r),s=n.find(a=>a.id===e);if(!l||!s)return;const f=n.map(a=>{if(a.id===r){const c=a.cards.filter((x,g)=>g!==i);return{...a,cards:c}}if(a.id===e){const c=r===e&&i<b?b-1:b,x=[...a.cards];return x.splice(Math.max(0,c),0,d),{...a,cards:x}}return a});o==null||o(f),p==null||p(d.id,r,e,i,b)},[n,o,p]),{getDragProps:N,getDropProps:j,isDragging:_,draggedId:z,dragOverId:k}=P.useDragDrop({disabled:y,dragType:S,onDrop:(r,e,i,b,d)=>{var D;const l=String(r),s=String(e),f=l.split("-")[0],a=parseInt(l.split("-")[1],10)||0,c=s.endsWith("-col")?s.replace("-col",""):s.split("-")[0],x=s.endsWith("-col")?((D=n.find(q=>q.id===c))==null?void 0:D.cards.length)??0:parseInt(s.split("-")[1],10),g=d;g!=null&&g.id&&w(f,c,a,x,g)}});return t.jsx("div",{className:m.cn("Bear-Kanban bear-flex bear-gap-4 bear-overflow-x-auto bear-pb-4",y&&"bear-opacity-50 bear-pointer-events-none",v),children:n.map(r=>t.jsxs("div",{...j(`${r.id}-col`,r,0),className:m.cn("Bear-Kanban__column bear-flex-shrink-0 bear-w-72 bear-flex bear-flex-col bear-rounded-lg bear-bg-gray-100 dark:bear-bg-zinc-800/80 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-transition-colors",k===`${r.id}-col`&&"bear-border-bear-500 bear-bg-bear-500/5"),children:[t.jsx("div",{className:"bear-px-4 bear-py-3 bear-border-b bear-border-gray-200 dark:bear-border-zinc-700",children:u?u(r):t.jsx("h3",{className:"bear-text-sm bear-font-semibold bear-text-gray-900 dark:bear-text-white",children:r.title})}),t.jsx("div",{className:"bear-flex-1 bear-flex bear-flex-col bear-gap-2 bear-p-3 bear-min-h-[120px]",children:r.cards.map((e,i)=>{const b=`${r.id}-${i}`,d=_&&z===b;return t.jsx("div",{...j(b,e,i),...N(b,e,i),className:m.cn("Bear-Kanban__card bear-rounded-lg bear-bg-white dark:bear-bg-zinc-700/80 bear-border bear-border-gray-200 dark:bear-border-zinc-600 bear-p-3 bear-cursor-grab active:bear-cursor-grabbing bear-transition-all bear-shadow-sm",d&&"bear-opacity-50 bear-scale-95",k===b&&"bear-border-bear-500 bear-bg-bear-500/10"),children:h?h(e,r.id):t.jsxs(t.Fragment,{children:[t.jsx("div",{className:"bear-font-medium bear-text-gray-900 dark:bear-text-white",children:e.title}),e.description&&t.jsx("div",{className:"bear-text-sm bear-text-gray-600 dark:bear-text-zinc-400 bear-mt-1",children:e.description}),e.meta&&t.jsx("div",{className:"bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500 bear-mt-2",children:e.meta})]})},e.id)})})]},r.id))})};exports.Kanban=$;