@gearbox-protocol/permissionless-ui 1.22.0-next.45 → 1.22.0-next.47

package/dist/types/components/search-line/search-line.d.ts

@@ -5,7 +5,7 @@ declare const searchLineVariants: (props?: ({
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare const searchLineInputVariants: (props?: ({
     active?: boolean | null | undefined;
-    theme?: "dark" | "light" | null | undefined;
+    theme?: "dark" | "light" | "deep-light" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface SearchLineState {
     value: string;
@@ -25,9 +25,9 @@ export interface SearchLineProps extends Omit<React.HTMLAttributes<HTMLDivElemen
      */
     placeholder?: string;
     /**
-     * Theme variant
+     * Theme variant (deep-light / deep-dark match interface SearchLine colors)
      */
-    theme?: "light" | "dark";
+    theme?: "light" | "dark" | "deep-light";
     /**
      * Whether to show the search icon on the left
      */
@@ -88,9 +88,9 @@ export interface WithSearchLineProps {
      */
     placeholder?: string;
     /**
-     * Theme variant
+     * Theme variant (deep-light / deep-dark match interface SearchLine colors)
      */
-    theme?: "light" | "dark";
+    theme?: "light" | "dark" | "deep-light";
     /**
      * Content to display alongside the search line
      */

package/dist/types/components/split-list/split-list.d.ts

@@ -1,37 +1,32 @@
 import * as React from "react";
-type ColSize = boolean | number | "auto";
+/** Column size: true = equal flex, "auto" = auto width. */
+type ColSize = boolean | "auto";
 export interface SplitListProps {
-    /**
-     * Size for each column (can be function for dynamic sizing)
-     */
+    /** Size for each column (or function for per-index). @default true */
     colSize?: ColSize | ((index: number) => ColSize);
-    /**
-     * Children content
-     */
+    /** List items. */
     children?: React.ReactNode;
-    /**
-     * Additional CSS class
-     */
+    /** Extra class name for the root. */
     className?: string;
 }
 /**
- * SplitList — horizontal list with dividers between items
+ * SplitList — horizontal list with vertical dividers between items (matches interface).
+ *
+ * @usage
+ * Use for a row of columns with centered vertical separators.
  *
  * @example
  * ```tsx
  * <SplitList colSize={true}>
- *   <div>Item 1</div>
- *   <div>Item 2</div>
- *   <div>Item 3</div>
+ *   <span>Item 1</span>
+ *   <span>Item 2</span>
  * </SplitList>
  *
- * // Custom sizes
- * <SplitList colSize={(index) => index === 0 ? 6 : 3}>
- *   <div>Wide</div>
- *   <div>Narrow</div>
- *   <div>Narrow</div>
+ * <SplitList colSize={(i) => (i === 0 ? true : "auto")}>
+ *   <span>Flex</span>
+ *   <span>Auto</span>
  * </SplitList>
  * ```
  */
-export declare function SplitList({ children, colSize, className, }: SplitListProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare const SplitList: React.ForwardRefExoticComponent<SplitListProps & React.RefAttributes<HTMLDivElement>>;
+export { SplitList };

package/dist/types/components/time-to-liquidation/time-to-liquidation.d.ts

@@ -1,20 +1,24 @@
-type HFZone = "good" | "medium" | "bad" | "critical" | "liquidation";
+import { TTLZones } from '../../utils';
+import * as React from "react";
 export interface TimeToLiquidationProps {
-    /**
-     * Time to liquidation in milliseconds
-     */
+    /** Time to liquidation in milliseconds (bigint or number). */
     timeToLiquidation: bigint | number | null;
-    /**
-     * Health factor zone for status indicator
-     */
-    ttlZone?: HFZone;
-    /**
-     * Additional CSS class
-     */
+    /** TTL zone for status dot (matches A TTLZones). */
+    ttlZone?: TTLZones;
+    /** Extra class name. */
     className?: string;
 }
 /**
- * TimeToLiquidation - displays time remaining until liquidation
+ * TimeToLiquidation — displays time remaining until liquidation (matches interface).
+ *
+ * @usage
+ * Use next to health/liquidation info to show remaining time and optional zone dot.
+ *
+ * @example
+ * ```tsx
+ * <TimeToLiquidation timeToLiquidation={86400000} ttlZone="good" />
+ * <TimeToLiquidation timeToLiquidation={null} />
+ * ```
  */
-export declare function TimeToLiquidation({ timeToLiquidation, ttlZone, className, }: TimeToLiquidationProps): import("react/jsx-runtime").JSX.Element;
-export default TimeToLiquidation;
+declare const TimeToLiquidation: React.ForwardRefExoticComponent<TimeToLiquidationProps & React.RefAttributes<HTMLDivElement>>;
+export { TimeToLiquidation };

package/dist/types/index.d.ts

@@ -109,6 +109,7 @@ export * from './components/text-button';
 export * from './components/textarea';
 export * from './components/theme-provider';
 export * from './components/theme-toggle';
+export * from './components/time-to-liquidation';
 export * from './components/tip-card';
 export * from './components/token-icon';
 export * from './components/token-symbol';

package/dist/types/utils/ttl.d.ts

@@ -7,12 +7,12 @@ export type TTLZones = "good" | "medium" | "bad";
  *
  * @example
  * ```ts
- * getTTLZone(40 * DAY) // "good"
- * getTTLZone(14 * DAY) // "medium"
- * getTTLZone(3 * DAY)  // "bad"
+ * getTTLZones(40 * DAY) // "good"
+ * getTTLZones(14 * DAY) // "medium"
+ * getTTLZones(3 * DAY)  // "bad"
  * ```
  */
-export declare function getTTLZone(ttl: number | bigint | undefined): TTLZones | undefined;
+export declare function getTTLZones(ttl: number | bigint | undefined): TTLZones | undefined;
 /**
  * Format remaining time as a human-readable string
  *
@@ -21,13 +21,13 @@ export declare function getTTLZone(ttl: number | bigint | undefined): TTLZones |
  *
  * @example
  * ```ts
- * ttlLeft(5 * DAY + 12 * HOUR) // "5d 12h"
- * ttlLeft(3 * HOUR + 45 * MINUTE) // "3h 45m"
- * ttlLeft(30 * SECOND) // "< 1m"
- * ttlLeft(0) // "Expired"
+ * ttlLeftHuman(5 * DAY + 12 * HOUR) // "5d 12h"
+ * ttlLeftHuman(3 * HOUR + 45 * MINUTE) // "3h 45m"
+ * ttlLeftHuman(30 * SECOND) // "< 1m"
+ * ttlLeftHuman(0) // "Expired"
  * ```
  */
-export declare function ttlLeft(ttl: number | bigint | undefined): string;
+export declare function ttlLeftHuman(ttl: number | bigint | undefined): string;
 /**
  * Format timestamp to remaining time string
  *
@@ -60,12 +60,12 @@ export type TTLLeftResult = {
  *
  * @example
  * ```ts
- * ttlLeftParsed(100 * DAY) // { months: 3 }
- * ttlLeftParsed(15 * DAY)  // { day: 15 }
- * ttlLeftParsed(12 * HOUR) // undefined
+ * ttlLeft(100 * DAY) // { months: 3 }
+ * ttlLeft(15 * DAY)  // { day: 15 }
+ * ttlLeft(12 * HOUR) // undefined
  * ```
  */
-export declare function ttlLeftParsed(ttl: number | bigint | undefined): TTLLeftResult;
+export declare function ttlLeft(ttl: number | bigint): TTLLeftResult;
 export declare const TTL_CONSTANTS: {
     readonly SECOND: 1000;
     readonly MINUTE: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/permissionless-ui",
-  "version": "1.22.0-next.45",
+  "version": "1.22.0-next.47",
   "description": "Internal UI components",
   "license": "MIT",
   "main": "./dist/cjs/index.js",