@camstack/ui-library 0.1.57 → 0.2.0

package/dist/lib/format-control-datetime.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Format an HA-native datetime control value in the user's locale.
+ *
+ * The `control` cap keeps the value verbatim in one of three HA-native shapes:
+ *   - date     → 'YYYY-MM-DD'
+ *   - time     → 'HH:MM' or 'HH:MM:SS'
+ *   - datetime → full ISO timestamp ('YYYY-MM-DDTHH:MM[:SS]' or space-separated)
+ *
+ * This helper renders that value for the READ-ONLY (at-a-glance) context:
+ *   - 'date'     → locale date    (e.g. en-US '6/7/2026')
+ *   - 'time'     → locale time    (e.g. en-US '07:30 AM')
+ *   - 'datetime' → locale date+time (medium date + short time)
+ *
+ * It NEVER throws: any value it cannot parse is returned unchanged (graceful
+ * fallback). `locale` is optional and defaults to the runtime/browser locale.
+ */
+export type ControlDateTimeFormat = 'date' | 'time' | 'datetime';
+export declare function formatControlDateTime(value: string, format: ControlDateTimeFormat, locale?: string): string;

package/dist/lib/format-last-seen.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Relative "last seen" formatter for the offline affordance.
+ *
+ * Renders a short relative-time label from a millisecond epoch:
+ * "just now", "5m ago", "3h ago", "2d ago". Returns `null` for
+ * missing/non-positive inputs so callers can render nothing rather
+ * than a misleading "—" or "NaN ago".
+ *
+ * Future timestamps (clock skew between the device and the browser)
+ * collapse to "just now" instead of a negative duration.
+ */
+export declare function formatLastSeen(timestampMs: number | null | undefined): string | null;

package/dist/lib/format-numeric.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Format a numeric sensor / control value with optional display precision.
+ *
+ * When `precision` is provided, delegates to `value.toFixed(precision)` which
+ * matches the HA `suggested_display_precision` contract.
+ * When absent, falls back to auto-formatting: integers render without a
+ * decimal point; non-integers use one decimal place.
+ */
+export declare function formatNumeric(value: number, precision: number | undefined): string;

package/dist/lib/index.d.ts

@@ -1,4 +1,7 @@
 export { cn } from './cn';
+export { formatLastSeen } from './format-last-seen';
+export { formatControlDateTime } from './format-control-datetime';
+export type { ControlDateTimeFormat } from './format-control-datetime';
 export { isAbsentProvider } from './cap-error';
 export * from './responsive';
 export { mirror } from './pipeline-mirror';

package/dist/primitives/bottom-sheet.d.ts

@@ -6,4 +6,4 @@ export interface BottomSheetProps {
     children: ReactNode;
     className?: string;
 }
-export declare function BottomSheet({ open, onClose, title, children, className }: BottomSheetProps): import("react/jsx-runtime").JSX.Element;
+export declare function BottomSheet({ open, onClose, title, children, className }: BottomSheetProps): import("react").JSX.Element;

package/dist/primitives/collapsible-card.d.ts

@@ -12,4 +12,4 @@ export interface CollapsibleCardProps {
     readonly hideChevron?: boolean;
     readonly className?: string;
 }
