@coxwave/tap-kit-types

TypeScript types for the TapKit SDK and <tap-button> Web Component.

Purpose

This package serves as the single source of truth for all TapKit type definitions, eliminating duplication between:

• @coxwave/tap-sdk - npm wrapper package
• @coxwave/tap-kit-core - CDN implementation

Installation

npm install @coxwave/tap-kit-types
# or
pnpm add @coxwave/tap-kit-types

Setup

Once you install the package, the global type definitions are automatically available. No additional configuration is needed!

The package exports global type declarations that TypeScript automatically picks up from node_modules. This includes:

• Web Component: <tap-button> element with type-safe attributes
• Window extensions: Window.TapKit, loader flags, and debug properties
• Browser APIs: requestIdleCallback / cancelIdleCallback types

Manual Setup (Optional)

If the global types are not automatically picked up, you can explicitly include them in your tsconfig.json:

{
  "include": [
    "src/**/*",
    "node_modules/@coxwave/tap-kit-types/dist/index.d.ts"
  ]
}

Note: Do NOT add this package to compilerOptions.types - that option is only for @types/* packages. Adding non-@types packages there will cause TypeScript errors.

What Gets Registered

When you install this package, the following global types are automatically available:

• Web Component: <tap-button> element with type-safe attributes
• Window extensions: Window.TapKit, loader flags, and debug properties
• Browser APIs: requestIdleCallback / cancelIdleCallback types

This allows you to use the Web Component in JSX/TSX without type errors:

// ✅ TypeScript knows about <tap-button>
<tap-button floating={true} position="bottom-right" size="medium" />

Usage

import type {
  TapKitConfig,
  TapKitInitParams,
  Course,
  ContainerStyle,
} from "@coxwave/tap-kit-types";

const config: TapKitConfig = {
  apiKey: "your-api-key",
};

const params: TapKitInitParams = {
  buttonId: "tap-button",
  course: {
    userId: "user-1",
    courseId: "course-1",
    clipId: "clip-1",
  },
};

Exported Types

Core Configuration

• TapKitConfig - SDK configuration
• TapKitInitParams - Initialization parameters
• Course - Course information

Styling

• ContainerConfig - Container configuration
• ContainerMode - Container display mode
• FloatingConfig - Floating container settings
• SidebarConfig - Sidebar container settings
• PositionType - Position configuration
• ContainerLayoutState - Container layout state

Events

• SeekTimelineParamsType - Timeline seek parameters
• ShortcutKeyPropertiesType - Keyboard shortcut configuration
• ContainerVisibility - Visibility state

Web Component

• ITapButtonElement - Public API interface for <tap-button> Web Component
• TapButtonAttributes - Props/Attributes for <tap-button> element

// Example usage in React
<tap-button
  floating={true}
  position="bottom-right"
  size="medium"
>
  Custom content
</tap-button>

Errors

• TapKitError - Base error class
• TapKitInitializationError - Initialization errors
• TapKitMessageError - Message communication errors
• TapKitConfigurationError - Configuration errors
• TapKitLoaderError - Loader errors
• TapKitIframeError - iframe operation errors

Instance

• TapKitInstance - TapKit SDK instance interface
• TapKitConstructor - TapKit class constructor type

Video

• VideoPlayerAdapter - Video player adapter interface
• VideoPlayerConfig - Video player configuration

Re-exports from @coxwave/tap-messages

• AlarmMessageInstanceType
• AlarmType

License

MIT