Setup

Easy to boot up

Install package

npm i tailwindest

Define style functions

Plug Tailwindest type at createTools's generic to type the function correctly.

import { createTools, type Tailwindest } from "tailwindest"
 
type MyTailwind = Tailwindest<Record<string, unknown>, Record<string, unknown>>
type Tailwind = Required<MyTailwind>
 
// Plug Tailwindest type
const tw = createTools<MyTailwind>()
 
export { tw, type Tailwind }

Export type Tailwind. This is full type definition of tailwindcss.

Summary

Copy and paste it at your project. Both javascript and typescript supported.

Typescript

tw.ts

import { createTools, type Tailwindest } from "tailwindest"
 
/**
 * Custom type definition of tailwindest
 * @see {@link https://tailwindest.vercel.app/apis/Tailwindest api reference}
 */
type TailwindCustom = Tailwindest<{}, {}>
/**
 * Full type definition of `tailwindcss`
 */
type Tailwind = Required<TailwindCustom>
 
const tw = createTools<TailwindCustom>()
 
export { tw, type Tailwind }

Javascript

Add type with jsdoc without any setup.

tw.js

import { createTools } from "tailwindest"
 
/** @typedef {import("tailwindest").Tailwindest<{}, {}>} CustomTailwind */
/** @typedef {ReturnType<typeof createTools<CustomTailwind>>} CreateTools */
/** @typedef {Required<CustomTailwind>} Tailwind */
 
/** @type {CreateTools} */
export const tw = createTools()

Overview Basic styling