-export declare function CollapsibleCard({ expanded, onExpandedChange, header, children, dimmed, hideChevron, className, }: CollapsibleCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function CollapsibleCard({ expanded, onExpandedChange, header, children, dimmed, hideChevron, className, }: CollapsibleCardProps): import("react").JSX.Element;

package/dist/primitives/dialog.d.ts

@@ -5,16 +5,29 @@ interface DialogProps {
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
 }
-export declare function Dialog({ children, open: controlledOpen, onOpenChange }: DialogProps): import("react/jsx-runtime").JSX.Element;
-export declare function DialogTrigger({ children, ...props }: HTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
+export declare function Dialog({ children, open: controlledOpen, onOpenChange }: DialogProps): import("react").JSX.Element;
+export declare function DialogTrigger({ children, ...props }: HTMLAttributes<HTMLButtonElement>): import("react").JSX.Element;
+/**
+ * A native <dialog> opened with showModal() is promoted to the top layer, so
+ * ancestor transform/overflow can't clip it — but it relies on the UA
+ * stylesheet's `dialog { margin: auto }` for modal centering. Tailwind's
+ * preflight resets `margin: 0` on every element, which defeats that centering
+ * and pins the modal to the top-left. We therefore center deterministically:
+ * a top-layer dialog with `position: fixed` is viewport-relative, and a
+ * self-transform is fine, so `fixed left-1/2 top-1/2 -translate-x-1/2
+ * -translate-y-1/2 m-0` always centers regardless of any margin reset. Width
+ * is capped to the viewport (`w-[calc(100vw-2rem)]`) rather than a bare
+ * `w-full` (which would overflow/clip a centered dialog); the per-variant
+ * `max-w-*` keeps small dialogs small while the cap prevents overflow.
+ */
 declare const contentVariants: (props?: ({
     width?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface DialogContentProps extends HTMLAttributes<HTMLDialogElement>, VariantProps<typeof contentVariants> {
 }
 export declare const DialogContent: import('react').ForwardRefExoticComponent<DialogContentProps & import('react').RefAttributes<HTMLDialogElement>>;
-export declare function DialogHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
-export declare function DialogFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
-export declare function DialogTitle({ className, ...props }: HTMLAttributes<HTMLHeadingElement>): import("react/jsx-runtime").JSX.Element;
-export declare function DialogDescription({ className, ...props }: HTMLAttributes<HTMLParagraphElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DialogHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function DialogFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function DialogTitle({ className, ...props }: HTMLAttributes<HTMLHeadingElement>): import("react").JSX.Element;
+export declare function DialogDescription({ className, ...props }: HTMLAttributes<HTMLParagraphElement>): import("react").JSX.Element;
 export {};

package/dist/primitives/dropdown.d.ts

@@ -2,8 +2,8 @@ import { ButtonHTMLAttributes, HTMLAttributes, ReactNode } from 'react';
 import { LucideIcon } from 'lucide-react';
 export declare function Dropdown({ children }: {
     children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function DropdownTrigger({ children, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
+export declare function DropdownTrigger({ children, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): import("react").JSX.Element;
 interface DropdownContentProps extends HTMLAttributes<HTMLDivElement> {
     /** Horizontal alignment relative to the trigger. Default: 'start' (left-aligned). */
     align?: 'start' | 'end';
@@ -15,5 +15,5 @@ interface DropdownItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     icon?: LucideIcon;
     variant?: 'default' | 'danger';
 }
-export declare function DropdownItem({ className, icon: Icon, variant, children, onClick, ...props }: DropdownItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function DropdownItem({ className, icon: Icon, variant, children, onClick, ...props }: DropdownItemProps): import("react").JSX.Element;
 export {};

package/dist/primitives/floating-panel.d.ts

@@ -19,4 +19,4 @@ export interface FloatingPanelProps {
     /** Additional CSS classes for the panel container */
     className?: string;
 }
-export declare function FloatingPanel({ title, onClose, children, defaultWidth, defaultHeight, minWidth, minHeight, offsetIndex, className, }: FloatingPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function FloatingPanel({ title, onClose, children, defaultWidth, defaultHeight, minWidth, minHeight, offsetIndex, className, }: FloatingPanelProps): import("react").JSX.Element;

package/dist/primitives/mobile-drawer.d.ts

@@ -7,4 +7,4 @@ export interface MobileDrawerProps {
     /** Width of the drawer panel. Default: 'w-64' */
     width?: string;
 }
-export declare function MobileDrawer({ open, onClose, children, className, width }: MobileDrawerProps): import("react/jsx-runtime").JSX.Element;
+export declare function MobileDrawer({ open, onClose, children, className, width, }: MobileDrawerProps): import("react").JSX.Element;

package/dist/primitives/popover.d.ts

@@ -4,7 +4,7 @@ interface PopoverProps {
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
 }
-export declare function Popover({ children, open: controlledOpen, onOpenChange }: PopoverProps): import("react/jsx-runtime").JSX.Element;
-export declare function PopoverTrigger({ children, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
-export declare function PopoverContent({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element | null;
+export declare function Popover({ children, open: controlledOpen, onOpenChange }: PopoverProps): import("react").JSX.Element;
+export declare function PopoverTrigger({ children, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): import("react").JSX.Element;
+export declare function PopoverContent({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element | null;
 export {};

package/dist/primitives/tabs.d.ts

@@ -4,14 +4,14 @@ interface TabsProps extends HTMLAttributes<HTMLDivElement> {
     onValueChange?: (value: string) => void;
     defaultValue?: string;
 }
-export declare function Tabs({ value: controlledValue, onValueChange, defaultValue, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
-export declare function TabsList({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function Tabs({ value: controlledValue, onValueChange, defaultValue, className, ...props }: TabsProps): import("react").JSX.Element;
+export declare function TabsList({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
 interface TabsTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     value: string;
 }
-export declare function TabsTrigger({ value, className, ...props }: TabsTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare function TabsTrigger({ value, className, ...props }: TabsTriggerProps): import("react").JSX.Element;
 interface TabsContentProps extends HTMLAttributes<HTMLDivElement> {
     value: string;
 }
-export declare function TabsContent({ value, className, ...props }: TabsContentProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function TabsContent({ value, className, ...props }: TabsContentProps): import("react").JSX.Element | null;
 export {};

package/dist/primitives/tooltip.d.ts

@@ -1,6 +1,12 @@
 import { HTMLAttributes, ReactNode } from 'react';
-export declare function Tooltip({ children }: {
-    children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function TooltipTrigger({ children, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
-export declare function TooltipContent({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+interface TooltipProps {
+    readonly children: ReactNode;
+    /** Extra classes for the positioning wrapper. Defaults to `inline-block`
+     *  (shrink-to-fit). Pass `block w-full min-w-0` when the trigger must fill a
+     *  width-constrained parent so its inner content can truncate cleanly. */
+    readonly className?: string;
+}
+export declare function Tooltip({ children, className }: TooltipProps): import("react").JSX.Element;
+export declare function TooltipTrigger({ children, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function TooltipContent({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export {};

package/dist/theme/index.cjs

@@ -1,5 +1,4 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("../index.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/theme/defaults.ts
@@ -282,5 +281,3 @@ exports.themeToCss = themeToCss;
 exports.themeToCss$1 = themeToCss;
 exports.useThemeMode = useThemeMode;
 exports.useThemeMode$1 = useThemeMode;
-
-//# sourceMappingURL=index.cjs.map

package/dist/theme/index.js

@@ -267,5 +267,3 @@ function useThemeMode() {
 }
 //#endregion
 export { ThemeProvider, createTheme, darkColors, defaultTheme, lightColors, themeToCss, useThemeMode };
-
-//# sourceMappingURL=index.js.map

package/dist/theme/theme-provider.d.ts

@@ -6,5 +6,5 @@ interface ThemeProviderProps {
     defaultMode?: ThemeMode;
     storageKey?: string;
 }
-export declare function ThemeProvider({ children, defaultMode, storageKey, }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function ThemeProvider({ children, defaultMode, storageKey, }: ThemeProviderProps): import("react").JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@camstack/ui-library",
-  "version": "0.1.57",
+  "version": "0.2.0",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -31,6 +31,7 @@
   "scripts": {
     "build": "vite build",
     "typecheck": "tsc --noEmit",
+    "test": "vitest run",
     "publish": "npm publish --access public"
   },
   "peerDependencies": {
@@ -80,9 +81,11 @@
     "@module-federation/runtime": "^2.4.0",
     "class-variance-authority": "^0.7",
     "clsx": "^2.1",
+    "hls.js": "^1.6.16",
     "lucide-react": "^0.576",
     "qrcode.react": "^4.2.0",
-    "tailwind-merge": "^3.0"
+    "tailwind-merge": "^3.0",
+    "zod": "^4.3.6"
   },
   "devDependencies": {
     "@camstack/sdk": "*",
@@ -95,9 +98,14 @@
     "@trpc/client": "^11.16.0",
     "@trpc/react-query": "^11.16.0",
     "jsdom": "^29.0.1",
-    "tsup": "^8.5.1",
-    "typescript": "^5.7.0",
+    "typescript": "~6.0.3",
     "vite": "^8.0.11",
-    "vite-plugin-dts": "^5.0.0"
+    "vite-plugin-dts": "^5.0.0",
+    "vitest": "^3.2.4"
+  },
+  "nx": {
+    "implicitDependencies": [
+      "sdk"
+    ]
   }
 }