unocss-preset-zyyv 2.0.0-beta.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 zyyv <https://github.com/zyyv>
+
+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,282 @@
+# unocss-preset-zyyv [![npm](https://img.shields.io/npm/v/unocss-preset-zyyv)](https://npmjs.com/package/unocss-preset-zyyv)
+
+Integrate and useful preset.
+
+> [!WARNING]
+> The package name has been changed to `unocss-preset-zyyv`.
+
+## Features
+- 🔥 All-in-One popular presets.
+- 🚀 Collection of features not integrated into UnoCSS.
+  - 🍥 Support extract base64 image.
+  - 🎨 Support extract rgba color in css variable.
+  - 💜 Support expand theme animation name usage.
+  - 🍬 etc.
+- 📦 Build-In [Magic Animate](https://github.com/unocss-community/unocss-preset-magicss).
+- 🌬️ Align with TW theme configuration.
+
+## Usage
+```shell
+pnpm i -D unocss-preset-zyyv unocss
+```
+
+```ts
+// unocss.config.ts
+import { defineConfig } from 'unocss'
+import { presetZyyv } from 'unocss-preset-zyyv'
+
+export default defineConfig({
+  presets: [
+    presetZyyv(),
+  ],
+})
+```
+
+<details>
+<summary>Options</summary><br>
+
+```ts
+export interface ZyyvOptions {
+  /**
+   * Enable default shortcuts
+   *
+   * @default true
+   */
+  enableDefaultShortcuts?: boolean
+
+  /**
+   * Enable magic animations
+   *
+   * @default false
+   * @deprecated Use `magicss` option instead.
+   */
+  enableMagicAnimations?: boolean
+
+  /**
+   * Extract rgba color in css variable
+   *
+   * @default false
+   */
+  unColor?: boolean | string
+
+  /**
+   * Improve theme to be more useful, and align with Tailwind theme configuration
+   *
+   * - Add `animation` to theme, Expand theme animation name usage
+   *
+   * [ name, duration, timing-function, iteration-count ]
+   *
+   * @example
+   *
+   * ```ts
+   * theme: {
+   *   extend: {
+   *     animation: {
+   *      shape: 'shape 5s linear infinite'
+   *     },
+   *     // ...
+   *   }
+   * }
+   * ```
+   * You can choose to use special symbols as placeholders, to indicate whether to inject this property into the uno theme
+   *
+   * - `*` Abandon injection
+   * - `+` Injection, but the value is empty
+   *
+   * @example
+   *
+   * ```ts
+   * theme: {
+   *   extend: {
+   *     animation: {
+   *      foo: 'foo 1s * 3',
+   *      bar: 'bar 1s +',
+   *     },
+   *     // ...
+   *   }
+   * }
+   * ```
+   *
+   */
+  theme?: ZyyvTheme
+
+  /**
+   * Enable the default preset
+   * Only works when `presets` is not specified
+   * @default true
+   */
+  uno?: boolean | PresetUnoOptions
+
+  /**
+   * Enable attributify mode and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  attributify?: boolean | AttributifyOptions
+
+  /**
+   * Enable icons preset and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  icons?: boolean | IconsOptions
+
+  /**
+   * Enable webFonts preset and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  webFonts?: boolean | WebFontsOptions
+
+  /**
+   * Enable typography preset and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  typography?: boolean | TypographyOptions
+
+  /**
+   * Enable tagify preset and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  tagify?: boolean | TagifyOptions
+
+  /**
+   * Enable remToPx preset and the options of it
+   * Only works when `presets` is not specified
+   * @default false
+   */
+  remToPx?: boolean | RemToPxOptions
+}
+```
+
+<br></details>
+
+## Details
+
+<details>
+<summary>Expand it see more details</summary><br>
+
+### extractors
+
+```ts
+// https://github.com/unocss/unocss/pull/2485
+// Support extract base64 image.
+export const extractors: Extractor[] = [
+  {
+    name: 'unocss-preset-zyyv-extractor-includes-base64',
+    order: 0,
+    extract({ code }) {
+      return [...new Set(code.split(/[\\:]?[\s'"`{}]|;(?!base64)+/g))]
+    },
+  },
+]
+```
+
+### postprocess
+
+```ts
+// https://github.com/unocss/unocss/discussions/2816
+// Extract rgba color in css variable.
+export function postprocessWithUnColor(unColor: string): Postprocessor {
+  return (util) => {
+    util.entries.forEach((i) => {
+      const value = i[1]
+      if (typeof value === 'string') {
+        const match = value.match(rgbaRE)
+        if (match != null) {
+          i[1] = value.replace(rgbaRE, `rgba(var(${unColor}),$2)`)
+          util.entries.unshift([unColor, match[1]])
+        }
+      }
+    })
+  }
+}
+```
+
+### rules
+
+```ts
+// Use any css variable easily.
+export const rules: Rule[] = [
+  [/^(.+)::(.+)$/, ([, n, v], { theme }) => {
+    const color = parseColor(v, theme)
+    if (color?.cssColor?.type === 'rgb' && color.cssColor.components) {
+      return {
+        [`--${n}`]: `${color.cssColor.components.join(',')}`,
+      }
+    }
+    return {
+      [`--${n}`]: v,
+    }
+  }],
+]
+```
+
+### shortcuts
+
+```ts
+// FYI. My own shortcuts.
+const _shortcuts: CustomStaticShortcuts = [
+  // position
+  ['pr', 'relative'],
+  ['pa', 'absolute'],
+  ['pf', 'fixed'],
+  ['ps', 'sticky'],
+
+  // position layout
+  [['pxc', 'p-x-c'], 'pa left-1/2 -translate-x-1/2'],
+  [['pyc', 'p-y-c'], 'pa top-1/2 -translate-y-1/2'],
+  [['pcc', 'pc', 'p-c', 'p-c-c'], 'pxc pyc'],
+
+  // flex layout
+  [['f-c', 'fcc'], 'flex justify-center items-center'],
+  [['f-c-c', 'fccc'], 'f-c flex-col'],
+  [['fc', 'fxc', 'f-x-c'], 'flex justify-center'],
+  [['fi', 'fyc', 'f-y-c'], 'flex items-center'],
+  ['fs', 'flex justify-start'],
+  ['fsc', 'flex justify-start items-center'],
+  ['fse', 'flex justify-start items-end'],
+  ['fe', 'flex justify-end'],
+  ['fec', 'flex justify-end items-center'],
+  ['fb', 'flex justify-between'],
+  ['fbc', 'flex justify-between items-center'],
+  ['fa', 'flex justify-around'],
+  ['fac', 'flex justify-around items-center'],
+  ['fw', 'flex justify-wrap'],
+  ['fwr', 'flex justify-wrap-reverse'],
+
+  // transition
+  ['trans', 'transition-all-350 ease-linear'],
+]
+```
+
+### magic-animate
+
+```ts
+export function magicAnimate(): Theme['animation'] {
+  const keyframesObj = getKeyframes(magicCSS)
+
+  function generate<T = string>(val?: T): Record<string, T> {
+    return Object.keys(keyframesObj).reduce((acc, key) => {
+      const name = key.replace('@keyframes ', '')
+      // @ts-expect-error nothing
+      acc[name] = val ?? `{${cssObj2StrSync(keyframesObj[key])}}`
+      return acc
+    }, {})
+  }
+
+  return {
+    keyframes: generate(),
+    durations: generate('1s'),
+    properties: generate({ 'animation-fill-mode': 'both' }),
+  }
+}
+```
+
+<br></details>
+
+## License
+
+[MIT](./LICENSE) License © 2022 [zyyv](https://github.com/zyyv)

package/dist/dist-sozkiTde.mjs

@@ -0,0 +1,19 @@
+import { definePreset } from "@unocss/core";
+
+//#region ../../node_modules/.pnpm/@unocss+preset-rem-to-px@66.5.10/node_modules/@unocss/preset-rem-to-px/dist/index.mjs
+const remRE = /(-?[.\d]+)rem/g;
+const presetRemToPx = definePreset((options = {}) => {
+	const { baseFontSize = 16 } = options;
+	return {
+		name: "@unocss/preset-rem-to-px",
+		postprocess: (util) => {
+			util.entries.forEach((i) => {
+				const value = i[1];
+				if (typeof value === "string" && remRE.test(value)) i[1] = value.replace(remRE, (_, p1) => `${p1 * baseFontSize}px`);
+			});
+		}
+	};
+});
+
+//#endregion
+export { presetRemToPx as default, presetRemToPx };

package/dist/index.d.mts

@@ -0,0 +1,281 @@
+import * as _unocss_core0 from "@unocss/core";
+import { CSSObject, StaticShortcut } from "@unocss/core";
+import { UserConfig } from "unocss";
+import { AttributifyOptions } from "@unocss/preset-attributify";
+import { IconsOptions } from "@unocss/preset-icons";
+import { RemToPxOptions } from "@unocss/preset-rem-to-px";
+import { TagifyOptions } from "@unocss/preset-tagify";
+import { TypographyOptions } from "@unocss/preset-typography";
+import { WebFontsOptions } from "@unocss/preset-web-fonts";
+import { PresetWind3Options, Theme } from "@unocss/preset-wind3";
+import { PresetWind4Options, Theme as Theme$1 } from "@unocss/preset-wind4";
+import { CompileClassOptions } from "@unocss/transformer-compile-class";
+import { TransformerDirectivesOptions } from "@unocss/transformer-directives";
+import { TransformerVariantGroupOptions } from "@unocss/transformer-variant-group";
+import { ThemeAnimation } from "@unocss/preset-mini";
+
+//#region src/types.d.ts
+type CustomStaticShortcut = [string | string[], StaticShortcut[1]] | [string | string[], StaticShortcut[1], StaticShortcut[2]];
+type CustomStaticShortcuts = CustomStaticShortcut[];
+type Objectiable<T> = Record<string, T>;
+type CSSKeyframesRule = Objectiable<CSSObject>;
+interface ZyyvExtends extends Exclude<ZyyvTheme, 'extend'> {
+  keyframes?: Record<string, CSSKeyframesRule>;
+  /**
+   * Different from the original, you can use the following formats:
+   *
+   * ```ts
+   * { name : 'name duration timing-function iteration-count' }
+   * ```
+   */
+  animation?: Objectiable<string>;
+}
+interface ZyyvTheme extends Omit<Theme, 'container' | 'containers'>, Theme$1 {
+  extend?: ZyyvExtends;
+}
+interface PostprocessOptions {
+  /**
+   * Make all unitilities important.
+   *
+   * @default false
+   */
+  important?: boolean | ImportantOptions;
+  /**
+   * Extract rgba color in css variable, default key name is `--un-color`
+   *
+   * Only works when `wind3` is enabled
+   *
+   * @default false
+   */
+  unColor?: boolean | string;
+}
+type FilterPattern = Array<string | RegExp> | string | RegExp | null;
+interface ImportantOptions {
+  /**
+   * Make all unitilities important.
+   *
+   */
+  includes?: FilterPattern;
+  /**
+   * Make all unitilities important.
+   *
+   */
+  excludes?: FilterPattern;
+}
+interface ZyyvOptions {
+  /**
+   * Enable built-in postprocess
+   *
+   * @default false
+   */
+  postprocess?: boolean | PostprocessOptions;
+  shortcuts?: boolean | {
+    /**
+     * Enable default shortcuts
+     *
+     * @default true
+     */
+    default?: boolean;
+  };
+  /**
+   * Improve theme to be more useful, and align with Tailwind theme configuration
+   *
+   * - Add `animation` to theme, Expand theme animation name usage
+   *
+   * [ name, duration, timing-function, iteration-count ]
+   *
+   * @example
+   *
+   * ```ts
+   * theme: {
+   *   extend: {
+   *     animation: {
+   *      shape: 'shape 5s linear infinite'
+   *     },
+   *     // ...
+   *   }
+   * }
+   * ```
+   * You can choose to use special symbols as placeholders, to indicate whether to inject this property into the uno theme
+   *
+   * - `*` Abandon injection
+   * - `+` Injection, but the value is empty
+   *
+   * @example
+   *
+   * ```ts
+   * theme: {
+   *   extend: {
+   *     animation: {
+   *      foo: 'foo 1s * 3',
+   *      bar: 'bar 1s +',
+   *     },
+   *     // ...
+   *   }
+   * }
+   * ```
+   *
+   */
+  theme?: ZyyvTheme;
+  /**
+   * Enable the default preset for preset-wind3
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-wind3](https://unocss.dev/presets/wind3)
+   * @default false
+   */
+  wind3?: boolean | PresetWind3Options;
+  /**
+   * Enable the default preset for preset-wind4
+   * Only works when `presets` is not specified
+   *
+   * After v1.0.0, wind4 is the default preset
+   *
+   * @about [@unocss/preset-wind4](https://unocss.dev/presets/wind4)
+   * @default true
+   */
+  wind4?: boolean | PresetWind4Options;
+  /**
+   * Enable attributify mode and the options of it
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-attributify](https://unocss.dev/presets/attributify)
+   * @default false
+   */
+  attributify?: boolean | AttributifyOptions;
+  /**
+   * Enable icons preset and the options of it
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-icons](https://unocss.dev/presets/icons)
+   * @default false
+   */
+  icons?: boolean | IconsOptions;
+  /**
+   * Enable webFonts preset and the options of it
+   * Only works when `presets` is not specified
+   *
+   * **Note:** Default by [`fontsource`](https://fontsource.org/) provider
+   *
+   * @about [@unocss/preset-web-fonts](https://unocss.dev/presets/web-fonts)
+   * @default false
+   */
+  webFonts?: boolean | WebFontsOptions;
+  /**
+   * Enable typography preset and the options of it
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-typography](https://unocss.dev/presets/typography)
+   * @default false
+   */
+  typography?: boolean | TypographyOptions;
+  /**
+   * Enable tagify preset and the options of it
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-tagify](https://unocss.dev/presets/tagify)
+   * @default false
+   */
+  tagify?: boolean | TagifyOptions;
+  /**
+   * Enable remToPx preset and the options of it
+   * Only works when `presets` is not specified
+   *
+   * @about [@unocss/preset-rem-to-px](https://unocss.dev/presets/rem-to-px)
+   * @default false
+   */
+  remToPx?: boolean | RemToPxOptions;
+  /**
+   * Enable magicss preset
+   *
+   * @about [unocss-preset-magicss](https://github.com/unpreset/unocss-preset-magicss)
+   * @default false
+   */
+  magicss?: boolean;
+  /**
+   * Enable directives transformer and the options of it
+   *
+   * @about [@unocss/transformer-directives](https://unocss.dev/transformers/directives)
+   * @default true
+   */
+  directives?: boolean | TransformerDirectivesOptions;
+  /**
+   * Enables the variant group feature of Windi CSS for UnoCSS.
+   *
+   * @about [@unocss/transformer-variant-group](https://unocss.dev/transformers/variant-group)
+   * @default true
+   */
+  variantGroup?: boolean | TransformerVariantGroupOptions;
+  /**
+   * Compile group of classes into one class
+   *
+   * @about [@unocss/transformer-class-group](https://unocss.dev/transformers/compile-class)
+   * @default false
+   */
+  compileClass?: boolean | CompileClassOptions;
+}
+type DeepPartial<T> = { [P in keyof T]?: DeepPartial<T[P]> };
+//#endregion
+//#region src/utils.d.ts
+declare const animationRegExp: RegExp;
+/**
+ * Normalize custom animate usage to UnoCSS animations theme.
+ *
+ * ⚠️ You must strictly follow the following format. ⚠️
+ *
+ * [ name, duration, timing-function, iteration-count ]
+ *
+ * If you use * as placeholder, it will be ignored.
+ *
+ * [name, duration, *, iteration-count]
+ *
+ * If you use + as placeholder, it will be replaced with empty string.
+ *
+ * [name, duration, +, iteration-count]
+ *
+ * @example
+ *
+ * { animate: ['spin 1s linear infinite'] }
+ *
+ * Will be transformd:
+ *
+ * {
+ *   animate: ['spin 1s linear infinite'],
+ *   durations: {
+ *     spin: '1s',
+ *   },
+ *   timingFns: {
+ *     spin: 'linear',
+ *   },
+ *   counts: {
+ *     spin: 'infinite',
+ *   },
+ * }
+ */
+declare function resolveAnimation(extend_animation: Objectiable<string>): {
+  animation: ThemeAnimation;
+  shortcuts: CustomStaticShortcuts;
+};
+/**
+ * Deep merge two objects.
+ * @param original Original object
+ * @param patch Patch object
+ * @returns Merged object
+ */
+declare function deepMerge<T>(original: T, patch: DeepPartial<T>): T;
+declare function isObject(val: unknown): val is Record<any, any>;
+declare function getKeyframes(css: string): Record<string, Record<string, CSSObject>>;
+declare function cssObj2StrSync(style: Record<string, CSSObject>): string;
+declare function stringifyObj(obj: CSSObject): string;
+declare function cssObj2StrAsync(style: Record<string, CSSObject>): Promise<string>;
+declare function toArray<T>(val: T | T[]): T[];
+declare function camelToHyphen(str: string): string;
+//#endregion
+//#region src/index.d.ts
+declare const presetZyyv: _unocss_core0.PresetFactoryAwaitable<ZyyvTheme, ZyyvOptions>;
+declare const presetUseful: _unocss_core0.PresetFactoryAwaitable<ZyyvTheme, ZyyvOptions>;
+declare function defineConfig<T extends object = ZyyvTheme>(config: UserConfig<T>): UserConfig<T>;
+declare function defineZyyvConfig<T extends object = ZyyvTheme>(options?: ZyyvOptions, config?: UserConfig<T>): UserConfig<object>;
+declare const defineUsefulConfig: typeof defineZyyvConfig;
+//#endregion
+export { type ZyyvOptions, type ZyyvTheme, animationRegExp, camelToHyphen, cssObj2StrAsync, cssObj2StrSync, deepMerge, presetZyyv as default, presetZyyv, defineConfig, defineUsefulConfig, defineZyyvConfig, getKeyframes, isObject, presetUseful, resolveAnimation, stringifyObj, toArray };

package/dist/index.mjs

@@ -0,0 +1,447 @@
+import { definePreset, mergeConfigs, symbols, toArray as toArray$1 } from "@unocss/core";
+import postcss from "postcss";
+import postcssJs, { objectify } from "postcss-js";
+
+//#region src/core/extractors.ts
+const extractors = [{
+	name: "unocss-preset-zyyv-extractor-includes-base64",
+	order: 0,
+	extract({ code }) {
+		return [...new Set(code.split(/[\\:]?[\s'"`{}]|;(?!base64)+/g))];
+	}
+}];
+
+//#endregion
+//#region src/core/postprocess/important.ts
+function createFilter(include, exclude) {
+	const includePattern = toArray$1(include || []);
+	const excludePattern = toArray$1(exclude || []);
+	return (id) => {
+		if (excludePattern.some((p) => id.match(p))) return false;
+		return includePattern.some((p) => id.match(p));
+	};
+}
+function importantProcess(importantOptions) {
+	const keyFilter = createFilter(importantOptions.includes, importantOptions.excludes);
+	function nonKeysValidate(key) {
+		return !key.startsWith("$$") && ![
+			"syntax",
+			"initial-value",
+			"inherits"
+		].includes(key);
+	}
+	return (util) => {
+		for (const item of util.entries) if (keyFilter(item[0]) && nonKeysValidate(item[0])) {
+			if (item[1] != null && !String(item[1]).includes("!important")) item[1] += " !important";
+		}
+	};
+}
+
+//#endregion
+//#region src/core/postprocess/uncolor.ts
+const rgbRE = /rgb\(([\d\s]+?)\s*\/\s*([^)]+)\)/;
+const rgbaRE = /rgba\(([\d\s,]+),\s*([^)]+)\)/;
+function postprocessWithUnColor(unColor) {
+	return (util) => {
+		util.entries.forEach((i) => {
+			const value = i[1];
+			if (typeof value === "string") {
+				let match = value.match(rgbaRE);
+				if (match != null) {
+					i[1] = value.replace(rgbaRE, `rgba(var(${unColor}) , $2)`);
+					util.entries.unshift([unColor, match[1]]);
+				} else {
+					match = value.match(rgbRE);
+					if (match != null) {
+						i[1] = value.replace(rgbRE, `rgb(var(${unColor}) / $2)`);
+						util.entries.unshift([unColor, match[1].trim()]);
+					}
+				}
+			}
+		});
+	};
+}
+
+//#endregion
+//#region src/core/postprocess/index.ts
+function postprocess(options) {
+	const { unColor, important } = options;
+	return [unColor ? postprocessWithUnColor(unColor) : void 0, important ? importantProcess(important) : void 0].filter(Boolean);
+}
+
+//#endregion
+//#region src/core/preflights/index.ts
+function preflights() {
+	return [];
+}
+
+//#endregion
+//#region src/meta.ts
+const PRESET_NAME = "zyyv";
+const layerMeta = { layer: PRESET_NAME };
+
+//#endregion
+//#region src/core/rules.ts
+const rules = [[/^([^:]+)::(\S|[^:]+)$/, ([, k, v]) => {
+	return { [`--${k}`]: v };
+}], ["no-scrollbar", [{
+	"scrollbar-width": "none",
+	"-ms-overflow-style": "none"
+}, {
+	[symbols.selector]: (s) => `${s}::-webkit-scrollbar`,
+	display: "none"
+}]]];
+normalizeRuleMeta(layerMeta);
+function normalizeRuleMeta(ruleMeta) {
+	for (const r of rules) r[2] = Object.assign(r[2] || {}, ruleMeta);
+}
+
+//#endregion
+//#region src/core/shortcuts.ts
+const _shortcuts = [
+	["pr", "relative"],
+	["pa", "absolute"],
+	["pf", "fixed"],
+	["ps", "sticky"],
+	[["pxc", "p-x-c"], "pa left-1/2 -translate-x-1/2"],
+	[["pyc", "p-y-c"], "pa top-1/2 -translate-y-1/2"],
+	[[
+		"pcc",
+		"pc",
+		"p-c",
+		"p-c-c"
+	], "pxc pyc"],
+	[["fcc", "f-c"], "flex justify-center items-center"],
+	[["fccc", "f-c-c"], "f-c flex-col"],
+	[[
+		"fc",
+		"fxc",
+		"f-x-c"
+	], "flex justify-center"],
+	[[
+		"fi",
+		"fyc",
+		"f-y-c"
+	], "flex items-center"],
+	[["fs", "fxs"], "flex justify-start"],
+	["fsc", "flex justify-start items-center"],
+	["fse", "flex justify-start items-end"],
+	[["fe", "fxe"], "flex justify-end"],
+	["fec", "flex justify-end items-center"],
+	["fb", "flex justify-between"],
+	["fbc", "flex justify-between items-center"],
+	["fa", "flex justify-around"],
+	["fac", "flex justify-around items-center"],
+	["fw", "flex flex-wrap"],
+	["fwr", "flex flex-wrap-reverse"],
+	["trans", "transition-all-350 ease-DEFAULT"]
+];
+const shortcuts = normalizeShortcut(_shortcuts);
+normalizeShortcutMeta(layerMeta);
+function normalizeShortcutMeta(ruleMeta) {
+	for (const r of shortcuts) r[2] = Object.assign(r[2] || {}, ruleMeta);
+}
+function normalizeShortcut(shortcut) {
+	return shortcut.flatMap((s) => {
+		if (Array.isArray(s[0])) return s[0].map((i) => [
+			i,
+			s[1],
+			s[2]
+		]);
+		return [s];
+	});
+}
+
+//#endregion
+//#region src/core/theme/index.ts
+function nomarlizeTheme(theme) {
+	return { ...theme };
+}
+
+//#endregion
+//#region src/core/variants/active.ts
+const v_active = {
+	name: "@active",
+	match(matcher) {
+		if (!matcher.startsWith("@active")) return matcher;
+		return {
+			matcher: matcher.slice(8),
+			selector: (s) => `${s}.active`
+		};
+	}
+};
+
+//#endregion
+//#region src/core/variants/index.ts
+function variants(_options) {
+	return [v_active];
+}
+
+//#endregion
+//#region src/utils.ts
+const animationRegExp = /^([a-z-]+)\s+([0-9.]+m?s?|[*+])?\s?([a-z-]+(?:\([^)]+\))?|[*+])?\s*([a-z0-9-]+|[*+])?$/i;
+/**
+* Normalize custom animate usage to UnoCSS animations theme.
+*
+* ⚠️ You must strictly follow the following format. ⚠️
+*
+* [ name, duration, timing-function, iteration-count ]
+*
+* If you use * as placeholder, it will be ignored.
+*
+* [name, duration, *, iteration-count]
+*
+* If you use + as placeholder, it will be replaced with empty string.
+*
+* [name, duration, +, iteration-count]
+*
+* @example
+*
+* { animate: ['spin 1s linear infinite'] }
+*
+* Will be transformd:
+*
+* {
+*   animate: ['spin 1s linear infinite'],
+*   durations: {
+*     spin: '1s',
+*   },
+*   timingFns: {
+*     spin: 'linear',
+*   },
+*   counts: {
+*     spin: 'infinite',
+*   },
+* }
+*/
+function resolveAnimation(extend_animation) {
+	const animation = {};
+	const keys = [
+		"durations",
+		"timingFns",
+		"counts"
+	];
+	const shortcuts$1 = [];
+	for (const k in extend_animation) {
+		const match = extend_animation[k].match(animationRegExp);
+		if (match != null) {
+			const [, name, duration, timing, count] = match;
+			const values = [
+				duration,
+				timing,
+				count
+			];
+			if (name !== k) shortcuts$1.push([`animate-${k}`, `animate-${name}`]);
+			for (let i = 0; i < keys.length; i++) {
+				const key = keys[i];
+				const value = values[i];
+				if (value != null) {
+					if (value === "*") continue;
+					if (animation[key]) animation[key][name] = values[i] === "+" ? "" : values[i];
+					else animation[key] = { [name]: values[i] === "+" ? "" : values[i] };
+				}
+			}
+		}
+	}
+	return {
+		animation,
+		shortcuts: shortcuts$1
+	};
+}
+/**
+* Deep merge two objects.
+* @param original Original object
+* @param patch Patch object
+* @returns Merged object
+*/
+function deepMerge(original, patch) {
+	const o = original;
+	const p = patch;
+	if (Array.isArray(o) && Array.isArray(p)) return [...o, ...p];
+	if (Array.isArray(o)) return [...o];
+	const output = { ...o };
+	if (isObject(o) && isObject(p)) Object.keys(p).forEach((key) => {
+		if (isObject(p[key])) if (!(key in o)) Object.assign(output, { [key]: p[key] });
+		else output[key] = deepMerge(o[key], p[key]);
+		else Object.assign(output, { [key]: p[key] });
+	});
+	return output;
+}
+function isObject(val) {
+	return val !== null && typeof val === "object";
+}
+function getKeyframes(css) {
+	const obj = objectify(postcss.parse(css));
+	return Object.keys(obj).reduce((acc, key) => {
+		if (key.startsWith("@keyframes")) acc[key] = obj[key];
+		return acc;
+	}, {});
+}
+function cssObj2StrSync(style) {
+	return Object.keys(style).reduce((str, key) => {
+		return `${str}${key}${stringifyObj(style[key])}`;
+	}, "").replace(/\n/g, "");
+}
+function stringifyObj(obj) {
+	return `{${Object.keys(obj).reduce((str, key) => {
+		return `${str}${camelToHyphen(key)}:${obj[key]};`;
+	}, "")}}`;
+}
+async function cssObj2StrAsync(style) {
+	return postcss().process(style, { parser: postcssJs }).then((result) => result.css);
+}
+function toArray(val) {
+	return Array.isArray(val) ? val : [val];
+}
+function camelToHyphen(str) {
+	return str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
+}
+
+//#endregion
+//#region src/resolve.ts
+const defaultOptions = {
+	theme: {},
+	postprocess: {
+		important: false,
+		unColor: false
+	},
+	shortcuts: { default: true },
+	wind4: true,
+	wind3: false,
+	attributify: true,
+	icons: true,
+	webFonts: false,
+	typography: false,
+	tagify: false,
+	remToPx: false,
+	magicss: false,
+	directives: true,
+	variantGroup: true,
+	compileClass: false
+};
+const defaultPresetOptions = { webFonts: { provider: "fontsource" } };
+const defaultPostprocessOptions = {
+	important: {
+		excludes: [],
+		includes: [/.*/g]
+	},
+	unColor: "--un-color"
+};
+async function resolveOptions(options) {
+	const optionsWithDefault = Object.assign({}, defaultOptions, options);
+	if (optionsWithDefault.wind4 && optionsWithDefault.wind3) {
+		console.warn("wind3 and wind4 are mutually exclusive, only one can be enabled");
+		optionsWithDefault.wind3 = false;
+	}
+	if (optionsWithDefault.postprocess === true) optionsWithDefault.postprocess = defaultPostprocessOptions;
+	else if (typeof optionsWithDefault.postprocess === "object") {
+		if (typeof optionsWithDefault.postprocess.important === "object") optionsWithDefault.postprocess.important = {
+			...defaultPostprocessOptions.important,
+			...optionsWithDefault.postprocess.important
+		};
+		else if (optionsWithDefault.postprocess.important === true) optionsWithDefault.postprocess.important = defaultPostprocessOptions.important;
+		if (optionsWithDefault.postprocess.unColor === true) optionsWithDefault.postprocess.unColor = defaultPostprocessOptions.unColor;
+	} else optionsWithDefault.postprocess = {};
+	const presets = await resolvePresets(optionsWithDefault);
+	const transformers = await resolveTransformers(optionsWithDefault);
+	const { theme: t_theme, shortcuts: shortcuts$1 } = resolveExtend(optionsWithDefault.theme.extend ?? {});
+	const _theme = deepMerge(optionsWithDefault.theme, t_theme);
+	return {
+		...optionsWithDefault,
+		theme: nomarlizeTheme(_theme),
+		meta: {
+			presets,
+			shortcuts: shortcuts$1,
+			transformers
+		}
+	};
+}
+function resolveExtend(extend) {
+	const _shortcuts$1 = [];
+	const { animation, keyframes } = extend;
+	const { animation: resolvedAnimation, shortcuts: shortcuts$1 } = resolveAnimation(animation ?? {});
+	_shortcuts$1.push(...shortcuts$1);
+	resolvedAnimation.keyframes = {};
+	for (const key in keyframes) resolvedAnimation.keyframes[key] = `{${cssObj2StrSync(keyframes[key])}}`;
+	return {
+		theme: { animation: resolvedAnimation },
+		shortcuts: _shortcuts$1
+	};
+}
+async function resolvePresets(options) {
+	const presets = [];
+	const presetMap = {
+		wind3: import("unocss").then((m) => m.presetWind3),
+		wind4: import("unocss").then((m) => m.presetWind4),
+		attributify: import("unocss").then((m) => m.presetAttributify),
+		icons: import("unocss").then((m) => m.presetIcons),
+		webFonts: import("unocss").then((m) => m.presetWebFonts),
+		typography: import("unocss").then((m) => m.presetTypography),
+		tagify: import("unocss").then((m) => m.presetTagify),
+		remToPx: import("./dist-sozkiTde.mjs").then((m) => m.presetRemToPx),
+		magicss: import("unocss-preset-magicss").then((m) => m.presetMagicss)
+	};
+	for (const [key, preset] of Object.entries(presetMap)) {
+		const option = options[key];
+		if (option) {
+			const p = await preset;
+			const presetOptions = defaultPresetOptions[key];
+			if (typeof option === "object") presets.push(p({
+				...presetOptions,
+				...option
+			}));
+			else presets.push(p(presetOptions ?? {}));
+		}
+	}
+	return presets;
+}
+async function resolveTransformers(options) {
+	const transformers = [];
+	const transformerMap = {
+		directives: import("unocss").then((m) => m.transformerDirectives),
+		variantGroup: import("unocss").then((m) => m.transformerVariantGroup),
+		compileClass: import("unocss").then((m) => m.transformerCompileClass)
+	};
+	for (const [key, transformer] of Object.entries(transformerMap)) {
+		const option = options[key];
+		if (option) {
+			const t = await transformer;
+			transformers.push(t(typeof option === "boolean" ? {} : option));
+		}
+	}
+	return transformers;
+}
+
+//#endregion
+//#region src/index.ts
+const presetZyyv = definePreset(async (options) => {
+	const resolvedOptions = await resolveOptions(options ?? {});
+	const { theme, meta, shortcuts: userShortcuts } = resolvedOptions;
+	const shortcuts$1 = userShortcuts === true || typeof userShortcuts === "object" && userShortcuts.default !== false ? shortcuts : [];
+	return {
+		name: `unocss-preset-${PRESET_NAME}`,
+		layers: { [PRESET_NAME]: 2 },
+		rules,
+		theme,
+		variants: variants(resolvedOptions),
+		shortcuts: shortcuts$1,
+		extractors,
+		postprocess: postprocess(resolvedOptions.postprocess),
+		presets: meta.presets,
+		transformers: meta.transformers,
+		preflights: preflights(),
+		options: resolvedOptions
+	};
+});
+const presetUseful = presetZyyv;
+var src_default = presetZyyv;
+function defineConfig(config) {
+	return config;
+}
+function defineZyyvConfig(options = {}, config = {}) {
+	return mergeConfigs([defineConfig({ presets: [presetZyyv(options)] }), config]);
+}
+const defineUsefulConfig = defineZyyvConfig;
+
+//#endregion
+export { animationRegExp, camelToHyphen, cssObj2StrAsync, cssObj2StrSync, deepMerge, src_default as default, defineConfig, defineUsefulConfig, defineZyyvConfig, getKeyframes, isObject, presetUseful, presetZyyv, resolveAnimation, stringifyObj, toArray };

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "unocss-preset-zyyv",
+  "type": "module",
+  "version": "2.0.0-beta.1",
+  "description": "My useful preset about unocss usage.",
+  "author": "Chris <https://github.com/zyyv>",
+  "license": "MIT",
+  "homepage": "https://github.com/unocss-community/unocss-preset-zyyv#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/unocss-community/unocss-preset-zyyv.git"
+  },
+  "bugs": {
+    "url": "https://github.com/unocss-community/unocss-preset-zyyv/issues"
+  },
+  "keywords": [
+    "unocss",
+    "unocss-community",
+    "unocss-preset",
+    "unocss-preset-zyyv"
+  ],
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.mts",
+      "import": "./dist/index.mjs"
+    }
+  },
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
+  "typesVersions": {
+    "*": {
+      "*": [
+        "./dist/*",
+        "./dist/index.d.ts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "unocss": "^0.65.0 || >=65.4.0"
+  },
+  "peerDependenciesMeta": {
+    "unocss": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@unocss/core": "^66.5.10",
+    "postcss": "^8.5.6",
+    "postcss-js": "^5.0.2",
+    "unocss-preset-magicss": "^1.0.1"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "stub": "tsdown --watch"
+  }
+}