@forgedevstack/bear 1.2.1 → 1.2.2

package/README.md

@@ -6,10 +6,6 @@ Strong, reliable React UI components. Tailwind-powered, zero config required. Th
 
 Visit the [Bear UI Portal](https://bearui.com/) to explore all components, view live examples, and browse the documentation.
 
-## Changelog
-
-**Current release: 1.2.1** — Portaled overlays (Dropdown, Select, NavigableSelect, Menu, Autocomplete, MultiSelect, MentionsInput, TreeSelect, Popconfirm) use fixed positioning tied to the trigger, **z-index 10000**, and scroll/resize updates where applicable so panels are not clipped by parent `overflow` or stacking contexts. **Popover** and **Tooltip** also reposition on scroll/resize. **`useClickOutsideMultiple`** is available from `@forgedevstack/bear/hooks` for trigger + floating-root outside detection. Details: [CHANGELOG.md](./CHANGELOG.md).
-
 ## Features
 
 - **Tailwind-Powered**: Built with Tailwind CSS, zero config required

package/dist/components/AnimatedCounter/AnimatedCounter.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react/jsx-runtime"),e=require("react"),v=require("../../utils/cn.cjs"),x=require("../Typography/Typography.cjs"),a=require("./AnimatedCounter.const.cjs"),T=require("./AnimatedCounter.utils.cjs"),M=({value:o,from:t=0,duration:l=a.DEFAULT_DURATION,decimals:b=a.DEFAULT_DECIMALS,prefix:E="",suffix:q="",separator:C=a.DEFAULT_SEPARATOR,easing:F=a.DEFAULT_EASING,animateOnView:u=!0,typographyProps:n,testId:N,className:D,...I})=>{const[_,R]=e.useState(t),[d,U]=e.useState(!u),A=e.useRef(null),m=T.EASING_FUNCTIONS[F],i=e.useCallback(()=>{const s=performance.now(),r=o-t,c=h=>{const j=h-s,f=Math.min(j/l,1);R(t+r*m(f)),f<1&&requestAnimationFrame(c)};requestAnimationFrame(c)},[o,t,l,m]);e.useEffect(()=>{if(!u){i();return}const s=A.current;if(!s)return;const r=new IntersectionObserver(([c])=>{c.isIntersecting&&!d&&(U(!0),i())},{threshold:.1});return r.observe(s),()=>r.disconnect()},[u,i,d]);const L=`${E}${T.formatNumber(_,b,C)}${q}`;return S.jsx(x.Typography,{variant:"h3",component:"span",...n,className:v.cn("Bear-AnimatedCounter bear-tabular-nums",n==null?void 0:n.className,D),"data-testid":N,children:S.jsx("span",{ref:A,...I,children:L})})};exports.AnimatedCounter=M;

package/dist/components/AnimatedCounter/AnimatedCounter.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=2e3,E=0,T=",",D="easeOut";exports.DEFAULT_DECIMALS=E;exports.DEFAULT_DURATION=A;exports.DEFAULT_EASING=D;exports.DEFAULT_SEPARATOR=T;

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

@@ -0,0 +1,5 @@
+export declare const DEFAULT_DURATION = 2000;
+export declare const DEFAULT_DECIMALS = 0;
+export declare const DEFAULT_SEPARATOR = ",";
+export declare const DEFAULT_EASING: "easeOut";
+export declare const FRAME_INTERVAL = 16;

package/dist/components/AnimatedCounter/AnimatedCounter.const.js

@@ -0,0 +1,7 @@
+const A = 2e3, E = 0, t = ",", D = "easeOut";
+export {
+  E as DEFAULT_DECIMALS,
+  A as DEFAULT_DURATION,
+  D as DEFAULT_EASING,
+  t as DEFAULT_SEPARATOR
+};

package/dist/components/AnimatedCounter/AnimatedCounter.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { AnimatedCounterProps } from './AnimatedCounter.types';
+export declare const AnimatedCounter: FC<AnimatedCounterProps>;

package/dist/components/AnimatedCounter/AnimatedCounter.js

@@ -0,0 +1,59 @@
+import { jsx as A } from "react/jsx-runtime";
+import { useState as d, useRef as v, useCallback as $, useEffect as k } from "react";
+import { cn as p } from "../../utils/cn.js";
+import { Typography as q } from "../Typography/Typography.js";
+import { DEFAULT_DURATION as x, DEFAULT_DECIMALS as G, DEFAULT_SEPARATOR as M, DEFAULT_EASING as O } from "./AnimatedCounter.const.js";
+import { EASING_FUNCTIONS as j, formatNumber as B } from "./AnimatedCounter.utils.js";
+const V = ({
+  value: c,
+  from: e = 0,
+  duration: i = x,
+  decimals: E = G,
+  prefix: F = "",
+  suffix: N = "",
+  separator: S = M,
+  easing: T = O,
+  animateOnView: a = !0,
+  typographyProps: t,
+  testId: b,
+  className: D,
+  ...I
+}) => {
+  const [U, C] = d(e), [m, L] = d(!a), u = v(null), f = j[T], o = $(() => {
+    const n = performance.now(), r = c - e, s = (R) => {
+      const h = R - n, l = Math.min(h / i, 1);
+      C(e + r * f(l)), l < 1 && requestAnimationFrame(s);
+    };
+    requestAnimationFrame(s);
+  }, [c, e, i, f]);
+  k(() => {
+    if (!a) {
+      o();
+      return;
+    }
+    const n = u.current;
+    if (!n) return;
+    const r = new IntersectionObserver(
+      ([s]) => {
+        s.isIntersecting && !m && (L(!0), o());
+      },
+      { threshold: 0.1 }
+    );
+    return r.observe(n), () => r.disconnect();
+  }, [a, o, m]);
+  const _ = `${F}${B(U, E, S)}${N}`;
+  return /* @__PURE__ */ A(
+    q,
+    {
+      variant: "h3",
+      component: "span",
+      ...t,
+      className: p("Bear-AnimatedCounter bear-tabular-nums", t == null ? void 0 : t.className, D),
+      "data-testid": b,
+      children: /* @__PURE__ */ A("span", { ref: u, ...I, children: _ })
+    }
+  );
+};
+export {
+  V as AnimatedCounter
+};

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

@@ -0,0 +1,26 @@
+import { HTMLAttributes } from 'react';
+import { TypographyProps } from '../Typography/Typography.types';
+export interface AnimatedCounterProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
+    /** Target value to count to */
+    value: number;
+    /** Starting value */
+    from?: number;
+    /** Animation duration in ms */
+    duration?: number;
+    /** Decimal places */
+    decimals?: number;
+    /** Prefix string (e.g. '$') */
+    prefix?: string;
+    /** Suffix string (e.g. '%') */
+    suffix?: string;
+    /** Thousand separator */
+    separator?: string;
+    /** Easing function */
+    easing?: 'linear' | 'easeOut' | 'easeInOut';
+    /** Start animation when element enters viewport */
+    animateOnView?: boolean;
+    /** Typography props for the number */
+    typographyProps?: Partial<TypographyProps>;
+    /** Test ID */
+    testId?: string;
+}

