@dreamy-ui/panda-preset/dist/index.js

A panda preset for Dreamy UI React component library

// src/plugin.ts
import { definePlugin } from "@pandacss/dev";

// ../../node_modules/.pnpm/chalk@5.4.1/node_modules/chalk/source/vendor/ansi-styles/index.js
var ANSI_BACKGROUND_OFFSET = 10;
var wrapAnsi16 = (offset = 0) => (code) => `\x1B[${code + offset}m`;
var wrapAnsi256 = (offset = 0) => (code) => `\x1B[${38 + offset};5;${code}m`;
var wrapAnsi16m = (offset = 0) => (red, green, blue) => `\x1B[${38 + offset};2;${red};${green};${blue}m`;
var styles = {
  modifier: {
    reset: [0, 0],
    // 21 isn't widely supported and 22 does the same thing
    bold: [1, 22],
    dim: [2, 22],
    italic: [3, 23],
    underline: [4, 24],
    overline: [53, 55],
    inverse: [7, 27],
    hidden: [8, 28],
    strikethrough: [9, 29]
  },
  color: {
    black: [30, 39],
    red: [31, 39],
    green: [32, 39],
    yellow: [33, 39],
    blue: [34, 39],
    magenta: [35, 39],
    cyan: [36, 39],
    white: [37, 39],
    // Bright color
    blackBright: [90, 39],
    gray: [90, 39],
    // Alias of `blackBright`
    grey: [90, 39],
    // Alias of `blackBright`
    redBright: [91, 39],
    greenBright: [92, 39],
    yellowBright: [93, 39],
    blueBright: [94, 39],
    magentaBright: [95, 39],
    cyanBright: [96, 39],
    whiteBright: [97, 39]
  },
  bgColor: {
    bgBlack: [40, 49],
    bgRed: [41, 49],
    bgGreen: [42, 49],
    bgYellow: [43, 49],
    bgBlue: [44, 49],
    bgMagenta: [45, 49],
    bgCyan: [46, 49],
    bgWhite: [47, 49],
    // Bright color
    bgBlackBright: [100, 49],
    bgGray: [100, 49],
    // Alias of `bgBlackBright`
    bgGrey: [100, 49],
    // Alias of `bgBlackBright`
    bgRedBright: [101, 49],
    bgGreenBright: [102, 49],
    bgYellowBright: [103, 49],
    bgBlueBright: [104, 49],
    bgMagentaBright: [105, 49],
    bgCyanBright: [106, 49],
    bgWhiteBright: [107, 49]
  }
};
var modifierNames = Object.keys(styles.modifier);
var foregroundColorNames = Object.keys(styles.color);
var backgroundColorNames = Object.keys(styles.bgColor);
var colorNames = [...foregroundColorNames, ...backgroundColorNames];
function assembleStyles() {
  const codes = /* @__PURE__ */ new Map();
  for (const [groupName, group2] of Object.entries(styles)) {
    for (const [styleName, style] of Object.entries(group2)) {
      styles[styleName] = {
        open: `\x1B[${style[0]}m`,
        close: `\x1B[${style[1]}m`
      };
      group2[styleName] = styles[styleName];
      codes.set(style[0], style[1]);
    }
    Object.defineProperty(styles, groupName, {
      value: group2,
      enumerable: false
    });
  }
  Object.defineProperty(styles, "codes", {
    value: codes,
    enumerable: false
  });
  styles.color.close = "\x1B[39m";
  styles.bgColor.close = "\x1B[49m";
  styles.color.ansi = wrapAnsi16();
  styles.color.ansi256 = wrapAnsi256();
  styles.color.ansi16m = wrapAnsi16m();
  styles.bgColor.ansi = wrapAnsi16(ANSI_BACKGROUND_OFFSET);
  styles.bgColor.ansi256 = wrapAnsi256(ANSI_BACKGROUND_OFFSET);
  styles.bgColor.ansi16m = wrapAnsi16m(ANSI_BACKGROUND_OFFSET);
  Object.defineProperties(styles, {
    rgbToAnsi256: {
      value(red, green, blue) {
        if (red === green && green === blue) {
          if (red < 8) {
            return 16;
          }
          if (red > 248) {
            return 231;
          }
          return Math.round((red - 8) / 247 * 24) + 232;
        }
        return 16 + 36 * Math.round(red / 255 * 5) + 6 * Math.round(green / 255 * 5) + Math.round(blue / 255 * 5);
      },
      enumerable: false
    },
    hexToRgb: {
      value(hex) {
        const matches = /[a-f\d]{6}|[a-f\d]{3}/i.exec(hex.toString(16));
        if (!matches) {
          return [0, 0, 0];
        }
        let [colorString] = matches;
        if (colorString.length === 3) {
          colorString = [...colorString].map((character) => character + character).join("");
        }
        const integer = Number.parseInt(colorString, 16);
        return [
          /* eslint-disable no-bitwise */
          integer >> 16 & 255,
          integer >> 8 & 255,
          integer & 255
          /* eslint-enable no-bitwise */
        ];
      },
      enumerable: false
    },
    hexToAnsi256: {
      value: (hex) => styles.rgbToAnsi256(...styles.hexToRgb(hex)),
      enumerable: false
    },
    ansi256ToAnsi: {
      value(code) {
        if (code < 8) {
          return 30 + code;
        }
        if (code < 16) {
          return 90 + (code - 8);
        }
        let red;
        let green;
        let blue;
        if (code >= 232) {
          red = ((code - 232) * 10 + 8) / 255;
          green = red;
          blue = red;
        } else {
          code -= 16;
          const remainder = code % 36;
          red = Math.floor(code / 36) / 5;
          green = Math.floor(remainder / 6) / 5;
          blue = remainder % 6 / 5;
        }
        const value = Math.max(red, green, blue) * 2;
        if (value === 0) {
          return 30;
        }
        let result = 30 + (Math.round(blue) << 2 | Math.round(green) << 1 | Math.round(red));
        if (value === 2) {
          result += 60;
        }
        return result;
      },
      enumerable: false
    },
    rgbToAnsi: {
      value: (red, green, blue) => styles.ansi256ToAnsi(styles.rgbToAnsi256(red, green, blue)),
      enumerable: false
    },
    hexToAnsi: {
      value: (hex) => styles.ansi256ToAnsi(styles.hexToAnsi256(hex)),
      enumerable: false
    }
  });
  return styles;
}
var ansiStyles = assembleStyles();
var ansi_styles_default = ansiStyles;

