@nurl/panda-preset/build/modern/recipes/shared/button.base.js

Official Panda-CSS preset for the Ganglion Design System.

// src/recipes/shared/button.base.ts
import { focusStates, formStates } from "./states.js";
import { action, danger, neutral } from "./palettes.js";
var buttonBase = {
  alignItems: "center",
  appearance: "none",
  borderStyle: "none",
  display: "inline-flex",
  fontSize: "inherit",
  fontVariationSettings: "'wght' 600",
  gap: "1",
  justifyContent: "center",
  lineHeight: "0",
  outline: "none",
  position: "relative",
  textAlign: "center",
  textDecoration: "none",
  textTransform: "none",
  transitionProperty: "background-color, color",
  transitionDuration: "fast",
  transitionTimingFunction: "ease-in-out",
  userSelect: "none",
  verticalAlign: "middle",
  whiteSpace: "nowrap",
  ...focusStates,
  ...formStates
};
var nonTextStates = {
  color: "colorPalette.text.initial",
  _hover: {
    bgColor: "colorPalette.bg.hover",
    _disabled: {
      bgColor: "colorPalette.bg.initial"
    }
  },
  _active: {
    bgColor: "colorPalette.bg.active"
  }
};
var textUsage = {
  color: "colorPalette.text.100",
  _hover: {
    bgColor: "colorPalette.bg.hover"
  },
  _active: {
    color: "colorPalette.text.initial"
  },
  _disabled: {
    _active: {
      color: "colorPalette.text.100"
    }
  }
};
var filledUsage = {
  bgColor: "colorPalette.bg.initial",
  ...nonTextStates,
  _active: {
    bgColor: "colorPalette.bg.active"
  }
};
var buttonPalettes = {
  action,
  neutral,
  danger
};
export {
  buttonBase,
  buttonPalettes,
  filledUsage,
  nonTextStates,
  textUsage
};
//# sourceMappingURL=button.base.js.map