package/dist/components/AnimatedCounter/AnimatedCounter.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c={linear:e=>e,easeOut:e=>1-Math.pow(1-e,3),easeInOut:e=>e<.5?4*e*e*e:1-Math.pow(-2*e+2,3)/2};function s(e,r,a){const n=e.toFixed(r),[i,t]=n.split("."),o=i.replace(/\B(?=(\d{3})+(?!\d))/g,a);return t?`${o}.${t}`:o}exports.EASING_FUNCTIONS=c;exports.formatNumber=s;

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

@@ -0,0 +1,6 @@
+export declare const EASING_FUNCTIONS: {
+    readonly linear: (t: number) => number;
+    readonly easeOut: (t: number) => number;
+    readonly easeInOut: (t: number) => number;
+};
+export declare function formatNumber(num: number, decimals: number, separator: string): string;

package/dist/components/AnimatedCounter/AnimatedCounter.utils.js

@@ -0,0 +1,13 @@
+const i = {
+  linear: (e) => e,
+  easeOut: (e) => 1 - Math.pow(1 - e, 3),
+  easeInOut: (e) => e < 0.5 ? 4 * e * e * e : 1 - Math.pow(-2 * e + 2, 3) / 2
+};
+function s(e, o, a) {
+  const r = e.toFixed(o), [c, t] = r.split("."), n = c.replace(/\B(?=(\d{3})+(?!\d))/g, a);
+  return t ? `${n}.${t}` : n;
+}
+export {
+  i as EASING_FUNCTIONS,
+  s as formatNumber
+};

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

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