// ../../node_modules/.pnpm/chalk@5.4.1/node_modules/chalk/source/vendor/supports-color/index.js
import process2 from "node:process";
import os from "node:os";
import tty from "node:tty";
function hasFlag(flag, argv = globalThis.Deno ? globalThis.Deno.args : process2.argv) {
  const prefix = flag.startsWith("-") ? "" : flag.length === 1 ? "-" : "--";
  const position = argv.indexOf(prefix + flag);
  const terminatorPosition = argv.indexOf("--");
  return position !== -1 && (terminatorPosition === -1 || position < terminatorPosition);
}
var { env } = process2;
var flagForceColor;
if (hasFlag("no-color") || hasFlag("no-colors") || hasFlag("color=false") || hasFlag("color=never")) {
  flagForceColor = 0;
} else if (hasFlag("color") || hasFlag("colors") || hasFlag("color=true") || hasFlag("color=always")) {
  flagForceColor = 1;
}
function envForceColor() {
  if ("FORCE_COLOR" in env) {
    if (env.FORCE_COLOR === "true") {
      return 1;
    }
    if (env.FORCE_COLOR === "false") {
      return 0;
    }
    return env.FORCE_COLOR.length === 0 ? 1 : Math.min(Number.parseInt(env.FORCE_COLOR, 10), 3);
  }
}
function translateLevel(level) {
  if (level === 0) {
    return false;
  }
  return {
    level,
    hasBasic: true,
    has256: level >= 2,
    has16m: level >= 3
  };
}
function _supportsColor(haveStream, { streamIsTTY, sniffFlags = true } = {}) {
  const noFlagForceColor = envForceColor();
  if (noFlagForceColor !== void 0) {
    flagForceColor = noFlagForceColor;
  }
  const forceColor = sniffFlags ? flagForceColor : noFlagForceColor;
  if (forceColor === 0) {
    return 0;
  }
  if (sniffFlags) {
    if (hasFlag("color=16m") || hasFlag("color=full") || hasFlag("color=truecolor")) {
      return 3;
    }
    if (hasFlag("color=256")) {
      return 2;
    }
  }
  if ("TF_BUILD" in env && "AGENT_NAME" in env) {
    return 1;
  }
  if (haveStream && !streamIsTTY && forceColor === void 0) {
    return 0;
  }
  const min = forceColor || 0;
  if (env.TERM === "dumb") {
    return min;
  }
  if (process2.platform === "win32") {
    const osRelease = os.release().split(".");
    if (Number(osRelease[0]) >= 10 && Number(osRelease[2]) >= 10586) {
      return Number(osRelease[2]) >= 14931 ? 3 : 2;
    }
    return 1;
  }
  if ("CI" in env) {
    if (["GITHUB_ACTIONS", "GITEA_ACTIONS", "CIRCLECI"].some((key) => key in env)) {
      return 3;
    }
    if (["TRAVIS", "APPVEYOR", "GITLAB_CI", "BUILDKITE", "DRONE"].some((sign) => sign in env) || env.CI_NAME === "codeship") {
      return 1;
    }
    return min;
  }
  if ("TEAMCITY_VERSION" in env) {
    return /^(9\.(0*[1-9]\d*)\.|\d{2,}\.)/.test(env.TEAMCITY_VERSION) ? 1 : 0;
  }
  if (env.COLORTERM === "truecolor") {
    return 3;
  }
  if (env.TERM === "xterm-kitty") {
    return 3;
  }
  if ("TERM_PROGRAM" in env) {
    const version = Number.parseInt((env.TERM_PROGRAM_VERSION || "").split(".")[0], 10);
    switch (env.TERM_PROGRAM) {
      case "iTerm.app": {
        return version >= 3 ? 3 : 2;
      }
      case "Apple_Terminal": {
        return 2;
      }
    }
  }
  if (/-256(color)?$/i.test(env.TERM)) {
    return 2;
  }
  if (/^screen|^xterm|^vt100|^vt220|^rxvt|color|ansi|cygwin|linux/i.test(env.TERM)) {
    return 1;
  }
  if ("COLORTERM" in env) {
    return 1;
  }
  return min;
}
function createSupportsColor(stream, options = {}) {
  const level = _supportsColor(stream, {
    streamIsTTY: stream && stream.isTTY,
    ...options
  });
  return translateLevel(level);
}
var supportsColor = {
  stdout: createSupportsColor({ isTTY: tty.isatty(1) }),
  stderr: createSupportsColor({ isTTY: tty.isatty(2) })
};
var supports_color_default = supportsColor;

// ../../node_modules/.pnpm/chalk@5.4.1/node_modules/chalk/source/utilities.js
function stringReplaceAll(string, substring, replacer) {
  let index = string.indexOf(substring);
  if (index === -1) {
    return string;
  }
  const substringLength = substring.length;
  let endIndex = 0;
  let returnValue = "";
  do {
    returnValue += string.slice(endIndex, index) + substring + replacer;
    endIndex = index + substringLength;
    index = string.indexOf(substring, endIndex);
  } while (index !== -1);
  returnValue += string.slice(endIndex);
  return returnValue;
}
function stringEncaseCRLFWithFirstIndex(string, prefix, postfix, index) {
  let endIndex = 0;
  let returnValue = "";
  do {
    const gotCR = string[index - 1] === "\r";
    returnValue += string.slice(endIndex, gotCR ? index - 1 : index) + prefix + (gotCR ? "\r\n" : "\n") + postfix;
    endIndex = index + 1;
    index = string.indexOf("\n", endIndex);
  } while (index !== -1);
  returnValue += string.slice(endIndex);
  return returnValue;
}

