Adding zod validation

[lukasoppermann]

Summary

List of notable changes:

What should reviewers focus on?

Steps to test:

[changeset-bot]

⚠️ No Changeset found

Latest commit: c54252f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

Variables changed

No variables changed

[github-actions]

Design Token Diff

/css/functional/size/border.css

+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/size/border.css	2023-07-18 12:58:06.227264191 +0000
@@ -5,10 +5,10 @@
 --borderWidth-thin: max(1px, 0.0625rem);
 --borderWidth-thick: max(2px, 0.125rem);
 --borderWidth-thicker: max(4px, 0.25rem);
-  --borderRadius-small: 3px;
-  --borderRadius-medium: 6px;
-  --borderRadius-large: 12px;
-  --borderRadius-full: 9999px;
+  --borderRadius-small: 0.1875rem;
+  --borderRadius-medium: 0.375rem;
+  --borderRadius-large: 0.75rem;
+  --borderRadius-full: 624.9375rem;
 --outline-focus-offset: -0.125rem;
 --outline-focus-width: 0.125rem;
}

/css/functional/size/size.css

+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/size/size.css	2023-07-18 12:58:06.363264714 +0000
@@ -3,33 +3,33 @@
 --control-minTarget-coarse: 2.75rem;
 --control-xsmall-size: 1.5rem;
 --control-xsmall-lineBoxHeight: 1.25rem;
-  --control-xsmall-paddingBlock: calc((1.5rem - 1.25rem) / 2);
+  --control-xsmall-paddingBlock: 0.125rem;
 --control-xsmall-paddingInline-condensed: 0.25rem;
 --control-xsmall-paddingInline-normal: 0.5rem;
 --control-xsmall-paddingInline-spacious: 0.75rem;
 --control-xsmall-gap: 0.25rem;
 --control-small-size: 1.75rem;
 --control-small-lineBoxHeight: 1.25rem;
-  --control-small-paddingBlock: calc((1.75rem - 1.25rem) / 2);
+  --control-small-paddingBlock: 0.25rem;
 --control-small-paddingInline-condensed: 0.5rem;
 --control-small-paddingInline-normal: 0.75rem;
 --control-small-gap: 0.25rem;
 --control-medium-size: 2rem;
 --control-medium-lineBoxHeight: 1.25rem;
-  --control-medium-paddingBlock: calc((2rem - 1.25rem) / 2);
+  --control-medium-paddingBlock: 0.375rem;
 --control-medium-paddingInline-condensed: 0.5rem;
 --control-medium-paddingInline-normal: 0.75rem;
 --control-medium-paddingInline-spacious: 1rem;
 --control-medium-gap: 0.5rem;
 --control-large-size: 2.5rem;
 --control-large-lineBoxHeight: 1.25rem;
-  --control-large-paddingBlock: calc((2.5rem - 1.25rem) / 2);
+  --control-large-paddingBlock: 0.625rem;
 --control-large-paddingInline-normal: 0.75rem;
 --control-large-paddingInline-spacious: 1rem;
 --control-large-gap: 0.5rem;
 --control-xlarge-size: 3rem;
 --control-xlarge-lineBoxHeight: 1.25rem;
-  --control-xlarge-paddingBlock: calc((3rem - 1.25rem) / 2);
+  --control-xlarge-paddingBlock: 0.875rem;
 --control-xlarge-paddingInline-normal: 0.75rem;
 --control-xlarge-paddingInline-spacious: 1rem;
 --control-xlarge-gap: 0.5rem;

/css/functional/typography/typography.css

+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/typography/typography.css	2023-07-18 12:58:06.495265221 +0000
@@ -1,24 +1,24 @@
:root {
 --text-codeInline-size: 0.9285em;
-  --text-codeBlock-lineHeight: calc(20/13);
+  --text-codeBlock-lineHeight: 1.5385;
 --text-codeBlock-size: 0.8125rem;
-  --text-caption-lineHeight: calc(16/12);
+  --text-caption-lineHeight: 1.3333;
 --text-caption-size: 0.75rem;
-  --text-body-lineHeight-small: calc(20/12);
-  --text-body-lineHeight-medium: calc(20/14);
-  --text-body-lineHeight-large: calc(24/16);
+  --text-body-lineHeight-small: 1.6666;
+  --text-body-lineHeight-medium: 1.4285;
+  --text-body-lineHeight-large: 1.5;
 --text-body-size-small: 0.75rem;
 --text-body-size-medium: 0.875rem;
 --text-body-size-large: 1rem;
-  --text-subtitle-lineHeight: calc(32/20);
+  --text-subtitle-lineHeight: 1.6;
 --text-subtitle-size: 1.25rem;
-  --text-title-lineHeight-small: calc(24/16);
-  --text-title-lineHeight-medium: calc(32/20);
-  --text-title-lineHeight-large: calc(48/32);
+  --text-title-lineHeight-small: 1.5;
+  --text-title-lineHeight-medium: 1.6;
+  --text-title-lineHeight-large: 1.5;
 --text-title-size-small: 1rem;
 --text-title-size-medium: 1.25rem;
 --text-title-size-large: 2rem;
-  --text-display-lineHeight: calc(56/40);
+  --text-display-lineHeight: 1.4;
 --text-display-size: 2.5rem;
 --text-display-lineBoxHeight: 3.5rem;
 --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;

[langermank]

Just a few suggestions from reviewing the visual regression snapshots. I am not smart enough to review all the cool Zod logic so you may want to find someone to review! 😄

[langermank]

Slight shift in this one in the snapshot test, but thats probably because calc may resolve differently.. but it depends on the browser so they should be the same? Anyhow its so tiny I'm not sure we need to worry about it.

[lukasoppermann]

But why, this is exactly 1.6

[langermank]

I don't know why, and the screenshots are taken with linux so I can't really test 😛 its so tiny, do you think we should just accept the small shift that might happen?

[lukasoppermann]

The snaphots are failing because I transformed some calc expressions into pixel or float values.