@citron-systems/citron-ui 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Citron Systems
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,75 @@
+# Citron UI
+
+The core UI component library for the company CRM. A collection of accessible, design-token-driven React components built with consistency and scalability in mind.
+
+## Architecture
+
+The project consumes design tokens from the **@citron-systems/citron-ds** NPM package. The package provides CSS variables (e.g. `var(--inkblot-semantic-color-*)`) which are activated via `@import '@citron-systems/citron-ds/css'` in the main CSS entry point. All components use **semantic tokens only**—never primitives—ensuring automatic dark mode support via `[data-theme="dark"]` and alignment with WCAG AAA standards. Spacing and border-radius from the package are mapped into Tailwind's theme via `src/utils/inkblotTheme.ts`.
+
+## Tech Stack
+
+- React
+- TypeScript
+- Vite (Library Mode for bundling)
+- Tailwind CSS
+- Storybook (Vite builder)
+- tsup
+- @citron-systems/citron-ds
+
+## Project Structure
+
+| Path | Purpose |
+|------|---------|
+| `src/components` | React components. Each component lives in its own folder with the component file and optional stories. |
+| `src/utils/inkblotTheme.ts` | Maps @citron-systems/citron-ds resolved tokens (Inkblot prefix) to Tailwind spacing and borderRadius. |
+| `src/index.ts` | Library entry point. Exports all public components and their types. |
+
+## Development Workflow
+
+**Run the preview**
+
+```bash
+npm run dev
+```
+
+Starts Storybook on `http://localhost:6006`. Use it to develop and document components in isolation.
+
+**Build the library**
+
+```bash
+npm run build
+```
+
+Uses tsup to bundle the library. Output is written to the `dist` folder.
+
+## Library Consumption
+
+The build produces artifacts in the `dist` folder:
+
+- `dist/index.js` (CommonJS)
+- `dist/index.mjs` (ESM)
+- `dist/index.d.ts` (TypeScript definitions)
+
+Consumers must import the design system CSS and can optionally set `data-theme="dark"` on a parent element for dark mode. Ensure `react` and `react-dom` are peer dependencies in your project.
+
+## Publishing (CI/CD)
+
+Pushes to `main` automatically publish to npm via GitHub Actions. Version bumps follow [Conventional Commits](https://www.conventionalcommits.org/):
+
+- **patch** – `fix:`, `chore:`, `docs:`, `style:`, `refactor:`, `perf:`, `test:`
+- **minor** – `feat:`
+- **major** – `feat!:`, `fix!:`, or `BREAKING CHANGE` in commit body
+
+**Setup (one-time):** Configure [Trusted Publisher](https://docs.npmjs.com/trusted-publishers) on npm for this repo. No `NPM_TOKEN` secret needed—OIDC handles auth.
+
+1. Go to [npmjs.com](https://www.npmjs.com/) → your package → Package settings → **Trusted Publishers**
+2. Click **Set up connection**
+3. Choose **GitHub Actions**
+4. Enter:
+   - **Organization or user:** `Inkblot-Studio` (or your GitHub org/user)
+   - **Repository:** `citron-ui`
+   - **Workflow filename:** `publish.yml`
+
+## Guidelines
+
+All new components **must** use semantic tokens from @citron-systems/citron-ds via CSS variables (e.g. `var(--inkblot-semantic-color-interactive-primary)`). Never use primitives or hardcoded colors. Follow the Principles of Radical Clarity and use semantic tokens for all states (hover, focus, disabled, error). Components automatically support dark mode when `[data-theme="dark"]` is applied.

package/dist/index.d.cts

@@ -0,0 +1,171 @@
+import * as react from 'react';
+import { ButtonHTMLAttributes, ReactNode, Component, InputHTMLAttributes, HTMLAttributes } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type ButtonVariant = 'primary' | 'secondary';
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface CommandInterfaceProps {
+    promptValue?: string;
+    onPromptChange?: (value: string) => void;
+    onPromptSubmit?: () => void;
+    isProcessing?: boolean;
+    response?: ReactNode;
+    placeholder?: string;
+    className?: string;
+}
+declare function CommandInterface({ promptValue, onPromptChange, onPromptSubmit, isProcessing, response, placeholder, className, }: CommandInterfaceProps): react_jsx_runtime.JSX.Element;
+
+type EntityType = 'Person' | 'Organization' | 'Deal';
+interface Edge {
+    type: string;
+    target?: string;
+}
+interface EntityCardProps {
+    name: string;
+    entityType: EntityType;
+    metadata?: Record<string, string>;
+    edges?: Edge[];
+    className?: string;
+}
+declare function EntityCard({ name, entityType, metadata, edges, className, }: EntityCardProps): react_jsx_runtime.JSX.Element;
+
+interface EntityCommandCardStat {
+    label: string;
+    value: string | number;
+}
+interface EntityCommandCardProps {
+    title: string;
+    insights?: ReactNode;
+    stats?: EntityCommandCardStat[];
+    commandValue?: string;
+    onCommandChange?: (value: string) => void;
+    onCommandSubmit?: () => void;
+    className?: string;
+}
+declare function EntityCommandCard({ title, insights, stats, commandValue, onCommandChange, onCommandSubmit, className, }: EntityCommandCardProps): react_jsx_runtime.JSX.Element;
+
+interface ErrorBoundaryProps {
+    children: ReactNode;
+    fallback?: ReactNode;
+    className?: string;
+}
+interface ErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}
+
+interface CitronEvent {
+    actor: string;
+    subject: string;
+    event_type: string;
+    timestamp: string;
+    confidence_score: number;
+}
+interface EventRowProps {
+    event: CitronEvent;
+    className?: string;
+}
+declare function EventRow({ event, className }: EventRowProps): react_jsx_runtime.JSX.Element;
+
+type EventStreamStatus = 'success' | 'warning' | 'error' | 'info';
+interface EventStreamEvent {
+    id: string;
+    icon?: ReactNode;
+    title: string;
+    timestamp: string;
+    status?: EventStreamStatus;
+}
+interface EventStreamFeedProps {
+    events: EventStreamEvent[];
+    className?: string;
+}
+declare function EventStreamFeed({ events, className }: EventStreamFeedProps): react_jsx_runtime.JSX.Element;
+
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+    error?: boolean;
+}
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+interface IntelligenceScoreCardProps {
+    label: string;
+    value: number;
+    subtext?: string;
+    trend?: 'up' | 'down';
+    className?: string;
+}
+declare function IntelligenceScoreCard({ label, value, subtext, trend, className, }: IntelligenceScoreCardProps): react_jsx_runtime.JSX.Element;
+
+type MetricComparisonVariant = 'default' | 'success' | 'warning' | 'error';
+interface MetricComparisonItem {
+    label: string;
+    value?: string | number;
+    variant?: MetricComparisonVariant;
+}
+interface MetricComparisonListProps {
+    items: MetricComparisonItem[];
+    className?: string;
+}
+declare function MetricComparisonList({ items, className }: MetricComparisonListProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleContainerProps {
+    children: ReactNode;
+    loading?: boolean;
+    title?: string;
+    className?: string;
+    onRetry?: () => void;
+}
+declare function ModuleContainer({ children, loading, title, className, onRetry, }: ModuleContainerProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleErrorBoundaryProps {
+    children: ReactNode;
+    onRetry?: () => void;
+    className?: string;
+}
+interface ModuleErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+declare class ModuleErrorBoundary extends Component<ModuleErrorBoundaryProps, ModuleErrorBoundaryState> {
+    constructor(props: ModuleErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ModuleErrorBoundaryState;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}
+
+interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleSkeletonProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function ModuleSkeleton({ className, ...props }: ModuleSkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface OSNavigationRailItem {
+    id: string;
+    icon: ReactNode;
+    label?: string;
+    active?: boolean;
+}
+interface OSNavigationRailProps {
+    items: OSNavigationRailItem[];
+    className?: string;
+}
+declare function OSNavigationRail({ items, className }: OSNavigationRailProps): react_jsx_runtime.JSX.Element;
+
+type StatusBadgeVariant = 'success' | 'warning' | 'error' | 'info';
+interface StatusBadgeProps {
+    label: string;
+    variant?: StatusBadgeVariant;
+    className?: string;
+}
+declare function StatusBadge({ label, variant, className, }: StatusBadgeProps): react_jsx_runtime.JSX.Element;
+
+export { Button, type ButtonProps, type ButtonVariant, type CitronEvent, CommandInterface, type CommandInterfaceProps, type Edge, EntityCard, type EntityCardProps, EntityCommandCard, type EntityCommandCardProps, type EntityCommandCardStat, type EntityType, ErrorBoundary, type ErrorBoundaryProps, EventRow, type EventRowProps, type EventStreamEvent, EventStreamFeed, type EventStreamFeedProps, type EventStreamStatus, Input, type InputProps, IntelligenceScoreCard, type IntelligenceScoreCardProps, type MetricComparisonItem, MetricComparisonList, type MetricComparisonListProps, type MetricComparisonVariant, ModuleContainer, type ModuleContainerProps, ModuleErrorBoundary, type ModuleErrorBoundaryProps, ModuleSkeleton, type ModuleSkeletonProps, OSNavigationRail, type OSNavigationRailItem, type OSNavigationRailProps, Skeleton, type SkeletonProps, StatusBadge, type StatusBadgeProps, type StatusBadgeVariant };

package/dist/index.d.ts

@@ -0,0 +1,171 @@
+import * as react from 'react';
+import { ButtonHTMLAttributes, ReactNode, Component, InputHTMLAttributes, HTMLAttributes } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type ButtonVariant = 'primary' | 'secondary';
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface CommandInterfaceProps {
+    promptValue?: string;
+    onPromptChange?: (value: string) => void;
+    onPromptSubmit?: () => void;
+    isProcessing?: boolean;
+    response?: ReactNode;
+    placeholder?: string;
+    className?: string;
+}
+declare function CommandInterface({ promptValue, onPromptChange, onPromptSubmit, isProcessing, response, placeholder, className, }: CommandInterfaceProps): react_jsx_runtime.JSX.Element;
+
+type EntityType = 'Person' | 'Organization' | 'Deal';
+interface Edge {
+    type: string;
+    target?: string;
+}
+interface EntityCardProps {
+    name: string;
+    entityType: EntityType;
+    metadata?: Record<string, string>;
+    edges?: Edge[];
+    className?: string;
+}
+declare function EntityCard({ name, entityType, metadata, edges, className, }: EntityCardProps): react_jsx_runtime.JSX.Element;
+
+interface EntityCommandCardStat {
+    label: string;
+    value: string | number;
+}
+interface EntityCommandCardProps {
+    title: string;
+    insights?: ReactNode;
+    stats?: EntityCommandCardStat[];
+    commandValue?: string;
+    onCommandChange?: (value: string) => void;
+    onCommandSubmit?: () => void;
+    className?: string;
+}
+declare function EntityCommandCard({ title, insights, stats, commandValue, onCommandChange, onCommandSubmit, className, }: EntityCommandCardProps): react_jsx_runtime.JSX.Element;
+
+interface ErrorBoundaryProps {
+    children: ReactNode;
+    fallback?: ReactNode;
+    className?: string;
+}
+interface ErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}
+
+interface CitronEvent {
+    actor: string;
+    subject: string;
+    event_type: string;
+    timestamp: string;
+    confidence_score: number;
+}
+interface EventRowProps {
+    event: CitronEvent;
+    className?: string;
+}
+declare function EventRow({ event, className }: EventRowProps): react_jsx_runtime.JSX.Element;
+
+type EventStreamStatus = 'success' | 'warning' | 'error' | 'info';
+interface EventStreamEvent {
+    id: string;
+    icon?: ReactNode;
+    title: string;
+    timestamp: string;
+    status?: EventStreamStatus;
+}
+interface EventStreamFeedProps {
+    events: EventStreamEvent[];
+    className?: string;
+}
+declare function EventStreamFeed({ events, className }: EventStreamFeedProps): react_jsx_runtime.JSX.Element;
+
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+    error?: boolean;
+}
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+interface IntelligenceScoreCardProps {
+    label: string;
+    value: number;
+    subtext?: string;
+    trend?: 'up' | 'down';
+    className?: string;
+}
+declare function IntelligenceScoreCard({ label, value, subtext, trend, className, }: IntelligenceScoreCardProps): react_jsx_runtime.JSX.Element;
+
+type MetricComparisonVariant = 'default' | 'success' | 'warning' | 'error';
+interface MetricComparisonItem {
+    label: string;
+    value?: string | number;
+    variant?: MetricComparisonVariant;
+}
+interface MetricComparisonListProps {
+    items: MetricComparisonItem[];
+    className?: string;
+}
+declare function MetricComparisonList({ items, className }: MetricComparisonListProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleContainerProps {
+    children: ReactNode;
+    loading?: boolean;
+    title?: string;
+    className?: string;
+    onRetry?: () => void;
+}
+declare function ModuleContainer({ children, loading, title, className, onRetry, }: ModuleContainerProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleErrorBoundaryProps {
+    children: ReactNode;
+    onRetry?: () => void;
+    className?: string;
+}
+interface ModuleErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+declare class ModuleErrorBoundary extends Component<ModuleErrorBoundaryProps, ModuleErrorBoundaryState> {
+    constructor(props: ModuleErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ModuleErrorBoundaryState;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}
+
+interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface ModuleSkeletonProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function ModuleSkeleton({ className, ...props }: ModuleSkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface OSNavigationRailItem {
+    id: string;
+    icon: ReactNode;
+    label?: string;
+    active?: boolean;
+}
+interface OSNavigationRailProps {
+    items: OSNavigationRailItem[];
+    className?: string;
+}
+declare function OSNavigationRail({ items, className }: OSNavigationRailProps): react_jsx_runtime.JSX.Element;
+
+type StatusBadgeVariant = 'success' | 'warning' | 'error' | 'info';
+interface StatusBadgeProps {
+    label: string;
+    variant?: StatusBadgeVariant;
+    className?: string;
+}
+declare function StatusBadge({ label, variant, className, }: StatusBadgeProps): react_jsx_runtime.JSX.Element;
+
+export { Button, type ButtonProps, type ButtonVariant, type CitronEvent, CommandInterface, type CommandInterfaceProps, type Edge, EntityCard, type EntityCardProps, EntityCommandCard, type EntityCommandCardProps, type EntityCommandCardStat, type EntityType, ErrorBoundary, type ErrorBoundaryProps, EventRow, type EventRowProps, type EventStreamEvent, EventStreamFeed, type EventStreamFeedProps, type EventStreamStatus, Input, type InputProps, IntelligenceScoreCard, type IntelligenceScoreCardProps, type MetricComparisonItem, MetricComparisonList, type MetricComparisonListProps, type MetricComparisonVariant, ModuleContainer, type ModuleContainerProps, ModuleErrorBoundary, type ModuleErrorBoundaryProps, ModuleSkeleton, type ModuleSkeletonProps, OSNavigationRail, type OSNavigationRailItem, type OSNavigationRailProps, Skeleton, type SkeletonProps, StatusBadge, type StatusBadgeProps, type StatusBadgeVariant };

package/dist/index.js

@@ -0,0 +1 @@
+"use strict";var P=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var tt=Object.getOwnPropertyNames;var rt=Object.prototype.hasOwnProperty;var et=(t,e)=>{for(var r in e)P(t,r,{get:e[r],enumerable:!0})},ot=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of tt(e))!rt.call(t,n)&&n!==r&&P(t,n,{get:()=>e[n],enumerable:!(a=j(e,n))||a.enumerable});return t};var at=t=>ot(P({},"__esModule",{value:!0}),t);var ut={};et(ut,{Button:()=>N,CommandInterface:()=>B,EntityCard:()=>R,EntityCommandCard:()=>I,ErrorBoundary:()=>C,EventRow:()=>T,EventStreamFeed:()=>V,Input:()=>h,IntelligenceScoreCard:()=>D,MetricComparisonList:()=>O,ModuleContainer:()=>A,ModuleErrorBoundary:()=>s,ModuleSkeleton:()=>w,OSNavigationRail:()=>z,Skeleton:()=>x,StatusBadge:()=>S});module.exports=at(ut);var W=require("react");var F=require("clsx"),K=require("tailwind-merge");function o(...t){return(0,K.twMerge)((0,F.clsx)(t))}var $=require("react/jsx-runtime"),nt={primary:"bg-[var(--inkblot-semantic-color-interactive-primary)] text-[var(--inkblot-semantic-color-text-primary)] hover:bg-[var(--inkblot-semantic-color-interactive-primary-hover)] active:bg-[var(--inkblot-semantic-color-interactive-primary-active)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--inkblot-semantic-color-border-focus)] focus-visible:outline-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed",secondary:"bg-[var(--inkblot-semantic-color-interactive-secondary)] text-[var(--inkblot-semantic-color-text-primary)] border border-[var(--inkblot-semantic-color-border-default)] hover:bg-[var(--inkblot-semantic-color-interactive-secondary-hover)] hover:border-[var(--inkblot-semantic-color-border-strong)] active:bg-[var(--inkblot-semantic-color-interactive-secondary-hover)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--inkblot-semantic-color-border-focus)] focus-visible:outline-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed"},N=(0,W.forwardRef)(({className:t,variant:e="primary",disabled:r,...a},n)=>(0,$.jsx)("button",{ref:n,disabled:r,className:o("inline-flex min-h-[var(--inkblot-size-touch-target-min)] items-center justify-center rounded-[var(--inkblot-radius-lg)] px-4 py-2 font-semibold transition-[background,border-color] duration-[var(--inkblot-duration-fast)] ease-[var(--inkblot-easing-default)]",nt[e],t),...a}));N.displayName="Button";var i=require("react/jsx-runtime");function q({className:t}){return(0,i.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:o("h-8 w-8",t),"aria-hidden":!0,children:[(0,i.jsx)("circle",{cx:"12",cy:"12",r:"9",stroke:"currentColor",strokeWidth:"1.5",className:"text-[var(--inkblot-semantic-color-text-tertiary)]"}),(0,i.jsx)("path",{d:"M8 12h2v2H8v-2zm6 0h2v2h-2v-2zM10 8l2 4 2-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round",className:"text-[var(--inkblot-semantic-color-text-secondary)]"})]})}function B({promptValue:t="",onPromptChange:e,onPromptSubmit:r,isProcessing:a=!1,response:n,placeholder:m="Ask Citron Intelligence...",className:b}){let M=p=>{p.key==="Enter"&&!p.shiftKey&&(p.preventDefault(),r?.())};return(0,i.jsxs)("div",{className:o("flex w-full max-w-2xl flex-col gap-8",b),children:[(0,i.jsx)("div",{className:"flex flex-col gap-4",children:(0,i.jsxs)("div",{className:"flex items-start gap-4",children:[(0,i.jsx)("div",{className:"flex shrink-0 items-center justify-center",children:(0,i.jsx)(q,{})}),(0,i.jsx)("div",{className:"flex flex-1 flex-col gap-4",children:(0,i.jsx)("textarea",{value:t,onChange:p=>e?.(p.target.value),onKeyDown:M,placeholder:m,rows:3,disabled:a,className:o("w-full resize-none rounded-[var(--inkblot-radius-xl)] bg-[var(--inkblot-semantic-color-background-primary)] p-4 text-[var(--inkblot-semantic-color-text-primary)] placeholder:text-[var(--inkblot-semantic-color-text-tertiary)] transition-shadow duration-[var(--inkblot-duration-fast)]","focus:outline-none focus:ring-2 focus:ring-[var(--inkblot-semantic-color-border-focus)] focus:ring-offset-2 focus:ring-offset-[var(--inkblot-semantic-color-background-primary)]","shadow-[0_1px_3px_0_rgba(0,0,0,0.08),0_1px_2px_-1px_rgba(0,0,0,0.08)]","disabled:cursor-not-allowed disabled:opacity-70")})})]})}),a?(0,i.jsx)("div",{className:o("min-h-[80px] animate-shimmer rounded-[var(--inkblot-radius-xl)] bg-[length:200%_100%] bg-[linear-gradient(90deg,var(--inkblot-semantic-color-background-secondary)_0%,var(--inkblot-semantic-color-background-tertiary)_50%,var(--inkblot-semantic-color-background-secondary)_100%)]")}):n?(0,i.jsx)("div",{className:"flex flex-col gap-4",children:(0,i.jsxs)("div",{className:"flex items-start gap-4",children:[(0,i.jsx)("div",{className:"shrink-0",children:(0,i.jsx)(q,{})}),(0,i.jsx)("div",{className:"min-w-0 flex-1 text-[var(--inkblot-semantic-color-text-primary)]",children:n})]})}):null]})}var c=require("react/jsx-runtime"),it={Person:"border-l-[var(--inkblot-semantic-color-status-info)] bg-[var(--inkblot-semantic-color-background-secondary)]",Organization:"border-l-[var(--inkblot-semantic-color-status-warning)] bg-[var(--inkblot-semantic-color-background-secondary)]",Deal:"border-l-[var(--inkblot-semantic-color-status-success)] bg-[var(--inkblot-semantic-color-background-secondary)]"};function R({name:t,entityType:e,metadata:r,edges:a=[],className:n}){return(0,c.jsxs)("article",{className:o("flex flex-col gap-4 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] border-l-4 p-4",it[e],n),children:[(0,c.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,c.jsx)("span",{className:"text-xs font-medium uppercase tracking-wide text-[var(--inkblot-semantic-color-text-tertiary)]",children:e}),(0,c.jsx)("h3",{className:"text-base font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:t})]}),r&&Object.keys(r).length>0?(0,c.jsx)("dl",{className:"flex flex-col gap-1",children:Object.entries(r).map(([m,b])=>(0,c.jsxs)("div",{className:"flex gap-2",children:[(0,c.jsxs)("dt",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:[m,":"]}),(0,c.jsx)("dd",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:b})]},m))}):null,a.length>0?(0,c.jsxs)("div",{className:"flex flex-col gap-2",children:[(0,c.jsx)("h4",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-secondary)]",children:"Edges"}),(0,c.jsx)("ul",{className:"flex flex-wrap gap-2",children:a.map((m,b)=>(0,c.jsxs)("li",{className:"rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-2 py-1 text-xs text-[var(--inkblot-semantic-color-text-secondary)]",children:[m.type,m.target?` \u2192 ${m.target}`:""]},b))})]}):null]})}var G=require("react");var J=require("react/jsx-runtime"),h=(0,G.forwardRef)(({className:t,error:e,disabled:r,...a},n)=>(0,J.jsx)("input",{ref:n,disabled:r,"aria-invalid":e,"aria-disabled":r,className:o("min-h-[var(--inkblot-size-touch-target-min)] w-full rounded-[var(--inkblot-radius-md)] border bg-[var(--inkblot-semantic-color-background-secondary)] px-4 py-2 text-[var(--inkblot-semantic-color-text-primary)] placeholder:text-[var(--inkblot-semantic-color-text-tertiary)] transition-[border-color,box-shadow] duration-[var(--inkblot-duration-fast)] ease-[var(--inkblot-easing-default)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--inkblot-semantic-color-border-focus)] focus-visible:ring-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed",e?"border-[var(--inkblot-semantic-color-status-error)] focus-visible:ring-[var(--inkblot-semantic-color-status-error)]":"border-[var(--inkblot-semantic-color-border-default)] hover:border-[var(--inkblot-semantic-color-border-strong)]",t),...a}));h.displayName="Input";var Q=require("react");var E=require("react/jsx-runtime"),s=class extends Q.Component{constructor(e){super(e),this.state={hasError:!1,error:null}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}render(){return this.state.hasError&&this.state.error?(0,E.jsxs)("div",{role:"alert",className:o("flex flex-col gap-4 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",this.props.className),children:[(0,E.jsx)("p",{className:"text-base font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:"This module failed to load"}),(0,E.jsx)("p",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:this.state.error.message}),(0,E.jsx)(N,{variant:"secondary",onClick:this.props.onRetry,className:"w-fit border-[var(--inkblot-semantic-color-status-error)]",children:"Retry"})]}):this.props.children}};var d=require("react/jsx-runtime");function I({title:t,insights:e,stats:r=[],commandValue:a="",onCommandChange:n,onCommandSubmit:m,className:b}){let M=p=>{p.key==="Enter"&&(p.preventDefault(),m?.())};return(0,d.jsx)(s,{className:b,children:(0,d.jsxs)("div",{className:"flex flex-col gap-4 rounded-[var(--inkblot-radius-xl)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",children:[(0,d.jsx)("h2",{className:"text-xl font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:t}),e?(0,d.jsx)("div",{className:"rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-interactive-primary)] p-4",style:{boxShadow:"0 0 12px var(--inkblot-semantic-color-interactive-primary)"},children:e}):null,r.length>0?(0,d.jsxs)("div",{children:[(0,d.jsx)("h3",{className:"mb-2 text-sm font-medium text-[var(--inkblot-semantic-color-text-secondary)]",children:"Connected To"}),(0,d.jsx)("div",{className:"grid grid-cols-2 gap-2 sm:grid-cols-3",children:r.map((p,Z)=>(0,d.jsxs)("div",{className:"rounded-[var(--inkblot-radius-md)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-3 py-2",children:[(0,d.jsx)("span",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:p.label}),(0,d.jsx)("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:p.value})]},Z))})]}):null,(0,d.jsx)("div",{className:"mt-2",children:(0,d.jsx)(h,{type:"text",value:a,onChange:p=>n?.(p.target.value),onKeyDown:M,placeholder:"Ask about this entity...",className:"rounded-[var(--inkblot-radius-md)]"})})]})})}var U=require("react");var L=require("react/jsx-runtime"),C=class extends U.Component{constructor(e){super(e),this.state={hasError:!1,error:null}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}render(){return this.state.hasError&&this.state.error?this.props.fallback?this.props.fallback:(0,L.jsx)("div",{className:o("inline-flex items-center gap-3 rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-4 py-3 text-[var(--inkblot-semantic-color-text-secondary)]",this.props.className),role:"alert",children:(0,L.jsx)("span",{className:"text-sm font-medium",children:"Something went wrong"})}):this.props.children}};var X=require("react/jsx-runtime"),st={success:"border-[var(--inkblot-semantic-color-status-success)] bg-[var(--inkblot-semantic-color-status-success)]/10 text-[var(--inkblot-semantic-color-status-success)]",warning:"border-[var(--inkblot-semantic-color-status-warning)] bg-[var(--inkblot-semantic-color-status-warning)]/10 text-[var(--inkblot-semantic-color-status-warning)]",error:"border-[var(--inkblot-semantic-color-status-error)] bg-[var(--inkblot-semantic-color-status-error)]/10 text-[var(--inkblot-semantic-color-status-error)]",info:"border-[var(--inkblot-semantic-color-status-info)] bg-[var(--inkblot-semantic-color-status-info)]/10 text-[var(--inkblot-semantic-color-status-info)]"};function S({label:t,variant:e="info",className:r}){return(0,X.jsx)("span",{className:o("inline-flex items-center rounded-[var(--inkblot-radius-md)] border px-2 py-0.5 text-xs font-medium",st[e],r),children:t})}var f=require("react/jsx-runtime");function lt(t){return t>=.8?"success":t>=.5?"info":t>=.2?"warning":"error"}function T({event:t,className:e}){let r=lt(t.confidence_score),a=`${Math.round(t.confidence_score*100)}%`;return(0,f.jsxs)("div",{className:o("flex flex-wrap items-center gap-2 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",e),children:[(0,f.jsx)("span",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:t.actor}),(0,f.jsx)("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:"\u2192"}),(0,f.jsx)("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:t.subject}),(0,f.jsx)("span",{className:"rounded-[var(--inkblot-radius-md)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-2 py-0.5 text-xs text-[var(--inkblot-semantic-color-text-secondary)]",children:t.event_type}),(0,f.jsx)("span",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:t.timestamp}),(0,f.jsx)(S,{label:a,variant:r})]})}var u=require("react/jsx-runtime"),ct={success:"bg-[var(--inkblot-semantic-color-status-success)]",warning:"bg-[var(--inkblot-semantic-color-status-warning)]",error:"bg-[var(--inkblot-semantic-color-status-error)]",info:"bg-[var(--inkblot-semantic-color-status-info)]"};function dt(){return(0,u.jsx)("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-text-tertiary)]","aria-hidden":!0,children:(0,u.jsx)("circle",{cx:"8",cy:"8",r:"2",fill:"currentColor"})})}function V({events:t,className:e}){return(0,u.jsx)(s,{className:e,children:(0,u.jsx)("div",{className:o("flex flex-col gap-4 border-l-2 border-[var(--inkblot-semantic-color-border-default)] pl-4"),children:t.map(r=>(0,u.jsxs)("div",{className:"flex items-start gap-3",children:[(0,u.jsx)("div",{className:"flex shrink-0 items-center pt-0.5",children:r.icon??(0,u.jsx)(dt,{})}),(0,u.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,u.jsx)("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:r.title}),(0,u.jsx)("p",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:r.timestamp})]}),r.status?(0,u.jsx)("div",{className:o("mt-1.5 h-2 w-2 shrink-0 rounded-full",ct[r.status]),"aria-hidden":!0}):null]},r.id))})})}var l=require("react/jsx-runtime"),H=36,_=2*Math.PI*H;function D({label:t,value:e,subtext:r,trend:a,className:n}){let m=Math.min(100,Math.max(0,e)),b=_-m/100*_;return(0,l.jsx)(s,{className:n,children:(0,l.jsxs)("div",{className:"flex flex-col items-center gap-4 rounded-[var(--inkblot-radius-lg)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",children:[(0,l.jsxs)("div",{className:"relative",children:[(0,l.jsxs)("svg",{width:"96",height:"96",viewBox:"0 0 96 96",className:"-rotate-90",children:[(0,l.jsx)("circle",{cx:"48",cy:"48",r:H,fill:"none",stroke:"var(--inkblot-semantic-color-background-tertiary)",strokeWidth:"4"}),(0,l.jsx)("circle",{cx:"48",cy:"48",r:H,fill:"none",stroke:"var(--inkblot-semantic-color-interactive-primary)",strokeWidth:"4",strokeDasharray:_,strokeDashoffset:b,strokeLinecap:"round",className:"transition-[stroke-dashoffset] duration-[var(--inkblot-duration-fast)]"})]}),(0,l.jsx)("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:(0,l.jsxs)("span",{className:"flex items-center gap-1 text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:[m,"%",a==="up"?(0,l.jsx)("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-status-success)]","aria-hidden":!0,children:(0,l.jsx)("path",{fill:"currentColor",d:"M8 4l4 6H4l4-6z"})}):a==="down"?(0,l.jsx)("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-status-error)]","aria-hidden":!0,children:(0,l.jsx)("path",{fill:"currentColor",d:"M8 12l4-6H4l4 6z"})}):null]})})]}),(0,l.jsxs)("div",{className:"text-center",children:[(0,l.jsx)("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:t}),r?(0,l.jsx)("p",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:r}):null]})]})})}var v=require("react/jsx-runtime"),mt={default:"text-[var(--inkblot-semantic-color-text-primary)]",success:"text-[var(--inkblot-semantic-color-status-success)]",warning:"text-[var(--inkblot-semantic-color-status-warning)]",error:"text-[var(--inkblot-semantic-color-status-error)]"};function pt({className:t}){return(0,v.jsx)("svg",{viewBox:"0 0 16 16",className:o("h-4 w-4",t),"aria-hidden":!0,children:(0,v.jsx)("path",{fill:"currentColor",d:"M6 4l4 4-4 4V4z"})})}function O({items:t,className:e}){return(0,v.jsx)(s,{className:e,children:(0,v.jsx)("ul",{className:o("flex flex-col gap-4 py-2"),children:t.map((r,a)=>(0,v.jsxs)("li",{className:"flex items-center justify-between gap-4",children:[(0,v.jsx)("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:r.label}),(0,v.jsx)("span",{className:o("flex items-center gap-1 text-sm font-medium",mt[r.variant??"default"]),children:r.value!=null?r.value:(0,v.jsx)(pt,{})})]},a))})})}var Y=require("react/jsx-runtime");function x({className:t,...e}){return(0,Y.jsx)("div",{className:o("animate-shimmer rounded-[var(--inkblot-radius-md)] bg-[length:200%_100%] bg-[linear-gradient(90deg,var(--inkblot-semantic-color-background-secondary)_0%,var(--inkblot-semantic-color-background-tertiary)_50%,var(--inkblot-semantic-color-background-secondary)_100%)]",t),...e})}var y=require("react/jsx-runtime");function w({className:t,...e}){return(0,y.jsxs)("div",{className:o("flex flex-col gap-2 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",t),...e,children:[(0,y.jsx)(x,{className:"h-5 w-3/4"}),(0,y.jsx)(x,{className:"h-4 w-full"}),(0,y.jsx)(x,{className:"h-4 w-5/6"}),(0,y.jsx)(x,{className:"h-4 w-4/5"}),(0,y.jsx)(x,{className:"h-4 w-3/4"})]})}var g=require("react/jsx-runtime");function A({children:t,loading:e=!1,title:r,className:a,onRetry:n}){return(0,g.jsx)(s,{className:a,onRetry:n,children:e?(0,g.jsxs)("div",{className:o("flex flex-col gap-4",a),children:[r?(0,g.jsx)("h2",{className:"text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:r}):null,(0,g.jsx)(w,{})]}):(0,g.jsxs)("div",{className:o("flex flex-col gap-4",a),children:[r?(0,g.jsx)("h2",{className:"text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:r}):null,t]})})}var k=require("react/jsx-runtime");function z({items:t,className:e}){return(0,k.jsx)(s,{className:e,children:(0,k.jsx)("nav",{className:o("flex w-14 flex-col items-center gap-1 border-r border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] py-4"),"aria-label":"Navigation",children:t.map(r=>(0,k.jsxs)("div",{className:o("relative flex w-full flex-col items-center gap-1 rounded-[var(--inkblot-radius-md)] px-2 py-2 transition-colors hover:text-[var(--inkblot-semantic-color-text-secondary)]",r.active?"text-[var(--inkblot-semantic-color-interactive-primary)]":"text-[var(--inkblot-semantic-color-text-tertiary)]"),children:[r.active?(0,k.jsx)("span",{className:"absolute left-0 top-1/2 h-6 w-0.5 -translate-y-1/2 rounded-r-full bg-[var(--inkblot-semantic-color-interactive-primary)]","aria-hidden":!0}):null,(0,k.jsx)("div",{className:"flex h-8 w-8 items-center justify-center [&>svg]:h-5 [&>svg]:w-5",children:r.icon}),r.label?(0,k.jsx)("span",{className:"text-[10px] font-medium",children:r.label}):null]},r.id))})})}0&&(module.exports={Button,CommandInterface,EntityCard,EntityCommandCard,ErrorBoundary,EventRow,EventStreamFeed,Input,IntelligenceScoreCard,MetricComparisonList,ModuleContainer,ModuleErrorBoundary,ModuleSkeleton,OSNavigationRail,Skeleton,StatusBadge});