// ../../node_modules/.pnpm/chalk@5.4.1/node_modules/chalk/source/index.js
var { stdout: stdoutColor, stderr: stderrColor } = supports_color_default;
var GENERATOR = Symbol("GENERATOR");
var STYLER = Symbol("STYLER");
var IS_EMPTY = Symbol("IS_EMPTY");
var levelMapping = [
  "ansi",
  "ansi",
  "ansi256",
  "ansi16m"
];
var styles2 = /* @__PURE__ */ Object.create(null);
var applyOptions = (object, options = {}) => {
  if (options.level && !(Number.isInteger(options.level) && options.level >= 0 && options.level <= 3)) {
    throw new Error("The `level` option should be an integer from 0 to 3");
  }
  const colorLevel = stdoutColor ? stdoutColor.level : 0;
  object.level = options.level === void 0 ? colorLevel : options.level;
};
var chalkFactory = (options) => {
  const chalk2 = (...strings) => strings.join(" ");
  applyOptions(chalk2, options);
  Object.setPrototypeOf(chalk2, createChalk.prototype);
  return chalk2;
};
function createChalk(options) {
  return chalkFactory(options);
}
Object.setPrototypeOf(createChalk.prototype, Function.prototype);
for (const [styleName, style] of Object.entries(ansi_styles_default)) {
  styles2[styleName] = {
    get() {
      const builder = createBuilder(this, createStyler(style.open, style.close, this[STYLER]), this[IS_EMPTY]);
      Object.defineProperty(this, styleName, { value: builder });
      return builder;
    }
  };
}
styles2.visible = {
  get() {
    const builder = createBuilder(this, this[STYLER], true);
    Object.defineProperty(this, "visible", { value: builder });
    return builder;
  }
};
var getModelAnsi = (model, level, type, ...arguments_) => {
  if (model === "rgb") {
    if (level === "ansi16m") {
      return ansi_styles_default[type].ansi16m(...arguments_);
    }
    if (level === "ansi256") {
      return ansi_styles_default[type].ansi256(ansi_styles_default.rgbToAnsi256(...arguments_));
    }
    return ansi_styles_default[type].ansi(ansi_styles_default.rgbToAnsi(...arguments_));
  }
  if (model === "hex") {
    return getModelAnsi("rgb", level, type, ...ansi_styles_default.hexToRgb(...arguments_));
  }
  return ansi_styles_default[type][model](...arguments_);
};
var usedModels = ["rgb", "hex", "ansi256"];
for (const model of usedModels) {
  styles2[model] = {
    get() {
      const { level } = this;
      return function(...arguments_) {
        const styler = createStyler(getModelAnsi(model, levelMapping[level], "color", ...arguments_), ansi_styles_default.color.close, this[STYLER]);
        return createBuilder(this, styler, this[IS_EMPTY]);
      };
    }
  };
  const bgModel = "bg" + model[0].toUpperCase() + model.slice(1);
  styles2[bgModel] = {
    get() {
      const { level } = this;
      return function(...arguments_) {
        const styler = createStyler(getModelAnsi(model, levelMapping[level], "bgColor", ...arguments_), ansi_styles_default.bgColor.close, this[STYLER]);
        return createBuilder(this, styler, this[IS_EMPTY]);
      };
    }
  };
}
var proto = Object.defineProperties(() => {
}, {
  ...styles2,
  level: {
    enumerable: true,
    get() {
      return this[GENERATOR].level;
    },
    set(level) {
      this[GENERATOR].level = level;
    }
  }
});
var createStyler = (open, close, parent) => {
  let openAll;
  let closeAll;
  if (parent === void 0) {
    openAll = open;
    closeAll = close;
  } else {
    openAll = parent.openAll + open;
    closeAll = close + parent.closeAll;
  }
  return {
    open,
    close,
    openAll,
    closeAll,
    parent
  };
};
var createBuilder = (self, _styler, _isEmpty) => {
  const builder = (...arguments_) => applyStyle(builder, arguments_.length === 1 ? "" + arguments_[0] : arguments_.join(" "));
  Object.setPrototypeOf(builder, proto);
  builder[GENERATOR] = self;
  builder[STYLER] = _styler;
  builder[IS_EMPTY] = _isEmpty;
  return builder;
};
var applyStyle = (self, string) => {
  if (self.level <= 0 || !string) {
    return self[IS_EMPTY] ? "" : string;
  }
  let styler = self[STYLER];
  if (styler === void 0) {
    return string;
  }
  const { openAll, closeAll } = styler;
  if (string.includes("\x1B")) {
    while (styler !== void 0) {
      string = stringReplaceAll(string, styler.close, styler.open);
      styler = styler.parent;
    }
  }
  const lfIndex = string.indexOf("\n");
  if (lfIndex !== -1) {
    string = stringEncaseCRLFWithFirstIndex(string, closeAll, openAll, lfIndex);
  }
  return openAll + string + closeAll;
};
Object.defineProperties(createChalk.prototype, styles2);
var chalk = createChalk();
var chalkStderr = createChalk({ level: stderrColor ? stderrColor.level : 0 });
var source_default = chalk;

// src/plugin.ts
import fs from "node:fs/promises";
import path from "node:path";
var dreamyPlugin = definePlugin({
  name: "dreamy-plugin",
  hooks: {
    "codegen:done": async () => {
      const styledSystemFolder = path.join(process.cwd(), "styled-system");
      if (!(await fs.stat(styledSystemFolder)).isDirectory()) {
        console.error(
          source_default.blue(`\u274C ${source_default.red("styled-system")} folder does not exist.`)
        );
        console.log(source_default.yellow("Failed when trying to modify `jsx` directory."));
        return;
      }
      const jsxFolder = path.join(process.cwd(), "styled-system", "jsx");
      if (!(await fs.stat(jsxFolder)).isDirectory()) {
        console.error(
          source_default.blue(
            `\u274C ${source_default.red(
              "jsx"
            )} folder does not exist in styled-system. Did you forget to add ${source_default.green(
              "jsxFramework: 'react'"
            )} to the ${source_default.green("panda.config.ts")}?`
          )
        );
        return;
      }
      const files = await fs.readdir(jsxFolder);
      for (const file of files) {
        if (!["index", "factory", "is-valid-prop"].some((prefix) => file.startsWith(prefix))) {
          await fs.unlink(path.join(jsxFolder, file));
        }
      }
      let js = "js";
      const indexJs = await fs.readFile(path.join(jsxFolder, "index.js"), "utf-8").catch(() => null);
      const indexMjs = await fs.readFile(path.join(jsxFolder, "index.mjs"), "utf-8").catch(() => null);
      if (indexJs && indexMjs) {
        js = "both";
      } else if (indexJs) {
        js = "js";
      } else if (indexMjs) {
        js = "mjs";
      }
      const indexContent = `export * from './factory.js';
export * from './is-valid-prop.js';`;
      await Promise.all([
        (js === "js" || js === "both") && fs.writeFile(path.join(jsxFolder, "index.js"), indexContent),
        (js === "mjs" || js === "both") && fs.writeFile(path.join(jsxFolder, "index.mjs"), indexContent),
        fs.writeFile(
          path.join(jsxFolder, "index.d.ts"),
          `export * from './factory';
export * from './is-valid-prop';
export type { HTMLStyledProps, StyledComponent } from '../types/jsx';`
        )
      ]);
      console.log(
        source_default.cyan(
          "\u2714\uFE0F  Dreamy UI has successfully modified the jsx files in the styled-system folder."
        )
      );
    }
  }
});

// src/theme/patterns/divider.ts
import { definePattern } from "@pandacss/dev";
var divider = definePattern({
  jsx: ["Divider"],
  description: "divider pattern",
  properties: {
    orientation: {
      type: "enum",
      value: ["horizontal", "vertical"]
    },
    thickness: {
      type: "string",
      value: "1px"
    }
  },
  defaultValues: {
    orientation: "horizontal",
    thickness: "1px",
    color: "alpha.300"
  },
  transform(props, { map }) {
    const { orientation, thickness, color, backgroundColor, background, bg, ...rest } = props;
    return {
      "--thickness": thickness,
      width: map(orientation, (v) => v === "vertical" ? void 0 : "100%"),
      height: map(orientation, (v) => v === "horizontal" ? void 0 : "100%"),
      borderTop: "none",
      borderBlockEndWidth: map(
        orientation,
        (v) => v === "horizontal" ? "var(--thickness)" : void 0
      ),
      borderInlineStartWidth: map(
        orientation,
        (v) => v === "vertical" ? "var(--thickness)" : void 0
      ),
      borderColor: color ?? backgroundColor ?? background ?? bg,
      ...rest
    };
  }
});

