@unocss/preset-mini 0.16.3 → 0.16.4

package/dist/chunks/default2.mjs

@@ -1,6 +1,6 @@
 import { hex2rgba, toArray } from '@unocss/core';
-import { h as handler, d as directionMap, c as cornerMap, a as capitalize, x as xyzMap } from './index.mjs';
-import { C as CONTROL_BYPASS_PSEUDO } from './pseudo.mjs';
+import { h as handler, d as directionMap, c as cornerMap, a as capitalize, b as directionSize, x as xyzMap } from './utilities.mjs';
+import { C as CONTROL_BYPASS_PSEUDO_CLASS } from './pseudo.mjs';
 
 const verticalAlignAlias = {
   mid: "middle",
@@ -19,7 +19,8 @@ const textAligns = [
 
 const parseColorUtil = (body, theme) => {
   const [main, opacity2] = body.split(/(?:\/|:)/);
-  const [name, no = "DEFAULT"] = main.replace(/([a-z])([0-9])/g, "$1-$2").split(/-/g);
+  const colors = main.replace(/([a-z])([0-9])/g, "$1-$2").split(/-/g);
+  const [name] = colors;
   if (!name)
     return;
   let color;
@@ -30,8 +31,16 @@ const parseColorUtil = (body, theme) => {
   if (bracketOrMain.startsWith("hex-"))
     color = bracketOrMain.slice(4);
   color = color || bracket;
+  let no = "DEFAULT";
   if (!color) {
-    const colorData = theme.colors?.[name];
+    let colorData = theme.colors?.[name];
+    if (colorData) {
+      [, no = no] = colors;
+    } else {
+      if (colors.slice(-1)[0].match(/^\d+$/))
+        no = colors.pop();
+      colorData = theme.colors?.[colors.join("-").replace(/(-[a-z])/g, (n) => n.slice(1).toUpperCase())];
+    }
     if (typeof colorData === "string")
       color = colorData;
     else if (no && colorData)
@@ -94,16 +103,136 @@ const ringOffsetColors = [
   [/^ring-offset-(.+)$/, colorResolver$1("--un-ring-offset-color", "ring-offset")],
   [/^ring-offset-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity2) })]
 ];
-const fillColors = [
-  ["fill-none", { fill: "none" }],
-  [/^fill-(.+)$/, colorResolver$1("fill", "fill")],
-  [/^fill-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity2) })]
+
+const cssBasicProps = [
+  "color",
+  "border-color",
+  "background-color",
+  "flex-grow",
+  "flex",
+  "flex-shrink",
+  "caret-color",
+  "font",
+  "gap",
+  "opacity",
+  "visibility",
+  "z-index",
+  "font-weight",
+  "zoom",
+  "text-shadow",
+  "transform",
+  "box-shadow"
+];
+const cssPositionProps = [
+  "backround-position",
+  "left",
+  "right",
+  "top",
+  "bottom",
+  "object-position"
+];
+const cssSizeProps = [
+  "max-height",
+  "min-height",
+  "max-width",
+  "min-width",
+  "height",
+  "width",
+  "border-width",
+  "margin",
+  "padding",
+  "outline-width",
+  "outline-offset",
+  "font-size",
+  "line-height",
+  "text-indent",
+  "vertical-align",
+  "border-spacing",
+  "letter-spacing",
+  "word-spacing"
+];
+const cssEnhanceProps = ["stroke", "filter", "backdrop-filter", "fill", "mask", "mask-size", "mask-border", "clip-path", "clip"];
+const cssProps = [
+  ...cssBasicProps,
+  ...cssPositionProps,
+  ...cssSizeProps,
+  ...cssEnhanceProps
+];
+const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
+const displays = [
+  ["inline", { display: "inline" }],
+  ["block", { display: "block" }],
+  ["inline-block", { display: "inline-block" }],
+  ["contents", { display: "contents" }],
+  ["flow-root", { display: "flow-root" }],
+  ["list-item", { display: "list-item" }],
+  ["hidden", { display: "none" }]
+];
+const appearances = [
+  ["visible", { visibility: "visible" }],
+  ["invisible", { visibility: "hidden" }],
+  ["backface-visible", { "backface-visibility": "visible" }],
+  ["backface-hidden", { "backface-visibility": "hidden" }]
+];
+const cursors = [
+  [/^cursor-(.+)$/, ([, c]) => ({ cursor: c })]
+];
+const pointerEvents = [
+  ["pointer-events-none", { "pointer-events": "none" }],
+  ["pointer-events-auto", { "pointer-events": "auto" }]
+];
+const resizes = [
+  ["resize-none", { resize: "none" }],
+  ["resize-x", { resize: "horizontal" }],
+  ["resize-y", { resize: "vertical" }],
+  ["resize", { resize: "both" }]
+];
+const userSelects = [
+  [/^select-(none|text|all|auto)$/, ([, v]) => ({ "user-select": v })]
+];
+const whitespaces = [
+  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
+];
+const contents = [
+  ["content-empty", { content: '""' }]
+];
+const breaks = [
+  ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
+  ["break-word", { "overflow-wrap": "break-word" }],
+  ["break-all", { "word-break": "break-all" }]
+];
+const textOverflows = [
+  ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
+  ["text-ellipsis", { "text-overflow": "ellipsis" }],
+  ["text-clip", { "text-overflow": "clip" }]
+];
+const textTransforms = [
+  ["case-upper", { "text-transform": "uppercase" }],
+  ["case-lower", { "text-transform": "lowercase" }],
+  ["case-capital", { "text-transform": "capitalize" }],
+  ["case-normal", { "text-transform": "none" }]
+];
+const fontStyles = [
+  ["italic", { "font-style": "italic" }],
+  ["not-italic", { "font-style": "normal" }]
+];
+const fontSmoothings = [
+  ["antialiased", {
+    "-webkit-font-smoothing": "antialiased",
+    "-moz-osx-font-smoothing": "grayscale",
+    "font-smoothing": "grayscale"
+  }],
+  ["subpixel-antialiased", {
+    "-webkit-font-smoothing": "auto",
+    "-moz-osx-font-smoothing": "auto",
+    "font-smoothing": "auto"
+  }]
 ];
 
 const outlineStyle = ["none", "auto", "dotted", "dashed", "solid", "double", "groove", "ridge", "inset", "outset", "inherit", "initial", "revert", "unset"];
 const parseOutlineSize = (s) => {
   const propName = ["width", "offset"].find((item) => s.startsWith(item)) || "width";
-  const size = handler.bracket.fraction.rem(s.replace(/^(offset\-|width\-)/, ""));
+  const size = handler.bracket.fraction.rem(s.replace(/^(offset\-|width\-|size\-)/, ""));
   if (size) {
     return {
       [`outline-${propName}`]: size
@@ -128,15 +257,15 @@ const outline = [
           "outline-style": d
         };
       }
-      const sizeSheet = parseOutlineSize(d);
-      if (sizeSheet)
-        return sizeSheet;
       const colorSheet = colorResolver$1("outline-color", "outline-color")([
         match[0],
         match[1].replace(/^color-/, "")
       ], config);
       if (colorSheet)
         return colorSheet;
+      const sizeSheet = parseOutlineSize(d);
+      if (sizeSheet)
+        return sizeSheet;
     }
   ]
 ];