package/dist/components/CurrencyInput/CurrencyInput.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),n=require("react"),U=require("../Input/Input.cjs"),B=require("../Icon/index.cjs"),l=require("./CurrencyInput.const.cjs"),c=require("./CurrencyInput.utils.cjs"),M=({value:p,onChange:u,currency:r=l.DEFAULT_CURRENCY,locale:s=l.DEFAULT_LOCALE,decimals:e=l.DEFAULT_DECIMALS,placeholder:S="0.00",size:f="md",disabled:A=!1,error:F,allowNegative:C=!1,max:o,min:a,testId:L,className:q,...x})=>{const[i,d]=n.useState(()=>c.formatCurrency(p,s,e)),[I,g]=n.useState(!1);n.useEffect(()=>{I||d(c.formatCurrency(p,s,e))},[p,s,e,I]);const D=n.useCallback(t=>{const j=t.target.value,m=C?/[^0-9.,-]/g:/[^0-9.,]/g;d(j.replace(m,""))},[C]),R=n.useCallback(()=>{g(!1);let t=c.parseCurrency(i);t!=null&&(o!=null&&t>o&&(t=o),a!=null&&t<a&&(t=a),t=parseFloat(t.toFixed(e))),u==null||u(t),d(c.formatCurrency(t,s,e))},[i,s,e,o,a,u]),E=typeof r=="string"?l.CURRENCY_SYMBOLS[r]??r:null,_=typeof r!="string"?r:y.jsx(B.BearIcons.DollarSignIcon,{size:f==="sm"?14:f==="lg"?20:16,className:"text-gray-400"}),b=E?y.jsx("span",{className:"text-gray-500 dark:text-gray-400 font-medium select-none",children:E}):_;return y.jsx(U.Input,{...x,size:f,disabled:A,error:F,placeholder:S,value:i,onChange:D,onFocus:()=>g(!0),onBlur:R,inputMode:"decimal",className:q,"data-testid":L,InputProps:{startAdornment:b}})};exports.CurrencyInput=M;

package/dist/components/CurrencyInput/CurrencyInput.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const L="USD",C="en-US",E=2,U={USD:"$",EUR:"€",GBP:"£",JPY:"¥",ILS:"₪",INR:"₹",KRW:"₩",CNY:"¥",BRL:"R$",CAD:"CA$",AUD:"A$"};exports.CURRENCY_SYMBOLS=U;exports.DEFAULT_CURRENCY=L;exports.DEFAULT_DECIMALS=E;exports.DEFAULT_LOCALE=C;

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

@@ -0,0 +1,4 @@
+export declare const DEFAULT_CURRENCY = "USD";
+export declare const DEFAULT_LOCALE = "en-US";
+export declare const DEFAULT_DECIMALS = 2;
+export declare const CURRENCY_SYMBOLS: Record<string, string>;

package/dist/components/CurrencyInput/CurrencyInput.const.js

@@ -0,0 +1,19 @@
+const U = "USD", A = "en-US", C = 2, L = {
+  USD: "$",
+  EUR: "€",
+  GBP: "£",
+  JPY: "¥",
+  ILS: "₪",
+  INR: "₹",
+  KRW: "₩",
+  CNY: "¥",
+  BRL: "R$",
+  CAD: "CA$",
+  AUD: "A$"
+};
+export {
+  L as CURRENCY_SYMBOLS,
+  U as DEFAULT_CURRENCY,
+  C as DEFAULT_DECIMALS,
+  A as DEFAULT_LOCALE
+};

package/dist/components/CurrencyInput/CurrencyInput.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { CurrencyInputProps } from './CurrencyInput.types';
+export declare const CurrencyInput: FC<CurrencyInputProps>;

package/dist/components/CurrencyInput/CurrencyInput.js