// src/theme/patterns/flex.ts
import { definePattern as definePattern2 } from "@pandacss/dev";
var flex = definePattern2({
  jsx: ["Flex", "Group"]
});

// src/theme/patterns/text.ts
import { definePattern as definePattern3 } from "@pandacss/dev";
var text = definePattern3({
  jsx: ["Heading", "Text"],
  properties: {
    variant: {
      type: "enum",
      value: ["heading", "link"]
    },
    size: {
      type: "enum",
      value: ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "7xl"]
    }
  },
  transform(props, { map }) {
    const { variant, size, ...rest } = props;
    return {
      textStyle: size ?? map(variant, (v) => v === "heading" ? "xl" : void 0),
      fontWeight: map(
        variant,
        (v) => v === "heading" ? "bold" : v === "link" ? "semibold" : void 0
      ),
      fontFamily: map(variant, (v) => v === "heading" ? "heading" : void 0),
      transition: map(variant, (v) => v === "link" ? "colors" : void 0),
      _hover: map(
        variant,
        (v) => v === "link" ? { color: "{colors.fg.max}" } : void 0
      ),
      ...rest
    };
  }
});

// src/theme/patterns/visually-hidden.ts
import { definePattern as definePattern4 } from "@pandacss/dev";
var visuallyHidden = definePattern4({
  jsx: ["VisuallyHidden", "VisuallyHiddenInput"]
});

// src/theme/patterns/index.ts
var patterns = {
  divider,
  text,
  visuallyHidden,
  flex
};

// src/theme/resolve-button-colors.ts
function resolveButtonColors(options) {
  if (options.primaryColor && !options.buttonPrimaryTextColor) {
    if (typeof options.primaryColor === "string") {
      options.buttonPrimaryTextColor = getContrast(options.primaryColor);
    } else {
      options.buttonPrimaryTextColor = {
        light: getContrast(options.primaryColor.light),
        dark: getContrast(options.primaryColor.dark)
      };
    }
  }
  if (options.secondaryColor && !options.buttonSecondaryTextColor) {
    if (typeof options.secondaryColor === "string") {
      options.buttonSecondaryTextColor = getContrast(options.secondaryColor);
    } else {
      options.buttonSecondaryTextColor = {
        light: getContrast(options.secondaryColor.light),
        dark: getContrast(options.secondaryColor.dark)
      };
    }
  }
}
function getContrast(color) {
  const [red, green, blue] = resolveColorScheme(color);
  return red * 0.299 + green * 0.587 + blue * 0.114 > 186 ? "#000000" : "#ffffff";
}
function resolveColorScheme(color) {
  if (color.startsWith("#")) {
    const hex = color.slice(1);
    const [r, g, b] = hexToRgb(hex);
    return [r, g, b];
  }
  if (color.startsWith("rgb")) {
    const rgb = color.slice(4).split(")")[0].split(",");
    return rgb.map((value) => Number.parseInt(value, 10));
  }
  if (color.startsWith("hsl")) {
    const hsl = color.slice(4).split(")")[0].split(",");
    const [h, s, l] = hsl.map((value) => Number.parseInt(value, 10));
    return hslToRgb(h, s, l);
  }
  throw new Error(
    `Invalid color: ${color}. Make sure provided color is a valid hex value, rgb value, or hsl value.`
  );
}
function hexToRgb(hex) {
  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  if (!result) throw new Error(`Invalid hex color: ${hex}`);
  return [
    Number.parseInt(result[1], 16),
    Number.parseInt(result[2], 16),
    Number.parseInt(result[3], 16)
  ];
}
function hslToRgb(h, s, l) {
  let r;
  let g;
  let b;
  if (s === 0) {
    r = g = b = l;
  } else {
    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
    const p = 2 * l - q;
    r = hueToRgb(p, q, h + 1 / 3);
    g = hueToRgb(p, q, h);
    b = hueToRgb(p, q, h - 1 / 3);
  }
  return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
}
function hueToRgb(p, q, t) {
  if (t < 0) t += 1;
  if (t > 1) t -= 1;
  if (t < 1 / 6) return p + (q - p) * 6 * t;
  if (t < 1 / 2) return q;
  if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
  return p;
}

// src/theme/semantic-tokens/colors.ts
import { defineSemanticTokens } from "@pandacss/dev";
function createColorTokens({
  backgrounds: { light: lightBackground, dark: darkBackground },
  primaryColor,
  secondaryColor,
  buttonPrimaryTextColor,
  buttonSecondaryTextColor
}) {
  return defineSemanticTokens.colors({
    primary: {
      DEFAULT: {
        value: typeof primaryColor === "string" ? primaryColor : {
          _light: primaryColor.light,
          _dark: primaryColor.dark
        }
      },
      fg: {
        value: typeof buttonPrimaryTextColor === "string" ? buttonPrimaryTextColor : {
          _light: buttonPrimaryTextColor.light,
          _dark: buttonPrimaryTextColor.dark
        }
      }
    },
    secondary: {
      DEFAULT: {
        value: typeof secondaryColor === "string" ? secondaryColor : {
          _light: secondaryColor.light,
          _dark: secondaryColor.dark
        }
      },
      fg: {
        value: typeof buttonSecondaryTextColor === "string" ? buttonSecondaryTextColor : {
          _light: buttonSecondaryTextColor.light,
          _dark: buttonSecondaryTextColor.dark
        }
      }
    },
    primaryButtonText: {
      value: typeof buttonPrimaryTextColor === "string" ? buttonPrimaryTextColor : {
        _light: buttonPrimaryTextColor.light,
        _dark: buttonPrimaryTextColor.dark
      }
    },
    secondaryButtonText: {
      value: typeof buttonSecondaryTextColor === "string" ? buttonSecondaryTextColor : {
        _light: buttonSecondaryTextColor.light,
        _dark: buttonSecondaryTextColor.dark
      }
    },
    bg: {
      DEFAULT: {
        value: {
          base: lightBackground,
          _light: lightBackground,
          _dark: darkBackground
        }
      },
      light: {
        value: lightBackground
      },
      dark: {
        value: darkBackground
      },
      panel: {
        value: {
          // light background with 85% opacity
          base: `color-mix(in srgb, ${lightBackground} 85%, transparent 15%)`,
          // dark background with white alpha, to whiten the background and also alphied
          _dark: `color-mix(in srgb, ${darkBackground} 85%, {colors.whiteAlpha.200} 20%)`
        }
      }
    },
    fg: {
      DEFAULT: {
        value: {
          _light: "{colors.gray.950}",
          _dark: "{colors.gray.50}"
        }
      },
      max: {
        value: {
          _light: "{colors.black}",
          _dark: "{colors.white}"
        }
      },
      medium: {
        value: {
          _light: "{colors.gray.600}",
          _dark: "{colors.gray.400}"
        }
      },
      disabled: {
        value: {
          _light: "{colors.gray.400}",
          _dark: "{colors.gray.500}"
        }
      }
    },
    success: {
      value: {
        _light: "{colors.green.600}",
        _dark: "{colors.green.400}"
      }
    },
    warning: {
      value: {
        _light: "{colors.yellow.500}",
        _dark: "{colors.yellow.400}"
      }
    },
    error: {
      value: {
        _light: "#d60b3e",
        _dark: "#db6371"
      }
    },
    info: {
      value: {
        _light: "{colors.blue.500}",
        _dark: "{colors.blue.400}"
      }
    },
    border: {
      DEFAULT: {
        value: "{colors.alpha.300}"
      },
      muted: {
        value: "{colors.alpha.200}"
      },
      hover: {
        value: "{colors.alpha.400}"
      }
    },
    alpha: {
      50: {
        value: {
          _light: "{colors.blackAlpha.50}",
          _dark: "{colors.whiteAlpha.50}"
        }
      },
      100: {
        value: {
          _light: "{colors.blackAlpha.100}",
          _dark: "{colors.whiteAlpha.100}"
        }
      },
      200: {
        value: {
          _light: "{colors.blackAlpha.200}",
          _dark: "{colors.whiteAlpha.200}"
        }
      },
      300: {
        value: {
          _light: "{colors.blackAlpha.300}",
          _dark: "{colors.whiteAlpha.300}"
        }
      },
      400: {
        value: {
          _light: "{colors.blackAlpha.400}",
          _dark: "{colors.whiteAlpha.400}"
        }
      },
      500: {
        value: {
          _light: "{colors.blackAlpha.500}",
          _dark: "{colors.whiteAlpha.500}"
        }
      },
      600: {
        value: {
          _light: "{colors.blackAlpha.600}",
          _dark: "{colors.whiteAlpha.600}"
        }
      },
      700: {
        value: {
          _light: "{colors.blackAlpha.700}",
          _dark: "{colors.whiteAlpha.700}"
        }
      },
      800: {
        value: {
          _light: "{colors.blackAlpha.800}",
          _dark: "{colors.whiteAlpha.800}"
        }
      },
      900: {
        value: {
          _light: "{colors.blackAlpha.900}",
          _dark: "{colors.whiteAlpha.900}"
        }
      },
      950: {
        value: {
          _light: "{colors.blackAlpha.950}",
          _dark: "{colors.whiteAlpha.950}"
        }
      }
    },
    inverted: {
      value: {
        _light: "{colors.fg.max}",
        _dark: "{colors.bg}"
      }
    }
  });
}

