@mdigital_ui/ui 0.3.8 → 0.4.0

package/dist/chunk-FCODTRKL.js

@@ -1,72 +0,0 @@
-import { input_default } from './chunk-KYDQJSSW.js';
-import { cn, iconSizes } from './chunk-NGYLRX6F.js';
-import { Eye, EyeOff } from 'lucide-react';
-import React from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var PasswordInput = React.memo(
-  ({ visibilityToggle = true, size = "md", ref, classNames, ...props }) => {
-    const [showPassword, setShowPassword] = React.useState(false);
-    const toggleVisibility = React.useCallback(() => {
-      setShowPassword((prev) => !prev);
-    }, []);
-    return /* @__PURE__ */ jsx(
-      input_default,
-      {
-        ...props,
-        size,
-        ref,
-        type: showPassword ? "text" : "password",
-        classNames: {
-          root: cn("inputPassword_root", classNames?.root),
-          wrapper: cn("inputPassword_wrapper", classNames?.wrapper),
-          label: cn("inputPassword_label", classNames?.label),
-          input: cn("inputPassword_input", classNames?.input),
-          helper: cn("inputPassword_helper", classNames?.helper),
-          error: cn("inputPassword_error", classNames?.error)
-        },
-        rightIcon: visibilityToggle ? /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: toggleVisibility,
-            "data-slot": "toggleButton",
-            className: cn(
-              "inputPassword_toggleButton",
-              "cursor-pointer hover:text-text-primary transition-colors",
-              classNames?.toggleButton
-            ),
-            "aria-label": showPassword ? "Hide password" : "Show password",
-            children: showPassword ? /* @__PURE__ */ jsx(
-              Eye,
-              {
-                "data-slot": "toggleIcon",
-                className: cn(
-                  "inputPassword_toggleIcon",
-                  iconSizes[size],
-                  classNames?.toggleIcon
-                )
-              }
-            ) : /* @__PURE__ */ jsx(
-              EyeOff,
-              {
-                "data-slot": "toggleIcon",
-                className: cn(
-                  "inputPassword_toggleIcon",
-                  iconSizes[size],
-                  classNames?.toggleIcon
-                )
-              }
-            )
-          }
-        ) : void 0
-      }
-    );
-  }
-);
-PasswordInput.displayName = "PasswordInput";
-var input_password_default = PasswordInput;
-
-export { PasswordInput, input_password_default };
-//# sourceMappingURL=chunk-FCODTRKL.js.map
-//# sourceMappingURL=chunk-FCODTRKL.js.map