@@ -0,0 +1,60 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useState as E, useEffect as M, useCallback as C } from "react";
+import { Input as N } from "../Input/Input.js";
+import { BearIcons as T } from "../Icon/index.js";
+import { DEFAULT_LOCALE as Y, DEFAULT_DECIMALS as b, DEFAULT_CURRENCY as k, CURRENCY_SYMBOLS as O } from "./CurrencyInput.const.js";
+import { formatCurrency as m, parseCurrency as V } from "./CurrencyInput.utils.js";
+const J = ({
+  value: a,
+  onChange: e,
+  currency: s = k,
+  locale: o = Y,
+  decimals: r = b,
+  placeholder: F = "0.00",
+  size: f = "md",
+  disabled: L = !1,
+  error: g,
+  allowNegative: i = !1,
+  max: n,
+  min: p,
+  testId: D,
+  className: I,
+  ...S
+}) => {
+  const [l, u] = E(() => m(a, o, r)), [c, y] = E(!1);
+  M(() => {
+    c || u(m(a, o, r));
+  }, [a, o, r, c]);
+  const U = C(
+    (t) => {
+      const _ = t.target.value, x = i ? /[^0-9.,-]/g : /[^0-9.,]/g;
+      u(_.replace(x, ""));
+    },
+    [i]
+  ), B = C(() => {
+    y(!1);
+    let t = V(l);
+    t != null && (n != null && t > n && (t = n), p != null && t < p && (t = p), t = parseFloat(t.toFixed(r))), e == null || e(t), u(m(t, o, r));
+  }, [l, o, r, n, p, e]), A = typeof s == "string" ? O[s] ?? s : null, R = typeof s != "string" ? s : /* @__PURE__ */ d(T.DollarSignIcon, { size: f === "sm" ? 14 : f === "lg" ? 20 : 16, className: "text-gray-400" });
+  return /* @__PURE__ */ d(
+    N,
+    {
+      ...S,
+      size: f,
+      disabled: L,
+      error: g,
+      placeholder: F,
+      value: l,
+      onChange: U,
+      onFocus: () => y(!0),
+      onBlur: B,
+      inputMode: "decimal",
+      className: I,
+      "data-testid": D,
+      InputProps: { startAdornment: A ? /* @__PURE__ */ d("span", { className: "text-gray-500 dark:text-gray-400 font-medium select-none", children: A }) : R }
+    }
+  );
+};
+export {
+  J as CurrencyInput
+};

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

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+import { InputProps } from '../Input/Input.types';
+export interface CurrencyInputProps extends Omit<InputProps, 'onChange' | 'value' | 'type'> {
+    /** Current numeric value */
+    value?: number;
+    /** Change handler receiving the numeric value */
+    onChange?: (value: number | undefined) => void;
+    /** Currency code (e.g. 'USD', 'EUR', 'GBP') or a custom ReactNode for the symbol */
+    currency?: string | ReactNode;
+    /** Locale for formatting */
+    locale?: string;
+    /** Maximum decimals */
+    decimals?: number;
+    /** Allow negative values */
+    allowNegative?: boolean;
+    /** Maximum value */
+    max?: number;
+    /** Minimum value */
+    min?: number;
+    /** Test ID */
+    testId?: string;
+}

package/dist/components/CurrencyInput/CurrencyInput.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function t(e,n,r){return e==null?"":new Intl.NumberFormat(n,{minimumFractionDigits:r,maximumFractionDigits:r}).format(e)}function i(e){const n=e.replace(/[^\d.,-]/g,"").replace(/,/g,""),r=parseFloat(n);return isNaN(r)?void 0:r}exports.formatCurrency=t;exports.parseCurrency=i;

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

@@ -0,0 +1,2 @@
+export declare function formatCurrency(value: number | undefined, locale: string, decimals: number): string;
+export declare function parseCurrency(raw: string): number | undefined;

package/dist/components/CurrencyInput/CurrencyInput.utils.js

@@ -0,0 +1,14 @@
+function e(n, t, r) {
+  return n == null ? "" : new Intl.NumberFormat(t, {
+    minimumFractionDigits: r,
+    maximumFractionDigits: r
+  }).format(n);
+}
+function i(n) {
+  const t = n.replace(/[^\d.,-]/g, "").replace(/,/g, ""), r = parseFloat(t);
+  return isNaN(r) ? void 0 : r;
+}
+export {
+  e as formatCurrency,
+  i as parseCurrency
+};

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

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

