merge with master

.changeset/lovely-penguins-rule.md

@@ -0,0 +1,11 @@
+---
+"hpe-design-tokens": minor
+---
+
+- Removed `color.text.xweak`, `color.icon.xweak`, `color.text.brand`, `color.icon.brand`
+- Renamed `enabled` in component tokens to `rest`
+- Removed `checkbox.control.selected.disabled` (use `checkbox.control.disabled.rest`)
+- Removed `radiobutton.control.selected.disabled` (use `radiobutton.control.disabled.rest`)
+- Removed `dataCell.primary.disabled (use `dataCell.disabld.rest`)
+- Updated Anchor token structure from `anchor.[size].default` to `anchor.default.[size]` in alignment with button token structure.
+- Updated component state tokens for all but formField tokens to align with new state combinations.

.changeset/tame-elephants-notice.md

@@ -0,0 +1,12 @@
+---
+'hpe-design-tokens': minor
+---
+
+- Added `formField.input.group.container.error.rest` tokens
+- Removed `formField.input.group.item.status.critical` tokens
+- Removed formField text "error" tokens for complex states, now only support `error.rest`, `error.hover`, `error.focus`.
+- Renamed formField "enabled" tokens to "rest"
+- Renamed formField "status.critical" tokens to "error.rest"
+- Renamed formField "disabled" tokens to "disabled.rest"
+- Renamed formField "readOnly" tokens to "readOnly.rest"
+- Renamed `base.static` tokens to `static`.

design-tokens-manager/src/routes/Scaler/Results.jsx

@@ -112,6 +112,9 @@ export const Results = ({
           <ScaleToolbar
             direction="row-reverse"
             scale={scale}
+            settings={{ base, contentBase, factor, steps, nearest }}
+            contentSizes={tshirtContent}
+            spacingSizes={tshirtSpacing}
             open={open}
             setOpen={setOpen}
           />

design-tokens-manager/src/routes/Scaler/components/ScaleToolbar.jsx

@@ -2,7 +2,24 @@ import { Box, Button } from 'grommet';
 import { Sidebar } from 'grommet-icons';
 import { CopyButton } from '../../../components/CopyButton';
 
-export const ScaleToolbar = ({ scale, open, setOpen, ...rest }) => {
+export const ScaleToolbar = ({
+  scale: scaleProp,
+  settings,
+  contentSizes,
+  spacingSizes,
+  open,
+  setOpen,
+  ...rest
+}) => {
+  const scale = {
+    name: `${settings.base}-${settings.factor}-${settings.nearest}-${settings.steps}`,
+    description: `${settings.base}px based scale at ${settings.factor} factor. Rounded to ${settings.nearest}px grid unit with ${settings.steps} steps`,
+    settings: settings,
+    scale: scaleProp,
+    content: contentSizes,
+    spacing: spacingSizes,
+  };
+
   return (
     <Box gap="xsmall" flex={false} {...rest}>
       <Button

design-tokens/src/formats/commonJs.ts

@@ -9,7 +9,7 @@ export const commonJs: FormatFn = async ({
 }: FormatFnArguments) => {
   const { prefix } = platform;
   const tokens = prefix ? { [prefix]: dictionary.tokens } : dictionary.tokens;
-  //
+
   const output = `${await fileHeader({
     file,
   })}module.exports = ${JSON.stringify(

design-tokens/src/token_export.ts

@@ -205,12 +205,12 @@ export function tokenFilesFromLocalVariables(
         let token: Token;
         // TO DO this is temp way of handling the gradient on the primary button background
         // which is only stored in code but handled as a solid color in Figma
-        if (variable.name === 'button/primary/enabled/background') {
+        if (variable.name === 'button/primary/rest/background') {
           const componentTokens = fs.readFileSync(
             'tokens/component/component.default.json',
           );
           const parsed = JSON.parse(componentTokens.toString());
-          token = parsed.button.primary.enabled.background;
+          token = parsed.button.primary.rest.background;
         } else {
           token = {
             $type: tokenTypeFromVariable(variable),