@patternfly/design-tokens 1.0.1 → 1.0.3

package/build/css/_tokens-palette.scss

@@ -1,7 +1,7 @@
-/**
- * Do not edit directly
- * Generated on Wed, 14 Feb 2024 00:59:20 GMT
- */
+// /**
+//  * Do not edit directly
+//  * Generated on Thu, 21 Mar 2024 17:46:16 GMT
+//  */
 
 :root {
   --pf-t--color--red--70: #5f0000;

package/build.js

@@ -12,6 +12,7 @@ StyleDictionary.registerTransform({
     token.attributes.type === 'spacer' ||
     token.attributes.type === 'border' ||
     token.attributes.type === 'icon' ||
+    token.attributes.type === 'box-shadow' ||
     token.attributes.type === 'font',
   transformer: (token) => `${token.value}px`
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/design-tokens",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Define the design tokens for patternfly design system and component library",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -31,17 +31,17 @@
     "access": "public"
   },
   "dependencies": {
-    "@patternfly/react-core": "^6.0.0-alpha.5"
+    "@patternfly/react-core": "^6.0.0-alpha.36"
   },
   "peerDependencies": {
     "react": "^16.8 || ^17 || ^18",
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@patternfly/documentation-framework": "6.0.0-alpha.10",
-    "@patternfly/patternfly": "6.0.0-alpha.38",
-    "@patternfly/react-code-editor": "6.0.0-alpha.5",
-    "@patternfly/react-table": "6.0.0-alpha.5",
+    "@patternfly/documentation-framework": "6.0.0-alpha.12",
+    "@patternfly/patternfly": "6.0.0-alpha.91",
+    "@patternfly/react-code-editor": "6.0.0-alpha.36",
+    "@patternfly/react-table": "6.0.0-alpha.36",
     "rimraf": "^2.6.2",
     "@patternfly/patternfly-a11y": "^4.3.1",
     "react-monaco-editor": "^0.51.0",

package/tokens/dark/base.dark.json

@@ -6,7 +6,7 @@
         "color": {
           "100": {
             "type": "color",
-            "value": "{color.black}"
+            "value": "{color.gray.95}"
           },
           "200": {
             "type": "color",
@@ -24,6 +24,10 @@
             "type": "color",
             "value": "rgba(21, 21, 21, 0.8000)"
           },
+          "600": {
+            "type": "color",
+            "value": "rgba(199, 199, 199, 0.1500)"
+          },
           "highlight": {
             "100": {
               "type": "color",
@@ -127,11 +131,11 @@
           "custom": {
             "100": {
               "type": "color",
-              "value": "{color.teal.30}"
+              "value": "{color.teal.40}"
             },
             "200": {
               "type": "color",
-              "value": "{color.teal.20}"
+              "value": "{color.teal.30}"
             }
           }
         },
@@ -284,7 +288,7 @@
           },
           "200": {
             "type": "color",
-            "value": "{color.gray.40}"
+            "value": "{color.gray.30}"
           },
           "300": {
             "type": "color",
@@ -325,6 +329,14 @@
             "value": "{color.gray.90}"
           }
         }
+      },
+      "box-shadow": {
+        "color": {
+          "100": {
+            "type": "color",
+            "value": "rgba(0, 0, 0, 0.5000)"
+          }
+        }
       }
     }
   }

package/tokens/dark/semantic.dark.json

