@primer/primitives 7.11.2-rc.eb0be47 → 7.11.2-rc.ef1e802

package/tokens-next-private/scss/base/color/light-tritanopia.scss

@@ -0,0 +1,102 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:28 GMT
+ */
+
+@mixin primer-colors-light-tritanopia {
+  & {
+    --base-color-black: #1f2328; /* Avoid using scales, use other functional tokens instead */
+    --base-color-transparent: #ffffff00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-white: #ffffff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-0: #f6f8fa; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-1: #eaeef2; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-2: #d0d7de; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-3: #afb8c1; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-4: #8c959f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-5: #6e7781; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-6: #57606a; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-7: #424a53; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-8: #32383f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-9: #24292f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-0: #ddf4ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-1: #b6e3ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-2: #80ccff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-3: #54aeff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-4: #218bff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-5: #0969da; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-6: #0550ae; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-7: #033d8b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-8: #0a3069; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-9: #002155; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-0: #ddf4ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-1: #b6e3ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-2: #80ccff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-3: #54aeff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-4: #218bff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-5: #0969da; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-6: #0550ae; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-7: #033d8b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-8: #0a3069; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-9: #002155; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-0: #fff8c5; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-1: #fae17d; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-2: #eac54f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-3: #d4a72c; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-4: #bf8700; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-5: #9a6700; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-6: #7d4e00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-7: #633c01; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-8: #4d2d00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-9: #3b2300; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-0: #ffebe9; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-1: #ffcecb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-2: #ffaba8; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-3: #ff8182; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-4: #fa4549; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-5: #cf222e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-6: #a40e26; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-7: #82071e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-8: #660018; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-9: #4c0014; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-0: #ffebe9; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-1: #ffcecb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-2: #ffaba8; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-3: #ff8182; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-4: #fa4549; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-5: #cf222e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-6: #a40e26; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-7: #82071e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-8: #660018; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-9: #4c0014; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-0: #fbefff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-1: #ecd8ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-2: #d8b9ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-3: #c297ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-4: #a475f9; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-5: #8250df; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-6: #6639ba; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-7: #512a97; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-8: #3e1f79; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-9: #2e1461; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-0: #ffeff7; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-1: #ffd3eb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-2: #ffadda; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-3: #ff80c8; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-4: #e85aad; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-5: #bf3989; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-6: #99286e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-7: #772057; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-8: #611347; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-9: #4d0336; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-0: #fff0eb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-1: #ffd6cc; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-2: #ffb4a1; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-3: #fd8c73; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-4: #ec6547; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-5: #c4432b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-6: #9e2f1c; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-7: #801f0f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-8: #691105; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-9: #510901; /* Avoid using scales, use other functional tokens instead */
+  }
+}

package/tokens-next-private/scss/base/color/light.scss

@@ -0,0 +1,102 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:27 GMT
+ */
+
+@mixin primer-colors-light {
+  & {
+    --base-color-black: #1f2328; /* Avoid using scales, use other functional tokens instead */
+    --base-color-transparent: #ffffff00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-white: #ffffff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-0: #f6f8fa; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-1: #eaeef2; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-2: #d0d7de; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-3: #afb8c1; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-4: #8c959f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-5: #6e7781; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-6: #57606a; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-7: #424a53; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-8: #32383f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-gray-9: #24292f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-0: #ddf4ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-1: #b6e3ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-2: #80ccff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-3: #54aeff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-4: #218bff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-5: #0969da; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-6: #0550ae; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-7: #033d8b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-8: #0a3069; /* Avoid using scales, use other functional tokens instead */
+    --base-color-blue-9: #002155; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-0: #dafbe1; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-1: #aceebb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-2: #6fdd8b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-3: #4ac26b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-4: #2da44e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-5: #1a7f37; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-6: #116329; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-7: #044f1e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-8: #003d16; /* Avoid using scales, use other functional tokens instead */
+    --base-color-green-9: #002d11; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-0: #fff8c5; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-1: #fae17d; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-2: #eac54f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-3: #d4a72c; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-4: #bf8700; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-5: #9a6700; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-6: #7d4e00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-7: #633c01; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-8: #4d2d00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-yellow-9: #3b2300; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-0: #fff1e5; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-1: #ffd8b5; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-2: #ffb77c; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-3: #fb8f44; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-4: #e16f24; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-5: #bc4c00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-6: #953800; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-7: #762c00; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-8: #5c2200; /* Avoid using scales, use other functional tokens instead */
+    --base-color-orange-9: #471700; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-0: #ffebe9; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-1: #ffcecb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-2: #ffaba8; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-3: #ff8182; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-4: #fa4549; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-5: #cf222e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-6: #a40e26; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-7: #82071e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-8: #660018; /* Avoid using scales, use other functional tokens instead */
+    --base-color-red-9: #4c0014; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-0: #fbefff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-1: #ecd8ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-2: #d8b9ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-3: #c297ff; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-4: #a475f9; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-5: #8250df; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-6: #6639ba; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-7: #512a97; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-8: #3e1f79; /* Avoid using scales, use other functional tokens instead */
+    --base-color-purple-9: #2e1461; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-0: #ffeff7; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-1: #ffd3eb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-2: #ffadda; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-3: #ff80c8; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-4: #e85aad; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-5: #bf3989; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-6: #99286e; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-7: #772057; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-8: #611347; /* Avoid using scales, use other functional tokens instead */
+    --base-color-pink-9: #4d0336; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-0: #fff0eb; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-1: #ffd6cc; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-2: #ffb4a1; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-3: #fd8c73; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-4: #ec6547; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-5: #c4432b; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-6: #9e2f1c; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-7: #801f0f; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-8: #691105; /* Avoid using scales, use other functional tokens instead */
+    --base-color-coral-9: #510901; /* Avoid using scales, use other functional tokens instead */
+  }
+}