package/dist/components/DiffViewer/DiffViewer.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("react"),b=require("../../utils/cn.cjs"),T=require("../../context/BearProvider.cjs"),a=require("../Typography/Typography.cjs"),f=require("./DiffViewer.const.cjs"),h=require("./DiffViewer.utils.cjs"),q=({oldValue:c,newValue:l,viewMode:v="split",showLineNumbers:u=!0,oldTitle:N="Original",newTitle:j="Modified",showStats:x=!0,className:g,testId:m})=>{const{mode:w}=T.useBear(),p=w==="dark",d=y.useMemo(()=>h.computeDiff(c,l),[c,l]),i=y.useMemo(()=>h.computeStats(d),[d]),t=r=>u?e.jsx("span",{className:"select-none text-gray-400 dark:text-gray-600 text-right pr-3",style:{minWidth:f.LINE_NUMBER_WIDTH},children:r??""}):null,n=(r,s)=>{const o=f.DIFF_COLORS[s],D=s==="add"?"+":s==="remove"?"-":" ";return e.jsxs("div",{className:"flex font-mono text-sm",style:{backgroundColor:o.bg,borderLeft:`3px solid ${o.border}`},children:[e.jsx("span",{className:"px-2 select-none font-bold",style:{color:o.text},children:D}),e.jsx("span",{className:"flex-1 whitespace-pre",children:r})]})};if(v==="unified")return e.jsxs("div",{className:b.cn("Bear-DiffViewer","rounded-lg overflow-hidden border",p?"bg-gray-900 border-gray-700":"bg-white border-gray-200",g),"data-testid":m,children:[x&&e.jsxs("div",{className:"flex items-center gap-4 px-4 py-2 border-b border-gray-200 dark:border-gray-700",children:[e.jsxs(a.Typography,{variant:"caption",className:"text-green-600",children:["+",i.additions," additions"]}),e.jsxs(a.Typography,{variant:"caption",className:"text-red-600",children:["-",i.deletions," deletions"]})]}),e.jsx("div",{className:"overflow-x-auto",children:d.map((r,s)=>e.jsxs("div",{className:"flex",children:[t(r.oldLineNumber||r.newLineNumber),e.jsx("div",{className:"flex-1",children:n(r.content,r.type)})]},s))})]});const k=d.filter(r=>r.type!=="add"),L=d.filter(r=>r.type!=="remove");return e.jsxs("div",{className:b.cn("Bear-DiffViewer","rounded-lg overflow-hidden border",p?"bg-gray-900 border-gray-700":"bg-white border-gray-200",g),"data-testid":m,children:[x&&e.jsxs("div",{className:"flex items-center gap-4 px-4 py-2 border-b border-gray-200 dark:border-gray-700",children:[e.jsxs(a.Typography,{variant:"caption",className:"text-green-600",children:["+",i.additions," additions"]}),e.jsxs(a.Typography,{variant:"caption",className:"text-red-600",children:["-",i.deletions," deletions"]})]}),e.jsxs("div",{className:"grid grid-cols-2 divide-x divide-gray-200 dark:divide-gray-700",children:[e.jsxs("div",{children:[e.jsx("div",{className:"px-3 py-2 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700",children:e.jsx(a.Typography,{variant:"caption",className:"font-semibold",children:N})}),e.jsx("div",{className:"overflow-x-auto",children:k.map((r,s)=>e.jsxs("div",{className:"flex",children:[t(r.oldLineNumber),e.jsx("div",{className:"flex-1",children:n(r.content,r.type==="remove"?"remove":"context")})]},s))})]}),e.jsxs("div",{children:[e.jsx("div",{className:"px-3 py-2 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700",children:e.jsx(a.Typography,{variant:"caption",className:"font-semibold",children:j})}),e.jsx("div",{className:"overflow-x-auto",children:L.map((r,s)=>e.jsxs("div",{className:"flex",children:[t(r.newLineNumber),e.jsx("div",{className:"flex-1",children:n(r.content,r.type==="add"?"add":"context")})]},s))})]})]})]})};exports.DiffViewer=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),o=require("../../utils/cn.cjs"),R=require("../../context/BearProvider.cjs"),d=require("../Typography/Typography.cjs"),a=require("./DiffViewer.const.cjs"),N=require("./DiffViewer.utils.cjs"),P=({oldValue:m,newValue:p,viewMode:j="split",showLineNumbers:L=!0,oldTitle:T=a.DEFAULT_OLD_TITLE,newTitle:k=a.DEFAULT_NEW_TITLE,showStats:E=!0,spacing:D=a.DEFAULT_SPACING,showLineHoverInfo:c=!1,className:_,testId:h})=>{const{mode:w}=R.useBear(),S=w==="dark",[C,b]=n.useState(null),t=n.useMemo(()=>N.computeDiff(m,p),[m,p]),l=n.useMemo(()=>N.computeStats(t),[t]),f=a.LINE_SPACING[D],q=n.useCallback(r=>{c&&b(r)},[c]),A=n.useCallback(()=>{b(null)},[]),x=r=>L?e.jsx("span",{className:o.cn("select-none text-gray-400 dark:text-gray-600 text-right pr-3",f),style:{minWidth:a.LINE_NUMBER_WIDTH},children:r??""}):null,u=(r,s,i)=>{const g=a.DIFF_COLORS[s],F=s==="add"?"+":s==="remove"?"-":" ",O=i!=null&&C===i;return e.jsxs("div",{className:o.cn("flex font-mono text-sm relative group",f),style:{backgroundColor:g.bg,borderLeft:`3px solid ${g.border}`},onMouseEnter:()=>i!=null&&q(i),onMouseLeave:A,children:[e.jsx("span",{className:"px-2 select-none font-bold",style:{color:g.text},children:F}),e.jsx("span",{className:"flex-1 whitespace-pre",children:r}),c&&O&&s!=="context"&&e.jsx("span",{className:o.cn("absolute right-2 top-1/2 -translate-y-1/2 text-xs px-2 py-0.5 rounded",s==="add"?"bg-green-500/20 text-green-600 dark:text-green-400":"bg-red-500/20 text-red-600 dark:text-red-400"),children:a.LINE_HOVER_LABELS[s]})]})},v=()=>E?e.jsxs("div",{className:"flex items-center gap-4 px-4 py-2 border-b border-gray-200 dark:border-gray-700",children:[e.jsxs(d.Typography,{variant:"caption",className:"text-green-600",children:["+",l.additions," additions"]}),e.jsxs(d.Typography,{variant:"caption",className:"text-red-600",children:["-",l.deletions," deletions"]}),e.jsxs(d.Typography,{variant:"caption",className:"text-gray-500",children:[l.unchanged," unchanged"]})]}):null,y=o.cn("Bear-DiffViewer","rounded-lg overflow-hidden border",S?"bg-gray-900 border-gray-700":"bg-white border-gray-200",_);if(j==="unified")return e.jsxs("div",{className:y,"data-testid":h,children:[v(),e.jsx("div",{className:"overflow-x-auto",children:t.map((r,s)=>e.jsxs("div",{className:"flex",children:[x(r.oldLineNumber||r.newLineNumber),e.jsx("div",{className:"flex-1",children:u(r.content,r.type,s)})]},s))})]});const B=t.filter(r=>r.type!=="add"),M=t.filter(r=>r.type!=="remove");return e.jsxs("div",{className:y,"data-testid":h,children:[v(),e.jsxs("div",{className:"grid grid-cols-2 divide-x divide-gray-200 dark:divide-gray-700",children:[e.jsxs("div",{children:[e.jsx("div",{className:"px-3 py-2 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700",children:e.jsx(d.Typography,{variant:"caption",className:"font-semibold",children:T})}),e.jsx("div",{className:"overflow-x-auto",children:B.map((r,s)=>e.jsxs("div",{className:"flex",children:[x(r.oldLineNumber),e.jsx("div",{className:"flex-1",children:u(r.content,r.type==="remove"?"remove":"context",s)})]},s))})]}),e.jsxs("div",{children:[e.jsx("div",{className:"px-3 py-2 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700",children:e.jsx(d.Typography,{variant:"caption",className:"font-semibold",children:k})}),e.jsx("div",{className:"overflow-x-auto",children:M.map((r,s)=>e.jsxs("div",{className:"flex",children:[x(r.newLineNumber),e.jsx("div",{className:"flex-1",children:u(r.content,r.type==="add"?"add":"context",s)})]},s))})]})]})]})};exports.DiffViewer=P;

