CtrlK
BlogDocsLog inGet started
Tessl Logo

pantheon-ai/typescript-advanced

Comprehensive TypeScript guidance covering compiler configuration, advanced types, utility types, type guards, strict mode workflows, and documentation patterns; use when configuring tsconfig, designing complex generics, making illegal states unrepresentable, fixing type errors, or writing testable and maintainable type-safe APIs.

Overall
score

99%

Review — 99%

Does it follow best practices?

Validation — 10 / 11 Passed

Validation for skill structure

Overview
Skills
Evals
Files

utilities-extract-exclude.mdreferences/

Extract and Exclude Utility Types

Exclude<T, U>

Removes types from T that are assignable to U.

Basic Usage

type AllColors = 'red' | 'green' | 'blue' | 'yellow';

type PrimaryColors = Exclude<AllColors, 'yellow'>;
// Type: 'red' | 'green' | 'blue'

type NonBlueColors = Exclude<AllColors, 'blue' | 'green'>;
// Type: 'red' | 'yellow'

Implementation

type Exclude<T, U> = T extends U ? never : T;

How it works: Distributive conditional type - checks each member of T union.

Use Cases

Filter Union Types

type Status = 'pending' | 'approved' | 'rejected' | 'cancelled';

type ActiveStatus = Exclude<Status, 'cancelled'>;
// 'pending' | 'approved' | 'rejected'

function processActiveOrder(status: ActiveStatus) {
  // status cannot be 'cancelled'
}

Remove null/undefined

type MaybeString = string | null | undefined;

type DefiniteString = Exclude<MaybeString, null | undefined>;
// Type: string

// Note: NonNullable does the same thing
type DefiniteString2 = NonNullable<MaybeString>;
// Type: string

Filter by Type

type Mixed = string | number | boolean | null | undefined;

type OnlyPrimitives = Exclude<Mixed, null | undefined>;
// string | number | boolean

type OnlyStringsAndNumbers = Exclude<Mixed, boolean | null | undefined>;
// string | number

Remove Function Types

type Value = string | number | (() => void) | (() => string);

type NonFunction = Exclude<Value, Function>;
// string | number

Extract<T, U>

Extracts from T only types that are assignable to U (opposite of Exclude).

Basic Usage

type AllColors = 'red' | 'green' | 'blue' | 'yellow';

type WarmColors = Extract<AllColors, 'red' | 'yellow' | 'orange'>;
// Type: 'red' | 'yellow' (orange doesn't exist in AllColors)

Implementation

type Extract<T, U> = T extends U ? T : never;

Use Cases

Filter to Specific Types

type Mixed = string | number | boolean | null;

type StringOrNumber = Extract<Mixed, string | number>;
// string | number

type OnlyString = Extract<Mixed, string>;
// string

Extract Function Types

type Value = string | number | (() => void) | (() => string);

type OnlyFunctions = Extract<Value, Function>;
// (() => void) | (() => string)

Extract Object Types

type Mixed = string | number | { name: string } | { id: number };

type OnlyObjects = Extract<Mixed, object>;
// { name: string } | { id: number }

Pattern Matching with Strings

type Events = 'onClick' | 'onHover' | 'onFocus' | 'handleClick' | 'handleSubmit';

// Extract events starting with 'on'
type OnEvents = Extract<Events, `on${string}`>;
// 'onClick' | 'onHover' | 'onFocus'

type HandleEvents = Extract<Events, `handle${string}`>;
// 'handleClick' | 'handleSubmit'

Combining Extract and Exclude

Complex Filtering

type ApiResponse = 
  | { status: 'success'; data: any }
  | { status: 'error'; error: string }
  | { status: 'loading' }
  | { status: 'idle' };

// Extract responses with data/error
type ResponseWithPayload = Extract<ApiResponse, { data: any } | { error: any }>;
// { status: 'success'; data: any } | { status: 'error'; error: string }

// Exclude loading states
type CompletedResponse = Exclude<ApiResponse, { status: 'loading' | 'idle' }>;
// { status: 'success'; data: any } | { status: 'error'; error: string }

Type-Safe Event Handlers

type EventMap = {
  click: MouseEvent;
  keydown: KeyboardEvent;
  scroll: Event;
  custom: CustomEvent;
};

type EventName = keyof EventMap;

// Extract only standard DOM events
type StandardEvents = Extract<EventName, 'click' | 'keydown' | 'scroll'>;
// 'click' | 'keydown' | 'scroll'

