@primer/react-brand 0.4.0 → 0.5.0-rc.04a988d
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +284 -0
- package/lib/Accordion/Accordion.d.ts +4 -4
- package/lib/Button/Button.d.ts +2 -0
- package/lib/FAQ/FAQ.d.ts +4 -4
- package/lib/Heading/Heading.d.ts +1 -1
- package/lib/InlineLink/InlineLink.d.ts +1 -1
- package/lib/River/River.d.ts +3 -3
- package/lib/Stack/Stack.d.ts +112 -0
- package/lib/Stack/Stack.visual.spec.d.ts +1 -0
- package/lib/Stack/index.d.ts +1 -0
- package/lib/SubdomainNavBar/NavigationVisbilityObserver.d.ts +6 -0
- package/lib/SubdomainNavBar/SubdomainNavBar.d.ts +63 -0
- package/lib/SubdomainNavBar/SubdomainNavBar.visual.spec.d.ts +1 -0
- package/lib/SubdomainNavBar/index.d.ts +1 -0
- package/lib/SubdomainNavBar/useVisibilityObserver.d.ts +5 -0
- package/lib/Testimonial/Testimonial.d.ts +72 -0
- package/lib/Testimonial/Testimonial.visual.spec.d.ts +1 -0
- package/lib/Testimonial/index.d.ts +1 -0
- package/lib/css/main.css +1066 -36
- package/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/base/colors/color-scales.css +1 -1
- package/lib/design-tokens/css/tokens/base/size/size.css +1 -1
- package/lib/design-tokens/css/tokens/base/typography/typography.css +1 -1
- package/lib/design-tokens/css/tokens/functional/colors/global-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/colors/global.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/control/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/hero/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/river/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes.css +27 -0
- package/lib/design-tokens/css/tokens/functional/size/border.css +4 -4
- package/lib/design-tokens/css/tokens/functional/size/breakpoints.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-coarse.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-fine.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size.css +7 -7
- package/lib/design-tokens/css/tokens/functional/typography/typography-responsive.css +15 -15
- package/lib/design-tokens/css/tokens/functional/typography/typography.css +11 -11
- package/lib/design-tokens/js/module/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/border.js +15 -15
- package/lib/design-tokens/js/module/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size.js +13 -13
- package/lib/design-tokens/js/module/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/js/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/border.js +5 -5
- package/lib/design-tokens/js/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size.js +7 -7
- package/lib/design-tokens/js/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/color-scales.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/control/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/border.d.ts +5 -5
- package/lib/design-tokens/ts/tokens/functional/size/border.js +5 -5
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.js +7 -7
- package/lib/design-tokens/ts/tokens/functional/size/viewport.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.js +1 -1
- package/lib/forms/Checkbox/Checkbox.d.ts +1 -1
- package/lib/forms/Select/Select.d.ts +1 -1
- package/lib/forms/TextInput/TextInput.d.ts +10 -2
- package/lib/hooks/useKeyboardEscape.d.ts +1 -0
- package/lib/hooks/useOnClickOutside.d.ts +1 -0
- package/lib/index.d.ts +3 -0
- package/lib/index.js +1 -1
- package/package.json +3 -3
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const BrandBorderInsetThin = "inset 0 0 0 max(1px, 0.0625rem)";
|
|
7
|
-
export const
|
|
8
|
-
export const
|
|
7
|
+
export const BrandBorderInsetThick = "inset 0 0 0 max(2px, 0.125rem)";
|
|
8
|
+
export const BrandBorderInsetThicker = "inset 0 0 0 max(4px, 0.25rem)";
|
|
9
9
|
export const BrandBorderWidthThin = "max(1px, 0.0625rem)";
|
|
10
|
-
export const
|
|
11
|
-
export const
|
|
10
|
+
export const BrandBorderWidthThick = "max(2px, 0.125rem)";
|
|
11
|
+
export const BrandBorderWidthThicker = "max(4px, 0.25rem)";
|
|
12
12
|
export const BrandBorderRadiusSmall = "0.1875rem";
|
|
13
13
|
export const BrandBorderRadiusMedium = "0.375rem";
|
|
14
14
|
export const BrandBorderRadiusLarge = "0.75rem";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const BrandControlMinTargetFine = "1rem";
|
|
@@ -35,12 +35,12 @@ export const BrandControlXlargePaddingBlock = "calc((3rem - 1.25rem) / 2)";
|
|
|
35
35
|
export const BrandControlXlargePaddingInlineNormal = "0.75rem";
|
|
36
36
|
export const BrandControlXlargePaddingInlineSpacious = "1rem";
|
|
37
37
|
export const BrandControlXlargeGap = "0.5rem";
|
|
38
|
-
export const BrandStackPaddingCondensed = "
|
|
39
|
-
export const BrandStackPaddingNormal = "
|
|
40
|
-
export const BrandStackPaddingSpacious = "
|
|
41
|
-
export const BrandStackGapCondensed = "
|
|
42
|
-
export const BrandStackGapNormal = "
|
|
43
|
-
export const BrandStackGapSpacious = "
|
|
38
|
+
export const BrandStackPaddingCondensed = "1rem";
|
|
39
|
+
export const BrandStackPaddingNormal = "1.5rem";
|
|
40
|
+
export const BrandStackPaddingSpacious = "3rem";
|
|
41
|
+
export const BrandStackGapCondensed = "1rem";
|
|
42
|
+
export const BrandStackGapNormal = "1.5rem";
|
|
43
|
+
export const BrandStackGapSpacious = "3rem";
|
|
44
44
|
export const BrandControlStackSmallGapCondensed = "0.5rem";
|
|
45
45
|
export const BrandControlStackSmallGapSpacious = "1rem";
|
|
46
46
|
export const BrandControlStackMediumGapCondensed = "0.5rem";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const BrandFontStackSystem = "-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'";
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
declare const tokens: {
|
|
7
7
|
"brand": {
|
|
8
8
|
"borderInset": {
|
|
9
9
|
"thin": string,
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"thick": string,
|
|
11
|
+
"thicker": string
|
|
12
12
|
},
|
|
13
13
|
"borderWidth": {
|
|
14
14
|
"thin": string,
|
|
15
|
-
"
|
|
16
|
-
"
|
|
15
|
+
"thick": string,
|
|
16
|
+
"thicker": string
|
|
17
17
|
},
|
|
18
18
|
"borderRadius": {
|
|
19
19
|
"small": string,
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
module.exports = {
|
|
7
7
|
"brand": {
|
|
8
8
|
"borderInset": {
|
|
9
9
|
"thin": "inset 0 0 0 max(1px, 0.0625rem)",
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"thick": "inset 0 0 0 max(2px, 0.125rem)",
|
|
11
|
+
"thicker": "inset 0 0 0 max(4px, 0.25rem)"
|
|
12
12
|
},
|
|
13
13
|
"borderWidth": {
|
|
14
14
|
"thin": "max(1px, 0.0625rem)",
|
|
15
|
-
"
|
|
16
|
-
"
|
|
15
|
+
"thick": "max(2px, 0.125rem)",
|
|
16
|
+
"thicker": "max(4px, 0.25rem)"
|
|
17
17
|
},
|
|
18
18
|
"borderRadius": {
|
|
19
19
|
"small": "0.1875rem",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Thu,
|
|
3
|
+
* Generated on Thu, 29 Sep 2022 14:34:36 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
module.exports = {
|
|
@@ -63,14 +63,14 @@ module.exports = {
|
|
|
63
63
|
},
|
|
64
64
|
"stack": {
|
|
65
65
|
"padding": {
|
|
66
|
-
"condensed": "
|
|
67
|
-
"normal": "
|
|
68
|
-
"spacious": "
|
|
66
|
+
"condensed": "1rem",
|
|
67
|
+
"normal": "1.5rem",
|
|
68
|
+
"spacious": "3rem"
|
|
69
69
|
},
|
|
70
70
|
"gap": {
|
|
71
|
-
"condensed": "
|
|
72
|
-
"normal": "
|
|
73
|
-
"spacious": "
|
|
71
|
+
"condensed": "1rem",
|
|
72
|
+
"normal": "1.5rem",
|
|
73
|
+
"spacious": "3rem"
|
|
74
74
|
}
|
|
75
75
|
},
|
|
76
76
|
"controlStack": {
|