From fbb693beb06827c250937c9ad2bb46b0ac96bafd Mon Sep 17 00:00:00 2001
From: AlineNap <59806622+AlineNap@users.noreply.github.com>
Date: Thu, 24 Oct 2024 15:47:37 +0200
Subject: [PATCH] feat(design-tokens): add Radio group tokens

---
 .changeset/fifty-lizards-promise.md           |   2 -
 .changeset/fresh-pugs-listen.md               |   7 +
 .changeset/modern-bags-reflect.md             |   2 -
 .../design-tokens/src/imported/$metadata.json |   2 +
 .../src/imported/component/radio-group.json   |  18 ++
 .../src/imported/nl/utrecht-form-label.json   |   6 +-
 .../src/imported/nl/utrecht-radio-button.json | 198 ++++++++++++++++++
 7 files changed, 228 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/fresh-pugs-listen.md
 create mode 100644 proprietary/design-tokens/src/imported/component/radio-group.json
 create mode 100644 proprietary/design-tokens/src/imported/nl/utrecht-radio-button.json

diff --git a/.changeset/fifty-lizards-promise.md b/.changeset/fifty-lizards-promise.md
index 48cc0251f..95de59a2e 100644
--- a/.changeset/fifty-lizards-promise.md
+++ b/.changeset/fifty-lizards-promise.md
@@ -2,7 +2,5 @@
 "@lux-design-system/design-tokens": minor
 ---
 
-In deze commit
-
 - Nieuwe tokens: lux component button - smalle variant
 - Wijziging tokens: line-height en font-size tokens voor secondary en subtle button toegevoegd
diff --git a/.changeset/fresh-pugs-listen.md b/.changeset/fresh-pugs-listen.md
new file mode 100644
index 000000000..565890f25
--- /dev/null
+++ b/.changeset/fresh-pugs-listen.md
@@ -0,0 +1,7 @@
+---
+"@lux-design-system/design-tokens": minor
+---
+
+Nieuwe tokens: Radio group
+Nieuwe tokens: Utrecht Form label
+Nieuwe tokens: Utrecht radio button
diff --git a/.changeset/modern-bags-reflect.md b/.changeset/modern-bags-reflect.md
index f19628a54..35b65b743 100644
--- a/.changeset/modern-bags-reflect.md
+++ b/.changeset/modern-bags-reflect.md
@@ -2,8 +2,6 @@
 "@lux-design-system/design-tokens": minor
 ---
 
-In deze commit
-
 - Nieuwe tokens: utrecht common pointer target
 - Nieuwe tokens: utrecht component form field
 - Nieuwe tokens: utrecht component form field description
diff --git a/proprietary/design-tokens/src/imported/$metadata.json b/proprietary/design-tokens/src/imported/$metadata.json
index c2341e0f5..899c11130 100644
--- a/proprietary/design-tokens/src/imported/$metadata.json
+++ b/proprietary/design-tokens/src/imported/$metadata.json
@@ -30,6 +30,7 @@
     "component/link",
     "component/login link",
     "component/paragraph",
+    "component/radio-group",
     "component/section",
     "nl/utrecht-alert",
     "nl/utrecht-button",
@@ -48,6 +49,7 @@
     "nl/utrecht-paragraph",
     "nl/utrecht-pointer-target",
     "nl/utrecht-pre-heading",
+    "nl/utrecht-radio-button",
     "nl/utrecht-text-input",
     "nl/utrecht-textarea"
   ]