package/tokens-next-private/scss/base/size/size.scss

@@ -0,0 +1,26 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-size {
+  & {
+    --base-size-4: 0.25rem;
+    --base-size-8: 0.5rem;
+    --base-size-12: 0.75rem;
+    --base-size-16: 1rem;
+    --base-size-20: 1.25rem;
+    --base-size-24: 1.5rem;
+    --base-size-28: 1.75rem;
+    --base-size-32: 2rem;
+    --base-size-36: 2.25rem;
+    --base-size-40: 2.5rem;
+    --base-size-44: 2.75rem;
+    --base-size-48: 3rem;
+    --base-size-64: 4rem;
+    --base-size-80: 5rem;
+    --base-size-96: 6rem;
+    --base-size-112: 7rem;
+    --base-size-128: 8rem;
+  }
+}

package/tokens-next-private/scss/base/typography/typography.scss

@@ -0,0 +1,13 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-typography {
+  & {
+    --base-text-weight-light: 300;
+    --base-text-weight-normal: 400;
+    --base-text-weight-medium: 500;
+    --base-text-weight-semibold: 600;
+  }
+}

package/tokens-next-private/scss/functional/size/border.scss

@@ -0,0 +1,20 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:32 GMT
+ */
+
+@mixin primer-colors-border {
+  & {
+    --borderInset-thin: inset 0 0 0 max(1px, 0.0625rem);
+    --borderInset-thick: inset 0 0 0 max(2px, 0.125rem);
+    --borderInset-thicker: inset 0 0 0 max(4px, 0.25rem);
+    --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: 100vh;
+    --outline-focus-offset: 0.0625rem;
+  }
+}

package/tokens-next-private/scss/functional/size/breakpoints.scss

@@ -0,0 +1,15 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:32 GMT
+ */
+
+@mixin primer-colors-breakpoints {
+  & {
+    --breakpoint-xsmall: 20rem;
+    --breakpoint-small: 34rem;
+    --breakpoint-medium: 48rem;
+    --breakpoint-large: 63.25rem;
+    --breakpoint-xlarge: 80rem;
+    --breakpoint-xxlarge: 90rem;
+  }
+}

package/tokens-next-private/scss/functional/size/size-coarse.scss

@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-size-coarse {
+  & {
+    --control-minTarget-auto: 2.75rem;
+    --controlStack-small-gap-auto: 1rem;
+    --controlStack-medium-gap-auto: 0.75rem;
+  }
+}

package/tokens-next-private/scss/functional/size/size-fine.scss

@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-size-fine {
+  & {
+    --control-minTarget-auto: 1rem;
+    --controlStack-small-gap-auto: 0.5rem;
+    --controlStack-medium-gap-auto: 0.5rem;
+  }
+}

package/tokens-next-private/scss/functional/size/size.scss

@@ -0,0 +1,56 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-size {
+  & {
+    --control-minTarget-fine: 1rem;
+    --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-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-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-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-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-paddingInline-normal: 0.75rem;
+    --control-xlarge-paddingInline-spacious: 1rem;
+    --control-xlarge-gap: 0.5rem;
+    --controlStack-small-gap-condensed: 0.5rem;
+    --controlStack-small-gap-spacious: 1rem;
+    --controlStack-medium-gap-condensed: 0.5rem;
+    --controlStack-medium-gap-spacious: 0.75rem;
+    --controlStack-large-gap-auto: 0.5rem;
+    --controlStack-large-gap-condensed: 0.5rem;
+    --controlStack-large-gap-spacious: 0.75rem;
+    --stack-padding-condensed: 0.5rem;
+    --stack-padding-normal: 1rem;
+    --stack-padding-spacious: 1.5rem;
+    --stack-gap-condensed: 0.5rem;
+    --stack-gap-normal: 1rem;
+    --stack-gap-spacious: 1.5rem;
+  }
+}

package/tokens-next-private/scss/functional/size/viewport.scss

@@ -0,0 +1,24 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 29 Mar 2023 08:34:33 GMT
+ */
+
+@mixin primer-colors-viewport {
+  & {
+    --viewportRange-narrow: (max-width: calc(48rem - 0.02px));
+    --viewportRange-narrowLandscape: (
+      max-width: calc(63.25rem - 0.02px) and
+        (
+          max-height: calc(34rem - 0.02px),
+        )
+        and
+        (
+          orientation: landscape,
+        )
+    );
+    --viewportRange-regular: (min-width: 48rem);
+    --viewportRange-wide: (min-width: 90rem);
+    --viewportRange-portrait: (orientation: portrait);
+    --viewportRange-landscape: (orientation: landscape);
+  }
+}