@pandacss/node 0.0.0-dev-20221121152823

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Segun Adebayo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,208 @@
+## Folder structure
+
+- `.panda`
+  - `tokens` (index.js, index.d.ts, index.css)
+  - `styled-system` (index.js, index.d.ts)
+  - `package.json`
+
+```js
+const tokens = {
+  'colors.red.400': { value: '...', variable: '...' },
+}
+
+const tokenMap = {
+  colors: [{ group: 'red', key: 'red.400', value: '...' }],
+  fonts: [],
+}
+
+function getToken(path) {
+  const { value } = tokens[path] || {}
+  return value
+}
+
+function getTokenVar(path) {
+  const { variable } = tokens[path] || {}
+  return variable
+}
+```
+
+```js
+import { generateCssVar, generateDts, generateJs } from '@pandacss/generator'
+import { createTokenMap } from '@pandacss/token-dictionary'
+
+const conf = new Conf()
+
+const dict = createTokenMap(config)
+
+const cssVars = generateCssVar(dict, { root: ':root' })
+const dts = generateDts(dict)
+const files = generateJs(dict, { formats: ['esm', 'cjs'] })
+```
+
+```json
+{
+  "name": "dot-panda",
+  "description": "...",
+  "exports": {
+    "./tokens": {
+      "import": "./generated/tokens/index.mjs"
+    },
+    "./css": {
+      "import": "./generated/css/index.mjs"
+    }
+  },
+  "typeVersions": {
+    "*": {
+      "tokens": ["./generated/tokens"],
+      "css": ["./generated/css"]
+    }
+  }
+}
+```
+
+```js
+import { definePackage, writePackage } from '@pandacss/generators'
+
+const pkg = setupPackage({
+  name: 'dot-panda',
+  description: '...',
+  dir: 'generated',
+  exports: ['tokens', 'css'],
+})
+
+writePackage(pkg)
+
+updateTsConfig({
+  compilerOptions: {
+    paths: {
+      'design-system': ['./.panda'],
+    },
+  },
+})
+
+updateGitIgnore({ comment: '# Panda', path: '.css-panda' })
+```
+
+```ts
+type ConditionType =
+  | 'color-scheme'
+  | 'resolution'
+  | 'writing-mode'
+  | 'pseudo'
+  | 'selector'
+  | 'viewport'
+  | 'interaction-media'
+  | 'reduced-motion'
+  | 'reduced-data'
+  | 'reduced-transparent'
+  | 'contrast'
+
+const conditions = {
+  dark: {
+    type: 'color-scheme',
+    value: '[data-theme=dark]',
+    colorScheme: 'dark',
+  },
+  darkDimmed: {
+    type: 'color-scheme',
+    value: '[data-theme=dark_dimmed]',
+    colorScheme: 'dark',
+  },
+  ltr: {
+    type: 'dir',
+    value: '[dir=rtl]',
+  },
+  rtl: {
+    type: 'dir',
+    value: '[dir=rtl]',
+  },
+  hover: {
+    type: 'pseudo',
+    value: '&:hover',
+  },
+  focus: {
+    type: 'pseudo',
+    value: '&:focus',
+  },
+  sm: {
+    type: 'viewport',
+    value: '@media (min-width: 480px)',
+  },
+}
+```
+
+```ts
+const defaults = {
+  className: ({ prop, value }) => `${prop}-${esc(value)}`,
+}
+
+const tt = defineConfig({
+  utilities: [
+    {
+      properties: {
+        display: {
+          className: ({ value }) => `d-${value}`,
+          transform(value) {
+            return { display: value }
+          },
+          values: {
+            fl: 'flex',
+            ib: 'inline-block',
+          },
+        },
+        background: {
+          className: ({ prop, value }) => `bg-${value}`,
+          values: ({ tokens }) => ({
+            ...tokens.colors,
+            inherit: 'inherit',
+          }),
+        },
+        color: {
+          className: ({ prop, value }) => `text-${value}`,
+          values: (tokens) => ({ ...tokens.colors }),
+        },
+        fill: { values: 'colors' },
+        lineClamp: {
+          className: ({ prop, value }) => `clamp-${value}`,
+          values: {
+            '1': {
+              '--line-clamp': '1',
+            },
+          },
+        },
+      },
+      shorthands: {
+        bg: 'background',
+      },
+    },
+
+    {
+      properties: {
+        strokeWidth: {
+          values: { '1': '1px', 2: '2px' },
+        },
+      },
+    },
+
+    {
+      properties: {
+        paddingLeft: { values: 'space', className: 'pl' },
+        paddingRight: { values: 'space', className: 'pr' },
+        paddingX: {
+          className: 'px',
+          values({ theme, map }) {
+            return map(theme.space, (value) => ({
+              paddingLeft: value,
+              paddingRight: value,
+            }))
+          },
+        },
+      },
+      shorthands: {
+        pl: 'paddingLeft',
+        px: 'paddingX',
+      },
+    },
+  ],
+})
+```

