@forgedevstack/bear 1.3.1 → 1.3.3

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

@@ -1,45 +1,34 @@
 import { ReactNode } from 'react';
-import { ChatMessage } from '../Chat/Chat.types';
+import { ChatMessage, ChatTranslations } from '../Chat/Chat.types';
+export interface FloatingChatTranslations extends ChatTranslations {
+    closeLabel: string;
+    openLabel: string;
+}
 export interface FloatingChatProps {
     id?: string;
-    /** Chat messages */
+    testId?: string;
     messages: ChatMessage[];
-    /** Callback when user sends a message */
     onSend?: (message: string) => void;
-    /** Loading state */
+    onStop?: () => void;
+    onAttach?: (files: File[]) => void;
     isLoading?: boolean;
-    /** Typing indicator */
+    isStreaming?: boolean;
     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 */
+    allowAttach?: boolean;
     className?: string;
-    /** Test ID */
-    testId?: string;
+    translations?: Partial<FloatingChatTranslations>;
 }

package/dist/components/FloatingChat/FloatingChat.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../constants/generals.const.cjs"),e=require("./FloatingChat.const.cjs"),T=(t,_)=>({[e.FLOATING_CHAT_BOTTOM_VAR]:`${t}${r.UNIT_PX}`,[e.FLOATING_CHAT_SIDE_VAR]:`${_}${r.UNIT_PX}`,[e.FLOATING_CHAT_WIDTH_VAR]:`${e.CHAT_WINDOW_SIZE.width}${r.UNIT_PX}`,[e.FLOATING_CHAT_HEIGHT_VAR]:`${e.CHAT_WINDOW_SIZE.height}${r.UNIT_PX}`}),o=(t,_)=>t>_?`${_}+`:String(t);exports.resolveFloatingChatBadge=o;exports.resolveFloatingChatVars=T;

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

@@ -0,0 +1,2 @@
+export declare const resolveFloatingChatVars: (bottom: number, side: number) => Record<string, string>;
+export declare const resolveFloatingChatBadge: (count: number, max: number) => string;

package/dist/components/FloatingChat/FloatingChat.utils.js

@@ -0,0 +1,12 @@
+import { UNIT_PX as r } from "../../constants/generals.const.js";
+import { CHAT_WINDOW_SIZE as t, FLOATING_CHAT_HEIGHT_VAR as A, FLOATING_CHAT_WIDTH_VAR as o, FLOATING_CHAT_SIDE_VAR as I, FLOATING_CHAT_BOTTOM_VAR as e } from "./FloatingChat.const.js";
+const H = (_, T) => ({
+  [e]: `${_}${r}`,
+  [I]: `${T}${r}`,
+  [o]: `${t.width}${r}`,
+  [A]: `${t.height}${r}`
+}), C = (_, T) => _ > T ? `${T}+` : String(_);
+export {
+  C as resolveFloatingChatBadge,
+  H as resolveFloatingChatVars
+};

package/dist/components/FloatingChat/helpers/FloatingChatHeader.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../Avatar/Avatar.cjs");require("react");const r=require("../../Box/Box.cjs"),h=require("../../CloseButton/CloseButton.cjs"),g=require("../../Flex/Flex.cjs"),s=require("../../Typography/Typography.cjs"),x=i=>{const{header:a,title:t,subtitle:l,avatar:n,closeLabel:o,onClose:c}=i;return a?e.jsx(r.Box,{className:"Bear-FloatingChat__header",children:a}):e.jsxs(g.Flex,{className:"Bear-FloatingChat__header",align:"center",gap:3,children:[e.jsx(u.Avatar,{src:n,initials:t[0],size:"sm"}),e.jsxs(r.Box,{children:[e.jsx(s.Typography,{variant:"subtitle2",className:"Bear-FloatingChat__title",children:t}),e.jsx(s.Typography,{variant:"caption",className:"Bear-FloatingChat__subtitle",children:l})]}),e.jsx(h.CloseButton,{"aria-label":o,onClick:c})]})};exports.FloatingChatHeader=x;

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