package/dist/index.mjs

@@ -0,0 +1 @@
+import{forwardRef as X}from"react";import{clsx as Q}from"clsx";import{twMerge as U}from"tailwind-merge";function o(...t){return U(Q(t))}import{jsx as Z}from"react/jsx-runtime";var Y={primary:"bg-[var(--inkblot-semantic-color-interactive-primary)] text-[var(--inkblot-semantic-color-text-primary)] hover:bg-[var(--inkblot-semantic-color-interactive-primary-hover)] active:bg-[var(--inkblot-semantic-color-interactive-primary-active)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--inkblot-semantic-color-border-focus)] focus-visible:outline-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed",secondary:"bg-[var(--inkblot-semantic-color-interactive-secondary)] text-[var(--inkblot-semantic-color-text-primary)] border border-[var(--inkblot-semantic-color-border-default)] hover:bg-[var(--inkblot-semantic-color-interactive-secondary-hover)] hover:border-[var(--inkblot-semantic-color-border-strong)] active:bg-[var(--inkblot-semantic-color-interactive-secondary-hover)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--inkblot-semantic-color-border-focus)] focus-visible:outline-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed"},g=X(({className:t,variant:e="primary",disabled:r,...a},i)=>Z("button",{ref:i,disabled:r,className:o("inline-flex min-h-[var(--inkblot-size-touch-target-min)] items-center justify-center rounded-[var(--inkblot-radius-lg)] px-4 py-2 font-semibold transition-[background,border-color] duration-[var(--inkblot-duration-fast)] ease-[var(--inkblot-easing-default)]",Y[e],t),...a}));g.displayName="Button";import{jsx as c,jsxs as C}from"react/jsx-runtime";function V({className:t}){return C("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:o("h-8 w-8",t),"aria-hidden":!0,children:[c("circle",{cx:"12",cy:"12",r:"9",stroke:"currentColor",strokeWidth:"1.5",className:"text-[var(--inkblot-semantic-color-text-tertiary)]"}),c("path",{d:"M8 12h2v2H8v-2zm6 0h2v2h-2v-2zM10 8l2 4 2-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round",className:"text-[var(--inkblot-semantic-color-text-secondary)]"})]})}function _({promptValue:t="",onPromptChange:e,onPromptSubmit:r,isProcessing:a=!1,response:i,placeholder:s="Ask Citron Intelligence...",className:m}){let B=l=>{l.key==="Enter"&&!l.shiftKey&&(l.preventDefault(),r?.())};return C("div",{className:o("flex w-full max-w-2xl flex-col gap-8",m),children:[c("div",{className:"flex flex-col gap-4",children:C("div",{className:"flex items-start gap-4",children:[c("div",{className:"flex shrink-0 items-center justify-center",children:c(V,{})}),c("div",{className:"flex flex-1 flex-col gap-4",children:c("textarea",{value:t,onChange:l=>e?.(l.target.value),onKeyDown:B,placeholder:s,rows:3,disabled:a,className:o("w-full resize-none rounded-[var(--inkblot-radius-xl)] bg-[var(--inkblot-semantic-color-background-primary)] p-4 text-[var(--inkblot-semantic-color-text-primary)] placeholder:text-[var(--inkblot-semantic-color-text-tertiary)] transition-shadow duration-[var(--inkblot-duration-fast)]","focus:outline-none focus:ring-2 focus:ring-[var(--inkblot-semantic-color-border-focus)] focus:ring-offset-2 focus:ring-offset-[var(--inkblot-semantic-color-background-primary)]","shadow-[0_1px_3px_0_rgba(0,0,0,0.08),0_1px_2px_-1px_rgba(0,0,0,0.08)]","disabled:cursor-not-allowed disabled:opacity-70")})})]})}),a?c("div",{className:o("min-h-[80px] animate-shimmer rounded-[var(--inkblot-radius-xl)] bg-[length:200%_100%] bg-[linear-gradient(90deg,var(--inkblot-semantic-color-background-secondary)_0%,var(--inkblot-semantic-color-background-tertiary)_50%,var(--inkblot-semantic-color-background-secondary)_100%)]")}):i?c("div",{className:"flex flex-col gap-4",children:C("div",{className:"flex items-start gap-4",children:[c("div",{className:"shrink-0",children:c(V,{})}),c("div",{className:"min-w-0 flex-1 text-[var(--inkblot-semantic-color-text-primary)]",children:i})]})}):null]})}import{jsx as f,jsxs as x}from"react/jsx-runtime";var j={Person:"border-l-[var(--inkblot-semantic-color-status-info)] bg-[var(--inkblot-semantic-color-background-secondary)]",Organization:"border-l-[var(--inkblot-semantic-color-status-warning)] bg-[var(--inkblot-semantic-color-background-secondary)]",Deal:"border-l-[var(--inkblot-semantic-color-status-success)] bg-[var(--inkblot-semantic-color-background-secondary)]"};function H({name:t,entityType:e,metadata:r,edges:a=[],className:i}){return x("article",{className:o("flex flex-col gap-4 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] border-l-4 p-4",j[e],i),children:[x("div",{className:"flex flex-col gap-1",children:[f("span",{className:"text-xs font-medium uppercase tracking-wide text-[var(--inkblot-semantic-color-text-tertiary)]",children:e}),f("h3",{className:"text-base font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:t})]}),r&&Object.keys(r).length>0?f("dl",{className:"flex flex-col gap-1",children:Object.entries(r).map(([s,m])=>x("div",{className:"flex gap-2",children:[x("dt",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:[s,":"]}),f("dd",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:m})]},s))}):null,a.length>0?x("div",{className:"flex flex-col gap-2",children:[f("h4",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-secondary)]",children:"Edges"}),f("ul",{className:"flex flex-wrap gap-2",children:a.map((s,m)=>x("li",{className:"rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-2 py-1 text-xs text-[var(--inkblot-semantic-color-text-secondary)]",children:[s.type,s.target?` \u2192 ${s.target}`:""]},m))})]}):null]})}import{forwardRef as tt}from"react";import{jsx as rt}from"react/jsx-runtime";var k=tt(({className:t,error:e,disabled:r,...a},i)=>rt("input",{ref:i,disabled:r,"aria-invalid":e,"aria-disabled":r,className:o("min-h-[var(--inkblot-size-touch-target-min)] w-full rounded-[var(--inkblot-radius-md)] border bg-[var(--inkblot-semantic-color-background-secondary)] px-4 py-2 text-[var(--inkblot-semantic-color-text-primary)] placeholder:text-[var(--inkblot-semantic-color-text-tertiary)] transition-[border-color,box-shadow] duration-[var(--inkblot-duration-fast)] ease-[var(--inkblot-easing-default)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--inkblot-semantic-color-border-focus)] focus-visible:ring-offset-2 disabled:opacity-[var(--inkblot-opacity-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed",e?"border-[var(--inkblot-semantic-color-status-error)] focus-visible:ring-[var(--inkblot-semantic-color-status-error)]":"border-[var(--inkblot-semantic-color-border-default)] hover:border-[var(--inkblot-semantic-color-border-strong)]",t),...a}));k.displayName="Input";import{Component as et}from"react";import{jsx as R,jsxs as ot}from"react/jsx-runtime";var n=class extends et{constructor(e){super(e),this.state={hasError:!1,error:null}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}render(){return this.state.hasError&&this.state.error?ot("div",{role:"alert",className:o("flex flex-col gap-4 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",this.props.className),children:[R("p",{className:"text-base font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:"This module failed to load"}),R("p",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:this.state.error.message}),R(g,{variant:"secondary",onClick:this.props.onRetry,className:"w-fit border-[var(--inkblot-semantic-color-status-error)]",children:"Retry"})]}):this.props.children}};import{jsx as p,jsxs as I}from"react/jsx-runtime";function D({title:t,insights:e,stats:r=[],commandValue:a="",onCommandChange:i,onCommandSubmit:s,className:m}){let B=l=>{l.key==="Enter"&&(l.preventDefault(),s?.())};return p(n,{className:m,children:I("div",{className:"flex flex-col gap-4 rounded-[var(--inkblot-radius-xl)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",children:[p("h2",{className:"text-xl font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:t}),e?p("div",{className:"rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-interactive-primary)] p-4",style:{boxShadow:"0 0 12px var(--inkblot-semantic-color-interactive-primary)"},children:e}):null,r.length>0?I("div",{children:[p("h3",{className:"mb-2 text-sm font-medium text-[var(--inkblot-semantic-color-text-secondary)]",children:"Connected To"}),p("div",{className:"grid grid-cols-2 gap-2 sm:grid-cols-3",children:r.map((l,J)=>I("div",{className:"rounded-[var(--inkblot-radius-md)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-3 py-2",children:[p("span",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:l.label}),p("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:l.value})]},J))})]}):null,p("div",{className:"mt-2",children:p(k,{type:"text",value:a,onChange:l=>i?.(l.target.value),onKeyDown:B,placeholder:"Ask about this entity...",className:"rounded-[var(--inkblot-radius-md)]"})})]})})}import{Component as at}from"react";import{jsx as O}from"react/jsx-runtime";var S=class extends at{constructor(e){super(e),this.state={hasError:!1,error:null}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}render(){return this.state.hasError&&this.state.error?this.props.fallback?this.props.fallback:O("div",{className:o("inline-flex items-center gap-3 rounded-[var(--inkblot-radius-md)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-4 py-3 text-[var(--inkblot-semantic-color-text-secondary)]",this.props.className),role:"alert",children:O("span",{className:"text-sm font-medium",children:"Something went wrong"})}):this.props.children}};import{jsx as it}from"react/jsx-runtime";var nt={success:"border-[var(--inkblot-semantic-color-status-success)] bg-[var(--inkblot-semantic-color-status-success)]/10 text-[var(--inkblot-semantic-color-status-success)]",warning:"border-[var(--inkblot-semantic-color-status-warning)] bg-[var(--inkblot-semantic-color-status-warning)]/10 text-[var(--inkblot-semantic-color-status-warning)]",error:"border-[var(--inkblot-semantic-color-status-error)] bg-[var(--inkblot-semantic-color-status-error)]/10 text-[var(--inkblot-semantic-color-status-error)]",info:"border-[var(--inkblot-semantic-color-status-info)] bg-[var(--inkblot-semantic-color-status-info)]/10 text-[var(--inkblot-semantic-color-status-info)]"};function w({label:t,variant:e="info",className:r}){return it("span",{className:o("inline-flex items-center rounded-[var(--inkblot-radius-md)] border px-2 py-0.5 text-xs font-medium",nt[e],r),children:t})}import{jsx as y,jsxs as lt}from"react/jsx-runtime";function st(t){return t>=.8?"success":t>=.5?"info":t>=.2?"warning":"error"}function A({event:t,className:e}){let r=st(t.confidence_score),a=`${Math.round(t.confidence_score*100)}%`;return lt("div",{className:o("flex flex-wrap items-center gap-2 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",e),children:[y("span",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:t.actor}),y("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-tertiary)]",children:"\u2192"}),y("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:t.subject}),y("span",{className:"rounded-[var(--inkblot-radius-md)] bg-[var(--inkblot-semantic-color-background-tertiary)] px-2 py-0.5 text-xs text-[var(--inkblot-semantic-color-text-secondary)]",children:t.event_type}),y("span",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:t.timestamp}),y(w,{label:a,variant:r})]})}import{jsx as u,jsxs as z}from"react/jsx-runtime";var ct={success:"bg-[var(--inkblot-semantic-color-status-success)]",warning:"bg-[var(--inkblot-semantic-color-status-warning)]",error:"bg-[var(--inkblot-semantic-color-status-error)]",info:"bg-[var(--inkblot-semantic-color-status-info)]"};function dt(){return u("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-text-tertiary)]","aria-hidden":!0,children:u("circle",{cx:"8",cy:"8",r:"2",fill:"currentColor"})})}function F({events:t,className:e}){return u(n,{className:e,children:u("div",{className:o("flex flex-col gap-4 border-l-2 border-[var(--inkblot-semantic-color-border-default)] pl-4"),children:t.map(r=>z("div",{className:"flex items-start gap-3",children:[u("div",{className:"flex shrink-0 items-center pt-0.5",children:r.icon??u(dt,{})}),z("div",{className:"min-w-0 flex-1",children:[u("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:r.title}),u("p",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:r.timestamp})]}),r.status?u("div",{className:o("mt-1.5 h-2 w-2 shrink-0 rounded-full",ct[r.status]),"aria-hidden":!0}):null]},r.id))})})}import{jsx as d,jsxs as N}from"react/jsx-runtime";var T=36,L=2*Math.PI*T;function K({label:t,value:e,subtext:r,trend:a,className:i}){let s=Math.min(100,Math.max(0,e)),m=L-s/100*L;return d(n,{className:i,children:N("div",{className:"flex flex-col items-center gap-4 rounded-[var(--inkblot-radius-lg)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",children:[N("div",{className:"relative",children:[N("svg",{width:"96",height:"96",viewBox:"0 0 96 96",className:"-rotate-90",children:[d("circle",{cx:"48",cy:"48",r:T,fill:"none",stroke:"var(--inkblot-semantic-color-background-tertiary)",strokeWidth:"4"}),d("circle",{cx:"48",cy:"48",r:T,fill:"none",stroke:"var(--inkblot-semantic-color-interactive-primary)",strokeWidth:"4",strokeDasharray:L,strokeDashoffset:m,strokeLinecap:"round",className:"transition-[stroke-dashoffset] duration-[var(--inkblot-duration-fast)]"})]}),d("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:N("span",{className:"flex items-center gap-1 text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:[s,"%",a==="up"?d("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-status-success)]","aria-hidden":!0,children:d("path",{fill:"currentColor",d:"M8 4l4 6H4l4-6z"})}):a==="down"?d("svg",{viewBox:"0 0 16 16",className:"h-4 w-4 text-[var(--inkblot-semantic-color-status-error)]","aria-hidden":!0,children:d("path",{fill:"currentColor",d:"M8 12l4-6H4l4 6z"})}):null]})})]}),N("div",{className:"text-center",children:[d("p",{className:"text-sm font-medium text-[var(--inkblot-semantic-color-text-primary)]",children:t}),r?d("p",{className:"text-xs text-[var(--inkblot-semantic-color-text-tertiary)]",children:r}):null]})]})})}import{jsx as b,jsxs as ut}from"react/jsx-runtime";var mt={default:"text-[var(--inkblot-semantic-color-text-primary)]",success:"text-[var(--inkblot-semantic-color-status-success)]",warning:"text-[var(--inkblot-semantic-color-status-warning)]",error:"text-[var(--inkblot-semantic-color-status-error)]"};function pt({className:t}){return b("svg",{viewBox:"0 0 16 16",className:o("h-4 w-4",t),"aria-hidden":!0,children:b("path",{fill:"currentColor",d:"M6 4l4 4-4 4V4z"})})}function W({items:t,className:e}){return b(n,{className:e,children:b("ul",{className:o("flex flex-col gap-4 py-2"),children:t.map((r,a)=>ut("li",{className:"flex items-center justify-between gap-4",children:[b("span",{className:"text-sm text-[var(--inkblot-semantic-color-text-secondary)]",children:r.label}),b("span",{className:o("flex items-center gap-1 text-sm font-medium",mt[r.variant??"default"]),children:r.value!=null?r.value:b(pt,{})})]},a))})})}import{jsx as vt}from"react/jsx-runtime";function v({className:t,...e}){return vt("div",{className:o("animate-shimmer rounded-[var(--inkblot-radius-md)] bg-[length:200%_100%] bg-[linear-gradient(90deg,var(--inkblot-semantic-color-background-secondary)_0%,var(--inkblot-semantic-color-background-tertiary)_50%,var(--inkblot-semantic-color-background-secondary)_100%)]",t),...e})}import{jsx as h,jsxs as bt}from"react/jsx-runtime";function M({className:t,...e}){return bt("div",{className:o("flex flex-col gap-2 rounded-[var(--inkblot-radius-lg)] border border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] p-4",t),...e,children:[h(v,{className:"h-5 w-3/4"}),h(v,{className:"h-4 w-full"}),h(v,{className:"h-4 w-5/6"}),h(v,{className:"h-4 w-4/5"}),h(v,{className:"h-4 w-3/4"})]})}import{jsx as P,jsxs as $}from"react/jsx-runtime";function q({children:t,loading:e=!1,title:r,className:a,onRetry:i}){return P(n,{className:a,onRetry:i,children:e?$("div",{className:o("flex flex-col gap-4",a),children:[r?P("h2",{className:"text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:r}):null,P(M,{})]}):$("div",{className:o("flex flex-col gap-4",a),children:[r?P("h2",{className:"text-lg font-semibold text-[var(--inkblot-semantic-color-text-primary)]",children:r}):null,t]})})}import{jsx as E,jsxs as ft}from"react/jsx-runtime";function G({items:t,className:e}){return E(n,{className:e,children:E("nav",{className:o("flex w-14 flex-col items-center gap-1 border-r border-[var(--inkblot-semantic-color-border-default)] bg-[var(--inkblot-semantic-color-background-secondary)] py-4"),"aria-label":"Navigation",children:t.map(r=>ft("div",{className:o("relative flex w-full flex-col items-center gap-1 rounded-[var(--inkblot-radius-md)] px-2 py-2 transition-colors hover:text-[var(--inkblot-semantic-color-text-secondary)]",r.active?"text-[var(--inkblot-semantic-color-interactive-primary)]":"text-[var(--inkblot-semantic-color-text-tertiary)]"),children:[r.active?E("span",{className:"absolute left-0 top-1/2 h-6 w-0.5 -translate-y-1/2 rounded-r-full bg-[var(--inkblot-semantic-color-interactive-primary)]","aria-hidden":!0}):null,E("div",{className:"flex h-8 w-8 items-center justify-center [&>svg]:h-5 [&>svg]:w-5",children:r.icon}),r.label?E("span",{className:"text-[10px] font-medium",children:r.label}):null]},r.id))})})}export{g as Button,_ as CommandInterface,H as EntityCard,D as EntityCommandCard,S as ErrorBoundary,A as EventRow,F as EventStreamFeed,k as Input,K as IntelligenceScoreCard,W as MetricComparisonList,q as ModuleContainer,n as ModuleErrorBoundary,M as ModuleSkeleton,G as OSNavigationRail,v as Skeleton,w as StatusBadge};

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "@citron-systems/citron-ui",
+  "version": "1.0.0",
+  "description": "Core UI component library for Citron CRM. Accessible, design-token-driven React components built with consistency and scalability in mind.",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "storybook dev -p 6006",
+    "build": "tsup",
+    "build-storybook": "storybook build"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Inkblot-Studio/citron-ui.git"
+  },
+  "license": "MIT",
+  "keywords": [
+    "react",
+    "components",
+    "ui",
+    "design-system",
+    "citron",
+    "crm"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@citron-systems/citron-ds": "^1.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^3.5.0"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.0.1",
+    "@citron-systems/citron-ds": "^1.0.0",
+    "@storybook/addon-a11y": "^10.2.10",
+    "@storybook/addon-docs": "^10.2.10",
+    "@storybook/addon-onboarding": "^10.2.10",
+    "@storybook/addon-vitest": "^10.2.10",
+    "@storybook/react-vite": "^10.2.10",
+    "@types/node": "^25.3.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react-swc": "^4.2.3",
+    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/coverage-v8": "^4.0.18",
+    "autoprefixer": "^10.4.24",
+    "playwright": "^1.58.2",
+    "postcss": "^8.5.6",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "storybook": "^10.2.10",
+    "tailwindcss": "^3.4.19",
+    "tsup": "^8.5.1",
+    "typescript": "~5.9.3",
+    "vite": "^7.3.1",
+    "vitest": "^4.0.18"
+  }
+}