@ano-ui/preset/dist/index.mjs

import { parseColor } from '@unocss/preset-mini';

const rules = [
  [/^a-(.*)$/, ([, body], { theme }) => {
    const color = parseColor(body, theme);
    if (color?.cssColor?.type === "rgb" && color.cssColor.components) {
      return {
        "--ano-c-context": `${color.cssColor.components.join(" ")}`
      };
    }
  }],
  ["p-safe", { padding: "env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)" }],
  ["pt-safe", { "padding-top": "env(safe-area-inset-top)" }],
  ["pb-safe", { "padding-bottom": "env(safe-area-inset-bottom)" }],
  ["pl-safe", { "padding-left": "env(safe-area-inset-left)" }],
  ["pr-safe", { "padding-right": "env(safe-area-inset-right)" }],
  ["m-safe", { margin: "env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)" }],
  ["mt-safe", { "margin-top": "env(safe-area-inset-top)" }],
  ["mb-safe", { "margin-bottom": "env(safe-area-inset-bottom)" }],
  ["ml-safe", { "margin-left": "env(safe-area-inset-left)" }],
  ["mr-safe", { "margin-right": "env(safe-area-inset-right)" }]
];

const shortcuts = {
  "a-bg": "bg-gray-100 dark:bg-black",
  "a-bg-2": "bg-white dark:bg-[#1C1C1E]",
  "a-border": "border-[#EBEDF0] dark:border-[#3A3A3C]",
  "a-active": "bg-[#F2F3F5] dark:bg-[#3A3A3C]",
  "a-active-h5": "active:bg-[#F2F3F5] active:dark:bg-[#3A3A3C]",
  "a-text-color": "text-[#323233] dark:text-[#F5F5F5]",
  "a-text-color-2": "text-[#969799] dark:text-[#707070]",
  "a-text-color-3": "text-[#C8C9CC] dark:text-[#4D4D4D]",
  "a-text-mini": "text-xs",
  "a-text-small": "text-sm",
  "a-text-normal": "text-base",
  "a-text-large": "text-lg",
  "a-transition": "transition-all duration-200",
  "a-solid": "bg-context text-white",
  "a-outline": "bg-transparent border border-solid border-context text-context",
  "a-ghost": "bg-transparent border border-dashed border-context text-context",
  "a-light": "bg-context text-context bg-op20",
  "a-text": "bg-transparent text-context",
  "a-type-default": "!a-text-color border border-solid dark:!bg-transparent border-[#DCDEE0]",
  "a-hairline": "relative after:content-['_'] after:pointer-events-none after:absolute after:box-border after:top--50% after:right--50% after:bottom--50% after:left--50% after:a-border after:border-solid after:border-0 after:scale-50",
  "a-hairline-bottom": "a-hairline after:border-b-1px"
};

const theme = {
  colors: {
    context: "rgb(var(--ano-c-context))",
    default: "#FFFFFF",
    primary: "#A855F7",
    success: "#3AC569",
    info: "#0080FF",
    warning: "#F17F42",
    danger: "#F15C5C",
    aGray1: "#f7f8fa",
    aGray2: "#f2f3f5",
    aGray3: "#ebedf0",
    aGray4: "#dcdee0",
    aGray5: "#c8c9cc",
    aGray6: "#969799",
    aGray7: "#646566",
    aGray8: "#323233",
    lightBg: "#F3F4F6",
    darkBg: "#373739",
    placeholder: "#DCDCDC",
    grayBg: "#484849",
    darkBd: "#4C4D4F",
    softBg: "#E5E6EB",
    darkTitle: "#ECECEC",
    darkText: "#7C7C7D",
    darkSubText: "rgba(255,255,255,.7)"
  }
};

const colors = Object.keys(theme.colors);
function presetAno() {
  return {
    name: "@ano-ui/preset",
    theme,
    shortcuts,
    rules,
    safelist: [
      // common
      ...colors.map((c) => `a-${c}`),
      ...colors.map((c) => `!a-${c}`),
      // shortcuts
      ...Object.keys(shortcuts)
    ]
  };
}

export { colors, presetAno };