package/dist/chunk-FCODTRKL.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/input-password/index.tsx"],"names":[],"mappings":";;;;;;AASO,IAAM,gBAAgB,KAAA,CAAM,IAAA;AAAA,EACjC,CAAC,EAAE,gBAAA,GAAmB,IAAA,EAAM,IAAA,GAAO,MAAM,GAAA,EAAK,UAAA,EAAY,GAAG,KAAA,EAAM,KAAM;AACvE,IAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,KAAA,CAAM,SAAS,KAAK,CAAA;AAE5D,IAAA,MAAM,gBAAA,GAAmB,KAAA,CAAM,WAAA,CAAY,MAAM;AAC/C,MAAA,eAAA,CAAgB,CAAC,IAAA,KAAS,CAAC,IAAI,CAAA;AAAA,IACjC,CAAA,EAAG,EAAE,CAAA;AAEL,IAAA,uBACE,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACE,GAAG,KAAA;AAAA,QACJ,IAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA,EAAM,eAAe,MAAA,GAAS,UAAA;AAAA,QAC9B,UAAA,EAAY;AAAA,UACV,IAAA,EAAM,EAAA,CAAG,oBAAA,EAAsB,UAAA,EAAY,IAAI,CAAA;AAAA,UAC/C,OAAA,EAAS,EAAA,CAAG,uBAAA,EAAyB,UAAA,EAAY,OAAO,CAAA;AAAA,UACxD,KAAA,EAAO,EAAA,CAAG,qBAAA,EAAuB,UAAA,EAAY,KAAK,CAAA;AAAA,UAClD,KAAA,EAAO,EAAA,CAAG,qBAAA,EAAuB,UAAA,EAAY,KAAK,CAAA;AAAA,UAClD,MAAA,EAAQ,EAAA,CAAG,sBAAA,EAAwB,UAAA,EAAY,MAAM,CAAA;AAAA,UACrD,KAAA,EAAO,EAAA,CAAG,qBAAA,EAAuB,UAAA,EAAY,KAAK;AAAA,SACpD;AAAA,QACA,WACE,gBAAA,mBACE,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,gBAAA;AAAA,YACT,WAAA,EAAU,cAAA;AAAA,YACV,SAAA,EAAW,EAAA;AAAA,cACT,4BAAA;AAAA,cACA,0DAAA;AAAA,cACA,UAAA,EAAY;AAAA,aACd;AAAA,YACA,YAAA,EAAY,eAAe,eAAA,GAAkB,eAAA;AAAA,YAG5C,QAAA,EAAA,YAAA,mBACC,GAAA;AAAA,cAAC,GAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAU,YAAA;AAAA,gBACV,SAAA,EAAW,EAAA;AAAA,kBACT,0BAAA;AAAA,kBACA,UAAU,IAAI,CAAA;AAAA,kBACd,UAAA,EAAY;AAAA;AACd;AAAA,aACF,mBAEA,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAU,YAAA;AAAA,gBACV,SAAA,EAAW,EAAA;AAAA,kBACT,0BAAA;AAAA,kBACA,UAAU,IAAI,CAAA;AAAA,kBACd,UAAA,EAAY;AAAA;AACd;AAAA;AACF;AAAA,SAEJ,GACE;AAAA;AAAA,KAER;AAAA,EAEJ;AACF;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;AAG5B,IAAO,sBAAA,GAAQ","file":"chunk-FCODTRKL.js","sourcesContent":["'use client'\n\nimport { Eye, EyeOff } from 'lucide-react'\nimport React from 'react'\n\nimport Input from '../input'\nimport { cn, iconSizes } from '../utils'\nimport type { PasswordInputProps } from './types'\n\nexport const PasswordInput = React.memo<PasswordInputProps>(\n  ({ visibilityToggle = true, size = 'md', ref, classNames, ...props }) => {\n    const [showPassword, setShowPassword] = React.useState(false)\n\n    const toggleVisibility = React.useCallback(() => {\n      setShowPassword((prev) => !prev)\n    }, [])\n\n    return (\n      <Input\n        {...props}\n        size={size}\n        ref={ref}\n        type={showPassword ? 'text' : 'password'}\n        classNames={{\n          root: cn('inputPassword_root', classNames?.root),\n          wrapper: cn('inputPassword_wrapper', classNames?.wrapper),\n          label: cn('inputPassword_label', classNames?.label),\n          input: cn('inputPassword_input', classNames?.input),\n          helper: cn('inputPassword_helper', classNames?.helper),\n          error: cn('inputPassword_error', classNames?.error),\n        }}\n        rightIcon={\n          visibilityToggle ? (\n            <button\n              type=\"button\"\n              onClick={toggleVisibility}\n              data-slot=\"toggleButton\"\n              className={cn(\n                'inputPassword_toggleButton',\n                'cursor-pointer hover:text-text-primary transition-colors',\n                classNames?.toggleButton,\n              )}\n              aria-label={showPassword ? 'Hide password' : 'Show password'}\n              // tabIndex={-1}\n            >\n              {showPassword ? (\n                <Eye\n                  data-slot=\"toggleIcon\"\n                  className={cn(\n                    'inputPassword_toggleIcon',\n                    iconSizes[size],\n                    classNames?.toggleIcon,\n                  )}\n                />\n              ) : (\n                <EyeOff\n                  data-slot=\"toggleIcon\"\n                  className={cn(\n                    'inputPassword_toggleIcon',\n                    iconSizes[size],\n                    classNames?.toggleIcon,\n                  )}\n                />\n              )}\n            </button>\n          ) : undefined\n        }\n      />\n    )\n  },\n)\n\nPasswordInput.displayName = 'PasswordInput'\n\nexport type * from './types'\nexport default PasswordInput\n"]}

package/dist/chunk-FVTMKQUE.js

@@ -1,67 +0,0 @@
-import { cn } from './chunk-NGYLRX6F.js';
-import { cva } from 'class-variance-authority';
-import React from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var ribbonVariants = cva(
-  "absolute z-10 rounded-md font-semibold whitespace-nowrap",
-  {
-    variants: {
-      size: {
-        xs: "px-2 py-0.5 text-xs",
-        sm: "px-3 py-1 text-xs",
-        md: "px-4 py-1.5 text-sm",
-        lg: "px-5 py-2 text-base"
-      },
-      position: {
-        "top-left": "-top-2 -left-2",
-        "top-right": "-top-2 -right-2",
-        "bottom-left": "-bottom-2 -left-2",
-        "bottom-right": "-bottom-2 -right-2"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      position: "top-right"
-    }
-  }
-);
-var ribbonColorStyles = {
-  default: "bg-surface text-text-primary",
-  primary: "bg-primary text-white",
-  secondary: "bg-secondary text-white",
-  accent: "bg-accent text-white",
-  success: "bg-success text-white",
-  error: "bg-error text-white",
-  warning: "bg-warning text-white",
-  info: "bg-info text-white"
-};
-var Ribbon = React.memo(
-  ({
-    children,
-    color = "primary",
-    size = "md",
-    position = "top-right",
-    className
-  }) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        "data-slot": "root",
-        className: cn(
-          "ribbon_root",
-          ribbonVariants({ size, position }),
-          ribbonColorStyles[color],
-          className
-        ),
-        children
-      }
-    );
-  }
-);
-Ribbon.displayName = "Ribbon";
-var ribbon_default = Ribbon;
-
-export { Ribbon, ribbon_default };
-//# sourceMappingURL=chunk-FVTMKQUE.js.map
-//# sourceMappingURL=chunk-FVTMKQUE.js.map

package/dist/chunk-FVTMKQUE.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/ribbon/index.tsx"],"names":[],"mappings":";;;;;AAMA,IAAM,cAAA,GAAiB,GAAA;AAAA,EACrB,0DAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,qBAAA;AAAA,QACJ,EAAA,EAAI,mBAAA;AAAA,QACJ,EAAA,EAAI,qBAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,QAAA,EAAU;AAAA,QACR,UAAA,EAAY,gBAAA;AAAA,QACZ,WAAA,EAAa,iBAAA;AAAA,QACb,aAAA,EAAe,mBAAA;AAAA,QACf,cAAA,EAAgB;AAAA;AAClB,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM,IAAA;AAAA,MACN,QAAA,EAAU;AAAA;AACZ;AAEJ,CAAA;AAEA,IAAM,iBAAA,GAAoB;AAAA,EACxB,OAAA,EAAS,8BAAA;AAAA,EACT,OAAA,EAAS,uBAAA;AAAA,EACT,SAAA,EAAW,yBAAA;AAAA,EACX,MAAA,EAAQ,sBAAA;AAAA,EACR,OAAA,EAAS,uBAAA;AAAA,EACT,KAAA,EAAO,qBAAA;AAAA,EACP,OAAA,EAAS,uBAAA;AAAA,EACT,IAAA,EAAM;AACR,CAAA;AAEO,IAAM,SAAS,KAAA,CAAM,IAAA;AAAA,EAC1B,CAAC;AAAA,IACC,QAAA;AAAA,IACA,KAAA,GAAQ,SAAA;AAAA,IACR,IAAA,GAAO,IAAA;AAAA,IACP,QAAA,GAAW,WAAA;AAAA,IACX;AAAA,GACF,KAAM;AACJ,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAU,MAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA,UACT,aAAA;AAAA,UACA,cAAA,CAAe,EAAE,IAAA,EAAM,QAAA,EAAU,CAAA;AAAA,UACjC,kBAAkB,KAAK,CAAA;AAAA,UACvB;AAAA,SACF;AAAA,QAEC;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA;AAGrB,IAAO,cAAA,GAAQ","file":"chunk-FVTMKQUE.js","sourcesContent":["import { cva } from 'class-variance-authority'\nimport React from 'react'\n\nimport { cn } from '../utils'\nimport type { RibbonProps } from './types'\n\nconst ribbonVariants = cva(\n  'absolute z-10 rounded-md font-semibold whitespace-nowrap',\n  {\n    variants: {\n      size: {\n        xs: 'px-2 py-0.5 text-xs',\n        sm: 'px-3 py-1 text-xs',\n        md: 'px-4 py-1.5 text-sm',\n        lg: 'px-5 py-2 text-base',\n      },\n      position: {\n        'top-left': '-top-2 -left-2',\n        'top-right': '-top-2 -right-2',\n        'bottom-left': '-bottom-2 -left-2',\n        'bottom-right': '-bottom-2 -right-2',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      position: 'top-right',\n    },\n  },\n)\n\nconst ribbonColorStyles = {\n  default: 'bg-surface text-text-primary',\n  primary: 'bg-primary text-white',\n  secondary: 'bg-secondary text-white',\n  accent: 'bg-accent text-white',\n  success: 'bg-success text-white',\n  error: 'bg-error text-white',\n  warning: 'bg-warning text-white',\n  info: 'bg-info text-white',\n}\n\nexport const Ribbon = React.memo<RibbonProps>(\n  ({\n    children,\n    color = 'primary',\n    size = 'md',\n    position = 'top-right',\n    className,\n  }) => {\n    return (\n      <div\n        data-slot=\"root\"\n        className={cn(\n          'ribbon_root',\n          ribbonVariants({ size, position }),\n          ribbonColorStyles[color],\n          className,\n        )}\n      >\n        {children}\n      </div>\n    )\n  },\n)\n\nRibbon.displayName = 'Ribbon'\n\nexport type * from './types'\nexport default Ribbon\n"]}

package/dist/chunk-GGDDE7LC.js

@@ -1,303 +0,0 @@
-import { cn } from './chunk-NGYLRX6F.js';
-import { cva } from 'class-variance-authority';
-import React from 'react';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var dotVariants = cva(
-  "rounded-full shrink-0 flex items-center justify-center z-10",
-  {
-    variants: {
-      size: {
-        xs: "w-2 h-2",
-        sm: "w-3 h-3",
-        md: "w-4 h-4",
-        lg: "w-5 h-5"
-      },
-      color: {
-        default: "bg-border",
-        primary: "bg-primary",
-        secondary: "bg-secondary",
-        accent: "bg-accent",
-        success: "bg-success",
-        error: "bg-error",
-        warning: "bg-warning",
-        info: "bg-info"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      color: "default"
-    }
-  }
-);
-var connectorWidths = {
-  xs: "w-px",
-  sm: "w-px",
-  md: "w-0.5",
-  lg: "w-0.5"
-};
-var trackWidths = {
-  xs: "w-4",
-  sm: "w-5",
-  md: "w-6",
-  lg: "w-7"
-};
-var contentSizes = {
-  xs: "text-xs",
-  sm: "text-sm",
-  md: "text-base",
-  lg: "text-lg"
-};
-var timestampSizes = {
-  xs: "text-[10px]",
-  sm: "text-xs",
-  md: "text-sm",
-  lg: "text-base"
-};
-var iconDotSizes = {
-  xs: "w-5 h-5",
-  sm: "w-6 h-6",
-  md: "w-8 h-8",
-  lg: "w-10 h-10"
-};
-var iconSizes = {
-  xs: "h-3 w-3",
-  sm: "h-3.5 w-3.5",
-  md: "h-4 w-4",
-  lg: "h-5 w-5"
-};
-var Timeline = React.memo(
-  ({
-    items,
-    mode = "left",
-    size = "md",
-    color = "default",
-    pending = false,
-    pendingText = "Loading...",
-    reverse = false,
-    className,
-    classNames,
-    ref
-  }) => {
-    const displayItems = reverse ? [...items].reverse() : items;
-    const renderDot = (item, itemColor) => {
-      if (item.dot) {
-        return /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn("timeline_dot", "shrink-0 z-10", classNames?.dot),
-            "data-slot": "dot",
-            children: item.dot
-          }
-        );
-      }
-      if (item.icon) {
-        return /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn(
-              "timeline_dot",
-              "rounded-full shrink-0 flex items-center justify-center z-10",
-              iconDotSizes[size],
-              `bg-${itemColor === "default" ? "border" : itemColor}`,
-              "text-white",
-              classNames?.dot
-            ),
-            "data-slot": "dot",
-            children: /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  "timeline_icon",
-                  "flex items-center justify-center",
-                  iconSizes[size],
-                  classNames?.icon
-                ),
-                "data-slot": "icon",
-                children: item.icon
-              }
-            )
-          }
-        );
-      }
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "timeline_dot",
-            dotVariants({ size, color: itemColor }),
-            classNames?.dot
-          ),
-          "data-slot": "dot"
-        }
-      );
-    };
-    const renderContent = (item, isRight) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "timeline_content",
-          "flex-1 pb-8",
-          contentSizes[size],
-          isRight ? "text-right pr-4" : "pl-4",
-          classNames?.content
-        ),
-        "data-slot": "content",
-        children: [
-          item.timestamp && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "timeline_timestamp",
-                "text-text-secondary mb-1",
-                timestampSizes[size],
-                classNames?.timestamp
-              ),
-              "data-slot": "timestamp",
-              children: item.timestamp
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "timeline_title",
-                "font-semibold text-text-primary",
-                item.description && "mb-1",
-                classNames?.title
-              ),
-              "data-slot": "title",
-              children: item.title
-            }
-          ),
-          item.description && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "timeline_description",
-                "text-text-secondary",
-                classNames?.description
-              ),
-              "data-slot": "description",
-              children: item.description
-            }
-          )
-        ]
-      }
-    );
-    const renderTrack = (item, itemColor, isLast) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "timeline_track",
-          "relative flex flex-col items-center",
-          trackWidths[size]
-        ),
-        children: [
-          renderDot(item, itemColor),
-          !isLast && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "timeline_connector",
-                "flex-1 bg-border",
-                connectorWidths[size],
-                classNames?.connector
-              ),
-              "data-slot": "connector"
-            }
-          )
-        ]
-      }
-    );
-    const renderItem = (item, index) => {
-      const isLast = index === displayItems.length - 1 && !pending;
-      const itemColor = item.color || color;
-      const isRight = mode === "right" || mode === "alternate" && index % 2 !== 0;
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "timeline_item",
-            "flex",
-            isRight && "flex-row-reverse",
-            classNames?.item
-          ),
-          "data-slot": "item",
-          children: [
-            renderTrack(item, itemColor, isLast),
-            renderContent(item, isRight)
-          ]
-        },
-        item.key ?? index
-      );
-    };
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        className: cn("timeline_root", "relative", classNames?.root, className),
-        "data-slot": "root",
-        children: [
-          displayItems.map((item, index) => renderItem(item, index)),
-          pending && /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: cn(
-                "timeline_item",
-                "flex",
-                (mode === "right" || mode === "alternate" && displayItems.length % 2 !== 0) && "flex-row-reverse",
-                classNames?.item
-              ),
-              "data-slot": "item",
-              children: [
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "timeline_track",
-                      "relative flex flex-col items-center",
-                      trackWidths[size]
-                    ),
-                    children: /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "timeline_dot",
-                          dotVariants({ size, color: "default" }),
-                          "animate-pulse",
-                          classNames?.dot
-                        ),
-                        "data-slot": "dot"
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "timeline_content",
-                      "flex-1 text-text-secondary",
-                      contentSizes[size],
-                      mode === "right" || mode === "alternate" && displayItems.length % 2 !== 0 ? "text-right pr-4" : "pl-4",
-                      classNames?.content
-                    ),
-                    "data-slot": "content",
-                    children: pendingText
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Timeline.displayName = "Timeline";
-var timeline_default = Timeline;
-
-export { timeline_default };
-//# sourceMappingURL=chunk-GGDDE7LC.js.map
-//# sourceMappingURL=chunk-GGDDE7LC.js.map