package/dist/components/DiffViewer/DiffViewer.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={add:{bg:"rgba(34, 197, 94, 0.15)",border:"rgba(34, 197, 94, 0.4)",text:"#22c55e"},remove:{bg:"rgba(239, 68, 68, 0.15)",border:"rgba(239, 68, 68, 0.4)",text:"#ef4444"},context:{bg:"transparent",border:"transparent",text:"inherit"}},t=50;exports.DIFF_COLORS=e;exports.LINE_NUMBER_WIDTH=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={add:{bg:"rgba(34, 197, 94, 0.15)",border:"rgba(34, 197, 94, 0.4)",text:"#22c55e"},remove:{bg:"rgba(239, 68, 68, 0.15)",border:"rgba(239, 68, 68, 0.4)",text:"#ef4444"},context:{bg:"transparent",border:"transparent",text:"inherit"}},t=50,o={compact:"py-0",comfortable:"py-1",spacious:"py-2"},r={add:"Added",remove:"Removed",context:"Unchanged"},E="Original",L="Modified",_="comfortable";exports.DEFAULT_NEW_TITLE=L;exports.DEFAULT_OLD_TITLE=E;exports.DEFAULT_SPACING=_;exports.DIFF_COLORS=e;exports.LINE_HOVER_LABELS=r;exports.LINE_NUMBER_WIDTH=t;exports.LINE_SPACING=o;

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

