@patternfly/react-tokens 5.0.0-alpha.9 → 5.0.0-prerelease.1

package/dist/esm/l_flex.d.ts

@@ -24,25 +24,83 @@ export const l_flex: {
       "name": "--pf-v5-l-flex--item--Order",
       "value": "0"
     },
-    "l_flex_spacer_base": {
-      "name": "--pf-v5-l-flex--spacer-base",
-      "value": "1rem",
+    "l_flex_spacer_column_base": {
+      "name": "--pf-v5-l-flex--spacer--column--base",
+      "value": "1.5rem",
       "values": [
-        "--pf-v5-global--spacer--md",
-        "$pf-v5-global--spacer--md",
-        "pf-size-prem(16px)",
-        "1rem"
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
       ]
     },
-    "l_flex_spacer": {
-      "name": "--pf-v5-l-flex--spacer",
-      "value": "1rem",
+    "l_flex_spacer_row_base": {
+      "name": "--pf-v5-l-flex--spacer--row--base",
+      "value": "0.5rem",
       "values": [
-        "--pf-v5-l-flex--spacer-base",
-        "--pf-v5-global--spacer--md",
-        "$pf-v5-global--spacer--md",
-        "pf-size-prem(16px)",
-        "1rem"
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--row--base",
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0"
+    },
+    "l_flex_m_gap_RowGap": {
+      "name": "--pf-v5-l-flex--m-gap--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--row--base",
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_m_gap_ColumnGap": {
+      "name": "--pf-v5-l-flex--m-gap--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--column--base",
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    },
+    "l_flex_m_row_gap_RowGap": {
+      "name": "--pf-v5-l-flex--m-row-gap--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--row--base",
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_m_column_gap_ColumnGap": {
+      "name": "--pf-v5-l-flex--m-column-gap--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--column--base",
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
       ]
     },
     "l_flex_spacer_none": {
@@ -130,22 +188,33 @@ export const l_flex: {
       ]
     }
   },
-  ".pf-v5-l-flex:last-child": {
-    "l_flex_spacer": {
-      "name": "--pf-v5-l-flex--spacer",
-      "value": "0"
-    }
-  },
   ".pf-v5-l-flex > *": {
     "l_flex_spacer": {
       "name": "--pf-v5-l-flex--spacer",
-      "value": "1rem",
+      "value": "initial"
+    },
+    "l_flex_spacer_column": {
+      "name": "--pf-v5-l-flex--spacer--column",
+      "value": "initial, 1.5rem",
       "values": [
-        "--pf-v5-l-flex--spacer-base",
-        "--pf-v5-global--spacer--md",
-        "$pf-v5-global--spacer--md",
-        "pf-size-prem(16px)",
-        "1rem"
+        "var(--pf-v5-l-flex--spacer, --pf-v5-l-flex--spacer--column--base)",
+        "initial, --pf-v5-l-flex--spacer--column--base",
+        "initial, --pf-v5-global--spacer--lg",
+        "initial, $pf-v5-global--spacer--lg",
+        "initial, pf-size-prem(24px)",
+        "initial, 1.5rem"
+      ]
+    },
+    "l_flex_spacer_row": {
+      "name": "--pf-v5-l-flex--spacer--row",
+      "value": "initial, 0.5rem",
+      "values": [
+        "var(--pf-v5-l-flex--spacer, --pf-v5-l-flex--spacer--row--base)",
+        "initial, --pf-v5-l-flex--spacer--row--base",
+        "initial, --pf-v5-global--spacer--sm",
+        "initial, $pf-v5-global--spacer--sm",
+        "initial, pf-size-prem(8px)",
+        "initial, 0.5rem"
       ]
     }
   },
@@ -161,6 +230,23 @@ export const l_flex: {
       "value": "inline-flex"
     }
   },