package/dist/index.d.ts

@@ -0,0 +1,395 @@
+import * as _pandacss_core from '@pandacss/core';
+import { StylesheetContext, Conditions, Utility } from '@pandacss/core';
+export { discardDuplicate } from '@pandacss/core';
+import * as _pandacss_types_src_generator from '@pandacss/types/src/generator';
+import * as ts_morph from 'ts-morph';
+import * as _pandacss_types from '@pandacss/types';
+import { RecipeConfig, Config } from '@pandacss/types';
+import * as _pandacss_ast from '@pandacss/ast';
+import { Collector } from '@pandacss/ast';
+import * as _pandacss_config from '@pandacss/config';
+import { LoadConfigResult } from '@pandacss/config';
+import * as _pandacss_shared from '@pandacss/shared';
+import { mapObject } from '@pandacss/shared';
+import * as _pandacss_token_dictionary from '@pandacss/token-dictionary';
+import { TokenDictionary } from '@pandacss/token-dictionary';
+import { Root, Message } from 'postcss';
+
+declare type IO = {
+    read(id: string): Promise<string>;
+    write(id: string, content: string): Promise<void>;
+    rm(id: string): Promise<void>;
+};
+declare type Output = {
+    dir?: string;
+    files: Array<{
+        file: string;
+        code: string | undefined;
+    }>;
+};
+declare function createContext(conf: LoadConfigResult, io?: IO): {
+    config: _pandacss_types.UserConfig;
+    configPath: string;
+    cwd: string;
+    conf: LoadConfigResult;
+    chunks: {
+        dir: string;
+        readFile(file: string): Promise<string>;
+        getFiles(): string[];
+        format(file: string): string;
+        write(file: string, css: string): Promise<void[]>;
+        rm(file: string): Promise<void>;
+        glob: string[];
+    };
+    files: string[];
+    helpers: {
+        map: typeof mapObject;
+    };
+    context: () => StylesheetContext;
+    exclude: string[];
+    conditions: Conditions;
+    importMap: {
+        css: string;
+        recipe: string;
+        pattern: string;
+        jsx: string;
+    };
+    reloadSourceFiles(): void;
+    getSourceFile(file: string): ts_morph.SourceFile | undefined;
+    addSourceFile(file: string): ts_morph.SourceFile;
+    removeSourceFile(file: string): boolean | undefined;
+    parseSourceFile: (sourceFile: ts_morph.SourceFile | undefined) => Collector | undefined;
+    getPath: (str: string) => string;
+    paths: {
+        config: string;
+        css: string;
+        token: string;
+        types: string;
+        recipe: string;
+        pattern: string;
+        chunk: string;
+        outCss: string;
+        jsx: string;
+    };
+    write: (dir: string, options: Array<{
+        file: string;
+        code: string | undefined;
+    }>) => Promise<void[]>;
+    writeOutput: (output: Output) => Promise<void[]>;
+    cleanOutdir: () => Promise<void>;
+    tokens: TokenDictionary;
+    hasTokens: boolean;
+    utility: Utility;
+    collectStyles: (collector: Collector, file: string) => {
+        css: string;
+        file: string;
+    } | undefined;
+    patterns: Record<string, _pandacss_types.PatternConfig>;
+    hasPattern: boolean;
+    getPattern: (name: string) => _pandacss_types.PatternConfig;
+    execPattern: (name: string, data: Record<string, any>) => _pandacss_types.ConditionCssProperties<{
+        [x: string]: string;
+    }, {
+        __type?: "never" | undefined;
+    }, false>;
+    patternNodes: {
+        name: string;
+        props: string[];
+        baseName: string;
+    }[];
+    getPatternFnName: (jsx: string) => string;
+    recipes: Record<string, RecipeConfig<_pandacss_types.TRecipe>>;
+    getRecipe: (name: string) => RecipeConfig;
+    hasRecipes: boolean;
+    jsxFramework: "react" | "solid" | "preact" | undefined;
+    jsxFactory: string;
+    cssVarRoot: string;
+    properties: string[];
+    isProperty: (prop: string) => boolean;
+    extract: (fn: (file: string) => Promise<{
+        css: string;
+        file: string;
+    } | undefined>) => Promise<({
+        css: string;
+        file: string;
+    } | undefined)[]>;
+    hash?: boolean | undefined;
+    semanticTokens?: _pandacss_types.SemanticTokens<string | number> | undefined;
+    separator?: "-" | "_" | "=" | undefined;
+    breakpoints?: _pandacss_types.Dict<any> | undefined;
+    keyframes?: _pandacss_types.Keyframes | undefined;
+    minify?: boolean | undefined;
+    utilities?: _pandacss_types.UtilityConfig | undefined;
+    globalCss?: any;
+    logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
+    presets?: string[] | undefined;
+    preflight?: boolean | undefined;
+    clean?: boolean | undefined;
+    cssVar?: {
+        prefix?: string | undefined;
+        root?: string | undefined;
+    } | undefined;
+    watch?: boolean | undefined;
+    poll?: boolean | undefined;
+    textStyles?: _pandacss_types.TextStyles<_pandacss_types.TCondition> | undefined;
+    layerStyles?: _pandacss_types.LayerStyles<_pandacss_types.TCondition> | undefined;
+    strictTokens?: boolean | undefined;
+    generator?: _pandacss_types_src_generator.ClassGeneratorOptions | undefined;
+    include: string[];
+    outdir: string;
+};
+declare type PandaContext = ReturnType<typeof createContext>;
+
+declare function emitArtifacts(ctx: PandaContext): Promise<string>;
+declare function emitAndExtract(ctx: PandaContext): Promise<void>;
+
+declare class Builder {
+    fileModifiedMap: Map<string, number>;
+    fileMap: Map<string, string>;
+    context: PandaContext | undefined;
+    configChanged: boolean;
+    updateFile(file: string, css: string): void;
+    setup(): Promise<void>;
+    ensure(): {
+        config: _pandacss_types.UserConfig;
+        configPath: string;
+        cwd: string;
+        conf: _pandacss_config.LoadConfigResult;
+        chunks: {
+            dir: string;
+            readFile(file: string): Promise<string>;
+            getFiles(): string[];
+            format(file: string): string;
+            write(file: string, css: string): Promise<void[]>;
+            rm(file: string): Promise<void>;
+            glob: string[];
+        };
+        files: string[];
+        helpers: {
+            map: typeof _pandacss_shared.mapObject;
+        };
+        context: () => _pandacss_core.StylesheetContext;
+        exclude: string[];
+        conditions: _pandacss_core.Conditions;
+        importMap: {
+            css: string;
+            recipe: string;
+            pattern: string;
+            jsx: string;
+        };
+        reloadSourceFiles(): void;
+        getSourceFile(file: string): ts_morph.SourceFile | undefined;
+        addSourceFile(file: string): ts_morph.SourceFile;
+        removeSourceFile(file: string): boolean | undefined;
+        parseSourceFile: (sourceFile: ts_morph.SourceFile | undefined) => _pandacss_ast.Collector | undefined;
+        getPath: (str: string) => string;
+        paths: {
+            config: string;
+            css: string;
+            token: string;
+            types: string;
+            recipe: string;
+            pattern: string;
+            chunk: string;
+            outCss: string;
+            jsx: string;
+        };
+        write: (dir: string, options: {
+            file: string;
+            code: string | undefined;
+        }[]) => Promise<void[]>;
+        writeOutput: (output: Output) => Promise<void[]>;
+        cleanOutdir: () => Promise<void>;
+        tokens: _pandacss_token_dictionary.TokenDictionary;
+        hasTokens: boolean;
+        utility: _pandacss_core.Utility;
+        collectStyles: (collector: _pandacss_ast.Collector, file: string) => {
+            css: string;
+            file: string;
+        } | undefined;
+        patterns: Record<string, _pandacss_types.PatternConfig>;
+        hasPattern: boolean;
+        getPattern: (name: string) => _pandacss_types.PatternConfig;
+        execPattern: (name: string, data: Record<string, any>) => _pandacss_types.ConditionCssProperties<{
+            [x: string]: string;
+        }, {
+            __type?: "never" | undefined;
+        }, false>;
+        patternNodes: {
+            name: string;
+            props: string[];
+            baseName: string;
+        }[];
+        getPatternFnName: (jsx: string) => string;
+        recipes: Record<string, _pandacss_types.RecipeConfig<_pandacss_types.TRecipe>>;
+        getRecipe: (name: string) => _pandacss_types.RecipeConfig<_pandacss_types.TRecipe>;
+        hasRecipes: boolean;
+        jsxFramework: "react" | "solid" | "preact" | undefined;
+        jsxFactory: string;
+        cssVarRoot: string;
+        properties: string[];
+        isProperty: (prop: string) => boolean;
+        extract: (fn: (file: string) => Promise<{
+            css: string;
+            file: string;
+        } | undefined>) => Promise<({
+            css: string;
+            file: string;
+        } | undefined)[]>;
+        hash?: boolean | undefined;
+        semanticTokens?: _pandacss_types.SemanticTokens<string | number> | undefined;
+        separator?: "-" | "_" | "=" | undefined;
+        breakpoints?: _pandacss_types.Dict<any> | undefined;
+        keyframes?: _pandacss_types.Keyframes | undefined;
+        minify?: boolean | undefined;
+        utilities?: _pandacss_types.UtilityConfig | undefined;
+        globalCss?: any;
+        logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
+        presets?: string[] | undefined;
+        preflight?: boolean | undefined;
+        clean?: boolean | undefined;
+        cssVar?: {
+            prefix?: string | undefined;
+            root?: string | undefined;
+        } | undefined;
+        watch?: boolean | undefined;
+        poll?: boolean | undefined;
+        textStyles?: _pandacss_types.TextStyles<_pandacss_types.TCondition> | undefined;
+        layerStyles?: _pandacss_types.LayerStyles<_pandacss_types.TCondition> | undefined;
+        strictTokens?: boolean | undefined;
+        generator?: _pandacss_types_src_generator.ClassGeneratorOptions | undefined;
+        include: string[];
+        outdir: string;
+    };
+    extract(): Promise<void>;
+    toString(): string;
+    write(root: Root): void;
+    registerDependency(fn: (dep: Message) => void): void;
+}
+
+declare function loadConfigAndCreateContext(options?: {
+    cwd?: string;
+    config?: Config;
+    configPath?: string;
+}): Promise<{
+    config: _pandacss_types.UserConfig;
+    configPath: string;
+    cwd: string;
+    conf: _pandacss_config.LoadConfigResult;
+    chunks: {
+        dir: string;
+        readFile(file: string): Promise<string>;
+        getFiles(): string[];
+        format(file: string): string;
+        write(file: string, css: string): Promise<void[]>;
+        rm(file: string): Promise<void>;
+        glob: string[];
+    };
+    files: string[];
+    helpers: {
+        map: typeof _pandacss_shared.mapObject;
+    };
+    context: () => _pandacss_core.StylesheetContext;
+    exclude: string[];
+    conditions: _pandacss_core.Conditions;
+    importMap: {
+        css: string;
+        recipe: string;
+        pattern: string;
+        jsx: string;
+    };
+    reloadSourceFiles(): void;
+    getSourceFile(file: string): ts_morph.SourceFile | undefined;
+    addSourceFile(file: string): ts_morph.SourceFile;
+    removeSourceFile(file: string): boolean | undefined;
+    parseSourceFile: (sourceFile: ts_morph.SourceFile | undefined) => _pandacss_ast.Collector | undefined;
+    getPath: (str: string) => string;
+    paths: {
+        config: string;
+        css: string;
+        token: string;
+        types: string;
+        recipe: string;
+        pattern: string;
+        chunk: string;
+        outCss: string;
+        jsx: string;
+    };
+    write: (dir: string, options: {
+        file: string;
+        code: string | undefined;
+    }[]) => Promise<void[]>;
+    writeOutput: (output: Output) => Promise<void[]>;
+    cleanOutdir: () => Promise<void>;
+    tokens: _pandacss_token_dictionary.TokenDictionary;
+    hasTokens: boolean;
+    utility: _pandacss_core.Utility;
+    collectStyles: (collector: _pandacss_ast.Collector, file: string) => {
+        css: string;
+        file: string;
+    } | undefined;
+    patterns: Record<string, _pandacss_types.PatternConfig>;
+    hasPattern: boolean;
+    getPattern: (name: string) => _pandacss_types.PatternConfig;
+    execPattern: (name: string, data: Record<string, any>) => _pandacss_types.ConditionCssProperties<{
+        [x: string]: string;
+    }, {
+        __type?: "never" | undefined;
+    }, false>;
+    patternNodes: {
+        name: string;
+        props: string[];
+        baseName: string;
+    }[];
+    getPatternFnName: (jsx: string) => string;
+    recipes: Record<string, _pandacss_types.RecipeConfig<_pandacss_types.TRecipe>>;
+    getRecipe: (name: string) => _pandacss_types.RecipeConfig<_pandacss_types.TRecipe>;
+    hasRecipes: boolean;
+    jsxFramework: "react" | "solid" | "preact" | undefined;
+    jsxFactory: string;
+    cssVarRoot: string;
+    properties: string[];
+    isProperty: (prop: string) => boolean;
+    extract: (fn: (file: string) => Promise<{
+        css: string;
+        file: string;
+    } | undefined>) => Promise<({
+        css: string;
+        file: string;
+    } | undefined)[]>;
+    hash?: boolean | undefined;
+    semanticTokens?: _pandacss_types.SemanticTokens<string | number> | undefined;
+    separator?: "-" | "_" | "=" | undefined;
+    breakpoints?: _pandacss_types.Dict<any> | undefined;
+    keyframes?: _pandacss_types.Keyframes | undefined;
+    minify?: boolean | undefined;
+    utilities?: _pandacss_types.UtilityConfig | undefined;
+    globalCss?: any;
+    logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
+    presets?: string[] | undefined;
+    preflight?: boolean | undefined;
+    clean?: boolean | undefined;
+    cssVar?: {
+        prefix?: string | undefined;
+        root?: string | undefined;
+    } | undefined;
+    watch?: boolean | undefined;
+    poll?: boolean | undefined;
+    textStyles?: _pandacss_types.TextStyles<_pandacss_types.TCondition> | undefined;
+    layerStyles?: _pandacss_types.LayerStyles<_pandacss_types.TCondition> | undefined;
+    strictTokens?: boolean | undefined;
+    generator?: _pandacss_types_src_generator.ClassGeneratorOptions | undefined;
+    include: string[];
+    outdir: string;
+}>;
+
+declare function execCommand(cmd: string, cwd: string): Promise<void>;
+
+declare function generate(config: Config, configPath?: string): Promise<void>;
+
+declare function setupConfig(cwd: string, { force }: {
+    force?: boolean;
+}): Promise<void>;
+declare function setupPostcss(cwd: string): Promise<void>;
+
+export { Builder, createContext, emitAndExtract, emitArtifacts, execCommand, generate, loadConfigAndCreateContext, setupConfig, setupPostcss };