@@ -38,11 +38,11 @@
           },
           "hover": {
             "type": "color",
-            "value": "{global.background.color.action.plain.hover}"
+            "value": "{global.dark.background.color.200}"
           },
           "clicked": {
             "type": "color",
-            "value": "{global.background.color.action.plain.hover}"
+            "value": "{global.dark.background.color.200}"
           }
         },
         "action": {
@@ -53,11 +53,11 @@
             },
             "hover": {
               "type": "color",
-              "value": "{global.dark.background.color.200}"
+              "value": "{global.dark.background.color.600}"
             },
             "clicked": {
               "type": "color",
-              "value": "{global.dark.background.color.200}"
+              "value": "{global.dark.background.color.600}"
             },
             "alt": {
               "hover": {
@@ -137,20 +137,6 @@
         }
       },
       "status": {
-        "success": {
-          "default": {
-            "type": "color",
-            "value": "{global.dark.color.status.success.100}"
-          },
-          "hover": {
-            "type": "color",
-            "value": "{global.dark.color.status.success.200}"
-          },
-          "clicked": {
-            "type": "color",
-            "value": "{global.dark.color.status.success.200}"
-          }
-        },
         "unread": {
           "default": {
             "default": {
@@ -171,16 +157,30 @@
               "type": "color",
               "value": "{global.color.status.danger.default}"
             },
-            "clicked": {
-              "type": "color",
-              "value": "{global.color.status.danger.clicked}"
-            },
             "hover": {
               "type": "color",
               "value": "{global.color.status.danger.hover}"
+            },
+            "clicked": {
+              "type": "color",
+              "value": "{global.color.status.danger.clicked}"
             }
           }
         },
+        "success": {
+          "default": {
+            "type": "color",
+            "value": "{global.dark.color.status.success.100}"
+          },
+          "hover": {
+            "type": "color",
+            "value": "{global.dark.color.status.success.200}"
+          },
+          "clicked": {
+            "type": "color",
+            "value": "{global.dark.color.status.success.200}"
+          }
+        },
         "warning": {
           "default": {
             "type": "color",
@@ -851,6 +851,10 @@
           "type": "color",
           "value": "{global.background.color.primary.default}"
         },
+        "on-secondary": {
+          "type": "color",
+          "value": "{global.dark.border.color.200}"
+        },
         "nonstatus": {
           "red": {
             "default": {
@@ -1354,6 +1358,22 @@
           }
         }
       }
+    },
+    "box-shadow": {
+      "color": {
+        "sm": {
+          "type": "color",
+          "value": "{global.dark.box-shadow.color.100}"
+        },
+        "md": {
+          "type": "color",
+          "value": "{global.dark.box-shadow.color.100}"
+        },
+        "lg": {
+          "type": "color",
+          "value": "{global.dark.box-shadow.color.100}"
+        }
+      }
     }
   }
 }

package/tokens/default/base.dimension.json

@@ -166,6 +166,88 @@
         "type": "number",
         "value": 600
       }
+    },
+    "box-shadow": {
+      "X": {
+        "100": {
+          "type": "number",
+          "value": -8
+        },
+        "200": {
+          "type": "number",
+          "value": -4
+        },
+        "300": {
+          "type": "number",
+          "value": -1
+        },
+        "400": {
+          "type": "number",
+          "value": 0
+        },
+        "500": {
+          "type": "number",
+          "value": 1
+        },
+        "600": {
+          "type": "number",
+          "value": 4
+        },
+        "700": {
+          "type": "number",
+          "value": 8
+        }
+      },
+      "Y": {
+        "100": {
+          "type": "number",
+          "value": -8
+        },
+        "200": {
+          "type": "number",
+          "value": -4
+        },
+        "300": {
+          "type": "number",
+          "value": -1
+        },
+        "400": {
+          "type": "number",
+          "value": 0
+        },
+        "500": {
+          "type": "number",
+          "value": 1
+        },
+        "600": {
+          "type": "number",
+          "value": 4
+        },
+        "700": {
+          "type": "number",
+          "value": 8
+        }
+      },
+      "blur": {
+        "100": {
+          "type": "number",
+          "value": 2
+        },
+        "200": {
+          "type": "number",
+          "value": 8
+        },
+        "300": {
+          "type": "number",
+          "value": 24
+        }
+      },
+      "spread": {
+        "100": {
+          "type": "number",
+          "value": 0
+        }
+      }
     }
   }
 }

package/tokens/default/base.json

@@ -23,6 +23,10 @@
           "type": "color",
           "value": "rgba(21, 21, 21, 0.2000)"
         },
+        "600": {
+          "type": "color",
+          "value": "rgba(199, 199, 199, 0.2500)"
+        },
         "highlight": {
           "100": {
             "type": "color",
@@ -78,11 +82,11 @@
         "success": {
           "100": {
             "type": "color",
-            "value": "{color.green.50}"
+            "value": "{color.green.60}"
           },
           "200": {
             "type": "color",
-            "value": "{color.green.60}"
+            "value": "{color.green.70}"
           }
         },
         "warning": {
@@ -102,11 +106,11 @@
         "danger": {
           "100": {
             "type": "color",
-            "value": "{color.red-orange.50}"
+            "value": "{color.red-orange.60}"
           },
           "200": {
             "type": "color",
-            "value": "{color.red-orange.60}"
+            "value": "{color.red-orange.70}"
           },
           "300": {
             "type": "color",
@@ -126,11 +130,11 @@
         "custom": {
           "100": {
             "type": "color",
-            "value": "{color.teal.50}"
+            "value": "{color.teal.60}"
           },
           "200": {
             "type": "color",
-            "value": "{color.teal.60}"
+            "value": "{color.teal.70}"
           }
         }
       },
@@ -272,6 +276,10 @@
         "200": {
           "type": "color",
           "value": "{color.gray.40}"
+        },
+        "300": {
+          "type": "color",
+          "value": "{color.gray.50}"
         }
       }
     },
@@ -283,7 +291,7 @@
         },
         "200": {
           "type": "color",
-          "value": "{color.gray.50}"
+          "value": "{color.gray.60}"
         },
         "300": {
           "type": "color",
@@ -324,6 +332,18 @@
           "value": "{color.white}"
         }
       }