+  ".pf-v5-l-flex.pf-m-column": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0"
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-l-flex--spacer--column--base",
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
   ".pf-v5-l-flex.pf-m-space-items-none > *": {
     "l_flex_spacer": {
       "name": "--pf-v5-l-flex--spacer",
@@ -556,6 +642,472 @@ export const l_flex: {
         "5rem"
       ]
     }
+  },
+  ".pf-v5-l-flex.pf-m-gap": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-l-flex--m-gap--RowGap",
+        "--pf-v5-l-flex--spacer--row--base",
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-l-flex--m-gap--ColumnGap",
+        "--pf-v5-l-flex--spacer--column--base",
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-none": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0"
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0"
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-xs": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.25rem",
+      "values": [
+        "--pf-v5-global--spacer--xs",
+        "$pf-v5-global--spacer--xs",
+        "pf-size-prem(4px)",
+        "0.25rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0.25rem",
+      "values": [
+        "--pf-v5-global--spacer--xs",
+        "$pf-v5-global--spacer--xs",
+        "pf-size-prem(4px)",
+        "0.25rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-sm": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-md": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "1rem",
+      "values": [
+        "--pf-v5-global--spacer--md",
+        "$pf-v5-global--spacer--md",
+        "pf-size-prem(16px)",
+        "1rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1rem",
+      "values": [
+        "--pf-v5-global--spacer--md",
+        "$pf-v5-global--spacer--md",
+        "pf-size-prem(16px)",
+        "1rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-lg": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "2rem",
+      "values": [
+        "--pf-v5-global--spacer--xl",
+        "$pf-v5-global--spacer--xl",
+        "pf-size-prem(32px)",
+        "2rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "2rem",
+      "values": [
+        "--pf-v5-global--spacer--xl",
+        "$pf-v5-global--spacer--xl",
+        "pf-size-prem(32px)",
+        "2rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-2xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "3rem",
+      "values": [
+        "--pf-v5-global--spacer--2xl",
+        "$pf-v5-global--spacer--2xl",
+        "pf-size-prem(48px)",
+        "3rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "3rem",
+      "values": [
+        "--pf-v5-global--spacer--2xl",
+        "$pf-v5-global--spacer--2xl",
+        "pf-size-prem(48px)",
+        "3rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-3xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "4rem",
+      "values": [
+        "--pf-v5-global--spacer--3xl",
+        "$pf-v5-global--spacer--3xl",
+        "pf-size-prem(64px)",
+        "4rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "4rem",
+      "values": [
+        "--pf-v5-global--spacer--3xl",
+        "$pf-v5-global--spacer--3xl",
+        "pf-size-prem(64px)",
+        "4rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-gap-4xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "5rem",
+      "values": [
+        "--pf-v5-global--spacer--4xl",
+        "$pf-v5-global--spacer--4xl",
+        "pf-size-prem(80px)",
+        "5rem"
+      ]
+    },
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "5rem",
+      "values": [
+        "--pf-v5-global--spacer--4xl",
+        "$pf-v5-global--spacer--4xl",
+        "pf-size-prem(80px)",
+        "5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex:is(.pf-m-gap, .pf-m-gap-none, .pf-m-gap-xs, .pf-m-gap-sm, .pf-m-gap-md, .pf-m-gap-lg, .pf-m-gap-xl, .pf-m-gap-2xl, .pf-m-gap-3xl, .pf-m-gap-4xl) > *": {
+    "l_flex_spacer_row": {
+      "name": "--pf-v5-l-flex--spacer--row",
+      "value": "0"
+    },
+    "l_flex_spacer_column": {
+      "name": "--pf-v5-l-flex--spacer--column",
+      "value": "0"
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-l-flex--m-row-gap--RowGap",
+        "--pf-v5-l-flex--spacer--row--base",
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-none": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0"
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-xs": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.25rem",
+      "values": [
+        "--pf-v5-global--spacer--xs",
+        "$pf-v5-global--spacer--xs",
+        "pf-size-prem(4px)",
+        "0.25rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-sm": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-md": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "1rem",
+      "values": [
+        "--pf-v5-global--spacer--md",
+        "$pf-v5-global--spacer--md",
+        "pf-size-prem(16px)",
+        "1rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-lg": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "2rem",
+      "values": [
+        "--pf-v5-global--spacer--xl",
+        "$pf-v5-global--spacer--xl",
+        "pf-size-prem(32px)",
+        "2rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-2xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "3rem",
+      "values": [
+        "--pf-v5-global--spacer--2xl",
+        "$pf-v5-global--spacer--2xl",
+        "pf-size-prem(48px)",
+        "3rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-3xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "4rem",
+      "values": [
+        "--pf-v5-global--spacer--3xl",
+        "$pf-v5-global--spacer--3xl",
+        "pf-size-prem(64px)",
+        "4rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-row-gap-4xl": {
+    "l_flex_RowGap": {
+      "name": "--pf-v5-l-flex--RowGap",
+      "value": "5rem",
+      "values": [
+        "--pf-v5-global--spacer--4xl",
+        "$pf-v5-global--spacer--4xl",
+        "pf-size-prem(80px)",
+        "5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex:is(.pf-m-row-gap, .pf-m-row-gap-none, .pf-m-row-gap-xs, .pf-m-row-gap-sm, .pf-m-row-gap-md, .pf-m-row-gap-lg, .pf-m-row-gap-xl, .pf-m-row-gap-2xl, .pf-m-row-gap-3xl, .pf-m-row-gap-4xl) > *": {
+    "l_flex_spacer_row": {
+      "name": "--pf-v5-l-flex--spacer--row",
+      "value": "0"
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-l-flex--m-column-gap--ColumnGap",
+        "--pf-v5-l-flex--spacer--column--base",
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-none": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0"
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-xs": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0.25rem",
+      "values": [
+        "--pf-v5-global--spacer--xs",
+        "$pf-v5-global--spacer--xs",
+        "pf-size-prem(4px)",
+        "0.25rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-sm": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "0.5rem",
+      "values": [
+        "--pf-v5-global--spacer--sm",
+        "$pf-v5-global--spacer--sm",
+        "pf-size-prem(8px)",
+        "0.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-md": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1rem",
+      "values": [
+        "--pf-v5-global--spacer--md",
+        "$pf-v5-global--spacer--md",
+        "pf-size-prem(16px)",
+        "1rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-lg": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "1.5rem",
+      "values": [
+        "--pf-v5-global--spacer--lg",
+        "$pf-v5-global--spacer--lg",
+        "pf-size-prem(24px)",
+        "1.5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-xl": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "2rem",
+      "values": [
+        "--pf-v5-global--spacer--xl",
+        "$pf-v5-global--spacer--xl",
+        "pf-size-prem(32px)",
+        "2rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-2xl": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "3rem",
+      "values": [
+        "--pf-v5-global--spacer--2xl",
+        "$pf-v5-global--spacer--2xl",
+        "pf-size-prem(48px)",
+        "3rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-3xl": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "4rem",
+      "values": [
+        "--pf-v5-global--spacer--3xl",
+        "$pf-v5-global--spacer--3xl",
+        "pf-size-prem(64px)",
+        "4rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex.pf-m-column-gap-4xl": {
+    "l_flex_ColumnGap": {
+      "name": "--pf-v5-l-flex--ColumnGap",
+      "value": "5rem",
+      "values": [
+        "--pf-v5-global--spacer--4xl",
+        "$pf-v5-global--spacer--4xl",
+        "pf-size-prem(80px)",
+        "5rem"
+      ]
+    }
+  },
+  ".pf-v5-l-flex:is(.pf-m-column-gap, .pf-m-column-gap-none, .pf-m-column-gap-xs, .pf-m-column-gap-sm, .pf-m-column-gap-md, .pf-m-column-gap-lg, .pf-m-column-gap-xl, .pf-m-column-gap-2xl, .pf-m-column-gap-3xl, .pf-m-column-gap-4xl) > *": {
+    "l_flex_spacer_column": {
+      "name": "--pf-v5-l-flex--spacer--column",
+      "value": "0"
+    }
   }
 };
 export default l_flex;