@@ -161,6 +290,19 @@ const placeholder = [
     }
   ]
 ];
+const cssPropsStr = cssProps.join(", ");
+const validateProperty$1 = (prop) => {
+  if (prop && !cssProps.includes(prop))
+    return;
+  return prop || cssPropsStr;
+};
+const willChange = [
+  [/^will-change-(.*)/, ([, p]) => {
+    const w = validateProperty$1(p) || handler.global(p);
+    if (w)
+      return { "will-change": w };
+  }]
+];
 
 const borders = [
   [/^border$/, handlerBorder],
@@ -216,64 +358,10 @@ function handlerRounded([, a, b], { theme }) {
     return cornerMap[d].map((i) => [`border${i}-radius`, v]);
 }
 
-const transitionBasicProps = [
-  "color",
-  "border-color",
-  "background-color",
-  "flex-grow",
-  "flex",
-  "flex-shrink",
-  "caret-color",
-  "font",
-  "gap",
-  "opacity",
-  "visibility",
-  "z-index",
-  "font-weight",
-  "zoom",
-  "text-shadow",
-  "transform",
-  "box-shadow"
-];
-const transitionPositionProps = [
-  "backround-position",
-  "left",
-  "right",
-  "top",
-  "bottom",
-  "object-position"
-];
-const transitionSizeProps = [
-  "max-height",
-  "min-height",
-  "max-width",
-  "min-width",
-  "height",
-  "width",
-  "border-width",
-  "margin",
-  "padding",
-  "outline-width",
-  "outline-offset",
-  "font-size",
-  "line-height",
-  "text-indent",
-  "vertical-align",
-  "border-spacing",
-  "letter-spacing",
-  "word-spacing"
-];
 const transitionSwitchProps = ["all", "none"];
-const transitionEnhanceProps = ["stroke", "filter", "backdrop-filter", "fill", "mask", "mask-size", "mask-border", "clip-path", "clip"];
-const transitionProps = [
-  ...transitionBasicProps,
-  ...transitionPositionProps,
-  ...transitionSizeProps,
-  ...transitionEnhanceProps
-];
-const transitionPropsStr = transitionProps.join(", ");
+const transitionPropsStr = cssProps.join(", ");
 const validateProperty = (prop) => {
-  if (prop && ![...transitionProps, ...transitionSwitchProps].includes(prop))
+  if (prop && ![...cssProps, ...transitionSwitchProps].includes(prop))
     return;
   return prop || transitionPropsStr;
 };
@@ -598,8 +686,8 @@ const rings = [
         "--un-ring-color": "rgba(59, 130, 246, .5)",
         "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
         "--un-ring-shadow": `var(--un-ring-inset) 0 0 0 calc(${value} + var(--un-ring-offset-width)) var(--un-ring-color)`,
-        "-webkit-box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000);",
-        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000);"
+        "-webkit-box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)",
+        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
       };
     }
   }],