@@ -1,3 +1,4 @@
+import { DiffSpacing } from './DiffViewer.types';
 export declare const DIFF_COLORS: {
     readonly add: {
         readonly bg: "rgba(34, 197, 94, 0.15)";
@@ -16,3 +17,8 @@ export declare const DIFF_COLORS: {
     };
 };
 export declare const LINE_NUMBER_WIDTH = 50;
+export declare const LINE_SPACING: Record<DiffSpacing, string>;
+export declare const LINE_HOVER_LABELS: Record<string, string>;
+export declare const DEFAULT_OLD_TITLE = "Original";
+export declare const DEFAULT_NEW_TITLE = "Modified";
+export declare const DEFAULT_SPACING: DiffSpacing;

package/dist/components/DiffViewer/DiffViewer.const.js

@@ -1,4 +1,4 @@
-const r = {
+const t = {
   add: {
     bg: "rgba(34, 197, 94, 0.15)",
     border: "rgba(34, 197, 94, 0.4)",
@@ -14,8 +14,21 @@ const r = {
     border: "transparent",
     text: "inherit"
   }
-}, t = 50;
+}, e = 50, o = {
+  compact: "py-0",
+  comfortable: "py-1",
+  spacious: "py-2"
+}, r = {
+  add: "Added",
+  remove: "Removed",
+  context: "Unchanged"
+}, n = "Original", a = "Modified", c = "comfortable";
 export {
-  r as DIFF_COLORS,
-  t as LINE_NUMBER_WIDTH
+  a as DEFAULT_NEW_TITLE,
+  n as DEFAULT_OLD_TITLE,
+  c as DEFAULT_SPACING,
+  t as DIFF_COLORS,
+  r as LINE_HOVER_LABELS,
+  e as LINE_NUMBER_WIDTH,
+  o as LINE_SPACING
 };

package/dist/components/DiffViewer/DiffViewer.d.ts

@@ -1,18 +1,4 @@
 import { FC } from 'react';
 import { DiffViewerProps } from './DiffViewer.types';
-/**
- * DiffViewer - Compare and visualize text/code differences
- *
- * @example
- * ```tsx
- * <DiffViewer
- *   oldValue="const x = 1;"
- *   newValue="const x = 2;"
- *   viewMode="split"
- *   showLineNumbers
- *   showStats
- * />
- * ```
- */
 export declare const DiffViewer: FC<DiffViewerProps>;
 export default DiffViewer;