tailwindcss 0.0.0-insiders.7c337f2 → 0.0.0-insiders.7d8eb21

package/types/config.d.ts

@@ -1,4 +1,4 @@
-import type { CorePluginList } from './generated/CorePluginList'
+import type { CorePluginList } from './generated/corePluginList'
 import type { DefaultColors } from './generated/colors'
 
 // Helpers
@@ -11,7 +11,8 @@ type KeyValuePair<K extends keyof any = string, V = string> = Record<K, V>
 interface RecursiveKeyValuePair<K extends keyof any = string, V = string> {
   [key: string]: V | RecursiveKeyValuePair<K, V>
 }
-type ResolvableTo<T> = T | ((utils: PluginUtils) => T)
+export type ResolvableTo<T> = T | ((utils: PluginUtils) => T)
+type CSSRuleObject = RecursiveKeyValuePair<string, null | string | string[]>
 
 interface PluginUtils {
   colors: DefaultColors
@@ -30,6 +31,7 @@ type ContentConfig =
   | (FilePath | RawFile)[]
   | {
       files: (FilePath | RawFile)[]
+      relative?: boolean
       extract?: ExtractorFn | { [extension: string]: ExtractorFn }
       transform?: TransformerFn | { [extension: string]: TransformerFn }
     }
@@ -48,27 +50,31 @@ type SafelistConfig =
   | string[]
   | {
       pattern: RegExp
-      variants: string[]
+      variants?: string[]
     }[]
 
 // Presets related config
 type PresetsConfig = Config[]
 
 // Future related config
-type FutureConfigValues = never // Replace with 'future-feature-1' | 'future-feature-2'
+type FutureConfigValues =
+  | 'hoverOnlyWhenSupported'
+  | 'respectDefaultRingColorOpacity'
+  | 'disableColorOpacityUtilitiesByDefault'
+  | 'relativeContentPathsByDefault'
 type FutureConfig = Expand<'all' | Partial<Record<FutureConfigValues, boolean>>> | []
 
 // Experimental related config
-type ExperimentalConfigValues = 'optimizeUniversalDefaults' // Replace with 'experimental-feature-1' | 'experimental-feature-2'
+type ExperimentalConfigValues = 'optimizeUniversalDefaults' | 'matchVariant'
 type ExperimentalConfig = Expand<'all' | Partial<Record<ExperimentalConfigValues, boolean>>> | []
 
 // DarkMode related config
 type DarkModeConfig =
-  /** Use the `media` query strategy. */
+  // Use the `media` query strategy.
   | 'media'
-  /** Use the `class` stategy, which requires a `.dark` class on the `html`. */
+  // Use the `class` strategy, which requires a `.dark` class on the `html`.
   | 'class'
-  /** Use the `class` stategy with a custom class instead of `.dark`. */
+  // Use the `class` strategy with a custom class instead of `.dark`.
   | ['class', string]
 
 type Screen = { raw: string } | { min: string } | { max: string } | { min: string; max: string }
@@ -76,16 +82,16 @@ type ScreensConfig = string[] | KeyValuePair<string, string | Screen | Screen[]>
 
 // Theme related config
 interface ThemeConfig {
-  extend: Partial<Omit<ThemeConfig, 'extend'>>
-
-  /** Responsiveness */
+  // Responsiveness
   screens: ResolvableTo<ScreensConfig>
+  supports: ResolvableTo<Record<string, string>>
+  data: ResolvableTo<Record<string, string>>
 
-  /** Reusable base configs */
+  // Reusable base configs
   colors: ResolvableTo<RecursiveKeyValuePair>
   spacing: ResolvableTo<KeyValuePair>
 
-  /** Components */
+  // Components
   container: ResolvableTo<
     Partial<{
       screens: ScreensConfig
@@ -94,7 +100,7 @@ interface ThemeConfig {
     }>
   >
 
-  /** Utilities */
+  // Utilities
   inset: ThemeConfig['spacing']
   zIndex: ResolvableTo<KeyValuePair>
   order: ResolvableTo<KeyValuePair>
@@ -154,7 +160,14 @@ interface ThemeConfig {
   objectPosition: ResolvableTo<KeyValuePair>
   padding: ThemeConfig['spacing']
   textIndent: ThemeConfig['spacing']
-  fontFamily: ResolvableTo<KeyValuePair<string, string[]>>
+  fontFamily: ResolvableTo<
+    KeyValuePair<
+      string,
+      | string
+      | string[]
+      | [fontFamily: string | string[], configuration: Partial<{ fontFeatureSettings: string }>]
+    >
+  >
   fontSize: ResolvableTo<
     KeyValuePair<
       string,
@@ -165,6 +178,7 @@ interface ThemeConfig {
           configuration: Partial<{
             lineHeight: string
             letterSpacing: string
+            fontWeight: string | number
           }>
         ]
     >
@@ -195,7 +209,7 @@ interface ThemeConfig {
   blur: ResolvableTo<KeyValuePair>
   brightness: ResolvableTo<KeyValuePair>
   contrast: ResolvableTo<KeyValuePair>
-  dropShadow: ResolvableTo<KeyValuePair>
+  dropShadow: ResolvableTo<KeyValuePair<string, string | string[]>>
   grayscale: ResolvableTo<KeyValuePair>
   hueRotate: ResolvableTo<KeyValuePair>
   invert: ResolvableTo<KeyValuePair>
@@ -217,7 +231,7 @@ interface ThemeConfig {
   willChange: ResolvableTo<KeyValuePair>
   content: ResolvableTo<KeyValuePair>
 
-  /** Custom */
+  // Custom
   [key: string]: any
 }
 
@@ -242,62 +256,88 @@ type ValueType =
   | 'relative-size'
   | 'shadow'
 export interface PluginAPI {
-  /** for registering new static utility styles */
+  // for registering new static utility styles
   addUtilities(
-    utilities: RecursiveKeyValuePair | RecursiveKeyValuePair[],
+    utilities: CSSRuleObject | CSSRuleObject[],
     options?: Partial<{
       respectPrefix: boolean
       respectImportant: boolean
     }>
   ): void
-  /** for registering new dynamic utility styles */
-  matchUtilities<T>(
-    utilities: KeyValuePair<string, (value: T) => RecursiveKeyValuePair>,
+  // for registering new dynamic utility styles
+  matchUtilities<T = string, U = string>(
+    utilities: KeyValuePair<
+      string,
+      (value: T | string, extra: { modifier: U | string | null }) => CSSRuleObject | null
+    >,
     options?: Partial<{
       respectPrefix: boolean
       respectImportant: boolean
       type: ValueType | ValueType[]
       values: KeyValuePair<string, T>
+      modifiers: 'any' | KeyValuePair<string, U>
       supportsNegativeValues: boolean
     }>
   ): void
-  /** for registering new static component styles */
+  // for registering new static component styles
   addComponents(
-    components: RecursiveKeyValuePair | RecursiveKeyValuePair[],
+    components: CSSRuleObject | CSSRuleObject[],
     options?: Partial<{
       respectPrefix: boolean
       respectImportant: boolean
     }>
   ): void
-  /** for registering new dynamic component styles */
-  matchComponents<T>(
-    components: KeyValuePair<string, (value: T) => RecursiveKeyValuePair>,
+  // for registering new dynamic component styles
+  matchComponents<T = string, U = string>(
+    components: KeyValuePair<
+      string,
+      (value: T | string, extra: { modifier: U | string | null }) => CSSRuleObject | null
+    >,
     options?: Partial<{
       respectPrefix: boolean
       respectImportant: boolean
       type: ValueType | ValueType[]
       values: KeyValuePair<string, T>
+      modifiers: 'any' | KeyValuePair<string, U>
       supportsNegativeValues: boolean
     }>
   ): void
-  /** for registering new base styles */
-  addBase(base: RecursiveKeyValuePair | RecursiveKeyValuePair[]): void
-  /** for registering custom variants */
+  // for registering new base styles
+  addBase(base: CSSRuleObject | CSSRuleObject[]): void
+  // for registering custom variants
   addVariant(name: string, definition: string | string[] | (() => string) | (() => string)[]): void
-  /** for looking up values in the user’s theme configuration */
+  matchVariant<T = string>(
+    name: string,
+    cb: (value: T | string, extra: { modifier: string | null }) => string | string[],
+    options?: {
+      values?: KeyValuePair<string, T>
+      sort?(
+        a: { value: T | string; modifier: string | null },
+        b: { value: T | string; modifier: string | null }
+      ): number
+    }
+  ): void
+  // for looking up values in the user’s theme configuration
   theme: <TDefaultValue = Config['theme']>(
     path?: string,
     defaultValue?: TDefaultValue
   ) => TDefaultValue
-  /** for looking up values in the user’s Tailwind configuration */
+  // for looking up values in the user’s Tailwind configuration
   config: <TDefaultValue = Config>(path?: string, defaultValue?: TDefaultValue) => TDefaultValue
-  /** for checking if a core plugin is enabled */
+  // for checking if a core plugin is enabled
   corePlugins(path: string): boolean
-  /** for manually escaping strings meant to be used in class names */
+  // for manually escaping strings meant to be used in class names
   e: (className: string) => string
 }
 export type PluginCreator = (api: PluginAPI) => void
-export type PluginsConfig = (PluginCreator | { handler: PluginCreator; config?: Config })[]
+export type PluginsConfig = (
+  | PluginCreator
+  | { handler: PluginCreator; config?: Partial<Config> }
+  | {
+      (options: any): { handler: PluginCreator; config?: Partial<Config> }
+      __isOptionsFunction: true
+    }
+)[]
 
 // Top level config related
 interface RequiredConfig {
@@ -313,10 +353,10 @@ interface OptionalConfig {
   future: Partial<FutureConfig>
   experimental: Partial<ExperimentalConfig>
   darkMode: Partial<DarkModeConfig>
-  theme: Partial<ThemeConfig>
+  theme: Partial<ThemeConfig & { extend: Partial<ThemeConfig> }>
   corePlugins: Partial<CorePluginsConfig>
   plugins: Partial<PluginsConfig>
-  /** Custom */
+  // Custom
   [key: string]: any
 }
 

package/types/generated/default-theme.d.ts

@@ -0,0 +1,342 @@
+import { Config } from '../../types'
+type CSSDeclarationList = Record<string, string>
+export type DefaultTheme = Config['theme'] & {
+  animation: Record<'none' | 'spin' | 'ping' | 'pulse' | 'bounce', string>
+  aria: Record<
+    | 'checked'
+    | 'disabled'
+    | 'expanded'
+    | 'hidden'
+    | 'pressed'
+    | 'readonly'
+    | 'required'
+    | 'selected',
+    string
+  >
+  aspectRatio: Record<'auto' | 'square' | 'video', string>
+  backgroundImage: Record<
+    | 'none'
+    | 'gradient-to-t'
+    | 'gradient-to-tr'
+    | 'gradient-to-r'
+    | 'gradient-to-br'
+    | 'gradient-to-b'
+    | 'gradient-to-bl'
+    | 'gradient-to-l'
+    | 'gradient-to-tl',
+    string
+  >
+  backgroundPosition: Record<
+    | 'bottom'
+    | 'center'
+    | 'left'
+    | 'left-bottom'
+    | 'left-top'
+    | 'right'
+    | 'right-bottom'
+    | 'right-top'
+    | 'top',
+    string
+  >
+  backgroundSize: Record<'auto' | 'cover' | 'contain', string>
+  blur: Record<'0' | 'none' | 'sm' | 'DEFAULT' | 'md' | 'lg' | 'xl' | '2xl' | '3xl', string>
+  borderRadius: Record<
+    'none' | 'sm' | 'DEFAULT' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full',
+    string
+  >
+  borderWidth: Record<'0' | '2' | '4' | '8' | 'DEFAULT', string>
+  boxShadow: Record<'sm' | 'DEFAULT' | 'md' | 'lg' | 'xl' | '2xl' | 'inner' | 'none', string>
+  brightness: Record<
+    '0' | '50' | '75' | '90' | '95' | '100' | '105' | '110' | '125' | '150' | '200',
+    string
+  >
+  columns: Record<
+    | '1'
+    | '2'
+    | '3'
+    | '4'
+    | '5'
+    | '6'
+    | '7'
+    | '8'
+    | '9'
+    | '10'
+    | '11'
+    | '12'
+    | 'auto'
+    | '3xs'
+    | '2xs'
+    | 'xs'
+    | 'sm'
+    | 'md'
+    | 'lg'
+    | 'xl'
+    | '2xl'
+    | '3xl'
+    | '4xl'
+    | '5xl'
+    | '6xl'
+    | '7xl',
+    string
+  >
+  content: Record<'none', string>
+  contrast: Record<'0' | '50' | '75' | '100' | '125' | '150' | '200', string>
+  cursor: Record<
+    | 'auto'
+    | 'default'
+    | 'pointer'
+    | 'wait'
+    | 'text'
+    | 'move'
+    | 'help'
+    | 'not-allowed'
+    | 'none'
+    | 'context-menu'
+    | 'progress'
+    | 'cell'
+    | 'crosshair'
+    | 'vertical-text'
+    | 'alias'
+    | 'copy'
+    | 'no-drop'
+    | 'grab'
+    | 'grabbing'
+    | 'all-scroll'
+    | 'col-resize'
+    | 'row-resize'
+    | 'n-resize'
+    | 'e-resize'
+    | 's-resize'
+    | 'w-resize'
+    | 'ne-resize'
+    | 'nw-resize'
+    | 'se-resize'
+    | 'sw-resize'
+    | 'ew-resize'
+    | 'ns-resize'
+    | 'nesw-resize'
+    | 'nwse-resize'
+    | 'zoom-in'
+    | 'zoom-out',
+    string
+  >
+  dropShadow: Record<'sm' | 'DEFAULT' | 'md' | 'lg' | 'xl' | '2xl' | 'none', string | string[]>
+  flex: Record<'1' | 'auto' | 'initial' | 'none', string>
+  flexGrow: Record<'0' | 'DEFAULT', string>
+  flexShrink: Record<'0' | 'DEFAULT', string>
+  fontFamily: Record<'sans' | 'serif' | 'mono', string[]>
+  fontSize: Record<
+    | 'xs'
+    | 'sm'
+    | 'base'
+    | 'lg'
+    | 'xl'
+    | '2xl'
+    | '3xl'
+    | '4xl'
+    | '5xl'
+    | '6xl'
+    | '7xl'
+    | '8xl'
+    | '9xl',
+    [string, { lineHeight: string }]
+  >
+  fontWeight: Record<
+    | 'thin'
+    | 'extralight'
+    | 'light'
+    | 'normal'
+    | 'medium'
+    | 'semibold'
+    | 'bold'
+    | 'extrabold'
+    | 'black',
+    string
+  >
+  grayscale: Record<'0' | 'DEFAULT', string>
+  gridAutoColumns: Record<'auto' | 'min' | 'max' | 'fr', string>
+  gridAutoRows: Record<'auto' | 'min' | 'max' | 'fr', string>
+  gridColumn: Record<
+    | 'auto'
+    | 'span-1'
+    | 'span-2'
+    | 'span-3'
+    | 'span-4'
+    | 'span-5'
+    | 'span-6'
+    | 'span-7'
+    | 'span-8'
+    | 'span-9'
+    | 'span-10'
+    | 'span-11'
+    | 'span-12'
+    | 'span-full',
+    string
+  >
+  gridColumnEnd: Record<
+    '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '13' | 'auto',
+    string
+  >
+  gridColumnStart: Record<
+    '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '13' | 'auto',
+    string
+  >
+  gridRow: Record<
+    'auto' | 'span-1' | 'span-2' | 'span-3' | 'span-4' | 'span-5' | 'span-6' | 'span-full',
+    string
+  >
+  gridRowEnd: Record<'1' | '2' | '3' | '4' | '5' | '6' | '7' | 'auto', string>
+  gridRowStart: Record<'1' | '2' | '3' | '4' | '5' | '6' | '7' | 'auto', string>
+  gridTemplateColumns: Record<
+    '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | 'none',
+    string
+  >
+  gridTemplateRows: Record<'1' | '2' | '3' | '4' | '5' | '6' | 'none', string>
+  hueRotate: Record<'0' | '15' | '30' | '60' | '90' | '180', string>
+  invert: Record<'0' | 'DEFAULT', string>
+  keyframes: Record<'spin' | 'ping' | 'pulse' | 'bounce', Record<string, CSSDeclarationList>>
+  letterSpacing: Record<'tighter' | 'tight' | 'normal' | 'wide' | 'wider' | 'widest', string>
+  lineHeight: Record<
+    | '3'
+    | '4'
+    | '5'
+    | '6'
+    | '7'
+    | '8'
+    | '9'
+    | '10'
+    | 'none'
+    | 'tight'
+    | 'snug'
+    | 'normal'
+    | 'relaxed'
+    | 'loose',
+    string
+  >
+  listStyleType: Record<'none' | 'disc' | 'decimal', string>
+  minHeight: Record<'0' | 'full' | 'screen' | 'min' | 'max' | 'fit', string>
+  minWidth: Record<'0' | 'full' | 'min' | 'max' | 'fit', string>
+  objectPosition: Record<
+    | 'bottom'
+    | 'center'
+    | 'left'
+    | 'left-bottom'
+    | 'left-top'
+    | 'right'
+    | 'right-bottom'
+    | 'right-top'
+    | 'top',
+    string
+  >
+  opacity: Record<
+    | '0'
+    | '5'
+    | '10'
+    | '20'
+    | '25'
+    | '30'
+    | '40'
+    | '50'
+    | '60'
+    | '70'
+    | '75'
+    | '80'
+    | '90'
+    | '95'
+    | '100',
+    string
+  >
+  order: Record<
+    | '1'
+    | '2'
+    | '3'
+    | '4'
+    | '5'
+    | '6'
+    | '7'
+    | '8'
+    | '9'
+    | '10'
+    | '11'
+    | '12'
+    | 'first'
+    | 'last'
+    | 'none',
+    string
+  >
+  outlineOffset: Record<'0' | '1' | '2' | '4' | '8', string>
+  outlineWidth: Record<'0' | '1' | '2' | '4' | '8', string>
+  ringOffsetWidth: Record<'0' | '1' | '2' | '4' | '8', string>
+  ringWidth: Record<'0' | '1' | '2' | '4' | '8' | 'DEFAULT', string>
+  rotate: Record<'0' | '1' | '2' | '3' | '6' | '12' | '45' | '90' | '180', string>
+  saturate: Record<'0' | '50' | '100' | '150' | '200', string>
+  scale: Record<'0' | '50' | '75' | '90' | '95' | '100' | '105' | '110' | '125' | '150', string>
+  screens: Record<'sm' | 'md' | 'lg' | 'xl' | '2xl', string>
+  sepia: Record<'0' | 'DEFAULT', string>
+  skew: Record<'0' | '1' | '2' | '3' | '6' | '12', string>
+  spacing: Record<
+    | '0'
+    | '1'
+    | '2'
+    | '3'
+    | '4'
+    | '5'
+    | '6'
+    | '7'
+    | '8'
+    | '9'
+    | '10'
+    | '11'
+    | '12'
+    | '14'
+    | '16'
+    | '20'
+    | '24'
+    | '28'
+    | '32'
+    | '36'
+    | '40'
+    | '44'
+    | '48'
+    | '52'
+    | '56'
+    | '60'
+    | '64'
+    | '72'
+    | '80'
+    | '96'
+    | 'px'
+    | '0.5'
+    | '1.5'
+    | '2.5'
+    | '3.5',
+    string
+  >
+  strokeWidth: Record<'0' | '1' | '2', string>
+  textDecorationThickness: Record<'0' | '1' | '2' | '4' | '8' | 'auto' | 'from-font', string>
+  textUnderlineOffset: Record<'0' | '1' | '2' | '4' | '8' | 'auto', string>
+  transformOrigin: Record<
+    | 'center'
+    | 'top'
+    | 'top-right'
+    | 'right'
+    | 'bottom-right'
+    | 'bottom'
+    | 'bottom-left'
+    | 'left'
+    | 'top-left',
+    string
+  >
+  transitionDelay: Record<'75' | '100' | '150' | '200' | '300' | '500' | '700' | '1000', string>
+  transitionDuration: Record<
+    '75' | '100' | '150' | '200' | '300' | '500' | '700' | '1000' | 'DEFAULT',
+    string
+  >
+  transitionProperty: Record<
+    'none' | 'all' | 'DEFAULT' | 'colors' | 'opacity' | 'shadow' | 'transform',
+    string
+  >
+  transitionTimingFunction: Record<'DEFAULT' | 'linear' | 'in' | 'out' | 'in-out', string>
+  willChange: Record<'auto' | 'scroll' | 'contents' | 'transform', string>
+  zIndex: Record<'0' | '10' | '20' | '30' | '40' | '50' | 'auto', string>
+}

package/types/index.d.ts

@@ -1 +1,7 @@
-declare namespace tailwindcss {}
+import { PluginCreator } from 'postcss'
+import type { Config } from './config.d'
+
+declare const plugin: PluginCreator<string | Config | { config: string | Config }>
+
+export { Config }
+export default plugin

package/types.d.ts

@@ -1 +0,0 @@
-export type { Config } from './types/config'