@openpkg-ts/ui 0.1.1

package/dist/docskit/index.d.ts

@@ -0,0 +1,410 @@
+import { AnnotationHandler } from "codehike/code";
+declare const callout: AnnotationHandler;
+import { AnnotationHandler as AnnotationHandler2, RawCode } from "codehike/code";
+type CodeOptions = {
+	copyButton?: boolean;
+	lineNumbers?: boolean;
+	wordWrap?: boolean;
+	animate?: boolean;
+};
+type CodeInfo = {
+	storage?: string;
+	options: CodeOptions;
+	tabs: {
+		options: CodeOptions;
+		title: string;
+		code: string;
+		pre: React.ReactNode;
+		icon: React.ReactNode;
+		lang: string;
+	}[];
+};
+declare const theme = "github-from-css";
+/**
+* Convert flags string to options object.
+*
+* @example
+* flagsToOptions("na") // { lineNumbers: true, animate: true }
+* flagsToOptions("c") // { copyButton: true }
+*/
+declare function flagsToOptions(flags?: string);
+declare function DocsKitCode(props: {
+	codeblock: RawCode;
+	handlers?: AnnotationHandler2[];
+	className?: string;
+});
+declare function SingleCode(props: {
+	group: CodeInfo;
+	className?: string;
+});
+declare function toCodeGroup(props: {
+	codeblocks: RawCode[];
+	flags?: string;
+	storage?: string;
+	handlers?: AnnotationHandler2[];
+}): Promise<CodeInfo>;
+declare function MultiCode({ group, className }: {
+	group: CodeInfo;
+	className?: string;
+});
+import { AnnotationHandler as AnnotationHandler3, RawCode as RawCode2 } from "codehike/code";
+/**
+* Client-side code block with syntax highlighting.
+* Highlights code in useEffect to avoid SSR memory issues.
+*/
+declare function ClientDocsKitCode(props: {
+	codeblock: RawCode2;
+	handlers?: AnnotationHandler3[];
+	className?: string;
+});
+/**
+* Client-side terminal-style code block.
+*/
+declare function ClientTerminal(props: {
+	codeblock: RawCode2;
+	handlers?: AnnotationHandler3[];
+});
+/**
+* Client-side inline code with syntax highlighting.
+*/
+declare function ClientInlineCode({ codeblock }: {
+	codeblock: RawCode2;
+});
+/**
+* Client-side code tabs with multiple files.
+*/
+declare function ClientCode(props: {
+	codeblocks: RawCode2[];
+	flags?: string;
+	storage?: string;
+});
+declare function CopyButton({ text, className, variant }: {
+	text: string;
+	className?: string;
+	variant?: "floating" | "inline";
+});
+import { AnnotationHandler as AnnotationHandler4, RawCode as RawCode3 } from "codehike/code";
+interface DiffStats {
+	additions?: number;
+	deletions?: number;
+}
+interface ClientDiffCodeProps {
+	codeblock: RawCode3;
+	/** Full file path (e.g., "src/components/") */
+	path?: string;
+	/** Filename (e.g., "index.ts") - if not provided, extracted from codeblock meta */
+	filename?: string;
+	/** Diff statistics */
+	diff?: DiffStats;
+	/** Extra annotation handlers */
+	handlers?: AnnotationHandler4[];
+	/** Wrapper className */
+	className?: string;
+	/** Start collapsed */
+	defaultOpen?: boolean;
+}
+/**
+* DocKit code block variant with file change row header.
+* Displays path/filename with diff stats, collapsible with syntax-highlighted code.
+*/
+declare function ClientDiffCode(props: ClientDiffCodeProps);
+declare function CodeIcon({ title, lang, className }: {
+	title: string;
+	lang: string;
+	className?: string;
+});
+import { RawCode as RawCode4 } from "codehike/code";
+declare function DocsKitInlineCode({ codeblock }: {
+	codeblock: RawCode4;
+});
+type PackageManager = "npm" | "bun" | "pnpm" | "yarn";
+interface PackageInstallProps {
+	/** The package name to install */
+	package: string;
+	/** Whether this is a dev dependency */
+	dev?: boolean;
+	/** Whether this is a global install */
+	global?: boolean;
+	/** Which package managers to show (defaults to all) */
+	managers?: PackageManager[];
+	/** Whether to show the copy button */
+	copyButton?: boolean;
+}
+/**
+* Package installation command with tabs for different package managers.
+*
+* @example
+* ```tsx
+* <PackageInstall package="@doccov/ui" />
+* <PackageInstall package="typescript" dev />
+* <PackageInstall package="opencode-ai" global />
+* ```
+*/
+declare function PackageInstall({ package: pkg, dev, global: isGlobal, managers, copyButton }: PackageInstallProps);
+/**
+* Loading skeleton for code blocks.
+*/
+declare function CodeBlockSkeleton({ hasTitle, lines }: {
+	hasTitle?: boolean;
+	lines?: number;
+});
+/**
+* Loading skeleton for terminal-style code blocks.
+*/
+declare function TerminalSkeleton({ lines }: {
+	lines?: number;
+});
+/**
+* Loading skeleton for inline code.
+*/
+declare function InlineCodeSkeleton();
+/**
+* Loading skeleton for code tabs.
+*/
+declare function CodeTabsSkeleton({ tabs, lines }: {
+	tabs?: number;
+	lines?: number;
+});
+import { RawCode as RawCode5 } from "codehike/code";
+declare function CodeGroup(props: unknown);
+declare function Code(props: {
+	codeblocks: RawCode5[];
+	flags?: string;
+	storage?: string;
+});
+import { AnnotationHandler as AnnotationHandler5, RawCode as RawCode6 } from "codehike/code";
+/**
+* Terminal-style code block with macOS window controls.
+*
+* @example
+* ```tsx
+* <Terminal
+*   codeblock={{
+*     value: "npm install @opencode-ai/sdk",
+*     lang: "bash",
+*     meta: "-c",
+*   }}
+* />
+* ```
+*/
+declare function Terminal(props: {
+	codeblock: RawCode6;
+	handlers?: AnnotationHandler5[];
+});
+declare const collapse: unknown;
+import { AnnotationHandler as AnnotationHandler6 } from "codehike/code";
+declare const diff: AnnotationHandler6;
+import React2 from "react";
+declare function addDocsKit<T extends Record<string, React2.ElementType | string>>(components: T): T;
+import { AnnotationHandler as AnnotationHandler7 } from "codehike/code";
+declare const expandable: AnnotationHandler7;
+import { AnnotationHandler as AnnotationHandler8 } from "codehike/code";
+import React3 from "react";
+declare function WithHover(props: {
+	children: React3.ReactNode;
+});
+declare function HoverLink(props: {
+	href?: string;
+	children?: React3.ReactNode;
+});
+declare const hover: AnnotationHandler8;
+import { AnnotationHandler as AnnotationHandler9 } from "codehike/code";
+declare const lineNumbers2: AnnotationHandler9;
+import { AnnotationHandler as AnnotationHandler10 } from "codehike/code";
+declare const link: AnnotationHandler10;
+import { AnnotationHandler as AnnotationHandler11 } from "codehike/code";
+declare const mark: AnnotationHandler11;
+declare function WithNotes({ children,...rest }: {
+	children: React.ReactNode;
+});
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import * as React4 from "react";
+declare function Tabs({ className,...props }: React4.ComponentProps<typeof TabsPrimitive.Root>);
+declare function TabsList({ className,...props }: React4.ComponentProps<typeof TabsPrimitive.List>);
+declare function TabsTrigger({ className,...props }: React4.ComponentProps<typeof TabsPrimitive.Trigger>);
+declare function TabsContent({ className,...props }: React4.ComponentProps<typeof TabsPrimitive.Content>);
+import { AnnotationHandler as AnnotationHandler12 } from "codehike/code";
+declare const tooltip: AnnotationHandler12;
+declare function TooltipLink(props: {
+	href?: string;
+	children?: React.ReactNode;
+});
+import { AnnotationHandler as AnnotationHandler13 } from "codehike/code";
+declare const wordWrap2: AnnotationHandler13;
+import * as React5 from "react";
+type HttpMethod = "GET" | "POST" | "PUT" | "DELETE" | "PATCH";
+type EndpointBadgeSize = "sm" | "md";
+declare const endpointBadgeVariants: (props?: {
+	method?: HttpMethod | null;
+	size?: EndpointBadgeSize | null;
+	className?: string;
+}) => string;
+interface EndpointBadgeProps extends React5.HTMLAttributes<HTMLSpanElement> {
+	method: HttpMethod;
+	size?: EndpointBadgeSize | null;
+}
+declare const EndpointBadge: React5.ForwardRefExoticComponent<EndpointBadgeProps & React5.RefAttributes<HTMLSpanElement>>;
+import * as React6 from "react";
+interface EndpointHeaderProps extends React6.HTMLAttributes<HTMLDivElement> {
+	/** HTTP method */
+	method: HttpMethod;
+	/** API path (e.g., "/v1/customers") */
+	path: string;
+	/** Show copy button on hover */
+	copyable?: boolean;
+}
+declare const EndpointHeader: React6.ForwardRefExoticComponent<EndpointHeaderProps & React6.RefAttributes<HTMLDivElement>>;
+import * as React7 from "react";
+interface APIParameterSchema {
+	/** Type name */
+	type?: string;
+	/** Formatted type string */
+	typeString?: string;
+	/** Description */
+	description?: string;
+	/** Nested properties for object types */
+	properties?: Record<string, APIParameterSchema>;
+	/** Required property names */
+	required?: string[];
+}
+interface APIParameterItemProps {
+	/** Parameter name */
+	name: string;
+	/** Type string (e.g., "string", "object") */
+	type: string;
+	/** Is required */
+	required?: boolean;
+	/** Description */
+	description?: string;
+	/** Nested children (for expandable objects) */
+	children?: APIParameterSchema;
+	/** Nesting depth */
+	depth?: number;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Single parameter row with name, type, required badge, description, and expandable children.
+* Stripe-style API reference parameter display.
+*/
+declare function APIParameterItem({ name, type, required, description, children, depth, className }: APIParameterItemProps): React7.ReactNode;
+import * as React8 from "react";
+interface ParameterListProps {
+	/** Title above the list (e.g., "Body parameters") */
+	title?: string;
+	/** Number of items to show before collapsing */
+	collapseAfter?: number;
+	/** Child parameter items */
+	children: React8.ReactNode;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Container for parameter items with optional "More parameters" collapse.
+*/
+declare function ParameterList({ title, collapseAfter, children, className }: ParameterListProps): React8.ReactNode;
+import * as React9 from "react";
+interface ResponseBlockProps {
+	/** Response JSON data */
+	data: object;
+	/** Optional title (e.g., "Response", "200 OK") */
+	title?: string;
+	/** Custom className */
+	className?: string;
+}
+/**
+* JSON response preview with syntax highlighting.
+* Displays formatted JSON with copy functionality.
+*/
+declare function ResponseBlock({ data, title, className }: ResponseBlockProps): React9.ReactNode;
+import * as React10 from "react";
+interface Language {
+	/** Language identifier (e.g., "curl", "node", "python") */
+	id: string;
+	/** Display label (e.g., "cURL", "Node.js", "Python") */
+	label: string;
+}
+interface LanguageSelectorProps {
+	/** Available languages */
+	languages: Language[];
+	/** Currently selected language id */
+	value: string;
+	/** Callback when language changes */
+	onChange: (languageId: string) => void;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Dropdown selector for choosing code example language.
+* Used in APICodePanel to switch between language examples.
+*/
+declare function LanguageSelector({ languages, value, onChange, className }: LanguageSelectorProps): React10.ReactNode;
+import * as React11 from "react";
+interface CodeExample {
+	/** Language identifier */
+	languageId: string;
+	/** Code content */
+	code: string;
+	/** Optional syntax highlighting language (defaults to languageId) */
+	highlightLang?: string;
+}
+interface APICodePanelProps {
+	/** Available languages for the selector */
+	languages: Language[];
+	/** Code examples keyed by language id */
+	examples: CodeExample[];
+	/** Optional external link (e.g., to API playground) */
+	externalLink?: string;
+	/** Optional title shown in header */
+	title?: string;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Right-side sticky code panel for API documentation.
+* Features language dropdown, copy button, and dark bg with syntax highlighting.
+*/
+declare function APICodePanel({ languages, examples, externalLink, title, className }: APICodePanelProps): React11.ReactNode;
+import * as React12 from "react";
+interface APISectionProps {
+	/** Section title (e.g., "Create a customer", "The Customer object") */
+	title: string;
+	/** Optional anchor id for deep linking */
+	id?: string;
+	/** Optional description */
+	description?: React12.ReactNode;
+	/** Left column content (parameters, returns, etc.) */
+	children: React12.ReactNode;
+	/** Languages for code panel */
+	languages: Language[];
+	/** Code examples for the right panel */
+	examples: CodeExample[];
+	/** Optional external link for code panel */
+	externalLink?: string;
+	/** Optional code panel title */
+	codePanelTitle?: string;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Single API section with two-column layout.
+* Docs/params on left, sticky code panel on right.
+*/
+declare function APISection({ title, id, description, children, languages, examples, externalLink, codePanelTitle, className }: APISectionProps): React12.ReactNode;
+import * as React13 from "react";
+interface APIReferencePageProps {
+	/** Page title */
+	title: string;
+	/** Optional page description */
+	description?: React13.ReactNode;
+	/** API sections as children */
+	children: React13.ReactNode;
+	/** Custom className */
+	className?: string;
+}
+/**
+* Full page wrapper for API reference documentation.
+* Provides max-width container and consistent spacing.
+*/
+declare function APIReferencePage({ title, description, children, className }: APIReferencePageProps): React13.ReactNode;
+export { wordWrap2 as wordWrap, tooltip, toCodeGroup, theme, mark, link, lineNumbers2 as lineNumbers, hover, flagsToOptions, expandable, endpointBadgeVariants, diff, collapse, callout, addDocsKit, WithNotes, WithHover, TooltipLink, TerminalSkeleton, Terminal, TabsTrigger, TabsList, TabsContent, Tabs, SingleCode, ResponseBlockProps, ResponseBlock, ParameterListProps, ParameterList, PackageInstall, MultiCode, LanguageSelectorProps, LanguageSelector, Language, InlineCodeSkeleton, HttpMethod, HoverLink, EndpointHeaderProps, EndpointHeader, EndpointBadgeProps, EndpointBadge, DocsKitInlineCode, DocsKitCode, DiffStats, CopyButton, CodeTabsSkeleton, CodeInfo, CodeIcon, CodeGroup, CodeExample, CodeBlockSkeleton, Code, ClientTerminal, ClientInlineCode, ClientDocsKitCode, ClientDiffCodeProps, ClientDiffCode, ClientCode, APISectionProps, APISection, APIReferencePageProps, APIReferencePage, APIParameterSchema, APIParameterItemProps, APIParameterItem, APICodePanelProps, APICodePanel };