@@ -679,11 +767,6 @@ const aspectRatio = [
   }]
 ];
 
-const directionSize = (prefix) => ([_, direction, size]) => {
-  const v = handler.bracket.rem.fraction.cssvar(size);
-  if (v)
-    return directionMap[direction].map((i) => [prefix + i, v]);
-};
 const paddings = [
   [/^pa?()-?(-?.+)$/, directionSize("padding")],
   [/^p-?([xy])-?(-?.+)$/, directionSize("padding")],
@@ -695,84 +778,13 @@ const margins = [
   [/^m-?([rltbse])-?(-?.+)$/, directionSize("margin")]
 ];
 
-const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
-const displays = [
-  ["inline", { display: "inline" }],
-  ["block", { display: "block" }],
-  ["inline-block", { display: "inline-block" }],
-  ["contents", { display: "contents" }],
-  ["flow-root", { display: "flow-root" }],
-  ["list-item", { display: "list-item" }],
-  ["hidden", { display: "none" }]
-];
-const appearances = [
-  ["visible", { visibility: "visible" }],
-  ["invisible", { visibility: "hidden" }],
-  ["backface-visible", { "backface-visibility": "visible" }],
-  ["backface-hidden", { "backface-visibility": "hidden" }]
-];
-const cursors = [
-  [/^cursor-(.+)$/, ([, c]) => ({ cursor: c })]
-];
-const pointerEvents = [
-  ["pointer-events-none", { "pointer-events": "none" }],
-  ["pointer-events-auto", { "pointer-events": "auto" }]
-];
-const resizes = [
-  ["resize-none", { resize: "none" }],
-  ["resize-x", { resize: "horizontal" }],
-  ["resize-y", { resize: "vertical" }],
-  ["resize", { resize: "both" }]
-];
-const userSelects = [
-  [/^select-(none|text|all|auto)$/, ([, v]) => ({ "user-select": v })]
-];
-const whitespaces = [
-  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
-];
-const contents = [
-  ["content-empty", { content: '""' }]
-];
-const breaks = [
-  ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
-  ["break-word", { "overflow-wrap": "break-word" }],
-  ["break-all", { "word-break": "break-all" }]
-];
-const textOverflows = [
-  ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
-  ["text-ellipsis", { "text-overflow": "ellipsis" }],
-  ["text-clip", { "text-overflow": "clip" }]
-];
-const textTransforms = [
-  ["case-upper", { "text-transform": "uppercase" }],
-  ["case-lower", { "text-transform": "lowercase" }],
-  ["case-capital", { "text-transform": "capitalize" }],
-  ["case-normal", { "text-transform": "none" }]
-];
-const fontStyles = [
-  ["italic", { "font-style": "italic" }],
-  ["not-italic", { "font-style": "normal" }]
-];
-const fontSmoothings = [
-  ["antialiased", {
-    "-webkit-font-smoothing": "antialiased",
-    "-moz-osx-font-smoothing": "grayscale",
-    "font-smoothing": "grayscale"
-  }],
-  ["subpixel-antialiased", {
-    "-webkit-font-smoothing": "auto",
-    "-moz-osx-font-smoothing": "auto",
-    "font-smoothing": "auto"
-  }]
-];
-
 const transformGpu = {
   transform: "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z))",
-  [CONTROL_BYPASS_PSEUDO]: ""
+  [CONTROL_BYPASS_PSEUDO_CLASS]: ""
 };
 const transformCpu = {
   transform: "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z))",
-  [CONTROL_BYPASS_PSEUDO]: ""
+  [CONTROL_BYPASS_PSEUDO_CLASS]: ""
 };
 const transformBase = {
   "--un-rotate": 0,
@@ -789,11 +801,12 @@ const transformBase = {
 const transforms = [
   ["transform", transformBase],
   [/^preserve-(3d|flat)$/, ([, value]) => ({ "transform-style": value === "3d" ? `preserve-${value}` : value })],
-  [/^translate()-([^-]+)$/, handleTranslate],
-  [/^translate-([xyz])-([^-]+)$/, handleTranslate],
-  [/^scale()-([^-]+)$/, handleScale],
-  [/^scale-([xyz])-([^-]+)$/, handleScale],
-  [/^rotate-([^-]+)(?:deg)?$/, handleRotate],
+  [/^translate()-(.+)$/, handleTranslate],
+  [/^translate-([xyz])-(.+)$/, handleTranslate],
+  [/^scale()-(.+)$/, handleScale],
+  [/^scale-([xyz])-(.+)$/, handleScale],
+  [/^rotate-(.+)$/, handleRotate],
+  [/^rotate-((?!\[)[^-]+?)(?:deg)?$/, handleRotateWithUnit],
   ["transform-gpu", transformGpu],
   ["transform-cpu", transformCpu],
   ["transform-none", { transform: "none" }],
@@ -829,7 +842,7 @@ function handleScale([, d, b]) {
     ];
   }
 }
-function handleRotate([, b]) {
+function handleRotateWithUnit([, b]) {
   const v = handler.bracket.number(b);
   if (v != null) {
     return [
@@ -838,6 +851,15 @@ function handleRotate([, b]) {
     ];
   }
 }
+function handleRotate([, b]) {
+  const v = handler.bracket(b);
+  if (v != null) {
+    return [
+      transformBase,
+      { "--un-rotate": v }
+    ];
+  }
+}
 
 const variablesAbbrMap = {
   "visible": "visibility",
@@ -921,6 +943,20 @@ const textDecorations = [
   [/^(?:underline|decoration)-op(?:acity)?-?(.+)$/m, ([, opacity]) => ({ "--un-line-opacity": handler.bracket.percent(opacity) })]
 ];
 
+const svgUtilities = [
+  [/^fill-(.+)$/, colorResolver$1("fill", "fill")],
+  [/^fill-op(?:acity)?-?(.+)$/m, ([, opacity]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity) })],
+  ["fill-none", { fill: "none" }],
+  [/^stroke-(?:size-|width-)?(.+)$/, ([, s]) => {
+    const v = handler.bracket.fraction.px.number(s);
+    if (v)
+      return { "stroke-width": v };
+  }],
+  [/^stroke-(.+)$/, colorResolver$1("stroke", "stroke")],
+  [/^stroke-op(?:acity)?-?(.+)$/m, ([, opacity]) => ({ "--un-stroke-opacity": handler.bracket.percent(opacity) })],
+  ["stroke-none", { stroke: "none" }]
+];
+
 const rules = [
   cssVariables,
   paddings,
@@ -928,7 +964,7 @@ const rules = [
   displays,
   opacity,
   bgColors,
-  fillColors,
+  svgUtilities,
   borders,
   contents,
   fonts,
@@ -974,7 +1010,8 @@ const rules = [
   boxSizing,
   transitions,
   transforms,
+  willChange,
   questionMark
 ].flat(1);
 
-export { tabSizes as $, floats as A, zIndexes as B, boxSizing as C, questionMark as D, rings as E, boxShadows as F, sizes as G, aspectRatio as H, paddings as I, margins as J, varEmpty as K, displays as L, appearances as M, cursors as N, pointerEvents as O, resizes as P, userSelects as Q, whitespaces as R, contents as S, breaks as T, textOverflows as U, textTransforms as V, fontStyles as W, fontSmoothings as X, transforms as Y, transitions as Z, fonts as _, appearance as a, textIndents as a0, textStrokes as a1, textShadows as a2, cssVariables as a3, textDecorations as a4, borders as b, parseColorUtil as c, colorResolver$1 as d, opacity as e, textColors as f, bgColors as g, borderColors as h, ringColors as i, ringOffsetColors as j, fillColors as k, flex as l, gaps as m, grids as n, outline as o, placeholder as p, overflows as q, rules as r, positions as s, textAligns as t, justifies as u, verticalAligns as v, orders as w, alignments as x, placements as y, insets as z };
+export { transitions as $, floats as A, zIndexes as B, boxSizing as C, questionMark as D, rings as E, boxShadows as F, sizes as G, aspectRatio as H, paddings as I, margins as J, cssProps as K, varEmpty as L, displays as M, appearances as N, cursors as O, pointerEvents as P, resizes as Q, userSelects as R, whitespaces as S, contents as T, breaks as U, textOverflows as V, textTransforms as W, fontStyles as X, fontSmoothings as Y, svgUtilities as Z, transforms as _, appearance as a, fonts as a0, tabSizes as a1, textIndents as a2, textStrokes as a3, textShadows as a4, cssVariables as a5, textDecorations as a6, borders as b, parseColorUtil as c, colorResolver$1 as d, opacity as e, textColors as f, bgColors as g, borderColors as h, ringColors as i, ringOffsetColors as j, flex as k, gaps as l, grids as m, overflows as n, outline as o, placeholder as p, positions as q, rules as r, justifies as s, textAligns as t, orders as u, verticalAligns as v, willChange as w, alignments as x, placements as y, insets as z };

package/dist/chunks/default3.cjs

@@ -37,10 +37,13 @@ const variantBreakpoints = (matcher, _, theme) => {
   }
 };
 
-const variantChildren = [
-  variants$1.variantMatcher("children", (input) => `${input} > *`),
+const variantCombinators = [
   variants$1.variantMatcher("all", (input) => `${input} *`),
-  variants$1.variantMatcher("next", (input) => `${input}+*`)
+  variants$1.variantMatcher("children", (input) => `${input}>*`),
+  variants$1.variantMatcher("next", (input) => `${input}+*`),
+  variants$1.variantMatcher("sibling", (input) => `${input}+*`),
+  variants$1.variantMatcher("siblings", (input) => `${input}~*`),
+  variants$1.variantMatcher("svg", (input) => `${input} svg *`)
 ];
 
 const variantColorsClass = [
@@ -115,15 +118,15 @@ const variants = [
   variantNegative,
   variantImportant,
   variantBreakpoints,
-  ...variantChildren,
+  ...variantCombinators,
   pseudo.variantPseudoClasses,
   pseudo.variantPseudoElements
 ];
 
 exports.variantBreakpoints = variantBreakpoints;
-exports.variantChildren = variantChildren;
 exports.variantColorsClass = variantColorsClass;
 exports.variantColorsMedia = variantColorsMedia;
+exports.variantCombinators = variantCombinators;
 exports.variantImportant = variantImportant;
 exports.variantNegative = variantNegative;
 exports.variantSpace = variantSpace;

package/dist/chunks/default3.mjs

@@ -35,10 +35,13 @@ const variantBreakpoints = (matcher, _, theme) => {
   }
 };
 
-const variantChildren = [
-  variantMatcher("children", (input) => `${input} > *`),
+const variantCombinators = [
   variantMatcher("all", (input) => `${input} *`),
-  variantMatcher("next", (input) => `${input}+*`)
+  variantMatcher("children", (input) => `${input}>*`),
+  variantMatcher("next", (input) => `${input}+*`),
+  variantMatcher("sibling", (input) => `${input}+*`),
+  variantMatcher("siblings", (input) => `${input}~*`),
+  variantMatcher("svg", (input) => `${input} svg *`)
 ];
 
 const variantColorsClass = [
@@ -113,9 +116,9 @@ const variants = [
   variantNegative,
   variantImportant,
   variantBreakpoints,
-  ...variantChildren,
+  ...variantCombinators,
   variantPseudoClasses,
   variantPseudoElements
 ];
 
-export { variantColorsMedia as a, variantColorsClass as b, variantBreakpoints as c, variantChildren as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };
+export { variantColorsMedia as a, variantColorsClass as b, variantBreakpoints as c, variantCombinators as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };

package/dist/chunks/pseudo.cjs

@@ -2,40 +2,42 @@
 
 const core = require('@unocss/core');
 
-const CONTROL_BYPASS_PSEUDO = "$$no-pseudo";
+const CONTROL_BYPASS_PSEUDO_CLASS = "$$no-pseudo";
 const PseudoClasses = Object.fromEntries([
+  "any-link",
+  "link",
+  "visited",
+  "target",
+  "hover",
   "active",
-  "checked",
-  "default",
-  "empty",
-  "enabled",
-  "disabled",
-  "first-of-type",
-  ["first", "first-child"],
   "focus-visible",
   "focus-within",
   "focus",
-  "hover",
-  "indeterminate",
-  "invalid",
-  "last-of-type",
-  ["last", "last-child"],
-  "link",
-  "only-child",
-  "only-of-type",
-  "optional",
-  "placeholder-shown",
+  "autofill",
+  "enabled",
+  "disabled",
   "read-only",
   "read-write",
+  "placeholder-shown",
+  "default",
+  "checked",
+  "indeterminate",
+  "valid",
+  "invalid",
   "required",
+  "optional",
   "root",
-  "target",
-  "valid",
-  "visited",
+  "empty",
   ["even-of-type", "nth-of-type(even)"],
   ["even", "nth-child(even)"],
   ["odd-of-type", "nth-of-type(odd)"],
-  ["odd", "nth-child(odd)"]
+  ["odd", "nth-child(odd)"],
+  "first-of-type",
+  ["first", "first-child"],
+  "last-of-type",
+  ["last", "last-child"],
+  "only-child",
+  "only-of-type"
 ].map(core.toArray));
 const PseudoElements = [
   "before",
@@ -48,19 +50,19 @@ const PseudoElementsRE = new RegExp(`^(${PseudoElements.join("|")})[:-]`);
 const PseudoClassesStr = Object.keys(PseudoClasses).join("|");
 const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
 const PseudoClassesNotRE = new RegExp(`^not-(${PseudoClassesStr})[:-]`);
-const PseudoClassesGroupRE = new RegExp(`^group-(${PseudoClassesStr})[:-]`);
-const PseudoClassesPeerRE = new RegExp(`^peer-(${PseudoClassesStr})[:-]`);
+const PseudoClassesGroupRE = new RegExp(`^group-((not-)?(${PseudoClassesStr}))[:-]`);
+const PseudoClassesPeerRE = new RegExp(`^peer-((not-)?(${PseudoClassesStr}))[:-]`);
 const variantPseudoElements = (input) => {
   const match = input.match(PseudoElementsRE);
   if (match) {
     return {
       matcher: input.slice(match[1].length + 1),
-      selector: (s, body) => shouldAdd(body) && `${s}::${match[1]}`
+      selector: (s) => `${s}::${match[1]}`
     };
   }
 };
 function shouldAdd(entires) {
-  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO) || void 0;
+  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
 }
 const variantPseudoClasses = {
   match: (input) => {
@@ -82,7 +84,9 @@ const variantPseudoClasses = {
     }
     match = input.match(PseudoClassesGroupRE);
     if (match) {
-      const pseudo = PseudoClasses[match[1]] || match[1];
+      let pseudo = PseudoClasses[match[3]] || match[3];
+      if (match[2])
+        pseudo = `not(:${pseudo})`;
       return {
         matcher: input.slice(match[1].length + 7),
         selector: (s, body) => shouldAdd(body) && s.includes(".group:") ? s.replace(/\.group:/, `.group:${pseudo}:`) : `.group:${pseudo} ${s}`
@@ -90,17 +94,19 @@ const variantPseudoClasses = {
     }
     match = input.match(PseudoClassesPeerRE);
     if (match) {
-      const pseudo = PseudoClasses[match[1]] || match[1];
+      let pseudo = PseudoClasses[match[3]] || match[3];
+      if (match[2])
+        pseudo = `not(:${pseudo})`;
       return {
         matcher: input.slice(match[1].length + 6),
-        selector: (s, body) => shouldAdd(body) && s.includes(".peer:") ? s.replace(/\.peer:/, `.peer:${pseudo}:`) : `.peer:${pseudo} ~ ${s}`
+        selector: (s, body) => shouldAdd(body) && s.includes(".peer:") ? s.replace(/\.peer:/, `.peer:${pseudo}:`) : `.peer:${pseudo}~${s}`
       };
     }
   },
   multiPass: true
 };
 
-exports.CONTROL_BYPASS_PSEUDO = CONTROL_BYPASS_PSEUDO;
+exports.CONTROL_BYPASS_PSEUDO_CLASS = CONTROL_BYPASS_PSEUDO_CLASS;
 exports.PseudoClasses = PseudoClasses;
 exports.variantPseudoClasses = variantPseudoClasses;
 exports.variantPseudoElements = variantPseudoElements;