// Exclude standard events (get custom ones)
type CustomEvents = Exclude<EventName, 'click' | 'keydown' | 'scroll'>;
// 'custom'

NonNullable<T>

Built-in utility using Exclude:

type NonNullable<T> = Exclude<T, null | undefined>;

type MaybeString = string | null | undefined;
type DefiniteString = NonNullable<MaybeString>;
// string

Practical Patterns

Filter Props by Value Type

type User = {
  id: string;
  name: string;
  age: number;
  isActive: boolean;
  email: string;
};

// Get keys with string values
type StringKeys<T> = {
  [K in keyof T]: T[K] extends string ? K : never;
}[keyof T];

type UserStringKeys = StringKeys<User>;
// 'id' | 'name' | 'email'

// Extract string properties
type StringProps = Pick<User, Extract<keyof User, StringKeys<User>>>;

Exclude Internal Properties

interface Component {
  _id: string;
  _internal: boolean;
  name: string;
  value: string;
}

type PublicKeys<T> = Exclude<keyof T, `_${string}`>;
type PublicComponent = Pick<Component, PublicKeys<Component>>;
// {
//   name: string;
//   value: string;
// }

Type-Safe Union Filtering

type Shape =
  | { kind: 'circle'; radius: number }
  | { kind: 'square'; size: number }
  | { kind: 'rectangle'; width: number; height: number };

type RoundShapes = Extract<Shape, { kind: 'circle' }>;
// { kind: 'circle'; radius: number }

type NonCircleShapes = Exclude<Shape, { kind: 'circle' }>;
// { kind: 'square'; size: number } | { kind: 'rectangle'; width: number; height: number }

Best Practices

  1. Use Exclude for denylists - Remove unwanted types from unions
  2. Use Extract for allowlists - Keep only wanted types from unions
  3. Combine with conditional types - Build complex type transformations
  4. Use NonNullable for null safety - Remove null/undefined explicitly
  5. Extract with template literals - Pattern match string literal types

Common Patterns

API Status Types

type ApiStatus = 'idle' | 'loading' | 'success' | 'error';

type ActiveStatus = Exclude<ApiStatus, 'idle'>;
// 'loading' | 'success' | 'error'

type CompletedStatus = Extract<ApiStatus, 'success' | 'error'>;
// 'success' | 'error'

Permission Filtering

type Permission = 'read' | 'write' | 'delete' | 'admin';

type BasicPermissions = Exclude<Permission, 'admin'>;
// 'read' | 'write' | 'delete'

type ModifyPermissions = Extract<Permission, 'write' | 'delete'>;
// 'write' | 'delete'

Common Pitfalls

  • Excluding non-existent types - No error, returns original type
  • Extract with no matches - Returns never
  • Forgetting distributive behavior - Works on union members, not object properties
  • Using on non-union types - Exclude/Extract are for unions, not object shapes

Install with Tessl CLI

npx tessl i pantheon-ai/typescript-advanced

references

compiler-module-resolution.md

compiler-performance.md

compiler-strict-mode.md

compiler-tsconfig.md

docs-adr-templates.md

docs-framework-docs.md

docs-jsdoc-patterns.md

docs-typedoc-config.md

guards-assertion-functions.md

guards-basic.md

guards-branded-types.md

guards-discriminated-unions.md

guards-exhaustiveness.md

guards-generic.md

guards-inference-infer.md

guards-inference-return.md

patterns-advanced-generics.md

patterns-api-client.md

patterns-branded-types.md

patterns-builder.md

patterns-deep-readonly.md

patterns-dependency-injection.md

patterns-event-emitter.md

patterns-form-validation.md

patterns-plugin-system.md

patterns-recursive-types.md

patterns-state-machine.md

patterns-type-safe-module.md

practices-illegal-states.md

practices-module-patterns.md

practices-runtime-validation.md

practices-type-first.md

types-conditional.md

types-generics.md

types-index-signatures.md

types-mapped.md

types-narrowing.md

types-template-literals.md

types-type-assertions.md

types-unions-intersections.md

utilities-custom-mapped-types.md

utilities-extract-exclude.md

utilities-key-remapping.md

utilities-nonnullable-awaited.md

utilities-partial-required.md

utilities-pick-omit.md

utilities-readonly-record.md

utilities-returntype-parameters.md

SKILL.md

tile.json