// src/theme/semantic-tokens/radii.ts
import { defineSemanticTokens as defineSemanticTokens2 } from "@pandacss/dev";
function createRadiiTokens(borderRadius) {
  return defineSemanticTokens2.radii(
    (() => {
      switch (borderRadius) {
        case "none":
          return {
            l05: { value: "{radii.none}" },
            l1: { value: "{radii.none}" },
            l2: { value: "{radii.none}" },
            l3: { value: "{radii.none}" },
            "p-2": { value: "{radii.none}" },
            "p-3": { value: "{radii.none}" },
            "p-4": { value: "{radii.none}" },
            "p-5": { value: "{radii.none}" },
            "p-6": { value: "{radii.none}" }
          };
        case "xs":
          return {
            l05: { value: "{radii.none}" },
            l1: { value: "{radii.2xs}" },
            l2: { value: "{radii.xs}" },
            l3: { value: "{radii.sm}" },
            "p-2": { value: "0.375rem" },
            "p-3": { value: "0.525rem" },
            "p-4": { value: "0.625rem" },
            "p-5": { value: "0.775rem" },
            "p-6": { value: "0.875rem" }
          };
        case "sm":
          return {
            l05: { value: "{radii.2xs}" },
            l1: { value: "{radii.xs}" },
            l2: { value: "{radii.sm}" },
            l3: { value: "{radii.md}" },
            "p-2": { value: "0.5rem" },
            "p-3": { value: "0.65rem" },
            "p-4": { value: "0.75rem" },
            "p-5": { value: "0.9rem" },
            "p-6": { value: "1rem" }
          };
        case "md":
          return {
            l05: { value: "{radii.xs}" },
            l1: { value: "{radii.sm}" },
            l2: { value: "{radii.md}" },
            l3: { value: "{radii.lg}" },
            "p-2": { value: "0.625rem" },
            "p-3": { value: "0.775rem" },
            "p-4": { value: "0.875rem" },
            "p-5": { value: "1.025rem" },
            "p-6": { value: "1.125rem" }
          };
        case "lg":
          return {
            l05: { value: "{radii.sm}" },
            l1: { value: "{radii.md}" },
            l2: { value: "{radii.lg}" },
            l3: { value: "{radii.xl}" },
            "p-2": { value: "0.75rem" },
            "p-3": { value: "0.9rem" },
            "p-4": { value: "1rem" },
            "p-5": { value: "1.15rem" },
            "p-6": { value: "1.25rem" }
          };
        case "xl":
          return {
            l05: { value: "{radii.md}" },
            l1: { value: "{radii.lg}" },
            l2: { value: "{radii.xl}" },
            l3: { value: "{radii.2xl}" },
            "p-2": { value: "1rem" },
            "p-3": { value: "1.15rem" },
            "p-4": { value: "1.25rem" },
            "p-5": { value: "1.4rem" },
            "p-6": { value: "1.5rem" }
          };
        case "2xl":
          return {
            l05: { value: "{radii.lg}" },
            l1: { value: "{radii.xl}" },
            l2: { value: "{radii.2xl}" },
            l3: { value: "{radii.3xl}" },
            "p-2": { value: "1.25rem" },
            "p-3": { value: "1.4rem" },
            "p-4": { value: "1.5rem" },
            "p-5": { value: "1.65rem" },
            "p-6": { value: "1.75rem" }
          };
      }
    })()
  );
}

// src/theme/semantic-tokens/index.ts
import { defineSemanticTokens as defineSemanticTokens5 } from "@pandacss/dev";

// src/theme/semantic-tokens/animations.ts
import { defineTokens } from "@pandacss/dev";
var animations = defineTokens.animations({
  "spinner-linear-spin": {
    value: "spinner-spin var(--spinner-speed, 0.8s) linear infinite"
  },
  "spinner-ease-spin": {
    value: "spinner-spin var(--spinner-speed, 0.8s) ease infinite"
  }
});
var animations_default = animations;