package/dist/chunk-GGDDE7LC.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/timeline/index.tsx"],"names":[],"mappings":"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","file":"chunk-GGDDE7LC.js","sourcesContent":["'use client'\n\nimport { cva } from 'class-variance-authority'\nimport React from 'react'\n\nimport { cn } from '../utils'\nimport type { TimelineProps } from './types'\n\n/**\n * Timeline dot variants\n */\nconst dotVariants = cva(\n  'rounded-full shrink-0 flex items-center justify-center z-10',\n  {\n    variants: {\n      size: {\n        xs: 'w-2 h-2',\n        sm: 'w-3 h-3',\n        md: 'w-4 h-4',\n        lg: 'w-5 h-5',\n      },\n      color: {\n        default: 'bg-border',\n        primary: 'bg-primary',\n        secondary: 'bg-secondary',\n        accent: 'bg-accent',\n        success: 'bg-success',\n        error: 'bg-error',\n        warning: 'bg-warning',\n        info: 'bg-info',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      color: 'default',\n    },\n  }\n)\n\n/**\n * Connector width by size\n */\nconst connectorWidths = {\n  xs: 'w-px',\n  sm: 'w-px',\n  md: 'w-0.5',\n  lg: 'w-0.5',\n} as const\n\n/**\n * Track column width by size (enough to hold the dot)\n */\nconst trackWidths = {\n  xs: 'w-4',\n  sm: 'w-5',\n  md: 'w-6',\n  lg: 'w-7',\n} as const\n\n/**\n * Content text size by timeline size\n */\nconst contentSizes = {\n  xs: 'text-xs',\n  sm: 'text-sm',\n  md: 'text-base',\n  lg: 'text-lg',\n} as const\n\n/**\n * Timestamp text size by timeline size\n */\nconst timestampSizes = {\n  xs: 'text-[10px]',\n  sm: 'text-xs',\n  md: 'text-sm',\n  lg: 'text-base',\n} as const\n\n/**\n * Icon size for dots with icons\n */\nconst iconDotSizes = {\n  xs: 'w-5 h-5',\n  sm: 'w-6 h-6',\n  md: 'w-8 h-8',\n  lg: 'w-10 h-10',\n} as const\n\nconst iconSizes = {\n  xs: 'h-3 w-3',\n  sm: 'h-3.5 w-3.5',\n  md: 'h-4 w-4',\n  lg: 'h-5 w-5',\n} as const\n\n/**\n * Timeline Component\n *\n * Displays a vertical timeline with items connected by lines and dots.\n * Uses a flex column layout where the connector line naturally flows\n * from dot to dot within a dedicated track column.\n */\nconst Timeline = React.memo<TimelineProps>(\n  ({\n    items,\n    mode = 'left',\n    size = 'md',\n    color = 'default',\n    pending = false,\n    pendingText = 'Loading...',\n    reverse = false,\n    className,\n    classNames,\n    ref,\n  }) => {\n    const displayItems = reverse ? [...items].reverse() : items\n\n    const renderDot = (\n      item: (typeof displayItems)[number],\n      itemColor: typeof color\n    ) => {\n      if (item.dot) {\n        return (\n          <div\n            className={cn('timeline_dot', 'shrink-0 z-10', classNames?.dot)}\n            data-slot=\"dot\"\n          >\n            {item.dot}\n          </div>\n        )\n      }\n\n      if (item.icon) {\n        return (\n          <div\n            className={cn(\n              'timeline_dot',\n              'rounded-full shrink-0 flex items-center justify-center z-10',\n              iconDotSizes[size],\n              `bg-${itemColor === 'default' ? 'border' : itemColor}`,\n              'text-white',\n              classNames?.dot\n            )}\n            data-slot=\"dot\"\n          >\n            <span\n              className={cn(\n                'timeline_icon',\n                'flex items-center justify-center',\n                iconSizes[size],\n                classNames?.icon\n              )}\n              data-slot=\"icon\"\n            >\n              {item.icon}\n            </span>\n          </div>\n        )\n      }\n\n      return (\n        <div\n          className={cn(\n            'timeline_dot',\n            dotVariants({ size, color: itemColor }),\n            classNames?.dot\n          )}\n          data-slot=\"dot\"\n        />\n      )\n    }\n\n    const renderContent = (\n      item: (typeof displayItems)[number],\n      isRight: boolean\n    ) => (\n      <div\n        className={cn(\n          'timeline_content',\n          'flex-1 pb-8',\n          contentSizes[size],\n          isRight ? 'text-right pr-4' : 'pl-4',\n          classNames?.content\n        )}\n        data-slot=\"content\"\n      >\n        {item.timestamp && (\n          <div\n            className={cn(\n              'timeline_timestamp',\n              'text-text-secondary mb-1',\n              timestampSizes[size],\n              classNames?.timestamp\n            )}\n            data-slot=\"timestamp\"\n          >\n            {item.timestamp}\n          </div>\n        )}\n        <div\n          className={cn(\n            'timeline_title',\n            'font-semibold text-text-primary',\n            item.description && 'mb-1',\n            classNames?.title\n          )}\n          data-slot=\"title\"\n        >\n          {item.title}\n        </div>\n        {item.description && (\n          <div\n            className={cn(\n              'timeline_description',\n              'text-text-secondary',\n              classNames?.description\n            )}\n            data-slot=\"description\"\n          >\n            {item.description}\n          </div>\n        )}\n      </div>\n    )\n\n    const renderTrack = (\n      item: (typeof displayItems)[number],\n      itemColor: typeof color,\n      isLast: boolean\n    ) => (\n      <div\n        className={cn(\n          'timeline_track',\n          'relative flex flex-col items-center',\n          trackWidths[size]\n        )}\n      >\n        {renderDot(item, itemColor)}\n        {!isLast && (\n          <div\n            className={cn(\n              'timeline_connector',\n              'flex-1 bg-border',\n              connectorWidths[size],\n              classNames?.connector\n            )}\n            data-slot=\"connector\"\n          />\n        )}\n      </div>\n    )\n\n    const renderItem = (\n      item: (typeof displayItems)[number],\n      index: number\n    ) => {\n      const isLast = index === displayItems.length - 1 && !pending\n      const itemColor = item.color || color\n      const isRight =\n        mode === 'right' || (mode === 'alternate' && index % 2 !== 0)\n\n      return (\n        <div\n          key={item.key ?? index}\n          className={cn(\n            'timeline_item',\n            'flex',\n            isRight && 'flex-row-reverse',\n            classNames?.item\n          )}\n          data-slot=\"item\"\n        >\n          {renderTrack(item, itemColor, isLast)}\n          {renderContent(item, isRight)}\n        </div>\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cn('timeline_root', 'relative', classNames?.root, className)}\n        data-slot=\"root\"\n      >\n        {displayItems.map((item, index) => renderItem(item, index))}\n\n        {/* Pending indicator */}\n        {pending && (\n          <div\n            className={cn(\n              'timeline_item',\n              'flex',\n              (mode === 'right' ||\n                (mode === 'alternate' && displayItems.length % 2 !== 0)) &&\n                'flex-row-reverse',\n              classNames?.item\n            )}\n            data-slot=\"item\"\n          >\n            <div\n              className={cn(\n                'timeline_track',\n                'relative flex flex-col items-center',\n                trackWidths[size]\n              )}\n            >\n              <div\n                className={cn(\n                  'timeline_dot',\n                  dotVariants({ size, color: 'default' }),\n                  'animate-pulse',\n                  classNames?.dot\n                )}\n                data-slot=\"dot\"\n              />\n            </div>\n            <div\n              className={cn(\n                'timeline_content',\n                'flex-1 text-text-secondary',\n                contentSizes[size],\n                (mode === 'right' ||\n                  (mode === 'alternate' && displayItems.length % 2 !== 0))\n                  ? 'text-right pr-4'\n                  : 'pl-4',\n                classNames?.content\n              )}\n              data-slot=\"content\"\n            >\n              {pendingText}\n            </div>\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nTimeline.displayName = 'Timeline'\n\nexport type * from './types'\nexport default Timeline\n"]}