+    },
+    "box-shadow": {
+      "color": {
+        "100": {
+          "type": "color",
+          "value": "rgba(0, 0, 0, 0.1600)"
+        },
+        "200": {
+          "type": "color",
+          "value": "rgba(0, 0, 0, 0.1200)"
+        }
+      }
     }
   }
 }

package/tokens/default/chart.json

@@ -441,7 +441,7 @@
             }
           }
         },
-        "Multi-colored-ordered": {
+        "multi-colored-ordered": {
           "colorscale": {
             "100": {
               "type": "color",

package/tokens/default/semantic.dimension.json

@@ -29,6 +29,10 @@
         }
       },
       "width": {
+        "regular": {
+          "type": "number",
+          "value": "{global.border.width.100}"
+        },
         "divider": {
           "default": {
             "type": "number",
@@ -43,10 +47,6 @@
             "value": "{global.border.width.100}"
           }
         },
-        "regular": {
-          "type": "number",
-          "value": "{global.border.width.100}"
-        },
         "strong": {
           "type": "number",
           "value": "{global.border.width.200}"
@@ -197,21 +197,11 @@
           "type": "number",
           "value": "{global.icon.size.400}"
         },
+        "3xl": {
+          "type": "number",
+          "value": "{global.icon.size.500}"
+        },
         "font": {
-          "body": {
-            "sm": {
-              "type": "number",
-              "value": "{global.font.size.body.sm}"
-            },
-            "default": {
-              "type": "number",
-              "value": "{global.font.size.body.default}"
-            },
-            "lg": {
-              "type": "number",
-              "value": "{global.font.size.body.lg}"
-            }
-          },
           "heading": {
             "h1": {
               "type": "number",
@@ -238,6 +228,20 @@
               "value": "{global.font.size.heading.h6}"
             }
           },
+          "body": {
+            "sm": {
+              "type": "number",
+              "value": "{global.font.size.body.sm}"
+            },
+            "default": {
+              "type": "number",
+              "value": "{global.font.size.body.default}"
+            },
+            "lg": {
+              "type": "number",
+              "value": "{global.font.size.body.lg}"
+            }
+          },
           "xs": {
             "type": "number",
             "value": "{global.font.size.xs}"
@@ -270,10 +274,6 @@
             "type": "number",
             "value": "{global.font.size.4xl}"
           }
-        },
-        "3xl": {
-          "type": "number",
-          "value": "{global.icon.size.500}"
         }
       }
     },
@@ -378,6 +378,172 @@
         "type": "number",
         "value": "{global.Zindex.600}"
       }
+    },
+    "box-shadow": {
+      "X": {
+        "sm": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.X.300}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.X.500}"
+          }
+        },
+        "md": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.X.200}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.X.600}"
+          }
+        },
+        "lg": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.X.400}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.X.100}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.X.700}"
+          }
+        }
+      },
+      "Y": {
+        "sm": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.500}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.300}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.500}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          }
+        },
+        "md": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.600}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.200}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.600}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          }
+        },
+        "lg": {
+          "default": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.700}"
+          },
+          "top": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.100}"
+          },
+          "bottom": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.700}"
+          },
+          "left": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          },
+          "right": {
+            "type": "number",
+            "value": "{global.box-shadow.Y.400}"
+          }
+        }
+      },
+      "blur": {
+        "sm": {
+          "type": "number",
+          "value": "{global.box-shadow.blur.100}"
+        },
+        "md": {
+          "type": "number",
+          "value": "{global.box-shadow.blur.200}"
+        },
+        "lg": {
+          "type": "number",
+          "value": "{global.box-shadow.blur.300}"
+        }
+      },
+      "spread": {
+        "sm": {
+          "type": "number",
+          "value": "{global.box-shadow.spread.100}"
+        },
+        "md": {
+          "type": "number",
+          "value": "{global.box-shadow.spread.100}"
+        },
+        "lg": {
+          "type": "number",
+          "value": "{global.box-shadow.spread.100}"
+        }
+      }
     }
   }
 }