// src/theme/semantic-tokens/font-sizes.ts
import { defineSemanticTokens as defineSemanticTokens3 } from "@pandacss/dev";
var fontSizes = defineSemanticTokens3.fontSizes({
  sm: {
    value: {
      DEFAULT: "xs",
      _md: "sm"
    }
  },
  md: {
    value: {
      DEFAULT: "sm",
      _md: "md"
    }
  },
  lg: {
    value: {
      DEFAULT: "md",
      _md: "lg"
    }
  },
  xl: {
    value: {
      DEFAULT: "lg",
      _md: "xl"
    }
  },
  "2xl": {
    value: {
      DEFAULT: "xl",
      _md: "2xl"
    }
  },
  "3xl": {
    value: {
      DEFAULT: "2xl",
      _md: "3xl"
    }
  },
  "4xl": {
    value: {
      DEFAULT: "3xl",
      _md: "4xl"
    }
  },
  "5xl": {
    value: {
      DEFAULT: "4xl",
      _md: "5xl"
    }
  },
  "6xl": {
    value: {
      DEFAULT: "5xl",
      _md: "6xl"
    }
  }
});

// src/theme/semantic-tokens/shadows.ts
import { defineSemanticTokens as defineSemanticTokens4 } from "@pandacss/dev";
var shadows = defineSemanticTokens4.shadows({
  xs: {
    value: {
      base: "0px 1px 2px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 1px 1px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  },
  sm: {
    value: {
      base: "0px 2px 4px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 2px 4px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  },
  md: {
    value: {
      base: "0px 4px 8px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 4px 8px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  },
  lg: {
    value: {
      base: "0px 8px 16px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 8px 16px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  },
  xl: {
    value: {
      base: "0px 16px 24px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 16px 24px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  },
  "2xl": {
    value: {
      base: "0px 24px 40px {colors.blackAlpha.100}, 0px 0px 1px {colors.blackAlpha.100}",
      _dark: "0px 24px 40px {colors.blackAlpha.100}, 0px 0px 1px inset {colors.blackAlpha.100}"
    }
  }
});
var shadows_default = shadows;

// src/theme/semantic-tokens/index.ts
function createSemanticTokens(options) {
  const radii2 = createRadiiTokens(options.rounded);
  const colors = createColorTokens(options);
  return defineSemanticTokens5({
    fontSizes,
    colors,
    shadows: shadows_default,
    animations: animations_default,
    easings: {
      easeInOut: {
        value: [0.4, 0, 0.3, 1]
      }
    },
    radii: radii2
  });
}

// src/theme/tokens/assets.ts
import { defineTokens as defineTokens2 } from "@pandacss/dev";
var assets = defineTokens2.assets({});

// src/theme/tokens/colors.ts
import { defineTokens as defineTokens3 } from "@pandacss/dev";
function defineColorTokens() {
  return defineTokens3.colors({
    current: { value: "currentColor" },
    blackAlpha: {
      50: { value: "rgba(0, 0, 0, 0.04)" },
      100: { value: "rgba(0, 0, 0, 0.08)" },
      200: { value: "rgba(0, 0, 0, 0.12)" },
      300: { value: "rgba(0, 0, 0, 0.16)" },
      400: { value: "rgba(0, 0, 0, 0.24)" },
      500: { value: "rgba(0, 0, 0, 0.32)" },
      600: { value: "rgba(0, 0, 0, 0.40)" },
      700: { value: "rgba(0, 0, 0, 0.48)" },
      800: { value: "rgba(0, 0, 0, 0.56)" },
      900: { value: "rgba(0, 0, 0, 0.64)" },
      950: { value: "rgba(0, 0, 0, 0.72)" }
    },
    whiteAlpha: {
      50: { value: "rgba(255, 255, 255, 0.04)" },
      100: { value: "rgba(255, 255, 255, 0.08)" },
      200: { value: "rgba(255, 255, 255, 0.12)" },
      300: { value: "rgba(255, 255, 255, 0.16)" },
      400: { value: "rgba(255, 255, 255, 0.24)" },
      500: { value: "rgba(255, 255, 255, 0.32)" },
      600: { value: "rgba(255, 255, 255, 0.40)" },
      700: { value: "rgba(255, 255, 255, 0.48)" },
      800: { value: "rgba(255, 255, 255, 0.56)" },
      900: { value: "rgba(255, 255, 255, 0.64)" },
      950: { value: "rgba(255, 255, 255, 0.72)" }
    },
    transparent: { value: "rgb(0 0 0 / 0)" },
    gray: {
      50: { value: "#fafafa" },
      100: { value: "#f4f4f5" },
      200: { value: "#e4e4e7" },
      300: { value: "#d4d4d8" },
      400: { value: "#a1a1aa" },
      500: { value: "#71717a" },
      600: { value: "#52525b" },
      700: { value: "#3f3f46" },
      800: { value: "#27272a" },
      900: { value: "#18181b" },
      950: { value: "#111111" }
    }
  });
}

// src/theme/tokens/typography/fonts.ts
function createFonts({ body, heading, mono }) {
  return {
    body: {
      value: [body, "sans"]
    },
    heading: {
      value: [heading, body, "sans"]
    },
    sans: {
      value: [
        "ui-sans-serif",
        "system-ui",
        "-apple-system",
        "BlinkMacSystemFont",
        '"Segoe UI"',
        "Roboto",
        '"Helvetica Neue"',
        "Arial",
        '"Noto Sans"',
        "sans-serif",
        '"Apple Color Emoji"',
        '"Segoe UI Emoji"',
        '"Segoe UI Symbol"',
        '"Noto Color Emoji"'
      ]
    },
    serif: {
      value: ["ui-serif", "Georgia", "Cambria", '"Times New Roman"', "Times", "serif"]
    },
    mono: {
      value: [
        mono,
        "ui-monospace",
        "SFMono-Regular",
        "Menlo",
        "Monaco",
        "Consolas",
        '"Liberation Mono"',
        '"Courier New"',
        "monospace"
      ]
    }
  };
}

// src/theme/tokens/index.ts
import { defineTokens as defineTokens10 } from "@pandacss/dev";

// src/theme/tokens/blurs.ts
import { defineTokens as defineTokens4 } from "@pandacss/dev";
var blurs = defineTokens4.blurs({
  sm: { value: "4px" },
  base: { value: "8px" },
  md: { value: "12px" },
  lg: { value: "16px" },
  xl: { value: "24px" },
  "2xl": { value: "40px" },
  "3xl": { value: "64px" }
});

// src/theme/tokens/borders.ts
var borders = {
  none: { value: "none" }
};

// src/theme/tokens/durations.ts
import { defineTokens as defineTokens5 } from "@pandacss/dev";
var durations = defineTokens5.durations({
  fastest: { value: "50ms" },
  faster: { value: "100ms" },
  fast: { value: "150ms" },
  normal: { value: "200ms" },
  slow: { value: "300ms" },
  slower: { value: "400ms" },
  slowest: { value: "500ms" }
});

// src/theme/tokens/easings.ts
import { defineTokens as defineTokens6 } from "@pandacss/dev";
var easings = defineTokens6.easings({
  pulse: { value: "cubic-bezier(0.4, 0.0, 0.6, 1.0)" },
  default: { value: "cubic-bezier(0.4, 0, 0.3, 1)" },
  "emphasized-in": { value: "cubic-bezier(0.05, 0.7, 0.1, 1.0)" },
  "emphasized-out": { value: "cubic-bezier(0.3, 0.0, 0.8, 0.15)" },
  "ease-in-out": { value: "cubic-bezier(0.4, 0, 0.3, 1)" },
  "ease-in": { value: "cubic-bezier(0.4, 0, 1, 1)" },
  "ease-out": { value: "cubic-bezier(0, 0, 0.2, 1)" }
});

// src/theme/tokens/radii.ts
import { defineTokens as defineTokens7 } from "@pandacss/dev";
var radii = defineTokens7.radii({
  none: { value: "0" },
  "2xs": { value: "0.0625rem" },
  xs: { value: "0.125rem" },
  sm: { value: "0.25rem" },
  md: { value: "0.375rem" },
  lg: { value: "0.5rem" },
  xl: { value: "0.75rem" },
  "2xl": { value: "1rem" },
  "3xl": { value: "1.5rem" },
  "4xl": { value: "2rem" },
  "5xl": { value: "2.5rem" },
  full: { value: "9999px" }
});

// src/theme/tokens/spacing.ts
import { defineTokens as defineTokens8 } from "@pandacss/dev";
var spacing = defineTokens8.spacing({
  0: { value: "0rem" },
  0.5: { value: "0.125rem" },
  1: { value: "0.25rem" },
  1.5: { value: "0.375rem" },
  2: { value: "0.5rem" },
  2.5: { value: "0.625rem" },
  3: { value: "0.75rem" },
  3.5: { value: "0.875rem" },
  4: { value: "1rem" },
  4.5: { value: "1.125rem" },
  5: { value: "1.25rem" },
  6: { value: "1.5rem" },
  7: { value: "1.75rem" },
  8: { value: "2rem" },
  9: { value: "2.25rem" },
  10: { value: "2.5rem" },
  11: { value: "2.75rem" },
  12: { value: "3rem" },
  14: { value: "3.5rem" },
  16: { value: "4rem" },
  20: { value: "5rem" },
  24: { value: "6rem" },
  28: { value: "7rem" },
  32: { value: "8rem" },
  36: { value: "9rem" },
  40: { value: "10rem" },
  44: { value: "11rem" },
  48: { value: "12rem" },
  52: { value: "13rem" },
  56: { value: "14rem" },
  60: { value: "15rem" },
  64: { value: "16rem" },
  72: { value: "18rem" },
  80: { value: "20rem" },
  96: { value: "24rem" }
});

// src/theme/tokens/sizes.ts
var largeSizes = {
  "2xs": { value: "16rem" },
  xs: { value: "20rem" },
  sm: { value: "24rem" },
  md: { value: "28rem" },
  lg: { value: "32rem" },
  xl: { value: "36rem" },
  "2xl": { value: "42rem" },
  "3xl": { value: "48rem" },
  "4xl": { value: "56rem" },
  "5xl": { value: "64rem" },
  "6xl": { value: "72rem" },
  "7xl": { value: "80rem" },
  "8xl": { value: "90rem" }
};
var sizes = {
  ...spacing,
  ...largeSizes,
  full: { value: "100%" },
  min: { value: "min-content" },
  max: { value: "max-content" },
  fit: { value: "fit-content" }
};

// src/theme/tokens/typography/font-sizes.ts
var fontSizes2 = {
  "2xs": { value: "0.5rem" },
  xs: { value: "0.75rem" },
  sm: { value: "0.875rem" },
  md: { value: "1rem" },
  lg: { value: "1.125rem" },
  xl: { value: "1.25rem" },
  "2xl": { value: "1.5rem" },
  "3xl": { value: "1.875rem" },
  "4xl": { value: "2.25rem" },
  "5xl": { value: "3rem" },
  "6xl": { value: "3.75rem" },
  "7xl": { value: "4.5rem" },
  "8xl": { value: "6rem" },
  "9xl": { value: "8rem" }
};

// src/theme/tokens/typography/font-weights.ts
var fontWeights = {
  thin: { value: "100" },
  extralight: { value: "200" },
  light: { value: "300" },
  normal: { value: "400" },
  medium: { value: "500" },
  semibold: { value: "600" },
  bold: { value: "700" },
  extrabold: { value: "800" },
  black: { value: "900" }
};

// src/theme/tokens/typography/letter-spacings.ts
var letterSpacings = {
  tighter: { value: "-0.05em" },
  tight: { value: "-0.025em" },
  normal: { value: "0em" },
  wide: { value: "0.025em" },
  wider: { value: "0.05em" },
  widest: { value: "0.1em" }
};

// src/theme/tokens/typography/line-heights.ts
var lineHeights = {
  none: { value: "1" },
  tight: { value: "1.25" },
  normal: { value: "1.5" },
  relaxed: { value: "1.75" },
  loose: { value: "2" }
};

// src/theme/tokens/z-index.ts
import { defineTokens as defineTokens9 } from "@pandacss/dev";
var zIndex = defineTokens9.zIndex({
  hide: {
    value: -1
  },
  base: {
    value: 0
  },
  docked: {
    value: 10
  },
  dropdown: {
    value: 1e3
  },
  sticky: {
    value: 1100
  },
  banner: {
    value: 1200
  },
  overlay: {
    value: 1300
  },
  modal: {
    value: 1400
  },
  popover: {
    value: 1500
  },
  skipLink: {
    value: 1600
  },
  toast: {
    value: 1700
  },
  tooltip: {
    value: 1800
  }
});

// src/theme/tokens/index.ts
function createTokens(options) {
  const fonts = createFonts(options.fonts);
  return defineTokens10({
    blurs,
    borders,
    colors: defineColorTokens(),
    durations,
    assets,
    easings,
    fonts,
    fontSizes: fontSizes2,
    fontWeights,
    letterSpacings,
    lineHeights,
    radii,
    sizes,
    spacing,
    zIndex
  });
}

// src/theme/preset.ts
import { definePreset } from "@pandacss/dev";
import pandaPreset from "@pandacss/preset-panda";
import deepmerge from "deepmerge";

// src/recipes/alert.ts
import { defineParts, defineRecipe } from "@pandacss/dev";
var parts = defineParts({
  root: { selector: "&" },
  icon: { selector: "& [data-part='icon']" },
  title: { selector: "& [data-part='title']" },
  description: { selector: "& [data-part='description']" }
});
var alert = defineRecipe({
  className: "dreamy-alert",
  description: "Dreamy UI Alert component",
  jsx: ["Alert"],
  base: parts({
    root: {
      display: "flex",
      flexDirection: "column",
      paddingX: 4,
      paddingY: 3,
      borderRadius: "l2",
      fontSize: "md",
      width: "100%",
      gap: 0.5
    },
    title: {
      display: "flex",
      alignItems: "center",
      fontWeight: "semibold",
      fontSize: "md",
      textWrap: "wrap"
    },
    description: {
      ml: 7
    },
    icon: {
      width: "5",
      height: "5",
      mr: 2,
      flexShrink: 0,
      "[data-status=success]&": {
        color: "{colors.success}",
        fill: "{colors.success}",
        stroke: "{colors.success}"
      },
      "[data-status=warning]&": {
        color: "{colors.warning}",
        fill: "{colors.warning}"
      },
      "[data-status=error]&": {
        color: "{colors.error}",
        fill: "{colors.error}"
      },
      "[data-status=info]&": {
        color: "{colors.info}",
        fill: "{colors.info}",
        stroke: "{colors.info}"
      }
    }
  }),
  variants: {
    variant: {
      subtle: parts({
        root: {
          "&[data-status=success]": {
            bg: "{colors.success}/10"
          },
          "&[data-status=warning]": {
            bg: "{colors.warning}/10"
          },
          "&[data-status=error]": {
            bg: "{colors.error}/10"
          },
          "&[data-status=info]": {
            bg: "{colors.info}/10"
          }
        }
      }),
      outline: parts({
        root: {
          borderWidth: 1,
          borderStyle: "solid",
          "&[data-status=success]": {
            borderColor: "{colors.success}"
          },
          "&[data-status=warning]": {
            borderColor: "{colors.warning}"
          },
          "&[data-status=error]": {
            borderColor: "{colors.error}"
          },
          "&[data-status=info]": {
            borderColor: "{colors.info}"
          }
        }
      })
    }
  },
  defaultVariants: {
    variant: "subtle"
  }
});

// src/recipes/avatar.ts
import { defineParts as defineParts2, defineRecipe as defineRecipe2 } from "@pandacss/dev";
var parts2 = defineParts2({
  root: {
    selector: "&"
  },
  image: { selector: '& [data-part="image"]' },
  name: { selector: '& [data-part="name"]' },
  group: { selector: '[data-part="group"]:has(&)' },
  excess: { selector: '[data-part="group"]:has(&) [data-part="excess"]' }
});
var avatar = defineRecipe2({
  className: "dreamy-avatar",
  jsx: ["Avatar", "AvatarImage", "AvatarName"],
  base: parts2({
    root: {
      display: "flex",
      alignItems: "center",
      justifyContent: "center",
      borderRadius: "full",
      overflow: "hidden"
      // transition: "transform 0.2s {easings.ease-in-out}",
      // _hover: {
      //     '[data-part="group"]:has(&) &': {
      //         transform: "translateX(-0.75rem)"
      //     }
      // }
    },
    name: {
      fontWeight: "500",
      fontSize: "md"
    },
    image: {
      objectFit: "cover",
      objectPosition: "center",
      width: "100%",
      height: "100%",
      rounded: "inherit"
    },
    group: {
      display: "flex",
      alignItems: "center",
      justifyContent: "flex-end",
      flexDirection: "row-reverse"
    },
    excess: {
      bg: "{colors.alpha.100}",
      backdropFilter: "blur({blurs.md})",
      fontWeight: "500",
      display: "flex",
      alignItems: "center",
      justifyContent: "center",
      rounded: "full"
    }
  }),
  defaultVariants: {
    size: "md"
  },
  variants: {
    size: {
      sm: parts2({
        root: {
          width: "8",
          height: "8"
        },
        excess: {
          width: "8",
          height: "8"
        }
      }),
      md: parts2({
        root: {
          width: "10",
          height: "10"
        },
        excess: {
          width: "10",
          height: "10"
        }
      }),
      lg: parts2({
        root: {
          width: "12",
          height: "12"
        },
        excess: {
          width: "12",
          height: "12"
        }
      })
    },
    showBorder: {
      true: parts2({
        root: {
          borderWidth: "2px",
          borderStyle: "solid",
          borderColor: "{colors.bg}"
        }
      })
    }
  }
});

// src/recipes/color-scheme.ts
var schemeNames = [
  "primary",
  "secondary",
  "success",
  "warning",
  "error",
  "info",
  "none"
];
var schemes = {
  primary: "{colors.primary}",
  secondary: "{colors.secondary}",
  success: "{colors.success}",
  warning: "{colors.warning}",
  error: "{colors.error}",
  info: "{colors.info}",
  none: "{colors.fg.max}"
};
function getColorSchemes(cssVar, schemeProps, slot) {
  const entries = Object.fromEntries(
    schemeNames.map((scheme) => {
      const val = slot ? { [slot]: { [cssVar]: schemes[scheme], ...schemeProps?.(scheme) } } : {
        [cssVar]: schemes[scheme],
        ...schemeProps?.(scheme)
      };
      return [scheme, val];
    })
  );
  return Object.assign({}, entries);
}

// src/recipes/badge.ts
import { defineRecipe as defineRecipe3 } from "@pandacss/dev";
var badge = defineRecipe3({
  className: "dreamy-badge",
  jsx: ["Badge"],
  base: {
    display: "inline-block",
    whiteSpace: "nowrap",
    verticalAlign: "middle",
    px: 1,
    textTransform: "uppercase",
    fontSize: "xs",
    borderRadius: "sm",
    fontWeight: "bold",
    width: "fit-content"
  },
  defaultVariants: {
    variant: "subtle",
    scheme: "primary"
  },
  variants: {
    variant: {
      outline: {
        border: "1px solid",
        borderColor: "var(--badge-color)",
        color: "var(--badge-color)",
        bg: "transparent"
      },
      subtle: {
        color: "var(--badge-color)",
        bg: "var(--badge-color)/10"
      }
    },
    scheme: getColorSchemes("--badge-color")
  }
});

// src/recipes/button.ts
import { defineParts as defineParts3, defineRecipe as defineRecipe4 } from "@pandacss/dev";
var parts3 = defineParts3({
  root: { selector: "&" },
  leftIcon: { selector: '& > [data-part="icon-left"]' },
  rightIcon: { selector: '& [data-part="icon-right"]' },
  ripple: { selector: '& [data-part="ripple"]' },
  rippleContainer: { selector: '& > [data-part="ripple-container"]' },
  icons: {
    selector: '& [data-part="icon-left"], & [data-part="icon-right"]'
  }
});
var button = defineRecipe4({
  className: "dreamy-button",
  staticCss: ["*"],
  jsx: [
    "Button",
    "ModalCloseButton",
    "PopoverCloseButton",
    "CloseButton",
    "IconButton",
    "ModalCloseButtonBase",
    "ButtonIcon"
  ],
  base: parts3({
    root: {
      position: "relative",
      display: "inline-flex",
      alignItems: "center",
      fontWeight: "semibold",
      cursor: "pointer",
      borderRadius: "l2",
      isolation: "isolate",
      textAlign: "center",
      userSelect: "none",
      transition: "background-color 0.2s {easings.ease-in-out}, color 0.2s {easings.ease-in-out}, border-color 0.2s {easings.ease-in-out}, fill 0.2s {easings.ease-in-out}, transform 0.15s {easings.ease-in-out}",
      justifyContent: "center",
      _disabled: {
        cursor: "not-allowed",
        opacity: 0.5
      },
      "&[data-type=