@pandacss/types 0.41.0 → 0.43.0

package/dist/analyze-report.d.ts

@@ -1,45 +1,71 @@
-import type { BoxNodeEmptyInitializer, BoxNodeLiteral, BoxNodeMap } from '@pandacss/extractor'
 import type { Config } from './config'
 
-export type ReportItemType = 'object' | 'cva' | 'pattern' | 'recipe' | 'jsx' | 'jsx-factory'
-export interface ReportItem {
-  id: number
-  from: string
-  type: ReportItemType
-  filepath: string
-  kind: 'function' | 'component'
+export type ReportItemType =
+  | 'css'
+  | 'cva'
+  | 'sva'
+  | 'pattern'
+  | 'recipe'
+  | 'jsx-factory'
+  | 'jsx-pattern'
+  | 'jsx-recipe'
+  | 'jsx'
+
+type ComponentKind = 'component' | 'function'
+
+type Range = {
+  startPosition: number
+  startLineNumber: number
+  startColumn: number
+  endPosition: number
+  endLineNumber: number
+  endColumn: number
+}
+
+export interface PropertyReportItem {
+  index: string
+  componentIndex: ComponentReportItem['componentIndex']
+  componentName: ComponentReportItem['componentName']
+  reportItemKind: 'token' | 'utility'
+
   path: string[]
-  propName: string
   conditionName?: string | undefined
-  value: string | number | true
-  category: string
-  isKnown: boolean
-  box: BoxNodeLiteral | BoxNodeEmptyInitializer
+  propName: string
+  value: string | number | boolean
+
+  tokenType?: string
+  isKnownValue: boolean
+
+  range: Range
+  filepath: string
 }
 
 /**
- * An instance is either a component usage or a function usage
- * @example an instance name could be 'Button', 'css', 'panda.div', 'vstack', ...
+ * An component is either a component usage or a function usage
+ * @example an component name could be 'Button', 'css', 'panda.div', 'vstack', ...
  */
-export interface ReportInstanceItem extends Pick<ReportItem, 'from' | 'type' | 'kind' | 'filepath'> {
-  instanceId: number
-  contains: Array<ReportItem['id']>
+export interface ComponentReportItem extends Pick<PropertyReportItem, 'filepath'> {
+  componentIndex: string
+  componentName: string
+  reportItemType: ReportItemType
+  kind: ComponentKind
+  contains: Array<PropertyReportItem['index']>
   value: Record<string, any>
-  box: BoxNodeMap
+  range: Range
 }
 
-export interface ReportMaps {
-  byInstanceOfKind: Map<'function' | 'component', Set<ReportInstanceItem['instanceId']>>
-  byPropertyName: Map<string, Set<ReportItem['id']>>
-  byCategory: Map<string, Set<ReportItem['id']>>
-  byConditionName: Map<string, Set<ReportItem['id']>>
-  byShorthand: Map<string, Set<ReportItem['id']>>
-  byTokenName: Map<string, Set<ReportItem['id']>>
-  byPropertyPath: Map<string, Set<ReportItem['id']>>
-  fromKind: Map<'function' | 'component', Set<ReportItem['id']>>
-  byType: Map<string, Set<ReportItem['id']>>
-  byInstanceName: Map<string, Set<ReportItem['id']>>
-  colorsUsed: Map<string, Set<ReportItem['id']>>
+export interface ReportDerivedMaps {
+  byComponentOfKind: Map<ComponentKind, Set<ComponentReportItem['componentIndex']>>
+  byPropertyName: Map<string, Set<PropertyReportItem['index']>>
+  byTokenType: Map<string, Set<PropertyReportItem['index']>>
+  byConditionName: Map<string, Set<PropertyReportItem['index']>>
+  byShorthand: Map<string, Set<PropertyReportItem['index']>>
+  byTokenName: Map<string, Set<PropertyReportItem['index']>>
+  byPropertyPath: Map<string, Set<PropertyReportItem['index']>>
+  fromKind: Map<ComponentKind, Set<PropertyReportItem['index']>>
+  byType: Map<string, Set<PropertyReportItem['index']>>
+  byComponentName: Map<string, Set<PropertyReportItem['index']>>
+  colorsUsed: Map<string, Set<PropertyReportItem['index']>>
 }
 
 export interface ReportCounts {
@@ -49,9 +75,9 @@ export interface ReportCounts {
   shorthandUsed: number
   propertyPathUsed: number
   typeUsed: number
-  instanceNameUsed: number
+  componentNameUsed: number
   kindUsed: number
-  instanceOfKindUsed: number
+  componentOfKindUsed: number
   colorsUsed: number
 }
 
@@ -60,8 +86,7 @@ export interface MostUsedItem {
   count: number
 }
 export interface ReportStats {
-  filesWithMostInstance: Record<string, number>
-  filesWithMostPropValueCombinations: Record<string, number>
+  filesWithMostComponent: Record<string, number>
   mostUseds: {
     propNames: Array<MostUsedItem>
     tokens: Array<MostUsedItem>
@@ -70,9 +95,9 @@ export interface ReportStats {
     conditions: Array<MostUsedItem>
     propertyPaths: Array<MostUsedItem>
     types: Array<MostUsedItem>
-    instanceNames: Array<MostUsedItem>
+    componentNames: Array<MostUsedItem>
     fromKinds: Array<MostUsedItem>
-    instanceOfKinds: Array<MostUsedItem>
+    componentOfKinds: Array<MostUsedItem>
     colors: Array<MostUsedItem>
   }
 }
@@ -80,13 +105,15 @@ export interface ReportStats {
 export interface ReportDetails {
   counts: ReportCounts
   stats: ReportStats
-  details: {
-    byId: Map<ReportItem['id'], ReportItem>
-    byInstanceId: Map<ReportInstanceItem['instanceId'], ReportInstanceItem>
-    byFilepath: Map<string, Set<ReportItem['id']>>
-    byInstanceInFilepath: Map<string, Set<ReportInstanceItem['instanceId']>>
-    globalMaps: ReportMaps
-    byFilePathMaps: Map<string, ReportMaps>
+  fileSizes: FileSizes
+  duration: {
+    classify: number
+    cssMs: number
+    cssMinifyMs: number
+    extractTotal: number
+    extractTimeByFiles: Record<string, number>
+    lightningCssMs?: number
+    lightningCssMinifiedMs?: number
   }
 }
 
@@ -97,83 +124,50 @@ interface FileSizes {
     normal: string
     minified: string
   }
+  lightningCss?: {
+    normal: string
+    minified: string
+  }
 }
 
-export interface AnalysisReport extends ReportDetails {
-  fileSizes: FileSizes
-}
+export interface ReportSnapshot {
+  schemaVersion: string
+  details: ReportDetails
+  config: Omit<Config, 'globalCss' | 'globalFontface'>
 
-interface ReportMapsJSON {
-  byInstanceOfKind: Record<'function' | 'component', Array<ReportInstanceItem['instanceId']>>
-  byPropertyName: Record<string, Array<ReportItem['id']>>
-  byCategory: Record<string, Array<ReportItem['id']>>
-  byConditionName: Record<string, Array<ReportItem['id']>>
-  byShorthand: Record<string, Array<ReportItem['id']>>
-  byTokenName: Record<string, Array<ReportItem['id']>>
-  byPropertyPath: Record<string, Array<ReportItem['id']>>
-  fromKind: Record<'function' | 'component', Array<ReportItem['id']>>
-  byType: Record<string, Array<ReportItem['id']>>
-  byInstanceName: Record<string, Array<ReportItem['id']>>
-  colorsUsed: Record<string, Array<ReportItem['id']>>
-}
+  propByIndex: Map<PropertyReportItem['index'], PropertyReportItem>
+  componentByIndex: Map<ComponentReportItem['componentIndex'], ComponentReportItem>
 
-export interface ReportItemJSON {
-  id: number
-  from: string
-  type: ReportItemType
-  filepath: string
-  kind: 'function' | 'component'
-  path: string[]
-  propName: string
-  conditionName?: string | undefined
-  value: string | number | true
-  category: string
-  isKnown: boolean
-  box: {
-    type: 'literal' | 'empty-initializer'
-    value: string | number | boolean | undefined | null
-    node: string
-    stack: string[]
-    line: number
-    column: number
+  derived: {
+    byFilepath: Map<string, Set<PropertyReportItem['index']>>
+    byComponentInFilepath: Map<string, Set<ComponentReportItem['componentIndex']>>
+    globalMaps: ReportDerivedMaps
+    byFilePathMaps: Map<string, ReportDerivedMaps>
   }
 }
 
-export interface ReportInstanceItemJSON extends Pick<ReportItem, 'from' | 'type' | 'kind' | 'filepath'> {
-  instanceId: number
-  contains: Array<ReportItem['id']>
-  value: Record<string, any>
-  box: { type: 'map'; value: Record<string, any>; node: string; stack: string[]; line: number; column: number }
+interface ReportDerivedMapsJSON {
+  byComponentOfKind: Record<ComponentKind, Array<ComponentReportItem['componentIndex']>>
+  byPropertyName: Record<string, Array<PropertyReportItem['index']>>
+  byTokenType: Record<string, Array<PropertyReportItem['index']>>
+  byConditionName: Record<string, Array<PropertyReportItem['index']>>
+  byShorthand: Record<string, Array<PropertyReportItem['index']>>
+  byTokenName: Record<string, Array<PropertyReportItem['index']>>
+  byPropertyPath: Record<string, Array<PropertyReportItem['index']>>
+  fromKind: Record<ComponentKind, Array<PropertyReportItem['index']>>
+  byType: Record<string, Array<PropertyReportItem['index']>>
+  byComponentName: Record<string, Array<PropertyReportItem['index']>>
+  colorsUsed: Record<string, Array<PropertyReportItem['index']>>
 }
 
-export interface AnalysisReportJSON {
-  counts: ReportCounts
-  stats: ReportStats
-  details: {
-    byId: Record<ReportItemJSON['id'], ReportItemJSON>
-    byInstanceId: Record<ReportInstanceItemJSON['instanceId'], ReportInstanceItemJSON>
-    byFilepath: Record<string, Array<ReportItemJSON['id']>>
-    byInstanceInFilepath: Record<string, Array<ReportInstanceItemJSON['instanceId']>>
-    globalMaps: ReportMapsJSON
-    byFilePathMaps: Record<string, ReportMapsJSON>
-  }
-  fileSizes: FileSizes
-  cwd: Config['cwd']
-  theme: Config['theme']
-  utilities: Config['utilities']
-  conditions: Config['conditions']
-  shorthands: Record<string, string>
-  // Generator["parserOptions""]
-  parserOptions: {
-    importMap: {
-      css: string
-      recipe: string
-      pattern: string
-      jsx: string
-    }
-    jsx: {
-      factory: string
-      nodes: Array<{ type: 'string'; name: string; props: string[]; baseName: string }>
-    }
+export interface ReportSnapshotJSON extends Omit<ReportSnapshot, 'propByIndex' | 'componentByIndex' | 'derived'> {
+  propByIndex: Record<PropertyReportItem['index'], PropertyReportItem>
+  componentByIndex: Record<ComponentReportItem['componentIndex'], ComponentReportItem>
+
+  derived: {
+    byFilepath: Record<string, Array<PropertyReportItem['index']>>
+    byComponentInFilepath: Record<string, Array<ComponentReportItem['componentIndex']>>
+    globalMaps: ReportDerivedMapsJSON
+    byFilePathMaps: Record<string, ReportDerivedMapsJSON>
   }
 }

package/dist/config.d.ts

@@ -4,7 +4,12 @@ import type { PandaHooks } from './hooks'
 import type { PatternConfig } from './pattern'
 import type { Keys, LiteralUnion, PathIn, RequiredBy } from './shared'
 import type { StaticCssOptions } from './static-css'
-import type { ExtendableGlobalStyleObject, GlobalStyleObject } from './system-types'
+import type {
+  ExtendableGlobalFontface,
+  ExtendableGlobalStyleObject,
+  GlobalFontface,
+  GlobalStyleObject,
+} from './system-types'
 import type { ExtendableTheme, Theme } from './theme'
 import type { ExtendableUtilityConfig, UtilityConfig } from './utility'
 
@@ -52,6 +57,10 @@ export interface PresetCore {
    * The global styles for your project.
    */
   globalCss: GlobalStyleObject
+  /**
+   * The global fontface for your project.
+   */
+  globalFontface?: GlobalFontface
   /**
    * Used to generate css utility classes for your project.
    */
@@ -147,6 +156,10 @@ export interface ExtendableOptions {
    * The global styles for your project.
    */
   globalCss?: ExtendableGlobalStyleObject
+  /**
+   * The global fontface for your project.
+   */
+  globalFontface?: ExtendableGlobalFontface
   /**
    * Used to generate css utility classes for your project.
    */
@@ -311,11 +324,6 @@ interface CssgenOptions {
    * @default '_'
    */
   separator?: '_' | '=' | '-'
-  /**
-   * Whether to optimize the generated css.
-   * @default true
-   */
-  optimize?: boolean
   /**
    * Whether to minify the generated css.
    * @default false
@@ -355,22 +363,6 @@ interface CssgenOptions {
 }
 
 interface CodegenOptions {
-  /**
-   * Whether to emit the artifacts to `node_modules` as a package.
-   * @default false
-   * @deprecated `emitPackage` is deprecated, it's known for causing several issues:
-   * - bundlers sometimes eagerly cache the `node_modules`, leading to `panda codegen` updates to the `styled-system` not visible in the browser
-   * - auto-imports are not suggested in your IDE.
-   * - in some IDE the typings are not always reflected properly
-   *
-   * As alternatives, you can use:
-   * - relative paths instead of absolute paths (e.g. `../styled-system/css` instead of `styled-system/css`)
-   * - use package.json #imports and/or tsconfig path aliases (prefer package.json#imports when possible, TS 5.4 supports them by default) like `#styled-system/css` instead of `styled-system/css`
-   * @see https://nodejs.org/api/packages.html#subpath-imports
-   * - for a component library, use a dedicated workspace package (e.g. `@acme/styled-system`) and use `importMap: "@acme/styled-system"` so that Panda knows which entrypoint to extract, e.g. `import { css } from '@acme/styled-system/css'`
-   * @see https://panda-css.com/docs/guides/component-library
-   */
-  emitPackage?: boolean
   /**
    * Whether to only emit the `tokens` directory
    * @default false

package/dist/system-types.d.ts

@@ -1,5 +1,5 @@
 import type { ConditionalValue, Nested } from './conditions'
-import type { PropertiesFallback } from './csstype'
+import type { AtRule, PropertiesFallback } from './csstype'
 import type { SystemProperties, CssVarProperties } from './style-props'
 
 type String = string & {}
@@ -55,12 +55,33 @@ export interface ExtendableGlobalStyleObject {
   extend?: GlobalStyleObject | undefined
 }
 
+/* -----------------------------------------------------------------------------
+ * Composition (text styles, layer styles)
+ * -----------------------------------------------------------------------------*/
+
 type FilterStyleObject<P extends string> = {
   [K in P]?: K extends keyof SystemStyleObject ? SystemStyleObject[K] : unknown
 }
 
 export type CompositionStyleObject<Property extends string> = Nested<FilterStyleObject<Property> & CssVarProperties>
 
+/* -----------------------------------------------------------------------------
+ * Font face
+ * -----------------------------------------------------------------------------*/
+
+export type GlobalFontfaceRule = Omit<AtRule.FontFaceFallback, 'src'> & Required<Pick<AtRule.FontFaceFallback, 'src'>>
+
+export type FontfaceRule = Omit<GlobalFontfaceRule, 'fontFamily'>
+
+export interface GlobalFontface {
+  [name: string]: FontfaceRule | FontfaceRule[]
+}
+
+export interface ExtendableGlobalFontface {
+  [name: string]: FontfaceRule | FontfaceRule[] | GlobalFontface | undefined
+  extend?: GlobalFontface | undefined
+}
+
 /* -----------------------------------------------------------------------------
  * Jsx style props
  * -----------------------------------------------------------------------------*/

package/dist/utility.d.ts

@@ -71,33 +71,34 @@ export interface PropertyConfig {
 }
 
 export type CssSemanticGroup =
-  | 'System'
+  | 'Animation'
+  | 'Background Gradient'
+  | 'Background'
+  | 'Border Radius'
+  | 'Border'
+  | 'Color'
   | 'Container'
   | 'Display'
-  | 'Visibility'
-  | 'Position'
-  | 'Transform'
+  | 'Effect'
   | 'Flex Layout'
   | 'Grid Layout'
-  | 'Layout'
-  | 'Border'
-  | 'Border Radius'
-  | 'Width'
   | 'Height'
+  | 'Interactivity'
+  | 'Layout'
+  | 'List'
   | 'Margin'
+  | 'Other'
   | 'Padding'
-  | 'Color'
-  | 'Typography'
-  | 'Background'
-  | 'Background Gradient'
+  | 'Position'
+  | 'Scroll'
   | 'Shadow'
+  | 'System'
   | 'Table'
-  | 'List'
-  | 'Scroll'
-  | 'Interactivity'
+  | 'Transform'
   | 'Transition'
-  | 'Effect'
-  | 'Other'
+  | 'Typography'
+  | 'Visibility'
+  | 'Width'
 
 export type UtilityConfig = {
   [property in LiteralUnion<CssProperty>]?: PropertyConfig

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/types",
-  "version": "0.41.0",
+  "version": "0.43.0",
   "description": "The types for css panda",
   "main": "dist/index.d.ts",
   "author": "Segun Adebayo <joseshegs@gmail.com>",
@@ -31,7 +31,7 @@
     "ncp": "2.0.0",
     "pkg-types": "1.0.3",
     "ts-morph": "21.0.1",
-    "@pandacss/extractor": "0.41.0"
+    "@pandacss/extractor": "0.43.0"
   },
   "scripts": {
     "dev": "tsx scripts/watch.ts",