@@ -0,0 +1,9 @@
+import { FloatingChatProps } from '../FloatingChat.types';
+export declare const FloatingChatHeader: (props: {
+    header?: FloatingChatProps["header"];
+    title: string;
+    subtitle: string;
+    avatar?: string;
+    closeLabel: string;
+    onClose: () => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/FloatingChat/helpers/FloatingChatHeader.js

@@ -0,0 +1,21 @@
+import { jsx as a, jsxs as e } from "react/jsx-runtime";
+import { Avatar as h } from "../../Avatar/Avatar.js";
+import "react";
+import { Box as i } from "../../Box/Box.js";
+import { CloseButton as p } from "../../CloseButton/CloseButton.js";
+import { Flex as d } from "../../Flex/Flex.js";
+import { Typography as o } from "../../Typography/Typography.js";
+const b = (l) => {
+  const { header: t, title: r, subtitle: n, avatar: s, closeLabel: m, onClose: c } = l;
+  return t ? /* @__PURE__ */ a(i, { className: "Bear-FloatingChat__header", children: t }) : /* @__PURE__ */ e(d, { className: "Bear-FloatingChat__header", align: "center", gap: 3, children: [
+    /* @__PURE__ */ a(h, { src: s, initials: r[0], size: "sm" }),
+    /* @__PURE__ */ e(i, { children: [
+      /* @__PURE__ */ a(o, { variant: "subtitle2", className: "Bear-FloatingChat__title", children: r }),
+      /* @__PURE__ */ a(o, { variant: "caption", className: "Bear-FloatingChat__subtitle", children: n })
+    ] }),
+    /* @__PURE__ */ a(p, { "aria-label": m, onClick: c })
+  ] });
+};
+export {
+  b as FloatingChatHeader
+};

package/dist/components/FloatingChat/helpers/FloatingChatTrigger.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../Badge/Badge.cjs"),i=require("../../Box/Box.cjs"),B=require("../../Button/Button.cjs"),C=require("../../CloseButton/CloseButton.cjs"),d=require("../FloatingChat.const.cjs"),h=require("../FloatingChat.utils.cjs"),_=s=>{const{isOpen:a,trigger:r,badgeCount:l,openLabel:n,closeLabel:g,onToggle:t}=s,o=l??0,c=!a&&o>0;return r?e.jsx(i.Box,{className:"Bear-FloatingChat__trigger",onClick:t,children:r}):e.jsxs(i.Box,{className:"Bear-FloatingChat__trigger",children:[a?e.jsx(C.CloseButton,{"aria-label":g,onClick:t,size:"lg"}):e.jsx(B.Button,{type:"button",variant:"primary","aria-label":n,onClick:t,children:n}),c&&e.jsx(u.Badge,{variant:"danger",size:"sm",className:"Bear-FloatingChat__badge",children:h.resolveFloatingChatBadge(o,d.FLOATING_CHAT_BADGE_MAX)})]})};exports.FloatingChatTrigger=_;

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

@@ -0,0 +1,9 @@
+import { FloatingChatProps } from '../FloatingChat.types';
+export declare const FloatingChatTrigger: (props: {
+    isOpen: boolean;
+    trigger?: FloatingChatProps["trigger"];
+    badgeCount?: number;
+    openLabel: string;
+    closeLabel: string;
+    onToggle: () => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/FloatingChat/helpers/FloatingChatTrigger.js

@@ -0,0 +1,17 @@
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import { Badge as p } from "../../Badge/Badge.js";
+import { Box as n } from "../../Box/Box.js";
+import { Button as C } from "../../Button/Button.js";
+import { CloseButton as d } from "../../CloseButton/CloseButton.js";
+import { FLOATING_CHAT_BADGE_MAX as h } from "../FloatingChat.const.js";
+import { resolveFloatingChatBadge as B } from "../FloatingChat.utils.js";
+const N = (l) => {
+  const { isOpen: a, trigger: t, badgeCount: g, openLabel: e, closeLabel: s, onToggle: o } = l, i = g ?? 0, m = !a && i > 0;
+  return t ? /* @__PURE__ */ r(n, { className: "Bear-FloatingChat__trigger", onClick: o, children: t }) : /* @__PURE__ */ c(n, { className: "Bear-FloatingChat__trigger", children: [
+    a ? /* @__PURE__ */ r(d, { "aria-label": s, onClick: o, size: "lg" }) : /* @__PURE__ */ r(C, { type: "button", variant: "primary", "aria-label": e, onClick: o, children: e }),
+    m && /* @__PURE__ */ r(p, { variant: "danger", size: "sm", className: "Bear-FloatingChat__badge", children: B(i, h) })
+  ] });
+};
+export {
+  N as FloatingChatTrigger
+};

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

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

package/dist/components/FormSkeleton/FormSkeleton.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),c=require("../../utils/cn.cjs");require("react");const S=require("../../utils/generateBearId.utils.cjs"),E=require("../../utils/useBearId.cjs"),o=require("../Skeleton/Skeleton.cjs"),e=require("./FormSkeleton.const.cjs"),u=({fields:s=e.FORM_SKELETON_DEFAULT_FIELDS,animation:t="pulse",id:l,testId:n,className:_})=>{const a=E.useBearId("FormSkeleton"),i=S.resolveBearId(l,a);return r.jsx("div",{id:i,"data-testid":n,className:c.cn(e.FORM_SKELETON_ROOT_CLASS,"bear-flex bear-flex-col",_),style:{gap:e.FORM_SKELETON_FIELD_GAP_PX},children:Array.from({length:s}).map((F,d)=>r.jsxs("div",{className:"Bear-FormSkeleton__field bear-flex bear-flex-col bear-gap-2",children:[r.jsx(o.Skeleton,{animation:t,width:"30%",height:e.FORM_SKELETON_LABEL_HEIGHT_PX}),r.jsx(o.Skeleton,{animation:t,width:"100%",height:e.FORM_SKELETON_FIELD_HEIGHT_PX})]},`field-${d}`))})};exports.FormSkeleton=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../constants/numbers.const.cjs"),u=require("../../constants/generals.const.cjs"),d=require("../../utils/cn.cjs");require("react");const S=require("../../utils/generateBearId.utils.cjs"),F=require("../../utils/useBearId.cjs"),n=require("../Flex/Flex.cjs"),t=require("../Skeleton/Skeleton.cjs"),_=s=>{const{fields:l=r.THREE,animation:o=u.ANIMATION_PULSE,id:a,testId:i,className:c}=s;return e.jsx(n.Flex,{id:S.resolveBearId(a,F.useBearId("FormSkeleton")),testId:i,direction:"column",gap:4,className:d.cn("Bear-FormSkeleton",c),children:Array.from({length:l}).map((k,m)=>e.jsxs(n.Flex,{direction:"column",gap:2,className:"Bear-FormSkeleton__field",children:[e.jsx(t.Skeleton,{animation:o,height:r.FOURTEEN,className:"Bear-FormSkeleton__label"}),e.jsx(t.Skeleton,{animation:o,height:r.FORTY,className:"Bear-FormSkeleton__control"})]},`field-${m}`))})};exports.FormSkeleton=_;

package/dist/components/FormSkeleton/FormSkeleton.d.ts

@@ -1,2 +1,2 @@
 import { FormSkeletonProps } from './FormSkeleton.types';
-export declare const FormSkeleton: ({ fields, animation, id, testId, className, }: FormSkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormSkeleton: (props: FormSkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/FormSkeleton/FormSkeleton.js

@@ -1,32 +1,43 @@
-import { jsx as e, jsxs as E } from "react/jsx-runtime";
-import { cn as s } from "../../utils/cn.js";
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { THREE as p, FOURTEEN as d, FORTY as f } from "../../constants/numbers.const.js";
+import { ANIMATION_PULSE as F } from "../../constants/generals.const.js";
+import { cn as N } from "../../utils/cn.js";
 import "react";
-import { resolveBearId as f } from "../../utils/generateBearId.utils.js";
-import { useBearId as p } from "../../utils/useBearId.js";
-import { Skeleton as o } from "../Skeleton/Skeleton.js";
-import { FORM_SKELETON_FIELD_GAP_PX as F, FORM_SKELETON_DEFAULT_FIELDS as L, FORM_SKELETON_LABEL_HEIGHT_PX as O, FORM_SKELETON_FIELD_HEIGHT_PX as S, FORM_SKELETON_ROOT_CLASS as n } from "./FormSkeleton.const.js";
-const b = ({
-  fields: t = L,
-  animation: r = "pulse",
-  id: _,
-  testId: l,
-  className: m
-}) => {
-  const a = p("FormSkeleton"), d = f(_, a);
+import { resolveBearId as S } from "../../utils/generateBearId.utils.js";
+import { useBearId as _ } from "../../utils/useBearId.js";
+import { Flex as r } from "../Flex/Flex.js";
+import { Skeleton as m } from "../Skeleton/Skeleton.js";
+const O = (t) => {
+  const { fields: l = p, animation: o = F, id: i, testId: a, className: n } = t;
   return /* @__PURE__ */ e(
-    "div",
+    r,
     {
-      id: d,
-      "data-testid": l,
-      className: s(n, "bear-flex bear-flex-col", m),
-      style: { gap: F },
-      children: Array.from({ length: t }).map((c, i) => /* @__PURE__ */ E("div", { className: "Bear-FormSkeleton__field bear-flex bear-flex-col bear-gap-2", children: [
-        /* @__PURE__ */ e(o, { animation: r, width: "30%", height: O }),
-        /* @__PURE__ */ e(o, { animation: r, width: "100%", height: S })
-      ] }, `field-${i}`))
+      id: S(i, _("FormSkeleton")),
+      testId: a,
+      direction: "column",
+      gap: 4,
+      className: N("Bear-FormSkeleton", n),
+      children: Array.from({ length: l }).map((h, s) => /* @__PURE__ */ c(r, { direction: "column", gap: 2, className: "Bear-FormSkeleton__field", children: [
+        /* @__PURE__ */ e(
+          m,
+          {
+            animation: o,
+            height: d,
+            className: "Bear-FormSkeleton__label"
+          }
+        ),
+        /* @__PURE__ */ e(
+          m,
+          {
+            animation: o,
+            height: f,
+            className: "Bear-FormSkeleton__control"
+          }
+        )
+      ] }, `field-${s}`))
     }
   );
 };
 export {
-  b as FormSkeleton
+  O as FormSkeleton
 };

package/dist/components/Gauge/Gauge.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),T=require("../../utils/cn.cjs");require("react");const x=require("../../utils/useBearId.cjs"),D=require("../Typography/Typography.cjs"),i=require("../Flex/Flex.cjs"),r=require("./Gauge.const.cjs"),L=require("./hooks/useGauge.cjs"),b=require("./helpers/GaugeArcSvg.cjs"),F=u=>{const{value:c,min:l=r.GAUGE_DEFAULT_MIN,max:o=r.GAUGE_DEFAULT_MAX,size:t=r.GAUGE_DEFAULT_SIZE,strokeWidth:s=r.GAUGE_DEFAULT_STROKE_WIDTH,color:g=r.GAUGE_DEFAULT_COLOR,trackColor:d,showLabel:A=!0,label:G,animated:_=!0,fillDurationMs:E=r.GAUGE_DEFAULT_FILL_DURATION_MS,arcAngle:U=r.GAUGE_DEFAULT_ARC_ANGLE,gradient:n,className:h,...m}=u,f=x.useBearId("Gauge","gradient"),e=L.useGauge({value:c,min:l,max:o,strokeWidth:s,arcAngle:U,animated:_,fillDurationMs:E});return a.jsxs(i.Flex,{align:"center",justify:"center",className:T.cn("bear-relative bear-inline-flex",h),style:{width:t,height:t},...m,children:[a.jsx(b.GaugeArcSvg,{radius:e.radius,strokeWidth:s,circumference:e.circumference,dashOffset:e.dashOffset,startAngle:e.startAngle,color:g,trackColor:d,gradientId:n?f:void 0,gradient:n,animated:e.animated,fillDurationMs:e.fillDurationMs}),A&&a.jsx(i.Flex,{align:"center",justify:"center",className:"bear-absolute bear-inset-0",children:G||a.jsxs(D.Typography,{variant:"h4",className:"bear-text-[var(--bear-text-primary)]",children:[Math.round(e.percentage),"%"]})})]})};exports.Gauge=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),_=require("../../utils/cn.cjs");require("react");const I=require("../../utils/useBearId.cjs"),N=require("../Typography/Typography.cjs"),i=require("../Flex/Flex.cjs"),e=require("./Gauge.const.cjs"),D=require("./hooks/useGauge.cjs"),b=require("./helpers/GaugeArcSvg.cjs"),R=require("./helpers/GaugeLinearBar.cjs"),y=s=>{const{value:E,min:U=e.GAUGE_DEFAULT_MIN,max:f=e.GAUGE_DEFAULT_MAX,size:t=e.GAUGE_DEFAULT_SIZE,strokeWidth:c=e.GAUGE_DEFAULT_STROKE_WIDTH,color:l=e.GAUGE_DEFAULT_COLOR,trackColor:u,showLabel:A=!0,label:G,animated:m=!0,fillDurationMs:h=e.GAUGE_DEFAULT_FILL_DURATION_MS,arcAngle:x=e.GAUGE_DEFAULT_ARC_ANGLE,variant:g=e.GAUGE_VARIANT_ARC,gradient:n,className:o,...d}=s,L=g===e.GAUGE_VARIANT_RING?s.arcAngle??e.GAUGE_RING_ARC_ANGLE:x,T=I.useBearId("Gauge","gradient"),r=D.useGauge({value:E,min:U,max:f,strokeWidth:c,arcAngle:L,animated:m,fillDurationMs:h});return g===e.GAUGE_VARIANT_LINEAR?a.jsx(i.Flex,{align:"center",justify:"center",className:_.cn("bear-relative bear-inline-flex",o),style:{width:t},...d,children:a.jsx(R.GaugeLinearBar,{percentage:r.percentage,color:l,trackColor:u,gradient:n,animated:r.animated,fillDurationMs:r.fillDurationMs,showLabel:A,label:G})}):a.jsxs(i.Flex,{align:"center",justify:"center",className:_.cn("bear-relative bear-inline-flex",o),style:{width:t,height:t},...d,children:[a.jsx(b.GaugeArcSvg,{radius:r.radius,strokeWidth:c,circumference:r.circumference,dashOffset:r.dashOffset,startAngle:r.startAngle,color:l,trackColor:u,gradientId:n?T:void 0,gradient:n,animated:r.animated,fillDurationMs:r.fillDurationMs}),A&&a.jsx(i.Flex,{align:"center",justify:"center",className:"bear-absolute bear-inset-0",children:G||a.jsxs(N.Typography,{variant:"h4",className:"bear-text-[var(--bear-text-primary)]",children:[Math.round(r.percentage),"%"]})})]})};exports.Gauge=y;

package/dist/components/Gauge/Gauge.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=0,E=100,_=120,G=10,U="var(--bear-primary-500, #ec4899)",T=270,L=900,D=50,I="cubic-bezier(0.4, 0, 0.2, 1)";exports.GAUGE_ANIMATION_EASING=I;exports.GAUGE_DEFAULT_ARC_ANGLE=T;exports.GAUGE_DEFAULT_COLOR=U;exports.GAUGE_DEFAULT_FILL_DURATION_MS=L;exports.GAUGE_DEFAULT_MAX=E;exports.GAUGE_DEFAULT_MIN=A;exports.GAUGE_DEFAULT_SIZE=_;exports.GAUGE_DEFAULT_STROKE_WIDTH=G;exports.GAUGE_VIEWBOX_CENTER=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=0,G=100,_=120,E=10,U="var(--bear-primary-500, #ec4899)",T=270,I=900,N=50,R="cubic-bezier(0.4, 0, 0.2, 1)",L="arc",c="linear",t="ring",n=360,o=8;exports.GAUGE_ANIMATION_EASING=R;exports.GAUGE_DEFAULT_ARC_ANGLE=T;exports.GAUGE_DEFAULT_COLOR=U;exports.GAUGE_DEFAULT_FILL_DURATION_MS=I;exports.GAUGE_DEFAULT_MAX=G;exports.GAUGE_DEFAULT_MIN=A;exports.GAUGE_DEFAULT_SIZE=_;exports.GAUGE_DEFAULT_STROKE_WIDTH=E;exports.GAUGE_LINEAR_TRACK_HEIGHT=o;exports.GAUGE_RING_ARC_ANGLE=n;exports.GAUGE_VARIANT_ARC=L;exports.GAUGE_VARIANT_LINEAR=c;exports.GAUGE_VARIANT_RING=t;exports.GAUGE_VIEWBOX_CENTER=N;

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

@@ -7,3 +7,8 @@ export declare const GAUGE_DEFAULT_ARC_ANGLE = 270;
 export declare const GAUGE_DEFAULT_FILL_DURATION_MS = 900;
 export declare const GAUGE_VIEWBOX_CENTER = 50;
 export declare const GAUGE_ANIMATION_EASING = "cubic-bezier(0.4, 0, 0.2, 1)";
+export declare const GAUGE_VARIANT_ARC = "arc";
+export declare const GAUGE_VARIANT_LINEAR = "linear";
+export declare const GAUGE_VARIANT_RING = "ring";
+export declare const GAUGE_RING_ARC_ANGLE = 360;
+export declare const GAUGE_LINEAR_TRACK_HEIGHT = 8;

package/dist/components/Gauge/Gauge.const.js

@@ -1,12 +1,17 @@
-const A = 0, E = 100, _ = 120, G = 10, U = "var(--bear-primary-500, #ec4899)", c = 270, T = 900, L = 50, o = "cubic-bezier(0.4, 0, 0.2, 1)";
+const A = 0, G = 100, _ = 120, E = 10, U = "var(--bear-primary-500, #ec4899)", c = 270, I = 900, T = 50, n = "cubic-bezier(0.4, 0, 0.2, 1)", o = "arc", t = "linear", N = "ring", R = 360, s = 8;
 export {
-  o as GAUGE_ANIMATION_EASING,
+  n as GAUGE_ANIMATION_EASING,
   c as GAUGE_DEFAULT_ARC_ANGLE,
   U as GAUGE_DEFAULT_COLOR,
-  T as GAUGE_DEFAULT_FILL_DURATION_MS,
-  E as GAUGE_DEFAULT_MAX,
+  I as GAUGE_DEFAULT_FILL_DURATION_MS,
+  G as GAUGE_DEFAULT_MAX,
   A as GAUGE_DEFAULT_MIN,
   _ as GAUGE_DEFAULT_SIZE,
-  G as GAUGE_DEFAULT_STROKE_WIDTH,
-  L as GAUGE_VIEWBOX_CENTER
+  E as GAUGE_DEFAULT_STROKE_WIDTH,
+  s as GAUGE_LINEAR_TRACK_HEIGHT,
+  R as GAUGE_RING_ARC_ANGLE,
+  o as GAUGE_VARIANT_ARC,
+  t as GAUGE_VARIANT_LINEAR,
+  N as GAUGE_VARIANT_RING,
+  T as GAUGE_VIEWBOX_CENTER
 };

package/dist/components/Gauge/Gauge.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
 import { GaugeProps } from './Gauge.types';
-export declare const Gauge: FC<GaugeProps>;
+export declare const Gauge: (props: GaugeProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Gauge/Gauge.js

@@ -1,70 +1,94 @@
-import { jsxs as i, jsx as n } from "react/jsx-runtime";
-import { cn as h } from "../../utils/cn.js";
+import { jsx as r, jsxs as _ } from "react/jsx-runtime";
+import { cn as d } from "../../utils/cn.js";
 import "react";
 import { useBearId as D } from "../../utils/useBearId.js";
-import { Typography as L } from "../Typography/Typography.js";
-import { Flex as s } from "../Flex/Flex.js";
-import { GAUGE_DEFAULT_MIN as T, GAUGE_DEFAULT_MAX as b, GAUGE_DEFAULT_SIZE as F, GAUGE_DEFAULT_STROKE_WIDTH as x, GAUGE_DEFAULT_COLOR as I, GAUGE_DEFAULT_FILL_DURATION_MS as M, GAUGE_DEFAULT_ARC_ANGLE as N } from "./Gauge.const.js";
-import { useGauge as v } from "./hooks/useGauge.js";
-import { GaugeArcSvg as y } from "./helpers/GaugeArcSvg.js";
-const B = (o) => {
+import { Typography as I } from "../Typography/Typography.js";
+import { Flex as i } from "../Flex/Flex.js";
+import { GAUGE_DEFAULT_MIN as T, GAUGE_DEFAULT_MAX as R, GAUGE_DEFAULT_SIZE as b, GAUGE_DEFAULT_STROKE_WIDTH as v, GAUGE_DEFAULT_COLOR as x, GAUGE_DEFAULT_FILL_DURATION_MS as F, GAUGE_DEFAULT_ARC_ANGLE as M, GAUGE_VARIANT_ARC as y, GAUGE_VARIANT_RING as O, GAUGE_RING_ARC_ANGLE as j, GAUGE_VARIANT_LINEAR as C } from "./Gauge.const.js";
+import { useGauge as S } from "./hooks/useGauge.js";
+import { GaugeArcSvg as w } from "./helpers/GaugeArcSvg.js";
+import { GaugeLinearBar as V } from "./helpers/GaugeLinearBar.js";
+const P = (n) => {
   const {
-    value: l,
-    min: m = T,
-    max: c = b,
-    size: r = F,
-    strokeWidth: a = x,
-    color: u = I,
-    trackColor: A,
-    showLabel: d = !0,
-    label: f,
-    animated: g = !0,
-    fillDurationMs: G = M,
-    arcAngle: _ = N,
+    value: f,
+    min: g = T,
+    max: E = R,
+    size: a = b,
+    strokeWidth: l = v,
+    color: s = x,
+    trackColor: o,
+    showLabel: A = !0,
+    label: c,
+    animated: U = !0,
+    fillDurationMs: h = F,
+    arcAngle: p = M,
+    variant: m = y,
     gradient: t,
-    className: E,
-    ...U
-  } = o, p = D("Gauge", "gradient"), e = v({
-    value: l,
-    min: m,
-    max: c,
-    strokeWidth: a,
-    arcAngle: _,
-    animated: g,
-    fillDurationMs: G
+    className: G,
+    ...u
+  } = n, L = m === O ? n.arcAngle ?? j : p, N = D("Gauge", "gradient"), e = S({
+    value: f,
+    min: g,
+    max: E,
+    strokeWidth: l,
+    arcAngle: L,
+    animated: U,
+    fillDurationMs: h
   });
-  return /* @__PURE__ */ i(
-    s,
+  return m === C ? /* @__PURE__ */ r(
+    i,
     {
       align: "center",
       justify: "center",
-      className: h("bear-relative bear-inline-flex", E),
-      style: { width: r, height: r },
-      ...U,
+      className: d("bear-relative bear-inline-flex", G),
+      style: { width: a },
+      ...u,
+      children: /* @__PURE__ */ r(
+        V,
+        {
+          percentage: e.percentage,
+          color: s,
+          trackColor: o,
+          gradient: t,
+          animated: e.animated,
+          fillDurationMs: e.fillDurationMs,
+          showLabel: A,
+          label: c
+        }
+      )
+    }
+  ) : /* @__PURE__ */ _(
+    i,
+    {
+      align: "center",
+      justify: "center",
+      className: d("bear-relative bear-inline-flex", G),
+      style: { width: a, height: a },
+      ...u,
       children: [
-        /* @__PURE__ */ n(
-          y,
+        /* @__PURE__ */ r(
+          w,
           {
             radius: e.radius,
-            strokeWidth: a,
+            strokeWidth: l,
             circumference: e.circumference,
             dashOffset: e.dashOffset,
             startAngle: e.startAngle,
-            color: u,
-            trackColor: A,
-            gradientId: t ? p : void 0,
+            color: s,
+            trackColor: o,
+            gradientId: t ? N : void 0,
             gradient: t,
             animated: e.animated,
             fillDurationMs: e.fillDurationMs
           }
         ),
-        d && /* @__PURE__ */ n(
-          s,
+        A && /* @__PURE__ */ r(
+          i,
           {
             align: "center",
             justify: "center",
             className: "bear-absolute bear-inset-0",
-            children: f || /* @__PURE__ */ i(L, { variant: "h4", className: "bear-text-[var(--bear-text-primary)]", children: [
+            children: c || /* @__PURE__ */ _(I, { variant: "h4", className: "bear-text-[var(--bear-text-primary)]", children: [
               Math.round(e.percentage),
               "%"
             ] })
@@ -75,5 +99,5 @@ const B = (o) => {
   );
 };
 export {
-  B as Gauge
+  P as Gauge
 };

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

@@ -24,8 +24,17 @@ export interface GaugeProps extends HTMLAttributes<HTMLDivElement> {
     animated?: boolean;
     /** Fill transition duration in ms when animated */
     fillDurationMs?: number;
-    /** Arc angle (180 for half, 270 for 3/4, 360 for full) */
     arcAngle?: number;
-    /** Gradient colors [start, end] */
+    variant?: 'arc' | 'linear' | 'ring';
     gradient?: [string, string];
 }
+export interface GaugeLinearBarProps {
+    percentage: number;
+    color: string;
+    trackColor?: string;
+    gradient?: [string, string];
+    animated: boolean;
+    fillDurationMs: number;
+    showLabel: boolean;
+    label?: ReactNode;
+}

package/dist/components/Gauge/helpers/GaugeLinearBar.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("../../Flex/Flex.cjs"),n=require("../../Box/Box.cjs"),b=require("../../Typography/Typography.cjs"),i=require("../Gauge.const.cjs"),h=t=>{const{percentage:o,color:l,trackColor:u,gradient:r,animated:a,fillDurationMs:s,showLabel:c,label:d}=t;return e.jsxs(g.Flex,{direction:"column",gap:2,className:"Bear-Gauge Bear-Gauge--linear bear-w-full",children:[e.jsx(n.Box,{className:"Bear-Gauge__linear-track bear-w-full bear-overflow-hidden bear-rounded-full",style:{height:i.GAUGE_LINEAR_TRACK_HEIGHT,backgroundColor:u??"var(--bear-border-default)"},children:e.jsx(n.Box,{className:"Bear-Gauge__linear-fill bear-h-full bear-rounded-full",style:{width:`${o}%`,background:r?`linear-gradient(90deg, ${r[0]}, ${r[1]})`:l,transitionProperty:a?"width":void 0,transitionDuration:a?`${s}ms`:void 0,transitionTimingFunction:a?i.GAUGE_ANIMATION_EASING:void 0}})}),c&&(d||e.jsxs(b.Typography,{variant:"caption",color:"muted",children:[Math.round(o),"%"]}))]})};exports.GaugeLinearBar=h;

package/dist/components/Gauge/helpers/GaugeLinearBar.d.ts

@@ -0,0 +1,2 @@
+import { GaugeLinearBarProps } from '../Gauge.types';
+export declare const GaugeLinearBar: (props: GaugeLinearBarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Gauge/helpers/GaugeLinearBar.js

@@ -0,0 +1,40 @@
+import { jsxs as o, jsx as i } from "react/jsx-runtime";
+import { Flex as m } from "../../Flex/Flex.js";
+import { Box as l } from "../../Box/Box.js";
+import { Typography as g } from "../../Typography/Typography.js";
+import { GAUGE_LINEAR_TRACK_HEIGHT as f, GAUGE_ANIMATION_EASING as b } from "../Gauge.const.js";
+const N = (n) => {
+  const { percentage: e, color: t, trackColor: d, gradient: r, animated: a, fillDurationMs: u, showLabel: c, label: s } = n;
+  return /* @__PURE__ */ o(m, { direction: "column", gap: 2, className: "Bear-Gauge Bear-Gauge--linear bear-w-full", children: [
+    /* @__PURE__ */ i(
+      l,
+      {
+        className: "Bear-Gauge__linear-track bear-w-full bear-overflow-hidden bear-rounded-full",
+        style: {
+          height: f,
+          backgroundColor: d ?? "var(--bear-border-default)"
+        },
+        children: /* @__PURE__ */ i(
+          l,
+          {
+            className: "Bear-Gauge__linear-fill bear-h-full bear-rounded-full",
+            style: {
+              width: `${e}%`,
+              background: r ? `linear-gradient(90deg, ${r[0]}, ${r[1]})` : t,
+              transitionProperty: a ? "width" : void 0,
+              transitionDuration: a ? `${u}ms` : void 0,
+              transitionTimingFunction: a ? b : void 0
+            }
+          }
+        )
+      }
+    ),
+    c && (s || /* @__PURE__ */ o(g, { variant: "caption", color: "muted", children: [
+      Math.round(e),
+      "%"
+    ] }))
+  ] });
+};
+export {
+  N as GaugeLinearBar
+};

package/dist/components/Heatmap/Heatmap.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("react"),S=require("../../utils/cn.cjs"),W=require("../Popover/Popover.cjs"),N=require("../Typography/Typography.cjs"),o=require("./Heatmap.const.cjs"),k=require("./Heatmap.utils.cjs"),I=({data:v,startDate:d,endDate:h,colorScale:u=o.DEFAULT_COLOR_SCALE,cellSize:m=o.DEFAULT_CELL_SIZE,cellGap:p=o.DEFAULT_CELL_GAP,showDayLabels:y=!0,showMonthLabels:b=!0,emptyColor:L,tooltipFormat:E,onCellClick:x,renderTooltip:i,testId:D,className:O,...q})=>{const[g,H]=l.useState(null),[P,_]=l.useState(!1),R=l.useRef(new Map),{weeks:M,dataMap:T,maxValue:f}=l.useMemo(()=>{const e=h?new Date(h):new Date,a=d?new Date(d):new Date(e.getFullYear()-1,e.getMonth(),e.getDate()),c=new Map;let r=0;for(const n of v)c.set(n.date,n),n.value>r&&(r=n.value);return{weeks:k.getWeeks(a,e),dataMap:c,maxValue:r}},[v,d,h]),C=l.useCallback(e=>{if(e===0||f===0)return L??o.DEFAULT_EMPTY_COLOR;const a=Math.min(Math.floor(e/f*(u.length-1)),u.length-1);return u[a]},[f,L,u]),j=y?28:0,F=l.useCallback(e=>{!e||!i||(H(e),_(!0))},[i]),U=l.useCallback(()=>{_(!1),H(null)},[]);return s.jsxs("div",{className:S.cn("Bear-Heatmap relative inline-block",O),"data-testid":D,...q,children:[b&&s.jsx("div",{className:"Bear-Heatmap__months flex mb-1",style:{paddingLeft:j},children:M.map((e,a)=>{const c=e[0],r=a===0||c.getDate()<=o.DAYS_IN_WEEK;return s.jsx(N.Typography,{variant:"caption",className:"Bear-Heatmap__month text-gray-400 dark:text-gray-500 text-[10px]",style:{width:m+p,textAlign:"left"},children:r?o.MONTH_LABELS[c.getMonth()]:""},a)})}),s.jsxs("div",{className:"Bear-Heatmap__grid flex",children:[y&&s.jsx("div",{className:"Bear-Heatmap__days flex flex-col mr-1",style:{gap:p},children:o.DAY_LABELS.map((e,a)=>s.jsx(N.Typography,{variant:"caption",className:"Bear-Heatmap__day text-gray-400 dark:text-gray-500 text-[10px] flex items-center justify-end",style:{height:m,width:j-o.LABEL_PAD},children:e},a))}),s.jsx("div",{className:"Bear-Heatmap__weeks flex",style:{gap:p},children:M.map((e,a)=>s.jsx("div",{className:"Bear-Heatmap__week flex flex-col",style:{gap:p},children:e.map((c,r)=>{const n=k.toKey(c),t=T.get(n),w=(t==null?void 0:t.value)??0,Y=C(w),A=s.jsx("div",{ref:B=>{B&&R.current.set(n,B)},className:"Bear-Heatmap__cell rounded-sm cursor-pointer transition-transform hover:scale-125",style:{width:m,height:m,backgroundColor:Y},title:i?void 0:t?E?E(t):`${n}: ${w}`:n,onClick:()=>t&&(x==null?void 0:x(t)),onMouseEnter:()=>F(t),onMouseLeave:U},r);return i&&t&&(g==null?void 0:g.date)===t.date?s.jsx(W.Popover,{content:i(t),trigger:"hover",placement:"top",open:P,onOpenChange:_,arrow:!1,children:A},r):A})},a))})]})]})};exports.Heatmap=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("react"),N=require("../../utils/cn.cjs"),W=require("../Popover/Popover.cjs"),k=require("../Typography/Typography.cjs"),n=require("./Heatmap.const.cjs"),b=require("./Heatmap.utils.cjs"),K=({data:L,startDate:p,endDate:_,colorScale:u=n.DEFAULT_COLOR_SCALE,cellSize:d=n.DEFAULT_CELL_SIZE,cellGap:m=n.DEFAULT_CELL_GAP,showDayLabels:v=!0,showMonthLabels:C=!0,emptyColor:y,tooltipFormat:E,onCellClick:h,renderTooltip:i,cellShape:D=n.CELL_SHAPE_SQUARE,testId:O,className:P,...R})=>{const[x,H]=l.useState(null),[q,g]=l.useState(!1),S=l.useRef(new Map),{weeks:A,dataMap:T,maxValue:f}=l.useMemo(()=>{const e=_?new Date(_):new Date,a=p?new Date(p):new Date(e.getFullYear()-1,e.getMonth(),e.getDate()),c=new Map;let o=0;for(const r of L)c.set(r.date,r),r.value>o&&(o=r.value);return{weeks:b.getWeeks(a,e),dataMap:c,maxValue:o}},[L,p,_]),U=l.useCallback(e=>{if(e===0||f===0)return y??n.DEFAULT_EMPTY_COLOR;const a=Math.min(Math.floor(e/f*(u.length-1)),u.length-1);return u[a]},[f,y,u]),M=v?28:0,F=l.useCallback(e=>{!e||!i||(H(e),g(!0))},[i]),Y=l.useCallback(()=>{g(!1),H(null)},[]);return s.jsxs("div",{className:N.cn("Bear-Heatmap relative inline-block",P),"data-testid":O,...R,children:[C&&s.jsx("div",{className:"Bear-Heatmap__months flex mb-1",style:{paddingLeft:M},children:A.map((e,a)=>{const c=e[0],o=a===0||c.getDate()<=n.DAYS_IN_WEEK;return s.jsx(k.Typography,{variant:"caption",className:"Bear-Heatmap__month text-gray-400 dark:text-gray-500 text-[10px]",style:{width:d+m,textAlign:"left"},children:o?n.MONTH_LABELS[c.getMonth()]:""},a)})}),s.jsxs("div",{className:"Bear-Heatmap__grid flex",children:[v&&s.jsx("div",{className:"Bear-Heatmap__days flex flex-col mr-1",style:{gap:m},children:n.DAY_LABELS.map((e,a)=>s.jsx(k.Typography,{variant:"caption",className:"Bear-Heatmap__day text-gray-400 dark:text-gray-500 text-[10px] flex items-center justify-end",style:{height:d,width:M-n.LABEL_PAD},children:e},a))}),s.jsx("div",{className:"Bear-Heatmap__weeks flex",style:{gap:m},children:A.map((e,a)=>s.jsx("div",{className:"Bear-Heatmap__week flex flex-col",style:{gap:m},children:e.map((c,o)=>{const r=b.toKey(c),t=T.get(r),j=(t==null?void 0:t.value)??0,I=U(j),w=s.jsx("div",{ref:B=>{B&&S.current.set(r,B)},className:N.cn("Bear-Heatmap__cell cursor-pointer transition-transform hover:scale-125",D===n.CELL_SHAPE_CIRCLE?"rounded-full":"rounded-sm"),style:{width:d,height:d,backgroundColor:I},title:i?void 0:t?E?E(t):`${r}: ${j}`:r,onClick:()=>t&&(h==null?void 0:h(t)),onMouseEnter:()=>F(t),onMouseLeave:Y},o);return i&&t&&(x==null?void 0:x.date)===t.date?s.jsx(W.Popover,{content:i(t),trigger:"hover",placement:"top",open:q,onOpenChange:g,arrow:!1,children:w},o):w})},a))})]})]})};exports.Heatmap=K;

package/dist/components/Heatmap/Heatmap.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const L=12,E=3,A=["#161b22","#0e4429","#006d32","#26a641","#39d353"],_="#ebedf0",t=["","Mon","","Wed","","Fri",""],D=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],e=7,o=4;exports.DAYS_IN_WEEK=e;exports.DAY_LABELS=t;exports.DEFAULT_CELL_GAP=E;exports.DEFAULT_CELL_SIZE=L;exports.DEFAULT_COLOR_SCALE=A;exports.DEFAULT_EMPTY_COLOR=_;exports.LABEL_PAD=o;exports.MONTH_LABELS=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const L=12,E=3,_=["#161b22","#0e4429","#006d32","#26a641","#39d353"],A="#ebedf0",S=["","Mon","","Wed","","Fri",""],C=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],t=7,c=4,e="square",o="circle";exports.CELL_SHAPE_CIRCLE=o;exports.CELL_SHAPE_SQUARE=e;exports.DAYS_IN_WEEK=t;exports.DAY_LABELS=S;exports.DEFAULT_CELL_GAP=E;exports.DEFAULT_CELL_SIZE=L;exports.DEFAULT_COLOR_SCALE=_;exports.DEFAULT_EMPTY_COLOR=A;exports.LABEL_PAD=c;exports.MONTH_LABELS=C;

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

@@ -6,3 +6,5 @@ export declare const DAY_LABELS: string[];
 export declare const MONTH_LABELS: string[];
 export declare const DAYS_IN_WEEK = 7;
 export declare const LABEL_PAD = 4;
+export declare const CELL_SHAPE_SQUARE = "square";
+export declare const CELL_SHAPE_CIRCLE = "circle";

package/dist/components/Heatmap/Heatmap.const.js

@@ -1,11 +1,13 @@
-const L = 12, A = 3, E = ["#161b22", "#0e4429", "#006d32", "#26a641", "#39d353"], _ = "#ebedf0", n = ["", "Mon", "", "Wed", "", "Fri", ""], o = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], c = 7, t = 4;
+const L = 12, E = 3, A = ["#161b22", "#0e4429", "#006d32", "#26a641", "#39d353"], _ = "#ebedf0", c = ["", "Mon", "", "Wed", "", "Fri", ""], n = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], o = 7, t = 4, s = "square", e = "circle";
 export {
-  c as DAYS_IN_WEEK,
-  n as DAY_LABELS,
-  A as DEFAULT_CELL_GAP,
+  e as CELL_SHAPE_CIRCLE,
+  s as CELL_SHAPE_SQUARE,
+  o as DAYS_IN_WEEK,
+  c as DAY_LABELS,
+  E as DEFAULT_CELL_GAP,
   L as DEFAULT_CELL_SIZE,
-  E as DEFAULT_COLOR_SCALE,
+  A as DEFAULT_COLOR_SCALE,
   _ as DEFAULT_EMPTY_COLOR,
   t as LABEL_PAD,
-  o as MONTH_LABELS
+  n as MONTH_LABELS
 };