diff --git a/proprietary/design-tokens/src/imported/component/radio-group.json b/proprietary/design-tokens/src/imported/component/radio-group.json
new file mode 100644
index 000000000..4948acfcd
--- /dev/null
+++ b/proprietary/design-tokens/src/imported/component/radio-group.json
@@ -0,0 +1,18 @@
+{
+  "lux": {
+    "radio-group": {
+      "padding-block-start": {
+        "value": "{lux.space.0}",
+        "type": "spacing"
+      },
+      "padding-block-end": {
+        "value": "{lux.space.0}",
+        "type": "spacing"
+      },
+      "row-gap": {
+        "value": "{lux.space.100}",
+        "type": "spacing"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-form-label.json b/proprietary/design-tokens/src/imported/nl/utrecht-form-label.json
index 3417a44b9..a18761f7c 100644
--- a/proprietary/design-tokens/src/imported/nl/utrecht-form-label.json
+++ b/proprietary/design-tokens/src/imported/nl/utrecht-form-label.json
@@ -15,7 +15,7 @@
       },
       "checkbox": {
         "font-weight": {
-          "value": "{lux.font-weight.bold}",
+          "value": "{lux.font-weight.regular}",
           "type": "fontWeights"
         },
         "color": {
@@ -25,7 +25,7 @@
       },
       "checked": {
         "font-weight": {
-          "value": "{lux.font-weight.bold}",
+          "value": "{lux.font-weight.regular}",
           "type": "fontWeights"
         }
       },
@@ -41,7 +41,7 @@
           "type": "color"
         },
         "font-weight": {
-          "value": "{lux.font-weight.bold}",
+          "value": "{lux.font-weight.regular}",
           "type": "fontWeights"
         }
       }
diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-radio-button.json b/proprietary/design-tokens/src/imported/nl/utrecht-radio-button.json
new file mode 100644
index 000000000..514a2a988
--- /dev/null
+++ b/proprietary/design-tokens/src/imported/nl/utrecht-radio-button.json
@@ -0,0 +1,198 @@
+{
+  "utrecht": {
+    "radio-button": {
+      "border-width": {
+        "value": "0.094rem",
+        "type": "borderWidth"
+      },
+      "size": {
+        "value": "1.125rem",
+        "type": "sizing"
+      },
+      "icon": {
+        "size": {
+          "value": "0.625rem",
+          "type": "sizing"
+        }
+      },
+      "background-color": {
+        "value": "{lux.color.background.default}",
+        "type": "color"
+      },
+      "border-color": {
+        "value": "{lux.color.foreground.default}",
+        "type": "color"
+      },
+      "color": {
+        "value": "{utrecht.radio-button.border-color}",
+        "type": "color"
+      },
+      "invalid": {
+        "background-color": {
+          "value": "{lux.alert.error.background-color}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{lux.color.feedback.error.default}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{utrecht.radio-button.invalid.border-color}",
+          "type": "color"
+        },
+        "border-width": {
+          "value": "{utrecht.radio-button.border-width}",
+          "type": "borderWidth"
+        }
+      },
+      "hover": {
+        "background-color": {
+          "value": "{lux.color.background.default}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{lux.color.foreground.default}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{utrecht.radio-button.hover.border-color}",
+          "type": "color"
+        },
+        "border-width": {
+          "value": "0.125rem",
+          "type": "borderWidth"
+        }
+      },
+      "active": {
+        "background-color": {
+          "value": "{lux.color.background.default}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{lux.color.foreground.default}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{utrecht.radio-button.active.border-color}",
+          "type": "color"
+        },
+        "border-width": {
+          "value": "{utrecht.radio-button.border-width}",
+          "type": "borderWidth"
+        }
+      },
+      "disabled": {
+        "background-color": {
+          "value": "{lux.color.canvas}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{lux.color.border.subdued}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{lux.color.border.subdued}",
+          "type": "color"
+        },
+        "border-width": {
+          "value": "{utrecht.radio-button.border-width}",
+          "type": "borderWidth"
+        }
+      },
+      "focus": {
+        "background-color": {
+          "value": "{utrecht.radio-button.background-color}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{utrecht.radio-button.border-color}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{utrecht.radio-button.focus.border-color}",
+          "type": "color"
+        },
+        "border-width": {
+          "value": "0.125rem",
+          "type": "borderWidth"
+        }
+      },
+      "checked": {
+        "background-color": {
+          "value": "{lux.color.background.default}",
+          "type": "color"
+        },
+        "border-color": {
+          "value": "{lux.color.foreground.default}",
+          "type": "color"
+        },
+        "color": {
+          "value": "{lux.color.foreground.default}",
+          "type": "color"
+        },
+        "hover": {
+          "background-color": {
+            "value": "{lux.color.background.default}",
+            "type": "color"
+          },
+          "border-color": {
+            "value": "{lux.color.foreground.default}",
+            "type": "color"
+          },
+          "color": {
+            "value": "{lux.color.foreground.default}",
+            "type": "color"
+          },
+          "border-width": {
+            "value": "0.125rem",
+            "type": "borderWidth"
+          }
+        },
+        "active": {
+          "background-color": {
+            "value": "{lux.color.background.default}",
+            "type": "color"
+          },
+          "border-color": {
+            "value": "{lux.color.foreground.default}",
+            "type": "color"
+          },
+          "color": {
+            "value": "{lux.color.foreground.default}",
+            "type": "color"
+          },
+          "border-width": {
+            "value": "{utrecht.radio-button.border-width}",
+            "type": "borderWidth"
+          }
+        },
+        "focus": {
+          "background-color": {
+            "value": "{utrecht.radio-button.checked.background-color}",
+            "type": "color"
+          },
+          "border-color": {
+            "value": "{utrecht.radio-button.checked.border-color}",
+            "type": "color"
+          },
+          "color": {
+            "value": "{utrecht.radio-button.checked.color}",
+            "type": "color"
+          },
+          "border-width": {
+            "value": "0.125rem",
+            "type": "borderWidth"
+          }
+        },
+        "border-width": {
+          "value": "{utrecht.radio-button.border-width}",
+          "type": "borderWidth"
+        }
+      },
+      "margin-inline-end": {
+        "value": "{lux.space.100}",
+        "type": "spacing"
+      }
+    }
+  }
+}
\ No newline at end of file